@charset "UTF-8";
/* ----------------------------------------
    Disclaimer
---------------------------------------- */
/*!
 * Made by Vruchtvlees © 2007-2025
 *
 * Vruchtvlees: Digital, Strategy & Design realises
 * potential of ambitious brands. With enthusiasm and
 * driven by design, we research the underlying problem
 * and explore different solutions. That results into
 * Dutch Digital Design: internationally renowned
 * (digital) solutions that people love and help
 * brands grow.
 *
 * @site        https://www.vruchtvlees.com/
 * @facebook    https://www.facebook.com/vruchtvlees/
 * @instagram   https://www.instagram.com/vruchtvlees/
 * @twitter     https://twitter.com/vruchtvlees
 */
/*! Latest update to file: 2-12-2025 */
/* ----------------------------------------
    Easter Base
---------------------------------------- */
/* ----------------------------------------
    Easter Core
---------------------------------------- */
.easter {
  position: absolute;
  opacity: 0;
  transition: opacity 0.25s ease; }
  .easter.is-active {
    opacity: 1; }

/* ----------------------------------------
    Easter
---------------------------------------- */
.easter__fruits {
  position: absolute;
  opacity: 0; }

.easter__loader {
  width: 32px;
  height: 32px;
  position: relative;
  animation: spin 1s linear infinite; }

/* ----------------------------------------
    Functions
---------------------------------------- */
/* ----------------------------------------
    Casting to Boolean
---------------------------------------- */
/**
 * This function will return a
 * boolean based on given value.
 *
 * @author          Hugo Giraudel
 * @link            https://github.com/HugoGiraudel
 *
 * @param value     { boolean/string/list/map }
 * @returns         { boolean }
 */
/* ----------------------------------------
    Variable Exists
---------------------------------------- */
/**
 * This function will check if the value
 * is defined within the project.
 *
 * @param value     { parameter }
 * @returns         { boolean }
 */
/* ----------------------------------------
    Number
---------------------------------------- */
/**
 * This function will check if the value
 * is a number.
 *
 * @author          Hugo Giraudel
 * @link            https://github.com/HugoGiraudel
 *
 * @param value     { number }
 * @returns         { boolean }
 */
/* ----------------------------------------
    Number
---------------------------------------- */
/**
 * This function will check if the value
 * is a pixel value. This function is based
 * on a
 *
 * @param value     { number }
 * @returns         { boolean }
 */
/* ----------------------------------------
    Global
---------------------------------------- */
/**
 * This function will check if a given value
 * is declared within the global scope.
 *
 * @param value     { paramater }
 * @returns         { boolean }
 */
/* ----------------------------------------
    Strip Unit
---------------------------------------- */
/**
 * This function will check if a given value
 * is declared within the global scope.
 *
 * @param value     { value }
 * @returns         { number }
 */
/* ----------------------------------------
    First Value
---------------------------------------- */
/**
 * This function will return the first
 * value in a list or a map
 *
 * Use map-get to retrieve a specific value
 * associated with the key given.
 *
 * @param value     { list/map }
 * @returns         { string } first value of map
 */
/* ----------------------------------------
    Last Value
---------------------------------------- */
/**
 * This function will return the last
 * value in a list or a map
 *
 * Use map-get to retrieve a specific value
 * associated with the key given.
 *
 * @param value     { list/map }
 * @returns         { string } last value of map
 */
/* ----------------------------------------
    Random Select
---------------------------------------- */
/**
 * This function will return a random value
 * from a list or map with related values.
 *
 * This function is a joke!
 *
 * @param value     { list/map }
 * @returns         { string } last value of map
 */
/* ----------------------------------------
    Color Function
---------------------------------------- */
/**
 * This function will return a color
 * from $global-colors map in config/color.
 *
 * @param key       { value }
 * @returns         { color }
 *
 * EXAMPLE
 *
 * .demo-class {
 *    background: color('blue');
 * }
 */
/* ----------------------------------------
    Color Function
---------------------------------------- */
/**
 * This function will return a color
 * from $global-branding map in config/color.
 *
 * @param key       { value }
 * @returns         { color }
 *
 * EXAMPLE
 *
 * .demo-class {
 *    background: branding(primary, dark);
 * }
 */
/* ----------------------------------------
    Color Level Function
---------------------------------------- */
/**
 * This function will return a color based
 * on a level from 1 till 10.
 *
 * @param key       { value }
 * @param level     { number } from 1 to 10
 * @returns         { color }
 *
 * EXAMPLE
 *
 * .demo-class {
 *    background: color-level('blue', 5);
 * }
 */
/* ----------------------------------------
    Contains Light
---------------------------------------- */
/**
 * This function will return a boolean
 * for a light color within the brand
 * colors map.
 *
 * @param colors    { map }
 * @returns         { boolean/color } default return color
 */
/* ----------------------------------------
    Contains Dark
---------------------------------------- */
/**
 * This function will return a boolean
 * for a dark color within the brand
 * colors map.
 *
 * @param colors    { map }
 * @returns         { boolean/color } default return color
 */
/* ----------------------------------------
    Contrast
---------------------------------------- */
/**
 * This function will return a contract color
 *
 * @param colors    { color }
 * @returns         { color } default return color
 */
/* ----------------------------------------
    Calculate Size
---------------------------------------- */
/**
 * This function calculates a em value based
 * on the number of pixels added as $size.
 * Function will check for a pixel value.
 *
 * @param size     { number } in px or unitless
 * @param return   { size } in em value
 */
/* ----------------------------------------
    Font Size
---------------------------------------- */
/**
 * This is a additional function that doesn't
 * have to be included an can therefore be
 * used inside maps. For cleaner code!
 *
 * @param size     { number } in px or unitless number
 * @param return   { size } in em value
 */
/* ----------------------------------------
    Font Merge
---------------------------------------- */
/**
 * This is a additional function that calls
 * the map-blend function for cleaner syntax.
 *
 * @param map1      { map }
 * @param map1      { map }
 * @returns         { map } merged map1 and map2
 */
/* ----------------------------------------
    Media Query
---------------------------------------- */
/**
 * This helper function will format a given
 * breakpoint (based on the config) to a
 * Bourbon Neat media value.
 *
 * @param breakpoint  { string }
 * @param type        { string }
 * @returns           { string }
 */
/* ----------------------------------------
    Gutter
---------------------------------------- */
/**
 * This function will retrieve a a given
 * gutter of a breakpoint map.
 *
 * @param breakpoint  { map }
 * @param type        { string }
 * @returns           { string }
 */
/* ----------------------------------------
     List Casting
---------------------------------------- */
/**
 * This function will return a list of
 * given values.
 *
 * @author          Hugo Giraudel
 * @link            https://github.com/HugoGiraudel
 *
 * @param args      { string/list/map }
 * @returns         { list }
 */
/* ----------------------------------------
    List Convert Pair
---------------------------------------- */
/**
 * This function will accept a map with
 * key value pairs and output a proper
 * CSS property value pair
 *
 * @param map       { list }
 * @returns         { string }
 */
/* ----------------------------------------
     List Empty
---------------------------------------- */
/**
 * This function will check if a list
 * is empty
 *
 * @param list      { list }
 * @returns         { boolean }
 */
/* ----------------------------------------
    List Contains
---------------------------------------- */
/**
 * This function will check if a list
 * contains a specific value.
 *
 * @param list      { list }
 * @param value     { string }
 * @returns         { boolean }
 */
/* ----------------------------------------
     Map Empty
---------------------------------------- */
/**
 * This function will check if a list
 * is empty.
 *
 * @param map       { map }
 * @returns         { boolean }
 */
/* ----------------------------------------
    Map Add Pair
---------------------------------------- */
/**
 * This function will accept a key value
 * pair to be added to a existing map.
 *
 * @param map       { map }
 * @param new       { map } value pairs
 * @returns         { map }
 */
/* ----------------------------------------
    Map Return Pair
---------------------------------------- */
/**
 * This function will return a list of
 * a key value pair based on a given key
 * within a map.
 *
 * @param map       { map }
 * @param key       { string }
 * @returns         { pair }
 */
/* ----------------------------------------
    Map Collection
---------------------------------------- */
/**
 * This function will return a collection
 * of given maps as one major map!
 *
 * @param maps      { map }
 * @returns         { map }
 */
/* ----------------------------------------
    Map Fetch
---------------------------------------- */
/**
 * This function will take several keys
 * to find a specific value contained
 * within a multidimensional map.
 *
 * @param maps      { map }
 * @param keys      { string }
 * @returns         { map }
 */
/* ----------------------------------------
     Map Blend
---------------------------------------- */
/**
 * This function will recursively merge two
 * maps for global and local scope flexibility.
 * So you can extend or change some of the
 * global values stored within a map.
 *
 * @author          Zsolt Pentz
 * @link            https://github.com/pentzzsolt
 *
 * @param map1      { map } global map
 * @param map1      { map } local map
 * @returns         { map } combined map
 */
/* ----------------------------------------
     Map Reverse
---------------------------------------- */
/**
 * This function will reverse the order of
 * a given map en output the new map
 *
 * @author          Sean McEmerson
 * @link            https://github.com/seanislegend
 *
 * @param map       { map }
 * @returns         { map } reversed map
 */
/* ----------------------------------------
     String Casting
---------------------------------------- */
/**
 * This function will return a string
 * of a given value.
 *
 * @author          Hugo Giraudel
 * @link            https://github.com/HugoGiraudel
 *
 * @param value     { list/map }
 */
/* ----------------------------------------
    String Contains
---------------------------------------- */
/**
 * This function will find if a specific
 * word is present in a string.
 *
 * @requires string { string }
 * @requires find   { string }
 */
/* ----------------------------------------
    String Replace
---------------------------------------- */
/**
 * This function will find a character
 * within in a string.
 *
 * @author          Jonathan Neal
 * @link            https://github.com/jonathantneal
 *
 * @requires string { string }
 * @requires search { string }
 * @params replace  { string }
 */
/* ----------------------------------------
    String to List
---------------------------------------- */
/**
 * This function will convert a string to
 * a list, added some custom tweaks to
 * original code.
 *
 * @author          Beni Buess
 * @link            https://github.com/benib
 *
 * @requires string { string }
 * @params separator { string }
 * @params start    { number }
 * @returns         { string }
 */
/* ----------------------------------------
    Mixins
---------------------------------------- */
/* ----------------------------------------
    Float
---------------------------------------- */
/**
 * This is a mixin that will set a float
 * to the given element.
 *
 * EXAMPLE
 *
 * .demo-class {
 *     @include float;
 * }
 */
/* ----------------------------------------
    Position
---------------------------------------- */
/**
 * This is a mixin that will return property
 * and values for a given map value.
 *
 * EXAMPLE
 *
 * .demo-class {
 *     @include position();
 * }
 */
/* ----------------------------------------
    Position Absolute
---------------------------------------- */
/**
 * This is a shorthand mixin to absolute
 * position a element.
 *
 * EXAMPLE
 *
 * .demo-class {
 *     @include absolute((top: 0px, left: 0px));
 * }
 */
/* ----------------------------------------
    Position Relative
---------------------------------------- */
/**
 * This is a shorthand mixin to relative
 * position a element.
 *
 * EXAMPLE
 *
 * .demo-class {
 *     @include relative((top: 0px, left: 0px));
 * }
 */
/* ----------------------------------------
    Position Fixed
---------------------------------------- */
/**
 * This is a shorthand mixin to fixed
 * position a element.
 *
 * EXAMPLE
 *
 * .demo-class {
 *     @include fixed((top: 0px, left: 0px));
 * }
 */
/* ----------------------------------------
    Center Block
---------------------------------------- */
/**
 * EXAMPLE
 *
 * .demo-class {
 *     @include center;
 * }
 */
/* ----------------------------------------
    Inner Block
---------------------------------------- */
/**
 * EXAMPLE
 *
 * .demo-class {
 *    &__inner {
 *      @include inner(2rem, 4rem);
 *    }
 * }
 */
/* ----------------------------------------
    Flex Center
---------------------------------------- */
/**
 * EXAMPLE
 *
 * .demo-class {
 *     @include flex-center;
 * }
 */
/* ----------------------------------------
    Flex Vertical Center
---------------------------------------- */
/**
 * EXAMPLE
 *
 * .demo-class {
 *     @include flex-vertical-center;
 * }
 */
/* ----------------------------------------
    Default Flex Child
---------------------------------------- */
/**
 * EXAMPLE
 *
 * .demo-class {
 *     @include flex-child;
 * }
 */
/* ----------------------------------------
    Flex Grow Child
---------------------------------------- */
/**
 * EXAMPLE
 *
 * .demo-class {
 *     @include flex-child-grow;
 * }
 */
/* ----------------------------------------
    Flex Space Between
---------------------------------------- */
/**
 * EXAMPLE
 *
 * .demo-class {
 *     @include flex-space-between;
 * }
 */
/* ----------------------------------------
    To Props
---------------------------------------- */
/**
 * This is a mixin that will return property
 * and values for a given map value.
 *
 * EXAMPLE
 *
 * .demo-class {
 *     @include to-props(top: 0px, left: 0px);
 * }
 *
 * OUTPUT
 *
 * .demo-class {
 *    top: 0px;
 *    left: 0px;
 * }
 */
/* ----------------------------------------
    Prefix
---------------------------------------- */
/**
 * @author          Hugo Giraudel
 * @link            https://github.com/HugoGiraudel
 *
 * EXAMPLE
 *
 * .demo-class {
 *    @include prefix((
 *      transform: translate(50px)
 *    ), webkit);
 * }
 */
/* ----------------------------------------
    Pseudo Selector
---------------------------------------- */
/**
 * EXAMPLE
 *
 * .demo-class {
 *    &:before {
 *      @include pseudo;
 *    }
 * }
 */
/* ----------------------------------------
    No Drag
---------------------------------------- */
/**
 * EXAMPLE
 *
 * .demo-class {
 *    @include no-drag;
 * }
 */
/* ----------------------------------------
    Clip hexagon
---------------------------------------- */
/**
 * EXAMPLE
 *
 * .demo-class {
 *    @include clip-hex;
 * }
 */
/* ----------------------------------------
    Debug Variable Output
---------------------------------------- */
/**
 * This mixin will set a before tag on
 * it's parent element and display the
 * the contents of variable within.
 *
 * EXAMPLE
 *
 * .demo-class {
 *    @include debug-output($global-colors);
 * }
 */
/* ----------------------------------------
    Debug Selector
---------------------------------------- */
/**
 * This mixin will set a before tag on
 * it's parent element and display the
 * name of the selector.
 *
 * EXAMPLE
 *
 * .demo-class {
 *    @include debug-selector;
 * }
 */
/* ----------------------------------------
    Debug Example
---------------------------------------- */
/**
 * This mixin will set a before tag on
 * the first element within it's parent.
 * Used to get going styling all UI
 * components in the example page.
 *
 * EXAMPLE
 *
 * .demo-class {
 *    @include debug-example();
 * }
 */
/* ----------------------------------------
    Debug Responsive Values
---------------------------------------- */
/**
 * This mixin will set a before tag on
 * it's parent and show the value of the
 * available breakpoints depending on
 * the current viewport for debugging
 * purposes.
 *
 * EXAMPLE
 *
 * .demo-class {
 *    @include debug-responsive();
 * }
 */
/* ----------------------------------------
    Clearfix
---------------------------------------- */
/**
 * EXAMPLE
 *
 * .demo-class {
 *     @include grid-clearfix;
 * }
 */
/* ----------------------------------------
    Fetch Color
---------------------------------------- */
/**
 * This mixin is used to fetch a particular
 * color of the global configured map.
 *
 * EXAMPLE
 *
 * .demo-class {
 *    @include branding(background, primary, default);
 * }
 *
 * OUTPUT
 *
 * .demo-class-blue {
 *    background: #000
 * }
 */
/* ----------------------------------------
    Fetch Shorthand
---------------------------------------- */
/**
 * This shorthand will fetch a color for
 * a given key from the primary color values.
 *
 * EXAMPLE
 *
 * .demo-class {
 *    @include primary(dark);
 * }
 *
 * OUTPUT
 *
 * .demo-class-blue {
 *    background: #000
 * }
 */
/* ----------------------------------------
    Color Combinations
---------------------------------------- */
/**
 * This mixin will use the root element
 * as a prefix for every color available
 * within a combination. Check the config
 * folder for the color combinations.
 *
 * EXAMPLE
 *
 * .demo-class {
 *    @include color-combinations;
 * }
 *
 * OUTPUT
 *
 * .demo-class-blue {
 *    background: blue;
 *    color: black;
 * }
 */
/* ----------------------------------------
    Fetch Combination
---------------------------------------- */
/**
 * This mixin will return a contrasting
 * color based on a given background color.
 *
 * EXAMPLE
 *
 * .demo-class {
 *    @include combi(banana);
 * }
 */
/* ----------------------------------------
    Contrast Color
---------------------------------------- */
/**
 * This mixin will return a contrasting
 * color based on a given background color.
 *
 * EXAMPLE
 *
 * .demo-class {
 *    @include contrast(#000);
 * }
 */
/* ----------------------------------------
    Contrast Color B/W
---------------------------------------- */
/**
 * This mixin will return a contrasting
 * black or white color based on a given
 * background color.
 *
 * EXAMPLE
 *
 * .demo-class {
 *    @include contrast(#000);
 * }
 */
/* ----------------------------------------
    SVG Fill
---------------------------------------- */
/**
 * This mixin will fill a svg, you can
 * still tweak the values as content of
 * the mixin.
 *
 * EXAMPLE
 *
 * .demo-class {
 *    @include svg(color('black'));
 * }
 */
/* ----------------------------------------
    Font Styles
---------------------------------------- */
/**
 * This mixin will return all key value
 * pairs that are associated with a map
 * of font related styling.
 *
 * @type            { string }  the selected style
 * @font-map        { map }     default selected $global-text from config/fonts
 * @returns         { string }  all key value pairs
 *
 * EXAMPLE
 *
 * .demo-class {
 *    @include font(default);
 * }
 *
 * OUTPUT
 *
 * .demo-class {
 *    font-size: 1em;
 *    color: #000;
 * }
 */
/* ----------------------------------------
    Font Value
---------------------------------------- */
/**
 * This mixin will return all specific key value
 * pair that are associated with a map of font
 * related styling.
 *
 * @type            { string }  the related type of style
 * @prop            { string }  selected css property
 * @font-map        { map }     default selected $text from config/fonts
 * @returns         { string }  key value pair
 *
 * EXAMPLE
 *
 * .demo-class {
 *    @include font(default, font-weight);
 * }
 *
 * OUTPUT
 *
 * .demo-class {
 *    font-weight: 700;
 * }
 */
/* ----------------------------------------
    Font Exclude
---------------------------------------- */
/**
 * This mixin will return all specific key value
 * pair that are associated with a map and exclude
 * given properties.
 *
 * @type            { string }
 * @excl            { string }
 * @font-map        { map }
 * @returns         { string }  key value pair
 *
 * EXAMPLE
 *
 * .demo-class {
 *    @include font-exclude(default, font-weight);
 * }
 *
 * OUTPUT
 *
 * .demo-class {
 *    font-size: 1em;
 *    line-height: 1.5em;
 * }
 */
/* ----------------------------------------
    Font Face
---------------------------------------- */
/**
 * This mixin will set a custom font
 * face given given values.
 *
 * @author          Jonathan Neal
 * @link            https://github.com/jonathantneal
 *
 * @name            { string } name of the font
 * @file            { string } name of the file
 * @weight          { string } font-weight
 * @style           { string } font-style
 * @exts            { string } format
 * @returns         { string } complete font-face
 */
/* ----------------------------------------
    Font Smoothing
---------------------------------------- */
/**
 * EXAMPLE
 *
 * .demo-class {
 *    @include font-smoothing(antialiased);
 * }
 */
/* ----------------------------------------
    Font Heading
---------------------------------------- */
/**
 * This mixin will return all specific key value
 * pair that are associated with a map of font
 * related styling.
 *
 * @param start     { number }
 * @param end       { number }
 *
 * EXAMPLE
 *
 * .demo-class {
 *    @include header(1,3){
 *      @include font-size(20px);
 *    }
 * }
 *
 * OUTPUT
 *
 * .demo-class {
 *    h1, h2, h3 {
 *      font-size 1.5em;
 *    }
 * }
 */
/* ----------------------------------------
    Font Size
---------------------------------------- */
/**
 * This mixin will take a number or px value
 * and calculate the em value.
 *
 * @param size      { number/value }
 *
 * EXAMPLE
 *
 * .demo-class {
 *    @include font-size(16px);
 * }
 *
 * OUTPUT
 *
 * .demo-class {
 *    font-size 1em
 * }
 */
/* ----------------------------------------
    Line Height
---------------------------------------- */
/**
 * EXAMPLE
 *
 * .demo-class {
 *    @include line-height(16px);
 * }
 */
/* ----------------------------------------
    Letter Spacing
---------------------------------------- */
/**
 * EXAMPLE
 *
 * .demo-class {
 *    @include letter-spacing(1px);
 * }
 */
/* ----------------------------------------
    Line Break
---------------------------------------- */
/**
 * EXAMPLE
 *
 * .demo-class {
 *    @include line-break;
 * }
 */
/* ----------------------------------------
    Line Clamp
---------------------------------------- */
/**
 * EXAMPLE
 *
 * .demo-class {
 *    @include line-clamp(5);
 * }
 */
/* ----------------------------------------
    Ellipsis
---------------------------------------- */
/**
 * EXAMPLE
 *
 * .demo-class {
 *    @include ellipsis(100%);
 * }
 */
/* ----------------------------------------
    Root
---------------------------------------- */
/* ----------------------------------------
    Placeholder
---------------------------------------- */
/**
 * EXAMPLE
 *
 * .demo-class {
 *    @include placeholder {
 *      @include font-size(14px);
 *      color: red;
 *    }
 * }
 */
/* ----------------------------------------
    Breakpoints
---------------------------------------- */
/**
 * This mixin will set media queries based
 * on selected parameters.
 *
 * @requires viewport   { string/list }
 * @params type         { string } min or max default: max
 * @params orientation  { string } landscape or portrait
 * @params screen       { string } default: screen
 * @params breakpoints  { map } default: $global-breakpoints
 *
 * EXAMPLE
 *
 * .demo-class {
 *    padding: 20px;
 *
 *    @include mq(phone tablet) {
 *      padding: 30px;
 *    }
 *
 *    @include mq(tablet, 'min') {
 *      padding: 40px;
 *    }
 *
 *    @include mq(phone tablet, 'max', landscape) {
 *      padding: 30px;
 *    }
 * }
 *
 * OUTPUT
 *
 * @media screen and (min-width: 420px) and (max-width: 959px) {
 *   .demo-class {
 *     padding: 30px; }
 *   }
 * }
 *
 * @media screen and (min-width: 960px) {
 *   .demo-class {
 *     padding: 40px; }
 *   }
 * }
 *
 * @media screen and (min-width: 420px) and (max-width: 959px) and (orientation: landscape) {
 *   .demo-class {
 *     padding: 30px; }
 *   }
 * }
 */
/* ----------------------------------------
    Aspect Ratio
---------------------------------------- */
/**
 * EXAMPLE
 *
 * .demo-class {
 *    @include aspect-ratio(16,9);
 * }
 */
/* ----------------------------------------
     Theme Styling
---------------------------------------- */
/**
 * This function will output content if
 * a given string is equal to the current
 * theme. The $theme variable is created
 * within the sass-loader of the webpack
 * file an can be tweaked within this
 * configuration.
 *
 * EXAMPLE
 *
 * .demo-class {
 *    @include theme('design') {
 *       background: color('pink');
 *    }
 *
 *    @include theme('digital') {
 *       background: color('blue');
 *    }
 * }
 */
/* ----------------------------------------
    Classes
---------------------------------------- */
/* ----------------------------------------
    Absolute Middle
---------------------------------------- */
/**
 * EXAMPLE
 *
 * .demo-class {
 *    @extend %abs-middle-content;
 * }
 */
/* ----------------------------------------
    Middle
---------------------------------------- */
/**
 *
 * EXAMPLE
 *
 * .demo-class {
 *    @extend %middle-content;
 * }
 *
 */
/* ----------------------------------------
    Cover Image
---------------------------------------- */
/**
 *
 * EXAMPLE
 *
 * .demo-class
 *    @extend %cover-img;
 * }
 *
 */
/* ----------------------------------------
    Full Screen
---------------------------------------- */
/**
 *
 * EXAMPLE
 *
 * .demo-class {
 *    @extend %fullscreen;
 * }
 *
 */
/* ----------------------------------------
    Center content
---------------------------------------- */
/**
 *
 * EXAMPLE
 *
 * <div class="text-center">
 *   <p>Centered text</p>
 * </div>
 */
.text-center {
  text-align: center; }

@media screen and (min-width: 0\0) {
  .visible\:ie {
    display: block !important; } }

_:-ms-lang(x), .visible\:ie {
  display: block !important; }

/* ----------------------------------------
    Overlay
---------------------------------------- */
/**
 * EXAMPLE
 *
 * .demo-class {
 *    @extend %overlay;
 * }
 */
/* ----------------------------------------
    Video Player
---------------------------------------- */
/**
 * EXAMPLE
 *
 * .demo-class {
 *    @extend %player;
 * }
 */
/* ----------------------------------------
    Spacer
---------------------------------------- */
/**
 * EXAMPLE
 *
 * .demo-class {
 *    @extend .padding-width-20;
 * }
 */
/* ----------------------------------------
    Create Spacers
---------------------------------------- */
.mt-8 {
  margin-top: 2rem; }

.mt-16 {
  margin-top: 4rem; }

/* ----------------------------------------
    Animations
---------------------------------------- */
/* ----------------------------------------
    Fade Animation
---------------------------------------- */
/**
 * Example usage
 *
 * .demo-class {
 *    animation: fade-in 0.75s ease-in-out;
 *    animation-iteration-count: 1;
 *    animation-fill-mode: forwards;
 * }
 *
 */
@keyframes fade-in {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }

@keyframes fade-out {
  0% {
    opacity: 1; }
  100% {
    opacity: 0; } }

/* ----------------------------------------
    Pop Animation
---------------------------------------- */
/**
 * Example usage
 *
 * .demo-class {
 *    animation: pop 0.75s ease-in-out;
 *    animation-iteration-count: 1;
 *    animation-fill-mode: forwards;
 * }
 *
 */
@keyframes pop-in {
  0% {
    transform: scale(0); }
  40% {
    transform: scale(1.1); }
  65% {
    transform: scale(0.95); }
  80% {
    transform: scale(1.025); }
  100% {
    transform: scale(1); } }

@keyframes pop-out {
  0% {
    transform: scale(1); }
  100% {
    transform: scale(0); } }

/* ----------------------------------------
    Pulse Animation
---------------------------------------- */
/**
 * Example usage
 *
 * .demo-class {
 *    animation: pulse 1.75s ease-in-out;
 *    animation-iteration-count: infinite;
 * }
 *
 */
@keyframes pulse {
  0% {
    transform: translateY(-50%) scale(1); }
  50% {
    transform: translateY(-50%) scale(1.05); }
  90%,
  100% {
    transform: translateY(-50%) scale(1); } }

/* ----------------------------------------
    Skew Animation
---------------------------------------- */
/**
 * Example usage
 *
 * .demo-class {
 *    animation: skew 0.75s ease-in-out;
 *    animation-iteration-count: 1;
 *    animation-fill-mode: forwards;
 * }
 *
 */
@keyframes skew {
  0% {
    transform: skewX(0deg); }
  100% {
    transform: skewX(-10deg); } }

/* ----------------------------------------
    Turn Animation
---------------------------------------- */
/**
 * Example usage
 *
 * .demo-class {
 *    animation: spin 0.75s ease-in-out;
 *    animation-iteration-count: 1;
 *    animation-fill-mode: forwards;
 * }
 *
 */
@keyframes spin {
  0% {
    transform: rotate(0deg); }
  100% {
    transform: rotate(360deg); } }

@keyframes anti-spin {
  0% {
    transform: rotate(0deg); }
  100% {
    transform: rotate(-360deg); } }

/* ----------------------------------------
    Generators
---------------------------------------- */
/* ----------------------------------------
    Branding Colors
---------------------------------------- */
/**
 * This map includes all main colors
 * that will be used within the project.
 */
/**
 * This map includes all button text colors
 * that will be used within the project.
 */
/* ----------------------------------------
    Branding Combinations
---------------------------------------- */
/**
 * I case you wan't to use specific color
 * combinations, you can add these to this
 * multi dimensional map. These should
 * always consist of a background and
 * color combination.
 */
/* ----------------------------------------
    Branding Values
---------------------------------------- */
/**
 * Cluster brand variables within this map
 * with custom names. Comes in handy if you
 * have specific names for certain color
 * values. Use map-fetch function to get the
 * value of particular map, there are also
 * some shorthand mixins to include colors.
 */
/* ----------------------------------------
    Export Colors JS
---------------------------------------- */

/* ----------------------------------------
    Color Classes
---------------------------------------- */
/**
 * This loop will generate color classes
 * looking for the available primary
 * selected colors.
 */
.color\:blue {
  color: #002F87; }

.color\:hover\:blue:hover {
  color: #002F87; }

.back\:blue {
  background: #002F87; }

.back\:hover\:blue:hover {
  color: #002F87; }

.color\:lightblue {
  color: #EBEFF2; }

.color\:hover\:lightblue:hover {
  color: #EBEFF2; }

.back\:lightblue {
  background: #EBEFF2; }

.back\:hover\:lightblue:hover {
  color: #EBEFF2; }

.color\:green {
  color: #B5D9B9; }

.color\:hover\:green:hover {
  color: #B5D9B9; }

.back\:green {
  background: #B5D9B9; }

.back\:hover\:green:hover {
  color: #B5D9B9; }

.color\:pink {
  color: #F9CDD0; }

.color\:hover\:pink:hover {
  color: #F9CDD0; }

.back\:pink {
  background: #F9CDD0; }

.back\:hover\:pink:hover {
  color: #F9CDD0; }

.color\:white {
  color: #FFFFFF; }

.color\:hover\:white:hover {
  color: #FFFFFF; }

.back\:white {
  background: #FFFFFF; }

.back\:hover\:white:hover {
  color: #FFFFFF; }

.color\:lightgrey {
  color: #DEE3E7; }

.color\:hover\:lightgrey:hover {
  color: #DEE3E7; }

.back\:lightgrey {
  background: #DEE3E7; }

.back\:hover\:lightgrey:hover {
  color: #DEE3E7; }

.color\:grey {
  color: #899299; }

.color\:hover\:grey:hover {
  color: #899299; }

.back\:grey {
  background: #899299; }

.back\:hover\:grey:hover {
  color: #899299; }

.color\:black {
  color: #181716; }

.color\:hover\:black:hover {
  color: #181716; }

.back\:black {
  background: #181716; }

.back\:hover\:black:hover {
  color: #181716; }

.color\:error {
  color: #F56565; }

.color\:hover\:error:hover {
  color: #F56565; }

.back\:error {
  background: #F56565; }

.back\:hover\:error:hover {
  color: #F56565; }

/* ----------------------------------------
    Color Combination Classes
---------------------------------------- */
/**
 * This loop will generate combination
 * classes looking for the available
 * combinations as declared inside the
 * color configuration.
 */
.combi\:pink {
  background: #F9CDD0;
  color: #002F87; }

.combi\:green {
  background: #B5D9B9;
  color: #002F87; }

.combi\:lightgrey {
  background: #DEE3E7;
  color: #002F87; }

.combi\:blue {
  background: #002F87;
  color: #FFFFFF; }

/* ----------------------------------------
    Font Face
---------------------------------------- */
@font-face {
  font-family: "Lubalin";
  font-weight: 600;
  font-style: bold;
  src: url("../../fonts/LubalinGraphITCbyBT-Demi.otf") format("opentype"); }

@font-face {
  font-family: "Lubalin";
  font-weight: 300;
  font-style: normal;
  src: url("../../fonts/LubalinGraphITCbyBT-Book.otf") format("opentype"); }

@font-face {
  font-family: "Lubalin";
  font-weight: 500;
  font-style: normal;
  src: url("../../fonts/LubalinGraphITCbyBT-Medium.otf") format("opentype"); }

@font-face {
  font-family: "Nimbus";
  font-weight: 300;
  font-style: normal;
  src: url("../../fonts/NimbusSansNovusTOT-Reg.otf") format("opentype"); }

/* ----------------------------------------
    Font Variables
---------------------------------------- */
/* ----------------------------------------
    Text Styles
---------------------------------------- */
/**
 * This sections specifies some of the
 * core font styling. You can declare
 * new maps inside this global variable
 * for use with the font mixin.
 */
/* ----------------------------------------
    Export Fonts JS
---------------------------------------- */

/* ----------------------------------------
    Font Classes
---------------------------------------- */
/**
 * This loop will generate color classes
 * looking for the available primary
 * selected colors.
 */
.font\:default {
  font-family: "Lubalin", "Helvetica", sans-serif;
  font-size: 1em;
  font-style: italic;
  font-weight: 300;
  line-height: 1.5em;
  color: #002F87; }

.font\:detail_title {
  font-family: "Lubalin", "Helvetica", sans-serif;
  font-size: 1.125em;
  font-weight: 600;
  line-height: 1.5rem;
  color: #002F87; }

.font\:detail_info {
  font-family: "Nimbus", "Helvetica", sans-serif;
  font-size: 1.1875em;
  font-weight: 300;
  line-height: 1.5rem;
  color: #002F87; }

.font\:text_tiny {
  font-family: "Nimbus", "Helvetica", sans-serif;
  font-size: 0.9375em;
  font-weight: 300;
  line-height: 1.25em; }

.font\:text_small {
  font-family: "Nimbus", "Helvetica", sans-serif;
  font-size: 1.1875em;
  font-weight: 300;
  line-height: 1.5em; }

.font\:text_large {
  font-family: "Lubalin", "Helvetica", sans-serif;
  font-size: 1.375em;
  font-weight: 300;
  line-height: 1.35em; }

.font\:project_title {
  font-family: "Lubalin", "Helvetica", sans-serif;
  font-size: 3em;
  font-weight: 500;
  line-height: 1.25em; }

.font\:large_title {
  font-family: "Lubalin", "Helvetica", sans-serif;
  font-weight: 600;
  line-height: 1.25em; }

.font\:quote {
  width: 90%;
  margin: 1em auto;
  font-family: "Lubalin", "Helvetica", sans-serif;
  font-size: 2.5em;
  font-weight: 500;
  text-align: center; }

.font\:quote_author {
  font-family: "Nimbus", "Helvetica", sans-serif;
  font-size: 1.3125em;
  font-style: normal;
  text-align: center; }

.font\:caption {
  width: 80%;
  margin: 1em auto;
  font-family: "Nimbus", "Helvetica", sans-serif;
  font-size: 0.9375em;
  font-weight: 500;
  font-style: normal;
  text-align: center;
  overflow: hidden; }

.font\:footer_title {
  margin-bottom: 1em;
  font-family: "Lubalin", "Helvetica", sans-serif;
  font-size: 1.25em;
  font-weight: 600; }

.font\:footer_item {
  font-family: "Nimbus", "Helvetica", sans-serif;
  font-size: 1.125em;
  line-height: 1.55em; }

.font\:debug {
  font-family: "Nimbus", "Helvetica", sans-serif;
  font-size: 0.9375em;
  font-style: normal; }

/* ----------------------------------------
    Breakpoints
---------------------------------------- */
/**
 * These breakpoints can be used within
 * the media query mixin. Feel free to
 * tweak or declare new values within
 * this map, the mixin will automatically
 * include them as an option.
 */
/* ----------------------------------------
    Hidden & Visible
---------------------------------------- */
@media screen and (min-width: 0) and (max-width: 419px) {
  .hidden--phone {
    display: none; } }

@media screen and (min-width: 0) and (max-width: 559px) {
  .hidden--phone-wide {
    display: none; } }

@media screen and (min-width: 0) and (max-width: 639px) {
  .hidden--phablet {
    display: none; } }

@media screen and (min-width: 0) and (max-width: 767px) {
  .hidden--tablet-small {
    display: none; } }

@media screen and (min-width: 0) and (max-width: 959px) {
  .hidden--tablet {
    display: none; } }

@media screen and (min-width: 0) and (max-width: 1079px) {
  .hidden--tablet-wide {
    display: none; } }

@media screen and (min-width: 0) and (max-width: 1279px) {
  .hidden--desktop {
    display: none; } }

@media screen and (min-width: 0) and (max-width: 1439px) {
  .hidden--desktop-wide {
    display: none; } }

@media screen and (min-width: 0) and (max-width: 1599px) {
  .hidden--desktop-wider {
    display: none; } }

@media screen and (min-width: 0) and (max-width: 1919px) {
  .hidden--desktop-massive {
    display: none; } }

@media screen and (min-width: 0) and (max-width: 2439px) {
  .hidden--desktop-ultra {
    display: none; } }

.visible {
  display: none; }
  @media screen and (min-width: 0) and (max-width: 419px) {
    .visible--phone {
      display: block; } }
  @media screen and (min-width: 0) and (max-width: 559px) {
    .visible--phone-wide {
      display: block; } }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .visible--phablet {
      display: block; } }
  @media screen and (min-width: 0) and (max-width: 767px) {
    .visible--tablet-small {
      display: block; } }
  @media screen and (min-width: 0) and (max-width: 959px) {
    .visible--tablet {
      display: block; } }
  @media screen and (min-width: 0) and (max-width: 1079px) {
    .visible--tablet-wide {
      display: block; } }
  @media screen and (min-width: 0) and (max-width: 1279px) {
    .visible--desktop {
      display: block; } }
  @media screen and (min-width: 0) and (max-width: 1439px) {
    .visible--desktop-wide {
      display: block; } }
  @media screen and (min-width: 0) and (max-width: 1599px) {
    .visible--desktop-wider {
      display: block; } }
  @media screen and (min-width: 0) and (max-width: 1919px) {
    .visible--desktop-massive {
      display: block; } }
  @media screen and (min-width: 0) and (max-width: 2439px) {
    .visible--desktop-ultra {
      display: block; } }

/* ----------------------------------------
    Support classes
---------------------------------------- */
@media screen and (min-width: 1080px) {
  .md\:relative {
    position: relative; }
  .md\:absolute {
    position: absolute; }
  .md\:overflow-visible {
    overflow: visible !important; }
  .md\:z-999 {
    z-index: 999; }
  .md\:right-8 {
    right: 2rem; } }

/* ----------------------------------------
    Export Breakpoints JS
---------------------------------------- */

/* ----------------------------------------
    Hidden & Visible
---------------------------------------- */
/**
 * These classes can be added within the
 * DOM to make an element either visible
 * or hidden within a certain view.
 */
@media screen and (min-width: 0) and (max-width: 419px) {
  .hidden\:phone\:max {
    display: none; } }

@media screen and (min-width: 420px) {
  .hidden\:phone\:min {
    display: none; } }

@media screen and (min-width: 0) and (max-width: 559px) {
  .hidden\:phone-wide\:max {
    display: none; } }

@media screen and (min-width: 560px) {
  .hidden\:phone-wide\:min {
    display: none; } }

@media screen and (min-width: 0) and (max-width: 639px) {
  .hidden\:phablet\:max {
    display: none; } }

@media screen and (min-width: 640px) {
  .hidden\:phablet\:min {
    display: none; } }

@media screen and (min-width: 0) and (max-width: 767px) {
  .hidden\:tablet-small\:max {
    display: none; } }

@media screen and (min-width: 768px) {
  .hidden\:tablet-small\:min {
    display: none; } }

@media screen and (min-width: 0) and (max-width: 959px) {
  .hidden\:tablet\:max {
    display: none; } }

@media screen and (min-width: 960px) {
  .hidden\:tablet\:min {
    display: none; } }

@media screen and (min-width: 0) and (max-width: 1079px) {
  .hidden\:tablet-wide\:max {
    display: none; } }

@media screen and (min-width: 1080px) {
  .hidden\:tablet-wide\:min {
    display: none; } }

@media screen and (min-width: 0) and (max-width: 1279px) {
  .hidden\:desktop\:max {
    display: none; } }

@media screen and (min-width: 1280px) {
  .hidden\:desktop\:min {
    display: none; } }

@media screen and (min-width: 0) and (max-width: 1439px) {
  .hidden\:desktop-wide\:max {
    display: none; } }

@media screen and (min-width: 1440px) {
  .hidden\:desktop-wide\:min {
    display: none; } }

@media screen and (min-width: 0) and (max-width: 1599px) {
  .hidden\:desktop-wider\:max {
    display: none; } }

@media screen and (min-width: 1600px) {
  .hidden\:desktop-wider\:min {
    display: none; } }

@media screen and (min-width: 0) and (max-width: 1919px) {
  .hidden\:desktop-massive\:max {
    display: none; } }

@media screen and (min-width: 1920px) {
  .hidden\:desktop-massive\:min {
    display: none; } }

@media screen and (min-width: 0) and (max-width: 2439px) {
  .hidden\:desktop-ultra\:max {
    display: none; } }

@media screen and (min-width: 2440px) {
  .hidden\:desktop-ultra\:min {
    display: none; } }

@media screen and (min-width: 0) and (max-width: 419px) {
  .visible\:phone\:max {
    display: block; } }

@media screen and (min-width: 420px) {
  .visible\:phone\:min {
    display: block; } }

@media screen and (min-width: 0) and (max-width: 559px) {
  .visible\:phone-wide\:max {
    display: block; } }

@media screen and (min-width: 560px) {
  .visible\:phone-wide\:min {
    display: block; } }

@media screen and (min-width: 0) and (max-width: 639px) {
  .visible\:phablet\:max {
    display: block; } }

@media screen and (min-width: 640px) {
  .visible\:phablet\:min {
    display: block; } }

@media screen and (min-width: 0) and (max-width: 767px) {
  .visible\:tablet-small\:max {
    display: block; } }

@media screen and (min-width: 768px) {
  .visible\:tablet-small\:min {
    display: block; } }

@media screen and (min-width: 0) and (max-width: 959px) {
  .visible\:tablet\:max {
    display: block; } }

@media screen and (min-width: 960px) {
  .visible\:tablet\:min {
    display: block; } }

@media screen and (min-width: 0) and (max-width: 1079px) {
  .visible\:tablet-wide\:max {
    display: block; } }

@media screen and (min-width: 1080px) {
  .visible\:tablet-wide\:min {
    display: block; } }

@media screen and (min-width: 0) and (max-width: 1279px) {
  .visible\:desktop\:max {
    display: block; } }

@media screen and (min-width: 1280px) {
  .visible\:desktop\:min {
    display: block; } }

@media screen and (min-width: 0) and (max-width: 1439px) {
  .visible\:desktop-wide\:max {
    display: block; } }

@media screen and (min-width: 1440px) {
  .visible\:desktop-wide\:min {
    display: block; } }

@media screen and (min-width: 0) and (max-width: 1599px) {
  .visible\:desktop-wider\:max {
    display: block; } }

@media screen and (min-width: 1600px) {
  .visible\:desktop-wider\:min {
    display: block; } }

@media screen and (min-width: 0) and (max-width: 1919px) {
  .visible\:desktop-massive\:max {
    display: block; } }

@media screen and (min-width: 1920px) {
  .visible\:desktop-massive\:min {
    display: block; } }

@media screen and (min-width: 0) and (max-width: 2439px) {
  .visible\:desktop-ultra\:max {
    display: block; } }

@media screen and (min-width: 2440px) {
  .visible\:desktop-ultra\:min {
    display: block; } }

/* ----------------------------------------
    Config Files
---------------------------------------- */
/* ----------------------------------------
    Paths
---------------------------------------- */
/**
 * Sometimes u might need to configure
 * a certain path or location, this is
 * the place to go!
 */
/* ----------------------------------------
    Breakpoints
---------------------------------------- */
/**
 * These breakpoints can be used within
 * the media query mixin. Feel free to
 * tweak or declare new values within
 * this map, the mixin will automatically
 * include them as an option.
 */
/* ----------------------------------------
    Hidden & Visible
---------------------------------------- */
@media screen and (min-width: 0) and (max-width: 419px) {
  .hidden--phone {
    display: none; } }

@media screen and (min-width: 0) and (max-width: 559px) {
  .hidden--phone-wide {
    display: none; } }

@media screen and (min-width: 0) and (max-width: 639px) {
  .hidden--phablet {
    display: none; } }

@media screen and (min-width: 0) and (max-width: 767px) {
  .hidden--tablet-small {
    display: none; } }

@media screen and (min-width: 0) and (max-width: 959px) {
  .hidden--tablet {
    display: none; } }

@media screen and (min-width: 0) and (max-width: 1079px) {
  .hidden--tablet-wide {
    display: none; } }

@media screen and (min-width: 0) and (max-width: 1279px) {
  .hidden--desktop {
    display: none; } }

@media screen and (min-width: 0) and (max-width: 1439px) {
  .hidden--desktop-wide {
    display: none; } }

@media screen and (min-width: 0) and (max-width: 1599px) {
  .hidden--desktop-wider {
    display: none; } }

@media screen and (min-width: 0) and (max-width: 1919px) {
  .hidden--desktop-massive {
    display: none; } }

@media screen and (min-width: 0) and (max-width: 2439px) {
  .hidden--desktop-ultra {
    display: none; } }

.visible {
  display: none; }
  @media screen and (min-width: 0) and (max-width: 419px) {
    .visible--phone {
      display: block; } }
  @media screen and (min-width: 0) and (max-width: 559px) {
    .visible--phone-wide {
      display: block; } }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .visible--phablet {
      display: block; } }
  @media screen and (min-width: 0) and (max-width: 767px) {
    .visible--tablet-small {
      display: block; } }
  @media screen and (min-width: 0) and (max-width: 959px) {
    .visible--tablet {
      display: block; } }
  @media screen and (min-width: 0) and (max-width: 1079px) {
    .visible--tablet-wide {
      display: block; } }
  @media screen and (min-width: 0) and (max-width: 1279px) {
    .visible--desktop {
      display: block; } }
  @media screen and (min-width: 0) and (max-width: 1439px) {
    .visible--desktop-wide {
      display: block; } }
  @media screen and (min-width: 0) and (max-width: 1599px) {
    .visible--desktop-wider {
      display: block; } }
  @media screen and (min-width: 0) and (max-width: 1919px) {
    .visible--desktop-massive {
      display: block; } }
  @media screen and (min-width: 0) and (max-width: 2439px) {
    .visible--desktop-ultra {
      display: block; } }

/* ----------------------------------------
    Support classes
---------------------------------------- */
@media screen and (min-width: 1080px) {
  .md\:relative {
    position: relative; }
  .md\:absolute {
    position: absolute; }
  .md\:overflow-visible {
    overflow: visible !important; }
  .md\:z-999 {
    z-index: 999; }
  .md\:right-8 {
    right: 2rem; } }

/* ----------------------------------------
    Export Breakpoints JS
---------------------------------------- */

/* ----------------------------------------
    Branding Colors
---------------------------------------- */
/**
 * This map includes all main colors
 * that will be used within the project.
 */
/**
 * This map includes all button text colors
 * that will be used within the project.
 */
/* ----------------------------------------
    Branding Combinations
---------------------------------------- */
/**
 * I case you wan't to use specific color
 * combinations, you can add these to this
 * multi dimensional map. These should
 * always consist of a background and
 * color combination.
 */
/* ----------------------------------------
    Branding Values
---------------------------------------- */
/**
 * Cluster brand variables within this map
 * with custom names. Comes in handy if you
 * have specific names for certain color
 * values. Use map-fetch function to get the
 * value of particular map, there are also
 * some shorthand mixins to include colors.
 */
/* ----------------------------------------
    Export Colors JS
---------------------------------------- */

/* ----------------------------------------
    Font Face
---------------------------------------- */
@font-face {
  font-family: "Lubalin";
  font-weight: 600;
  font-style: bold;
  src: url("../../fonts/LubalinGraphITCbyBT-Demi.otf") format("opentype"); }

@font-face {
  font-family: "Lubalin";
  font-weight: 300;
  font-style: normal;
  src: url("../../fonts/LubalinGraphITCbyBT-Book.otf") format("opentype"); }

@font-face {
  font-family: "Lubalin";
  font-weight: 500;
  font-style: normal;
  src: url("../../fonts/LubalinGraphITCbyBT-Medium.otf") format("opentype"); }

@font-face {
  font-family: "Nimbus";
  font-weight: 300;
  font-style: normal;
  src: url("../../fonts/NimbusSansNovusTOT-Reg.otf") format("opentype"); }

/* ----------------------------------------
    Font Variables
---------------------------------------- */
/* ----------------------------------------
    Text Styles
---------------------------------------- */
/**
 * This sections specifies some of the
 * core font styling. You can declare
 * new maps inside this global variable
 * for use with the font mixin.
 */
/* ----------------------------------------
    Export Fonts JS
---------------------------------------- */

/* ----------------------------------------
    Grid
---------------------------------------- */
/**
 * We use the Bourbon Neat grid as a
 * default for every project. Use the
 * query function to determine a
 * certain breakpojnt. Tweak the
 * values if needed.
 */
/* ----------------------------------------
    Icons
---------------------------------------- */
/**
 * Configure (file) names of certain icons
 * to generate new classes within loops.
 */
/* ----------------------------------------
    Modifiers
---------------------------------------- */
[class$='--shadow'] {
  box-shadow: 0 0 5px rgba(24, 23, 22, 0.25); }

/* ----------------------------------------
    App Related Files
---------------------------------------- */
/*
 * Webpack will automatically search for
 * this theme file to build a specific
 * theme related CSS output. These files
 * should only be used for elements or
 * features that are theme specific. For
 * elements that are used within both
 * themes there is a theme mixin
 * available within the support folder.
 */
@charset "UTF-8";
/**
 *
 * Vruchtvlees © 2007-2018
 *
 * Hi, welcome!
 *
 * This is the main style.scss file. One
 * stylesheet to rule them all! It includes
 * several helpful .scss files and combines
 * them into one overview of the folder
 * structure in this project, godspeed you!
 *
 */
/* ----------------------------------------
    Node Modules
---------------------------------------- */
/* ----------------------------------------
    Support
---------------------------------------- */
/* ----------------------------------------
    Disclaimer
---------------------------------------- */
/*!
 * Made by Vruchtvlees © 2007-2025
 *
 * Vruchtvlees: Digital, Strategy & Design realises
 * potential of ambitious brands. With enthusiasm and
 * driven by design, we research the underlying problem
 * and explore different solutions. That results into
 * Dutch Digital Design: internationally renowned
 * (digital) solutions that people love and help
 * brands grow.
 *
 * @site        https://www.vruchtvlees.com/
 * @facebook    https://www.facebook.com/vruchtvlees/
 * @instagram   https://www.instagram.com/vruchtvlees/
 * @twitter     https://twitter.com/vruchtvlees
 */
/*! Latest update to file: 2-12-2025 */
/* ----------------------------------------
    Easter Base
---------------------------------------- */
/* ----------------------------------------
    Easter Core
---------------------------------------- */
.easter {
  position: absolute;
  opacity: 0;
  transition: opacity 0.25s ease; }
  .easter.is-active {
    opacity: 1; }

/* ----------------------------------------
    Easter
---------------------------------------- */
.easter__fruits {
  position: absolute;
  opacity: 0; }

.easter__loader {
  width: 32px;
  height: 32px;
  position: relative;
  animation: spin 1s linear infinite; }

/* ----------------------------------------
    Functions
---------------------------------------- */
/* ----------------------------------------
    Casting to Boolean
---------------------------------------- */
/**
 * This function will return a
 * boolean based on given value.
 *
 * @author          Hugo Giraudel
 * @link            https://github.com/HugoGiraudel
 *
 * @param value     { boolean/string/list/map }
 * @returns         { boolean }
 */
/* ----------------------------------------
    Variable Exists
---------------------------------------- */
/**
 * This function will check if the value
 * is defined within the project.
 *
 * @param value     { parameter }
 * @returns         { boolean }
 */
/* ----------------------------------------
    Number
---------------------------------------- */
/**
 * This function will check if the value
 * is a number.
 *
 * @author          Hugo Giraudel
 * @link            https://github.com/HugoGiraudel
 *
 * @param value     { number }
 * @returns         { boolean }
 */
/* ----------------------------------------
    Number
---------------------------------------- */
/**
 * This function will check if the value
 * is a pixel value. This function is based
 * on a
 *
 * @param value     { number }
 * @returns         { boolean }
 */
/* ----------------------------------------
    Global
---------------------------------------- */
/**
 * This function will check if a given value
 * is declared within the global scope.
 *
 * @param value     { paramater }
 * @returns         { boolean }
 */
/* ----------------------------------------
    Strip Unit
---------------------------------------- */
/**
 * This function will check if a given value
 * is declared within the global scope.
 *
 * @param value     { value }
 * @returns         { number }
 */
/* ----------------------------------------
    First Value
---------------------------------------- */
/**
 * This function will return the first
 * value in a list or a map
 *
 * Use map-get to retrieve a specific value
 * associated with the key given.
 *
 * @param value     { list/map }
 * @returns         { string } first value of map
 */
/* ----------------------------------------
    Last Value
---------------------------------------- */
/**
 * This function will return the last
 * value in a list or a map
 *
 * Use map-get to retrieve a specific value
 * associated with the key given.
 *
 * @param value     { list/map }
 * @returns         { string } last value of map
 */
/* ----------------------------------------
    Random Select
---------------------------------------- */
/**
 * This function will return a random value
 * from a list or map with related values.
 *
 * This function is a joke!
 *
 * @param value     { list/map }
 * @returns         { string } last value of map
 */
/* ----------------------------------------
    Color Function
---------------------------------------- */
/**
 * This function will return a color
 * from $global-colors map in config/color.
 *
 * @param key       { value }
 * @returns         { color }
 *
 * EXAMPLE
 *
 * .demo-class {
 *    background: color('blue');
 * }
 */
/* ----------------------------------------
    Color Function
---------------------------------------- */
/**
 * This function will return a color
 * from $global-branding map in config/color.
 *
 * @param key       { value }
 * @returns         { color }
 *
 * EXAMPLE
 *
 * .demo-class {
 *    background: branding(primary, dark);
 * }
 */
/* ----------------------------------------
    Color Level Function
---------------------------------------- */
/**
 * This function will return a color based
 * on a level from 1 till 10.
 *
 * @param key       { value }
 * @param level     { number } from 1 to 10
 * @returns         { color }
 *
 * EXAMPLE
 *
 * .demo-class {
 *    background: color-level('blue', 5);
 * }
 */
/* ----------------------------------------
    Contains Light
---------------------------------------- */
/**
 * This function will return a boolean
 * for a light color within the brand
 * colors map.
 *
 * @param colors    { map }
 * @returns         { boolean/color } default return color
 */
/* ----------------------------------------
    Contains Dark
---------------------------------------- */
/**
 * This function will return a boolean
 * for a dark color within the brand
 * colors map.
 *
 * @param colors    { map }
 * @returns         { boolean/color } default return color
 */
/* ----------------------------------------
    Contrast
---------------------------------------- */
/**
 * This function will return a contract color
 *
 * @param colors    { color }
 * @returns         { color } default return color
 */
/* ----------------------------------------
    Calculate Size
---------------------------------------- */
/**
 * This function calculates a em value based
 * on the number of pixels added as $size.
 * Function will check for a pixel value.
 *
 * @param size     { number } in px or unitless
 * @param return   { size } in em value
 */
/* ----------------------------------------
    Font Size
---------------------------------------- */
/**
 * This is a additional function that doesn't
 * have to be included an can therefore be
 * used inside maps. For cleaner code!
 *
 * @param size     { number } in px or unitless number
 * @param return   { size } in em value
 */
/* ----------------------------------------
    Font Merge
---------------------------------------- */
/**
 * This is a additional function that calls
 * the map-blend function for cleaner syntax.
 *
 * @param map1      { map }
 * @param map1      { map }
 * @returns         { map } merged map1 and map2
 */
/* ----------------------------------------
    Media Query
---------------------------------------- */
/**
 * This helper function will format a given
 * breakpoint (based on the config) to a
 * Bourbon Neat media value.
 *
 * @param breakpoint  { string }
 * @param type        { string }
 * @returns           { string }
 */
/* ----------------------------------------
    Gutter
---------------------------------------- */
/**
 * This function will retrieve a a given
 * gutter of a breakpoint map.
 *
 * @param breakpoint  { map }
 * @param type        { string }
 * @returns           { string }
 */
/* ----------------------------------------
     List Casting
---------------------------------------- */
/**
 * This function will return a list of
 * given values.
 *
 * @author          Hugo Giraudel
 * @link            https://github.com/HugoGiraudel
 *
 * @param args      { string/list/map }
 * @returns         { list }
 */
/* ----------------------------------------
    List Convert Pair
---------------------------------------- */
/**
 * This function will accept a map with
 * key value pairs and output a proper
 * CSS property value pair
 *
 * @param map       { list }
 * @returns         { string }
 */
/* ----------------------------------------
     List Empty
---------------------------------------- */
/**
 * This function will check if a list
 * is empty
 *
 * @param list      { list }
 * @returns         { boolean }
 */
/* ----------------------------------------
    List Contains
---------------------------------------- */
/**
 * This function will check if a list
 * contains a specific value.
 *
 * @param list      { list }
 * @param value     { string }
 * @returns         { boolean }
 */
/* ----------------------------------------
     Map Empty
---------------------------------------- */
/**
 * This function will check if a list
 * is empty.
 *
 * @param map       { map }
 * @returns         { boolean }
 */
/* ----------------------------------------
    Map Add Pair
---------------------------------------- */
/**
 * This function will accept a key value
 * pair to be added to a existing map.
 *
 * @param map       { map }
 * @param new       { map } value pairs
 * @returns         { map }
 */
/* ----------------------------------------
    Map Return Pair
---------------------------------------- */
/**
 * This function will return a list of
 * a key value pair based on a given key
 * within a map.
 *
 * @param map       { map }
 * @param key       { string }
 * @returns         { pair }
 */
/* ----------------------------------------
    Map Collection
---------------------------------------- */
/**
 * This function will return a collection
 * of given maps as one major map!
 *
 * @param maps      { map }
 * @returns         { map }
 */
/* ----------------------------------------
    Map Fetch
---------------------------------------- */
/**
 * This function will take several keys
 * to find a specific value contained
 * within a multidimensional map.
 *
 * @param maps      { map }
 * @param keys      { string }
 * @returns         { map }
 */
/* ----------------------------------------
     Map Blend
---------------------------------------- */
/**
 * This function will recursively merge two
 * maps for global and local scope flexibility.
 * So you can extend or change some of the
 * global values stored within a map.
 *
 * @author          Zsolt Pentz
 * @link            https://github.com/pentzzsolt
 *
 * @param map1      { map } global map
 * @param map1      { map } local map
 * @returns         { map } combined map
 */
/* ----------------------------------------
     Map Reverse
---------------------------------------- */
/**
 * This function will reverse the order of
 * a given map en output the new map
 *
 * @author          Sean McEmerson
 * @link            https://github.com/seanislegend
 *
 * @param map       { map }
 * @returns         { map } reversed map
 */
/* ----------------------------------------
     String Casting
---------------------------------------- */
/**
 * This function will return a string
 * of a given value.
 *
 * @author          Hugo Giraudel
 * @link            https://github.com/HugoGiraudel
 *
 * @param value     { list/map }
 */
/* ----------------------------------------
    String Contains
---------------------------------------- */
/**
 * This function will find if a specific
 * word is present in a string.
 *
 * @requires string { string }
 * @requires find   { string }
 */
/* ----------------------------------------
    String Replace
---------------------------------------- */
/**
 * This function will find a character
 * within in a string.
 *
 * @author          Jonathan Neal
 * @link            https://github.com/jonathantneal
 *
 * @requires string { string }
 * @requires search { string }
 * @params replace  { string }
 */
/* ----------------------------------------
    String to List
---------------------------------------- */
/**
 * This function will convert a string to
 * a list, added some custom tweaks to
 * original code.
 *
 * @author          Beni Buess
 * @link            https://github.com/benib
 *
 * @requires string { string }
 * @params separator { string }
 * @params start    { number }
 * @returns         { string }
 */
/* ----------------------------------------
    Mixins
---------------------------------------- */
/* ----------------------------------------
    Float
---------------------------------------- */
/**
 * This is a mixin that will set a float
 * to the given element.
 *
 * EXAMPLE
 *
 * .demo-class {
 *     @include float;
 * }
 */
/* ----------------------------------------
    Position
---------------------------------------- */
/**
 * This is a mixin that will return property
 * and values for a given map value.
 *
 * EXAMPLE
 *
 * .demo-class {
 *     @include position();
 * }
 */
/* ----------------------------------------
    Position Absolute
---------------------------------------- */
/**
 * This is a shorthand mixin to absolute
 * position a element.
 *
 * EXAMPLE
 *
 * .demo-class {
 *     @include absolute((top: 0px, left: 0px));
 * }
 */
/* ----------------------------------------
    Position Relative
---------------------------------------- */
/**
 * This is a shorthand mixin to relative
 * position a element.
 *
 * EXAMPLE
 *
 * .demo-class {
 *     @include relative((top: 0px, left: 0px));
 * }
 */
/* ----------------------------------------
    Position Fixed
---------------------------------------- */
/**
 * This is a shorthand mixin to fixed
 * position a element.
 *
 * EXAMPLE
 *
 * .demo-class {
 *     @include fixed((top: 0px, left: 0px));
 * }
 */
/* ----------------------------------------
    Center Block
---------------------------------------- */
/**
 * EXAMPLE
 *
 * .demo-class {
 *     @include center;
 * }
 */
/* ----------------------------------------
    Inner Block
---------------------------------------- */
/**
 * EXAMPLE
 *
 * .demo-class {
 *    &__inner {
 *      @include inner(2rem, 4rem);
 *    }
 * }
 */
/* ----------------------------------------
    Flex Center
---------------------------------------- */
/**
 * EXAMPLE
 *
 * .demo-class {
 *     @include flex-center;
 * }
 */
/* ----------------------------------------
    Flex Vertical Center
---------------------------------------- */
/**
 * EXAMPLE
 *
 * .demo-class {
 *     @include flex-vertical-center;
 * }
 */
/* ----------------------------------------
    Default Flex Child
---------------------------------------- */
/**
 * EXAMPLE
 *
 * .demo-class {
 *     @include flex-child;
 * }
 */
/* ----------------------------------------
    Flex Grow Child
---------------------------------------- */
/**
 * EXAMPLE
 *
 * .demo-class {
 *     @include flex-child-grow;
 * }
 */
/* ----------------------------------------
    Flex Space Between
---------------------------------------- */
/**
 * EXAMPLE
 *
 * .demo-class {
 *     @include flex-space-between;
 * }
 */
/* ----------------------------------------
    To Props
---------------------------------------- */
/**
 * This is a mixin that will return property
 * and values for a given map value.
 *
 * EXAMPLE
 *
 * .demo-class {
 *     @include to-props(top: 0px, left: 0px);
 * }
 *
 * OUTPUT
 *
 * .demo-class {
 *    top: 0px;
 *    left: 0px;
 * }
 */
/* ----------------------------------------
    Prefix
---------------------------------------- */
/**
 * @author          Hugo Giraudel
 * @link            https://github.com/HugoGiraudel
 *
 * EXAMPLE
 *
 * .demo-class {
 *    @include prefix((
 *      transform: translate(50px)
 *    ), webkit);
 * }
 */
/* ----------------------------------------
    Pseudo Selector
---------------------------------------- */
/**
 * EXAMPLE
 *
 * .demo-class {
 *    &:before {
 *      @include pseudo;
 *    }
 * }
 */
/* ----------------------------------------
    No Drag
---------------------------------------- */
/**
 * EXAMPLE
 *
 * .demo-class {
 *    @include no-drag;
 * }
 */
/* ----------------------------------------
    Clip hexagon
---------------------------------------- */
/**
 * EXAMPLE
 *
 * .demo-class {
 *    @include clip-hex;
 * }
 */
/* ----------------------------------------
    Debug Variable Output
---------------------------------------- */
/**
 * This mixin will set a before tag on
 * it's parent element and display the
 * the contents of variable within.
 *
 * EXAMPLE
 *
 * .demo-class {
 *    @include debug-output($global-colors);
 * }
 */
/* ----------------------------------------
    Debug Selector
---------------------------------------- */
/**
 * This mixin will set a before tag on
 * it's parent element and display the
 * name of the selector.
 *
 * EXAMPLE
 *
 * .demo-class {
 *    @include debug-selector;
 * }
 */
/* ----------------------------------------
    Debug Example
---------------------------------------- */
/**
 * This mixin will set a before tag on
 * the first element within it's parent.
 * Used to get going styling all UI
 * components in the example page.
 *
 * EXAMPLE
 *
 * .demo-class {
 *    @include debug-example();
 * }
 */
/* ----------------------------------------
    Debug Responsive Values
---------------------------------------- */
/**
 * This mixin will set a before tag on
 * it's parent and show the value of the
 * available breakpoints depending on
 * the current viewport for debugging
 * purposes.
 *
 * EXAMPLE
 *
 * .demo-class {
 *    @include debug-responsive();
 * }
 */
/* ----------------------------------------
    Clearfix
---------------------------------------- */
/**
 * EXAMPLE
 *
 * .demo-class {
 *     @include grid-clearfix;
 * }
 */
/* ----------------------------------------
    Fetch Color
---------------------------------------- */
/**
 * This mixin is used to fetch a particular
 * color of the global configured map.
 *
 * EXAMPLE
 *
 * .demo-class {
 *    @include branding(background, primary, default);
 * }
 *
 * OUTPUT
 *
 * .demo-class-blue {
 *    background: #000
 * }
 */
/* ----------------------------------------
    Fetch Shorthand
---------------------------------------- */
/**
 * This shorthand will fetch a color for
 * a given key from the primary color values.
 *
 * EXAMPLE
 *
 * .demo-class {
 *    @include primary(dark);
 * }
 *
 * OUTPUT
 *
 * .demo-class-blue {
 *    background: #000
 * }
 */
/* ----------------------------------------
    Color Combinations
---------------------------------------- */
/**
 * This mixin will use the root element
 * as a prefix for every color available
 * within a combination. Check the config
 * folder for the color combinations.
 *
 * EXAMPLE
 *
 * .demo-class {
 *    @include color-combinations;
 * }
 *
 * OUTPUT
 *
 * .demo-class-blue {
 *    background: blue;
 *    color: black;
 * }
 */
/* ----------------------------------------
    Fetch Combination
---------------------------------------- */
/**
 * This mixin will return a contrasting
 * color based on a given background color.
 *
 * EXAMPLE
 *
 * .demo-class {
 *    @include combi(banana);
 * }
 */
/* ----------------------------------------
    Contrast Color
---------------------------------------- */
/**
 * This mixin will return a contrasting
 * color based on a given background color.
 *
 * EXAMPLE
 *
 * .demo-class {
 *    @include contrast(#000);
 * }
 */
/* ----------------------------------------
    Contrast Color B/W
---------------------------------------- */
/**
 * This mixin will return a contrasting
 * black or white color based on a given
 * background color.
 *
 * EXAMPLE
 *
 * .demo-class {
 *    @include contrast(#000);
 * }
 */
/* ----------------------------------------
    SVG Fill
---------------------------------------- */
/**
 * This mixin will fill a svg, you can
 * still tweak the values as content of
 * the mixin.
 *
 * EXAMPLE
 *
 * .demo-class {
 *    @include svg(color('black'));
 * }
 */
/* ----------------------------------------
    Font Styles
---------------------------------------- */
/**
 * This mixin will return all key value
 * pairs that are associated with a map
 * of font related styling.
 *
 * @type            { string }  the selected style
 * @font-map        { map }     default selected $global-text from config/fonts
 * @returns         { string }  all key value pairs
 *
 * EXAMPLE
 *
 * .demo-class {
 *    @include font(default);
 * }
 *
 * OUTPUT
 *
 * .demo-class {
 *    font-size: 1em;
 *    color: #000;
 * }
 */
/* ----------------------------------------
    Font Value
---------------------------------------- */
/**
 * This mixin will return all specific key value
 * pair that are associated with a map of font
 * related styling.
 *
 * @type            { string }  the related type of style
 * @prop            { string }  selected css property
 * @font-map        { map }     default selected $text from config/fonts
 * @returns         { string }  key value pair
 *
 * EXAMPLE
 *
 * .demo-class {
 *    @include font(default, font-weight);
 * }
 *
 * OUTPUT
 *
 * .demo-class {
 *    font-weight: 700;
 * }
 */
/* ----------------------------------------
    Font Exclude
---------------------------------------- */
/**
 * This mixin will return all specific key value
 * pair that are associated with a map and exclude
 * given properties.
 *
 * @type            { string }
 * @excl            { string }
 * @font-map        { map }
 * @returns         { string }  key value pair
 *
 * EXAMPLE
 *
 * .demo-class {
 *    @include font-exclude(default, font-weight);
 * }
 *
 * OUTPUT
 *
 * .demo-class {
 *    font-size: 1em;
 *    line-height: 1.5em;
 * }
 */
/* ----------------------------------------
    Font Face
---------------------------------------- */
/**
 * This mixin will set a custom font
 * face given given values.
 *
 * @author          Jonathan Neal
 * @link            https://github.com/jonathantneal
 *
 * @name            { string } name of the font
 * @file            { string } name of the file
 * @weight          { string } font-weight
 * @style           { string } font-style
 * @exts            { string } format
 * @returns         { string } complete font-face
 */
/* ----------------------------------------
    Font Smoothing
---------------------------------------- */
/**
 * EXAMPLE
 *
 * .demo-class {
 *    @include font-smoothing(antialiased);
 * }
 */
/* ----------------------------------------
    Font Heading
---------------------------------------- */
/**
 * This mixin will return all specific key value
 * pair that are associated with a map of font
 * related styling.
 *
 * @param start     { number }
 * @param end       { number }
 *
 * EXAMPLE
 *
 * .demo-class {
 *    @include header(1,3){
 *      @include font-size(20px);
 *    }
 * }
 *
 * OUTPUT
 *
 * .demo-class {
 *    h1, h2, h3 {
 *      font-size 1.5em;
 *    }
 * }
 */
/* ----------------------------------------
    Font Size
---------------------------------------- */
/**
 * This mixin will take a number or px value
 * and calculate the em value.
 *
 * @param size      { number/value }
 *
 * EXAMPLE
 *
 * .demo-class {
 *    @include font-size(16px);
 * }
 *
 * OUTPUT
 *
 * .demo-class {
 *    font-size 1em
 * }
 */
/* ----------------------------------------
    Line Height
---------------------------------------- */
/**
 * EXAMPLE
 *
 * .demo-class {
 *    @include line-height(16px);
 * }
 */
/* ----------------------------------------
    Letter Spacing
---------------------------------------- */
/**
 * EXAMPLE
 *
 * .demo-class {
 *    @include letter-spacing(1px);
 * }
 */
/* ----------------------------------------
    Line Break
---------------------------------------- */
/**
 * EXAMPLE
 *
 * .demo-class {
 *    @include line-break;
 * }
 */
/* ----------------------------------------
    Line Clamp
---------------------------------------- */
/**
 * EXAMPLE
 *
 * .demo-class {
 *    @include line-clamp(5);
 * }
 */
/* ----------------------------------------
    Ellipsis
---------------------------------------- */
/**
 * EXAMPLE
 *
 * .demo-class {
 *    @include ellipsis(100%);
 * }
 */
/* ----------------------------------------
    Root
---------------------------------------- */
/* ----------------------------------------
    Placeholder
---------------------------------------- */
/**
 * EXAMPLE
 *
 * .demo-class {
 *    @include placeholder {
 *      @include font-size(14px);
 *      color: red;
 *    }
 * }
 */
/* ----------------------------------------
    Breakpoints
---------------------------------------- */
/**
 * This mixin will set media queries based
 * on selected parameters.
 *
 * @requires viewport   { string/list }
 * @params type         { string } min or max default: max
 * @params orientation  { string } landscape or portrait
 * @params screen       { string } default: screen
 * @params breakpoints  { map } default: $global-breakpoints
 *
 * EXAMPLE
 *
 * .demo-class {
 *    padding: 20px;
 *
 *    @include mq(phone tablet) {
 *      padding: 30px;
 *    }
 *
 *    @include mq(tablet, 'min') {
 *      padding: 40px;
 *    }
 *
 *    @include mq(phone tablet, 'max', landscape) {
 *      padding: 30px;
 *    }
 * }
 *
 * OUTPUT
 *
 * @media screen and (min-width: 420px) and (max-width: 959px) {
 *   .demo-class {
 *     padding: 30px; }
 *   }
 * }
 *
 * @media screen and (min-width: 960px) {
 *   .demo-class {
 *     padding: 40px; }
 *   }
 * }
 *
 * @media screen and (min-width: 420px) and (max-width: 959px) and (orientation: landscape) {
 *   .demo-class {
 *     padding: 30px; }
 *   }
 * }
 */
/* ----------------------------------------
    Aspect Ratio
---------------------------------------- */
/**
 * EXAMPLE
 *
 * .demo-class {
 *    @include aspect-ratio(16,9);
 * }
 */
/* ----------------------------------------
     Theme Styling
---------------------------------------- */
/**
 * This function will output content if
 * a given string is equal to the current
 * theme. The $theme variable is created
 * within the sass-loader of the webpack
 * file an can be tweaked within this
 * configuration.
 *
 * EXAMPLE
 *
 * .demo-class {
 *    @include theme('design') {
 *       background: color('pink');
 *    }
 *
 *    @include theme('digital') {
 *       background: color('blue');
 *    }
 * }
 */
/* ----------------------------------------
    Classes
---------------------------------------- */
/* ----------------------------------------
    Absolute Middle
---------------------------------------- */
/**
 * EXAMPLE
 *
 * .demo-class {
 *    @extend %abs-middle-content;
 * }
 */
.vv-letter-card__overlay, .vv-color-card__overlay, .lightbox img {
  width: 100%;
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 100;
  transform: translate(-50%, -50%); }

/* ----------------------------------------
    Middle
---------------------------------------- */
/**
 *
 * EXAMPLE
 *
 * .demo-class {
 *    @extend %middle-content;
 * }
 *
 */
/* ----------------------------------------
    Cover Image
---------------------------------------- */
/**
 *
 * EXAMPLE
 *
 * .demo-class
 *    @extend %cover-img;
 * }
 *
 */
.header-slider__image img, .hex-image img, .image__cover, .video__img, .fund-slider .overview-card__image img, .magazine-slider .overview-card__card img, .magazine-detail__image img, .magazine-detail-author__image img, .news-detail__image img, .project-detail__image img, .fund-detail-header__header-image img, .fund-detail-contact-us__image img, .project-slide__image img {
  width: auto;
  min-width: 101%;
  height: 100%;
  max-height: auto;
  position: absolute;
  top: 50% !important;
  left: 50% !important;
  display: block;
  object-fit: cover;
  transform: translate(-50%, -50%); }

/* ----------------------------------------
    Full Screen
---------------------------------------- */
/**
 *
 * EXAMPLE
 *
 * .demo-class {
 *    @extend %fullscreen;
 * }
 *
 */
/* ----------------------------------------
    Center content
---------------------------------------- */
/**
 *
 * EXAMPLE
 *
 * <div class="text-center">
 *   <p>Centered text</p>
 * </div>
 */
.text-center {
  text-align: center; }

@media screen and (min-width: 0\0) {
  .visible\:ie {
    display: block !important; } }

_:-ms-lang(x), .visible\:ie {
  display: block !important; }

/* ----------------------------------------
    Overlay
---------------------------------------- */
/**
 * EXAMPLE
 *
 * .demo-class {
 *    @extend %overlay;
 * }
 */
/* ----------------------------------------
    Video Player
---------------------------------------- */
/**
 * EXAMPLE
 *
 * .demo-class {
 *    @extend %player;
 * }
 */
.player {
  position: relative; }
  .player:before {
    content: "";
    position: relative;
    display: inline-block;
    width: 100%;
    padding-top: 56.25%; }
  .player img {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0; }
    @supports (object-fit: cover) {
      .player img {
        object-fit: cover; } }
  .player iframe {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 50%;
    left: 50%;
    display: block;
    transform: translate(-50%, -50%); }

/* ----------------------------------------
    Spacer
---------------------------------------- */
/**
 * EXAMPLE
 *
 * .demo-class {
 *    @extend .padding-width-20;
 * }
 */
/* ----------------------------------------
    Create Spacers
---------------------------------------- */
.mt-8 {
  margin-top: 2rem; }

.mt-16 {
  margin-top: 4rem; }

/* ----------------------------------------
    Animations
---------------------------------------- */
/* ----------------------------------------
    Fade Animation
---------------------------------------- */
/**
 * Example usage
 *
 * .demo-class {
 *    animation: fade-in 0.75s ease-in-out;
 *    animation-iteration-count: 1;
 *    animation-fill-mode: forwards;
 * }
 *
 */
@keyframes fade-in {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }

@keyframes fade-out {
  0% {
    opacity: 1; }
  100% {
    opacity: 0; } }

/* ----------------------------------------
    Pop Animation
---------------------------------------- */
/**
 * Example usage
 *
 * .demo-class {
 *    animation: pop 0.75s ease-in-out;
 *    animation-iteration-count: 1;
 *    animation-fill-mode: forwards;
 * }
 *
 */
@keyframes pop-in {
  0% {
    transform: scale(0); }
  40% {
    transform: scale(1.1); }
  65% {
    transform: scale(0.95); }
  80% {
    transform: scale(1.025); }
  100% {
    transform: scale(1); } }

@keyframes pop-out {
  0% {
    transform: scale(1); }
  100% {
    transform: scale(0); } }

/* ----------------------------------------
    Pulse Animation
---------------------------------------- */
/**
 * Example usage
 *
 * .demo-class {
 *    animation: pulse 1.75s ease-in-out;
 *    animation-iteration-count: infinite;
 * }
 *
 */
@keyframes pulse {
  0% {
    transform: translateY(-50%) scale(1); }
  50% {
    transform: translateY(-50%) scale(1.05); }
  90%,
  100% {
    transform: translateY(-50%) scale(1); } }

/* ----------------------------------------
    Skew Animation
---------------------------------------- */
/**
 * Example usage
 *
 * .demo-class {
 *    animation: skew 0.75s ease-in-out;
 *    animation-iteration-count: 1;
 *    animation-fill-mode: forwards;
 * }
 *
 */
@keyframes skew {
  0% {
    transform: skewX(0deg); }
  100% {
    transform: skewX(-10deg); } }

/* ----------------------------------------
    Turn Animation
---------------------------------------- */
/**
 * Example usage
 *
 * .demo-class {
 *    animation: spin 0.75s ease-in-out;
 *    animation-iteration-count: 1;
 *    animation-fill-mode: forwards;
 * }
 *
 */
@keyframes spin {
  0% {
    transform: rotate(0deg); }
  100% {
    transform: rotate(360deg); } }

@keyframes anti-spin {
  0% {
    transform: rotate(0deg); }
  100% {
    transform: rotate(-360deg); } }

/* ----------------------------------------
    Generators
---------------------------------------- */
/* ----------------------------------------
    Branding Colors
---------------------------------------- */
/**
 * This map includes all main colors
 * that will be used within the project.
 */
/**
 * This map includes all button text colors
 * that will be used within the project.
 */
/* ----------------------------------------
    Branding Combinations
---------------------------------------- */
/**
 * I case you wan't to use specific color
 * combinations, you can add these to this
 * multi dimensional map. These should
 * always consist of a background and
 * color combination.
 */
/* ----------------------------------------
    Branding Values
---------------------------------------- */
/**
 * Cluster brand variables within this map
 * with custom names. Comes in handy if you
 * have specific names for certain color
 * values. Use map-fetch function to get the
 * value of particular map, there are also
 * some shorthand mixins to include colors.
 */
/* ----------------------------------------
    Export Colors JS
---------------------------------------- */

/* ----------------------------------------
    Color Classes
---------------------------------------- */
/**
 * This loop will generate color classes
 * looking for the available primary
 * selected colors.
 */
.color\:blue {
  color: #002F87; }

.color\:hover\:blue:hover {
  color: #002F87; }

.back\:blue {
  background: #002F87; }

.back\:hover\:blue:hover {
  color: #002F87; }

.color\:lightblue {
  color: #EBEFF2; }

.color\:hover\:lightblue:hover {
  color: #EBEFF2; }

.back\:lightblue {
  background: #EBEFF2; }

.back\:hover\:lightblue:hover {
  color: #EBEFF2; }

.color\:green {
  color: #B5D9B9; }

.color\:hover\:green:hover {
  color: #B5D9B9; }

.back\:green {
  background: #B5D9B9; }

.back\:hover\:green:hover {
  color: #B5D9B9; }

.color\:pink {
  color: #F9CDD0; }

.color\:hover\:pink:hover {
  color: #F9CDD0; }

.back\:pink {
  background: #F9CDD0; }

.back\:hover\:pink:hover {
  color: #F9CDD0; }

.color\:white {
  color: #FFFFFF; }

.color\:hover\:white:hover {
  color: #FFFFFF; }

.back\:white {
  background: #FFFFFF; }

.back\:hover\:white:hover {
  color: #FFFFFF; }

.color\:lightgrey {
  color: #DEE3E7; }

.color\:hover\:lightgrey:hover {
  color: #DEE3E7; }

.back\:lightgrey {
  background: #DEE3E7; }

.back\:hover\:lightgrey:hover {
  color: #DEE3E7; }

.color\:grey {
  color: #899299; }

.color\:hover\:grey:hover {
  color: #899299; }

.back\:grey {
  background: #899299; }

.back\:hover\:grey:hover {
  color: #899299; }

.color\:black {
  color: #181716; }

.color\:hover\:black:hover {
  color: #181716; }

.back\:black {
  background: #181716; }

.back\:hover\:black:hover {
  color: #181716; }

.color\:error {
  color: #F56565; }

.color\:hover\:error:hover {
  color: #F56565; }

.back\:error {
  background: #F56565; }

.back\:hover\:error:hover {
  color: #F56565; }

/* ----------------------------------------
    Color Combination Classes
---------------------------------------- */
/**
 * This loop will generate combination
 * classes looking for the available
 * combinations as declared inside the
 * color configuration.
 */
.combi\:pink {
  background: #F9CDD0;
  color: #002F87; }

.combi\:green {
  background: #B5D9B9;
  color: #002F87; }

.combi\:lightgrey {
  background: #DEE3E7;
  color: #002F87; }

.combi\:blue {
  background: #002F87;
  color: #FFFFFF; }

/* ----------------------------------------
    Font Face
---------------------------------------- */
@font-face {
  font-family: "Lubalin";
  font-weight: 600;
  font-style: bold;
  src: url("../../fonts/LubalinGraphITCbyBT-Demi.otf") format("opentype"); }

@font-face {
  font-family: "Lubalin";
  font-weight: 300;
  font-style: normal;
  src: url("../../fonts/LubalinGraphITCbyBT-Book.otf") format("opentype"); }

@font-face {
  font-family: "Lubalin";
  font-weight: 500;
  font-style: normal;
  src: url("../../fonts/LubalinGraphITCbyBT-Medium.otf") format("opentype"); }

@font-face {
  font-family: "Nimbus";
  font-weight: 300;
  font-style: normal;
  src: url("../../fonts/NimbusSansNovusTOT-Reg.otf") format("opentype"); }

/* ----------------------------------------
    Font Variables
---------------------------------------- */
/* ----------------------------------------
    Text Styles
---------------------------------------- */
/**
 * This sections specifies some of the
 * core font styling. You can declare
 * new maps inside this global variable
 * for use with the font mixin.
 */
/* ----------------------------------------
    Export Fonts JS
---------------------------------------- */

/* ----------------------------------------
    Font Classes
---------------------------------------- */
/**
 * This loop will generate color classes
 * looking for the available primary
 * selected colors.
 */
.font\:default {
  font-family: "Lubalin", "Helvetica", sans-serif;
  font-size: 1em;
  font-style: italic;
  font-weight: 300;
  line-height: 1.5em;
  color: #002F87; }

.font\:detail_title {
  font-family: "Lubalin", "Helvetica", sans-serif;
  font-size: 1.125em;
  font-weight: 600;
  line-height: 1.5rem;
  color: #002F87; }

.font\:detail_info {
  font-family: "Nimbus", "Helvetica", sans-serif;
  font-size: 1.1875em;
  font-weight: 300;
  line-height: 1.5rem;
  color: #002F87; }

.font\:text_tiny {
  font-family: "Nimbus", "Helvetica", sans-serif;
  font-size: 0.9375em;
  font-weight: 300;
  line-height: 1.25em; }

.font\:text_small {
  font-family: "Nimbus", "Helvetica", sans-serif;
  font-size: 1.1875em;
  font-weight: 300;
  line-height: 1.5em; }

.font\:text_large {
  font-family: "Lubalin", "Helvetica", sans-serif;
  font-size: 1.375em;
  font-weight: 300;
  line-height: 1.35em; }

.font\:project_title {
  font-family: "Lubalin", "Helvetica", sans-serif;
  font-size: 3em;
  font-weight: 500;
  line-height: 1.25em; }

.font\:large_title {
  font-family: "Lubalin", "Helvetica", sans-serif;
  font-weight: 600;
  line-height: 1.25em; }

.font\:quote {
  width: 90%;
  margin: 1em auto;
  font-family: "Lubalin", "Helvetica", sans-serif;
  font-size: 2.5em;
  font-weight: 500;
  text-align: center; }

.font\:quote_author {
  font-family: "Nimbus", "Helvetica", sans-serif;
  font-size: 1.3125em;
  font-style: normal;
  text-align: center; }

.font\:caption {
  width: 80%;
  margin: 1em auto;
  font-family: "Nimbus", "Helvetica", sans-serif;
  font-size: 0.9375em;
  font-weight: 500;
  font-style: normal;
  text-align: center;
  overflow: hidden; }

.font\:footer_title {
  margin-bottom: 1em;
  font-family: "Lubalin", "Helvetica", sans-serif;
  font-size: 1.25em;
  font-weight: 600; }

.font\:footer_item {
  font-family: "Nimbus", "Helvetica", sans-serif;
  font-size: 1.125em;
  line-height: 1.55em; }

.font\:debug {
  font-family: "Nimbus", "Helvetica", sans-serif;
  font-size: 0.9375em;
  font-style: normal; }

/* ----------------------------------------
    Breakpoints
---------------------------------------- */
/**
 * These breakpoints can be used within
 * the media query mixin. Feel free to
 * tweak or declare new values within
 * this map, the mixin will automatically
 * include them as an option.
 */
/* ----------------------------------------
    Hidden & Visible
---------------------------------------- */
@media screen and (min-width: 0) and (max-width: 419px) {
  .hidden--phone {
    display: none; } }

@media screen and (min-width: 0) and (max-width: 559px) {
  .hidden--phone-wide {
    display: none; } }

@media screen and (min-width: 0) and (max-width: 639px) {
  .hidden--phablet {
    display: none; } }

@media screen and (min-width: 0) and (max-width: 767px) {
  .hidden--tablet-small {
    display: none; } }

@media screen and (min-width: 0) and (max-width: 959px) {
  .hidden--tablet {
    display: none; } }

@media screen and (min-width: 0) and (max-width: 1079px) {
  .hidden--tablet-wide {
    display: none; } }

@media screen and (min-width: 0) and (max-width: 1279px) {
  .hidden--desktop {
    display: none; } }

@media screen and (min-width: 0) and (max-width: 1439px) {
  .hidden--desktop-wide {
    display: none; } }

@media screen and (min-width: 0) and (max-width: 1599px) {
  .hidden--desktop-wider {
    display: none; } }

@media screen and (min-width: 0) and (max-width: 1919px) {
  .hidden--desktop-massive {
    display: none; } }

@media screen and (min-width: 0) and (max-width: 2439px) {
  .hidden--desktop-ultra {
    display: none; } }

.visible {
  display: none; }
  @media screen and (min-width: 0) and (max-width: 419px) {
    .visible--phone {
      display: block; } }
  @media screen and (min-width: 0) and (max-width: 559px) {
    .visible--phone-wide {
      display: block; } }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .visible--phablet {
      display: block; } }
  @media screen and (min-width: 0) and (max-width: 767px) {
    .visible--tablet-small {
      display: block; } }
  @media screen and (min-width: 0) and (max-width: 959px) {
    .visible--tablet {
      display: block; } }
  @media screen and (min-width: 0) and (max-width: 1079px) {
    .visible--tablet-wide {
      display: block; } }
  @media screen and (min-width: 0) and (max-width: 1279px) {
    .visible--desktop {
      display: block; } }
  @media screen and (min-width: 0) and (max-width: 1439px) {
    .visible--desktop-wide {
      display: block; } }
  @media screen and (min-width: 0) and (max-width: 1599px) {
    .visible--desktop-wider {
      display: block; } }
  @media screen and (min-width: 0) and (max-width: 1919px) {
    .visible--desktop-massive {
      display: block; } }
  @media screen and (min-width: 0) and (max-width: 2439px) {
    .visible--desktop-ultra {
      display: block; } }

/* ----------------------------------------
    Support classes
---------------------------------------- */
@media screen and (min-width: 1080px) {
  .md\:relative {
    position: relative; }
  .md\:absolute {
    position: absolute; }
  .md\:overflow-visible {
    overflow: visible !important; }
  .md\:z-999 {
    z-index: 999; }
  .md\:right-8 {
    right: 2rem; } }

/* ----------------------------------------
    Export Breakpoints JS
---------------------------------------- */

/* ----------------------------------------
    Hidden & Visible
---------------------------------------- */
/**
 * These classes can be added within the
 * DOM to make an element either visible
 * or hidden within a certain view.
 */
@media screen and (min-width: 0) and (max-width: 419px) {
  .hidden\:phone\:max {
    display: none; } }

@media screen and (min-width: 420px) {
  .hidden\:phone\:min {
    display: none; } }

@media screen and (min-width: 0) and (max-width: 559px) {
  .hidden\:phone-wide\:max {
    display: none; } }

@media screen and (min-width: 560px) {
  .hidden\:phone-wide\:min {
    display: none; } }

@media screen and (min-width: 0) and (max-width: 639px) {
  .hidden\:phablet\:max {
    display: none; } }

@media screen and (min-width: 640px) {
  .hidden\:phablet\:min {
    display: none; } }

@media screen and (min-width: 0) and (max-width: 767px) {
  .hidden\:tablet-small\:max {
    display: none; } }

@media screen and (min-width: 768px) {
  .hidden\:tablet-small\:min {
    display: none; } }

@media screen and (min-width: 0) and (max-width: 959px) {
  .hidden\:tablet\:max {
    display: none; } }

@media screen and (min-width: 960px) {
  .hidden\:tablet\:min {
    display: none; } }

@media screen and (min-width: 0) and (max-width: 1079px) {
  .hidden\:tablet-wide\:max {
    display: none; } }

@media screen and (min-width: 1080px) {
  .hidden\:tablet-wide\:min {
    display: none; } }

@media screen and (min-width: 0) and (max-width: 1279px) {
  .hidden\:desktop\:max {
    display: none; } }

@media screen and (min-width: 1280px) {
  .hidden\:desktop\:min {
    display: none; } }

@media screen and (min-width: 0) and (max-width: 1439px) {
  .hidden\:desktop-wide\:max {
    display: none; } }

@media screen and (min-width: 1440px) {
  .hidden\:desktop-wide\:min {
    display: none; } }

@media screen and (min-width: 0) and (max-width: 1599px) {
  .hidden\:desktop-wider\:max {
    display: none; } }

@media screen and (min-width: 1600px) {
  .hidden\:desktop-wider\:min {
    display: none; } }

@media screen and (min-width: 0) and (max-width: 1919px) {
  .hidden\:desktop-massive\:max {
    display: none; } }

@media screen and (min-width: 1920px) {
  .hidden\:desktop-massive\:min {
    display: none; } }

@media screen and (min-width: 0) and (max-width: 2439px) {
  .hidden\:desktop-ultra\:max {
    display: none; } }

@media screen and (min-width: 2440px) {
  .hidden\:desktop-ultra\:min {
    display: none; } }

@media screen and (min-width: 0) and (max-width: 419px) {
  .visible\:phone\:max {
    display: block; } }

@media screen and (min-width: 420px) {
  .visible\:phone\:min {
    display: block; } }

@media screen and (min-width: 0) and (max-width: 559px) {
  .visible\:phone-wide\:max {
    display: block; } }

@media screen and (min-width: 560px) {
  .visible\:phone-wide\:min {
    display: block; } }

@media screen and (min-width: 0) and (max-width: 639px) {
  .visible\:phablet\:max {
    display: block; } }

@media screen and (min-width: 640px) {
  .visible\:phablet\:min {
    display: block; } }

@media screen and (min-width: 0) and (max-width: 767px) {
  .visible\:tablet-small\:max {
    display: block; } }

@media screen and (min-width: 768px) {
  .visible\:tablet-small\:min {
    display: block; } }

@media screen and (min-width: 0) and (max-width: 959px) {
  .visible\:tablet\:max {
    display: block; } }

@media screen and (min-width: 960px) {
  .visible\:tablet\:min {
    display: block; } }

@media screen and (min-width: 0) and (max-width: 1079px) {
  .visible\:tablet-wide\:max {
    display: block; } }

@media screen and (min-width: 1080px) {
  .visible\:tablet-wide\:min {
    display: block; } }

@media screen and (min-width: 0) and (max-width: 1279px) {
  .visible\:desktop\:max {
    display: block; } }

@media screen and (min-width: 1280px) {
  .visible\:desktop\:min {
    display: block; } }

@media screen and (min-width: 0) and (max-width: 1439px) {
  .visible\:desktop-wide\:max {
    display: block; } }

@media screen and (min-width: 1440px) {
  .visible\:desktop-wide\:min {
    display: block; } }

@media screen and (min-width: 0) and (max-width: 1599px) {
  .visible\:desktop-wider\:max {
    display: block; } }

@media screen and (min-width: 1600px) {
  .visible\:desktop-wider\:min {
    display: block; } }

@media screen and (min-width: 0) and (max-width: 1919px) {
  .visible\:desktop-massive\:max {
    display: block; } }

@media screen and (min-width: 1920px) {
  .visible\:desktop-massive\:min {
    display: block; } }

@media screen and (min-width: 0) and (max-width: 2439px) {
  .visible\:desktop-ultra\:max {
    display: block; } }

@media screen and (min-width: 2440px) {
  .visible\:desktop-ultra\:min {
    display: block; } }

/* ----------------------------------------
    Config Files
---------------------------------------- */
/* ----------------------------------------
    Config Files
---------------------------------------- */
/* ----------------------------------------
    Paths
---------------------------------------- */
/**
 * Sometimes u might need to configure
 * a certain path or location, this is
 * the place to go!
 */
/* ----------------------------------------
    Breakpoints
---------------------------------------- */
/**
 * These breakpoints can be used within
 * the media query mixin. Feel free to
 * tweak or declare new values within
 * this map, the mixin will automatically
 * include them as an option.
 */
/* ----------------------------------------
    Hidden & Visible
---------------------------------------- */
@media screen and (min-width: 0) and (max-width: 419px) {
  .hidden--phone {
    display: none; } }

@media screen and (min-width: 0) and (max-width: 559px) {
  .hidden--phone-wide {
    display: none; } }

@media screen and (min-width: 0) and (max-width: 639px) {
  .hidden--phablet {
    display: none; } }

@media screen and (min-width: 0) and (max-width: 767px) {
  .hidden--tablet-small {
    display: none; } }

@media screen and (min-width: 0) and (max-width: 959px) {
  .hidden--tablet {
    display: none; } }

@media screen and (min-width: 0) and (max-width: 1079px) {
  .hidden--tablet-wide {
    display: none; } }

@media screen and (min-width: 0) and (max-width: 1279px) {
  .hidden--desktop {
    display: none; } }

@media screen and (min-width: 0) and (max-width: 1439px) {
  .hidden--desktop-wide {
    display: none; } }

@media screen and (min-width: 0) and (max-width: 1599px) {
  .hidden--desktop-wider {
    display: none; } }

@media screen and (min-width: 0) and (max-width: 1919px) {
  .hidden--desktop-massive {
    display: none; } }

@media screen and (min-width: 0) and (max-width: 2439px) {
  .hidden--desktop-ultra {
    display: none; } }

.visible {
  display: none; }
  @media screen and (min-width: 0) and (max-width: 419px) {
    .visible--phone {
      display: block; } }
  @media screen and (min-width: 0) and (max-width: 559px) {
    .visible--phone-wide {
      display: block; } }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .visible--phablet {
      display: block; } }
  @media screen and (min-width: 0) and (max-width: 767px) {
    .visible--tablet-small {
      display: block; } }
  @media screen and (min-width: 0) and (max-width: 959px) {
    .visible--tablet {
      display: block; } }
  @media screen and (min-width: 0) and (max-width: 1079px) {
    .visible--tablet-wide {
      display: block; } }
  @media screen and (min-width: 0) and (max-width: 1279px) {
    .visible--desktop {
      display: block; } }
  @media screen and (min-width: 0) and (max-width: 1439px) {
    .visible--desktop-wide {
      display: block; } }
  @media screen and (min-width: 0) and (max-width: 1599px) {
    .visible--desktop-wider {
      display: block; } }
  @media screen and (min-width: 0) and (max-width: 1919px) {
    .visible--desktop-massive {
      display: block; } }
  @media screen and (min-width: 0) and (max-width: 2439px) {
    .visible--desktop-ultra {
      display: block; } }

/* ----------------------------------------
    Support classes
---------------------------------------- */
@media screen and (min-width: 1080px) {
  .md\:relative {
    position: relative; }
  .md\:absolute {
    position: absolute; }
  .md\:overflow-visible {
    overflow: visible !important; }
  .md\:z-999 {
    z-index: 999; }
  .md\:right-8 {
    right: 2rem; } }

/* ----------------------------------------
    Export Breakpoints JS
---------------------------------------- */

/* ----------------------------------------
    Branding Colors
---------------------------------------- */
/**
 * This map includes all main colors
 * that will be used within the project.
 */
/**
 * This map includes all button text colors
 * that will be used within the project.
 */
/* ----------------------------------------
    Branding Combinations
---------------------------------------- */
/**
 * I case you wan't to use specific color
 * combinations, you can add these to this
 * multi dimensional map. These should
 * always consist of a background and
 * color combination.
 */
/* ----------------------------------------
    Branding Values
---------------------------------------- */
/**
 * Cluster brand variables within this map
 * with custom names. Comes in handy if you
 * have specific names for certain color
 * values. Use map-fetch function to get the
 * value of particular map, there are also
 * some shorthand mixins to include colors.
 */
/* ----------------------------------------
    Export Colors JS
---------------------------------------- */

/* ----------------------------------------
    Font Face
---------------------------------------- */
@font-face {
  font-family: "Lubalin";
  font-weight: 600;
  font-style: bold;
  src: url("../../fonts/LubalinGraphITCbyBT-Demi.otf") format("opentype"); }

@font-face {
  font-family: "Lubalin";
  font-weight: 300;
  font-style: normal;
  src: url("../../fonts/LubalinGraphITCbyBT-Book.otf") format("opentype"); }

@font-face {
  font-family: "Lubalin";
  font-weight: 500;
  font-style: normal;
  src: url("../../fonts/LubalinGraphITCbyBT-Medium.otf") format("opentype"); }

@font-face {
  font-family: "Nimbus";
  font-weight: 300;
  font-style: normal;
  src: url("../../fonts/NimbusSansNovusTOT-Reg.otf") format("opentype"); }

/* ----------------------------------------
    Font Variables
---------------------------------------- */
/* ----------------------------------------
    Text Styles
---------------------------------------- */
/**
 * This sections specifies some of the
 * core font styling. You can declare
 * new maps inside this global variable
 * for use with the font mixin.
 */
/* ----------------------------------------
    Export Fonts JS
---------------------------------------- */

/* ----------------------------------------
    Grid
---------------------------------------- */
/**
 * We use the Bourbon Neat grid as a
 * default for every project. Use the
 * query function to determine a
 * certain breakpojnt. Tweak the
 * values if needed.
 */
/* ----------------------------------------
    Icons
---------------------------------------- */
/**
 * Configure (file) names of certain icons
 * to generate new classes within loops.
 */
/* ----------------------------------------
    Modifiers
---------------------------------------- */
[class$='--shadow'] {
  box-shadow: 0 0 5px rgba(24, 23, 22, 0.25); }

/* ----------------------------------------
    Development Helpers
---------------------------------------- */
/* ----------------------------------------
    Helpers
---------------------------------------- */
/* ----------------------------------------
    Style Guide Styling
---------------------------------------- */
/**
 * This file contains some styling that
 * is used for displaying the automated
 * style guide. This will be displayed
 * as a default when you open the project.
 * Exclude this file in production.
 */
/* ----------------------------------------
      Style Guide
  ---------------------------------------- */
.style-container {
  font-weight: 100; }
  .style-container strong,
  .style-container b {
    font-weight: 400; }
  .style-container hr {
    margin-top: 3rem; }
    .style-container hr:last-of-type {
      display: 0; }

.js-copy-template {
  cursor: pointer; }

/* ----------------------------------------
      Style Snippet
  ---------------------------------------- */
[class*='__snippet'] {
  font-family: "Nimbus", "Helvetica", sans-serif;
  font-size: 0.9375em;
  font-style: normal;
  font-size: 0.625em;
  color: rgba(24, 23, 22, 0.4); }

/* ----------------------------------------
      Style Block
  ---------------------------------------- */
.vv-style-block {
  width: 100%;
  height: auto;
  margin: 0 auto;
  position: relative;
  display: block;
  overflow: visible;
  /* nested */ }
  .vv-style-block::after {
    clear: both;
    content: "";
    display: block; }
  .vv-style-block:last-of-type {
    margin-bottom: 5rem; }
  .vv-style-block--center {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    display: block;
    max-width: 1200px; }
  .vv-style-block--combi {
    margin-top: 4rem;
    background: #F9CDD0;
    color: #002F87; }
    .vv-style-block--combi [class*='__snippet'] {
      color: rgba(255, 255, 255, 0.25); }
  .vv-style-block--contain {
    border-top: 1px solid rgba(24, 23, 22, 0.1);
    border-bottom: 1px solid rgba(24, 23, 22, 0.1); }
    .vv-style-block--contain + .vv-style-block--contain {
      margin-top: 0; }
  .vv-style-block--lucky {
    margin: 2rem 0;
    padding: 2rem 0 2rem 0;
    background: #F9CDD0;
    color: #002F87; }
    .vv-style-block--lucky .vv-style-block__title,
    .vv-style-block--lucky .vv-style-block__text,
    .vv-style-block--lucky [class*='__snippet'] {
      color: #FFFFFF; }
    .vv-style-block--lucky [class*='-card'] {
      border-color: rgba(255, 255, 255, 0.25); }
    .vv-style-block--lucky + .vv-style-block--contain {
      margin-top: -2rem; }
  .vv-style-block--full {
    min-height: 100vh;
    margin-top: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden; }
  .vv-style-block__head {
    padding-top: 3rem; }
    .vv-style-block__head + .vv-style-block > .vv-style-block__inner {
      padding-top: 10px; }
    .vv-style-block__head + .vv-style-block--contain {
      border-top: 0; }
  .vv-style-block__info {
    width: calc(100% - 40px);
    float: left;
    margin-left: 20px;
    margin-bottom: 2rem;
    margin-left: 0;
    padding-right: 2rem;
    display: block;
    float: left;
    overflow: auto;
    /* responsive */ }
    @media screen and (min-width: 960px) {
      .vv-style-block__info {
        width: calc(25% - 25px);
        float: left;
        margin-left: 20px;
        margin-bottom: 0;
        margin-left: 0; } }
  .vv-style-block__content {
    width: calc(75% - 35px);
    float: left;
    margin-left: 20px;
    margin-left: 20px;
    display: block;
    float: left;
    overflow: auto;
    overflow: visible;
    /* responsive */ }
    @media screen and (min-width: 0) and (max-width: 959px) {
      .vv-style-block__content {
        width: calc(100% - 40px);
        float: left;
        margin-left: 20px;
        width: 100%;
        margin-left: 0;
        margin-right: 0; } }
  .vv-style-block__inner {
    padding: 2rem 3rem 2rem 3rem;
    /* responsive */ }
    @media screen and (min-width: 0) and (max-width: 959px) {
      .vv-style-block__inner {
        padding: 1rem 1.75rem 1rem 1.75rem; } }
    .vv-style-block__inner--compact {
      padding: 1.5rem 3rem 1.5rem 3rem;
      padding-bottom: 0;
      /* responsive */ }
      @media screen and (min-width: 0) and (max-width: 959px) {
        .vv-style-block__inner--compact {
          padding: 1rem 1.75rem 1rem 1.75rem; } }
    .vv-style-block__inner--large {
      padding: 5rem 3rem 5rem 3rem; }
  .vv-style-block__title {
    text-transform: capitalize; }
  .vv-style-block__top {
    font-size: 2.5em; }

/* ----------------------------------------
      Font Logo
  ---------------------------------------- */
.vv-logo img {
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  display: block;
  width: 60%; }

/* ----------------------------------------
      Font Preview
  ---------------------------------------- */
.vv-font-preview {
  width: 175%;
  font-size: 9.375em;
  line-height: 1em; }

/* ----------------------------------------
      Text Preview
  ---------------------------------------- */
.vv-text-preview {
  position: relative;
  overflow: visible; }
  .vv-text-preview__snippet {
    width: 50px;
    height: 0;
    margin: 0;
    padding: 0;
    text-align: right;
    position: absolute;
    transform: translate(-150%, 0.5em); }

/* ----------------------------------------
      Breakpoint Card
  ---------------------------------------- */
.vv-breakpoint-card {
  padding: 0 1rem;
  /* repsonsive */ }
  @media screen and (min-width: 0) and (max-width: 959px) {
    .vv-breakpoint-card {
      padding: 0; } }
  .vv-breakpoint-card__row {
    width: 100%;
    padding: 0.5em 0;
    border-bottom: 1px solid rgba(24, 23, 22, 0.1);
    display: table; }
    .vv-breakpoint-card__row:last-of-type {
      border-bottom: 0; }
  .vv-breakpoint-card__snippet, .vv-breakpoint-card__title, .vv-breakpoint-card__text {
    width: 33.33%;
    display: table-cell;
    vertical-align: middle; }
  .vv-breakpoint-card__text {
    text-align: right; }
  .vv-breakpoint-card__snippet {
    text-align: right; }

.vv-grid {
  height: 20px;
  border: 1px solid rgba(24, 23, 22, 0.25);
  border-bottom: 0; }
  .vv-grid__snippet {
    width: 100% !important;
    margin-top: 1rem;
    padding-bottom: 0.25rem;
    clear: both; }

/* ----------------------------------------
      Font Card
  ---------------------------------------- */
.vv-font-card {
  width: calc(33.33% - 2rem);
  margin: 0 1rem 2rem;
  border: 1px solid rgba(24, 23, 22, 0.1);
  display: block;
  float: left;
  overflow: auto;
  transition: box-shadow 0.25s ease;
  /* repsonsive */ }
  @media screen and (min-width: 0) and (max-width: 959px) {
    .vv-font-card {
      width: 100%;
      margin: 0 0 2rem;
      padding: 0; } }
  .vv-font-card__info {
    padding: 0.5rem 1rem 0.5rem 1rem; }
  .vv-font-card__preview {
    padding: 1rem 1.5rem 1rem 1.5rem;
    border-bottom: 1px solid rgba(24, 23, 22, 0.1);
    font-size: 6.25em;
    font-weight: 400;
    text-align: center; }

/* ----------------------------------------
      Letter Card
  ---------------------------------------- */
.vv-letter-card {
  width: calc(100% - 2rem);
  margin-bottom: 2rem;
  border: 1px solid rgba(24, 23, 22, 0.1);
  display: block;
  float: left;
  overflow: auto;
  /* repsonsive */ }
  .vv-letter-card::after {
    clear: both;
    content: "";
    display: block; }
  @media screen and (min-width: 0) and (max-width: 959px) {
    .vv-letter-card {
      width: 100%;
      margin: 0 0 2rem;
      font-size: 0.625em; } }
  .vv-letter-card__overlay {
    text-align: center; }
  .vv-letter-card__preview {
    width: 75%;
    padding: 1rem 1.5rem 1rem 1.5rem;
    display: block;
    float: left;
    overflow: auto; }
  .vv-letter-card__text {
    font-size: 1.5em;
    line-height: 1.5em;
    word-wrap: break-word; }
  .vv-letter-card__thumb {
    width: 25%;
    height: 160px;
    padding: 1rem 1.5rem 1rem 1.5rem;
    border-right: 1px solid rgba(24, 23, 22, 0.1);
    font-size: 4.75em;
    position: relative;
    display: block;
    float: left;
    overflow: auto;
    /* responsive */ }
    @media screen and (min-width: 0) and (max-width: 959px) {
      .vv-letter-card__thumb {
        width: calc(100% - 40px);
        float: left;
        margin-left: 20px;
        padding: 0 0;
        width: 100%;
        margin-left: 0;
        border-bottom: 1px solid rgba(24, 23, 22, 0.1);
        border-right: 0; } }

/* ----------------------------------------
      Color Card
  ---------------------------------------- */
.vv-color-card {
  width: calc(33.33% - 2rem);
  margin: 0 1rem 2rem;
  border: 1px solid rgba(24, 23, 22, 0.1);
  display: block;
  float: left;
  overflow: auto;
  transition: box-shadow 0.25s ease;
  /* state */
  /* responsive */ }
  .vv-color-card:hover {
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.1); }
  @media screen and (min-width: 0) and (max-width: 959px) {
    .vv-color-card {
      width: 100%;
      margin: 0 0 2rem;
      padding: 0; } }
  .vv-color-card__info {
    padding: 0.5rem 1rem 0.5rem 1rem; }
  .vv-color-card__name {
    font-size: 0.875em;
    font-weight: 400;
    text-transform: uppercase; }
  .vv-color-card__overlay {
    font-size: 1.25em;
    text-align: center; }
  .vv-color-card__preview {
    height: 0;
    padding-bottom: 50%;
    border-bottom: 1px solid rgba(24, 23, 22, 0.1);
    position: relative; }
    .vv-color-card__preview--part {
      width: 25%;
      height: 0;
      padding-bottom: 50%;
      display: block;
      float: left;
      overflow: auto; }
  .vv-color-card__snippet {
    margin-top: 0.25em; }
  .vv-color-card__value {
    font-size: 0.75em;
    color: #666666; }

/* ----------------------------------------
      Heading Card
  ---------------------------------------- */
.vv-heading-card {
  width: 100%;
  margin-bottom: 1em;
  padding: 0 1em 1em;
  border-bottom: 1px solid rgba(24, 23, 22, 0.1);
  display: table;
  /* repsonsive */ }
  .vv-heading-card:last-of-type {
    border-bottom: 0; }
  @media screen and (min-width: 0) and (max-width: 959px) {
    .vv-heading-card {
      width: 100%;
      padding: 0 0 1em; } }
  .vv-heading-card__heading, .vv-heading-card__snippet {
    display: table-cell;
    vertical-align: middle; }
  .vv-heading-card__heading h1, .vv-heading-card__heading .h1, .vv-heading-card__heading h2, .vv-heading-card__heading .h2, .vv-heading-card__heading h3, .vv-heading-card__heading .h3, .vv-heading-card__heading h4, .vv-heading-card__heading .h4, .vv-heading-card__heading h5, .vv-heading-card__heading .h5, .vv-heading-card__heading h6, .vv-heading-card__heading .h6 {
    margin: 0; }
  .vv-heading-card__snippet {
    text-align: right; }

/* ----------------------------------------
      Text Card
  ---------------------------------------- */
.vv-text-card {
  margin: 0 1rem 2rem;
  padding: 2rem 2rem;
  border: 1px solid rgba(24, 23, 22, 0.1);
  /* responsive */ }
  .vv-text-card p {
    display: -webkit-box;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 5;
    line-clamp: 5;
    -webkit-box-orient: vertical;
    box-orient: vertical; }
  @media screen and (min-width: 0) and (max-width: 959px) {
    .vv-text-card {
      margin: 0 0 2rem;
      padding: 1rem 1rem; } }
  .vv-text-card__info {
    margin: 0; }
  .vv-text-card__snippet {
    margin-left: 1rem;
    display: inline; }

.vv-style {
  margin: 0; }

/* ----------------------------------------
      Button Card
  ---------------------------------------- */
.vv-button-card {
  width: 100%;
  margin-bottom: 1em;
  padding: 0 1em 1em;
  border-bottom: 1px solid rgba(24, 23, 22, 0.1);
  display: table;
  /* repsonsive */ }
  .vv-button-card:last-of-type {
    border-bottom: 0; }
  @media screen and (min-width: 0) and (max-width: 959px) {
    .vv-button-card {
      width: 100%;
      padding: 0 0 1em; } }
  .vv-button-card__snippet {
    text-align: right;
    display: table-cell;
    vertical-align: middle; }

/* ----------------------------------------
      Link Card
  ---------------------------------------- */
.vv-anchor-card {
  width: 100%;
  margin-bottom: 1em;
  padding: 0 1em 1em;
  border-bottom: 1px solid rgba(24, 23, 22, 0.1);
  display: table; }
  .vv-anchor-card:last-of-type {
    border-bottom: 0; }
  .vv-anchor-card__anchor, .vv-anchor-card__snippet {
    display: table-cell;
    vertical-align: middle; }
  .vv-anchor-card__snippet {
    text-align: right; }

/* ----------------------------------------
      Icon Card
  ---------------------------------------- */
.vv-icon-card {
  width: calc(25% - 2rem);
  height: auto;
  margin: 0 1rem 2rem;
  border: 1px solid rgba(24, 23, 22, 0.1);
  text-align: center;
  float: left; }
  .vv-icon-card [class^='icon__'] {
    width: 3rem;
    height: 3rem; }
    .vv-icon-card [class^='icon__']:before {
      width: inherit;
      height: inherit;
      margin: 0; }
  .vv-icon-card__thumb {
    width: 100%;
    height: auto;
    padding: 2rem 2rem; }
  .vv-icon-card__info {
    padding: 0.5rem 0.5rem;
    border-top: 1px solid rgba(24, 23, 22, 0.1);
    text-align: center; }

/* ----------------------------------------
    Theme Toggle
---------------------------------------- */
.theme-toggle {
  width: auto;
  border-radius: 2px;
  background: #181716;
  color: #FFFFFF;
  font-family: "Nimbus", "Helvetica", sans-serif;
  font-size: 0.9375em;
  font-style: normal;
  font-size: 12px !important;
  position: fixed;
  top: 0.5rem;
  right: 0.5rem;
  display: block; }
  .theme-toggle__button {
    padding: 0.15rem 0.3rem 0.15rem 0.3rem;
    text-transform: uppercase;
    display: inline-block;
    cursor: pointer; }
    .theme-toggle__button + .theme-toggle__button {
      border-left: 1px solid rgba(24, 23, 22, 0.15); }

/* ----------------------------------------
    UI Elements
---------------------------------------- */
/* ----------------------------------------
   Accordion base
---------------------------------------- */
.accordion {
  width: 100%;
  background-color: #FFFFFF;
  position: relative;
  overflow: hidden; }

/* ----------------------------------------
   Accordion Button
---------------------------------------- */
.accordion__button {
  margin: 0 2.5rem;
  padding: 2.5rem 0;
  border-bottom: 1px solid #DEE3E7;
  font-size: 1.125em;
  font-weight: 300;
  cursor: pointer;
  transition: transform 0.3s;
  /* responsive */ }
  .accordion__button:hover {
    transform: translateX(5px); }
  @media screen and (min-width: 0) and (max-width: 767px) {
    .accordion__button {
      margin: 0 2rem;
      padding: 2rem 0; } }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .accordion__button {
      margin: 0 1.5rem;
      padding: 1.5rem 0; } }

/* ----------------------------------------
   Accordion Collapse
---------------------------------------- */
.accordion__collapse {
  max-height: 0;
  margin-top: -2px;
  margin-left: 0;
  overflow: hidden;
  transition: max-height 0.2s ease-out; }
  .accordion__collapse:last-of-type .accordion__content {
    border-bottom: 0; }

.accordion__content {
  margin: 1.25rem 2.5rem 0;
  padding: 1.25rem 0 2rem;
  border-bottom: 1px solid #DEE3E7;
  font-family: "Nimbus", "Helvetica", sans-serif;
  font-size: 1.125em;
  line-height: 1.5em;
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 767px) {
    .accordion__content {
      margin: 1.25rem 2rem;
      padding: 0.75rem 0 1.75rem; } }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .accordion__content {
      margin: 1rem 1.5rem;
      padding: 0.5rem 0 1.5rem; } }

/* ----------------------------------------
   Accordion Icon
---------------------------------------- */
.accordion__icon {
  margin-right: 2rem;
  display: inline-block;
  float: left;
  transform: translateY(4px);
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 767px) {
    .accordion__icon {
      margin-right: 1.5rem; } }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .accordion__icon {
      margin-right: 1rem;
      display: none; } }

.style-underline, article p a, article ul li a,
article ol li a {
  text-decoration: none;
  position: relative;
  z-index: 1;
  display: inline-block; }
  .style-underline:before, article p a:before, article ul li a:before,
  article ol li a:before, .style-underline:after, article p a:after, article ul li a:after,
  article ol li a:after {
    content: '';
    height: 1px;
    background: #002F87;
    position: absolute;
    z-index: -1; }
  .style-underline:before, article p a:before, article ul li a:before,
  article ol li a:before {
    width: 0;
    bottom: 4px;
    left: 0;
    -webkit-transition: width ease 0.4s;
    transition: width ease 0.4s; }
  .style-underline:after, article p a:after, article ul li a:after,
  article ol li a:after {
    width: 100%;
    bottom: 4px;
    left: 0;
    -webkit-transition: all ease 0.6s;
    transition: all ease 0.6s; }
  @media screen and (min-width: 640px) {
    .style-underline:hover:before, article p a:hover:before, article ul li a:hover:before,
    article ol li a:hover:before {
      width: 100%; }
    .style-underline:hover:after, article p a:hover:after, article ul li a:hover:after,
    article ol li a:hover:after {
      width: 0;
      left: 100%;
      -webkit-transition: all ease 0.2s;
      transition: all ease 0.2s; } }

/* ----------------------------------------
    Anchor
---------------------------------------- */
a {
  text-decoration: none;
  color: inherit;
  /* state */ }

/* ----------------------------------------
    Underline
---------------------------------------- */
[class*='--underline'] {
  text-decoration: none;
  color: inherit;
  position: relative;
  display: inline-block; }
  [class*='--underline']:before {
    content: '';
    width: 100%;
    height: 1px;
    margin-top: 0.2rem;
    background: #002F87;
    position: absolute;
    bottom: 0;
    left: 0;
    -webkit-transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1);
    transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1); }
  @media screen and (min-width: 640px) {
    [class*='--underline']:hover:before {
      width: 0; } }

/* ----------------------------------------
    Article
---------------------------------------- */
article {
  width: 100%; }

/* ----------------------------------------
    Article Text
---------------------------------------- */
article h1, article .h1, article h2, article .h2, article h3, article .h3, article h4, article .h4, article h5, article .h5, article h6, article .h6 {
  margin: 0;
  padding: 0;
  color: inherit; }

article h1 {
  font-size: 2.25em; }

article h2 {
  font-size: 2em; }

article h3 {
  font-size: 1.75em; }

article h4 {
  font-size: 1.5em; }

article h5 {
  font-size: 1.25em; }

article h6 {
  font-size: 1.125em; }

article blockquote {
  width: 100%;
  box-sizing: border-box; }

article p {
  margin: 1em 0; }
  article p:first-of-type {
    margin-top: 0; }
  article p:last-of-type {
    margin-bottom: 0; }
  article p b,
  article p strong {
    font-weight: 600; }

/* ----------------------------------------
    Article Lists
---------------------------------------- */
article ul,
article ol {
  width: 100%;
  margin: 1.5em 0;
  padding: 0 0 0 1em;
  font-family: "Nimbus", "Helvetica", sans-serif;
  font-size: 1.1875em;
  font-weight: 300;
  line-height: 1.5em; }
  article ul ul,
  article ul ol,
  article ol ul,
  article ol ol {
    margin: 0.5em 0;
    font: inherit; }
  article ul li,
  article ol li {
    margin: 0.1em 0; }

article ul {
  list-style-type: none; }
  article ul li {
    padding-left: 15px;
    position: relative; }
    article ul li ul {
      margin: 0; }
    article ul li:before {
      content: "\25CF";
      position: relative;
      display: "inline";
      margin: -0.1em 0.75em;
      font-size: 0.75em;
      color: inherit;
      position: absolute;
      top: 0.2em;
      left: -15px; }

article ol li {
  margin-left: 0.8em; }

article dl {
  width: 100%; }
  article dl dt {
    width: 20%;
    font-weight: 400;
    text-align: right;
    float: left;
    clear: left; }
    article dl dt:after {
      content: ":";
      position: relative;
      display: "inline"; }
  article dl dd {
    width: 80%;
    margin-left: calc(20% + 10px); }

/* ----------------------------------------
    Article Image
---------------------------------------- */
article img {
  max-width: 100%;
  height: auto; }

/* ----------------------------------------
    Article Table
---------------------------------------- */
article table {
  width: 100%;
  border: 1px solid #002F87;
  border-radius: 3px;
  border-collapse: collapse;
  font-weight: inherit; }

article thead,
article caption {
  background: rgba(0, 47, 135, 0.05);
  font-weight: 400;
  color: #002F87; }

article thead + tbody tr:first-of-type {
  background: inherit;
  color: inherit; }

article tfoot {
  font-size: 0.75em; }
  article tfoot tr,
  article tfoot td {
    text-align: center; }
  article tfoot tr {
    background: inherit !important;
    color: inherit !important; }

article th,
article tr,
article td {
  padding: 0.5em 0.75em;
  text-align: left; }

article th,
article td {
  border-right: 1px solid #002F87; }
  article th:last-of-type,
  article td:last-of-type {
    border-right: 0; }

article th {
  font-weight: 700; }

article tr {
  border-bottom: 1px solid #002F87; }
  article tr:first-of-type {
    border-top: 1px solid #002F87;
    background: rgba(0, 47, 135, 0.05);
    color: #002F87; }

/* ----------------------------------------
    Buttons
---------------------------------------- */
.btn, .btn-solid--blue, .btn-solid--lightblue, .btn-solid--green, .btn-solid--pink, .btn-solid--white, .btn-solid--lightgrey, .btn-solid--grey, .btn-solid--black, .btn-solid--error, .btn-inactive {
  margin: 0;
  padding: 0.85rem 1.25rem 0.8rem;
  border: 0;
  border-radius: 4px;
  font-size: 1em;
  font-weight: 600;
  line-height: 1.5em;
  text-decoration: none !important;
  text-align: center;
  color: #002F87;
  display: inline-block;
  box-sizing: border-box;
  outline: none;
  cursor: pointer; }

/* ----------------------------------------
    Button Size
---------------------------------------- */
.btn, .btn-solid--blue, .btn-solid--lightblue, .btn-solid--green, .btn-solid--pink, .btn-solid--white, .btn-solid--lightgrey, .btn-solid--grey, .btn-solid--black, .btn-solid--error, .btn-inactive {
  font-family: "Lubalin", "Helvetica", sans-serif; }
  .btn--small {
    font-size: 0.875em; }
  .btn--large {
    font-size: 1.125em; }
  .btn--wide {
    width: 100%;
    position: relative; }
    .btn--wide span {
      float: left; }
    .btn--wide svg {
      position: absolute;
      top: 50%;
      right: 1.5rem;
      transform: translateY(-50%); }
  .btn--rounded {
    border-radius: 1px !important; }

/* ----------------------------------------
    Button Solid
---------------------------------------- */
.btn-solid--blue, .btn-solid--lightblue, .btn-solid--green, .btn-solid--pink, .btn-solid--white, .btn-solid--lightgrey, .btn-solid--grey, .btn-solid--black, .btn-solid--error {
  transition: background 0.3s, border 0.3s, transform 0.2s ease;
  /* svg */
  /* state */ }
  .btn-solid--blue svg, .btn-solid--lightblue svg, .btn-solid--green svg, .btn-solid--pink svg, .btn-solid--white svg, .btn-solid--lightgrey svg, .btn-solid--grey svg, .btn-solid--black svg, .btn-solid--error svg {
    margin: 0 0 -0.1em 0.5em; }
  @media screen and (min-width: 1080px) {
    .btn-solid--blue:hover, .btn-solid--lightblue:hover, .btn-solid--green:hover, .btn-solid--pink:hover, .btn-solid--white:hover, .btn-solid--lightgrey:hover, .btn-solid--grey:hover, .btn-solid--black:hover, .btn-solid--error:hover {
      transform: translate(-2px, -2px); } }

/* ----------------------------------------
    Button Ghost
---------------------------------------- */
.btn-ghost--blue, .btn-ghost--lightblue, .btn-ghost--green, .btn-ghost--pink, .btn-ghost--white, .btn-ghost--lightgrey, .btn-ghost--grey, .btn-ghost--black, .btn-ghost--error {
  border: 2px solid currentColor;
  transition: color 0.3s, background 0.3s, transform 0.2s ease; }

/* ----------------------------------------
    Button Inactive
---------------------------------------- */
.btn-inactive {
  opacity: 0.3;
  pointer-events: none; }

/* ----------------------------------------
    Button Colors
---------------------------------------- */
.btn-solid--blue {
  background: #002f87;
  color: white;
  border: #002F87 solid 2px;
  /* svg */
  /* state */ }
  .btn-solid--blue svg .stroke {
    stroke: white; }
  .btn-solid--blue svg .fill {
    fill: white; }
  .btn-solid--blue:active, .btn-solid--blue:hover {
    border-color: #0038a1;
    background: #0038a1; }

.btn-ghost--blue {
  background: transparent;
  color: #002F87;
  /* svg */
  /* state */ }
  .btn-ghost--blue svg * {
    fill: #002F87; }
  .btn-ghost--blue:active, .btn-ghost--blue:hover {
    border-color: #002F87;
    background: #002f87;
    color: white;
    /* svg */ }
    .btn-ghost--blue:active svg *, .btn-ghost--blue:hover svg * {
      fill: #002f87; }
    .btn-ghost--blue:active svg .stroke, .btn-ghost--blue:hover svg .stroke {
      stroke: white; }
    .btn-ghost--blue:active svg .fill, .btn-ghost--blue:hover svg .fill {
      fill: white; }

.btn-solid--lightblue {
  background: #ebeff2;
  color: #002f87;
  border: #EBEFF2 solid 2px;
  /* svg */
  /* state */ }
  .btn-solid--lightblue svg .stroke {
    stroke: #002f87; }
  .btn-solid--lightblue svg .fill {
    fill: #002f87; }
  .btn-solid--lightblue:active, .btn-solid--lightblue:hover {
    border-color: #dce3e8;
    background: #dce3e8; }

.btn-ghost--lightblue {
  background: transparent;
  color: #EBEFF2;
  /* svg */
  /* state */ }
  .btn-ghost--lightblue svg * {
    fill: #EBEFF2; }
  .btn-ghost--lightblue:active, .btn-ghost--lightblue:hover {
    border-color: #EBEFF2;
    background: #ebeff2;
    color: #002f87;
    /* svg */ }
    .btn-ghost--lightblue:active svg *, .btn-ghost--lightblue:hover svg * {
      fill: #4769a7; }
    .btn-ghost--lightblue:active svg .stroke, .btn-ghost--lightblue:hover svg .stroke {
      stroke: #002f87; }
    .btn-ghost--lightblue:active svg .fill, .btn-ghost--lightblue:hover svg .fill {
      fill: #002f87; }

.btn-solid--green {
  background: #b5d9b9;
  color: #002f87;
  border: #B5D9B9 solid 2px;
  /* svg */
  /* state */ }
  .btn-solid--green svg .stroke {
    stroke: #002f87; }
  .btn-solid--green svg .fill {
    fill: #002f87; }
  .btn-solid--green:active, .btn-solid--green:hover {
    border-color: #c6e2c9;
    background: #c6e2c9; }

.btn-ghost--green {
  background: transparent;
  color: #B5D9B9;
  /* svg */
  /* state */ }
  .btn-ghost--green svg * {
    fill: #B5D9B9; }
  .btn-ghost--green:active, .btn-ghost--green:hover {
    border-color: #B5D9B9;
    background: #b5d9b9;
    color: #002f87;
    /* svg */ }
    .btn-ghost--green:active svg *, .btn-ghost--green:hover svg * {
      fill: #366296; }
    .btn-ghost--green:active svg .stroke, .btn-ghost--green:hover svg .stroke {
      stroke: #002f87; }
    .btn-ghost--green:active svg .fill, .btn-ghost--green:hover svg .fill {
      fill: #002f87; }

.btn-solid--pink {
  background: #f9cdd0;
  color: #002f87;
  border: #F9CDD0 solid 2px;
  /* svg */
  /* state */ }
  .btn-solid--pink svg .stroke {
    stroke: #002f87; }
  .btn-solid--pink svg .fill {
    fill: #002f87; }
  .btn-solid--pink:active, .btn-solid--pink:hover {
    border-color: #fce4e5;
    background: #fce4e5; }

.btn-ghost--pink {
  background: transparent;
  color: #F9CDD0;
  /* svg */
  /* state */ }
  .btn-ghost--pink svg * {
    fill: #F9CDD0; }
  .btn-ghost--pink:active, .btn-ghost--pink:hover {
    border-color: #F9CDD0;
    background: #f9cdd0;
    color: #002f87;
    /* svg */ }
    .btn-ghost--pink:active svg *, .btn-ghost--pink:hover svg * {
      fill: #4b5e9d; }
    .btn-ghost--pink:active svg .stroke, .btn-ghost--pink:hover svg .stroke {
      stroke: #002f87; }
    .btn-ghost--pink:active svg .fill, .btn-ghost--pink:hover svg .fill {
      fill: #002f87; }

.btn-solid--white {
  background: white;
  color: #002f87;
  border: #FFFFFF solid 2px;
  /* svg */
  /* state */ }
  .btn-solid--white svg .stroke {
    stroke: #002f87; }
  .btn-solid--white svg .fill {
    fill: #002f87; }
  .btn-solid--white:active, .btn-solid--white:hover {
    border-color: #f2f2f2;
    background: #f2f2f2; }

.btn-ghost--white {
  background: transparent;
  color: #FFFFFF;
  /* svg */
  /* state */ }
  .btn-ghost--white svg * {
    fill: #FFFFFF; }
  .btn-ghost--white:active, .btn-ghost--white:hover {
    border-color: #FFFFFF;
    background: white;
    color: #002f87;
    /* svg */ }
    .btn-ghost--white:active svg *, .btn-ghost--white:hover svg * {
      fill: #4d6dab; }
    .btn-ghost--white:active svg .stroke, .btn-ghost--white:hover svg .stroke {
      stroke: #002f87; }
    .btn-ghost--white:active svg .fill, .btn-ghost--white:hover svg .fill {
      fill: #002f87; }

.btn-solid--lightgrey {
  background: #dee3e7;
  color: #002f87;
  border: #DEE3E7 solid 2px;
  /* svg */
  /* state */ }
  .btn-solid--lightgrey svg .stroke {
    stroke: #002f87; }
  .btn-solid--lightgrey svg .fill {
    fill: #002f87; }
  .btn-solid--lightgrey:active, .btn-solid--lightgrey:hover {
    border-color: #edf0f2;
    background: #edf0f2; }

.btn-ghost--lightgrey {
  background: transparent;
  color: #DEE3E7;
  /* svg */
  /* state */ }
  .btn-ghost--lightgrey svg * {
    fill: #DEE3E7; }
  .btn-ghost--lightgrey:active, .btn-ghost--lightgrey:hover {
    border-color: #DEE3E7;
    background: #dee3e7;
    color: #002f87;
    /* svg */ }
    .btn-ghost--lightgrey:active svg *, .btn-ghost--lightgrey:hover svg * {
      fill: #4365a4; }
    .btn-ghost--lightgrey:active svg .stroke, .btn-ghost--lightgrey:hover svg .stroke {
      stroke: #002f87; }
    .btn-ghost--lightgrey:active svg .fill, .btn-ghost--lightgrey:hover svg .fill {
      fill: #002f87; }

.btn-solid--grey {
  background: #899299;
  color: white;
  border: #899299 solid 2px;
  /* svg */
  /* state */ }
  .btn-solid--grey svg .stroke {
    stroke: white; }
  .btn-solid--grey svg .fill {
    fill: white; }
  .btn-solid--grey:active, .btn-solid--grey:hover {
    border-color: #7b858d;
    background: #7b858d; }

.btn-ghost--grey {
  background: transparent;
  color: #899299;
  /* svg */
  /* state */ }
  .btn-ghost--grey svg * {
    fill: #899299; }
  .btn-ghost--grey:active, .btn-ghost--grey:hover {
    border-color: #899299;
    background: #899299;
    color: white;
    /* svg */ }
    .btn-ghost--grey:active svg *, .btn-ghost--grey:hover svg * {
      fill: #294d8c; }
    .btn-ghost--grey:active svg .stroke, .btn-ghost--grey:hover svg .stroke {
      stroke: white; }
    .btn-ghost--grey:active svg .fill, .btn-ghost--grey:hover svg .fill {
      fill: white; }

.btn-solid--black {
  background: #181716;
  color: white;
  border: #181716 solid 2px;
  /* svg */
  /* state */ }
  .btn-solid--black svg .stroke {
    stroke: white; }
  .btn-solid--black svg .fill {
    fill: white; }
  .btn-solid--black:active, .btn-solid--black:hover {
    border-color: #252422;
    background: #252422; }

.btn-ghost--black {
  background: transparent;
  color: #181716;
  /* svg */
  /* state */ }
  .btn-ghost--black svg * {
    fill: #181716; }
  .btn-ghost--black:active, .btn-ghost--black:hover {
    border-color: #181716;
    background: #181716;
    color: white;
    /* svg */ }
    .btn-ghost--black:active svg *, .btn-ghost--black:hover svg * {
      fill: #072865; }
    .btn-ghost--black:active svg .stroke, .btn-ghost--black:hover svg .stroke {
      stroke: white; }
    .btn-ghost--black:active svg .fill, .btn-ghost--black:hover svg .fill {
      fill: white; }

.btn-solid--error {
  background: #f56565;
  color: white;
  border: #F56565 solid 2px;
  /* svg */
  /* state */ }
  .btn-solid--error svg .stroke {
    stroke: white; }
  .btn-solid--error svg .fill {
    fill: white; }
  .btn-solid--error:active, .btn-solid--error:hover {
    border-color: #f77d7d;
    background: #f77d7d; }

.btn-ghost--error {
  background: transparent;
  color: #F56565;
  /* svg */
  /* state */ }
  .btn-ghost--error svg * {
    fill: #F56565; }
  .btn-ghost--error:active, .btn-ghost--error:hover {
    border-color: #F56565;
    background: #f56565;
    color: white;
    /* svg */ }
    .btn-ghost--error:active svg *, .btn-ghost--error:hover svg * {
      fill: #4a3f7d; }
    .btn-ghost--error:active svg .stroke, .btn-ghost--error:hover svg .stroke {
      stroke: white; }
    .btn-ghost--error:active svg .fill, .btn-ghost--error:hover svg .fill {
      fill: white; }

/* ----------------------------------------
    Button Hex
---------------------------------------- */
.btn-hex {
  width: 3.75rem;
  height: 3.25rem;
  position: relative;
  -webkit-clip-path: polygon(27% 0%, 73% 0, 100% 50%, 73% 100%, 27% 100%, 0% 50%);
  clip-path: polygon(27% 0%, 73% 0, 100% 50%, 73% 100%, 27% 100%, 0% 50%); }
  .btn-hex:before {
    content: "";
    position: relative;
    display: inline-block;
    width: 100%;
    padding-top: 83.33333%; }
  .btn-hex img {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0; }
    @supports (object-fit: cover) {
      .btn-hex img {
        object-fit: cover; } }
  .btn-hex svg {
    margin: 0;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%); }

/* ----------------------------------------
    Export Buttons JS
---------------------------------------- */

/* ----------------------------------------
    Buttons
---------------------------------------- */
.btn-group [class*='btn'] + [class*='btn'] {
  margin-left: 1rem; }

/* ----------------------------------------
    Dropdown Core
---------------------------------------- */
.dropdown input[type='checkbox'],
.dropdown input[type='radio'] {
  width: auto;
  opacity: 0; }
  .dropdown input[type='checkbox']:checked + label,
  .dropdown input[type='radio']:checked + label {
    background: transparent !important;
    font-weight: 600;
    color: inherit !important; }

.dropdown label {
  width: 100%;
  margin: 0;
  padding: 1.25rem 1.25rem;
  font-family: "Nimbus", "Helvetica", sans-serif;
  font-size: inherit;
  position: relative;
  display: inline-block;
  cursor: pointer;
  transition: padding 0.25s ease, background 0.2s ease;
  /* state */ }
  .dropdown label:hover {
    padding: 1.25rem 1.5rem; }

.dropdown select {
  display: none; }

.dropdown svg {
  margin: 0.5em 0 0.5em 0.75em;
  display: block;
  float: right; }

/* ----------------------------------------
    Dropdown Base
---------------------------------------- */
.dropdown {
  width: 100%;
  display: inline-block;
  vertical-align: top; }
  .dropdown + .dropdown {
    margin-top: 1rem; }

/* ----------------------------------------
    Dropdown Information
---------------------------------------- */
.dropdown__label {
  margin-bottom: 0.25rem;
  font-weight: 500; }

.dropdown__selected {
  padding: 0.85rem 1.25rem 0.8rem;
  text-align: left;
  position: relative;
  cursor: pointer;
  /* state */ }
  .dropdown__selected.is-active + .dropdown__holder {
    border: 1px solid #002F87;
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
    z-index: 10000;
    /* responsive */ }
    @media screen and (min-width: 0) and (max-width: 639px) {
      .dropdown__selected.is-active + .dropdown__holder {
        border-bottom: 0; } }

/* ----------------------------------------
    Dropdown Options
---------------------------------------- */
.dropdown__form {
  background: #FFFFFF;
  color: #002F87;
  overflow: hidden; }

.dropdown__holder {
  width: calc(100% + 2px);
  height: 0;
  max-height: 320px;
  margin-top: -2px;
  margin-left: -1px;
  position: absolute;
  bottom: 1px;
  left: 0;
  overflow: auto;
  z-index: 100;
  -ms-overflow-style: none;
  transform: translateY(100%);
  transition: border 0.25s ease;
  /* responsive */ }
  .dropdown__holder ::-webkit-scrollbar {
    width: 0;
    background: transparent; }
  .dropdown__holder ::-webkit-scrollbar-thumb {
    background: transparent; }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .dropdown__holder {
      position: relative;
      bottom: auto;
      left: auto;
      overflow: hidden;
      transform: translateY(0); } }

.dropdown__options {
  width: 100%;
  border: 1px solid #002F87;
  border-radius: 4px;
  font-family: "Nimbus", "Helvetica", sans-serif;
  font-size: 1.1875em;
  font-weight: 300;
  line-height: 1.5em;
  color: #002F87;
  position: relative;
  display: inline-block;
  cursor: pointer; }

.dropdown__option {
  font-size: 0.875em;
  line-height: 1em;
  text-align: left;
  transition: background 0.2s ease;
  /* state */ }
  .dropdown__option + .dropdown__option {
    border-top: 1px solid #edf0f2; }
  .dropdown__option:hover {
    background: #edf0f2; }

body {
  font-family: "Nimbus", "Helvetica", sans-serif;
  font-size: 16px;
  color: #002F87; }

/* ----------------------------------------
    Headings
---------------------------------------- */
h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 {
  margin: 0 0 0.25em;
  font-family: "Lubalin", "Helvetica", sans-serif;
  font-weight: 600; }

.h1,
h1 {
  font-size: 3.5em; }
  @media screen and (min-width: 560px) {
    .h1,
    h1 {
      font-size: 4em; } }

.h2,
h2 {
  font-size: 3.5em; }

.h3,
h3 {
  font-size: 3em; }

.h4,
h4 {
  font-size: 2.5em; }

.h5,
h5 {
  font-size: 1.625em; }

.h6,
h6 {
  font-size: 1.25em; }

/* ----------------------------------------
    Blockquote
---------------------------------------- */
blockquote {
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  display: block;
  width: 65%;
  text-align: center; }
  blockquote p {
    font-size: 2.5em;
    font-weight: 700;
    line-height: 1.25em;
    /* responsive */
    /* responsive */ }
    @media screen and (min-width: 0) and (max-width: 959px) {
      blockquote p {
        font-size: 2em; } }
    @media screen and (min-width: 0) and (max-width: 639px) {
      blockquote p {
        font-size: 1.5em; } }
  blockquote + cite {
    margin-top: 0.5em;
    text-align: center; }

/* ----------------------------------------
    Paragraphs
---------------------------------------- */
p {
  margin: 0;
  margin-bottom: 1.18em;
  line-height: 1.5em;
  font-size: 1.1875em; }
  p:last-of-type {
    margin-bottom: 0; }
  p a {
    text-decoration: underline; }
  p svg {
    width: auto;
    height: 0.8em;
    margin-right: 0.5em;
    padding: 0.1em 0;
    display: inline; }

b,
strong {
  font-weight: 700; }

u {
  text-decoration: underline; }

abbr,
acronym,
dfn,
cite,
em,
i {
  font-style: italic; }

/* ----------------------------------------
    Additional Tags
---------------------------------------- */
hr {
  width: 100%;
  height: 1px;
  border: 0;
  background: rgba(24, 23, 22, 0.25); }

sup,
sub {
  height: 0;
  font-size: 0.75em;
  font-weight: 300;
  line-height: 0;
  vertical-align: baseline; }

sup {
  bottom: 1ex; }

sub {
  top: 0.5ex; }

small {
  font-size: 0.75em;
  line-height: 1.5em; }

big {
  font-size: 1.25em;
  line-height: 1.5em; }

/* ----------------------------------------
    Form Base
---------------------------------------- */
form {
  width: 100%;
  margin: 0; }
  form * {
    box-sizing: border-box;
    outline: none; }

/* ----------------------------------------
    Form Core
---------------------------------------- */
.form__desc {
  font-family: "Nimbus", "Helvetica", sans-serif;
  font-size: 1.1875em;
  font-weight: 300;
  line-height: 1.5em;
  margin-right: 1em;
  display: inline; }

.form__group {
  margin: 1.5em 0; }
  .form__group:first-of-type {
    margin-top: 0; }
  .form__group:last-of-type {
    margin-bottom: 0; }
  .form__group--chained {
    width: auto;
    margin: 0;
    display: inline-block; }

.form__option {
  /* state */ }
  .form__option + label {
    font-weight: 400;
    cursor: pointer; }
    .form__option + label:before {
      content: "";
      position: relative;
      display: inline-block;
      width: 0.8em;
      height: 0.8em;
      margin: -0.1em 0;
      margin-right: 0.5em;
      border: 1px solid rgba(24, 23, 22, 0.1);
      transition: background 0.25s ease; }
  .form__option:checked {
    /* stylelint-disable */
    /* stylelint-enable */ }
    .form__option:checked + label:before {
      background: #002F87; }

/* ----------------------------------------
    Label
---------------------------------------- */
label {
  width: auto;
  max-width: 100%;
  margin: 1rem 0 0.5rem;
  display: block; }
  label + input,
  label + textarea,
  label + select {
    margin-top: 0.25em; }

/* ----------------------------------------
    Input Base
---------------------------------------- */
input,
textarea,
select {
  width: 100%;
  padding: 1em;
  border-radius: 2px;
  font-family: "Nimbus", "Helvetica", sans-serif;
  font-weight: inherit; }
  input::-webkit-input-placeholder, textarea::-webkit-input-placeholder, select::-webkit-input-placeholder {
    color: rgba(0, 47, 135, 0.5); }
  input:-moz-placeholder, textarea:-moz-placeholder, select:-moz-placeholder {
    color: rgba(0, 47, 135, 0.5); }
  input::-moz-placeholder, textarea::-moz-placeholder, select::-moz-placeholder {
    color: rgba(0, 47, 135, 0.5); }
  input:-ms-input-placeholder, textarea:-ms-input-placeholder, select:-ms-input-placeholder {
    color: rgba(0, 47, 135, 0.5); }

/* ----------------------------------------
    Input Text
---------------------------------------- */
input[type='text'],
input[type='email'],
input[type='file'] {
  margin-right: 1rem;
  padding: 1rem 1rem 0.625rem 0;
  border: 1px solid rgba(24, 23, 22, 0.1);
  background: transparent;
  font-family: "Nimbus", "Helvetica", sans-serif;
  outline: none; }

/* ----------------------------------------
    Input Search
---------------------------------------- */
input[type='search'] {
  border: 0;
  border-radius: 0;
  display: inline-block;
  -webkit-appearance: textfield; }
  input[type='search']::-webkit-search-decoration {
    -webkit-appearance: none; }

/* ----------------------------------------
    Input Textarea
---------------------------------------- */
textarea {
  height: 10rem;
  border: 1px solid rgba(24, 23, 22, 0.1);
  line-height: inherit;
  resize: vertical; }

/* ----------------------------------------
    Input Radio
---------------------------------------- */
input[type='radio'] {
  display: none; }
  input[type='radio'] + label:before {
    border-radius: 50%; }

/* ----------------------------------------
    Select
---------------------------------------- */
select {
  height: 3.3rem;
  border: 1px solid rgba(24, 23, 22, 0.1);
  background: #FFFFFF; }

/* ----------------------------------------
    Button
---------------------------------------- */
[type='submit']:disabled,
button:disabled {
  opacity: 0.25;
  cursor: not-allowed; }

/* ----------------------------------------
    Header slider Base
---------------------------------------- */
.header-slider {
  width: 100%;
  position: relative;
  display: inline-block;
  vertical-align: top; }
  .header-slider * {
    outline: none; }

/* ----------------------------------------
    Header slider slide
---------------------------------------- */
.header-slider__slides {
  height: 42.5vw;
  max-height: 560px;
  position: relative;
  overflow: hidden;
  /* Responsive */ }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .header-slider__slides {
      height: 100%; } }

/* ----------------------------------------
    Header slider Image
---------------------------------------- */
.header-slider__image {
  width: 60%;
  height: 42.5vw;
  max-height: 560px;
  position: relative;
  display: inline-block;
  overflow: hidden;
  vertical-align: top;
  -webkit-clip-path: polygon(100% 0%, calc(100% - 148px) 50%, 100% 100%, 0 100%, 0 0);
  clip-path: polygon(100% 0%, calc(100% - 148px) 50%, 100% 100%, 0 100%, 0 0);
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .header-slider__image {
      width: 100%;
      display: block;
      -webkit-clip-path: unset;
      clip-path: unset; } }

/* ----------------------------------------
    Header slider Content
---------------------------------------- */
.header-slider__content {
  width: 39%;
  max-width: 475px;
  height: 100%;
  padding: 4.25rem 2.5rem 0;
  display: inline-block;
  vertical-align: top;
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 1279px) {
    .header-slider__content {
      padding-top: 4rem; } }
  @media screen and (min-width: 0) and (max-width: 959px) {
    .header-slider__content {
      padding-top: 2.5rem; } }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .header-slider__content {
      width: 100%;
      max-width: unset;
      padding: 6%;
      display: block; } }

.header-slider__title {
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 1279px) {
    .header-slider__title {
      display: -webkit-box;
      overflow: hidden;
      text-overflow: ellipsis;
      -webkit-line-clamp: 4;
      line-clamp: 4;
      -webkit-box-orient: vertical;
      box-orient: vertical; } }
  @media screen and (min-width: 0) and (max-width: 959px) {
    .header-slider__title {
      font-size: 1.5625em;
      display: -webkit-box;
      overflow: hidden;
      text-overflow: ellipsis;
      -webkit-line-clamp: 4;
      line-clamp: 4;
      -webkit-box-orient: vertical;
      box-orient: vertical; } }

.header-slider__sub-title {
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 1279px) {
    .header-slider__sub-title {
      margin-bottom: 0; } }
  @media screen and (min-width: 0) and (max-width: 959px) {
    .header-slider__sub-title {
      display: -webkit-box;
      overflow: hidden;
      text-overflow: ellipsis;
      -webkit-line-clamp: 2;
      line-clamp: 2;
      -webkit-box-orient: vertical;
      box-orient: vertical; } }

@media screen and (min-width: 0) and (max-width: 959px) {
  .header-slider__desc {
    display: -webkit-box;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 5;
    line-clamp: 5;
    -webkit-box-orient: vertical;
    box-orient: vertical; } }

.header-slider__sub-title, .header-slider__desc {
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 959px) {
    .header-slider__sub-title, .header-slider__desc {
      font-size: 1em; } }

.header-slider__button {
  margin-top: 2%; }

/* ----------------------------------------
    Header slider dots
---------------------------------------- */
.header-slider__dots {
  width: 100%;
  position: absolute;
  top: 4rem;
  left: calc(60% + 2.5rem);
  z-index: 1;
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 1279px) {
    .header-slider__dots {
      top: 1rem; } }
  @media screen and (min-width: 0) and (max-width: 959px) {
    .header-slider__dots {
      top: 0; } }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .header-slider__dots {
      left: calc(75% + 2.5rem); } }
  @media screen and (min-width: 0) and (max-width: 419px) {
    .header-slider__dots {
      top: 27%;
      left: 6%; } }

.slick-dots {
  margin: 0;
  padding: 1rem 0;
  display: flex;
  list-style-type: none; }
  .slick-dots li {
    margin: 0 0.25rem; }
  .slick-dots button {
    width: 1rem;
    height: 1rem;
    padding: 0;
    border: 1px solid currentColor;
    border-radius: 100%;
    color: #002F87;
    display: block;
    text-indent: -9999px;
    transform: background 0.4s ease; }
  .slick-dots li.slick-active button {
    background-color: currentColor;
    color: #F9CDD0; }

/* ----------------------------------------
    Hex Iage
---------------------------------------- */
.hex-image {
  overflow: hidden;
  position: relative;
  -webkit-clip-path: polygon(27% 0%, 73% 0, 100% 50%, 73% 100%, 27% 100%, 0% 50%);
  clip-path: polygon(27% 0%, 73% 0, 100% 50%, 73% 100%, 27% 100%, 0% 50%); }
  .hex-image:before {
    content: "";
    position: relative;
    display: inline-block;
    width: 100%;
    padding-top: 83.33333%; }
  .hex-image img {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0; }
    @supports (object-fit: cover) {
      .hex-image img {
        object-fit: cover; } }

/* ----------------------------------------
    Icons
---------------------------------------- */
[class^='icon__'] {
  width: 1.5em;
  height: 1.5em;
  margin: 0;
  padding: 0;
  display: inline-block; }
  [class^='icon__']:before {
    content: "";
    position: relative;
    display: inline-block;
    width: 1em;
    height: 1em;
    margin: 0.25em;
    background-size: contain;
    background-position: center center;
    background-repeat: no-repeat; }

/* ----------------------------------------
    Icon Sizes
---------------------------------------- */
.icon--small {
  font-size: 0.875em; }

.icon--large {
  font-size: 1.875em; }

/* ----------------------------------------
    Icon Group
---------------------------------------- */
.icon-group {
  text-align: left;
  display: block; }
  .icon-group a {
    position: relative;
    display: inline-block; }
    .icon-group a:first-of-type {
      margin-left: 0; }
    .icon-group a:last-of-type {
      margin-right: 0; }
    .icon-group a:nth-of-type(even) {
      margin: 0 0.75em; }
  .icon-group svg {
    width: auto;
    height: 1em;
    position: relative; }
    .icon-group svg * {
      fill: #FFFFFF; }

/* ----------------------------------------
    Icon Color
---------------------------------------- */
/* ----------------------------------------
    Icon Classes
---------------------------------------- */
/* ----------------------------------------
    Image Base
---------------------------------------- */
figure {
  margin: 0; }

figcaption {
  width: 80%;
  margin: 1em auto;
  font-family: "Nimbus", "Helvetica", sans-serif;
  font-size: 0.9375em;
  font-weight: 500;
  font-style: normal;
  text-align: center;
  overflow: hidden;
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 639px) {
    figcaption {
      width: 100%; } }

img[src=''] {
  display: none; }

/* ----------------------------------------
    Image Core
---------------------------------------- */
/* ----------------------------------------
    Image Cover
---------------------------------------- */
.image {
  position: relative;
  background: transparent;
  overflow: hidden; }
  .image:before {
    content: "";
    position: relative;
    display: inline-block;
    width: 100%;
    padding-top: 56.25%; }
  .image img {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0; }
    @supports (object-fit: cover) {
      .image img {
        object-fit: cover; } }
  .image--large {
    position: relative; }
    .image--large:before {
      content: "";
      position: relative;
      display: inline-block;
      width: 100%;
      padding-top: 75%; }
    .image--large img {
      width: 100%;
      height: 100%;
      position: absolute;
      top: 0;
      bottom: 0;
      left: 0;
      right: 0; }
      @supports (object-fit: cover) {
        .image--large img {
          object-fit: cover; } }
  .image__cover {
    width: 101%;
    height: calc(100% + 2px);
    margin-top: -1px;
    pointer-events: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-user-drag: none;
    -moz-user-drag: none;
    -ms-user-drag: none;
    user-drag: none; }

/* ----------------------------------------
    Lightbox
---------------------------------------- */
.lightbox {
  width: 100%;
  height: 100%;
  background: rgba(24, 23, 22, 0.5);
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1000000;
  display: block;
  opacity: 0;
  transform: scale(1.05);
  cursor: pointer;
  /* responsive */ }
  .lightbox img {
    width: auto;
    max-width: 90%;
    height: auto;
    max-height: 90%; }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .lightbox img {
      max-width: 100%; } }

/* ----------------------------------------
    Enlarge
---------------------------------------- */
.js-enlarge {
  cursor: pointer;
  transition: opacity 0.25s ease; }
  @media screen and (min-width: 1080px) {
    .js-enlarge:hover {
      opacity: 0.75; } }

/* ----------------------------------------
    Notification
---------------------------------------- */
.notification {
  width: 100%;
  height: auto;
  background: #002F87;
  color: #FFFFFF;
  z-index: 90000000;
  display: block;
  overflow: hidden;
  transition: height 0.25s ease;
  /* modifier */
  /* state */ }
  .notification a {
    text-decoration: underline; }
  .notification__close {
    width: 1rem;
    height: 1rem;
    position: absolute;
    top: 50%;
    right: 1rem;
    display: block;
    transform: translateY(-50%);
    cursor: pointer;
    transition: transform 0.25s ease, opacity 0.25s ease;
    /* svg */
    /* state */ }
    .notification__close svg * {
      fill: #FFFFFF; }
    @media screen and (min-width: 1080px) {
      .notification__close:hover {
        opacity: 0.75;
        transform: translateY(-50%) scale(0.9); } }
  .notification__text {
    padding: 1em 3rem 0.9em;
    font-size: 1em;
    text-align: center; }
  .notification--hidden {
    display: none; }
  .notification.is-closed {
    height: 0; }

/* ----------------------------------------
    Pagination
---------------------------------------- */
.pagination {
  margin-top: 2rem;
  display: flex;
  flex-wrap: wrap;
  justify-content: center; }
  .pagination__item {
    width: 40px;
    height: 40px;
    margin: 0 0.5em;
    border-radius: 50%;
    background: #F9CDD0;
    color: #002F87;
    display: flex;
    align-items: center;
    justify-content: center; }
    .pagination__item.current, .pagination__item.seperator {
      user-select: none;
      cursor: default; }
    .pagination__item.current {
      background: #002F87;
      color: #FFFFFF; }
    .pagination__item.seperator {
      background: #f3f4f5;
      color: #899299; }
    @media screen and (min-width: 0) and (max-width: 639px) {
      .pagination__item.first, .pagination__item.last, .pagination__item.seperator {
        display: none; } }

/* ----------------------------------------
   Popup wrapper
---------------------------------------- */
.popup-wrapper {
  width: 100vw;
  height: 100vh;
  background: rgba(24, 23, 22, 0.3);
  position: fixed;
  top: 0;
  left: 0;
  z-index: 10000;
  display: none;
  opacity: 0;
  transition: opacity 0.75s;
  /* responsive */ }
  @media screen and (min-width: 420px) and (max-width: 959px) and (orientation: landscape) {
    .popup-wrapper {
      font-size: 0.85em; } }

/* ----------------------------------------
   Popup Active
---------------------------------------- */
.popup-wrapper.is-active {
  display: block;
  opacity: 1;
  transition: opacity 0.5s; }

/* ----------------------------------------
   Popup Base
---------------------------------------- */
.popup ul {
  margin: 0;
  padding: 0;
  list-style-type: none; }

/* ----------------------------------------
   Popup
---------------------------------------- */
.popup {
  width: 584px;
  max-width: 100%;
  padding: 3.25rem 4rem;
  background: #FFFFFF;
  position: absolute;
  top: calc(50% + 50px);
  left: 50%;
  overflow: hidden;
  transform: translate(-50%, -50%);
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 1279px) {
    .popup {
      top: calc(50% + 42px); } }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .popup {
      padding: 3rem 2rem;
      font-size: 0.9em; } }
  @media screen and (min-width: 420px) and (max-width: 959px) and (orientation: landscape) {
    .popup {
      top: 50%; } }
  .popup--clean {
    padding: 0; }
  .popup--large {
    width: 900px;
    max-width: 90%;
    max-height: calc(100% - 2rem);
    /* responsive */ }
    @media screen and (min-width: 0) and (max-width: 639px) {
      .popup--large {
        overflow: auto; } }
  .popup--team {
    height: 477px; }
    .popup--team .popup__content {
      overflow: auto; }

/* ----------------------------------------
   Popup Close
---------------------------------------- */
.popup__close {
  width: 30px;
  height: 30px;
  margin: 0;
  border-radius: 50%;
  background: #FFFFFF;
  position: absolute;
  top: 1rem;
  left: 1rem;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer; }
  .popup__close--right {
    left: auto;
    right: 1rem; }
  .popup__close svg {
    pointer-events: none; }

/* ----------------------------------------
   Popup Image
---------------------------------------- */
.popup__image {
  width: 100%; }

.popup__thumb {
  width: 37.5%;
  max-width: 360px;
  height: 478px;
  margin-bottom: -0.25rem;
  position: relative;
  display: block;
  float: left;
  overflow: hidden;
  position: relative;
  /* responsive */ }
  .popup__thumb:before {
    content: "";
    position: relative;
    display: inline-block;
    width: 100%;
    padding-top: 140%; }
  .popup__thumb img {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0; }
    @supports (object-fit: cover) {
      .popup__thumb img {
        object-fit: cover; } }
  @media screen and (min-width: 0) and (max-width: 959px) {
    .popup__thumb {
      display: none; } }

/* ----------------------------------------
   Popup Section
---------------------------------------- */
.popup__section {
  padding: 2rem;
  /* responsive */ }
  .popup__section--fit {
    padding-top: 0; }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .popup__section {
      padding: 1rem; } }
  @media screen and (min-width: 0) and (max-width: 959px) and (orientation: landscape) {
    .popup__section {
      padding: 5px 10px; } }

.popup__content {
  width: 62.5%;
  height: 100%;
  display: block;
  float: right;
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 959px) {
    .popup__content {
      width: 100%; } }

/* ----------------------------------------
   Popup Content
---------------------------------------- */
.popup__description {
  margin-top: 1em;
  font-family: "Nimbus", "Helvetica", sans-serif;
  font-size: 1.1875em;
  font-weight: 300;
  line-height: 1.5em;
  -webkit-box-orient: vertical;
  -moz-box-orient: vertical;
  -ms-box-orient: vertical;
  box-orient: vertical;
  /* stylelint-disable */
  display: -webkit-box;
  /* stylelint-enable */
  overflow: hidden; }
  @media screen and (min-width: 420px) and (max-width: 959px) and (orientation: landscape) {
    .popup__description {
      margin-top: 0.5em; } }

.popup__name, .popup__title {
  margin-bottom: 0;
  max-width: 100%;
  hyphens: auto;
  font-size: 2.5em;
  /* responsive */ }
  .popup__name--small, .popup__title--small {
    margin-bottom: 0.25em;
    font-size: 1.125em;
    font-weight: 300; }
  @media screen and (min-width: 0) and (max-width: 959px) {
    .popup__name, .popup__title {
      font-size: 2em; } }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .popup__name, .popup__title {
      font-size: 1.625em; } }

.popup__tags {
  margin-top: 0.75rem; }

/* ----------------------------------------
   Popup List
---------------------------------------- */
.popup__item {
  width: 100%;
  font-family: "Nimbus", "Helvetica", sans-serif;
  font-size: 1.1875em;
  font-weight: 300;
  line-height: 1.5em;
  display: inline-block; }
  .popup__item:after {
    content: "";
    position: relative;
    display: inline-block;
    width: 1em;
    height: 1em;
    margin-top: 0.25em;
    margin-left: 0.25em;
    margin-right: 0.5rem;
    background-image: url("./../images/arrow-long-right.svg");
    background-size: 80% auto;
    background-position: bottom;
    background-repeat: no-repeat;
    position: relative;
    display: inline-block; }
  @media screen and (min-width: 420px) and (max-width: 959px) and (orientation: landscape) {
    .popup__item {
      width: unset; } }

/* ----------------------------------------
   Popup Contact
---------------------------------------- */
.popup__email, .popup__phone {
  width: 100%;
  margin: 0.45em 0;
  font-family: "Lubalin", "Helvetica", sans-serif;
  font-size: 1.125em;
  font-weight: 300;
  display: block;
  /* svg */ }
  .popup__email svg, .popup__phone svg {
    width: 1em;
    height: 1em;
    margin-right: 0.25em;
    display: inline-block;
    vertical-align: middle; }
    .popup__email svg *, .popup__phone svg * {
      fill: #002F87; }

/* ----------------------------------------
    Recaptcha
---------------------------------------- */
.grecaptcha-badge {
  z-index: 99999; }

/* ----------------------------------------
    Slider Base
---------------------------------------- */
.slider {
  width: 66%;
  position: relative;
  display: inline-block;
  vertical-align: top; }
  .slider * {
    outline: none; }
  .slider svg {
    fill: none !important; }

/* ----------------------------------------
    Slider Arrows
---------------------------------------- */
.slider__arrows {
  position: absolute;
  top: 50%;
  right: -0.5rem;
  z-index: 1;
  transform: translate(50%, -50%);
  /* responsive */ }
  .slider__arrows--left {
    margin-bottom: 1rem; }
  @media screen and (min-width: 0) and (max-width: 1279px) {
    .slider__arrows {
      right: 0; } }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .slider__arrows {
      display: none; } }

.slider__arrow {
  transition: transform 0.25s ease;
  /* state */ }
  .slider__arrow:hover {
    transform: scale(1.05); }

/* ----------------------------------------
    Slider Slide
---------------------------------------- */
.slider__slides {
  width: calc(100% + 2.5rem); }

.slider__slide {
  padding-right: 2.25rem;
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .slider__slide {
      padding-right: 1.5rem; } }
  @media screen and (min-width: 0) and (max-width: 559px) {
    .slider__slide {
      padding-right: 1.5rem; } }

/* ----------------------------------------
    Slider List
---------------------------------------- */
.slick-list {
  overflow: visible !important; }

/* ----------------------------------------
    Slider Clip
---------------------------------------- */
.slider--clip-left {
  /* responsive */ }
  @media screen and (min-width: 640px) {
    .slider--clip-left {
      -webkit-clip-path: polygon(0% 0%, 500% 0, 500% 100%, 0 100%);
      clip-path: polygon(0% 0%, 500% 0, 500% 100%, 0 100%); } }

/* ----------------------------------------
    Tags
---------------------------------------- */
.tag {
  margin-top: 0.45em;
  margin-right: 0.5em;
  padding: 0.45em 0.45em 0.25em;
  font-family: "Nimbus", "Helvetica", sans-serif;
  font-size: 0.8125em;
  font-weight: 300;
  letter-spacing: 0.02em;
  line-height: 1em;
  text-transform: uppercase;
  text-decoration: none !important;
  text-align: center;
  display: inline-block;
  box-sizing: border-box;
  outline: none; }

/* ----------------------------------------
    Tag Colors
---------------------------------------- */
.tag-solid--blue {
  border: 0;
  background: #002f87;
  color: white; }

.tag-solid--lightblue {
  border: 0;
  background: #ebeff2;
  color: #002f87; }

.tag-solid--green {
  border: 0;
  background: #b5d9b9;
  color: #002f87; }

.tag-solid--pink {
  border: 0;
  background: #f9cdd0;
  color: #002f87; }

.tag-solid--white {
  border: 0;
  background: white;
  color: #002f87; }

.tag-solid--lightgrey {
  border: 0;
  background: #dee3e7;
  color: #002f87; }

.tag-solid--grey {
  border: 0;
  background: #899299;
  color: #002f87; }

.tag-solid--black {
  border: 0;
  background: #181716;
  color: white; }

.tag-solid--error {
  border: 0;
  background: #f56565;
  color: #002f87; }

.tag-solid-border--blue {
  border: 1px solid #002F87;
  color: #002F87; }

.tag-solid-border--lightblue {
  border: 1px solid #EBEFF2;
  color: #EBEFF2; }

.tag-solid-border--green {
  border: 1px solid #B5D9B9;
  color: #B5D9B9; }

.tag-solid-border--pink {
  border: 1px solid #F9CDD0;
  color: #F9CDD0; }

.tag-solid-border--white {
  border: 1px solid #FFFFFF;
  color: #FFFFFF; }

.tag-solid-border--lightgrey {
  border: 1px solid #DEE3E7;
  color: #DEE3E7; }

.tag-solid-border--grey {
  border: 1px solid #899299;
  color: #899299; }

.tag-solid-border--black {
  border: 1px solid #181716;
  color: #181716; }

.tag-solid-border--error {
  border: 1px solid #F56565;
  color: #F56565; }

/* ----------------------------------------
    Tooltip
---------------------------------------- */
[tooltip] {
  position: relative; }

[tooltip]:before,
[tooltip]:after {
  font-size: 1rem;
  line-height: 1;
  position: absolute;
  display: none;
  opacity: 0;
  pointer-events: none;
  user-select: none; }

[tooltip]:before {
  content: '';
  border: 5px solid transparent;
  z-index: 1001; }

[tooltip]:after {
  content: attr(tooltip);
  min-width: 3em;
  max-width: 21em;
  padding: 0.625rem;
  border-radius: 0.3ch;
  background: #002F87;
  font-family: "Nimbus", "Helvetica", sans-serif, "Arial", sans-serif;
  text-align: center;
  white-space: nowrap;
  color: #FFFFFF;
  z-index: 1000;
  overflow: hidden;
  box-shadow: 0 1em 2em -0.5em rgba(24, 23, 22, 0.35);
  text-overflow: ellipsis; }

[tooltip]:hover:before,
[tooltip]:hover:after {
  display: block; }

[tooltip='']:before,
[tooltip='']:after {
  display: none !important; }

/* ----------------------------------------
    Tooltip Up
---------------------------------------- */
[tooltip]:not([flow]):before,
[tooltip][flow^='up']:before {
  border-bottom-width: 0;
  border-top-color: #002F87;
  bottom: 100%; }

[tooltip]:not([flow]):after,
[tooltip][flow^='up']:after {
  bottom: calc(100% + 5px); }

[tooltip]:not([flow]):before,
[tooltip]:not([flow]):after,
[tooltip][flow^='up']:before,
[tooltip][flow^='up']:after {
  left: 50%;
  transform: translate(-50%, -0.5em); }

/* ----------------------------------------
    Tooltip Down
---------------------------------------- */
[tooltip][flow^='down']:before {
  border-top-width: 0;
  border-bottom-color: #002F87;
  top: 100%; }

[tooltip][flow^='down']:after {
  top: calc(100% + 5px); }

[tooltip][flow^='down']:before,
[tooltip][flow^='down']:after {
  left: 50%;
  transform: translate(-50%, 0.5em); }

/* ----------------------------------------
    Tooltip left
---------------------------------------- */
[tooltip][flow^='left']:before {
  border-right-width: 0;
  border-left-color: #002F87;
  top: 50%;
  left: calc(0 - 5px);
  transform: translate(-0.5em, -50%); }

[tooltip][flow^='left']:after {
  top: 50%;
  right: calc(100% + 5px);
  transform: translate(-0.5em, -50%); }

/* ----------------------------------------
    Tooltip Right
---------------------------------------- */
[tooltip][flow^='right']:before {
  border-left-width: 0;
  border-right-color: #002F87;
  top: 50%;
  right: calc(0 - 5px);
  transform: translate(0.5em, -50%); }

[tooltip][flow^='right']:after {
  top: 50%;
  left: calc(100% + 5px);
  transform: translate(0.5em, -50%); }

/* ----------------------------------------
    Tooltip Keyframes
---------------------------------------- */
@keyframes tooltips-vert {
  to {
    opacity: 0.9;
    transform: translate(-50%, 0); } }

@keyframes tooltips-horz {
  to {
    opacity: 0.9;
    transform: translate(0, -50%); } }

[tooltip]:not([flow]):hover:before,
[tooltip]:not([flow]):hover:after,
[tooltip][flow^='up']:hover:before,
[tooltip][flow^='up']:hover:after,
[tooltip][flow^='down']:hover:before,
[tooltip][flow^='down']:hover:after {
  animation: tooltips-vert 300ms ease-out forwards; }

[tooltip][flow^='left']:hover:before,
[tooltip][flow^='left']:hover:after,
[tooltip][flow^='right']:hover:before,
[tooltip][flow^='right']:hover:after {
  animation: tooltips-horz 300ms ease-out forwards; }

/* ----------------------------------------
    Video
---------------------------------------- */
.video {
  padding-top: 56.25%;
  position: relative; }
  .video__img {
    opacity: 0.65; }
  .video__thumb-bg {
    position: absolute; }
  .video__thumb {
    width: 100%;
    height: 100%;
    background-color: #181716;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    position: absolute;
    top: 0;
    z-index: 2;
    overflow: hidden;
    cursor: pointer; }
    .video__thumb:hover .video__play {
      transform: scale(1.1); }
  .video iframe {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1; }
  .video__play {
    width: 80px;
    height: 80px;
    margin: -40px 0 0 -40px;
    border-radius: 100%;
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 1;
    transform: scale(1);
    transition: all 0.2s;
    display: flex;
    align-items: center;
    justify-content: center; }

/* ----------------------------------------
    Components. Styling in a vacuum
---------------------------------------- */
.c-hero {
  display: flex;
  flex-wrap: wrap;
  align-items: center; }
  @media screen and (min-width: 560px) {
    .c-hero {
      flex-wrap: nowrap; }
      .c-hero--pink {
        background: #F9CDD0;
        color: #002F87; }
      .c-hero--green {
        background: #B5D9B9;
        color: #002F87; }
      .c-hero--lightgrey {
        background: #DEE3E7;
        color: #002F87; }
      .c-hero--blue {
        background: #002F87;
        color: #FFFFFF; } }
  .c-hero__image {
    width: 100%; }
    @media screen and (min-width: 560px) {
      .c-hero__image {
        -webkit-clip-path: polygon(100% 0%, calc(100% - 148px) 50%, 100% 100%, 0 100%, 0 0);
        clip-path: polygon(100% 0%, calc(100% - 148px) 50%, 100% 100%, 0 100%, 0 0); } }
    .c-hero__image img {
      max-width: 100%;
      vertical-align: bottom; }
  .c-hero__content {
    width: 90%;
    margin: -4rem auto 2rem;
    padding: 2.5rem;
    box-sizing: border-box; }
    .c-hero__content--pink {
      background: #F9CDD0;
      color: #002F87; }
    .c-hero__content--green {
      background: #B5D9B9;
      color: #002F87; }
    .c-hero__content--lightgrey {
      background: #DEE3E7;
      color: #002F87; }
    .c-hero__content--blue {
      background: #002F87;
      color: #FFFFFF; }
    @media screen and (min-width: 560px) {
      .c-hero__content {
        width: 50%;
        margin: 0;
        padding: 1.5rem; } }
    .c-hero__content__subtitle {
      font-size: 1.1875em; }
    @media screen and (min-width: 0) and (max-width: 959px) {
      .c-hero__content__title {
        font-size: 2.5em; } }
  @media screen and (min-width: 960px) {
    .c-hero > * {
      width: 50%; } }

.c-intro p {
  font-family: "Lubalin", "Helvetica", sans-serif;
  font-size: 1.375rem; }

/* ----------------------------------------
   Loadmore Border
---------------------------------------- */
#loadmore-results {
  padding-top: 1.5rem;
  border-top: 1px solid #e7e9eb;
  margin-top: -1.5rem; }

.c-magazine-cards {
  overflow: hidden; }

.c-partners__wrapper {
  margin-left: -1.25em;
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: center; }
  @media screen and (min-width: 560px) {
    .c-partners__wrapper {
      flex-wrap: nowrap; } }

.c-partners__item {
  width: 100%;
  margin-top: 2em;
  padding: 1.25em;
  box-sizing: border-box; }
  @media screen and (min-width: 420px) {
    .c-partners__item {
      width: 50%; } }
  @media screen and (min-width: 768px) {
    .c-partners__item {
      width: 100%; } }
  .c-partners__item img {
    width: 100%;
    display: block;
    margin-bottom: 1em;
    margin-left: auto;
    margin-right: auto; }
  .c-partners__item p {
    font-size: 1em; }

.c-slider__info {
  margin-bottom: 2rem;
  padding-right: 2.5rem;
  display: inline-block; }
  @media screen and (min-width: 960px) {
    .c-slider__info {
      width: 33%; } }
  .c-slider__info > * + * {
    margin-top: 2rem; }

.c-slider__info + .c-slider__slider {
  width: 66%; }

.c-slider__slider {
  width: 100%;
  display: inline-block; }

.c-slider__supertitle {
  margin-bottom: 2rem;
  display: flex;
  justify-content: space-between; }

.c-steps .steps {
  margin-top: 0;
  padding-top: 0; }

/* ----------------------------------------
    Layout
---------------------------------------- */
/* ----------------------------------------
    Advice Base
---------------------------------------- */
.advice dt,
.advice dd {
  line-height: 1em;
  text-align: left; }

.advice svg {
  width: 1.2em;
  height: 1.2em;
  margin: 0 0.5rem -0.25em 0;
  display: inline-block; }

/* ----------------------------------------
    Advice Core
---------------------------------------- */
.advice {
  width: auto;
  position: fixed;
  bottom: 3rem;
  right: 3rem;
  z-index: 500;
  display: block;
  overflow: visible;
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .advice {
      width: calc(100% - 4rem);
      bottom: 3rem;
      left: 50%;
      right: auto;
      transform: translateX(-50%); } }

/* ----------------------------------------
    Advice Core
---------------------------------------- */
.advice__button {
  box-shadow: rgba(24, 23, 22, 0.1) 0 0.25rem 2.75rem 0;
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .advice__button {
      width: 100%; } }

/* ----------------------------------------
    Advice Tip
---------------------------------------- */
.advice__tip {
  width: 520px;
  max-width: 100%;
  padding: 1.5rem 2rem;
  border-radius: 2px;
  background: #002F87;
  color: #FFFFFF;
  position: fixed;
  bottom: 5.75rem;
  right: 3rem;
  z-index: 1000;
  display: block;
  opacity: 0;
  transition: bottom 0.25s ease;
  /* state */
  /* responsive */ }
  .advice__tip:after {
    content: "";
    position: relative;
    display: inline-block;
    width: 0;
    height: 0;
    border-top: 1em solid #002F87;
    border-left: 1em solid transparent;
    border-right: 1em solid transparent;
    position: absolute;
    bottom: -1em;
    right: 2rem; }
  .advice__tip:not(.active) {
    pointer-events: none; }
  .advice__tip.active {
    bottom: 6.75rem;
    opacity: 1;
    transition: bottom 0.45s ease; }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .advice__tip {
      width: 100%;
      padding: 1rem 1.25rem;
      bottom: 1.5rem;
      right: 0; }
      .advice__tip.active {
        bottom: 3.75rem; } }

/* ----------------------------------------
    Advice Content
---------------------------------------- */
.advice__title {
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .advice__title {
      font-size: 1.375em; } }

.advice__info {
  font-family: "Nimbus", "Helvetica", sans-serif;
  font-size: 1.1875em;
  font-weight: 300;
  line-height: 1.5em;
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .advice__info {
      font-size: 1em; } }

/* ----------------------------------------
    Advice Meta
---------------------------------------- */
.advice__meta {
  width: 100%; }

.advice__type {
  width: 1em;
  height: 1em;
  margin: 0.5em 0;
  font-weight: 400;
  text-align: right;
  float: left;
  clear: left;
  /* svg */ }
  .advice__type svg {
    width: 1em;
    height: 1em;
    display: block; }
    .advice__type svg * {
      fill: #FFFFFF; }

.advice__contact {
  width: calc(100% - 2em);
  margin: 0.5em 0 0.5em 1em;
  float: left; }

.advice__close {
  position: absolute;
  top: 1rem;
  right: 1rem; }
  .advice__close svg {
    height: 11px; }

/* ----------------------------------------
  Base
---------------------------------------- */
body {
  width: 100%;
  background: #edf0f2;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-variant-ligatures: none;
  font-variant-ligatures: none;
  text-shadow: rgba(0, 0, 0, 0.01) 0 0 1px;
  /* responsive */ }
  body.is-nav_open, body.no-scroll, body.is-locked {
    height: 100%;
    overflow: hidden; }
  @media screen and (min-width: 0) and (max-width: 559px) {
    body {
      font-size: 15px; } }

div {
  box-sizing: border-box; }

ol,
ul {
  margin: 0;
  padding-left: 1rem;
  font-family: "Nimbus", "Helvetica", sans-serif;
  font-size: 1.1875em;
  font-weight: 300;
  line-height: 1.5rem;
  color: #002F87; }
  ol ul, ol ol,
  ul ul,
  ul ol {
    font-size: 1em; }

/* ----------------------------------------
  Grid
---------------------------------------- */
.grid {
  margin-left: -2rem;
  margin-right: -2rem;
  width: calc(100% + 4rem); }
  .grid::after {
    clear: both;
    content: "";
    display: block; }
  .grid:after {
    content: '';
    display: table;
    clear: both; }
  .grid > * {
    display: inline-block;
    float: none;
    vertical-align: top; }
  .grid__item:before {
    content: ".grid__item";
    position: relative;
    display: inline-block;
    font-family: "Nimbus", "Helvetica", sans-serif;
    font-size: 0.9375em;
    font-style: normal;
    background: #181716;
    color: #FFFFFF; }
  .grid__item--tiny {
    width: calc(16.66667% - 2.33333rem);
    float: left;
    margin-left: 2rem; }
  .grid__item--small {
    width: calc(25% - 2.5rem);
    float: left;
    margin-left: 2rem; }
  .grid__item--medium {
    width: calc(33.33333% - 2.66667rem);
    float: left;
    margin-left: 2rem;
    /* responsive */ }
    @media screen and (min-width: 0) and (max-width: 1079px) {
      .grid__item--medium {
        width: calc(50% - 3rem);
        float: left;
        margin-left: 2rem; } }
  .grid__item--large {
    width: calc(50% - 3rem);
    float: left;
    margin-left: 2rem; }
  .grid__item--massive {
    width: calc(100% - 4rem);
    float: left;
    margin-left: 2rem; }
  .grid__item--tiny, .grid__item--small, .grid__item--medium, .grid__item--large {
    /* responsive */ }
    @media screen and (max-width: 960px) {
      .grid__item--tiny, .grid__item--small, .grid__item--medium, .grid__item--large {
        width: calc(50% - 4.5rem);
        float: left;
        margin-left: 3rem; } }
  .grid__item--massive {
    /* responsive */ }
    @media screen and (max-width: 960px) {
      .grid__item--massive {
        width: calc(100% - 6rem);
        float: left;
        margin-left: 3rem; } }
  .grid__item--tiny, .grid__item--small, .grid__item--medium, .grid__item--large, .grid__item--massive {
    /* responsive */ }
    @media screen and (max-width: 560px) {
      .grid__item--tiny, .grid__item--small, .grid__item--medium, .grid__item--large, .grid__item--massive {
        width: calc(100% - 12%);
        float: left;
        margin-left: 6%; } }

/* ----------------------------------------
  Main
---------------------------------------- */
main {
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  display: block;
  width: 100%; }

.main {
  position: relative;
  z-index: 10; }
  .main--small {
    margin-top: 2.5rem; }
  .main--medium {
    margin-top: 5rem; }
  .main--large {
    margin-top: 7.5rem; }

/* ----------------------------------------
  Super Container
---------------------------------------- */
.super-container,
[class*='__container'] {
  width: 100%;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  display: block; }

.super-container {
  max-width: 1660px;
  background: #FFFFFF;
  box-shadow: rgba(24, 23, 22, 0.1) 0 0.25rem 2.75rem 0; }
  .super-container--sticky {
    overflow: initial; }

/* ----------------------------------------
  Features
---------------------------------------- */
.features-bottom,
.features-bottom {
  width: 100%;
  overflow: hidden; }

/* ----------------------------------------
  Container
---------------------------------------- */
.hide-overflow {
  overflow: hidden; }

[class*='__container'] {
  max-width: calc(1240px + 8rem);
  padding: 2rem 4rem;
  position: relative;
  /* responsive */ }
  [class*='__container'][class*='--overflow'] {
    overflow: hidden; }
  @media screen and (min-width: 0) and (max-width: 1279px) {
    [class*='__container'] {
      padding: 2rem; } }
  @media screen and (min-width: 0) and (max-width: 959px) {
    [class*='__container'] {
      padding: 4%; } }
  @media screen and (min-width: 0) and (max-width: 639px) {
    [class*='__container'] {
      padding: 6%; } }
  [class*='__container'][class$='--small'] {
    padding: 1rem 17rem;
    /* responsive */ }
    @media screen and (min-width: 0) and (max-width: 1279px) {
      [class*='__container'][class$='--small'] {
        padding: 1rem 2rem; } }
    @media screen and (min-width: 0) and (max-width: 959px) {
      [class*='__container'][class$='--small'] {
        padding: 2% 4%; } }
    @media screen and (min-width: 0) and (max-width: 639px) {
      [class*='__container'][class$='--small'] {
        padding: 3% 6%; } }
  [class*='__container'][class$='--medium-small'] {
    padding: 1rem 10.5rem;
    /* responsive */ }
    @media screen and (min-width: 0) and (max-width: 1279px) {
      [class*='__container'][class$='--medium-small'] {
        padding: 1rem 2rem; } }
    @media screen and (min-width: 0) and (max-width: 959px) {
      [class*='__container'][class$='--medium-small'] {
        padding: 2% 4%; } }
    @media screen and (min-width: 0) and (max-width: 639px) {
      [class*='__container'][class$='--medium-small'] {
        padding: 3% 6%; } }
  [class*='__container'][class$='--medium'] {
    padding: 3rem 10.5rem;
    /* responsive */ }
    @media screen and (min-width: 0) and (max-width: 1279px) {
      [class*='__container'][class$='--medium'] {
        padding: 4rem 2rem; } }
    @media screen and (min-width: 0) and (max-width: 959px) {
      [class*='__container'][class$='--medium'] {
        padding: 6% 4%; } }
    @media screen and (min-width: 0) and (max-width: 639px) {
      [class*='__container'][class$='--medium'] {
        padding: 6%; } }
  [class*='__container'][class$='--large'] {
    padding: 4rem;
    /* responsive */ }
    @media screen and (min-width: 0) and (max-width: 1279px) {
      [class*='__container'][class$='--large'] {
        padding: 4rem 2rem; } }
    @media screen and (min-width: 0) and (max-width: 959px) {
      [class*='__container'][class$='--large'] {
        padding: 6% 4%; } }
    @media screen and (min-width: 0) and (max-width: 639px) {
      [class*='__container'][class$='--large'] {
        padding: 6%; } }
  [class*='__container'][class*='--clean'] {
    padding-top: 0 !important;
    padding-bottom: 0 !important; }
  [class*='__container'][class*='--top-clean'] {
    padding-top: 0 !important; }
  [class*='__container'][class*='--bottom-clean'] {
    padding-bottom: 0 !important; }

/* ----------------------------------------
  Background
---------------------------------------- */
[class*='__left-bg'],
[class*='__right-bg'] {
  width: 150vw;
  height: 100%;
  position: absolute;
  top: 0;
  z-index: -20; }

[class*='__left-bg'] {
  left: -100vw; }

[class*='__right-bg'] {
  right: -100vw; }

/* ----------------------------------------
  Background Colors
---------------------------------------- */
.bg--blue {
  background: #002F87; }

.bg--lightblue {
  background: #EBEFF2; }

.bg--green {
  background: #B5D9B9; }

.bg--pink {
  background: #F9CDD0; }

.bg--white {
  background: #FFFFFF; }

.bg--lightgrey {
  background: #DEE3E7; }

.bg--grey {
  background: #899299; }

.bg--black {
  background: #181716; }

.bg--error {
  background: #F56565; }

/* ----------------------------------------
  Section
---------------------------------------- */
section {
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  display: block; }

.section + .section {
  margin-top: -5rem;
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 767px) {
    .section + .section {
      margin-top: -3rem; } }

.section--hide-overflow {
  overflow: hidden; }

.section__inner {
  padding: 2rem 2rem;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  display: block; }

.section__title {
  margin-bottom: 1em;
  font-family: "Nimbus", "Helvetica", sans-serif;
  font-weight: 600; }
  .section__title--large {
    font-size: 2.625em;
    -webkit-hyphens: auto;
    -moz-hyphens: auto;
    -ms-hyphens: auto;
    hyphens: auto;
    /* responsive */ }
    @media screen and (min-width: 0) and (max-width: 767px) {
      .section__title--large {
        font-size: 2.375em; } }
    @media screen and (min-width: 0) and (max-width: 639px) {
      .section__title--large {
        width: 100%;
        font-size: 2.125em;
        display: block; } }
    @media screen and (min-width: 0) and (max-width: 419px) {
      .section__title--large {
        font-size: 2em; } }
  .section__title--medium {
    font-size: 2em;
    /* responsive */ }
    @media screen and (min-width: 0) and (max-width: 639px) {
      .section__title--medium {
        width: 100%;
        font-size: 1.75em;
        display: block; } }
  .section__title--small {
    font-size: 1.625em;
    /* responsive */ }
    @media screen and (min-width: 0) and (max-width: 639px) {
      .section__title--small {
        width: 100%;
        font-size: 1.5em;
        display: block; } }
  .section__title--tiny {
    font-size: 1.25em;
    /* responsive */ }
    @media screen and (min-width: 0) and (max-width: 639px) {
      .section__title--tiny {
        width: 100%;
        font-size: 1.125em;
        display: block; } }

/* ----------------------------------------
  Selections
---------------------------------------- */
::selection {
  background: #002f87;
  color: #FFFFFF; }

/* ----------------------------------------
    Content Base
---------------------------------------- */
.content article {
  width: calc(58.33333% - 3.16667rem);
  float: left;
  margin-left: 2rem;
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 959px) {
    .content article {
      width: calc(100% - 4rem);
      float: left;
      margin-left: 2rem; } }

.content aside {
  width: calc(33.33333% - 2.66667rem);
  float: left;
  margin-left: 2rem;
  /* responsive */ }
  @media screen and (min-width: 1280px) {
    .content aside {
      margin-left: calc(8.33333% - 2.16667rem + 4rem); } }
  @media screen and (min-width: 0) and (max-width: 1279px) {
    .content aside {
      width: calc(41.66667% - 2.83333rem);
      float: left;
      margin-left: 2rem; } }
  @media screen and (min-width: 0) and (max-width: 959px) {
    .content aside {
      margin-top: 2rem;
      width: calc(100% - 4rem);
      float: left;
      margin-left: 2rem; } }

/* ----------------------------------------
    Content Core
---------------------------------------- */
.content {
  margin-left: -2rem;
  margin-right: -2rem;
  width: calc(100% + 4rem); }
  .content::after {
    clear: both;
    content: "";
    display: block; }
  @media screen and (min-width: 960px) {
    .content {
      display: flex; } }

/* ----------------------------------------
    Details Base
---------------------------------------- */
.details ul {
  margin: 0;
  padding: 0;
  list-style-type: none;
  font-size: 16px; }

.details li {
  padding-left: 1em;
  position: relative; }
  .details li:before {
    content: "\25CF";
    position: relative;
    display: "inline";
    margin: 0 1.25em;
    font-size: 0.75em;
    color: inherit;
    position: absolute;
    left: -1em; }

.details p {
  font-family: "Nimbus", "Helvetica", sans-serif;
  font-size: 1.1875em;
  font-weight: 300;
  line-height: 1.5rem;
  color: #002F87; }

.details__link {
  font-family: "Nimbus", "Helvetica", sans-serif;
  font-size: 1.1875em;
  font-weight: 300;
  line-height: 1.5rem;
  color: #002F87; }

/* ----------------------------------------
    Details
---------------------------------------- */
.details {
  border-radius: 3px;
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .details {
      margin-top: 5rem; } }
  @media screen and (min-width: 0) and (max-width: 559px) {
    .details {
      margin-top: 2rem; } }

/* ----------------------------------------
    Details Modifiers
---------------------------------------- */
.details--grey {
  background: #EBEFF2; }

.details--white {
  background: #FFFFFF;
  box-shadow: rgba(24, 23, 22, 0.1) 0 0.25rem 2.75rem 0; }

/* ----------------------------------------
    Details Box
---------------------------------------- */
.details__box {
  padding: 2rem 3rem 2rem 3rem;
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .details__box {
      padding: 1.35rem 2rem 1.35rem 2rem; } }
  @media screen and (min-width: 0) and (max-width: 559px) {
    .details__box {
      padding: 1.15rem 1.75rem 1.15rem 1.75rem; } }

/* ----------------------------------------
    Details Section
---------------------------------------- */
.details__section {
  margin: 1.25rem 0;
  padding-bottom: 1.25rem;
  border-bottom: 1px solid rgba(0, 47, 135, 0.4); }
  .details__section:last-of-type {
    padding-bottom: 0;
    border: 0; }

/* ----------------------------------------
    Details Section Extendable list
---------------------------------------- */
.details__section--extendable-list.use-extendable .details__title {
  margin-bottom: 0;
  cursor: pointer; }

.details__section--extendable-list.use-extendable .details__title-arrow {
  display: block;
  transform: scale(-1); }

.details__section--extendable-list.use-extendable .details__list {
  margin-top: 0.5em;
  margin-bottom: 0; }

.details__section--extendable-list.use-extendable.list-closed .details__list {
  display: none; }

.details__section--extendable-list.use-extendable.list-closed .details__title-arrow {
  transform: scale(1); }

/* ----------------------------------------
    Details Content
---------------------------------------- */
.details__title {
  margin-bottom: 0.5em;
  font-family: "Lubalin", "Helvetica", sans-serif;
  font-size: 1.125em;
  font-weight: 600;
  line-height: 1.5rem;
  color: #002F87; }

.details__title-icon svg {
  width: auto;
  height: 0.9em;
  margin-right: 0.5em;
  fill: currentColor; }

.details__title-arrow {
  display: none;
  float: right; }
  .details__title-arrow svg {
    fill: currentColor; }

.details__info, .details__file, .details__item {
  font-family: "Nimbus", "Helvetica", sans-serif;
  font-size: 1.1875em;
  font-weight: 300;
  line-height: 1.5rem;
  color: #002F87; }

/* ----------------------------------------
    Details Items
---------------------------------------- */
.details__file {
  padding-left: 1.75rem !important;
  /* state */ }
  .details__file:before {
    content: "";
    position: relative;
    display: "inline-block";
    content: '' !important;
    width: 1.25em;
    height: 1.25em;
    margin: 0.25em 1.25em 0 1em !important;
    background-image: url("./../images/download.svg");
    background-size: contain;
    background-position: center center;
    background-repeat: no-repeat; }
  .details__file:hover {
    text-decoration: underline; }

/* ----------------------------------------
    Details Button
---------------------------------------- */
.details__button {
  margin-bottom: 1.5rem; }
  @media screen and (min-width: 0) and (max-width: 959px) {
    .details__button {
      margin-top: 1rem; } }

.contact-details {
  margin-bottom: 1.5rem;
  border-radius: 3px;
  background-color: #F9CDD0; }
  .contact-details .details__box p {
    font-size: 19px;
    line-height: 1.2;
    margin: 18px 0px; }
  .contact-details .details__box .contact-details__members {
    display: flex;
    column-gap: 24px;
    margin-top: 1rem; }
    @media screen and (min-width: 0) and (max-width: 639px) {
      .contact-details .details__box .contact-details__members {
        flex-wrap: wrap;
        row-gap: 12px; } }
  .contact-details .details__box .contact-details__member {
    width: 100%;
    text-align: center; }
    @media screen and (min-width: 0) and (max-width: 639px) {
      .contact-details .details__box .contact-details__member {
        display: flex;
        column-gap: 20px;
        align-items: center; } }
    .contact-details .details__box .contact-details__member-image {
      position: relative;
      width: 88px;
      height: 76px;
      -webkit-clip-path: polygon(25% 0%, 75% 0%, 100% 50%, 75% 100%, 25% 100%, 0% 50%);
      clip-path: polygon(25% 0%, 75% 0%, 100% 50%, 75% 100%, 25% 100%, 0% 50%);
      margin: 0 auto;
      overflow: hidden; }
      .contact-details .details__box .contact-details__member-image.no-image {
        background-color: #002f87; }
      .contact-details .details__box .contact-details__member-image:hover img {
        transform: scale(1.05); }
      @media screen and (min-width: 0) and (max-width: 639px) {
        .contact-details .details__box .contact-details__member-image {
          display: flex;
          flex-shrink: 0; } }
      .contact-details .details__box .contact-details__member-image img {
        position: absolute;
        height: 100%;
        width: 100%;
        object-fit: cover;
        left: 0px;
        top: 0px;
        transition: all 0.2s ease;
        transform: scale(1); }
    .contact-details .details__box .contact-details__member span {
      font-weight: 600;
      margin-top: 0.5rem;
      font-family: "Lubalin", "Helvetica", sans-serif;
      display: block;
      font-size: 14px;
      line-height: 1.16; }
      @media screen and (min-width: 0) and (max-width: 639px) {
        .contact-details .details__box .contact-details__member span {
          width: 100%;
          text-align: left; } }
  .contact-details .details__box .contact-details__meta {
    display: flex;
    flex-direction: column;
    row-gap: 1rem;
    margin-top: 2rem; }
  .contact-details .details__box .contact-details__type {
    display: flex;
    column-gap: 0.75rem; }
    .contact-details .details__box .contact-details__type svg {
      display: flex;
      column-gap: 6px;
      flex-shrink: 0;
      width: 19px; }

/* ----------------------------------------
    Footer Base
---------------------------------------- */
footer {
  background: #002F87;
  font-family: "Nimbus", "Helvetica", sans-serif;
  color: #FFFFFF; }
  footer .fvcp-footer-logo {
    width: 180px; }

/* ----------------------------------------
    Footer Core
---------------------------------------- */
.footer__container {
  padding-top: 3.5rem;
  padding-bottom: 3.5rem; }

.footer ul {
  padding: 0;
  list-style-type: none; }

.footer a {
  text-decoration: none !important;
  position: relative;
  transition: padding 0.25s ease; }

.footer [href^='tel'],
.footer [href^='mailto'] {
  display: inline;
  float: none; }

/* ----------------------------------------
     Footer Columns
 ---------------------------------------- */
.footer__heading {
  margin-bottom: 1.5rem;
  margin-bottom: 1em;
  font-family: "Lubalin", "Helvetica", sans-serif;
  font-size: 1.25em;
  font-weight: 600; }

/* ----------------------------------------
    Footer
---------------------------------------- */
.footer__columns {
  width: 100%;
  display: flex;
  justify-content: space-between;
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 959px) {
    .footer__columns {
      display: block; } }

.footer__address, .footer__info {
  min-height: 15rem;
  border-right: 1px solid #4d6dab;
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 959px) {
    .footer__address, .footer__info {
      border-bottom: 1px solid #4d6dab;
      border-right: 0 solid transparent; } }

.footer__logo, .footer__address, .footer__info, .footer__social {
  font-family: "Nimbus", "Helvetica", sans-serif;
  font-size: 1.125em;
  line-height: 1.55em;
  flex-shrink: 1; }

.footer__item {
  position: relative;
  display: inline-block;
  float: left;
  clear: both;
  color: #FFFFFF;
  /* state */ }
  .footer__item:before {
    content: "";
    position: relative;
    display: inline-block;
    width: 0;
    height: 1px;
    background: #FFFFFF;
    position: absolute;
    left: 0;
    bottom: 0.1em;
    display: block;
    transition: width 0.5s ease; }
  .footer__item:hover:before {
    width: 100%;
    transition: width 0.35s cubic-bezier(0.165, 0.84, 0.44, 1); }

.footer__logo {
  flex-shrink: 1;
  /* responsive */ }
  .footer__logo a:before {
    display: none; }
  .footer__logo svg {
    max-width: 100%; }
  @media screen and (min-width: 0) and (max-width: 959px) {
    .footer__logo {
      display: none; } }

.footer__address {
  padding: 0 70px;
  white-space: nowrap;
  flex-basis: 370px;
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 1279px) {
    .footer__address {
      padding: 0 40px;
      flex-basis: 310px; } }

.footer__info {
  padding: 0 70px;
  flex-basis: 390px;
  /* responsive */ }
  .footer__info ul {
    margin-top: 0;
    -webkit-column-gap: 80px;
    column-gap: 80px;
    -webkit-column-count: 2;
    column-count: 2; }
  @media screen and (min-width: 0) and (max-width: 1279px) {
    .footer__info {
      padding: 0 40px;
      flex-basis: 250px; } }

.footer__social {
  padding-left: 70px;
  flex-basis: 260px;
  /* responsive */ }
  .footer__social ul {
    margin-top: 0; }
  @media screen and (min-width: 0) and (max-width: 1279px) {
    .footer__social {
      padding-left: 40px;
      flex-basis: 220px; } }

.footer__logo, .footer__address, .footer__info, .footer__social {
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 959px) {
    .footer__logo, .footer__address, .footer__info, .footer__social {
      width: 100%;
      padding: 33px 0;
      flex-basis: 0; } }

/* ----------------------------------------
    Footer Logo
---------------------------------------- */
.footer__logo {
  padding: 0;
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 959px) {
    .footer__logo {
      text-align: center; } }

/* ----------------------------------------
    Footer Search
---------------------------------------- */
.footer__search {
  margin-top: 1rem;
  padding: 0.5rem 1rem;
  font-weight: 300;
  position: relative;
  display: inline-block;
  float: left;
  clear: both; }

/* ----------------------------------------
    Footer Sub
---------------------------------------- */
.footer__copy, .footer__credits {
  width: auto;
  display: inline-block;
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 767px) {
    .footer__copy, .footer__credits {
      width: 100%;
      text-align: center;
      display: block; } }

.footer__copy {
  float: left; }

.footer__credits {
  float: right;
  /* svg */
  /* responsive */ }
  .footer__credits svg {
    width: auto;
    height: 1em;
    margin: -0.1em 0; }
    .footer__credits svg * {
      fill: #FFFFFF; }
  @media screen and (min-width: 0) and (max-width: 767px) {
    .footer__credits {
      margin-top: 1.5rem; }
      .footer__credits svg {
        margin: 0.75rem auto;
        display: block; } }

.footer__sub {
  width: 100%;
  margin: 0;
  padding-bottom: 1.5rem;
  display: block;
  overflow: auto;
  opacity: 0.3;
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .footer__sub {
      margin-top: 0; } }

.footer__vruchtvlees {
  line-height: 1.5rem;
  display: inline-block;
  transition: opacity 0.25s ease;
  /* state */
  /* responsive */ }
  .footer__vruchtvlees:before {
    content: '';
    width: 0;
    height: 0;
    display: none; }
  .footer__vruchtvlees:hover {
    text-decoration: none !important;
    opacity: 0.8; }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .footer__vruchtvlees {
      margin: 0.5rem auto;
      display: block; } }

.footer__minimal {
  background-color: #FFFFFF;
  color: #002F87; }
  .footer__minimal .footer__container {
    padding-top: 0px;
    padding-bottom: 0px; }
  .footer__minimal .footer__sub {
    color: #002F87;
    opacity: 1;
    padding-top: 32px; }
  .footer__minimal .footer__credits svg * {
    fill: #EBEFF2; }

/* ----------------------------------------
    Header Base
---------------------------------------- */
/* ----------------------------------------
    Header Core
---------------------------------------- */
.header {
  position: relative;
  overflow: hidden; }

/* ----------------------------------------
    Header Type
---------------------------------------- */
.header__article {
  margin: -10rem 0 -2rem;
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 767px) {
    .header__article {
      margin: -5rem auto -1.75rem auto; } }

.header__detail {
  margin: -3.5rem auto 0 auto; }

.header--side {
  margin: -6rem auto 0; }

@media screen and (min-width: 0) and (max-width: 1279px) {
  .header--default-side {
    margin: -6rem auto 0 !important; } }

@media screen and (min-width: 0) and (max-width: 419px) {
  .header--default-side {
    margin-top: -4rem !important; } }

.header__default {
  margin: -10rem auto -3.5rem auto;
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 767px) {
    .header__default {
      margin: -5rem auto -3.5rem auto;
      text-align: center; } }

.header__inline {
  margin-bottom: 3rem; }

.header__page {
  /* responsive */ }
  @media screen and (min-width: 640px) {
    .header__page {
      height: 40vh;
      min-height: 520px;
      max-height: 620px; } }

.header__selected {
  margin-top: -4rem; }

/* ----------------------------------------
    Header Content
---------------------------------------- */
.header__content {
  width: 100%;
  height: auto;
  padding: 4rem 0;
  display: block; }
  .header__content--center {
    text-align: center; }
  .header__content--detail {
    padding-bottom: 0; }
  .header__content--middle {
    width: 42.5%;
    padding: 0;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    /* responsive */ }
    @media screen and (min-width: 0) and (max-width: 639px) {
      .header__content--middle {
        width: 100%;
        padding: 2rem 0 0;
        position: relative;
        transform: translateY(0); } }
  .header__content--selected {
    padding-top: 1rem;
    padding-bottom: 0;
    /* responsive */ }
    @media screen and (min-width: 0) and (max-width: 639px) {
      .header__content--selected {
        padding-top: 3rem; } }

.header__date {
  margin-bottom: 0.25rem;
  font-size: 1.25em;
  font-weight: 300;
  display: block; }
  .header__date + .header__title {
    margin-top: 0; }

.header__meta {
  font-family: "Nimbus", "Helvetica", sans-serif;
  font-weight: 300;
  line-height: 1.5em;
  font-size: 1.0625em; }

.header__tag {
  font-size: 0.9375em; }

.header__text {
  font-family: "Lubalin", "Helvetica", sans-serif;
  font-size: 1.375em;
  font-weight: 300;
  line-height: 1.35em;
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .header__text {
      font-size: 1.1875em; } }
  .header__text--small {
    font-size: 1.25em;
    /* responsive */ }
    @media screen and (min-width: 0) and (max-width: 639px) {
      .header__text--small {
        font-size: 1.125em; } }
  .header__text--side {
    width: 60%;
    /* responsive */ }
    @media screen and (min-width: 0) and (max-width: 959px) {
      .header__text--side {
        width: 100%; } }

.header__sub-title {
  margin-bottom: 1.25rem; }

.header__title {
  margin: 1.5rem 0;
  font-family: "Lubalin", "Helvetica", sans-serif;
  font-weight: 600;
  line-height: 1.25em;
  /* responsive */ }
  .header__title--fixed {
    margin-top: 0; }
  .header__title--small {
    font-size: 2.5em; }
  @media screen and (min-width: 0) and (max-width: 767px) {
    .header__title {
      font-size: 2.625em; }
      .header__title--small {
        font-size: 2em; } }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .header__title {
      font-size: 2.25em; }
      .header__title--small {
        font-size: 1.75em; } }

/* ----------------------------------------
    Header Background
---------------------------------------- */
.header__background {
  width: calc(60% + 1px);
  height: 40vh;
  background-color: #B5D9B9;
  display: inline-block;
  overflow: hidden;
  vertical-align: top;
  /* responsive */ }
  @media screen and (min-width: 640px) {
    .header__background {
      max-width: 55%;
      min-height: 520px;
      max-height: 620px;
      position: absolute;
      top: 0;
      right: 0;
      -webkit-clip-path: polygon(100% 0%, 100% 100%, 0 100%, 148px 50%, 0 0);
      clip-path: polygon(100% 0%, 100% 100%, 0 100%, 148px 50%, 0 0); } }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .header__background {
      width: 100%;
      height: auto;
      position: relative; }
      .header__background img {
        position: relative;
        top: auto !important;
        left: auto !important;
        transform: translate(0, 0); } }

/* ----------------------------------------
    Header Image
---------------------------------------- */
.header__caption {
  width: 80%;
  margin: 1em auto;
  font-family: "Nimbus", "Helvetica", sans-serif;
  font-size: 0.9375em;
  font-weight: 500;
  font-style: normal;
  text-align: center;
  overflow: hidden;
  width: 100%;
  text-align: right;
  position: relative;
  z-index: 1; }

.header__figure {
  position: relative; }
  .header__figure--screen {
    position: relative; }
    .header__figure--screen:before {
      content: "";
      position: relative;
      display: inline-block;
      width: 100%;
      padding-top: 56.25%; }
    .header__figure--screen img {
      width: 100%;
      height: 100%;
      position: absolute;
      top: 0;
      bottom: 0;
      left: 0;
      right: 0; }
      @supports (object-fit: cover) {
        .header__figure--screen img {
          object-fit: cover; } }

.header__holder {
  height: 60vh;
  min-height: 420px;
  max-height: 580px;
  position: relative;
  display: block;
  overflow: hidden;
  /* responsive */ }
  .header__holder--small {
    min-height: 420px;
    max-height: 520px; }
  @media screen and (min-width: 0) and (max-width: 959px) {
    .header__holder {
      height: 45vh;
      min-height: 320px; } }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .header__holder {
      height: 35vh;
      min-height: 280px; } }

.header__image-caption {
  margin-right: 10px;
  color: #FFFFFF;
  position: absolute;
  bottom: 10px;
  right: 10px; }
  @media screen and (min-width: 640px) {
    .header__image-caption {
      max-width: 300px; } }
  @media screen and (min-width: 960px) {
    .header__image-caption {
      max-width: 400px; } }
  @media screen and (min-width: 1080px) {
    .header__image-caption {
      max-width: initial; } }

.header__thumb {
  width: 100%;
  height: auto;
  display: block;
  /* stylelint-enable */ }
  .header__thumb--back {
    /* stylelint-disable */ }
    .header__thumb--back > figure:before {
      content: "";
      position: relative;
      display: inline-block;
      width: 200vw;
      height: 100%;
      background: #FFFFFF;
      position: absolute;
      top: 50%;
      left: -75%;
      z-index: 0;
      display: block; }

/* ----------------------------------------
    Header Selected
---------------------------------------- */
.header__container {
  height: 100%; }

.header__grid {
  margin-left: -2rem;
  margin-right: -2rem;
  width: calc(100% + 4rem); }
  .header__grid::after {
    clear: both;
    content: "";
    display: block; }

.header__highlight {
  width: calc(62.5% - 3.25rem);
  float: left;
  margin-left: 2rem;
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 1079px) {
    .header__highlight {
      width: calc(66.66667% - 3.33333rem);
      float: left;
      margin-left: 2rem; } }
  @media screen and (min-width: 0) and (max-width: 959px) {
    .header__highlight {
      width: calc(100% - 4rem);
      float: left;
      margin-left: 2rem; } }

.header__side {
  width: calc(37.5% - 2.75rem);
  float: left;
  margin-left: 2rem;
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 1079px) {
    .header__side {
      width: calc(33.33333% - 2.66667rem);
      float: left;
      margin-left: 2rem; } }
  @media screen and (min-width: 0) and (max-width: 959px) {
    .header__side {
      width: calc(100% - 4rem);
      float: left;
      margin-left: 2rem;
      margin-top: 2rem; } }

/* ----------------------------------------
    Header Return
---------------------------------------- */
.header__return {
  padding-top: 4rem;
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 767px) {
    .header__return {
      padding-top: 2rem;
      text-align: center; } }
  .header__return--empty {
    padding-top: 10rem;
    /* responsive */ }
    @media screen and (min-width: 0) and (max-width: 767px) {
      .header__return--empty {
        padding-top: 2rem; } }
  .header__return--inline {
    margin: -2rem 0 2rem;
    padding-top: 0;
    /* responsive */ }
    @media screen and (min-width: 0) and (max-width: 767px) {
      .header__return--inline {
        margin: -2rem 0 2rem;
        padding-top: 0;
        text-align: left; } }

/* ----------------------------------------
    Menu Base
---------------------------------------- */
menu {
  width: auto;
  height: auto;
  margin: 0;
  padding: 0;
  display: block; }
  menu menuitem a {
    text-decoration: none; }
  menu ul {
    list-style-type: none; }
  menu li a {
    text-decoration: none; }

/* ----------------------------------------
    Main Menu
---------------------------------------- */
/* ----------------------------------------
    Sub Menu
---------------------------------------- */
/* ----------------------------------------
    Mobile nav
---------------------------------------- */
.mobile-nav {
  width: 100vw;
  height: 100vh;
  padding: 1.25rem 1.25rem 1.875rem;
  background: #002F87;
  text-align: center;
  color: #FFFFFF;
  position: fixed;
  left: 0;
  z-index: 11;
  display: none;
  flex-direction: column;
  align-items: center;
  justify-content: start;
  overflow: auto;
  /* responsive */ }
  .is-nav_open .mobile-nav {
    display: flex; }
  @media screen and (min-width: 0) and (max-width: 959px) {
    .mobile-nav {
      padding: 2rem 1.25rem 2rem; } }
  @media screen and (min-width: 960px) {
    .mobile-nav {
      padding: 2rem 1.25rem 2rem; } }

/* ----------------------------------------
    Mobile nav list
---------------------------------------- */
.mobile-nav__list {
  margin: auto;
  text-align: left;
  padding: 0;
  list-style: none; }

.mobile-nav__list__item + .mobile-nav__list__item {
  margin-top: 1.25rem;
  /* Responsive */ }
  @media screen and (min-width: 420px) and (max-width: 959px) and (orientation: landscape) {
    .mobile-nav__list__item + .mobile-nav__list__item {
      margin-top: 5px; } }

.mobile-nav__list__link {
  font-family: "Lubalin", "Helvetica", sans-serif;
  font-size: 2.5em;
  font-weight: 600;
  line-height: 1.05em;
  color: #FFFFFF;
  /* Responsive */ }
  @media screen and (min-width: 420px) and (max-width: 959px) and (orientation: landscape) {
    .mobile-nav__list__link {
      font-size: 1.875em; } }

/* ----------------------------------------
    Mobile nav text
---------------------------------------- */
.mobile-nav__button {
  margin-top: 1rem;
  padding-top: 0.4em;
  padding-bottom: 0.4em;
  border-width: 1px;
  border-radius: 0;
  font-family: "Lubalin", "Helvetica", sans-serif; }
  .mobile-nav__button:focus, .mobile-nav__button:hover {
    transform: none; }

/* ----------------------------------------
    Mobile nav text
---------------------------------------- */
.mobile-nav__text {
  font-family: "Lubalin", "Helvetica", sans-serif;
  font-size: 1em;
  font-weight: 300;
  line-height: 1.75em;
  margin-top: 1rem;
  margin-bottom: 6rem !important;
  /* Responsive */ }
  .mobile-nav__text [href^='tel']:before,
  .mobile-nav__text [href^='mailto']:before {
    display: none; }
  @media screen and (min-width: 420px) and (max-width: 959px) and (orientation: landscape) {
    .mobile-nav__text {
      position: absolute;
      bottom: 3%;
      right: 3%; } }

/* ----------------------------------------
    Mobile nav close button
---------------------------------------- */
.mobile-nav__close-button {
  width: 25px;
  height: 25px;
  position: absolute;
  top: 1.875rem;
  right: 1.875rem; }
  .mobile-nav__close-button:before, .mobile-nav__close-button:after {
    content: "";
    position: absolute;
    display: block;
    height: 3px;
    border-radius: 3px;
    background: #FFFFFF;
    top: 11px;
    left: 0;
    right: 0; }
  .mobile-nav__close-button:before {
    transform: rotate(-45deg); }
  .mobile-nav__close-button:after {
    transform: rotate(45deg); }

/* ----------------------------------------
    Mobile nav language
---------------------------------------- */
.mobile-nav__language {
  text-align: right;
  width: 100%;
  margin-bottom: 1rem; }

.mobile-nav__language__link {
  font-family: "Lubalin", "Helvetica", sans-serif;
  font-size: 1.875em;
  font-weight: 600;
  line-height: 1.05em;
  color: #FFFFFF;
  text-transform: uppercase;
  padding: 0 .5rem;
  /* Responsive */ }
  @media screen and (min-width: 420px) and (max-width: 959px) and (orientation: landscape) {
    .mobile-nav__language__link {
      font-size: 1.25em; } }
  .mobile-nav__language__link.is-inactive {
    color: #899299; }
  .mobile-nav__language__link:first-child {
    border-right: 1px solid #FFFFFF; }

/* ----------------------------------------
    Navigation Base
---------------------------------------- */
.nav__container {
  padding-top: 1.5rem;
  padding-bottom: 1.5rem;
  display: flex;
  align-items: center;
  justify-content: flex-end; }
  @media screen and (min-width: 1280px) {
    .nav__container {
      padding-top: 2rem;
      padding-bottom: 2rem; } }

/* ----------------------------------------
    Navigation Core
---------------------------------------- */
.nav {
  width: 100%;
  max-width: 1660px;
  background: #FFFFFF;
  font-family: "Lubalin", "Helvetica", sans-serif;
  position: sticky;
  top: 0;
  z-index: 10000000;
  overflow: visible;
  transition: margin 0.5s ease; }
  .nav:after {
    content: "";
    position: relative;
    display: inline-block;
    width: 100%;
    height: 5px;
    background: linear-gradient(to bottom, rgba(24, 23, 22, 0.08), transparent);
    display: block;
    position: absolute;
    bottom: -5px;
    left: 0;
    z-index: -1; }
  .nav.is-disabled {
    margin-top: -200px;
    transition: margin 0.75s ease; }
  .nav .is-hidden {
    display: none; }

/* ----------------------------------------
    Navigation Logo
---------------------------------------- */
.nav__logo {
  position: absolute;
  top: 0;
  left: 2rem;
  display: inline-block;
  transition: transform 0.4s;
  will-change: transform; }
  @media screen and (min-width: 1280px) {
    .nav__logo {
      left: 4rem; } }

.nav__logo-type {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 255px; }

/* ----------------------------------------
    Navigation Logo Animation
---------------------------------------- */
@media screen and (min-width: 960px) {
  .nav__logo.js-rotate {
    transform: translate(-27px, -58px) rotate(-30deg) scale(0.9); } }

@media screen and (min-width: 0) and (max-width: 1279px) {
  .nav__logo {
    transform: translate(-64px, -27px) scale(0.76); } }
  @media screen and (min-width: 0) and (max-width: 1279px) and (min-width: 960px) {
    .nav__logo.js-rotate {
      transform: translate(-64px, -69px) rotate(-30deg) scale(0.65); } }

@media screen and (min-width: 0) and (max-width: 959px) {
  .nav__logo {
    transform: translate(-64px, -71px) rotate(-30deg) scale(0.65); } }

/* ----------------------------------------
    Navigation Items
---------------------------------------- */
.nav__menu {
  width: calc(100% - 190px);
  margin: 0;
  margin-left: -1rem;
  margin-right: 20px;
  padding: 0;
  display: none;
  flex-wrap: wrap;
  justify-content: flex-end; }
  @media screen and (min-width: 960px) {
    .nav__menu {
      width: calc(100% - 270px); } }
  @media screen and (min-width: 1280px) {
    .nav__menu {
      display: flex; } }

.nav__item {
  margin-left: 1rem;
  padding: 0.5rem;
  white-space: nowrap;
  position: relative;
  display: inline-block;
  vertical-align: middle; }

.nav__button {
  border: 1px solid #002F87;
  transition: color 0.3s, background 0.3s, transform 0.2s ease; }
  .nav__button:focus, .nav__button:hover {
    border-color: #FFFFFF;
    background: #002F87;
    color: #FFFFFF; }

/* ----------------------------------------
    Navigation link
---------------------------------------- */
.nav__link {
  font-weight: 500;
  text-decoration: none;
  font-size: 1.125em;
  /* state */ }
  .nav__link:after {
    content: "";
    position: relative;
    display: inline-block;
    width: 100%;
    height: 2px;
    background: currentColor;
    position: absolute;
    bottom: -0.5em;
    left: 0;
    display: block;
    opacity: 0;
    transition: bottom 0.15s ease, opacity 0.1s ease; }
  .nav__link:focus:after, .nav__link:hover:after {
    bottom: 0;
    opacity: 1;
    transition: bottom 0.25s ease, opacity 0.2s ease; }

.nav__btn {
  font-size: 1.125em; }

/* ----------------------------------------
    Navigation language
---------------------------------------- */
.nav__language {
  font-size: 0.8em;
  text-transform: uppercase; }
  .nav__language .nav__link {
    position: relative; }
  .nav__language .is-inactive {
    color: #899299; }
  .nav__language a + a {
    margin-left: 0.5em; }
    .nav__language a + a:before {
      content: '';
      width: 1px;
      margin-right: 0.5em;
      background: #002F87;
      position: absolute;
      top: 0;
      bottom: 0;
      left: -0.5em;
      display: inline-block; }

/* ----------------------------------------
    Navigation toggle button
---------------------------------------- */
.nav__toggle-button {
  display: block;
  width: 35px;
  height: 20px;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  position: relative;
  transform: scaleY(1);
  outline: none;
  cursor: pointer;
  transition: transform 0.2s ease; }
  @media screen and (min-width: 1280px) {
    .nav__toggle-button {
      display: none; } }
  @media screen and (min-width: 960px) {
    .nav__toggle-button {
      margin-left: 70px; } }
  .nav__toggle-button:focus, .nav__toggle-button:hover {
    transform: scaleY(1.2); }
  .nav__toggle-button__line {
    height: 3px;
    border-radius: 3px;
    background: #002F87;
    position: absolute;
    left: 0;
    right: 0;
    display: inline-block;
    transition: transform 0.2s ease;
    will-change: transform, width; }
  .nav__toggle-button .nav__toggle-button__line:nth-child(1) {
    top: 0; }
  .nav__toggle-button .nav__toggle-button__line:nth-child(2) {
    top: 50%;
    transform: translateY(-50%); }
  .nav__toggle-button .nav__toggle-button__line:nth-child(3) {
    bottom: 0; }
  .is-nav_open .nav__toggle-button {
    transform: scaleY(1); }
    .is-nav_open .nav__toggle-button .nav__toggle-button__line {
      width: 80%; }
    .is-nav_open .nav__toggle-button .nav__toggle-button__line:nth-child(1) {
      top: 50%;
      transform: rotate(-45deg); }
    .is-nav_open .nav__toggle-button .nav__toggle-button__line:nth-child(2) {
      display: none; }
    .is-nav_open .nav__toggle-button .nav__toggle-button__line:nth-child(3) {
      top: 50%;
      transform: rotate(45deg); }

/* ----------------------------------------
    Navigation custom anchor point
---------------------------------------- */
.url-anchor {
  position: relative;
  top: -20vh; }

/* ----------------------------------------
    Content Base
---------------------------------------- */
.page .results {
  width: calc(54.16667% - 3.08333rem);
  float: left;
  margin-left: 2rem;
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 1279px) {
    .page .results {
      width: calc(50% - 3rem);
      float: left;
      margin-left: 2rem; } }
  @media screen and (min-width: 0) and (max-width: 959px) {
    .page .results {
      width: calc(100% - 4rem);
      float: left;
      margin-left: 2rem;
      margin-top: 3rem; } }

.page aside {
  width: calc(45.83333% - 2.91667rem);
  float: left;
  margin-left: 2rem;
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 1279px) {
    .page aside {
      width: calc(50% - 3rem);
      float: left;
      margin-left: 2rem; } }
  @media screen and (min-width: 0) and (max-width: 959px) {
    .page aside {
      width: calc(100% - 4rem);
      float: left;
      margin-left: 2rem; } }

/* ----------------------------------------
    Content Core
---------------------------------------- */
.page {
  margin-left: -2rem;
  margin-right: -2rem;
  width: calc(100% + 4rem); }
  .page::after {
    clear: both;
    content: "";
    display: block; }

/* ----------------------------------------
    Content
---------------------------------------- */
/* ----------------------------------------
    Sidebar Base
---------------------------------------- */
/* ----------------------------------------
    Sidebar Core
---------------------------------------- */
.side--left {
  float: left; }

.side-right {
  float: right; }

/* ----------------------------------------
    Sidebar Sticky
---------------------------------------- */
@media screen and (min-width: 960px) {
  .side--sticky {
    display: flex;
    align-items: flex-start; }
    .side--sticky .sticky {
      position: sticky; } }

@media screen and (min-width: 960px) {
  .side--sticky-top .sticky {
    top: 8rem; } }

@media screen and (min-width: 960px) {
  .side--sticky-bottom {
    align-items: flex-end; }
    .side--sticky-bottom .sticky {
      bottom: 1rem; } }

/* ----------------------------------------
    Elements
---------------------------------------- */
/* ----------------------------------------
    Card
---------------------------------------- */
/* ----------------------------------------
    Highlight Card
---------------------------------------- */
/* ----------------------------------------
    Highlight Card
---------------------------------------- */
.highlight-card--split:before {
  content: "";
  position: relative;
  display: inline-block;
  width: 200vw;
  height: 100%;
  background: #FFFFFF;
  position: absolute;
  top: -50%;
  left: -75%;
  z-index: 0;
  display: block; }

/* ----------------------------------------
    Highlight Card
---------------------------------------- */
.highlight-card {
  width: 100%;
  color: #FFFFFF;
  position: relative;
  display: block;
  /* state */ }
  .highlight-card:after {
    content: "";
    position: relative;
    display: inline-block;
    width: 100%;
    height: 100%;
    background: rgba(0, 47, 135, 0.6);
    position: absolute;
    top: 0;
    left: 0;
    z-index: 100;
    display: block;
    opacity: 0;
    transition: opacity 0.45s ease; }
  .highlight-card:hover:after {
    opacity: 1;
    transition: opacity 0.25s ease; }

/* ----------------------------------------
    Highlight Card Content
---------------------------------------- */
.highlight-card__content {
  width: calc(100% - 3rem);
  padding: 1.5rem;
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: 10000;
  display: block;
  /* responsive */ }
  .highlight-card__content--large {
    padding: 2.5rem;
    /* responsive */ }
    @media screen and (min-width: 0) and (max-width: 959px) {
      .highlight-card__content--large {
        padding: 1.5rem; } }
  @media screen and (min-width: 0) and (max-width: 767px) {
    .highlight-card__content {
      width: 100%; } }

.highlight-card__desc, .highlight-card__meta {
  font-family: "Nimbus", "Helvetica", sans-serif;
  font-size: 1.1875em;
  font-weight: 300;
  line-height: 1.5em; }

.highlight-card__title {
  width: 100%;
  max-width: 600px;
  margin: 0.1em 0;
  font-size: 2.625em;
  font-weight: 600;
  line-height: 1em;
  hyphens: auto;
  -ms-hyphens: auto;
  -moz-hyphens: auto;
  -webkit-hyphens: auto;
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 959px) {
    .highlight-card__title {
      font-size: 1.25em;
      margin-bottom: 20px; } }
  .highlight-card__title--large {
    /* responsive */ }
    @media screen and (min-width: 1080px) {
      .highlight-card__title--large {
        margin: 0.25em 0;
        font-size: 3em; } }
    @media screen and (min-width: 0) and (max-width: 959px) {
      .highlight-card__title--large {
        font-size: 2.375em; } }
    @media screen and (min-width: 0) and (max-width: 639px) {
      .highlight-card__title--large {
        font-size: 2.125em; } }
    @media screen and (min-width: 0) and (max-width: 559px) {
      .highlight-card__title--large {
        font-size: 1.875em; } }
    @media screen and (min-width: 0) and (max-width: 419px) {
      .highlight-card__title--large {
        font-size: 1.75em; } }

/* ----------------------------------------
    Highlight Card Image
---------------------------------------- */
.highlight-card__image {
  width: 105%; }

.highlight-card__overlay {
  width: 100%;
  height: 100%;
  background: radial-gradient(circle, rgba(24, 23, 22, 0) 0%, rgba(24, 23, 22, 0) 20%, #181716 100%);
  background-size: 125% 100%;
  background-position: bottom left;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 100;
  display: block; }

.highlight-card__thumb {
  position: relative;
  min-height: 400px;
  max-height: 500px;
  overflow: hidden; }
  .highlight-card__thumb:before {
    content: "";
    position: relative;
    display: inline-block;
    width: 100%;
    padding-top: 66.66667%; }
  .highlight-card__thumb img {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0; }
    @supports (object-fit: cover) {
      .highlight-card__thumb img {
        object-fit: cover; } }

/* ----------------------------------------
    Magazine Card
---------------------------------------- */
.magazine-card img {
  transition: transform 0.25s ease; }

/* ----------------------------------------
    Magazine Card
---------------------------------------- */
.magazine-card {
  position: relative;
  text-align: center;
  /* state */
  /* responsive */ }
  .magazine-card:before {
    content: "";
    position: relative;
    display: inline-block;
    width: 100%;
    padding-top: 150%; }
  .magazine-card img {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0; }
    @supports (object-fit: cover) {
      .magazine-card img {
        object-fit: cover; } }
  .grid .magazine-card {
    margin-top: 2rem; }
  .magazine-card--blue {
    background: #002F87;
    color: #FFFFFF;
    transition: background 0.25s ease;
    /* state */ }
    .magazine-card--blue:hover {
      background: #00266e; }
  .magazine-card--default {
    background: #F9CDD0;
    color: #FFFFFF;
    /* state */ }
    .magazine-card--default:after {
      content: "";
      position: relative;
      display: inline-block;
      width: 100%;
      height: 100%;
      background: rgba(0, 47, 135, 0.6);
      position: absolute;
      top: 0;
      left: 0;
      z-index: 10000;
      display: block;
      opacity: 0;
      transition: opacity 0.45s ease; }
    .magazine-card--default:hover:after {
      opacity: 1;
      transition: opacity 0.25s ease; }
    .magazine-card--default:hover [class*='__title'] {
      transform: translateY(1rem); }
  .magazine-card--white {
    background: #FFFFFF;
    color: #002F87;
    transition: transform 0.35s ease;
    /* state */ }
    .magazine-card--white:hover img {
      transform: scale(1.1) translate(-50%, -50%);
      transition: transform 0.25s ease; }
    .magazine-card--white:hover [class*='__title'] {
      transform: translateY(1rem); }
    .magazine-card--white .magazine-card__title {
      /* Responsive */ }
      @media screen and (min-width: 0) and (max-width: 639px) {
        .magazine-card--white .magazine-card__title {
          display: -webkit-box;
          overflow: hidden;
          text-overflow: ellipsis;
          -webkit-line-clamp: 4;
          line-clamp: 4;
          -webkit-box-orient: vertical;
          box-orient: vertical;
          margin-top: 0;
          margin-bottom: 0; } }
    .magazine-card--white .magazine-card__hex {
      margin: 5px auto 0 auto; }
  .magazine-card:hover [class*='__meta'] {
    padding-bottom: 0.5rem; }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .magazine-card {
      position: relative; }
      .magazine-card:before {
        content: "";
        position: relative;
        display: inline-block;
        width: 100%;
        padding-top: 100%; }
      .magazine-card img {
        width: 100%;
        height: 100%;
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0; }
        @supports (object-fit: cover) {
          .magazine-card img {
            object-fit: cover; } } }

/* ----------------------------------------
    Magazine Card Grid
---------------------------------------- */
.magazine-card__box {
  width: 100%;
  height: 100%;
  padding: 2rem;
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 1079px) {
    .magazine-card__box {
      padding: 1.5rem; } }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .magazine-card__box {
      padding: 1rem 0.75rem; } }

.magazine-card__content {
  width: 100%;
  height: 70%;
  text-align: center;
  position: relative;
  display: flex;
  flex-direction: column;
  align-self: center;
  justify-content: space-between; }

.magazine-card__info {
  width: 100%;
  height: 100%;
  position: relative;
  z-index: 100000;
  display: flex;
  flex-flow: column; }

/* ----------------------------------------
    Magazine Card Content
---------------------------------------- */
.magazine-card__tags {
  transition: padding 0.3s ease; }
  .magazine-card__tags > * {
    margin-bottom: 0.5em; }

.magazine-card__title {
  width: 100%;
  max-width: 85%;
  margin: 5rem auto 2rem;
  font-size: 1.625em;
  font-weight: 600;
  text-align: center;
  display: block;
  transition: transform 0.35s ease;
  /* responsive */ }
  .magazine-card__title--large {
    font-size: 2.5em;
    /* responsive */ }
    @media screen and (min-width: 0) and (max-width: 959px) {
      .magazine-card__title--large {
        font-size: 2em; } }
    @media screen and (min-width: 0) and (max-width: 639px) {
      .magazine-card__title--large {
        font-size: 1.625em; } }
  @media screen and (min-width: 0) and (max-width: 1279px) {
    .magazine-card__title {
      margin: 3rem auto 1rem; } }
  @media screen and (min-width: 0) and (max-width: 1079px) {
    .magazine-card__title {
      margin: 2rem auto 1rem; } }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .magazine-card__title {
      max-width: unset; } }
  @media screen and (min-width: 540px) and (max-width: 640px) {
    .magazine-card__title {
      display: -webkit-box;
      overflow: hidden;
      text-overflow: ellipsis;
      -webkit-line-clamp: 2;
      line-clamp: 2;
      -webkit-box-orient: vertical;
      box-orient: vertical; } }

/* ----------------------------------------
    Magazine Card Meta
---------------------------------------- */
.magazine-card__author, .magazine-card__date {
  font-family: "Nimbus", "Helvetica", sans-serif;
  font-size: 1.1875em;
  font-weight: 300;
  line-height: 1.5em;
  font-size: 0.9375em; }

.magazine-card__meta {
  width: 100%;
  transition: padding 0.35s ease; }

.magazine-card__person {
  width: 3.25rem;
  height: 3.25rem;
  margin: 1em auto;
  border-radius: 50%;
  position: relative;
  display: block;
  overflow: hidden; }
  .magazine-card__person img {
    min-height: 100%; }

/* ----------------------------------------
    Magazine Card Image
---------------------------------------- */
.magazine-card__hex {
  width: 70%;
  max-width: 190px;
  margin: 2rem auto;
  text-align: center;
  display: inline-block; }

.magazine-card__image {
  width: 105%; }

.magazine-card__overlay {
  width: 100%;
  height: 100%;
  background: radial-gradient(circle, rgba(24, 23, 22, 0) 0%, rgba(24, 23, 22, 0) 20%, #181716 100%);
  background-size: 125% 100%;
  background-position: bottom left;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 100;
  display: block; }

.magazine-card__thumb {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  overflow: hidden; }

/* ----------------------------------------
    News Card
---------------------------------------- */
/* ----------------------------------------
    News Card
---------------------------------------- */
.news-card {
  padding: 2rem 0;
  border-bottom: 1px solid #edf0f2;
  display: flex;
  align-items: center;
  /* responsive */
  /* state */ }
  .news-card:last-of-type {
    border-bottom: 0; }
  @media screen and (min-width: 0) and (max-width: 959px) {
    .news-card {
      padding: 1.5rem 0; } }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .news-card {
      padding: 1rem 0; } }
  @media screen and (min-width: 1080px) {
    .news-card:hover .news-card__content {
      padding-left: 0.5rem; }
    .news-card:hover .news-card__hex:after {
      opacity: 1;
      transition: opacity 0.25s ease; } }

/* ----------------------------------------
    News Card Content
---------------------------------------- */
.news-card__content {
  margin-left: 2rem;
  transition: padding 0.4s ease;
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 959px) {
    .news-card__content {
      margin-left: 1rem; } }

.news-card__date {
  font-size: 1.1875em;
  font-weight: 300;
  line-height: 1.5em; }

.news-card__title {
  font-size: 1.25em; }

/* ----------------------------------------
    News Card Image
---------------------------------------- */
.news-card__hex {
  width: 140px;
  text-align: center;
  display: inline-block;
  /* responsive */ }
  .news-card__hex:after {
    content: "";
    position: relative;
    display: inline-block;
    width: 100%;
    height: 100%;
    background: rgba(0, 47, 135, 0.6);
    position: absolute;
    top: 0;
    left: 0;
    z-index: 100;
    display: block;
    opacity: 0;
    transition: opacity 0.45s ease; }
  .news-card__hex--small {
    width: 120px;
    /* responsive */ }
    @media screen and (min-width: 0) and (max-width: 639px) {
      .news-card__hex--small {
        width: 100px; } }
  @media screen and (min-width: 0) and (max-width: 959px) {
    .news-card__hex {
      width: 100px; } }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .news-card__hex {
      width: 120px; } }

.news-card__image {
  width: 105%; }

.news-card__thumb {
  width: auto; }

/* ----------------------------------------
    Project Card
---------------------------------------- */
/* ----------------------------------------
    Project Card
---------------------------------------- */
.project-card {
  padding: 1rem 0;
  display: block;
  transition: padding 0.3s ease;
  /* responsive */
  /* state */ }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .project-card {
      overflow: auto; } }
  .project-card + .project-card {
    border-top: 1px solid #edf0f2; }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .project-card {
      font-size: 1.1em; } }
  @media screen and (min-width: 1080px) {
    .project-card:hover {
      padding: 1rem 0.5rem; } }

/* ----------------------------------------
    Project Card
---------------------------------------- */
.project-card__fund, .project-card__location {
  width: 75%;
  font-family: "Nimbus", "Helvetica", sans-serif;
  font-size: 1.0625em;
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .project-card__fund, .project-card__location {
      width: 100%;
      font-size: 1.125em; } }

.project-card__fund {
  max-width: 25%;
  text-overflow: ellipsis;
  white-space: nowrap;
  display: inline-block;
  overflow: hidden;
  text-align: right;
  float: right;
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .project-card__fund {
      max-width: none;
      text-overflow: unset;
      white-space: unset;
      overflow: auto;
      font-size: 0.9375em;
      text-align: left; } }

.project-card__location {
  max-width: 75%;
  text-overflow: ellipsis;
  white-space: nowrap;
  display: inline-block;
  overflow: hidden;
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .project-card__location {
      max-width: none;
      text-overflow: unset;
      white-space: unset;
      overflow: auto;
      margin-bottom: 0; } }

.project-card__meta {
  height: 1.25em;
  margin-top: 0.35em;
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .project-card__meta {
      height: auto;
      display: block; } }

.project-card__title {
  font-size: 1em;
  font-weight: 600;
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .project-card__title {
      font-size: 1.125em; } }

/* ----------------------------------------
    Contact
---------------------------------------- */
/* ----------------------------------------
    Contact Form
---------------------------------------- */
.contact__group {
  width: 100%;
  display: block; }

/* ----------------------------------------
   Fund Overview Card
---------------------------------------- */
.fund-slider .overview-card__image {
  position: relative; }
  .fund-slider .overview-card__image:before {
    content: "";
    position: relative;
    display: inline-block;
    width: 100%;
    padding-top: 62.5%; }
  .fund-slider .overview-card__image img {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0; }
    @supports (object-fit: cover) {
      .fund-slider .overview-card__image img {
        object-fit: cover; } }

.fund-slider .overview-card__tags, .fund-slider .overview-card__date, .fund-slider .overview-card__title, .fund-slider .overview-card__text {
  margin-top: 0.8rem; }

.fund-slider .overview-card__text p {
  font-size: 1.1875em;
  font-family: "Nimbus", "Helvetica", sans-serif; }

.fund-slider .overview-card__date p {
  font-size: 1.125em; }

/* ----------------------------------------
   Magazine Overview Card
---------------------------------------- */
.magazine-home-slider .magazine-card {
  /* responsive */
  margin-top: 0; }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .magazine-home-slider .magazine-card:before {
      padding-top: 140% !important; } }

.magazine-slider .card--default .card,
.magazine-slider .card--blue .card {
  display: flex;
  flex-direction: column; }

.magazine-slider .overview-card__card {
  height: 100%;
  position: relative; }
  .magazine-slider .overview-card__card:before {
    content: "";
    position: relative;
    display: inline-block;
    width: 100%;
    padding-top: 131.57895%; }
  .magazine-slider .overview-card__card img {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0; }
    @supports (object-fit: cover) {
      .magazine-slider .overview-card__card img {
        object-fit: cover; } }

.magazine-slider .overview-card__content {
  width: 100%;
  height: 100%;
  padding: 2rem 1.5rem 2rem 1.5rem;
  text-align: center;
  position: absolute;
  top: 0;
  z-index: 1; }

.card--white {
  background-color: #FFFFFF; }
  .card--white .hex-image {
    width: 176px;
    margin: auto; }
  .card--white .card {
    display: flex;
    flex-direction: column; }
    .card--white .card__title {
      margin-bottom: 1rem;
      color: #002F87 !important;
      font-size: 1.625em; }
    .card--white .card__tag {
      width: fit-content;
      margin: 0 auto;
      border-color: #002F87;
      color: #002F87; }

.card--blue {
  background-color: #002F87; }
  .card--blue .card__title {
    margin: auto;
    color: #FFFFFF !important;
    font-size: 2.5em; }
  .card--blue .card__person {
    width: 50px;
    margin: 0 auto;
    border: 3px solid transparent;
    border-radius: 100%;
    overflow: hidden;
    position: relative; }
    .card--blue .card__person:before {
      content: "";
      position: relative;
      display: inline-block;
      width: 100%;
      padding-top: 100%; }
    .card--blue .card__person img {
      width: 100%;
      height: 100%;
      position: absolute;
      top: 0;
      bottom: 0;
      left: 0;
      right: 0; }
      @supports (object-fit: cover) {
        .card--blue .card__person img {
          object-fit: cover; } }
  .card--blue .card__tag {
    width: fit-content;
    margin: 0 auto;
    border-color: #FFFFFF;
    color: #FFFFFF; }
  .card--blue .card__date {
    margin-top: 10px;
    color: #FFFFFF; }

.card--default .card img {
  z-index: -1; }

.card--default .card__title {
  margin: auto auto;
  color: #FFFFFF !important;
  font-size: 1.625em; }

.card--default .card__date {
  color: #FFFFFF; }

.card--default .card__tag {
  width: fit-content;
  margin: 0 auto;
  border-color: #FFFFFF;
  color: #FFFFFF; }

/* ----------------------------------------
    Related Core
---------------------------------------- */
/* ----------------------------------------
    Related Base
---------------------------------------- */
/* ----------------------------------------
    Related
---------------------------------------- */
.related__items {
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .related__items {
      margin-top: -2rem; } }

/* ----------------------------------------
    Related Content
---------------------------------------- */
.related__title {
  margin-bottom: 1.5rem;
  font-size: 2.5em;
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 767px) {
    .related__title {
      font-size: 2em; } }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .related__title {
      margin-bottom: 2.5rem;
      font-size: 1.75em; } }

/* ----------------------------------------
    Return
---------------------------------------- */
.return svg {
  display: inline-block; }

/* ----------------------------------------
    Return Icon
---------------------------------------- */
.return__holder {
  margin-left: 0.5em;
  font-size: 1.125em;
  font-weight: 300;
  position: relative;
  display: inline-block; }

.return__holder-limited {
  max-width: 150px;
  text-overflow: ellipsis;
  white-space: nowrap;
  display: inline-block;
  overflow: hidden;
  vertical-align: sub; }

.return__link {
  position: relative;
  z-index: 100;
  /* state */ }
  .return__link:before {
    content: "";
    position: relative;
    display: inline-block;
    width: 100%;
    height: 1px;
    background: currentColor;
    position: absolute;
    bottom: -0.05em;
    right: 0;
    display: block;
    transition: width 0.25s ease; }
  .return__link:hover:before {
    width: 0; }

/* ----------------------------------------
    Share
---------------------------------------- */
.share svg {
  width: auto;
  height: 1.5em;
  cursor: pointer;
  transition: transform 0.15s ease;
  /* state */ }
  .share svg:hover {
    transform: scale(1.1); }

/* ----------------------------------------
    Share Content
---------------------------------------- */
.share {
  position: relative; }
  .share__icon {
    padding: 0.5em;
    position: relative; }
    @media screen and (min-width: 0) and (max-width: 419px) {
      .share__icon {
        position: static; } }
    .share__icon.is-mobile {
      display: none; }
      body.is-mobile .share__icon.is-mobile {
        display: inline; }
  .share__url {
    position: absolute;
    right: 100vw; }
  .share__copied-alert {
    padding: 0.5em 1em;
    border-radius: 5px;
    background: #FFFFFF;
    font-size: 16px;
    white-space: nowrap;
    position: absolute;
    top: 2.5rem;
    left: 0;
    opacity: 0;
    transform: translateX(-50%);
    box-shadow: rgba(0, 0, 0, 0.2) 0 2px 10px;
    pointer-events: none;
    transition: all 0.4s ease; }
    @media screen and (min-width: 0) and (max-width: 419px) {
      .share__copied-alert {
        width: 100%;
        font-size: 15px;
        text-align: center;
        white-space: normal;
        transform: none; } }
    .share__copied-alert.is-visible {
      opacity: 1; }

/* ----------------------------------------
    Features
---------------------------------------- */
/* ----------------------------------------
  Social media actueel page
---------------------------------------- */
.actueel-social-media {
  padding: 4rem 0;
  background-color: #002F87;
  color: #FFFFFF; }
  .actueel-social-media .social-media-container {
    margin-top: 2rem;
    display: flex;
    align-content: stretch;
    justify-content: space-between;
    flex-direction: column;
    gap: 40px;
    color: #002F87; }
    @media screen and (min-width: 1280px) {
      .actueel-social-media .social-media-container {
        flex-direction: row; } }
    .actueel-social-media .social-media-container .social-media-item {
      background-color: white; }
      .actueel-social-media .social-media-container .social-media-item a {
        display: flex;
        align-items: center; }
        .actueel-social-media .social-media-container .social-media-item a h5 {
          margin-left: 1rem;
          padding-top: 0.25rem;
          font-weight: 300;
          line-height: 35px;
          text-align: center; }
      .actueel-social-media .social-media-container .social-media-item a:hover {
        text-decoration: underline; }
    .actueel-social-media .social-media-container .instagram-container {
      padding: 1rem;
      margin-top: 5px;
      flex-grow: 2; }
      .actueel-social-media .social-media-container .instagram-container .instagram-grid {
        display: grid;
        gap: 12px;
        grid-template-columns: repeat(1, minmax(0, 1fr)); }
        @media screen and (min-width: 1280px) {
          .actueel-social-media .social-media-container .instagram-container .instagram-grid {
            grid-template-columns: repeat(3, minmax(0, 1fr)); } }
        .actueel-social-media .social-media-container .instagram-container .instagram-grid button {
          margin: 0;
          padding: 0;
          border: 0;
          background: transparent; }
        .actueel-social-media .social-media-container .instagram-container .instagram-grid button:hover {
          cursor: pointer; }
        .actueel-social-media .social-media-container .instagram-container .instagram-grid img {
          width: 100%; }
    .actueel-social-media .social-media-container .facebook-container {
      padding: 1rem;
      margin-top: 5px;
      width: 100%; }
      @media screen and (min-width: 1280px) {
        .actueel-social-media .social-media-container .facebook-container {
          width: 480px; } }
  .actueel-social-media .social-icon-container {
    width: 35px;
    height: 35px;
    padding: 4px;
    border-radius: 9999px;
    background-color: #002F87;
    color: #FFFFFF; }

/* ----------------------------------------
    Author Core
---------------------------------------- */
.author__box {
  padding: 2.25rem 0;
  border-top: 1px solid #edf0f2;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between; }

/* ----------------------------------------
    Author Image
---------------------------------------- */
.author__thumb {
  width: 5rem;
  height: 5rem;
  border-radius: 50%;
  position: relative;
  display: block;
  overflow: hidden; }

/* ----------------------------------------
    Author Info
---------------------------------------- */
.author__info {
  width: calc(100% - 6.5rem - 200px);
  height: 5rem;
  margin-left: 1.5rem;
  display: flex;
  flex-direction: column;
  justify-content: center; }
  @media screen and (min-width: 0) and (max-width: 959px) {
    .author__info {
      width: calc(100% - 6.5rem); } }

.author__name, .author__role {
  width: 100%;
  display: block; }

.author__name {
  font-family: "Lubalin", "Helvetica", sans-serif;
  font-size: 1.375em;
  font-weight: 300;
  line-height: 1.35em;
  font-weight: 600; }

.author__role {
  font-family: "Nimbus", "Helvetica", sans-serif;
  font-size: 1.1875em;
  font-weight: 300;
  line-height: 1.5em; }

/* ----------------------------------------
    Author Social
---------------------------------------- */
.author__social {
  width: 200px;
  height: 5rem;
  /* responsive */ }
  @media screen and (min-width: 960px) {
    .author__social {
      text-align: right;
      display: flex;
      flex-direction: column;
      justify-content: center; } }
  @media screen and (min-width: 0) and (max-width: 959px) {
    .author__social {
      width: 100%;
      height: 0;
      margin-top: 1.5em;
      font-size: 1.25em;
      text-align: center;
      display: block; } }

/* ----------------------------------------
    Cookie Banner
---------------------------------------- */
.cc-window {
  padding: 1rem !important;
  z-index: 999999;
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 767px) {
    .cc-window {
      padding: 6% !important; } }

.cc-banner {
  width: 96% !important;
  max-width: calc($container-width - 6%) !important;
  margin: 0 !important;
  padding: 1em 2em !important;
  bottom: 3% !important;
  left: 50% !important;
  justify-content: space-between;
  transform: translateX(-50%) !important;
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 1079px) {
    .cc-banner {
      flex: none !important;
      flex-direction: column !important;
      align-items: inherit; } }

/* ----------------------------------------
    Cookie Message
---------------------------------------- */
.cc-message {
  max-width: 720px;
  -ms-flex: none !important;
  flex: none !important;
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 1079px) {
    .cc-message {
      width: 100%;
      max-width: 100%; } }

.cc-link {
  text-decoration: underline; }

/* ----------------------------------------
    Cookie Message
---------------------------------------- */
.cc-compliance {
  -ms-flex: none !important;
  flex: none !important; }

/* ----------------------------------------
    Cookie Button
---------------------------------------- */
.cc-highlight {
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 1079px) {
    .cc-highlight {
      width: 100%;
      margin-top: 1rem;
      display: block;
      float: left;
      clear: both;
      flex: none;
      overflow: auto; } }
  @media screen and (min-width: 0) and (max-width: 559px) {
    .cc-highlight {
      flex-direction: column; } }

.cc-btn {
  border-radius: 3px;
  font-weight: 400;
  outline: none;
  /* repsonsive */ }
  @media screen and (min-width: 0) and (max-width: 1079px) {
    .cc-btn {
      width: 50%;
      margin: 0 !important;
      display: block;
      float: left;
      flex: none !important;
      overflow: auto;
      box-sizing: border-box; } }
  @media screen and (min-width: 0) and (max-width: 419px) {
    .cc-btn {
      width: 100%; } }

/* ----------------------------------------
    Filter Base
---------------------------------------- */
.filter input[type='search'] {
  padding: 0.85rem 1.25rem 0.8rem 2.5rem;
  border: 0;
  border-bottom: 1px solid #002F87;
  border-radius: 0;
  font-size: 1.25em;
  line-height: 1em;
  position: relative;
  box-sizing: border-box; }
  .filter input[type='search']::placeholder {
    color: #002F87; }

.filter input[type='radio']:checked + label {
  background: #002F87;
  color: #FFFFFF; }

/* ----------------------------------------
    Filter Core
---------------------------------------- */
.filter {
  margin-top: 2rem; }
  .filter--close {
    margin-top: -2rem; }

/* ----------------------------------------
    Filter
---------------------------------------- */
.filter__label {
  padding: 0.25em;
  background: #FFFFFF;
  font-family: "Nimbus", "Helvetica", sans-serif;
  font-size: 0.75em;
  font-weight: 500;
  text-transform: uppercase;
  color: rgba(0, 47, 135, 0.75);
  position: absolute;
  top: -0.5em;
  left: 1.5em;
  z-index: 1000; }

.filter__reset {
  float: right; }

.filter__search + .filter__search, .filter__select + .filter__search, .filter__search + .filter__select, .filter__select + .filter__select {
  margin-bottom: 1.5rem; }

.filter__search {
  margin-bottom: 1.5rem;
  position: relative; }
  .filter__search label {
    width: 1em;
    height: 1em;
    position: absolute;
    top: 0.3em;
    left: 0.85em;
    z-index: 10;
    display: block; }
    .filter__search label svg {
      width: 100%;
      height: auto; }
      .filter__search label svg * {
        fill: #002F87; }

.filter__select {
  position: relative; }

.filter__pick {
  width: auto;
  margin: 0.25rem 0.5rem 0.25rem 0;
  border: 1px solid #002F87;
  font-family: "Nimbus", "Helvetica", sans-serif;
  font-weight: 300;
  text-transform: uppercase;
  display: inline-block; }
  .filter__pick button,
  .filter__pick label {
    margin: 0;
    padding: 0.45em 0.45em 0.25em;
    border: 0;
    background: transparent;
    font-family: inherit;
    font-weight: inherit;
    text-transform: inherit;
    color: inherit;
    cursor: pointer;
    transition: background 0.2s ease, color 0.2s ease; }
  .filter__pick--reset {
    border-color: #B5D9B9 !important;
    color: #B5D9B9; }

/* ----------------------------------------
    Fund Tool Base
---------------------------------------- */
.fund-tool input {
  outline: none; }

.fund-tool input[type='checkbox'],
.fund-tool input[type='radio'] {
  width: auto;
  display: none; }
  .fund-tool input[type='checkbox'] + span,
  .fund-tool input[type='radio'] + span {
    border-radius: 4px; }
  .fund-tool input[type='checkbox']:checked + label,
  .fund-tool input[type='radio']:checked + label {
    background: transparent !important;
    font-weight: 600;
    color: inherit !important; }

.fund-tool input[type='number'] {
  width: 100%;
  max-width: 420px;
  margin: 1rem 0;
  border: 0;
  border-bottom: 1px solid #002F87;
  font-size: 1.1875em;
  background: transparent;
  position: relative;
  display: block; }
  .fund-tool input[type='number']::-webkit-input-placeholder {
    color: rgba(0, 47, 135, 0.5); }
  .fund-tool input[type='number']:-moz-placeholder {
    color: rgba(0, 47, 135, 0.5); }
  .fund-tool input[type='number']::-moz-placeholder {
    color: rgba(0, 47, 135, 0.5); }
  .fund-tool input[type='number']:-ms-input-placeholder {
    color: rgba(0, 47, 135, 0.5); }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .fund-tool input[type='number'] {
      max-width: 270px; } }

.fund-tool label {
  width: 100%;
  height: auto;
  margin: 1.5rem 0 1.5rem;
  font-family: "Lubalin", "Helvetica", sans-serif;
  font-size: 1em;
  display: block;
  /* Responsive */ }
  @media screen and (min-width: 0) and (max-width: 419px) {
    .fund-tool label {
      padding-bottom: 1rem;
      display: table-cell;
      line-height: 1.5rem; } }

/* ----------------------------------------
    Fund Tool Base
---------------------------------------- */
.fund-tool {
  background: #B5D9B9;
  color: #002F87;
  display: none; }
  .fund-tool.is-active {
    display: block; }
  .fund-tool__step, .fund-tool__fund, .fund-tool__steps, .fund-tool__results, .fund-tool__no-results {
    display: none; }
    .fund-tool__step.is-active, .fund-tool__fund.is-active, .fund-tool__steps.is-active, .fund-tool__results.is-active, .fund-tool__no-results.is-active {
      display: block; }

/* ----------------------------------------
    Fund Tool Inputs
---------------------------------------- */
.fund-tool__agree {
  width: 100%;
  display: block; }

.fund-tool__select {
  width: auto;
  display: inline-block;
  float: left;
  clear: both; }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .fund-tool__select {
      float: unset; } }
  .fund-tool__select + .fund-tool__select {
    margin-top: 0.75rem; }

/* ----------------------------------------
    Fund Tool Steps
---------------------------------------- */
.fund-tool__steps {
  min-height: 460px;
  background: url("./../images/step-bg.svg");
  background-size: contain;
  background-position: 100%;
  background-repeat: no-repeat;
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 1079px) {
    .fund-tool__steps {
      min-height: 520px; } }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .fund-tool__steps {
      background: none; } }
  .fund-tool__steps p {
    font-size: inherit; }

.fund-tool__actions {
  position: absolute;
  top: 2rem;
  right: 4rem;
  display: flex;
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 1279px) {
    .fund-tool__actions {
      right: 2rem; } }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .fund-tool__actions {
      left: 50%;
      right: auto;
      transform: translateX(-50%); } }
  @media screen and (min-width: 0) and (max-width: 419px) {
    .fund-tool__actions {
      left: 45%;
      transform: translateX(-45%); } }

.fund-tool__action {
  height: 2.75rem;
  margin-left: 0.75rem;
  padding: 0.75rem 1rem;
  border-radius: 3px;
  background: #FFFFFF;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 0 5px rgba(24, 23, 22, 0.1);
  cursor: pointer; }
  .fund-tool__action:hover {
    background: #DEE3E7; }

/* ----------------------------------------
    Fund Tool Step
---------------------------------------- */
.fund-tool__step {
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 767px) {
    .fund-tool__step {
      padding-top: 2rem; } }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .fund-tool__step {
      padding-top: 3rem; } }

.fund-tool input::-webkit-outer-spin-button,
.fund-tool input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0; }

.fund-tool input[type='number'] {
  -moz-appearance: textfield; }

.fund-tool__step-description {
  margin-bottom: 1rem;
  font-family: "Nimbus", "Helvetica", sans-serif;
  font-size: 1.1875em;
  font-weight: 300;
  line-height: 1.5em;
  font-size: 1.0625em;
  /* responsive */ }
  @media screen and (min-width: 1080px) {
    .fund-tool__step-description {
      max-width: 70%; } }

.fund-tool__step-title {
  font-family: "Lubalin", "Helvetica", sans-serif;
  font-size: 1.375em;
  font-weight: 300;
  line-height: 1.35em;
  font-size: 1.625em;
  font-weight: 600;
  /* responsive */ }
  @media screen and (min-width: 1080px) {
    .fund-tool__step-title {
      max-width: 70%; } }
  @media screen and (min-width: 0) and (max-width: 1079px) {
    .fund-tool__step-title {
      margin-top: 2rem; } }

/* ----------------------------------------
    Fund Tool Results
---------------------------------------- */
.fund-tool__results {
  background: #EBEFF2; }

.fund-tool__results-top {
  padding: 3rem 0;
  background: #B5D9B9; }

.fund-tool__results-top-title {
  margin-bottom: 2rem; }

.fund-tool__results-title {
  margin: 3rem 0 2rem; }

.fund-tool__results-list {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch; }

.fund-tool__results-list-break {
  margin: 2rem 0; }

/* ----------------------------------------
    Fund Tool No Results
---------------------------------------- */
.fund-tool__no-results-title {
  margin-bottom: 1rem; }

.fund-tool__no-results-text {
  font-family: "Nimbus", "Helvetica", sans-serif; }

.fund-tool__no-results-button {
  margin-top: 2rem; }

/* ----------------------------------------
    Map Filter Base
---------------------------------------- */
.map-filter svg {
  width: 100%;
  height: 100%; }

.map-filter input[type='radio'] {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  display: none; }

/* ----------------------------------------
    Map Filter Base
---------------------------------------- */
.map-filter {
  max-width: 600px;
  padding: 2rem;
  background: #F9CDD0;
  position: relative;
  /* Responsive */ }
  .map-filter:before {
    content: "";
    position: relative;
    display: inline-block;
    width: 100%;
    padding-top: 100%; }
  .map-filter img {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0; }
    @supports (object-fit: cover) {
      .map-filter img {
        object-fit: cover; } }
  @media screen and (min-width: 420px) and (max-width: 959px) and (orientation: landscape) {
    .map-filter {
      max-width: 300px; } }

/* ----------------------------------------
    Map Filter
---------------------------------------- */
/* ----------------------------------------
    Map Land
---------------------------------------- */
.map-filter__land {
  width: 90%;
  height: 90%;
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 10;
  display: block;
  transform: translate(-50%, -50%); }

/* ----------------------------------------
    Map World
---------------------------------------- */
.map-filter__world {
  width: 17.5%;
  height: 17.5%;
  position: absolute;
  top: 6%;
  left: 6%;
  display: block; }

/* ----------------------------------------
    Map Placeholders
---------------------------------------- */
.map-filter__group {
  width: 9%;
  max-width: 50px;
  height: 9%;
  max-height: 50px;
  margin: 0;
  position: absolute;
  top: 0;
  left: 0;
  display: block; }

.map-filter__layer {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  display: block; }

/* ----------------------------------------
    Map Input
---------------------------------------- */
.map-filter__option {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  display: none;
  /* stylelint-disable */
  /* state */
  /* stylelint-enable */ }
  .map-filter__option + label {
    width: 100%;
    height: 100%;
    font-size: 1.25em;
    font-weight: 700;
    color: #002F87;
    text-align: center;
    position: relative;
    z-index: 100;
    display: block;
    transition: color 0.25s ease;
    /* responsive */ }
    @media screen and (min-width: 0) and (max-width: 419px) {
      .map-filter__option + label {
        font-size: 0.9375em; } }
    @media screen and (min-width: 420px) and (max-width: 959px) and (orientation: landscape) {
      .map-filter__option + label {
        font-size: 0.9375em; } }
    .map-filter__option + label:before {
      content: "";
      position: relative;
      display: inline-block;
      width: 50px;
      height: 50px;
      margin-bottom: -1.75em;
      border: 0;
      border-radius: 50%;
      background: #DEE3E7;
      position: relative;
      top: 0;
      left: 50%;
      z-index: -1;
      display: block;
      transform: translateX(-50%);
      transition: background 0.25s ease;
      /* responsive */ }
      @media screen and (min-width: 0) and (max-width: 419px) {
        .map-filter__option + label:before {
          width: 40px;
          height: 40px;
          margin-bottom: -1.95em; } }
      @media screen and (min-width: 420px) and (max-width: 959px) and (orientation: landscape) {
        .map-filter__option + label:before {
          width: 40px;
          height: 40px; } }
    .map-filter__option + label:after {
      content: "";
      position: relative;
      display: inline-block;
      width: calc(50px + 8px);
      height: calc(50px + 8px);
      margin-top: -2.3em;
      border: solid 4px #002F87;
      border-radius: 50%;
      background: #FFFFFF;
      position: relative;
      top: 0;
      left: 50%;
      z-index: -100;
      display: block;
      transform: translateX(-50%) scale(0.5);
      transition: transform 0.5s cubic-bezier(0.77, 0, 0.175, 1);
      /* responsive */ }
      @media screen and (min-width: 0) and (max-width: 419px) {
        .map-filter__option + label:after {
          width: calc(38px + 4px);
          height: calc(38px + 4px);
          margin-top: -2.4em; } }
      @media screen and (min-width: 420px) and (max-width: 959px) and (orientation: landscape) {
        .map-filter__option + label:after {
          width: 40px;
          height: 40px; } }
  .map-filter__option:hover + label:before {
    background: #B5D9B9; }
  .map-filter__option:checked + label {
    color: #FFFFFF; }
    .map-filter__option:checked + label:before {
      background: #002F87; }
    .map-filter__option:checked + label:after {
      transform: translateX(-50%) scale(1); }

/* ----------------------------------------
    Map Selected
---------------------------------------- */
.map-filter__selected {
  width: auto;
  height: auto;
  padding: 0.5em 0.75em;
  border-radius: 1em;
  background: #002F87;
  color: #FFFFFF;
  position: absolute;
  left: 50%;
  bottom: 5%;
  z-index: 100;
  display: block;
  transform: translateX(-50%); }
  @media screen and (min-width: 0) and (max-width: 419px) {
    .map-filter__selected {
      bottom: 2%; } }
  @media screen and (min-width: 420px) and (max-width: 959px) and (orientation: landscape) {
    .map-filter__selected {
      width: fit-content;
      padding: 0.3em 0.5em;
      bottom: 2%;
      font-size: 0.9375em; } }

/* ----------------------------------------
  Newsletter list
---------------------------------------- */
.newsletter-list {
  margin-top: 4.125rem;
  background: #FFFFFF;
  box-shadow: rgba(24, 23, 22, 0.1) 0 0.25rem 2.75rem 0; }
  .newsletter-list__heading {
    background-color: #002F87;
    color: #FFFFFF; }
    .newsletter-list__heading h3 {
      padding: 1rem 2.5rem 1rem 2.5rem;
      font-size: 1.25rem;
      font-weight: 300;
      line-height: 1.875rem; }
  .newsletter-list .display_archive {
    padding: 0 1.125rem; }
    .newsletter-list .display_archive .campaign {
      padding-top: 0.875rem;
      padding-bottom: 0.875rem;
      border-bottom: 1px solid #DEE3E7;
      color: #002F87;
      display: flex;
      align-items: center; }
      .newsletter-list .display_archive .campaign a {
        width: 280px;
        padding-left: 0.25rem;
        font-size: 1rem;
        font-weight: 700;
        line-height: 1.875rem;
        white-space: nowrap;
        color: #002F87;
        display: inline-block;
        text-overflow: ellipsis;
        overflow: hidden; }
    .newsletter-list .display_archive .campaign:last-child {
      border: 0; }

/* ----------------------------------------
    More Info Base
---------------------------------------- */
.more-info > * + .more-info > * {
  margin-left: 1rem; }

/* ----------------------------------------
    More Info Core
---------------------------------------- */
.more-info {
  margin-top: 2rem; }

/* ----------------------------------------
    More Info
---------------------------------------- */
@media screen and (min-width: 0) and (max-width: 639px) {
  .more-info__button {
    width: 100%;
    margin-bottom: 1rem; } }

/* ----------------------------------------
    Related Core
---------------------------------------- */
.related-page {
  margin-top: 2.5rem; }

/* ----------------------------------------
    Related Page
---------------------------------------- */
.related-page__items {
  display: flex;
  flex-wrap: wrap;
  margin-left: -2rem;
  margin-right: -2rem;
  width: calc(100% + 4rem); }
  .related-page__items::after {
    clear: both;
    content: "";
    display: block; }
  .related-page__items:after {
    content: '';
    display: table;
    clear: both; }
  .related-page__items > * {
    display: inline-block;
    float: none;
    vertical-align: top; }

.related-page__item {
  width: calc(33.33333% - 2.66667rem);
  float: left;
  margin-left: 2rem;
  margin-top: 1.5rem;
  padding: 2rem 0;
  background: #FFFFFF;
  font-size: 1.25em;
  font-family: "Lubalin", "Helvetica", sans-serif;
  font-weight: 600;
  text-transform: lowercase;
  text-align: center;
  color: #002F87;
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.05);
  transition: box-shadow 0.4s ease;
  /* state */
  /* state */ }
  .related-page__item:first-letter {
    text-transform: uppercase; }
  .related-page__item:hover {
    box-shadow: 0 5px 8px 0 rgba(0, 0, 0, 0.15); }
  @media screen and (min-width: 0) and (max-width: 1079px) {
    .related-page__item {
      width: calc(50% - 3rem);
      float: left;
      margin-left: 2rem;
      padding: 1.75rem 0; } }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .related-page__item {
      width: calc(100% - 4rem);
      float: left;
      margin-left: 2rem;
      padding: 1.25rem 0; } }

/* ----------------------------------------
    Service Base
---------------------------------------- */
.service a {
  text-decoration: underline; }
  .service a:hover {
    text-decoration: none; }

.service [class*='__right-bg'] {
  z-index: 1; }

.service [class*='__left-bg'] {
  display: none; }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .service [class*='__left-bg'] {
      display: block; } }

/* ----------------------------------------
    Service Core
---------------------------------------- */
.service {
  width: 100%;
  margin-bottom: -6rem;
  padding: 5.5rem 0 5.5rem 3.5rem;
  background: #002F87;
  color: #FFFFFF;
  position: relative;
  z-index: 10000;
  display: inline-flex;
  justify-content: space-between;
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .service {
      padding: 3rem 0 2rem; } }

/* ----------------------------------------
    Service Grid
---------------------------------------- */
.service__grid {
  margin-left: -2rem;
  margin-right: -2rem;
  width: calc(100% + 4rem); }
  .service__grid::after {
    clear: both;
    content: "";
    display: block; }

.service__persons {
  width: calc(33.33333% - 2.66667rem);
  float: left;
  margin-left: 2rem;
  position: relative;
  z-index: 1000;
  /* responsive */ }
  @media screen and (min-width: 1080px) {
    .service__persons {
      margin-left: calc(4.16667% - 20.83333px + 40px); } }
  @media screen and (min-width: 0) and (max-width: 959px) {
    .service__persons {
      width: calc(100% - 4rem);
      float: left;
      margin-left: 2rem;
      margin-bottom: 1.5rem;
      font-size: 0.7rem; } }

.service__content {
  width: calc(50% - 3rem);
  float: left;
  margin-left: 2rem;
  /* responsive */ }
  @media screen and (min-width: 1080px) {
    .service__content {
      margin-left: calc(8.33333% - 21.66667px + 40px); } }
  @media screen and (min-width: 0) and (max-width: 959px) {
    .service__content {
      width: calc(100% - 4rem);
      float: left;
      margin-left: 2rem; } }

/* ----------------------------------------
    Service
---------------------------------------- */
.service__content {
  position: relative;
  z-index: 1000; }

.service__names {
  font-size: inherit;
  display: inline-flex;
  flex-wrap: wrap; }
  .service__names a {
    text-decoration: none; }

.service__text {
  margin-top: 0.75rem;
  font-family: "Nimbus", "Helvetica", sans-serif;
  font-size: 1.1875em;
  font-weight: 300;
  line-height: 1.5em; }

/* ----------------------------------------
    Service Meta
---------------------------------------- */
.service__meta {
  width: 40%; }

.service__type {
  width: 1em;
  height: 1em;
  margin: 0.5em 0;
  text-align: right;
  float: left;
  clear: left;
  /* svg */ }
  .service__type svg {
    width: 1em;
    height: 1em;
    display: block; }
    .service__type svg * {
      fill: #FFFFFF; }

.service__contact {
  width: calc(100% - 2em);
  margin: 0.5em 0 0.5em 1em;
  font-weight: 300;
  float: left; }

/* ----------------------------------------
    Service Person
---------------------------------------- */
.service__person {
  position: relative;
  width: 100%;
  max-width: 160px;
  border-radius: 50%;
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  overflow: hidden;
  /* repsonsive */ }
  .service__person:before {
    content: "";
    position: relative;
    display: inline-block;
    width: 100%;
    padding-top: 100%; }
  .service__person img {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0; }
    @supports (object-fit: cover) {
      .service__person img {
        object-fit: cover; } }
  .service__person:nth-of-type(1) {
    position: relative; }
  .service__person:nth-of-type(n+4) {
    display: none; }
  .service__person:hover .service__person-image {
    transform: scale(1.1); }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .service__person {
      max-width: 130px; } }

.service__person-image {
  transition: transform 0.2s ease; }

/* ----------------------------------------
    Slick
---------------------------------------- */
.slick-disabled:not(.slider__arrows--left) {
  /* svg */ }
  .slick-disabled:not(.slider__arrows--left) > {
    pointer-events: none !important;
    cursor: not-allowed; }
  .slick-disabled:not(.slider__arrows--left) svg {
    opacity: 0.25;
    transition: opacity 0.25s ease; }

/* ----------------------------------------
    Slick Slide
---------------------------------------- */
.slick-slide {
  outline: none !important; }

[data-js-draggable] {
  cursor: grab; }

.tracks__navigation {
  font-family: "Lubalin", "Helvetica", sans-serif;
  overflow: hidden;
  font-size: 1.125em; }
  .tracks__navigation__container--large {
    padding-top: 0 !important;
    padding-bottom: 0 !important; }
  .tracks__navigation__overflow {
    white-space: nowrap; }
  .tracks__navigation a {
    padding: 1.7em;
    color: #FFFFFF;
    position: relative;
    display: inline-block;
    opacity: 0.55;
    transition: all 0.2s ease; }
    .tracks__navigation a.is-active, .tracks__navigation a:hover, .tracks__navigation a:focus {
      color: #FFFFFF;
      opacity: 1; }

.tracks .active-indicator {
  position: absolute;
  transition: transform 0.5s ease; }
  .tracks .active-indicator:after {
    content: '';
    width: 0;
    border: 1em solid transparent;
    border-bottom-color: #F9CDD0;
    position: absolute;
    bottom: 0;
    transform: translateX(-100%); }

.tracks .slider {
  width: 100%;
  overflow: hidden; }

.tracks__info {
  display: flex;
  flex-wrap: wrap;
  box-sizing: border-box; }

.tracks__description {
  margin-top: 2rem;
  display: flex;
  flex-direction: column;
  justify-content: space-between; }
  @media screen and (min-width: 768px) {
    .tracks__description {
      width: calc(50% - 1rem);
      margin-top: 0; } }
  .tracks__description p,
  .tracks__description ul {
    font-family: "Nimbus", "Helvetica", sans-serif;
    font-size: 1.1875em;
    font-weight: 300;
    line-height: 1.5em; }

.tracks__redirect {
  margin-top: 1.5rem; }

.tracks__media {
  width: 100%; }
  @media screen and (min-width: 768px) {
    .tracks__media {
      width: calc(50% - 1rem);
      margin-right: 2rem; } }
  .tracks__media img {
    width: 100%;
    object-fit: cover; }
    @media screen and (min-width: 768px) {
      .tracks__media img {
        min-height: 500px; } }
  .tracks__media .btn-solid--blue {
    margin-top: 1rem;
    display: block; }

/* ----------------------------------------
    Steps Base
---------------------------------------- */
.steps p {
  font-family: "Nimbus", "Helvetica", sans-serif;
  font-size: 1.1875em;
  font-weight: 300;
  line-height: 1.5em; }

.steps ol,
.steps ul {
  margin: 0; }
  .steps ol li,
  .steps ul li {
    padding: 0.5rem 0 0.5rem 1rem;
    font-family: "Lubalin", "Helvetica", sans-serif; }

.steps ul {
  padding: 0;
  position: relative;
  list-style-type: none; }
  .steps ul li:before {
    content: "\25CF";
    position: relative;
    display: inline;
    font-size: 0.75em;
    color: inherit;
    top: -0.1em;
    left: -15px; }

.steps ol {
  padding-left: 1.5rem; }
  .steps ol li {
    padding: 0.5rem 0; }

.steps a {
  text-decoration: underline; }

/* ----------------------------------------
    Steps Core
---------------------------------------- */
.steps {
  margin-top: -3rem;
  padding-top: 6rem;
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .steps {
      margin-top: 0;
      padding-top: 0; } }

/* ----------------------------------------
    Steps
---------------------------------------- */
.steps__grid {
  margin-left: -2rem;
  margin-right: -2rem;
  width: calc(100% + 4rem); }
  .steps__grid::after {
    clear: both;
    content: "";
    display: block; }

.steps__info {
  width: calc(100% - 4rem);
  float: left;
  margin-left: 2rem;
  padding: 3rem 6rem;
  background: #FFFFFF;
  display: block;
  /* responsive */ }
  @media screen and (min-width: 1080px) {
    .steps__info {
      width: calc(83.33333% - 3.66667rem);
      float: left;
      margin-left: 2rem;
      margin-left: calc(8.33333% - 2.16667rem + 4rem); } }
  @media screen and (min-width: 0) and (max-width: 959px) {
    .steps__info {
      width: calc(100% - 4rem);
      float: left;
      margin-left: 2rem;
      padding: 3rem; } }
  @media screen and (min-width: 0) and (max-width: 559px) {
    .steps__info {
      padding: 1.5rem; } }

.steps__title {
  margin-bottom: 3rem;
  text-align: center;
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 959px) {
    .steps__title {
      margin-bottom: 0;
      font-size: 2em; } }

/* ----------------------------------------
    Step
---------------------------------------- */
.step {
  width: 100%;
  padding-left: 6rem;
  position: relative;
  /* responsive */
  /* responsive */ }
  .step:before {
    content: "";
    position: relative;
    display: inline-block;
    width: 2px;
    height: 100%;
    background: #002F87;
    position: absolute;
    top: 3rem;
    left: 0;
    /* responsive */ }
    @media screen and (min-width: 0) and (max-width: 639px) {
      .step:before {
        display: none; } }
  .step:last-of-type:before {
    display: none; }
  .step:last-of-type [class*='__info'] {
    padding-bottom: 0;
    border-bottom: 0; }
  @media screen and (min-width: 0) and (max-width: 959px) {
    .step {
      padding-left: 3rem; } }
  @media screen and (min-width: 0) and (max-width: 559px) {
    .step {
      padding-left: 0; } }
  .step.js-active [class*='step__hidden'] {
    height: auto; }
  .step.js-active [class*='step__title']:before {
    transform: scale(1.1) rotate(90deg); }

/* ----------------------------------------
    Step Content
---------------------------------------- */
.step__button {
  margin-top: 1rem; }

.step__hidden {
  width: 100%;
  height: 0;
  position: relative;
  display: block;
  overflow: hidden; }

.step__info {
  padding: 2rem 0;
  border-bottom: 1px solid #edf0f2; }
  @media screen and (min-width: 0) and (max-width: 559px) {
    .step__info {
      padding: 1rem 0; } }

.step__text {
  margin: 1em 0; }

.step__title {
  font-family: "Lubalin", "Helvetica", sans-serif;
  font-size: 1.375em;
  font-weight: 300;
  line-height: 1.35em;
  font-weight: 600;
  cursor: pointer; }
  .step__title:before {
    content: "";
    position: relative;
    display: inline-block;
    width: 1.3em;
    height: 1.3em;
    background-image: url("./../images/hex.svg");
    background-size: contain;
    background-repeat: no-repeat;
    position: absolute;
    left: calc(-0.65rem - 3px);
    transform-origin: 50% 45%;
    transition: transform 0.25s ease;
    /* responsive */ }
    @media screen and (min-width: 0) and (max-width: 559px) {
      .step__title:before {
        display: none; } }

.step__downloads {
  display: flex;
  flex-direction: column; }

.step__download {
  padding-left: 1.75rem;
  text-decoration: none;
  /* state */ }
  .step__download:before {
    content: "";
    position: relative;
    display: inline-block;
    width: 1.25em;
    height: 1.25em;
    margin: 0.25em 1.25em 0 1em !important;
    background-image: url("./../images/download.svg");
    background-size: contain;
    background-position: center center;
    background-repeat: no-repeat;
    font-size: 0.75em;
    color: inherit;
    position: absolute;
    left: -1em; }
  .step__download:hover {
    text-decoration: underline; }

/* ----------------------------------------
    Content Blocks
---------------------------------------- */
/* ----------------------------------------
    Block Modifiers
---------------------------------------- */
.blocks--contained > [class*='block'] > [class*='container'] {
  padding: 0; }

.blocks--contained > [class*='button-block'] + [class*='button-block'] {
  padding: 1rem 0; }

.blocks--wide > [class*='block'] {
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  display: block;
  max-width: calc(1140px + 8rem); }
  .blocks--wide > [class*='block'] > [class*='container'] {
    width: 100%;
    margin: 0;
    padding-top: 0;
    padding-bottom: 0; }
  .blocks--wide > [class*='block'][class$='--tiny'] {
    margin: 1rem auto; }
  .blocks--wide > [class*='block'][class$='--small'] {
    width: calc(100% - 10rem);
    margin: 4rem auto;
    /* responsive */ }
    @media screen and (min-width: 0) and (max-width: 1079px) {
      .blocks--wide > [class*='block'][class$='--small'] {
        width: calc(100% - 18rem); } }
    @media screen and (min-width: 0) and (max-width: 767px) {
      .blocks--wide > [class*='block'][class$='--small'] {
        width: calc(100% - 4rem);
        margin: 2rem auto; } }
    @media screen and (min-width: 0) and (max-width: 639px) {
      .blocks--wide > [class*='block'][class$='--small'] {
        width: 100%; } }
  .blocks--wide > [class*='block'][class$='--medium'] {
    margin: 4rem auto;
    /* responsive */ }
    @media screen and (min-width: 1280px) {
      .blocks--wide > [class*='block'][class$='--medium'] {
        width: calc(100% - 10rem); } }
    @media screen and (min-width: 0) and (max-width: 767px) {
      .blocks--wide > [class*='block'][class$='--medium'] {
        margin: 2rem auto; } }
  .blocks--wide > [class*='block'][class$='--large'] {
    width: 100%; }

/* ----------------------------------------
    Block Spacing
---------------------------------------- */
.blocks .block {
  margin-bottom: 2.5rem;
  display: block;
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 767px) {
    .blocks .block {
      margin-bottom: 1.75rem; } }
  .blocks .block:last-child.media-inline {
    margin-bottom: 0 !important; }

.audio-block__title {
  margin-bottom: 1.5rem; }

.audio-block audio {
  width: 100%; }

/* ----------------------------------------
    Button Base
---------------------------------------- */
.blocks [class*='button-block'] + [class*='button-block'] {
  margin-top: 0; }

.blocks [class*='popup-block'] {
  margin-bottom: 2.5rem; }

/* ----------------------------------------
    Download Base
---------------------------------------- */
.blocks > [class*='download-block'] img {
  max-width: 100%;
  height: auto; }

/* ----------------------------------------
    Download Block
---------------------------------------- */
/* ----------------------------------------
    Heading block Base
---------------------------------------- */
.intro {
  width: 100%;
  padding: 3rem 0 3rem 3.5rem;
  background: #B5D9B9;
  position: relative;
  display: inline-flex;
  justify-content: space-between;
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 1079px) {
    .intro {
      padding-left: 0; } }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .intro {
      padding: 1.5rem 0;
      display: block; } }
  .intro__container {
    margin-top: -5%;
    z-index: 10;
    /* responsive */
    /* responsive */ }
    @media screen and (min-width: 0) and (max-width: 1079px) {
      .intro__container {
        margin-top: 0;
        padding-top: 0; } }
    @media screen and (min-width: 0) and (max-width: 639px) {
      .intro__container {
        margin-top: 0; } }
  .intro__content {
    max-width: 480px; }
    .intro__content h1 {
      font-size: 2.5rem;
      line-height: 1.1em; }
    .intro__content p {
      font-size: 1.125rem;
      font-weight: 300;
      line-height: 1.5em; }
  .intro [class*='intro__left-bg'] {
    display: none;
    /* responsive */ }
    @media screen and (min-width: 0) and (max-width: 1079px) {
      .intro [class*='intro__left-bg'] {
        display: block; } }
  .intro__video, .intro__image {
    width: 50%;
    max-width: 584px;
    max-height: 329px;
    z-index: 0; }
    @media screen and (min-width: 0) and (max-width: 639px) {
      .intro__video, .intro__image {
        width: 100%;
        margin-top: 1rem; } }
  .intro__button {
    margin-top: 40px; }
  .intro__video iframe {
    width: 100%; }

/* ----------------------------------------
    Image Base
---------------------------------------- */
.blocks > [class*='image-block'] img {
  width: 102%;
  max-width: 102%;
  height: auto; }

.blocks > [class*='image-block'] figcaption {
  position: relative;
  overflow: hidden; }

/* ----------------------------------------
    Image Block
---------------------------------------- */
/* ----------------------------------------
    Image Inline Block
---------------------------------------- */
/* ----------------------------------------
    Image Inline Block
---------------------------------------- */
.double-image-block__grid {
  margin-left: -2rem;
  margin-right: -2rem;
  width: calc(100% + 4rem); }
  .double-image-block__grid::after {
    clear: both;
    content: "";
    display: block; }

.double-image-block__figure {
  width: calc(50% - 3rem);
  float: left;
  margin-left: 2rem;
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 767px) {
    .double-image-block__figure {
      width: 100%;
      margin: 0; } }

/* ----------------------------------------
    Media Base
---------------------------------------- */
/* ----------------------------------------
    Media Block
---------------------------------------- */
/* ----------------------------------------
    Player
---------------------------------------- */
/* ----------------------------------------
    Quote=
---------------------------------------- */
.quote-block {
  text-align: center; }
  .quote-block__author {
    font-family: "Nimbus", "Helvetica", sans-serif;
    font-size: 1.3125em;
    font-style: normal;
    text-align: center; }
    .quote-block__author:before {
      content: "\2014";
      position: relative;
      display: inline-block;
      margin-right: 0.5em; }
  .quote-block__text {
    margin-bottom: 2rem;
    font-family: "Lubalin", "Helvetica", sans-serif; }

/* ----------------------------------------
    Call to Action Base
---------------------------------------- */
/* ----------------------------------------
    Call to Action Core
---------------------------------------- */
.cta-block__holder {
  padding: 3rem;
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 767px) {
    .cta-block__holder {
      padding: 2.5rem 2rem; } }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .cta-block__holder {
      padding: 2rem 1.5rem; } }
  @media screen and (min-width: 0) and (max-width: 559px) {
    .cta-block__holder {
      padding: 1rem; } }

/* ----------------------------------------
    Call to Action
---------------------------------------- */
.cta-block {
  text-align: center; }

/* ----------------------------------------
    Call to Action Content
---------------------------------------- */
.cta-block__button {
  margin-top: 2rem; }

.cta-block__text {
  width: 70%;
  max-width: 90%;
  margin: 1.5rem auto;
  display: block;
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 767px) {
    .cta-block__text {
      width: 100%; } }

.cta-block__title {
  margin: 0 auto 1.5rem auto;
  font-family: "Lubalin", "Helvetica", sans-serif;
  font-weight: 600;
  font-size: 1.375em; }

/* ----------------------------------------
    Text Base
---------------------------------------- */
.blocks {
  /* stylelint-disable */
  /* stylelint-enable */ }
  .blocks > [class*='text-block']:first-of-type:not(.text-block--no-intro) p:first-of-type {
    margin-bottom: 2rem;
    font-family: "Lubalin", "Helvetica", sans-serif;
    font-size: 1.375em;
    font-weight: 300;
    line-height: 1.35em;
    /* responsive */ }
    @media screen and (min-width: 0) and (max-width: 639px) {
      .blocks > [class*='text-block']:first-of-type:not(.text-block--no-intro) p:first-of-type {
        font-size: 1.25em; } }
  .blocks p:empty {
    display: none; }

.text-block h1, .text-block .h1, .text-block h2, .text-block .h2, .text-block h3, .text-block .h3, .text-block h4, .text-block .h4, .text-block h5, .text-block .h5, .text-block h6, .text-block .h6 {
  margin-bottom: 1.5rem;
  font-size: 1.375em;
  font-weight: 400; }

.text-block b,
.text-block strong {
  font-size: 1em;
  color: inherit; }

.text-block p {
  font-family: "Nimbus", "Helvetica", sans-serif;
  font-size: 1.1875em;
  font-weight: 300;
  line-height: 1.5em; }

/* ----------------------------------------
    Gallery Base
---------------------------------------- */
/* ----------------------------------------
    Gallery Core
---------------------------------------- */
.gallery-block > [class*='__container--large'] {
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 767px) {
    .gallery-block > [class*='__container--large'] {
      padding-left: 0;
      padding-right: 0; } }

/* ----------------------------------------
    Gallery Block
---------------------------------------- */
.gallery-block__slider {
  position: relative; }

.gallery-block__slides {
  margin: 0 -1rem;
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 1079px) {
    .gallery-block__slides {
      margin: 0 -0.5rem; } }

.gallery-block__item {
  width: 100%;
  padding: 0 1rem;
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 1079px) {
    .gallery-block__item {
      padding: 0 0.5rem; } }

.gallery-block__caption {
  margin-top: 1em;
  width: 80%;
  margin: 1em auto;
  font-family: "Nimbus", "Helvetica", sans-serif;
  font-size: 0.9375em;
  font-weight: 500;
  font-style: normal;
  text-align: center;
  overflow: hidden;
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 767px) {
    .gallery-block__caption {
      width: 100%; } }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .gallery-block__caption {
      width: 90%; } }

/* ----------------------------------------
    Gallery Block Arrows
---------------------------------------- */
.gallery-block__arrows {
  right: 0; }
  @media screen and (min-width: 0) and (max-width: 767px) {
    .gallery-block__arrows {
      display: none; } }

/* ----------------------------------------
    Related Base
---------------------------------------- */
.blocks.blocks--wide > [class*='related-block'] {
  border-top: 0; }

/* ----------------------------------------
    Related Block Core
---------------------------------------- */
.related-block {
  width: 100%;
  min-height: 8rem;
  border-top: 1px solid #edf0f2; }
  @media screen and (min-width: 640px) {
    .related-block {
      margin: 1.5rem 0 3rem; } }
  .related-block__head {
    margin: 2.5rem 0 1.25rem;
    font-size: 1.375em;
    font-weight: 400;
    display: block; }

/* ----------------------------------------
    Related Block Item
---------------------------------------- */
.related-block__item {
  min-height: 110px;
  background-color: #EBEFF2;
  position: relative;
  display: flex;
  align-items: center;
  /* responsive */
  /* stylelint-disable */
  /* stylelint-enable */ }
  .related-block__item + .related-block__item {
    margin: 1.25rem 0; }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .related-block__item {
      display: block; } }
  .related-block__item:hover > .related-block__image img {
    opacity: 0.4; }

.related-block__content {
  padding: 0 1.5rem;
  /* responsive */ }
  @media screen and (min-width: 640px) {
    .related-block__content {
      width: calc(100% - 12rem); } }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .related-block__content {
      padding: 1rem 1.5rem; } }

/* ----------------------------------------
    Related Block Content
---------------------------------------- */
.related-block__title, .related-block__desc {
  margin: 0;
  line-height: 1em; }

.related-block__title {
  font-family: "Lubalin", "Helvetica", sans-serif;
  font-size: 1.25em;
  font-weight: 600;
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 559px) {
    .related-block__title {
      font-size: 1.125em; } }

.related-block__desc {
  margin-top: 0.5em;
  font-family: "Nimbus", "Helvetica", sans-serif;
  font-size: 1.1875em;
  max-width: 100%;
  text-overflow: ellipsis;
  white-space: nowrap;
  display: inline-block;
  overflow: hidden;
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 559px) {
    .related-block__desc {
      font-size: 1.125em; } }

/* ----------------------------------------
    Related Block Image
---------------------------------------- */
.related-block__image {
  width: 100%;
  position: relative;
  background: #002F87;
  overflow: hidden;
  /* responsive */ }
  .related-block__image:before {
    content: "";
    position: relative;
    display: inline-block;
    width: 100%;
    padding-top: 56.25%; }
  .related-block__image img {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0; }
    @supports (object-fit: cover) {
      .related-block__image img {
        object-fit: cover; } }
  @media screen and (min-width: 640px) {
    .related-block__image {
      width: 12rem; } }
  .related-block__image img {
    transition: opacity 0.25s ease; }

/* ----------------------------------------
    Related Block Core
---------------------------------------- */
.related-block .full-width {
  width: 100%; }

/* ----------------------------------------
    Accordion Base
---------------------------------------- */
.js-accordion {
  margin-bottom: 1.5rem;
  font-family: "Nimbus", "Helvetica", sans-serif; }

/* ----------------------------------------
    Accordion Question
---------------------------------------- */
.js-accordion__question {
  width: 100%;
  margin-top: 1.3rem;
  padding-bottom: 1rem;
  border-bottom: #002F87 solid 1px;
  position: relative;
  display: inline-flex;
  justify-content: space-between;
  cursor: pointer;
  /* active animation */ }
  .js-accordion__question:before {
    content: "";
    position: relative;
    display: inline-block;
    width: 0;
    height: 1px;
    background: #EBEFF2;
    position: absolute;
    bottom: -2px;
    left: 0;
    right: 0;
    transition: width 1s ease; }
  .js-accordion__question svg {
    padding-right: 5px;
    transition: transform 0.6s 0.2s ease; }
  .js-accordion__question.is-active:before {
    width: 100%; }
  .js-accordion__question.is-active svg {
    transform: rotate(-180deg); }

.js-accordion__icon {
  align-self: center; }
  .js-accordion__icon svg {
    height: auto;
    margin: 0;
    transition: transform 0.1s; }

.js-accordion__question-inner {
  width: 90%;
  font-size: 1.1875em; }

/* ----------------------------------------
    Accordion Answer
---------------------------------------- */
.js-accordion__answer {
  padding-top: 21px;
  display: none; }
  .js-accordion__answer > p {
    margin: 0 !important;
    font-family: "Nimbus", "Helvetica", sans-serif;
    font-size: 1.1875em;
    font-weight: 300;
    line-height: 1.5em; }

/* ----------------------------------------
    Slider / Slider items
---------------------------------------- */
.slider-item {
  width: 360px;
  height: 450px;
  position: relative;
  display: block;
  /* Fund specific styling */ }
  @media screen and (min-width: 0) and (max-width: 559px) {
    .slider-item {
      width: 240px;
      height: 300px; } }
  .slider-item__fund {
    background-color: #EBEFF2; }
    .slider-item__fund-image-container {
      position: relative; }
    .slider-item__fund-diamond-container {
      width: 100%;
      position: absolute;
      top: 24px;
      display: flex;
      justify-content: center; }
    .slider-item__fund .slider-item-content__fund:before {
      content: '';
      width: 0;
      height: 0;
      border-top: 70px solid transparent;
      border-left: 180px solid #EBEFF2;
      border-right: 180px solid #EBEFF2;
      position: relative;
      top: -16px;
      left: -16px; }
      @media screen and (min-width: 0) and (max-width: 559px) {
        .slider-item__fund .slider-item-content__fund:before {
          border-top: 35px solid transparent;
          border-left: 120px solid #EBEFF2;
          border-right: 120px solid #EBEFF2;
          top: -30px;
          left: -16px; } }
  .slider-item__magazine {
    color: #FFFFFF; }
    .slider-item__magazine-content {
      position: absolute;
      top: 0;
      bottom: 0;
      left: 0;
      right: 0;
      display: flex;
      flex-direction: column;
      justify-content: space-between; }
  .slider-item__news {
    background-color: #002F87; }
    .slider-item__news-diamond-container {
      margin-top: 0.5rem;
      position: relative;
      display: inline-block; }
  .slider-item__page {
    background-color: #FFFFFF;
    display: flex;
    flex-direction: column;
    justify-content: space-between; }
    .slider-item__page-diamond-aligner {
      margin-top: 1.25rem;
      display: flex;
      justify-content: center; }
  .slider-item .slider-item-content {
    width: 100%;
    padding: 1rem;
    text-align: center;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0; }
    .slider-item .slider-item-content .slider-title {
      margin-bottom: 1.5rem;
      font-size: 26px;
      line-height: 110%; }
      @media screen and (min-width: 0) and (max-width: 559px) {
        .slider-item .slider-item-content .slider-title {
          font-size: 20px;
          line-height: 100%; } }
      .slider-item .slider-item-content .slider-title__fund {
        color: #002F87; }
      .slider-item .slider-item-content .slider-title__news {
        font-size: 40px;
        line-height: 42px; }
        @media screen and (min-width: 0) and (max-width: 559px) {
          .slider-item .slider-item-content .slider-title__news {
            font-size: 28px;
            line-height: 28px; } }
    .slider-item .slider-item-content__magazine {
      color: #FFFFFF; }
    .slider-item .slider-item-content__news {
      height: 100%;
      color: #FFFFFF;
      display: flex;
      flex-direction: column;
      justify-content: space-between; }
    .slider-item .slider-item-content .slider-item-text {
      height: 100%;
      display: flex;
      flex-direction: column;
      justify-content: space-between; }
      .slider-item .slider-item-content .slider-item-text__page {
        color: #002F87; }
    .slider-item .slider-item-content .slider-text {
      margin-bottom: 1.5rem;
      font-size: 16px;
      font-weight: 400;
      line-height: 130%; }
      @media screen and (min-width: 0) and (max-width: 559px) {
        .slider-item .slider-item-content .slider-text__mobile-hidden {
          display: none; } }
    .slider-item .slider-item-content .slider-meta {
      font-size: 15px;
      font-weight: 500;
      line-height: 19px; }
  .slider-item .diamond {
    padding: 8px;
    background: #DEE3E7;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    line-height: 13px;
    text-transform: uppercase;
    color: #002F87;
    position: relative; }
  .slider-item .diamond:before {
    content: '';
    width: 0;
    height: 0;
    border-top: 15px solid transparent;
    border-bottom: 15px solid transparent;
    border-right: 10px solid #DEE3E7;
    position: absolute;
    top: 0;
    left: -10px; }
  .slider-item .diamond:after {
    content: '';
    width: 0;
    height: 0;
    border-top: 15px solid transparent;
    border-bottom: 15px solid transparent;
    border-left: 10px solid #DEE3E7;
    position: absolute;
    top: 0;
    right: -10px; }

/* ----------------------------------------
    Media Inline Core
---------------------------------------- */
.blocks > [class*='media-inline-block'] figure {
  margin: 0; }

.blocks > [class*='media-inline-block'] p {
  font-family: "Nimbus", "Helvetica", sans-serif;
  font-size: 1.1875em;
  font-weight: 300;
  line-height: 1.5em; }

/* ----------------------------------------
    Media Inline Fund
---------------------------------------- */
.media-inline-block--fund {
  padding: 0 !important; }
  .media-inline-block--fund [class*='__container'] {
    padding: 2rem !important; }
    .media-inline-block--fund [class*='__container'][class$='--spaceless'] {
      padding: 0 !important; }

/* ----------------------------------------
    Media Inline Base
---------------------------------------- */
.media-inline-block.bg--lightblue {
  padding-top: 4rem;
  padding-bottom: 4rem;
  /* Responsive */ }
  @media screen and (min-width: 0) and (max-width: 959px) {
    .media-inline-block.bg--lightblue {
      padding-top: 6%;
      padding-bottom: 6%; } }

.media-inline-block [class*='media-inline__container']:after {
  content: '';
  display: table;
  clear: both; }

/* ----------------------------------------
    Media Inline Content
---------------------------------------- */
.media-inline-block__image {
  width: 100%; }

.media-inline-block__figure--left {
  /* responsive */ }
  @media screen and (min-width: 640px) {
    .media-inline-block__figure--left {
      margin: 0 2rem 1rem 0 !important;
      float: left; } }

.media-inline-block__figure--right {
  /* responsive */ }
  @media screen and (min-width: 640px) {
    .media-inline-block__figure--right {
      margin: 0 0 1rem 2rem !important;
      float: right; } }

@media screen and (min-width: 960px) and (max-width: 1279px) {
  .media-inline-block__figure--default, .media-inline-block__figure--small {
    width: 40%; } }

@media screen and (min-width: 640px) and (max-width: 959px) {
  .media-inline-block__figure--default, .media-inline-block__figure--small {
    width: calc(50% - 1rem); } }

@media screen and (min-width: 0) and (max-width: 639px) {
  .media-inline-block__figure--default, .media-inline-block__figure--small {
    width: 100%; } }

@media screen and (min-width: 1280px) {
  .media-inline-block__figure--default {
    width: calc(50% + 6rem); } }

@media screen and (min-width: 1280px) {
  .media-inline-block__figure--small {
    width: calc(30% + 6rem); } }

.media-inline-block__figure--full {
  width: 100%; }

.media-inline-block__title {
  margin-bottom: 1rem; }

.media-inline-block__text {
  width: 100%; }

.media-inline-block__clear {
  clear: both; }

/* ----------------------------------------
    Form Blocks
---------------------------------------- */
/* ----------------------------------------
    Form Block Base
---------------------------------------- */
.form-block button {
  width: auto;
  border: 0;
  display: inline-block; }
  @media screen and (min-width: 0) and (max-width: 419px) {
    .form-block button {
      margin-top: 1.5rem; } }

.form-block input {
  padding: 0.85rem 1rem;
  border-radius: 0;
  font-family: "Nimbus", "Helvetica", sans-serif;
  font-size: 1.125em; }

.form-block textarea {
  font-family: "Nimbus", "Helvetica", sans-serif;
  font-size: 1.125em; }

/* ----------------------------------------
    Form Block Core
---------------------------------------- */
.form-block {
  display: block;
  overflow: auto; }

/* ----------------------------------------
    Form Block buttons
---------------------------------------- */
.form-block__buttons {
  margin-top: 2.5rem;
  display: flex;
  align-items: center;
  justify-content: space-between; }
  @media screen and (min-width: 0) and (max-width: 419px) {
    .form-block__buttons {
      margin-top: 1.5rem;
      flex-direction: column;
      align-items: flex-start;
      justify-content: flex-start; } }

/* ----------------------------------------
    Form Block Base
---------------------------------------- */
.submit-btn {
  width: 100%; }

.form__title {
  margin: 1rem 0; }

/* ----------------------------------------
    Radio / checkbox section Base
---------------------------------------- */
.radio-block,
.checkbox-block {
  font-size: 1.0625em;
  margin: 1rem 1.5rem 0.5rem 0;
  padding-left: 35px;
  font-weight: 300;
  letter-spacing: unset;
  position: relative;
  display: inline-block;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  cursor: pointer; }
  @media screen and (min-width: 0) and (max-width: 419px) {
    .radio-block,
    .checkbox-block {
      margin-top: 1rem;
      display: block; } }
  .radio-block input,
  .checkbox-block input {
    position: absolute;
    opacity: 0;
    cursor: pointer; }

/* ----------------------------------------
    Radio / checkbox section Checkmark
---------------------------------------- */
.radio-block .checkmark,
.checkbox-block .checkmark {
  width: 24px;
  height: 24px;
  margin-top: -2px;
  border: 1px solid #002F87;
  background-color: #FFFFFF;
  position: absolute;
  top: -2px;
  left: 0;
  transition: background 0.25s ease; }
  .radio-block .checkmark:after,
  .checkbox-block .checkmark:after {
    content: "";
    position: relative;
    display: inline-block;
    width: 0.75rem;
    height: 0.75rem;
    background-image: url("./../images/check.svg");
    background-size: contain;
    background-position: center center;
    background-repeat: no-repeat;
    position: absolute;
    top: 50%;
    left: 50%;
    display: none;
    transform: translate(-50%, -50%);
    transition: background 0.25s ease; }

.radio-block input:checked ~ .checkmark,
.checkbox-block input:checked ~ .checkmark {
  background-color: #002F87; }

.radio-block input:checked ~ .checkmark:after,
.checkbox-block input:checked ~ .checkmark:after {
  display: block; }

.radio-block:hover input ~ .checkmark,
.checkbox-block:hover input ~ .checkmark {
  background-color: #002F87; }

.radio-block .checkmark {
  border-radius: 50%; }

.checkbox-block .checkmark {
  border-radius: 3px; }

/* ----------------------------------------
    Credentials section Base
---------------------------------------- */
.credentials-block {
  margin: 1rem 0 0.5rem 0; }

/* ----------------------------------------
    Credentials section Core
---------------------------------------- */
.credentials-block__info {
  width: 100%;
  display: inline-flex;
  justify-content: space-between;
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 419px) {
    .credentials-block__info {
      display: block; } }

.credentials-block__letter {
  width: 30%;
  padding-right: 1rem;
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 419px) {
    .credentials-block__letter {
      width: unset;
      padding: unset; } }

.credentials-block__mid-name {
  width: 30%;
  padding-right: 1rem;
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 419px) {
    .credentials-block__mid-name {
      width: unset;
      padding: unset; } }

.credentials-block__last-name {
  width: 40%;
  flex-grow: 1;
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 419px) {
    .credentials-block__last-name {
      width: unset; } }

/* ----------------------------------------
    Success section Core
---------------------------------------- */
.success-block {
  padding: 1rem;
  border: 2px solid;
  text-align: center; }
  .success-block__text {
    /* responsive */ }
    .success-block__text ul,
    .success-block__text ol {
      text-align: left; }
    .success-block__text ul li {
      padding-left: .8em; }
    .success-block__text a {
      text-decoration: underline; }
      .success-block__text a:after, .success-block__text a:before {
        display: none; }
    @media screen and (min-width: 0) and (max-width: 419px) {
      .success-block__text {
        font-size: 1.0625em; } }

/* ----------------------------------------
    Form Block error
---------------------------------------- */
.form-block__error {
  margin-top: 1rem;
  color: #FF0000; }
  .form-block__error.hidden {
    display: none; }

/* ----------------------------------------
    Form Block required
---------------------------------------- */
.form-block label.required:after {
  content: ' *';
  color: #FF0000; }

/* ----------------------------------------
    date section Base
---------------------------------------- */
/* ----------------------------------------
    date section Core
---------------------------------------- */
.date-block__date {
  margin-top: 0.5rem;
  display: flex;
  justify-content: space-between;
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 419px) {
    .date-block__date {
      display: block; } }

.date-block__day {
  margin-right: 1rem; }

.date-block__month {
  margin-right: 1rem; }

/* ----------------------------------------
    date section Base
---------------------------------------- */
.address-block {
  width: 100%;
  margin: 0 0 0.5rem 0;
  display: inline-flex;
  flex-direction: column;
  justify-content: space-between; }

/* ----------------------------------------
    date section Core
---------------------------------------- */
.address-block__top-info {
  display: inline-flex;
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 419px) {
    .address-block__top-info {
      display: block; } }

.address-block__street {
  width: 40%;
  margin-right: 1rem;
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 419px) {
    .address-block__street {
      width: 100%; } }

.address-block__house {
  width: 30%;
  margin-right: 1rem;
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 419px) {
    .address-block__house {
      width: 100%; } }

.address-block__addition {
  width: 30%;
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 419px) {
    .address-block__addition {
      width: 100%; } }

.address-block__bottom-info {
  width: 100%;
  display: inline-flex;
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 419px) {
    .address-block__bottom-info {
      display: block; } }

.address-block__zipCode {
  width: 50%;
  margin-right: 1rem;
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 419px) {
    .address-block__zipCode {
      width: 100%; } }

.address-block__city {
  width: 50%;
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 419px) {
    .address-block__city {
      width: 100%; } }

/* ----------------------------------------
    Phone Base
---------------------------------------- */
.phone-block {
  margin: 1rem 0 0.5rem 0; }

/* ----------------------------------------
    FORM Heading Base
---------------------------------------- */
/* ----------------------------------------
    FORM Heading Core
---------------------------------------- */
.form-heading-block__title {
  padding: 1rem 0 1rem 0; }

/* ----------------------------------------
    Question Base
---------------------------------------- */
.question-block {
  margin: 1rem 0 0.5rem 0; }

/* ----------------------------------------
    Feature Blocks
---------------------------------------- */
/* ----------------------------------------
    FAQ Base
---------------------------------------- */
/* ----------------------------------------
    FAQ Core
---------------------------------------- */
.faq__content {
  margin-left: -2rem;
  margin-right: -2rem;
  width: calc(100% + 4rem); }
  .faq__content::after {
    clear: both;
    content: "";
    display: block; }

.faq__info {
  width: calc(33.33333% - 2.66667rem);
  float: left;
  margin-left: 2rem;
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 1079px) {
    .faq__info {
      width: calc(50% - 3rem);
      float: left;
      margin-left: 2rem; } }
  @media screen and (min-width: 0) and (max-width: 959px) {
    .faq__info {
      width: calc(100% - 4rem);
      float: left;
      margin-left: 2rem; } }

.faq__questions {
  width: calc(66.66667% - 3.33333rem);
  float: left;
  margin-left: 2rem;
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 1079px) {
    .faq__questions {
      width: calc(50% - 3rem);
      float: left;
      margin-left: 2rem; } }
  @media screen and (min-width: 0) and (max-width: 959px) {
    .faq__questions {
      width: calc(100% - 4rem);
      float: left;
      margin-left: 2rem;
      margin-top: 2rem; } }

/* ----------------------------------------
    FAQ
---------------------------------------- */
.faq__desc {
  font-size: 1.25em;
  font-weight: 300; }

/* ----------------------------------------
    Newsletter Core
---------------------------------------- */
.newsletter-block input {
  border: 0;
  border-bottom: 1px solid #002F87;
  border-radius: 0;
  font-size: 1.25em;
  /* responsive */ }
  .newsletter-block input::placeholder {
    color: #002F87; }
  @media screen and (min-width: 1080px) {
    .newsletter-block input {
      width: 100%;
      margin-right: 0; } }
  @media screen and (min-width: 0) and (max-width: 767px) {
    .newsletter-block input {
      width: 100%; } }

.newsletter-block label {
  font-family: "Nimbus", "Helvetica", sans-serif; }

/* ----------------------------------------
    Newsletter Base
---------------------------------------- */
.newsletter-block {
  border-top: 1px solid #edf0f2; }

/* ----------------------------------------
    Newsletter Content
---------------------------------------- */
.newsletter-block__desc {
  font-family: "Lubalin", "Helvetica", sans-serif;
  font-size: 1.375em;
  font-weight: 300;
  line-height: 1.35em;
  font-weight: 500;
  /* responsive */ }
  @media screen and (min-width: 1080px) {
    .newsletter-block__desc {
      width: calc((100% - 40px) / 2); } }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .newsletter-block__desc {
      font-size: 1.25em; } }

/* ----------------------------------------
    Newsletter Form
---------------------------------------- */
.newsletter-block__inputs {
  width: 100%;
  margin-top: 2.625rem;
  display: inline-flex;
  justify-content: space-between;
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 767px) {
    .newsletter-block__inputs {
      display: block; } }

.newsletter-block__input {
  width: calc((100% - 40px) / 2);
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 767px) {
    .newsletter-block__input {
      width: 100%; } }

.newsletter-block__error {
  width: 100%;
  margin-top: 0.75rem;
  display: block; }

.newsletter-block__options {
  width: 100%;
  display: inline-flex;
  justify-content: space-between;
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 959px) {
    .newsletter-block__options {
      display: block; } }

.newsletter-block__button, .newsletter-block__radio {
  width: 100%;
  max-width: 37.5rem;
  margin: 3rem 0 0 0;
  /* responsive */ }
  @media screen and (min-width: 1080px) {
    .newsletter-block__button, .newsletter-block__radio {
      width: calc((100% - 40px) / 2); } }

/* ----------------------------------------
      Latest Agenda And News Base
---------------------------------------- */
.recent-news-agenda {
  font-family: "Lubalin", "Helvetica", sans-serif;
  /* svg */ }
  .recent-news-agenda svg {
    margin-left: 0.25rem; }
    .recent-news-agenda svg * {
      fill: #002F87; }

/* ----------------------------------------
    Latest Agenda And News
---------------------------------------- */
.recent-news-agenda__content {
  width: 100%; }

.recent-news-agenda__items {
  padding: 0 2.5rem;
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 959px) {
    .recent-news-agenda__items {
      padding: 0 2rem; } }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .recent-news-agenda__items {
      padding: 0 1.25rem; } }

.recent-news-agenda__info {
  padding: 2.5rem 2.5rem 1rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .recent-news-agenda__info {
      padding: 2rem 1.5rem 1rem; } }

.recent-news-agenda__more {
  font-weight: 300;
  transition: padding 0.25s ease;
  /* state */ }
  .recent-news-agenda__more:hover {
    padding-right: 0.5rem; }

.recent-news-agenda__agenda, .recent-news-agenda__news {
  background-color: #FFFFFF; }

.recent-news-agenda__agenda {
  width: 100%; }

.recent-news-agenda__news {
  width: 100%; }

.recent-news-agenda__type-title {
  display: inline-block; }

.recent-news-agenda .link--underline {
  font-weight: 100;
  float: right; }
  .recent-news-agenda .link--underline svg * {
    fill: #002F87; }
  .recent-news-agenda .link--underline svg {
    height: 15px; }

/* ----------------------------------------
    Calender & News
---------------------------------------- */
.recent-news-agenda__content {
  margin-left: -2rem;
  margin-right: -2rem;
  width: calc(100% + 4rem);
  /* responsive */ }
  .recent-news-agenda__content::after {
    clear: both;
    content: "";
    display: block; }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .recent-news-agenda__content {
      font-size: 0.9em; } }

.recent-news-agenda__news {
  width: calc(62.5% - 3.25rem);
  float: left;
  margin-left: 2rem;
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 959px) {
    .recent-news-agenda__news {
      width: calc(50% - 3rem);
      float: left;
      margin-left: 2rem; } }
  @media screen and (min-width: 0) and (max-width: 767px) {
    .recent-news-agenda__news {
      width: calc(100% - 4rem);
      float: left;
      margin-left: 2rem; } }

.recent-news-agenda__agenda {
  width: calc(33.33333% - 2.66667rem);
  float: left;
  margin-left: 2rem;
  /* responsive */ }
  @media screen and (min-width: 1080px) {
    .recent-news-agenda__agenda {
      margin-left: calc(4.16667% - 2.08333rem + 4rem); } }
  @media screen and (min-width: 0) and (max-width: 959px) {
    .recent-news-agenda__agenda {
      width: calc(50% - 3rem);
      float: left;
      margin-left: 2rem; } }
  @media screen and (min-width: 0) and (max-width: 767px) {
    .recent-news-agenda__agenda {
      width: calc(100% - 4rem);
      float: left;
      margin-left: 2rem;
      margin-top: 2rem; } }

/* ----------------------------------------
    Latest Agenda And News Tile
---------------------------------------- */
.recent-news-agenda-tile {
  width: 100%;
  padding: 25px 0 25px 0;
  border-bottom: 1px solid #DEE3E7; }
  .recent-news-agenda-tile:last-of-type {
    padding-bottom: 0;
    border-bottom: unset; }
  .recent-news-agenda-tile__location, .recent-news-agenda-tile__date {
    margin-bottom: 0;
    font-weight: 100; }
  .recent-news-agenda-tile__title {
    margin-bottom: 0; }
  .recent-news-agenda-tile__image {
    width: 115px;
    margin-right: 30px;
    float: left; }

/* ----------------------------------------
    Team Base
---------------------------------------- */
/* ----------------------------------------
    Team Core
---------------------------------------- */
.team-block [class*='__container--medium'] {
  padding-top: 1rem;
  padding-bottom: 1rem; }

/* ----------------------------------------
    Team Block
---------------------------------------- */
.team-block__info {
  margin-bottom: -2rem; }

.team-block__title {
  margin-bottom: 1em;
  font-size: 1.625em; }

.team-block__text {
  font-family: "Nimbus", "Helvetica", sans-serif;
  font-size: 1.1875em;
  font-weight: 300;
  line-height: 1.5em; }

/* ----------------------------------------
    Team Members
---------------------------------------- */
.team-block__members {
  margin-left: -2rem;
  margin-right: -2rem;
  width: calc(100% + 4rem);
  margin-bottom: 3rem; }
  .team-block__members::after {
    clear: both;
    content: "";
    display: block; }

/* ----------------------------------------
    Team Member
---------------------------------------- */
.team-block__member {
  width: calc(25% - 2.5rem);
  float: left;
  margin-left: 2rem;
  margin-top: 2rem;
  position: relative;
  display: block;
  cursor: pointer;
  /* state */
  /* responsive */ }
  .team-block__member:before {
    content: "";
    position: relative;
    display: inline-block;
    width: 100%;
    height: 100%;
    background: rgba(0, 47, 135, 0.6);
    position: absolute;
    top: 0;
    left: 0;
    z-index: 100;
    display: block;
    opacity: 0;
    transition: opacity 0.45s ease; }
  .team-block__member:hover:before {
    opacity: 1;
    transition: opacity 0.25s ease; }
  @media screen and (min-width: 0) and (max-width: 1079px) {
    .team-block__member {
      width: calc(33.33333% - 2.66667rem);
      float: left;
      margin-left: 2rem; } }
  @media screen and (min-width: 0) and (max-width: 767px) {
    .team-block__member {
      width: calc(50% - 3rem);
      float: left;
      margin-left: 2rem; } }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .team-block__member {
      width: calc(50% - 9%);
      float: left;
      margin-left: 6%;
      margin-top: 6%; } }
  @media screen and (min-width: 420px) and (max-width: 959px) and (orientation: landscape) {
    .team-block__member {
      width: calc(33.33333% - 8%);
      float: left;
      margin-left: 6%; } }

/* ----------------------------------------
    Team Content
---------------------------------------- */
.team-block__content {
  padding: 1rem;
  color: #FFFFFF;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 1000; }

.team-block__image {
  width: 105%; }

.team-block__overlay {
  width: 100%;
  height: 100%;
  background: linear-gradient(transparent 60%, rgba(24, 23, 22, 0.5) 100%);
  background-size: 100% 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 100;
  display: block; }

.team-block__thumb {
  position: relative;
  overflow: hidden; }
  .team-block__thumb:before {
    content: "";
    position: relative;
    display: inline-block;
    width: 100%;
    padding-top: 140%; }
  .team-block__thumb img {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0; }
    @supports (object-fit: cover) {
      .team-block__thumb img {
        object-fit: cover; } }

/* ----------------------------------------
    Team Data
---------------------------------------- */
.team-block__name {
  font-family: "Lubalin", "Helvetica", sans-serif;
  font-size: 1.375em;
  font-weight: 300;
  line-height: 1.35em;
  font-weight: 600;
  line-height: 1.1em;
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .team-block__name {
      margin-bottom: 0.5em; } }

.team-block__role {
  font-family: "Nimbus", "Helvetica", sans-serif;
  font-size: 0.9375em;
  font-weight: 300;
  line-height: 1.25em; }

/* ----------------------------------------
    Team Contact
---------------------------------------- */
.team-block__email, .team-block__phone {
  width: 100%;
  font-family: "Nimbus", "Helvetica", sans-serif;
  font-size: 0.9375em;
  font-weight: 300;
  line-height: 1.25em;
  max-width: 90%;
  text-overflow: ellipsis;
  white-space: nowrap;
  display: inline-block;
  overflow: hidden;
  display: block;
  /* responsive */ }
  .team-block__email:before, .team-block__phone:before {
    content: "";
    position: relative;
    display: inline-block;
    width: 1em;
    height: 1em;
    margin-top: 0.25em;
    margin-right: 0.5rem;
    background-size: 80% auto;
    background-position: bottom;
    background-repeat: no-repeat;
    position: relative;
    display: inline-block; }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .team-block__email, .team-block__phone {
      display: none; } }

.team-block__email:before {
  content: "";
  position: relative;
  display: inline-block;
  background-image: url("./../images/email.svg"); }

.team-block__phone:before {
  content: "";
  position: relative;
  display: inline-block;
  background-image: url("./../images/phone.svg"); }

/* ----------------------------------------
    Detail
---------------------------------------- */
/* ----------------------------------------
    Magazine detail Base
---------------------------------------- */
.magazine-detail__header {
  width: 100%;
  height: 100%;
  padding-top: 41px;
  background: linear-gradient(to bottom, #F9CDD0 60%, #FFFFFF 40%);
  text-align: center; }

/* ----------------------------------------
    Magazine detail Core
---------------------------------------- */
.magazine-detail__back {
  margin-left: 10%;
  position: absolute;
  top: 10%;
  left: 0; }

.magazine-detail__title {
  margin: 29px 0 25px 0; }

.magazine-detail__date {
  margin-bottom: 42px !important; }

.magazine-detail__image {
  position: relative; }
  .magazine-detail__image:before {
    content: "";
    position: relative;
    display: inline-block;
    width: 100%;
    padding-top: 50%; }
  .magazine-detail__image img {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0; }
    @supports (object-fit: cover) {
      .magazine-detail__image img {
        object-fit: cover; } }

.magazine-detail__img-caption {
  margin-top: 0.75em;
  width: 80%;
  margin: 1em auto;
  font-family: "Nimbus", "Helvetica", sans-serif;
  font-size: 0.9375em;
  font-weight: 500;
  font-style: normal;
  text-align: center;
  overflow: hidden;
  text-align: right;
  float: right; }

/* ----------------------------------------
  Magazine Author
---------------------------------------- */
.magazine-detail-author__person {
  width: 100%;
  margin: 20px 0;
  padding-top: 28px;
  border-top: 1px solid #e7e9eb;
  display: inline-flex; }

.magazine-detail-author__image {
  width: 100%;
  max-width: 80px;
  max-height: 80px;
  position: relative; }
  .magazine-detail-author__image:before {
    content: "";
    position: relative;
    display: inline-block;
    width: 100%;
    padding-top: 100%; }
  .magazine-detail-author__image img {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0; }
    @supports (object-fit: cover) {
      .magazine-detail-author__image img {
        object-fit: cover; } }
  .magazine-detail-author__image img {
    border-radius: 100%; }

.magazine-detail-author__info {
  width: 100%;
  margin: auto 0;
  padding: 1rem 1rem;
  display: inline-flex;
  align-items: baseline;
  justify-content: space-between; }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .magazine-detail-author__info {
      width: 100%; } }

.magazine-detail-author__name {
  margin-bottom: 5px;
  font-weight: 600;
  font-size: 1.375em; }

/* ----------------------------------------
    Magazine detail Base
---------------------------------------- */
.news-detail__header {
  width: 100%;
  height: 100%;
  padding-top: 111px;
  background: linear-gradient(to bottom, #EBEFF2 60%, #FFFFFF 40%); }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .news-detail__header {
      background: linear-gradient(to bottom, #EBEFF2 40%, #FFFFFF 40%); } }

/* ----------------------------------------
    Magazine detail Core
---------------------------------------- */
.news-detail__back {
  margin-left: 10%;
  position: absolute;
  left: 0; }

.news-detail__title {
  margin-bottom: 42px !important; }

.news-detail__date {
  margin: 36px 0 0 0; }

.news-detail__image {
  position: relative; }
  .news-detail__image:before {
    content: "";
    position: relative;
    display: inline-block;
    width: 100%;
    padding-top: 50%; }
  .news-detail__image img {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0; }
    @supports (object-fit: cover) {
      .news-detail__image img {
        object-fit: cover; } }

.news-detail__img-caption {
  margin-top: 0.75em;
  width: 80%;
  margin: 1em auto;
  font-family: "Nimbus", "Helvetica", sans-serif;
  font-size: 0.9375em;
  font-weight: 500;
  font-style: normal;
  text-align: center;
  overflow: hidden;
  text-align: right;
  float: right; }

.news-detail__intro {
  margin-top: 80px;
  display: inline-flex; }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .news-detail__intro {
      margin-top: 20px; } }

.news-detail__social-intro {
  margin-left: -80px;
  position: absolute;
  display: inline-flex;
  flex-direction: column; }
  @media screen and (min-width: 0) and (max-width: 1279px) {
    .news-detail__social-intro {
      margin: 0 10px;
      position: unset; } }
  .news-detail__social-intro a {
    margin-bottom: 20px; }
    @media screen and (min-width: 0) and (max-width: 1279px) {
      .news-detail__social-intro a {
        margin-bottom: 5px; } }

.news-detail__intro-text {
  font-size: 1.375em; }

/* ----------------------------------------
    Magazine detail Base
---------------------------------------- */
.project-detail__header {
  width: 100%;
  height: 100%;
  background: linear-gradient(to bottom, #EBEFF2 325px, #FFFFFF 325px); }

.project-detail__content-left [class*='__container'][class$='--small'] {
  padding-left: 0;
  padding-right: 0; }

/* ----------------------------------------
    Magazine detail Core
---------------------------------------- */
.project-detail__content {
  width: 100%;
  margin-top: 5rem;
  display: inline-flex;
  justify-content: space-between;
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .project-detail__content {
      display: block; } }

.project-detail__content-left {
  width: 100%;
  max-width: 700px; }

.project-detail__back {
  margin-bottom: 1rem; }

.project-detail__title {
  margin: 0 0 2rem; }

.project-detail__image {
  position: relative;
  max-width: 700px;
  overflow: hidden; }
  .project-detail__image:before {
    content: "";
    position: relative;
    display: inline-block;
    width: 100%;
    padding-top: 57.14286%; }
  .project-detail__image img {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0; }
    @supports (object-fit: cover) {
      .project-detail__image img {
        object-fit: cover; } }

.project-detail__content-right {
  width: 100%;
  max-width: 376px;
  height: fit-content;
  padding: 0 30px;
  background-color: #FFFFFF;
  box-shadow: rgba(24, 23, 22, 0.1) 0 4px 2.75rem 0; }

.project-detail__list-item {
  padding: 30px 0;
  border-bottom: 1px solid #DEE3E7; }
  .project-detail__list-item:last-child {
    border-bottom: unset; }

/* ----------------------------------------
    Fund Detail Base
---------------------------------------- */
.fund-detail-content__content-left [class*='__container'][class$='--small'] {
  padding-left: 0;
  padding-right: 0; }

/* ----------------------------------------
    Fund Detail Header
---------------------------------------- */
.fund-detail-header {
  width: 100%;
  max-height: 620px;
  background-color: #B5D9B9;
  position: relative;
  display: inline-block;
  vertical-align: top; }
  .fund-detail-header * {
    outline: none; }
  .fund-detail-header__back {
    margin-bottom: 5px; }
  .fund-detail-header__header {
    max-width: calc(1440px + 8rem);
    height: 36vw;
    margin: auto; }
  .fund-detail-header__header-image {
    width: calc(60% + 1px);
    max-width: 55%;
    height: 36vw;
    max-height: 620px;
    position: absolute;
    top: 0;
    right: 0;
    display: inline-block;
    overflow: hidden;
    vertical-align: top;
    -webkit-clip-path: polygon(100% 0%, 100% 100%, 0 100%, 148px 50%, 0 0);
    clip-path: polygon(100% 0%, 100% 100%, 0 100%, 148px 50%, 0 0);
    /* responsive */ }
    @media screen and (min-width: 1440px) {
      .fund-detail-header__header-image {
        width: calc(60% + 17px); } }
    @media screen and (min-width: 1600px) {
      .fund-detail-header__header-image {
        width: calc(60% + 168px); } }
    @media screen and (min-width: 1920px) {
      .fund-detail-header__header-image {
        width: calc(60% + 438px); } }
    @media screen and (min-width: 2440px) {
      .fund-detail-header__header-image {
        width: calc(60% + 700px); } }
  .fund-detail-header__header-content {
    width: 40%;
    height: 100%;
    padding: 7.5rem 2.5rem 0 0;
    display: inline-block;
    vertical-align: top; }

/* ----------------------------------------
    Fund detail Core
---------------------------------------- */
.fund-detail-content__content {
  width: 100%;
  display: inline-flex;
  justify-content: space-between;
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .fund-detail-content__content {
      flex-direction: column; } }

.fund-detail-content__content-left {
  width: 100%;
  max-width: 688px;
  overflow: hidden;
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .fund-detail-content__content-left {
      width: 100%;
      margin-right: 0; } }

.fund-detail-content__content-right {
  width: 100%;
  max-width: 25rem;
  height: fit-content;
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .fund-detail-content__content-right {
      width: 100%; } }

.fund-detail-content__period {
  margin-bottom: 1.25rem;
  padding: 1rem;
  border-radius: 4px;
  background-color: #B5D9B9;
  font-weight: 300;
  text-align: center; }
  .fund-detail-content__period svg {
    width: auto;
    height: 1em;
    margin-bottom: -0.1em;
    display: inline-block; }
    .fund-detail-content__period svg * {
      fill: #002F87; }

.fund-detail-content__reminder-form {
  width: auto;
  margin: 2rem 0;
  padding: 1.5rem 2rem;
  background-color: #EBEFF2; }
  .fund-detail-content__reminder-form input {
    margin: 0;
    border: 0;
    border-bottom: 1px solid #002F87;
    border-radius: 0;
    font-size: 1.1875em; }
    .fund-detail-content__reminder-form input::-webkit-input-placeholder {
      color: rgba(0, 47, 135, 0.5); }
    .fund-detail-content__reminder-form input:-moz-placeholder {
      color: rgba(0, 47, 135, 0.5); }
    .fund-detail-content__reminder-form input::-moz-placeholder {
      color: rgba(0, 47, 135, 0.5); }
    .fund-detail-content__reminder-form input:-ms-input-placeholder {
      color: rgba(0, 47, 135, 0.5); }
  .fund-detail-content__reminder-form--error {
    margin: 1rem 0;
    color: #002F87; }
  .fund-detail-content__reminder-form button {
    width: 100%;
    margin: 1.5rem 0 0;
    display: flex;
    align-items: center;
    justify-content: space-between; }

.fund-detail-content__list-items {
  margin-top: 1.25rem;
  padding: 0 2.25rem 0 2.25rem;
  background-color: #DEE3E7; }

.fund-detail-content__list-item {
  max-width: 18rem;
  padding: 1.5rem 0 1.5rem 0;
  border-bottom: 1px solid #b3c1db; }
  .fund-detail-content__list-item:last-of-type {
    border-bottom: unset; }
  .fund-detail-content__list-item ul {
    margin: 0;
    padding-left: 1.5rem; }

.fund-detail-content__title {
  margin: 0 0 0.3rem 0 !important;
  font-weight: 600; }

/* ----------------------------------------
    Fund detail Contact Us
---------------------------------------- */
.fund-detail-contact-us__images {
  width: 50%;
  display: inline-flex;
  align-items: center;
  /* responsive */ }
  .fund-detail-contact-us__images:not(:first-child) {
    margin-left: -3rem; }
  @media screen and (min-width: 0) and (max-width: 959px) {
    .fund-detail-contact-us__images {
      margin: auto; } }

.fund-detail-contact-us__image {
  position: relative;
  width: 100%;
  max-width: 160px;
  height: 100%;
  max-height: 160px; }
  .fund-detail-contact-us__image:before {
    content: "";
    position: relative;
    display: inline-block;
    width: 100%;
    padding-top: 100%; }
  .fund-detail-contact-us__image img {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0; }
    @supports (object-fit: cover) {
      .fund-detail-contact-us__image img {
        object-fit: cover; } }
  .fund-detail-contact-us__image img {
    border-radius: 100%; }

.fund-detail-contact-us__info {
  width: 40%;
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 959px) {
    .fund-detail-contact-us__info {
      width: 100%;
      margin-top: 2rem; } }

.fund-detail-contact-us__content {
  padding: 50px 50px;
  width: 100%;
  color: #FFFFFF;
  display: inline-flex;
  justify-content: space-between;
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 959px) {
    .fund-detail-contact-us__content {
      flex-direction: column; } }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .fund-detail-contact-us__content {
      padding: 0; } }

.fund-detail-contact-us__title {
  color: #FFFFFF; }

.fund-detail-contact-us__desc {
  margin: 1rem 0 2rem; }

.fund-detail-contact-us__phone {
  margin-bottom: 0.5rem !important; }

/* ----------------------------------------
    Fund Apply box
---------------------------------------- */
.fund-apply__box {
  background-color: #002F87;
  color: #FFFFFF;
  padding: 2rem;
  margin-bottom: 1.5rem;
  border-radius: 3px; }
  .fund-apply__box--title {
    font-family: "Lubalin", "Helvetica", sans-serif;
    font-size: 1.25em;
    font-weight: 600;
    line-height: 1.5rem;
    margin-bottom: 1.5rem;
    display: block; }

.fund__heading {
  margin-top: 2rem; }

/* ----------------------------------------
    Templates
---------------------------------------- */
/* ----------------------------------------
    Fund Overview Base
---------------------------------------- */
/* ----------------------------------------
    Fund Overview Core
---------------------------------------- */
/* ----------------------------------------
    Fund Overview
---------------------------------------- */
.fund-overview__header {
  width: 100%;
  margin-bottom: 1rem;
  padding-top: 3.125rem;
  display: inline-flex;
  align-items: flex-start;
  justify-content: space-between;
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 767px) {
    .fund-overview__header {
      display: block;
      align-items: normal;
      justify-content: inherit; } }

.fund-overview__highlights {
  padding-top: 3rem;
  border-top: 1px solid #edf0f2; }

.fund-overview__desc {
  margin-bottom: 20px !important; }

.fund-overview__tooltip {
  margin-top: 1.5rem;
  font-size: 1.1875em;
  display: inline-flex;
  align-items: center;
  cursor: help; }
  .fund-overview__tooltip svg {
    margin-right: 15px; }

.fund-overview__tool {
  width: 100%;
  max-width: 376px;
  margin-left: 50px;
  background-color: #002F87;
  flex-shrink: 0;
  padding: 2.75rem 2rem 2.75rem 2rem;
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 767px) {
    .fund-overview__tool {
      width: 100%;
      max-width: unset;
      margin: 0;
      margin-top: 2rem;
      text-align: center; } }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .fund-overview__tool {
      padding: 1.5rem 1.5rem; } }

.fund-overview__tool-title {
  margin-bottom: 23px;
  color: #FFFFFF;
  font-size: 1.625em; }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .fund-overview__tool-title {
      margin-bottom: 25px; } }

/* ----------------------------------------
    Fund Overview CTA
---------------------------------------- */
.fund-overview__cta {
  margin: 30px 0 90px 0;
  background: #EBEFF2;
  text-align: center;
  padding: 3.75rem 4rem; }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .fund-overview__cta {
      padding: 2rem 1rem; } }

.fund-overview__cta-text {
  max-width: 800px;
  margin: 0 auto 25px auto;
  font-weight: 500;
  font-size: 1.375em; }
  .fund-overview__cta-text:last-of-type {
    margin-bottom: 25px; }

.fund__heading {
  width: 37.5%; }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .fund__heading {
      width: 100%; } }

.fund__tracks {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: 32px;
  row-gap: 32px;
  margin-top: 32px; }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .fund__tracks {
      grid-template-columns: repeat(1, minmax(0, 1fr)); } }

.track__content {
  padding: 1.5rem;
  display: flex;
  flex-direction: column;
  row-gap: 1rem;
  height: 100%; }
  .track__content .btn, .track__content .btn-solid--blue, .track__content .btn-solid--lightblue, .track__content .btn-solid--green, .track__content .btn-solid--pink, .track__content .btn-solid--white, .track__content .btn-solid--lightgrey, .track__content .btn-solid--grey, .track__content .btn-solid--black, .track__content .btn-solid--error, .track__content .btn-inactive {
    margin-right: auto;
    margin-top: auto; }

/* ----------------------------------------
    Magazine overview Base
---------------------------------------- */
.magazine-overview {
  position: relative;
  overflow: hidden; }
  .magazine-overview__container {
    z-index: 0; }

/* ----------------------------------------
    Magazine overview first item
---------------------------------------- */
.overview-card-header .overview-card__card {
  max-height: 450px; }

/* ----------------------------------------
    Magazine overview Core
---------------------------------------- */
/* ----------------------------------------
    Magazine overview Series Slider
---------------------------------------- */
.magazine-series-slider .overview-slider {
  padding: 0 !important; }
  .magazine-series-slider .overview-slider .slick-slide {
    margin-right: 2rem; }

/* ----------------------------------------
    Projects overview
---------------------------------------- */
.projects-overview {
  margin-top: 82px; }

/* ----------------------------------------
    Projects overview Slider
---------------------------------------- */
.project-overview-slider {
  padding-bottom: 68px; }
  .project-overview-slider .slider {
    width: 100%; }
  .project-overview-slider .slider__slide {
    /* responsive */ }
    @media screen and (min-width: 0) and (max-width: 639px) {
      .project-overview-slider .slider__slide {
        padding-right: 2.5rem; } }

.project-slide__image {
  position: relative; }
  .project-slide__image:before {
    content: "";
    position: relative;
    display: inline-block;
    width: 100%;
    padding-top: 66.66667%; }
  .project-slide__image img {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0; }
    @supports (object-fit: cover) {
      .project-slide__image img {
        object-fit: cover; } }

.project-slide__content {
  width: 100%;
  color: #FFFFFF;
  position: absolute;
  bottom: 0;
  padding: 40px 40px; }

.project-slide__date {
  margin: 0;
  font-size: 1.3125em; }

.project-slide__title {
  margin: 0;
  color: #FFFFFF; }

.project-slide__date {
  font-size: 1.125em; }

/* ----------------------------------------
    Projects overview filter
---------------------------------------- */
.projects-filter {
  width: 100%;
  display: inline-flex; }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .projects-filter {
      flex-direction: column; } }
  .projects-filter__left {
    width: 45%; }
    @media screen and (min-width: 0) and (max-width: 639px) {
      .projects-filter__left {
        width: 100%; } }
  .projects-filter__right {
    width: 55%; }
    @media screen and (min-width: 0) and (max-width: 639px) {
      .projects-filter__right {
        width: 100%; } }

.projects-filter .filter-search__title {
  margin: 20px 0;
  font-weight: 600; }

.projects-filter .filter-search__search-form {
  margin-bottom: 20px; }

/* ----------------------------------------
    News Overview Base
---------------------------------------- */
/* ----------------------------------------
   background color
---------------------------------------- */
.top-news {
  max-height: 690px;
  padding-top: 82px;
  background-color: #DEE3E7; }

/* ----------------------------------------
    News Overview Core
---------------------------------------- */
.news-overview__header {
  width: 100%;
  display: inline-flex;
  justify-content: space-between; }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .news-overview__header {
      display: block; } }

/* ----------------------------------------
    News
---------------------------------------- */
.overview-news {
  width: 50%;
  display: inline-flex;
  flex-direction: column; }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .overview-news {
      width: 100%; } }

/* ----------------------------------------
    Agenda
---------------------------------------- */
.overview-agenda {
  width: 100%; }
  .overview-agenda .slider {
    width: 100%;
    overflow: hidden; }
  .overview-agenda .slider__slides {
    width: 100%;
    position: relative; }
  .overview-agenda .slider__arrows {
    margin: 0;
    position: absolute;
    top: 0.875rem;
    right: 1.25rem;
    display: inline-flex;
    justify-content: space-between;
    transform: none; }
    .overview-agenda .slider__arrows .slider__arrows--right,
    .overview-agenda .slider__arrows .slider__arrows--left {
      margin-left: 10px;
      cursor: pointer; }

/* ----------------------------------------
    Default Page Base
---------------------------------------- */
/* ----------------------------------------
   Default Page Core
---------------------------------------- */
.top-news {
  max-height: 690px;
  background-color: #DEE3E7; }

/* ----------------------------------------
    Search Page Base
---------------------------------------- */
.search {
  margin: 3rem 0; }
  .search__wrapper {
    margin: 0 -14px; }
  .search .gsc-results-wrapper-overlay {
    width: 60%;
    height: calc(100% - 240px);
    top: 200px;
    left: 20%; }
    @media screen and (min-width: 0) and (max-width: 1279px) {
      .search .gsc-results-wrapper-overlay {
        width: 80%;
        height: calc(100% - 180px);
        top: 150px;
        left: 10%; } }
    @media screen and (min-width: 0) and (max-width: 959px) {
      .search .gsc-results-wrapper-overlay {
        width: 92%;
        height: calc(100% - 110px);
        top: 100px;
        left: 4%; } }
  .search .gsc-search-button-v2 {
    padding: 1rem 2rem;
    border-radius: 5px;
    border-color: #002F87;
    background: #002F87;
    cursor: pointer;
    /* svg */ }
    .search .gsc-search-button-v2:focus .search .gsc-search-button-v2:active, .search .gsc-search-button-v2:hover {
      border-color: #00266e;
      background: #00266e; }
    .search .gsc-search-button-v2 svg {
      width: 16px;
      height: 16px; }
  .search .gsc-input-box {
    border-radius: 5px; }
  .search .gsib_a {
    padding: 0.95rem 1rem 0.95rem 1rem; }

.myfunds__wrapper {
  display: flex;
  gap: 40px;
  align-items: flex-start; }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .myfunds__wrapper {
      flex-direction: column; } }
  .myfunds__wrapper .has-account {
    color: #FFFFFF; }

.myfunds__item {
  padding: 32px;
  display: flex;
  flex-direction: column;
  row-gap: 1rem;
  width: 100%; }
  .myfunds__item .btn, .myfunds__item .btn-solid--blue, .myfunds__item .btn-solid--lightblue, .myfunds__item .btn-solid--green, .myfunds__item .btn-solid--pink, .myfunds__item .btn-solid--white, .myfunds__item .btn-solid--lightgrey, .myfunds__item .btn-solid--grey, .myfunds__item .btn-solid--black, .myfunds__item .btn-solid--error, .myfunds__item .btn-inactive {
    margin-right: auto; }

.myfunds__content p {
  margin-bottom: 8px; }

/* ----------------------------------------
    Highlights
---------------------------------------- */
/* ----------------------------------------
    Highlight items grid
---------------------------------------- */
.fund-highlight-items:not(:first-child) {
  margin-top: 40px; }

/* ----------------------------------------
    Highlight item grid
---------------------------------------- */
@media screen and (min-width: 560px) and (max-width: 1079px) {
  .fund-highlight-items .highlighted-item:last-child {
    display: none; } }

/* ----------------------------------------
    Highlight item
---------------------------------------- */
.fund-highlight-item {
  /* state */
  /* responsive */ }
  .fund-highlight-item:hover .fund-highlight-item__thumb:after {
    opacity: 1;
    transition: opacity 0.25s ease; }
  .fund-highlight-item__thumb {
    position: relative;
    background: #EBEFF2;
    position: relative;
    overflow: hidden; }
    .fund-highlight-item__thumb:before {
      content: "";
      position: relative;
      display: inline-block;
      width: 100%;
      padding-top: 62.5%; }
    .fund-highlight-item__thumb img {
      width: 100%;
      height: 100%;
      position: absolute;
      top: 0;
      bottom: 0;
      left: 0;
      right: 0; }
      @supports (object-fit: cover) {
        .fund-highlight-item__thumb img {
          object-fit: cover; } }
    .fund-highlight-item__thumb:after {
      content: "";
      position: relative;
      display: inline-block;
      width: 100%;
      height: 100%;
      background: rgba(0, 47, 135, 0.6);
      position: absolute;
      top: 0;
      left: 0;
      z-index: 100;
      display: block;
      opacity: 0;
      transition: opacity 0.45s ease; }
  .fund-highlight-item .overview-card__tags, .fund-highlight-item .overview-card__date, .fund-highlight-item .overview-card__title, .fund-highlight-item .overview-card__logline {
    margin-top: 1rem; }
  .fund-highlight-item .overview-card__date {
    font-weight: 300;
    font-size: 1.125em;
    line-height: 1.7em; }
  .fund-highlight-item__logline,
  .fund-highlight-item__text p {
    font-size: 1.1875em;
    font-family: "Nimbus", "Helvetica", sans-serif;
    font-weight: 300; }
  .fund-highlight-item__title {
    margin: 0 0 0.25rem;
    font-size: 1.25em; }
  .fund-highlight-item__date p {
    font-size: 1.125em; }
  @media screen and (min-width: 0) and (max-width: 1079px) {
    .fund-highlight-item {
      margin-top: 1rem; } }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .fund-highlight-item + .fund-highlight-item {
      margin-top: 1rem; } }

/* ----------------------------------------
    Fund Tile Criteria
---------------------------------------- */
.fund-highlight-item__criteria {
  margin-top: 1.25rem;
  padding-top: 1.25rem;
  border-top: #b3c1db solid 1px; }

.fund-highlight-item__criteria-title, .fund-highlight-item__criteria-item {
  font-size: 1.1875em;
  font-family: "Nimbus", "Helvetica", sans-serif;
  font-weight: 300; }

.fund-highlight-item__criteria-title {
  margin-bottom: 0.25rem; }

/* ----------------------------------------
    Parts
---------------------------------------- */
/* ----------------------------------------
    Fund Tile Base
---------------------------------------- */
.fund-items__intro {
  width: 100%;
  display: inline-flex;
  align-items: center;
  justify-content: space-between; }

.fund-items__title {
  width: auto;
  display: inline-block; }

.fund-items__filter {
  width: auto;
  display: inline-block;
  float: right;
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .fund-items__filter {
      width: 100%;
      display: block;
      float: none; } }

/* ----------------------------------------
    Fund Tile Core
---------------------------------------- */
.fund-list {
  margin: 1.5rem 0 3rem; }

.fund-item {
  display: flex;
  align-items: center;
  vertical-align: middle;
  padding: 1.5rem 0px;
  /* responsive */
  /* svg */ }
  .fund-item__info {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding: 0 1.25rem;
    /* responsive */ }
    @media screen and (min-width: 0) and (max-width: 639px) {
      .fund-item__info {
        padding: 1rem 0 1rem 0; } }
  .fund-item:hover .fund-item__thumb:after {
    opacity: 1;
    transition: opacity 0.25s ease; }
  .fund-item:hover .fund-item__title {
    background-size: 0 0.1em, 100% 0.1em; }
  .fund-item + .fund-item {
    border-top: 1px solid #e7e9eb; }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .fund-item {
      display: block; }
      .fund-item > * {
        width: 100%;
        min-width: auto;
        max-width: unset; } }
  .fund-item svg {
    margin-bottom: -0.1em;
    display: inline-block; }
    .fund-item svg * {
      fill: #002F87; }
  .fund-item__thumb {
    position: relative;
    min-width: 160px;
    background: #EBEFF2;
    position: relative;
    overflow: hidden;
    /* responsive */ }
    .fund-item__thumb:before {
      content: "";
      position: relative;
      display: inline-block;
      width: 100%;
      padding-top: 62.5%; }
    .fund-item__thumb img {
      width: 100%;
      height: 100%;
      position: absolute;
      top: 0;
      bottom: 0;
      left: 0;
      right: 0; }
      @supports (object-fit: cover) {
        .fund-item__thumb img {
          object-fit: cover; } }
    @media screen and (min-width: 0) and (max-width: 639px) {
      .fund-item__thumb {
        position: relative;
        width: 100%; }
        .fund-item__thumb:before {
          content: "";
          position: relative;
          display: inline-block;
          width: 100%;
          padding-top: 50%; }
        .fund-item__thumb img {
          width: 100%;
          height: 100%;
          position: absolute;
          top: 0;
          bottom: 0;
          left: 0;
          right: 0; }
          @supports (object-fit: cover) {
            .fund-item__thumb img {
              object-fit: cover; } } }
    .fund-item__thumb:after {
      content: "";
      position: relative;
      display: inline-block;
      width: 100%;
      height: 100%;
      background: rgba(0, 47, 135, 0.6);
      position: absolute;
      top: 0;
      left: 0;
      z-index: 100;
      display: block;
      opacity: 0;
      transition: opacity 0.45s ease; }
  .fund-item__tags {
    flex-grow: 1; }
  .fund-item__title {
    margin: 0.5rem 0 0.25rem;
    font-size: 1.25em;
    font-family: "Lubalin", "Helvetica", sans-serif;
    font-weight: 600;
    line-height: 1.2em;
    padding-bottom: 4px;
    background: linear-gradient(to right, rgba(0, 47, 135, 0), rgba(0, 47, 135, 0)), linear-gradient(to right, #002f87, #002f87);
    background-size: 100% 0.1em, 0 0.1em;
    background-position: 100% 100%, 0 100%;
    background-repeat: no-repeat;
    transition: background-size 400ms;
    position: relative;
    display: inline;
    margin-right: auto; }
  .fund-item__desc {
    max-width: 640px;
    font-family: "Nimbus", "Helvetica", sans-serif;
    font-size: 1.1875em;
    font-weight: 300;
    line-height: 1.5em;
    line-height: 1.3em; }
  .fund-item__date {
    font-size: 1.125em;
    font-family: "Lubalin", "Helvetica", sans-serif;
    font-weight: 300;
    flex-shrink: 0; }

/* ----------------------------------------
    Fund Tile Past items
---------------------------------------- */
.fund-items-past {
  margin: 3rem 0 1.5rem;
  display: inline-flex;
  justify-content: space-between;
  /* responsive */ }
  @media screen and (min-width: 0) and (max-width: 959px) {
    .fund-items-past {
      display: block; } }
  @media screen and (min-width: 0) and (max-width: 639px) {
    .fund-items-past {
      display: block; } }
  .fund-items-past__old-title, .fund-items-past__old-desc {
    width: 50%;
    /* responsive */ }
    @media screen and (min-width: 0) and (max-width: 959px) {
      .fund-items-past__old-title, .fund-items-past__old-desc {
        width: 100%; } }
  .fund-items-past__old-desc {
    font-weight: 300; }

/* ----------------------------------------
    News Tile Base
---------------------------------------- */
.overview-news {
  margin-left: -2rem;
  margin-right: -2rem;
  width: calc(100% + 4rem); }
  .overview-news::after {
    clear: both;
    content: "";
    display: block; }
  .overview-news__items {
    width: calc(62.5% - 3.25rem);
    float: left;
    margin-left: 2rem;
    /* responsive */ }
    @media screen and (min-width: 0) and (max-width: 1079px) {
      .overview-news__items {
        width: calc(100% - 4rem);
        float: left;
        margin-left: 2rem; } }

/* ----------------------------------------
    News Tile Core
---------------------------------------- */
.overview-news__thumb {
  position: relative; }
  .overview-news__thumb:before {
    content: "";
    position: relative;
    display: inline-block;
    width: 100%;
    padding-top: 50%; }
  .overview-news__thumb img {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0; }
    @supports (object-fit: cover) {
      .overview-news__thumb img {
        object-fit: cover; } }

.overview-news__image {
  width: 140px;
  height: 120px;
  position: absolute;
  top: 0;
  left: 0;
  position: relative;
  -webkit-clip-path: polygon(27% 0%, 73% 0, 100% 50%, 73% 100%, 27% 100%, 0% 50%);
  clip-path: polygon(27% 0%, 73% 0, 100% 50%, 73% 100%, 27% 100%, 0% 50%);
  overflow: hidden; }
  .overview-news__image:before {
    content: "";
    position: relative;
    display: inline-block;
    width: 100%;
    padding-top: 83.33333%; }
  .overview-news__image img {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0; }
    @supports (object-fit: cover) {
      .overview-news__image img {
        object-fit: cover; } }

.overview-news__item {
  position: relative;
  display: block; }

.overview-news__date, .overview-news__title {
  color: #FFFFFF; }

/* ----------------------------------------
    News Tile List
---------------------------------------- */
.news-list .overview-news .overview-news__item {
  width: 100%;
  height: 100%;
  max-height: 130px;
  margin-bottom: 1rem;
  padding-bottom: 1rem;
  border-bottom: 1px solid #e7e9eb;
  display: inline-flex; }

.news-list .overview-news .overview-news__content {
  padding: 40px 40px;
  width: 100%;
  position: unset; }

.news-list .overview-news .overview-news__date, .news-list .overview-news .overview-news__title {
  color: #002F87; }

.news-list .overview-news .overview-news__title {
  font-size: 1.25em; }

/* ----------------------------------------
    Calendar
---------------------------------------- */
.overview-agenda {
  box-shadow: rgba(24, 23, 22, 0.1) 0 0.25rem 2.75rem 0; }
  .overview-agenda .slick-list {
    background: #FFFFFF;
    overflow: hidden !important; }
  .overview-agenda__month {
    padding: 1rem 2.5rem 1rem 2.5rem;
    background-color: #002F87;
    font-weight: 300;
    /* responsive */ }
    @media screen and (min-width: 0) and (max-width: 639px) {
      .overview-agenda__month {
        padding: 1rem 1.5rem; } }
  .overview-agenda__items {
    padding: 0 2.5rem 1.5rem;
    background-color: #FFFFFF;
    /* responsive */ }
    @media screen and (min-width: 0) and (max-width: 639px) {
      .overview-agenda__items {
        padding: 0 1.5rem; } }
  .overview-agenda__content-nav {
    color: #FFFFFF; }
    .overview-agenda__content-nav svg {
      margin-top: -30px;
      margin-right: 5px;
      float: right; }
  .overview-agenda__result {
    width: 100%;
    padding: 1rem 0;
    border-bottom: 1px solid #edf0f2;
    background-color: #FFFFFF;
    color: #002F87;
    display: block;
    transition: padding 0.4s ease;
    /* state */ }
    .overview-agenda__result:last-of-type {
      border-bottom: 0; }
    .overview-agenda__result:hover {
      padding: 1rem 0.5rem;
      transition: padding 0.25s ease; }
  .overview-agenda__location, .overview-agenda__date, .overview-agenda__title {
    margin: 0; }
  .overview-agenda__location {
    font-family: "Nimbus", "Helvetica", sans-serif;
    font-size: 1.1875em;
    font-weight: 300;
    line-height: 1.5em; }
  .overview-agenda__title {
    margin-top: -0.25rem;
    font-size: 1.25em;
    line-height: 1.5em; }
  .overview-agenda__date {
    font-size: 1.125em;
    font-weight: 300;
    line-height: 1.5em; }

/* ----------------------------------------
    Project Tile Base
---------------------------------------- */
.project-results__item p {
  margin: 0; }

/* ----------------------------------------
    Project Tile Core
---------------------------------------- */
.project-results__item {
  width: 100%;
  margin-left: 20px;
  padding: 5px 0 5px;
  border-bottom: 1px solid #e7e9eb;
  display: inline-flex;
  justify-content: space-between;
  padding: 5px 0 5px 0; }

.project-results__title {
  font-weight: 600;
  font-size: 1em; }

.project-results__location {
  font-size: 1.0625em; }

.project-results__type {
  place-self: flex-end;
  font-size: 1.0625em; }

/* ----------------------------------------
    Vendor
---------------------------------------- */
/* Slider */
.slick-slider {
  position: relative;
  display: block;
  box-sizing: border-box;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
  -khtml-user-select: none;
  -ms-touch-action: pan-y;
  touch-action: pan-y;
  -webkit-tap-highlight-color: transparent; }

.slick-list {
  margin: 0;
  padding: 0;
  position: relative;
  display: block;
  overflow: hidden; }

.slick-list:focus {
  outline: none; }

.slick-list.dragging {
  cursor: hand; }

.slick-slider .slick-track,
.slick-slider .slick-list {
  -webkit-transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
  -o-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0); }

.slick-track {
  margin-left: auto;
  margin-right: auto;
  position: relative;
  top: 0;
  left: 0;
  display: block; }

.slick-track:before,
.slick-track:after {
  content: '';
  display: table; }

.slick-track:after {
  clear: both; }

.slick-loading .slick-track {
  visibility: hidden; }

.slick-slide {
  height: 100%;
  min-height: 1px;
  display: none;
  float: left; }

[dir='rtl'] .slick-slide {
  float: right; }

.slick-slide img {
  display: block; }

.slick-slide.slick-loading img {
  display: none; }

.slick-slide.dragging img {
  pointer-events: none; }

.slick-initialized .slick-slide {
  display: block; }

.slick-loading .slick-slide {
  visibility: hidden; }

.slick-vertical .slick-slide {
  height: auto;
  border: 1px solid transparent;
  display: block; }

.slick-arrow.slick-hidden {
  display: none; }

/* Slider */
.slick-slider {
  position: relative;
  display: block;
  box-sizing: border-box;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
  -khtml-user-select: none;
  -ms-touch-action: pan-y;
  touch-action: pan-y;
  -webkit-tap-highlight-color: transparent; }

.slick-list {
  margin: 0;
  padding: 0;
  position: relative;
  display: block;
  overflow: hidden; }

.slick-list:focus {
  outline: none; }

.slick-list.dragging {
  cursor: hand; }

.slick-slider .slick-track,
.slick-slider .slick-list {
  -webkit-transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
  -o-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0); }

.slick-track {
  margin-left: auto;
  margin-right: auto;
  position: relative;
  top: 0;
  left: 0;
  display: block; }

.slick-track:before,
.slick-track:after {
  content: '';
  display: table; }

.slick-track:after {
  clear: both; }

.slick-loading .slick-track {
  visibility: hidden; }

.slick-slide {
  height: 100%;
  min-height: 1px;
  display: none;
  float: left; }

[dir='rtl'] .slick-slide {
  float: right; }

.slick-slide img {
  display: block; }

.slick-slide.slick-loading img {
  display: none; }

.slick-slide.dragging img {
  pointer-events: none; }

.slick-initialized .slick-slide {
  display: block; }

.slick-loading .slick-slide {
  visibility: hidden; }

.slick-vertical .slick-slide {
  height: auto;
  border: 1px solid transparent;
  display: block; }

.slick-arrow.slick-hidden {
  display: none; }

/*# sourceMappingURL=app.css.map*/