@charset "UTF-8";
/**
 * Capitan SASS boilerplate v3.0.0
 *
 * Copyright brandung GmbH & Co.KG
 * http://www.brandung.de/
 *
 * Date: 2016-01-26
 * MIT License (MIT)
 */
/* ==========================================================================
   Core functions, variables and mixins
   ========================================================================== */
/**
 * Capitan functions.scss v2.0.0
 *
 * Copyright brandung GmbH & Co.KG
 * http://www.brandung.de/
 *
 * Date: 2014-09-23
 * MIT License (MIT)
 */
/* ==========================================================================
   Global functions
   ========================================================================== */
/**
 * Calculate PX to EM
 *
 * @param {number} $targetPx - pixel value without unit
 *
 */
/**
 * Built a JSON like string with all given breakpoints and their values.
 * This is necessary for the JavaScript function 'function/get-breakpoint.js'
 * and 'function/assert-breakpoint.js'
 */
/**
 * Return specific breakpoint
 */
/**
 * Return specific color
 */
/**
 * Return specific Icon
 */
/**
 * Capitan variables.scss v3.0.0
 *
 * Copyright brandung GmbH & Co.KG
 * http://www.brandung.de/
 *
 * Date: 2015-06-27
 * MIT License (MIT)
 */
/* ==========================================================================
   Base settings
   ========================================================================== */
/* base path */
/* Base sizes */
/* Body font size */
/* Font Style */
/* ==========================================================================
   Grid-System
   ========================================================================== */
/* <@breakpoints */
/* breakpoints@> */
/* ==========================================================================
   Colors
   ========================================================================== */
/* <@colors */
/* colors@> */
/* ==========================================================================
   Icons
   ========================================================================== */
/* <@icons */
/* icons@> */
/**
 * Capitan mixins.scss v2.0.1
 *
 * Copyright brandung GmbH & Co.KG
 * http://www.brandung.de/
 *
 * Date: 2014-09-23
 * MIT License (MIT)
 */
/* ==========================================================================
   Global mixins
   ========================================================================== */
/**
 * Calculate percent value to given property
 *
 * @param {string} $cssProperty - which property
 * @param {number} $targetSize - element size in pixel
 * @param {number} $contextSize - context element size in pixel
 * @param {boolean} $important - set !important property
 *
 */
/**
 * Calculate PX font size to REM
 *
 * @param {number} $size - element size in pixel
 * @param {number} $base - body font size in pixel
 *
 */
/**
 * Calculates given px value to rem value
 *
 * @param {string} $prop - css property name, e.g. font-size, line-height; Default: 'font-size'
 * @param {number} $size - size in px; Default: $body-font-size-px
 *
 */
/**
* Mixin for adding vendor prefixes to CSS attributes; useful for the following CSS attributes
*
* - border-radius
* - box-shadow
* - transition
* - transform
* - background-size
* - box-sizing
* - animate
*
* @param {string} $attribute - CSS attribute that needs vendor prefixes, e.g. border-radius or transition
* @param {string} $value - The specific CSS value, e.g. "translateX .2s ease-out"
*/
/**
* Clearfix
*/
/**
 * Webfont mixin for global use
 *
 * @param {string} $family - set the font-family value
 * @param {string} $fontWeight - set the font-weight value
 * @param {string} $fontStyle - set the font-style value
 */
/**
* Mixin for adding hover transition
*
* @param {string} $colorFX - properties for color transition
* @param {string} $hoverColor - hover color
* @param {string} $backgroundFX - properties for backgrounf transition
* @param {string} $hoverBackground - hover background color
*/
/**
 * Mixin for defining values at an specific mediaQuerie
 *
 * @param {string} $width - breakpoint from $breakpoints map
 */
/* ==========================================================================
   Reset and dependencies
   ========================================================================== */
/*! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css */
/**
 * 1. Set default font family to sans-serif.
 * 2. Prevent iOS and IE text size adjust after device orientation change,
 *    without disabling user zoom.
 */
html {
  font-family: sans-serif;
  /* 1 */
  -ms-text-size-adjust: 100%;
  /* 2 */
  -webkit-text-size-adjust: 100%;
  /* 2 */ }

/**
 * Remove default margin.
 */
body {
  margin: 0; }

/* HTML5 display definitions
   ========================================================================== */
/**
 * Correct `block` display not defined for any HTML5 element in IE 8/9.
 * Correct `block` display not defined for `details` or `summary` in IE 10/11
 * and Firefox.
 * Correct `block` display not defined for `main` in IE 11.
 */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
menu,
nav,
section,
summary {
  display: block; }

/**
 * 1. Correct `inline-block` display not defined in IE 8/9.
 * 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera.
 */
audio,
canvas,
progress,
video {
  display: inline-block;
  /* 1 */
  vertical-align: baseline;
  /* 2 */ }

/**
 * Prevent modern browsers from displaying `audio` without controls.
 * Remove excess height in iOS 5 devices.
 */
audio:not([controls]) {
  display: none;
  height: 0; }

/**
 * Address `[hidden]` styling not present in IE 8/9/10.
 * Hide the `template` element in IE 8/9/10/11, Safari, and Firefox < 22.
 */
[hidden],
template {
  display: none; }

/* Links
   ========================================================================== */
/**
 * Remove the gray background color from active links in IE 10.
 */
a {
  background-color: transparent; }

/**
 * Improve readability of focused elements when they are also in an
 * active/hover state.
 */
a:active,
a:hover {
  outline: 0; }

/* Text-level semantics
   ========================================================================== */
/**
 * Address styling not present in IE 8/9/10/11, Safari, and Chrome.
 */
abbr[title] {
  border-bottom: 1px dotted; }

/**
 * Address style set to `bolder` in Firefox 4+, Safari, and Chrome.
 */
b,
strong {
  font-weight: bold; }

/**
 * Address styling not present in Safari and Chrome.
 */
dfn {
  font-style: italic; }

/**
 * Address variable `h1` font-size and margin within `section` and `article`
 * contexts in Firefox 4+, Safari, and Chrome.
 */
h1 {
  font-size: 2em;
  margin: 0.67em 0; }

/**
 * Address styling not present in IE 8/9.
 */
mark {
  background: #ff0;
  color: #000; }

/**
 * Address inconsistent and variable font size in all browsers.
 */
small {
  font-size: 80%; }

/**
 * Prevent `sub` and `sup` affecting `line-height` in all browsers.
 */
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline; }

sup {
  top: -0.5em; }

sub {
  bottom: -0.25em; }

/* Embedded content
   ========================================================================== */
/**
 * Remove border when inside `a` element in IE 8/9/10.
 */
img {
  border: 0; }

/**
 * Correct overflow not hidden in IE 9/10/11.
 */
svg:not(:root) {
  overflow: hidden; }

/* Grouping content
   ========================================================================== */
/**
 * Address margin not present in IE 8/9 and Safari.
 */
figure {
  margin: 1em 40px; }

/**
 * Address differences between Firefox and other browsers.
 */
hr {
  box-sizing: content-box;
  height: 0; }

/**
 * Contain overflow in all browsers.
 */
pre {
  overflow: auto; }

/**
 * Address odd `em`-unit font size rendering in all browsers.
 */
code,
kbd,
pre,
samp {
  font-family: monospace, monospace;
  font-size: 1em; }

/* Forms
   ========================================================================== */
/**
 * Known limitation: by default, Chrome and Safari on OS X allow very limited
 * styling of `select`, unless a `border` property is set.
 */
/**
 * 1. Correct color not being inherited.
 *    Known issue: affects color of disabled elements.
 * 2. Correct font properties not being inherited.
 * 3. Address margins set differently in Firefox 4+, Safari, and Chrome.
 */
button,
input,
optgroup,
select,
textarea {
  color: inherit;
  /* 1 */
  font: inherit;
  /* 2 */
  margin: 0;
  /* 3 */ }

/**
 * Address `overflow` set to `hidden` in IE 8/9/10/11.
 */
button {
  overflow: visible; }

/**
 * Address inconsistent `text-transform` inheritance for `button` and `select`.
 * All other form control elements do not inherit `text-transform` values.
 * Correct `button` style inheritance in Firefox, IE 8/9/10/11, and Opera.
 * Correct `select` style inheritance in Firefox.
 */
button,
select {
  text-transform: none; }

/**
 * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`
 *    and `video` controls.
 * 2. Correct inability to style clickable `input` types in iOS.
 * 3. Improve usability and consistency of cursor style between image-type
 *    `input` and others.
 */
button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
  -webkit-appearance: button;
  /* 2 */
  cursor: pointer;
  /* 3 */ }

/**
 * Re-set default cursor for disabled elements.
 */
button[disabled],
html input[disabled] {
  background: #8a9bbb;
  cursor: default; }

/**
 * Remove inner padding and border in Firefox 4+.
 */
button::-moz-focus-inner,
input::-moz-focus-inner {
  border: 0;
  padding: 0; }

/**
 * Address Firefox 4+ setting `line-height` on `input` using `!important` in
 * the UA stylesheet.
 */
input {
  line-height: normal; }

/**
 * It's recommended that you don't attempt to style these elements.
 * Firefox's implementation doesn't respect box-sizing, padding, or width.
 *
 * 1. Address box sizing set to `content-box` in IE 8/9/10.
 * 2. Remove excess padding in IE 8/9/10.
 */
input[type="checkbox"],
input[type="radio"] {
  box-sizing: border-box;
  /* 1 */
  padding: 0;
  /* 2 */ }

/**
 * Fix the cursor style for Chrome's increment/decrement buttons. For certain
 * `font-size` values of the `input`, it causes the cursor style of the
 * decrement button to change from `default` to `text`.
 */
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
  height: auto; }

/**
 * 1. Address `appearance` set to `searchfield` in Safari and Chrome.
 * 2. Address `box-sizing` set to `border-box` in Safari and Chrome.
 */
input[type="search"] {
  -webkit-appearance: textfield;
  /* 1 */
  box-sizing: content-box;
  /* 2 */ }

/**
 * Remove inner padding and search cancel button in Safari and Chrome on OS X.
 * Safari (but not Chrome) clips the cancel button when the search input has
 * padding (and `textfield` appearance).
 */
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none; }

/**
 * Define consistent border, margin, and padding.
 */
fieldset {
  border: 1px solid #c0c0c0;
  margin: 0 2px;
  padding: 0.35em 0.625em 0.75em; }

/**
 * 1. Correct `color` not being inherited in IE 8/9/10/11.
 * 2. Remove padding so people aren't caught out if they zero out fieldsets.
 */
legend {
  border: 0;
  /* 1 */
  padding: 0;
  /* 2 */ }

/**
 * Remove default vertical scrollbar in IE 8/9/10/11.
 */
textarea {
  overflow: auto; }

/**
 * Don't inherit the `font-weight` (applied by a rule above).
 * NOTE: the default cannot safely be changed in Chrome and Safari on OS X.
 */
optgroup {
  font-weight: bold; }

/* Tables
   ========================================================================== */
/**
 * Remove most spacing between table cells.
 */
table {
  border-collapse: collapse;
  border-spacing: 0; }

td,
th {
  padding: 0; }

/*! HTML5 Boilerplate v5.2.0 | MIT License | https://html5boilerplate.com/ */
/*
 * What follows is the result of much research on cross-browser styling.
 * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
 * Kroc Camen, and the H5BP dev community and team.
 */
/* ==========================================================================
   Base styles: opinionated defaults
   ========================================================================== */
html {
  color: #222;
  font-size: 1em;
  line-height: 1.4; }

/*
 * Remove text-shadow in selection highlight:
 * https://twitter.com/miketaylr/status/12228805301
 *
 * These selection rule sets have to be separate.
 * Customize the background color to match your design.
 */
::-moz-selection {
  background: #b3d4fc;
  text-shadow: none; }

::selection {
  background: #b3d4fc;
  text-shadow: none; }

/*
 * A better looking default horizontal rule
 */
hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #ccc;
  margin: 1em 0;
  padding: 0; }

/*
 * Remove the gap between audio, canvas, iframes,
 * images, videos and the bottom of their containers:
 * https://github.com/h5bp/html5-boilerplate/issues/440
 */
audio,
canvas,
iframe,
img,
svg,
video {
  vertical-align: middle; }

/*
 * Remove default fieldset styles.
 */
fieldset {
  border: 0;
  margin: 0;
  padding: 0; }

/*
 * Allow only vertical resizing of textareas.
 */
textarea {
  resize: vertical; }

/* ==========================================================================
   Browser Upgrade Prompt
   ========================================================================== */
.browserupgrade {
  margin: 0.2em 0;
  background: #ccc;
  color: #000;
  padding: 0.2em 0; }

/* ==========================================================================
   Author's custom styles
   ========================================================================== */
/* ==========================================================================
   Helper classes
   ========================================================================== */
/*
 * Hide visually and from screen readers:
 */
.hidden {
  display: none !important; }

/*
 * Hide only visually, but have it available for screen readers:
 * http://snook.ca/archives/html_and_css/hiding-content-for-accessibility
 */
.visuallyhidden {
  border: 0;
  clip: rect(0 0 0 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px; }

/*
 * Extends the .visuallyhidden class to allow the element
 * to be focusable when navigated to via the keyboard:
 * https://www.drupal.org/node/897638
 */
.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
  clip: auto;
  height: auto;
  margin: 0;
  overflow: visible;
  position: static;
  width: auto; }

/*
 * Hide visually and from screen readers, but maintain layout
 */
.invisible {
  visibility: hidden; }

/*
 * Clearfix: contain floats
 *
 * For modern browsers
 * 1. The space content is one way to avoid an Opera bug when the
 *    `contenteditable` attribute is included anywhere else in the document.
 *    Otherwise it causes space to appear at the top and bottom of elements
 *    that receive the `clearfix` class.
 * 2. The use of `table` rather than `block` is only necessary if using
 *    `:before` to contain the top-margins of child elements.
 */
.clearfix:before,
.clearfix:after {
  content: " ";
  /* 1 */
  display: table;
  /* 2 */ }

.clearfix:after {
  clear: both; }

/* ==========================================================================
   EXAMPLE Media Queries for Responsive Design.
   These examples override the primary ('mobile first') styles.
   Modify as content requires.
   ========================================================================== */
@media only screen and (min-width: 35em) {
  /* Style adjustments for viewports that meet the condition */ }

@media print, (-webkit-min-device-pixel-ratio: 1.25), (min-resolution: 1.25dppx), (min-resolution: 120dpi) {
  /* Style adjustments for high resolution devices */ }

/* ==========================================================================
   Print styles.
   Inlined to avoid the additional HTTP request:
   http://www.phpied.com/delay-loading-your-print-css/
   ========================================================================== */
@media print {
  *,
  *:before,
  *:after {
    background: transparent !important;
    color: #000 !important;
    /* Black prints faster:
                                   http://www.sanbeiji.com/archives/953 */
    box-shadow: none !important;
    text-shadow: none !important; }
  a,
  a:visited {
    text-decoration: underline; }
  a[href]:after {
    content: " (" attr(href) ")"; }
  abbr[title]:after {
    content: " (" attr(title) ")"; }
  /*
	 * Don't show links that are fragment identifiers,
	 * or use the `javascript:` pseudo protocol
	 */
  a[href^="#"]:after,
  a[href^="javascript:"]:after {
    content: ""; }
  pre,
  blockquote {
    border: 1px solid #999;
    page-break-inside: avoid; }
  /*
	 * Printing Tables:
	 * http://css-discuss.incutio.com/wiki/Printing_Tables
	 */
  thead {
    display: table-header-group; }
  tr,
  img {
    page-break-inside: avoid; }
  img {
    max-width: 100% !important; }
  p,
  h2,
  h3 {
    orphans: 3;
    widows: 3; }
  h2,
  h3 {
    page-break-after: avoid; } }

/* ==========================================================================
   Default layout partials
   ========================================================================== */
/**
 * brandung grid.scss v1.0.0
 *
 * Copyright brandung GmbH & Co.KG
 * http://www.brandung.de/
 *
 * Date: 2014-09-23
 * MIT License (MIT)
 */
/* ==========================================================================
   Grid
   ========================================================================== */
.bra-container {
  margin-right: auto;
  margin-left: auto;
  padding-left: 10px;
  padding-right: 10px; }
  .bra-container:after {
    display: block;
    content: ".";
    clear: both;
    font-size: 0;
    line-height: 0;
    height: 0;
    overflow: hidden; }

.bra-row {
  margin-left: -10px;
  margin-right: -10px; }
  .bra-row:after {
    display: block;
    content: ".";
    clear: both;
    font-size: 0;
    line-height: 0;
    height: 0;
    overflow: hidden; }

.col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, .col-xs-2, .col-sm-2, .col-md-2, .col-lg-2, .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12 {
  position: relative;
  min-height: 1px;
  padding-left: 10px;
  padding-right: 10px; }

.col-xs-1, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9, .col-xs-10, .col-xs-11, .col-xs-12 {
  float: left; }

.col-xs-1 {
  width: 8.3333333333%; }

.col-xs-2 {
  width: 16.6666666667%; }

.col-xs-3 {
  width: 25%; }

.col-xs-4 {
  width: 33.3333333333%; }

.col-xs-5 {
  width: 41.6666666667%; }

.col-xs-6 {
  width: 50%; }

.col-xs-7 {
  width: 58.3333333333%; }

.col-xs-8 {
  width: 66.6666666667%; }

.col-xs-9 {
  width: 75%; }

.col-xs-10 {
  width: 83.3333333333%; }

.col-xs-11 {
  width: 91.6666666667%; }

.col-xs-12 {
  width: 100%; }

.col-xs-pull-0 {
  right: auto; }

.col-xs-pull-1 {
  right: 8.3333333333%; }

.col-xs-pull-2 {
  right: 16.6666666667%; }

.col-xs-pull-3 {
  right: 25%; }

.col-xs-pull-4 {
  right: 33.3333333333%; }

.col-xs-pull-5 {
  right: 41.6666666667%; }

.col-xs-pull-6 {
  right: 50%; }

.col-xs-pull-7 {
  right: 58.3333333333%; }

.col-xs-pull-8 {
  right: 66.6666666667%; }

.col-xs-pull-9 {
  right: 75%; }

.col-xs-pull-10 {
  right: 83.3333333333%; }

.col-xs-pull-11 {
  right: 91.6666666667%; }

.col-xs-pull-12 {
  right: 100%; }

.col-xs-push-0 {
  left: auto; }

.col-xs-push-1 {
  left: 8.3333333333%; }

.col-xs-push-2 {
  left: 16.6666666667%; }

.col-xs-push-3 {
  left: 25%; }

.col-xs-push-4 {
  left: 33.3333333333%; }

.col-xs-push-5 {
  left: 41.6666666667%; }

.col-xs-push-6 {
  left: 50%; }

.col-xs-push-7 {
  left: 58.3333333333%; }

.col-xs-push-8 {
  left: 66.6666666667%; }

.col-xs-push-9 {
  left: 75%; }

.col-xs-push-10 {
  left: 83.3333333333%; }

.col-xs-push-11 {
  left: 91.6666666667%; }

.col-xs-push-12 {
  left: 100%; }

.col-xs-offset-0 {
  margin-left: 0%; }

.col-xs-offset-1 {
  margin-left: 8.3333333333%; }

.col-xs-offset-2 {
  margin-left: 16.6666666667%; }

.col-xs-offset-3 {
  margin-left: 25%; }

.col-xs-offset-4 {
  margin-left: 33.3333333333%; }

.col-xs-offset-5 {
  margin-left: 41.6666666667%; }

.col-xs-offset-6 {
  margin-left: 50%; }

.col-xs-offset-7 {
  margin-left: 58.3333333333%; }

.col-xs-offset-8 {
  margin-left: 66.6666666667%; }

.col-xs-offset-9 {
  margin-left: 75%; }

.col-xs-offset-10 {
  margin-left: 83.3333333333%; }

.col-xs-offset-11 {
  margin-left: 91.6666666667%; }

.col-xs-offset-12 {
  margin-left: 100%; }

@media screen and (min-width: 480px) {
  .col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12 {
    float: left; }
  .col-sm-1 {
    width: 8.3333333333%; }
  .col-sm-2 {
    width: 16.6666666667%; }
  .col-sm-3 {
    width: 25%; }
  .col-sm-4 {
    width: 33.3333333333%; }
  .col-sm-5 {
    width: 41.6666666667%; }
  .col-sm-6 {
    width: 50%; }
  .col-sm-7 {
    width: 58.3333333333%; }
  .col-sm-8 {
    width: 66.6666666667%; }
  .col-sm-9 {
    width: 75%; }
  .col-sm-10 {
    width: 83.3333333333%; }
  .col-sm-11 {
    width: 91.6666666667%; }
  .col-sm-12 {
    width: 100%; }
  .col-sm-pull-0 {
    right: auto; }
  .col-sm-pull-1 {
    right: 8.3333333333%; }
  .col-sm-pull-2 {
    right: 16.6666666667%; }
  .col-sm-pull-3 {
    right: 25%; }
  .col-sm-pull-4 {
    right: 33.3333333333%; }
  .col-sm-pull-5 {
    right: 41.6666666667%; }
  .col-sm-pull-6 {
    right: 50%; }
  .col-sm-pull-7 {
    right: 58.3333333333%; }
  .col-sm-pull-8 {
    right: 66.6666666667%; }
  .col-sm-pull-9 {
    right: 75%; }
  .col-sm-pull-10 {
    right: 83.3333333333%; }
  .col-sm-pull-11 {
    right: 91.6666666667%; }
  .col-sm-pull-12 {
    right: 100%; }
  .col-sm-push-0 {
    left: auto; }
  .col-sm-push-1 {
    left: 8.3333333333%; }
  .col-sm-push-2 {
    left: 16.6666666667%; }
  .col-sm-push-3 {
    left: 25%; }
  .col-sm-push-4 {
    left: 33.3333333333%; }
  .col-sm-push-5 {
    left: 41.6666666667%; }
  .col-sm-push-6 {
    left: 50%; }
  .col-sm-push-7 {
    left: 58.3333333333%; }
  .col-sm-push-8 {
    left: 66.6666666667%; }
  .col-sm-push-9 {
    left: 75%; }
  .col-sm-push-10 {
    left: 83.3333333333%; }
  .col-sm-push-11 {
    left: 91.6666666667%; }
  .col-sm-push-12 {
    left: 100%; }
  .col-sm-offset-0 {
    margin-left: 0%; }
  .col-sm-offset-1 {
    margin-left: 8.3333333333%; }
  .col-sm-offset-2 {
    margin-left: 16.6666666667%; }
  .col-sm-offset-3 {
    margin-left: 25%; }
  .col-sm-offset-4 {
    margin-left: 33.3333333333%; }
  .col-sm-offset-5 {
    margin-left: 41.6666666667%; }
  .col-sm-offset-6 {
    margin-left: 50%; }
  .col-sm-offset-7 {
    margin-left: 58.3333333333%; }
  .col-sm-offset-8 {
    margin-left: 66.6666666667%; }
  .col-sm-offset-9 {
    margin-left: 75%; }
  .col-sm-offset-10 {
    margin-left: 83.3333333333%; }
  .col-sm-offset-11 {
    margin-left: 91.6666666667%; }
  .col-sm-offset-12 {
    margin-left: 100%; } }

@media screen and (min-width: 768px) {
  .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12 {
    float: left; }
  .col-md-1 {
    width: 8.3333333333%; }
  .col-md-2 {
    width: 16.6666666667%; }
  .col-md-3 {
    width: 25%; }
  .col-md-4 {
    width: 33.3333333333%; }
  .col-md-5 {
    width: 41.6666666667%; }
  .col-md-6 {
    width: 50%; }
  .col-md-7 {
    width: 58.3333333333%; }
  .col-md-8 {
    width: 66.6666666667%; }
  .col-md-9 {
    width: 75%; }
  .col-md-10 {
    width: 83.3333333333%; }
  .col-md-11 {
    width: 91.6666666667%; }
  .col-md-12 {
    width: 100%; }
  .col-md-pull-0 {
    right: auto; }
  .col-md-pull-1 {
    right: 8.3333333333%; }
  .col-md-pull-2 {
    right: 16.6666666667%; }
  .col-md-pull-3 {
    right: 25%; }
  .col-md-pull-4 {
    right: 33.3333333333%; }
  .col-md-pull-5 {
    right: 41.6666666667%; }
  .col-md-pull-6 {
    right: 50%; }
  .col-md-pull-7 {
    right: 58.3333333333%; }
  .col-md-pull-8 {
    right: 66.6666666667%; }
  .col-md-pull-9 {
    right: 75%; }
  .col-md-pull-10 {
    right: 83.3333333333%; }
  .col-md-pull-11 {
    right: 91.6666666667%; }
  .col-md-pull-12 {
    right: 100%; }
  .col-md-push-0 {
    left: auto; }
  .col-md-push-1 {
    left: 8.3333333333%; }
  .col-md-push-2 {
    left: 16.6666666667%; }
  .col-md-push-3 {
    left: 25%; }
  .col-md-push-4 {
    left: 33.3333333333%; }
  .col-md-push-5 {
    left: 41.6666666667%; }
  .col-md-push-6 {
    left: 50%; }
  .col-md-push-7 {
    left: 58.3333333333%; }
  .col-md-push-8 {
    left: 66.6666666667%; }
  .col-md-push-9 {
    left: 75%; }
  .col-md-push-10 {
    left: 83.3333333333%; }
  .col-md-push-11 {
    left: 91.6666666667%; }
  .col-md-push-12 {
    left: 100%; }
  .col-md-offset-0 {
    margin-left: 0%; }
  .col-md-offset-1 {
    margin-left: 8.3333333333%; }
  .col-md-offset-2 {
    margin-left: 16.6666666667%; }
  .col-md-offset-3 {
    margin-left: 25%; }
  .col-md-offset-4 {
    margin-left: 33.3333333333%; }
  .col-md-offset-5 {
    margin-left: 41.6666666667%; }
  .col-md-offset-6 {
    margin-left: 50%; }
  .col-md-offset-7 {
    margin-left: 58.3333333333%; }
  .col-md-offset-8 {
    margin-left: 66.6666666667%; }
  .col-md-offset-9 {
    margin-left: 75%; }
  .col-md-offset-10 {
    margin-left: 83.3333333333%; }
  .col-md-offset-11 {
    margin-left: 91.6666666667%; }
  .col-md-offset-12 {
    margin-left: 100%; } }

@media screen and (min-width: 992px) {
  .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12 {
    float: left; }
  .col-lg-1 {
    width: 8.3333333333%; }
  .col-lg-2 {
    width: 16.6666666667%; }
  .col-lg-3 {
    width: 25%; }
  .col-lg-4 {
    width: 33.3333333333%; }
  .col-lg-5 {
    width: 41.6666666667%; }
  .col-lg-6 {
    width: 50%; }
  .col-lg-7 {
    width: 58.3333333333%; }
  .col-lg-8 {
    width: 66.6666666667%; }
  .col-lg-9 {
    width: 75%; }
  .col-lg-10 {
    width: 83.3333333333%; }
  .col-lg-11 {
    width: 91.6666666667%; }
  .col-lg-12 {
    width: 100%; }
  .col-lg-pull-0 {
    right: auto; }
  .col-lg-pull-1 {
    right: 8.3333333333%; }
  .col-lg-pull-2 {
    right: 16.6666666667%; }
  .col-lg-pull-3 {
    right: 25%; }
  .col-lg-pull-4 {
    right: 33.3333333333%; }
  .col-lg-pull-5 {
    right: 41.6666666667%; }
  .col-lg-pull-6 {
    right: 50%; }
  .col-lg-pull-7 {
    right: 58.3333333333%; }
  .col-lg-pull-8 {
    right: 66.6666666667%; }
  .col-lg-pull-9 {
    right: 75%; }
  .col-lg-pull-10 {
    right: 83.3333333333%; }
  .col-lg-pull-11 {
    right: 91.6666666667%; }
  .col-lg-pull-12 {
    right: 100%; }
  .col-lg-push-0 {
    left: auto; }
  .col-lg-push-1 {
    left: 8.3333333333%; }
  .col-lg-push-2 {
    left: 16.6666666667%; }
  .col-lg-push-3 {
    left: 25%; }
  .col-lg-push-4 {
    left: 33.3333333333%; }
  .col-lg-push-5 {
    left: 41.6666666667%; }
  .col-lg-push-6 {
    left: 50%; }
  .col-lg-push-7 {
    left: 58.3333333333%; }
  .col-lg-push-8 {
    left: 66.6666666667%; }
  .col-lg-push-9 {
    left: 75%; }
  .col-lg-push-10 {
    left: 83.3333333333%; }
  .col-lg-push-11 {
    left: 91.6666666667%; }
  .col-lg-push-12 {
    left: 100%; }
  .col-lg-offset-0 {
    margin-left: 0%; }
  .col-lg-offset-1 {
    margin-left: 8.3333333333%; }
  .col-lg-offset-2 {
    margin-left: 16.6666666667%; }
  .col-lg-offset-3 {
    margin-left: 25%; }
  .col-lg-offset-4 {
    margin-left: 33.3333333333%; }
  .col-lg-offset-5 {
    margin-left: 41.6666666667%; }
  .col-lg-offset-6 {
    margin-left: 50%; }
  .col-lg-offset-7 {
    margin-left: 58.3333333333%; }
  .col-lg-offset-8 {
    margin-left: 66.6666666667%; }
  .col-lg-offset-9 {
    margin-left: 75%; }
  .col-lg-offset-10 {
    margin-left: 83.3333333333%; }
  .col-lg-offset-11 {
    margin-left: 91.6666666667%; }
  .col-lg-offset-12 {
    margin-left: 100%; } }

@media screen and (min-width: 1280px) {
  .col-xl-1, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-10, .col-xl-11, .col-xl-12 {
    float: left; }
  .col-xl-1 {
    width: 8.3333333333%; }
  .col-xl-2 {
    width: 16.6666666667%; }
  .col-xl-3 {
    width: 25%; }
  .col-xl-4 {
    width: 33.3333333333%; }
  .col-xl-5 {
    width: 41.6666666667%; }
  .col-xl-6 {
    width: 50%; }
  .col-xl-7 {
    width: 58.3333333333%; }
  .col-xl-8 {
    width: 66.6666666667%; }
  .col-xl-9 {
    width: 75%; }
  .col-xl-10 {
    width: 83.3333333333%; }
  .col-xl-11 {
    width: 91.6666666667%; }
  .col-xl-12 {
    width: 100%; }
  .col-xl-pull-0 {
    right: auto; }
  .col-xl-pull-1 {
    right: 8.3333333333%; }
  .col-xl-pull-2 {
    right: 16.6666666667%; }
  .col-xl-pull-3 {
    right: 25%; }
  .col-xl-pull-4 {
    right: 33.3333333333%; }
  .col-xl-pull-5 {
    right: 41.6666666667%; }
  .col-xl-pull-6 {
    right: 50%; }
  .col-xl-pull-7 {
    right: 58.3333333333%; }
  .col-xl-pull-8 {
    right: 66.6666666667%; }
  .col-xl-pull-9 {
    right: 75%; }
  .col-xl-pull-10 {
    right: 83.3333333333%; }
  .col-xl-pull-11 {
    right: 91.6666666667%; }
  .col-xl-pull-12 {
    right: 100%; }
  .col-xl-push-0 {
    left: auto; }
  .col-xl-push-1 {
    left: 8.3333333333%; }
  .col-xl-push-2 {
    left: 16.6666666667%; }
  .col-xl-push-3 {
    left: 25%; }
  .col-xl-push-4 {
    left: 33.3333333333%; }
  .col-xl-push-5 {
    left: 41.6666666667%; }
  .col-xl-push-6 {
    left: 50%; }
  .col-xl-push-7 {
    left: 58.3333333333%; }
  .col-xl-push-8 {
    left: 66.6666666667%; }
  .col-xl-push-9 {
    left: 75%; }
  .col-xl-push-10 {
    left: 83.3333333333%; }
  .col-xl-push-11 {
    left: 91.6666666667%; }
  .col-xl-push-12 {
    left: 100%; }
  .col-xl-offset-0 {
    margin-left: 0%; }
  .col-xl-offset-1 {
    margin-left: 8.3333333333%; }
  .col-xl-offset-2 {
    margin-left: 16.6666666667%; }
  .col-xl-offset-3 {
    margin-left: 25%; }
  .col-xl-offset-4 {
    margin-left: 33.3333333333%; }
  .col-xl-offset-5 {
    margin-left: 41.6666666667%; }
  .col-xl-offset-6 {
    margin-left: 50%; }
  .col-xl-offset-7 {
    margin-left: 58.3333333333%; }
  .col-xl-offset-8 {
    margin-left: 66.6666666667%; }
  .col-xl-offset-9 {
    margin-left: 75%; }
  .col-xl-offset-10 {
    margin-left: 83.3333333333%; }
  .col-xl-offset-11 {
    margin-left: 91.6666666667%; }
  .col-xl-offset-12 {
    margin-left: 100%; } }

/**
 * Capitan layout.scss v2.0.0
 *
 * Copyright brandung GmbH & Co.KG
 * http://www.brandung.de/
 *
 * Date: 2015-01-26
 * MIT License (MIT)
 */
/* ==========================================================================
   Global Layout
   ========================================================================== */
* {
  box-sizing: border-box; }

body {
  background: #fff;
  color: #414141;
  font-size: 100%;
  font-family: "Open Sans", Verdana, sans-serif;
  line-height: 1.4; }
  body.europa-go {
    font-size: 17px;
    font-size: 1.0625rem;
    font-family: Arial, Helvetica, Verdana, sans-serif; }

body::before {
  content: '{ "xs": 320, "sm": 480, "md": 768, "lg": 992, "xl": 1280 }';
  display: none; }

main:after {
  display: block;
  content: ".";
  clear: both;
  font-size: 0;
  line-height: 0;
  height: 0;
  overflow: hidden; }

/* ==========================================================================
   Grid overrides
   ========================================================================== */
.bra-container {
  min-width: 20em;
  max-width: 80em; }
  @media screen and (min-width: 48em) {
    .bra-container {
      padding: 0 20px; } }

/**
 * Container to enable full width sections, to use
 * in combination `.bra-container` as inner elements.
 */
.bra-container-fullwidth {
  display: block;
  width: 100%;
  padding: 40px 0; }

/**
 * Modifier(s) for container `.bra-container-fullwidth`
 */
.bra-container-fullwidth--shadow {
  box-shadow: inset 0 10px 30px -10px rgba(0, 0, 0, 0.075), inset 0 -10px 30px -10px rgba(0, 0, 0, 0.075); }

.bra-container-fullwidth--pale {
  background-color: #f7f7f7; }

.bra-container-fullwidth--ci {
  background-color: #002a54; }

/* ==========================================================================
  Content Elements
  ========================================================================== */
img {
  height: auto;
  outline: 0;
  max-width: 100%; }

hr {
  margin: 20px 0; }
  hr:after {
    display: block;
    content: ".";
    clear: both;
    font-size: 0;
    line-height: 0;
    height: 0;
    overflow: hidden; }

/**
 * Capitan typo.scss v1.0.0
 *
 * Copyright brandung GmbH & Co.KG
 * http://www.brandung.de/
 *
 * Date: 2014-03-14
 * MIT License (MIT)
 */
/* ==========================================================================
   Webfonts
   ========================================================================== */
h1,
h2.headline--big,
h3.headline--big,
h4.headline--big,
.headline--big, h2,
h1.headline,
h3.headline,
h4.headline,
.headline, h3,
h4,
h5,
h6,
h1.headline--small,
h2.headline--small,
.headline--small {
  font-family: "Open Sans", Verdana, sans-serif;
  font-weight: normal;
  font-style: normal;
  speak: none;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-weight: 700; }

.util-badscript {
  font-family: "Bad Script", cursive;
  font-weight: normal;
  font-style: normal;
  speak: none;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale; }

.europa-go .btn {
  font-family: "PT Sans", Verdana, sans-serif;
  font-weight: normal;
  font-style: normal;
  speak: none;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-weight: 400; }

.europa-go h1, .europa-go h2.headline--big, .europa-go h3.headline--big, .europa-go h4.headline--big, .europa-go .headline--big, .europa-go h2, .europa-go h1.headline, .europa-go h3.headline, .europa-go h4.headline, .europa-go .headline, .europa-go h3, .europa-go h4, .europa-go h5, .europa-go h6, .europa-go h1.headline--small, .europa-go h2.headline--small, .europa-go .headline--small {
  font-family: "PT Sans", Verdana, sans-serif;
  font-weight: normal;
  font-style: normal;
  speak: none;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-weight: 700; }

h1,
h2.headline--big,
h3.headline--big,
h4.headline--big,
.headline--big {
  font-size: 25px;
  font-size: 1.5625rem;
  color: #002a54;
  margin: 0 0 20px 0; }
  @media screen and (min-width: 30em) {
    h1,
    h2.headline--big,
    h3.headline--big,
    h4.headline--big,
    .headline--big {
      font-size: 1.875rem; } }

h2,
h1.headline,
h3.headline,
h4.headline,
.headline {
  font-size: 18px;
  font-size: 1.125rem;
  color: #002a54;
  margin: 0 0 15px 0; }
  @media screen and (min-width: 30em) {
    h2,
    h1.headline,
    h3.headline,
    h4.headline,
    .headline {
      font-size: 1.5rem; } }

h3,
h4,
h5,
h6,
h1.headline--small,
h2.headline--small,
.headline--small {
  font-size: 16px;
  font-size: 1rem;
  color: #002a54;
  margin: 0 0 10px 0; }
  @media screen and (min-width: 30em) {
    h3,
    h4,
    h5,
    h6,
    h1.headline--small,
    h2.headline--small,
    .headline--small {
      font-size: 1.25rem; } }

h1,
.util-h1,
h2,
.util-h2,
h3,
.util-h3,
h4,
.util-h4 {
  color: #002a54; }

.bg-headline {
  padding: 10px 20px;
  margin: 0;
  background: #8a9bbb; }

p {
  font-size: 14px;
  font-size: 0.875rem;
  margin: 0 0 20px 0; }
  @media screen and (min-width: 30em) {
    p {
      font-size: 1rem; } }
  .europa-go p {
    font-size: 14px;
    font-size: 0.875rem; }
    @media screen and (min-width: 30em) {
      .europa-go p {
        font-size: 1.0625rem; } }

ol,
ul {
  padding: 0 0 0 20px; }

li {
  font-size: 16px;
  font-size: 1rem; }
  .europa-go li {
    font-size: 14px;
    font-size: 0.875rem; }
    @media screen and (min-width: 30em) {
      .europa-go li {
        font-size: 1.0625rem; } }

a {
  text-decoration: underline;
  color: #414141; }
  a:hover, a:active, a:focus {
    text-decoration: none; }

a:focus {
	outline: 3px solid #b9d8f9;
}
.link--icon {
  position: relative;
  display: block; }
  .link--icon[class^="util-icon--"]:before, .link--icon[class*=" util-icon--"]:before {
    position: absolute;
    left: -20px;
    top: 4px; }

/**
 * Capitan icon-font.scss v1.0.0
 *
 * Copyright brandung GmbH & Co.KG
 * http://www.brandung.de/
 *
 * Date: 2016-04-05
 * MIT License (MIT)
 */
/* ==========================================================================
   Icon Font settings
   ========================================================================== */
@font-face {
  font-family: 'iconfont';
  src: url("../fonts/iconfont/icomoon.eot");
  src: url("../fonts/iconfont/icomoon.eot") format("embedded-opentype"), url("../fonts/iconfont/icomoon.woff2") format("woff2"), url("../fonts/iconfont/icomoon.ttf") format("truetype"), url("../fonts/iconfont/icomoon.woff") format("woff"), url("../fonts/iconfont/icomoon.svg") format("svg");
  font-weight: normal;
  font-style: normal; }

.util-icon--before:before,
.util-icon--absolute-before:before,
.util-icon--after:after,
.util-icon--absolute-after:after, .util-icon--only:before {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'iconfont' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale; }

.util-icon--before:before,
.util-icon--absolute-before:before,
.util-icon--after:after,
.util-icon--absolute-after:after {
  vertical-align: text-bottom; }

span.util-icon--before:before, span.util-icon--absolute-before:before, span.util-icon--after:after, span.util-icon--absolute-after:after {
  font-size: 20px;
  font-size: 1.25rem; }

.util-icon--only {
  font-size: 0px;
  font-size: 0rem; }
  .util-icon--only:before {
    font-size: 16px;
    font-size: 1rem; }
  .util-icon--only:after {
    display: none !important; }

.util-icon--absolute-before:before,
.util-icon--absolute-after:after {
  position: absolute; }

.util-icon--absolute-before:before {
  left: 0; }

.util-icon--absolute-after:after {
  right: 0; }

.util-icon--before.util-icon--eye:before,
.util-icon--absolute-before.util-icon--eye:before,
.util-icon--after.util-icon--eye:after,
.util-icon--absolute-after.util-icon--eye:after,
.util-icon--only.util-icon--eye:before {
  content: "";
  vertical-align: middle; }

.util-icon--before.util-icon--calendar:before,
.util-icon--absolute-before.util-icon--calendar:before,
.util-icon--after.util-icon--calendar:after,
.util-icon--absolute-after.util-icon--calendar:after,
.util-icon--only.util-icon--calendar:before {
  content: "";
  vertical-align: middle; }

.util-icon--before.util-icon--check:before,
.util-icon--absolute-before.util-icon--check:before,
.util-icon--after.util-icon--check:after,
.util-icon--absolute-after.util-icon--check:after,
.util-icon--only.util-icon--check:before {
  content: "";
  vertical-align: middle; }

.util-icon--before.util-icon--close:before,
.util-icon--absolute-before.util-icon--close:before,
.util-icon--after.util-icon--close:after,
.util-icon--absolute-after.util-icon--close:after,
.util-icon--only.util-icon--close:before {
  content: "";
  vertical-align: middle; }

.util-icon--before.util-icon--mail:before,
.util-icon--absolute-before.util-icon--mail:before,
.util-icon--after.util-icon--mail:after,
.util-icon--absolute-after.util-icon--mail:after,
.util-icon--only.util-icon--mail:before {
  content: "";
  vertical-align: middle; }

.util-icon--before.util-icon--person:before,
.util-icon--absolute-before.util-icon--person:before,
.util-icon--after.util-icon--person:after,
.util-icon--absolute-after.util-icon--person:after,
.util-icon--only.util-icon--person:before {
  content: "";
  vertical-align: middle; }

.util-icon--before.util-icon--question:before,
.util-icon--absolute-before.util-icon--question:before,
.util-icon--after.util-icon--question:after,
.util-icon--absolute-after.util-icon--question:after,
.util-icon--only.util-icon--question:before {
  content: "";
  vertical-align: middle; }

.util-icon--before.util-icon--download:before,
.util-icon--absolute-before.util-icon--download:before,
.util-icon--after.util-icon--download:after,
.util-icon--absolute-after.util-icon--download:after,
.util-icon--only.util-icon--download:before {
  content: "";
  vertical-align: middle; }

.util-icon--before.util-icon--arrow-down:before,
.util-icon--absolute-before.util-icon--arrow-down:before,
.util-icon--after.util-icon--arrow-down:after,
.util-icon--absolute-after.util-icon--arrow-down:after,
.util-icon--only.util-icon--arrow-down:before {
  content: "";
  vertical-align: middle; }

.util-icon--before.util-icon--arrow-up:before,
.util-icon--absolute-before.util-icon--arrow-up:before,
.util-icon--after.util-icon--arrow-up:after,
.util-icon--absolute-after.util-icon--arrow-up:after,
.util-icon--only.util-icon--arrow-up:before {
  content: "";
  vertical-align: middle; }

.util-icon--before.util-icon--arrow-left:before,
.util-icon--absolute-before.util-icon--arrow-left:before,
.util-icon--after.util-icon--arrow-left:after,
.util-icon--absolute-after.util-icon--arrow-left:after,
.util-icon--only.util-icon--arrow-left:before {
  content: "";
  vertical-align: middle; }

.util-icon--before.util-icon--arrow-right:before,
.util-icon--absolute-before.util-icon--arrow-right:before,
.util-icon--after.util-icon--arrow-right:after,
.util-icon--absolute-after.util-icon--arrow-right:after,
.util-icon--only.util-icon--arrow-right:before {
  content: "";
  vertical-align: middle; }

.util-icon--before.util-icon--car:before,
.util-icon--absolute-before.util-icon--car:before,
.util-icon--after.util-icon--car:after,
.util-icon--absolute-after.util-icon--car:after,
.util-icon--only.util-icon--car:before {
  content: "";
  vertical-align: middle; }

.util-icon--before.util-icon--headphone:before,
.util-icon--absolute-before.util-icon--headphone:before,
.util-icon--after.util-icon--headphone:after,
.util-icon--absolute-after.util-icon--headphone:after,
.util-icon--only.util-icon--headphone:before {
  content: "";
  vertical-align: middle; }

.util-icon--before.util-icon--info:before,
.util-icon--absolute-before.util-icon--info:before,
.util-icon--after.util-icon--info:after,
.util-icon--absolute-after.util-icon--info:after,
.util-icon--only.util-icon--info:before {
  content: "";
  vertical-align: middle; }

.util-icon--before.util-icon--list:before,
.util-icon--absolute-before.util-icon--list:before,
.util-icon--after.util-icon--list:after,
.util-icon--absolute-after.util-icon--list:after,
.util-icon--only.util-icon--list:before {
  content: "";
  vertical-align: middle; }

.util-icon--before.util-icon--logout:before,
.util-icon--absolute-before.util-icon--logout:before,
.util-icon--after.util-icon--logout:after,
.util-icon--absolute-after.util-icon--logout:after,
.util-icon--only.util-icon--logout:before {
  content: "";
  vertical-align: middle; }

.util-icon--before.util-icon--motocycle:before,
.util-icon--absolute-before.util-icon--motocycle:before,
.util-icon--after.util-icon--motocycle:after,
.util-icon--absolute-after.util-icon--motocycle:after,
.util-icon--only.util-icon--motocycle:before {
  content: "";
  vertical-align: middle; }

.util-icon--before.util-icon--warning:before,
.util-icon--absolute-before.util-icon--warning:before,
.util-icon--after.util-icon--warning:after,
.util-icon--absolute-after.util-icon--warning:after,
.util-icon--only.util-icon--warning:before {
  content: "";
  vertical-align: middle; }

.util-icon--before.util-icon--zoom:before,
.util-icon--absolute-before.util-icon--zoom:before,
.util-icon--after.util-icon--zoom:after,
.util-icon--absolute-after.util-icon--zoom:after,
.util-icon--only.util-icon--zoom:before {
  content: "";
  vertical-align: middle; }

.util-icon--before.util-icon--double-arrow-left:before,
.util-icon--absolute-before.util-icon--double-arrow-left:before,
.util-icon--after.util-icon--double-arrow-left:after,
.util-icon--absolute-after.util-icon--double-arrow-left:after,
.util-icon--only.util-icon--double-arrow-left:before {
  content: "";
  vertical-align: middle; }

.util-icon--before.util-icon--double-arrow-right:before,
.util-icon--absolute-before.util-icon--double-arrow-right:before,
.util-icon--after.util-icon--double-arrow-right:after,
.util-icon--absolute-after.util-icon--double-arrow-right:after,
.util-icon--only.util-icon--double-arrow-right:before {
  content: "";
  vertical-align: middle; }

.util-icon--before.util-icon--calculator:before,
.util-icon--absolute-before.util-icon--calculator:before,
.util-icon--after.util-icon--calculator:after,
.util-icon--absolute-after.util-icon--calculator:after,
.util-icon--only.util-icon--calculator:before {
  content: "";
  vertical-align: middle; }

.util-icon--before.util-icon--locked:before,
.util-icon--absolute-before.util-icon--locked:before,
.util-icon--after.util-icon--locked:after,
.util-icon--absolute-after.util-icon--locked:after,
.util-icon--only.util-icon--locked:before {
  content: "";
  vertical-align: middle; }

.util-icon--before.util-icon--justice:before,
.util-icon--absolute-before.util-icon--justice:before,
.util-icon--after.util-icon--justice:after,
.util-icon--absolute-after.util-icon--justice:after,
.util-icon--only.util-icon--justice:before {
  content: "";
  vertical-align: middle; }

.util-icon--before.util-icon--writing:before,
.util-icon--absolute-before.util-icon--writing:before,
.util-icon--after.util-icon--writing:after,
.util-icon--absolute-after.util-icon--writing:after,
.util-icon--only.util-icon--writing:before {
  content: "";
  vertical-align: middle; }

.util-icon--before.util-icon--megaphone:before,
.util-icon--absolute-before.util-icon--megaphone:before,
.util-icon--after.util-icon--megaphone:after,
.util-icon--absolute-after.util-icon--megaphone:after,
.util-icon--only.util-icon--megaphone:before {
  content: "";
  vertical-align: middle; }

.util-icon--before.util-icon--crash:before,
.util-icon--absolute-before.util-icon--crash:before,
.util-icon--after.util-icon--crash:after,
.util-icon--absolute-after.util-icon--crash:after,
.util-icon--only.util-icon--crash:before {
  content: "";
  vertical-align: middle; }

.util-icon--before.util-icon--bank:before,
.util-icon--absolute-before.util-icon--bank:before,
.util-icon--after.util-icon--bank:after,
.util-icon--absolute-after.util-icon--bank:after,
.util-icon--only.util-icon--bank:before {
  content: "";
  vertical-align: middle; }

/**
 * Modifier (Sizes)
 */
.util-icon--tiny.util-icon--before:before, .util-icon--tiny.util-icon--absolute-before:before, .util-icon--tiny.util-icon--after:after, .util-icon--tiny.util-icon--absolute-after:after {
  font-size: 16px;
  font-size: 1rem; }

.util-icon--small.util-icon--before:before, .util-icon--small.util-icon--absolute-before:before, .util-icon--small.util-icon--after:after, .util-icon--small.util-icon--absolute-after:after {
  font-size: 20px;
  font-size: 1.25rem; }

.util-icon--large.util-icon--before:before, .util-icon--large.util-icon--absolute-before:before, .util-icon--large.util-icon--after:after, .util-icon--large.util-icon--absolute-after:after {
  font-size: 48px;
  font-size: 3rem; }

.util-icon--huge.util-icon--before:before, .util-icon--huge.util-icon--absolute-before:before, .util-icon--huge.util-icon--after:after, .util-icon--huge.util-icon--absolute-after:after {
  font-size: 72px;
  font-size: 4.5rem; }

/* ==========================================================================
   Components
   ========================================================================== */
/**
 * Capitan header.scss v1.0.0
 *
 * Copyright brandung GmbH & Co.KG
 * http://www.brandung.de/
 *
 * Date: 2014-09-23
 * MIT License (MIT)
 */
/* ==========================================================================
   Header
   ========================================================================== */
/**
 * Block: Base Component
 *
 * `.header`
 */
.header {
  width: 100%;
  z-index: 1111;
  box-shadow: 0 2px 10px 0 rgba(178, 189, 198, 0.5);
  background: #fff; }
  @media screen and (max-width: 61.9375em) {
    .header {
      padding: 0; } }
  .header + *:nth-of-type(1) {
    margin-top: 76px; }
    @media screen and (min-width: 62em) {
      .header + *:nth-of-type(1) {
        margin-top: 126px; } }
  @media print {
    .header {
      position: static !important; }
      .header + *:nth-of-type(1) {
        margin-top: 0; } }

/**
 * Elements: Generic
 *
 * Elements which fits in every context or/and
 * are implied to ensure the components functionality.
 *
 * @see header.tpl for possible markup
 */
@media screen and (max-width: 61.9375em) {
  .header__logo {
    width: 100%;
    margin: 0;
    padding: 0 10px;
    position: relative;
    z-index: 3;
    background-color: #fff; } }

.header__logo a {
  display: block;
  width: 185px;
  height: 65px;
  text-indent: -999em;
  background: url("../img/europa-kundenportal-logo.png") no-repeat 0 0;
  background-size: cover;
  transition: all 0.4s ease; }
  @media screen and (min-width: 62em) {
    .header__logo a {
      background-size: 100%; } }
  @media print {
    .header__logo a[href]:after {
      display: none !important; } }
  .europa-go .header__logo a {
    width: 185px;
    height: 56px;
    background: url("../img/europa-go-logo.png") no-repeat 0 5px;
    background-size: contain;
    padding: 5px 0; }

.header__navigation {
  transition: all 0.4s ease; }
  @media screen and (max-width: 61.9375em) {
    .header__navigation .bra-container {
      padding: 0; } }

/**
 * Elements: Modifications on context
 *
 */
.header .bra-row {
  margin-bottom: 0; }
  @media screen and (min-width: 62em) {
    .header .bra-row {
      display: -ms-flexbox;
      display: flex;
      -ms-flex-align: center;
          align-items: center; } }

@media screen and (max-width: 61.9375em) {
  .header .bra-row [class^="col-"] {
    min-height: 0;
    background-color: #fff; } }

/**
 * Capitan navigation.scss v1.0.0
 *
 * Copyright brandung GmbH & Co.KG
 * http://www.brandung.de/
 *
 * Date: 2014-09-23
 * MIT License (MIT)
 */
/* ==========================================================================
   Navigation
   ========================================================================== */
nav:after {
  display: block;
  content: ".";
  clear: both;
  font-size: 0;
  line-height: 0;
  height: 0;
  overflow: hidden; }

@media print {
  nav {
    display: none; } }

.main-nav {
  background: #002a54; }
  .main-nav:after {
    display: block;
    content: ".";
    clear: both;
    font-size: 0;
    line-height: 0;
    height: 0;
    overflow: hidden; }
  @media screen and (max-width: 61.9375em) {
    .main-nav {
      transform: translate3d(0, -100%, 0);
      transition: all 500ms ease;
      clear: both;
      left: 0;
      overflow: auto;
      overflow-x: hidden;
      padding: 0;
      position: absolute;
      width: 100%;
      z-index: 1;
      /* component overwrite */ }
      .ie9 .main-nav {
        top: -100%; } }

.main-nav__list {
  position: relative;
  list-style: none;
  padding: 20px 0;
  margin: 0 20px; }
  .main-nav__list:after {
    display: block;
    content: ".";
    clear: both;
    font-size: 0;
    line-height: 0;
    height: 0;
    overflow: hidden; }
  @media screen and (min-width: 62em) {
    .main-nav__list {
      height: auto !important;
      margin: 0;
      padding: 0; } }

.main-nav__list-item {
  border-bottom: 1px solid #fff;
  display: block;
  position: relative; }
  @media screen and (min-width: 62em) {
    .main-nav__list-item {
      transition: color 0.2s linear, background 0.2s linear;
      display: inline-block;
      border: none; } }
  .main-nav__list-item.meta-navigation__list-item {
    border-bottom: none; }
  @media screen and (min-width: 62em) {
    .main-nav__list-item.is-active .main-nav__link {
      color: #fff;
      border-bottom: 3px solid #fff;
      outline: none; } }

.main-nav__link {
  font-size: 15px;
  font-size: 0.9375rem;
  display: block;
  padding: 10px 0;
  color: #fff;
  text-decoration: none;
  border-bottom: 3px solid transparent; }
  @media screen and (min-width: 62em) {
    .main-nav__link {
      font-size: 1rem;
      margin-right: 36px; } }
  @media screen and (min-width: 80em) {
    .main-nav__link {
      margin-right: 40px; } }
  @media screen and (min-width: 62em) {
    .main-nav__link:hover, .main-nav__link:active, .main-nav__link:focus {
      color: #fff;
      border-bottom: 3px solid #fff;
      outline: none; } }
  .main-nav__link[class^="util-icon--"]:after, .main-nav__link[class*=" util-icon--"]:after {
    font-size: 12px;
    font-size: 0.75rem;
    padding-left: 10px;
    position: absolute;
    top: 16px; }
    @media screen and (min-width: 62em) {
      .main-nav__link[class^="util-icon--"]:after, .main-nav__link[class*=" util-icon--"]:after {
        display: none; } }
  .main-nav__link[class^="util-icon--"].is-active:after, .main-nav__link[class*=" util-icon--"].is-active:after {
    transform: rotate(90deg);
    position: absolute;
    padding-left: 17px;
    top: 7px; }

.main-nav__loggedin-user {
  font-size: 14px;
  font-size: 0.875rem;
  display: none;
  margin: 0;
  color: #fff;
  text-align: right; }
  @media screen and (min-width: 62em) {
    .main-nav__loggedin-user {
      display: block; } }
  .main-nav__loggedin-user a {
    color: #fff; }

/**********************
* FLYOUT FOR MAIN NAV *
**********************/
.main-nav__flyout {
  background: #fff;
  padding: 10px;
  border-radius: 0;
  box-shadow: 0 0 16px 3px rgba(0, 0, 0, 0.41);
  position: relative;
  top: 0;
  min-width: 100%;
  z-index: 111;
  margin-bottom: 15px;
  display: none; }
  @media screen and (min-width: 62em) {
    .main-nav__flyout {
      min-width: 300px;
      margin-bottom: 0;
      top: 50px;
      border-radius: 10px;
      position: absolute; } }
  .main-nav__flyout--arrow-top:before {
    position: absolute;
    z-index: 2;
    top: -10px;
    left: 2%;
    transform: translateX(-2%);
    content: '';
    width: 0;
    height: 0;
    border-left: 20px solid transparent;
    border-right: 20px solid transparent;
    border-bottom: 20px solid #fff; }
    @media screen and (min-width: 62em) {
      .main-nav__flyout--arrow-top:before {
        top: -15px;
        left: 10%;
        transform: translateX(-10%); } }
  .main-nav__flyout .flyout__list-item {
    font-size: 14px;
    font-size: 0.875rem;
    border-bottom: 1px solid #b2bdc6; }
    @media screen and (min-width: 62em) {
      .main-nav__flyout .flyout__list-item {
        font-size: 1rem; } }
    .main-nav__flyout .flyout__list-item:last-child {
      border-bottom: none; }
  .main-nav__flyout .flyout__link {
    display: block;
    text-decoration: none;
    color: #002a54;
    padding: 7px 10px;
    font-weight: 400;
    transition: 0.1s all ease-in-out; }
    .main-nav__flyout .flyout__link:hover {
      font-weight: 700; }
    @media screen and (min-width: 62em) {
      .main-nav__flyout .flyout__link {
        padding: 14px 10px; } }
  .main-nav__flyout .clone {
    display: none; }

/* mobile hamburger menu */
.nav-anchors {
  display: none; }
  @media screen and (max-width: 61.9375em) {
    .nav-anchors {
      display: block; }
      .nav-anchors__trigger {
        position: absolute;
        display: block;
        width: 65px;
        height: 65px;
        z-index: 4;
        top: 0;
        right: 0;
        font-size: 0;
        background-color: #002a54; }
        .nav-anchors__trigger span {
          display: block;
          position: absolute;
          top: 24px;
          left: 11px;
          right: 0;
          height: 5px;
          width: 65%;
          background: #fff;
          text-indent: -9999em; }
          .nav-anchors__trigger span:before {
            top: -12px;
            transition-property: top, transform; }
          .nav-anchors__trigger span:after {
            bottom: -12px;
            transition-property: bottom, transform; }
          .nav-anchors__trigger span:before, .nav-anchors__trigger span:after {
            transition-duration: 0.2s, 0.2s;
            transition-delay: 0.2s, 0s;
            position: absolute;
            display: block;
            left: 0;
            width: 100%;
            height: 5px;
            background-color: #fff;
            content: ''; }
        .nav-anchors__trigger .nav-anchors__caption {
          font-size: 0.75rem;
          color: #fff;
          bottom: 3px;
          margin: 0;
          left: 16px;
          text-indent: 0;
          position: absolute; }
        .nav-anchors__trigger.is-open span {
          background: none; }
          .nav-anchors__trigger.is-open span:before, .nav-anchors__trigger.is-open span:after {
            transition-delay: 0s, 0.2s; }
          .nav-anchors__trigger.is-open span:before {
            transform: rotate(45deg);
            top: 0; }
          .nav-anchors__trigger.is-open span:after {
            transform: rotate(-45deg);
            bottom: 0; } }

/* overlay layer on active menu */
.overlay-background {
  position: fixed;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.4);
  top: 0;
  bottom: 0;
  display: none;
  z-index: 900; }
  @media screen and (min-width: 62em) {
    .overlay-background {
      background: none; } }

@media screen and (max-width: 61.9375em) {
  #open-nav:target,
  .open-nav {
    overflow: hidden; }
    #open-nav:target .main-nav,
    .open-nav .main-nav {
      transform: translate3d(0, 0, 0);
      /* component overwrite */ }
      .ie9 #open-nav:target .main-nav, .ie9
      .open-nav .main-nav {
        transform: translate(0, 0); }
    #open-nav:target .nav-anchors__open,
    .open-nav .nav-anchors__open {
      display: none; }
    #open-nav:target .nav-anchors__close,
    .open-nav .nav-anchors__close {
      display: inline-block !important; } }

/**
 * Capitan meta-navigation.scss v1.0.0
 *
 * Copyright brandung GmbH & Co.KG
 * http://www.brandung.de/
 *
 * Date: 2016-11-22
 * MIT License (MIT)
 */
/**
 * Capitan functions.scss v2.0.0
 *
 * Copyright brandung GmbH & Co.KG
 * http://www.brandung.de/
 *
 * Date: 2014-09-23
 * MIT License (MIT)
 */
/* ==========================================================================
   Global functions
   ========================================================================== */
/**
 * Calculate PX to EM
 *
 * @param {number} $targetPx - pixel value without unit
 *
 */
/**
 * Built a JSON like string with all given breakpoints and their values.
 * This is necessary for the JavaScript function 'function/get-breakpoint.js'
 * and 'function/assert-breakpoint.js'
 */
/**
 * Return specific breakpoint
 */
/**
 * Return specific color
 */
/**
 * Return specific Icon
 */
/**
 * Capitan variables.scss v3.0.0
 *
 * Copyright brandung GmbH & Co.KG
 * http://www.brandung.de/
 *
 * Date: 2015-06-27
 * MIT License (MIT)
 */
/* ==========================================================================
   Base settings
   ========================================================================== */
/* base path */
/* Base sizes */
/* Body font size */
/* Font Style */
/* ==========================================================================
   Grid-System
   ========================================================================== */
/* <@breakpoints */
/* breakpoints@> */
/* ==========================================================================
   Colors
   ========================================================================== */
/* <@colors */
/* colors@> */
/* ==========================================================================
   Icons
   ========================================================================== */
/* <@icons */
/* icons@> */
/**
 * Capitan mixins.scss v2.0.1
 *
 * Copyright brandung GmbH & Co.KG
 * http://www.brandung.de/
 *
 * Date: 2014-09-23
 * MIT License (MIT)
 */
/* ==========================================================================
   Global mixins
   ========================================================================== */
/**
 * Calculate percent value to given property
 *
 * @param {string} $cssProperty - which property
 * @param {number} $targetSize - element size in pixel
 * @param {number} $contextSize - context element size in pixel
 * @param {boolean} $important - set !important property
 *
 */
/**
 * Calculate PX font size to REM
 *
 * @param {number} $size - element size in pixel
 * @param {number} $base - body font size in pixel
 *
 */
/**
 * Calculates given px value to rem value
 *
 * @param {string} $prop - css property name, e.g. font-size, line-height; Default: 'font-size'
 * @param {number} $size - size in px; Default: $body-font-size-px
 *
 */
/**
* Mixin for adding vendor prefixes to CSS attributes; useful for the following CSS attributes
*
* - border-radius
* - box-shadow
* - transition
* - transform
* - background-size
* - box-sizing
* - animate
*
* @param {string} $attribute - CSS attribute that needs vendor prefixes, e.g. border-radius or transition
* @param {string} $value - The specific CSS value, e.g. "translateX .2s ease-out"
*/
/**
* Clearfix
*/
/**
 * Webfont mixin for global use
 *
 * @param {string} $family - set the font-family value
 * @param {string} $fontWeight - set the font-weight value
 * @param {string} $fontStyle - set the font-style value
 */
/**
* Mixin for adding hover transition
*
* @param {string} $colorFX - properties for color transition
* @param {string} $hoverColor - hover color
* @param {string} $backgroundFX - properties for backgrounf transition
* @param {string} $hoverBackground - hover background color
*/
/**
 * Mixin for defining values at an specific mediaQuerie
 *
 * @param {string} $width - breakpoint from $breakpoints map
 */
/**
 * Block: Base Component
 *
 * `.meta-navigation`
 */
.meta-navigation {
  display: none;
  text-align: right; }
  @media screen and (min-width: 62em) {
    .meta-navigation {
      display: block; } }
  @media print {
    .meta-navigation {
      display: none; } }

.meta-navigation__list-item {
  display: inline-block;
  margin-left: 20px; }

.meta-navigation__link {
  font-size: 14px;
  font-size: 0.875rem;
  position: relative;
  display: block;
  text-decoration: none;
  border-bottom: 1px solid transparent;
  padding-bottom: 2px; }
  @media screen and (min-width: 62em) {
    .meta-navigation__link {
      margin-left: 25px; } }
  .meta-navigation__link:before {
    font-size: 26px;
    font-size: 1.625rem;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: -25px;
    padding: 0;
    color: #e63995; }
    @media screen and (min-width: 62em) {
      .meta-navigation__link:before {
        font-size: 1.375rem; } }
    .europa-go .meta-navigation__link:before {
      color: #f39200; }
  @media screen and (min-width: 62em) {
    .meta-navigation__link:hover, .meta-navigation__link:active, .meta-navigation__link:focus {
      border-bottom: 1px solid;
      outline: none; } }

.clone {
  border-bottom: 0;
  margin: 40px 0 0 0;
  width: 100%; }
  .clone + .clone {
    margin: 10px 0 0 0; }
  .clone .meta-navigation__link {
    padding: 10px 10px 10px 40px;
    border-radius: 4px;
    color: #414141;
    background-color: #fff; }
    .clone .meta-navigation__link:before {
      left: 10px; }

/**
 * Capitan breadcrumb.scss v1.0.0
 *
 * Copyright brandung GmbH & Co.KG
 * http://www.brandung.de/
 *
 * Date: 2016-11-10
 * MIT License (MIT)
 */
/**
 * Capitan functions.scss v2.0.0
 *
 * Copyright brandung GmbH & Co.KG
 * http://www.brandung.de/
 *
 * Date: 2014-09-23
 * MIT License (MIT)
 */
/* ==========================================================================
   Global functions
   ========================================================================== */
/**
 * Calculate PX to EM
 *
 * @param {number} $targetPx - pixel value without unit
 *
 */
/**
 * Built a JSON like string with all given breakpoints and their values.
 * This is necessary for the JavaScript function 'function/get-breakpoint.js'
 * and 'function/assert-breakpoint.js'
 */
/**
 * Return specific breakpoint
 */
/**
 * Return specific color
 */
/**
 * Return specific Icon
 */
/**
 * Capitan variables.scss v3.0.0
 *
 * Copyright brandung GmbH & Co.KG
 * http://www.brandung.de/
 *
 * Date: 2015-06-27
 * MIT License (MIT)
 */
/* ==========================================================================
   Base settings
   ========================================================================== */
/* base path */
/* Base sizes */
/* Body font size */
/* Font Style */
/* ==========================================================================
   Grid-System
   ========================================================================== */
/* <@breakpoints */
/* breakpoints@> */
/* ==========================================================================
   Colors
   ========================================================================== */
/* <@colors */
/* colors@> */
/* ==========================================================================
   Icons
   ========================================================================== */
/* <@icons */
/* icons@> */
/**
 * Capitan mixins.scss v2.0.1
 *
 * Copyright brandung GmbH & Co.KG
 * http://www.brandung.de/
 *
 * Date: 2014-09-23
 * MIT License (MIT)
 */
/* ==========================================================================
   Global mixins
   ========================================================================== */
/**
 * Calculate percent value to given property
 *
 * @param {string} $cssProperty - which property
 * @param {number} $targetSize - element size in pixel
 * @param {number} $contextSize - context element size in pixel
 * @param {boolean} $important - set !important property
 *
 */
/**
 * Calculate PX font size to REM
 *
 * @param {number} $size - element size in pixel
 * @param {number} $base - body font size in pixel
 *
 */
/**
 * Calculates given px value to rem value
 *
 * @param {string} $prop - css property name, e.g. font-size, line-height; Default: 'font-size'
 * @param {number} $size - size in px; Default: $body-font-size-px
 *
 */
/**
* Mixin for adding vendor prefixes to CSS attributes; useful for the following CSS attributes
*
* - border-radius
* - box-shadow
* - transition
* - transform
* - background-size
* - box-sizing
* - animate
*
* @param {string} $attribute - CSS attribute that needs vendor prefixes, e.g. border-radius or transition
* @param {string} $value - The specific CSS value, e.g. "translateX .2s ease-out"
*/
/**
* Clearfix
*/
/**
 * Webfont mixin for global use
 *
 * @param {string} $family - set the font-family value
 * @param {string} $fontWeight - set the font-weight value
 * @param {string} $fontStyle - set the font-style value
 */
/**
* Mixin for adding hover transition
*
* @param {string} $colorFX - properties for color transition
* @param {string} $hoverColor - hover color
* @param {string} $backgroundFX - properties for backgrounf transition
* @param {string} $hoverBackground - hover background color
*/
/**
 * Mixin for defining values at an specific mediaQuerie
 *
 * @param {string} $width - breakpoint from $breakpoints map
 */
/**
 * Block: Base Component
 */
.breadcrumb {
  display: inline-block;
  list-style: none;
  margin: 0;
  padding: 0; }
  .breadcrumb a {
    color: #414141;
    text-decoration: underline; }
    .breadcrumb a:hover {
      color: #414141;
      text-decoration: none; }

/**
 * Elements: Generic
 *
 * Elements which fits in every context or/and
 * are implied to ensure the components functionality.
 *
 * @see breadcrumb.tpl for possible markup
 */
.breadcrumb__item {
  display: inline-block;
  margin-right: 5px; }
  .breadcrumb__item,
  .breadcrumb__item a {
    font-size: 14px;
    font-size: 0.875rem; }
  .breadcrumb__item::before {
    font-size: 12px;
    font-size: 0.75rem;
    font-family: iconfont;
    font-weight: normal;
    font-style: normal;
    speak: none;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    content: "";
    display: inline-block;
    vertical-align: middle;
    margin-right: 5px; }

.breadcrumb__root::before {
  content: '';
  margin-right: 0; }

.breadcrumb__current {
  color: #e63995; }
  .europa-go .breadcrumb__current {
    color: #f39200; }
  .breadcrumb__current::before {
    content: "";
    color: #414141; }

/**
 * Capitan buttons.scss v1.0.0
 *
 * Copyright brandung GmbH & Co.KG
 * http://www.brandung.de/
 *
 * Date: 2014-03-14
 * MIT License (MIT)
 */
/**
 * Capitan functions.scss v2.0.0
 *
 * Copyright brandung GmbH & Co.KG
 * http://www.brandung.de/
 *
 * Date: 2014-09-23
 * MIT License (MIT)
 */
/* ==========================================================================
   Global functions
   ========================================================================== */
/**
 * Calculate PX to EM
 *
 * @param {number} $targetPx - pixel value without unit
 *
 */
/**
 * Built a JSON like string with all given breakpoints and their values.
 * This is necessary for the JavaScript function 'function/get-breakpoint.js'
 * and 'function/assert-breakpoint.js'
 */
/**
 * Return specific breakpoint
 */
/**
 * Return specific color
 */
/**
 * Return specific Icon
 */
/**
 * Capitan variables.scss v3.0.0
 *
 * Copyright brandung GmbH & Co.KG
 * http://www.brandung.de/
 *
 * Date: 2015-06-27
 * MIT License (MIT)
 */
/* ==========================================================================
   Base settings
   ========================================================================== */
/* base path */
/* Base sizes */
/* Body font size */
/* Font Style */
/* ==========================================================================
   Grid-System
   ========================================================================== */
/* <@breakpoints */
/* breakpoints@> */
/* ==========================================================================
   Colors
   ========================================================================== */
/* <@colors */
/* colors@> */
/* ==========================================================================
   Icons
   ========================================================================== */
/* <@icons */
/* icons@> */
/**
 * Capitan mixins.scss v2.0.1
 *
 * Copyright brandung GmbH & Co.KG
 * http://www.brandung.de/
 *
 * Date: 2014-09-23
 * MIT License (MIT)
 */
/* ==========================================================================
   Global mixins
   ========================================================================== */
/**
 * Calculate percent value to given property
 *
 * @param {string} $cssProperty - which property
 * @param {number} $targetSize - element size in pixel
 * @param {number} $contextSize - context element size in pixel
 * @param {boolean} $important - set !important property
 *
 */
/**
 * Calculate PX font size to REM
 *
 * @param {number} $size - element size in pixel
 * @param {number} $base - body font size in pixel
 *
 */
/**
 * Calculates given px value to rem value
 *
 * @param {string} $prop - css property name, e.g. font-size, line-height; Default: 'font-size'
 * @param {number} $size - size in px; Default: $body-font-size-px
 *
 */
/**
* Mixin for adding vendor prefixes to CSS attributes; useful for the following CSS attributes
*
* - border-radius
* - box-shadow
* - transition
* - transform
* - background-size
* - box-sizing
* - animate
*
* @param {string} $attribute - CSS attribute that needs vendor prefixes, e.g. border-radius or transition
* @param {string} $value - The specific CSS value, e.g. "translateX .2s ease-out"
*/
/**
* Clearfix
*/
/**
 * Webfont mixin for global use
 *
 * @param {string} $family - set the font-family value
 * @param {string} $fontWeight - set the font-weight value
 * @param {string} $fontStyle - set the font-style value
 */
/**
* Mixin for adding hover transition
*
* @param {string} $colorFX - properties for color transition
* @param {string} $hoverColor - hover color
* @param {string} $backgroundFX - properties for backgrounf transition
* @param {string} $hoverBackground - hover background color
*/
/**
 * Mixin for defining values at an specific mediaQuerie
 *
 * @param {string} $width - breakpoint from $breakpoints map
 */
.btn {
  display: block;
  width: 100%;
  position: relative;
  margin: 0;
  padding: 15px 20px 16px;
  background: #002a54;
  color: #fff;
  border: none;
  border-radius: 4px;
  vertical-align: bottom;
  cursor: pointer;
  z-index: 0;
  text-decoration: none;
  font-weight: normal;
  line-height: 19px;
  transition: all .2s ease-out;
  text-align: center; }
  @media screen and (min-width: 30em) {
    .btn {
      display: inline-block;
      width: auto; } }
  .europa-go .btn {
    padding: 13px 20px; }
  .btn:hover {
    background: #bbc9db; }
.btn:focus {
	outline: 3px solid #b9d8f9;
}
  .btn--small {
    font-size: 14px;
    font-size: 0.875rem;
    padding: 5px 10px;
    margin: 1.1em 0; }
    .europa-go .btn--small {
      padding: 6px 10px; }
  .btn--disabled:hover {
    background: #8a9bbb;
    cursor: default; }
  .btn--cancel {
    background: #e4e9f1;
    color: #002a54; }
    .btn--cancel:hover {
      background: #b2bdc6; }
  .btn--light {
    background: #bbc9db; }
    .btn--light:hover {
      background: #002a54; }
  .btn--pink {
    background: #e63995; }
    .europa-go .btn--pink {
      background: #f39200; }
    .btn--pink:hover {
      background: #f084be; }
      .europa-go .btn--pink:hover {
        background: #ffb84c; }
  .btn--block {
    width: 100%;
    display: block;
    padding-left: 10%;
    padding-right: 10%;
    overflow: hidden; }
  @media screen and (max-width: 30em) {
    .btn--margin-mobile {
      margin: 10px 0 !important; } }
  .btn.util-icon--after:after, .btn.util-icon--after:before, .btn.util-icon--before:after, .btn.util-icon--before:before {
    color: white;
    vertical-align: baseline; }
  .btn.util-icon--before:before {
    padding-right: 5px; }
  .btn.util-icon--after:after {
    padding-left: 5px; }

.text-link {
  text-decoration: none;
  background: none;
  border: none;
  float: left; }
  .text-link span {
    text-decoration: underline; }
  .text-link + span {
    float: left;
    margin: 10px 0;
    width: 100%; }
    @media screen and (min-width: 62em) {
      .text-link + span {
        margin: 0;
        width: auto;
        float: right; } }
  .text-link.util-icon--after:after {
    padding-left: 5px; }
  .text-link.util-icon--before:before {
    padding-right: 5px; }

/**
 * Capitan noscript.scss v1.0.0
 *
 * Copyright brandung GmbH & Co.KG
 * http://www.brandung.de/
 *
 * Date: 2014-09-23
 * MIT License (MIT)
 */
noscript {
  color: #000;
  margin: 0.2em 0;
  background: #f7f7f7;
  padding: 0.2em 0;
  text-align: center; }
  noscript p {
    margin: 0 auto;
    max-width: 1280; }

/**
 * Capitan selectbox-contract.scss v1.0.0
 *
 * Copyright brandung GmbH & Co.KG
 * http://www.brandung.de/
 *
 * Date: 2017-01-02
 * MIT License (MIT)
 */
/**
 * Capitan functions.scss v2.0.0
 *
 * Copyright brandung GmbH & Co.KG
 * http://www.brandung.de/
 *
 * Date: 2014-09-23
 * MIT License (MIT)
 */
/* ==========================================================================
   Global functions
   ========================================================================== */
/**
 * Calculate PX to EM
 *
 * @param {number} $targetPx - pixel value without unit
 *
 */
/**
 * Built a JSON like string with all given breakpoints and their values.
 * This is necessary for the JavaScript function 'function/get-breakpoint.js'
 * and 'function/assert-breakpoint.js'
 */
/**
 * Return specific breakpoint
 */
/**
 * Return specific color
 */
/**
 * Return specific Icon
 */
/**
 * Capitan variables.scss v3.0.0
 *
 * Copyright brandung GmbH & Co.KG
 * http://www.brandung.de/
 *
 * Date: 2015-06-27
 * MIT License (MIT)
 */
/* ==========================================================================
   Base settings
   ========================================================================== */
/* base path */
/* Base sizes */
/* Body font size */
/* Font Style */
/* ==========================================================================
   Grid-System
   ========================================================================== */
/* <@breakpoints */
/* breakpoints@> */
/* ==========================================================================
   Colors
   ========================================================================== */
/* <@colors */
/* colors@> */
/* ==========================================================================
   Icons
   ========================================================================== */
/* <@icons */
/* icons@> */
/**
 * Capitan mixins.scss v2.0.1
 *
 * Copyright brandung GmbH & Co.KG
 * http://www.brandung.de/
 *
 * Date: 2014-09-23
 * MIT License (MIT)
 */
/* ==========================================================================
   Global mixins
   ========================================================================== */
/**
 * Calculate percent value to given property
 *
 * @param {string} $cssProperty - which property
 * @param {number} $targetSize - element size in pixel
 * @param {number} $contextSize - context element size in pixel
 * @param {boolean} $important - set !important property
 *
 */
/**
 * Calculate PX font size to REM
 *
 * @param {number} $size - element size in pixel
 * @param {number} $base - body font size in pixel
 *
 */
/**
 * Calculates given px value to rem value
 *
 * @param {string} $prop - css property name, e.g. font-size, line-height; Default: 'font-size'
 * @param {number} $size - size in px; Default: $body-font-size-px
 *
 */
/**
* Mixin for adding vendor prefixes to CSS attributes; useful for the following CSS attributes
*
* - border-radius
* - box-shadow
* - transition
* - transform
* - background-size
* - box-sizing
* - animate
*
* @param {string} $attribute - CSS attribute that needs vendor prefixes, e.g. border-radius or transition
* @param {string} $value - The specific CSS value, e.g. "translateX .2s ease-out"
*/
/**
* Clearfix
*/
/**
 * Webfont mixin for global use
 *
 * @param {string} $family - set the font-family value
 * @param {string} $fontWeight - set the font-weight value
 * @param {string} $fontStyle - set the font-style value
 */
/**
* Mixin for adding hover transition
*
* @param {string} $colorFX - properties for color transition
* @param {string} $hoverColor - hover color
* @param {string} $backgroundFX - properties for backgrounf transition
* @param {string} $hoverBackground - hover background color
*/
/**
 * Mixin for defining values at an specific mediaQuerie
 *
 * @param {string} $width - breakpoint from $breakpoints map
 */
.selectbox-contract:after {
  display: block;
  content: ".";
  clear: both;
  font-size: 0;
  line-height: 0;
  height: 0;
  overflow: hidden; }

.selectbox-contract .form__label {
  margin: 14px 0;
  color: #002a54; }

/**
 * Capitan footer.scss v1.0.0
 *
 * Copyright brandung GmbH & Co.KG
 * http://www.brandung.de/
 *
 * Date: 2016-04-05
 * MIT License (MIT)
 */
/**
 * Capitan functions.scss v2.0.0
 *
 * Copyright brandung GmbH & Co.KG
 * http://www.brandung.de/
 *
 * Date: 2014-09-23
 * MIT License (MIT)
 */
/* ==========================================================================
   Global functions
   ========================================================================== */
/**
 * Calculate PX to EM
 *
 * @param {number} $targetPx - pixel value without unit
 *
 */
/**
 * Built a JSON like string with all given breakpoints and their values.
 * This is necessary for the JavaScript function 'function/get-breakpoint.js'
 * and 'function/assert-breakpoint.js'
 */
/**
 * Return specific breakpoint
 */
/**
 * Return specific color
 */
/**
 * Return specific Icon
 */
/**
 * Capitan variables.scss v3.0.0
 *
 * Copyright brandung GmbH & Co.KG
 * http://www.brandung.de/
 *
 * Date: 2015-06-27
 * MIT License (MIT)
 */
/* ==========================================================================
   Base settings
   ========================================================================== */
/* base path */
/* Base sizes */
/* Body font size */
/* Font Style */
/* ==========================================================================
   Grid-System
   ========================================================================== */
/* <@breakpoints */
/* breakpoints@> */
/* ==========================================================================
   Colors
   ========================================================================== */
/* <@colors */
/* colors@> */
/* ==========================================================================
   Icons
   ========================================================================== */
/* <@icons */
/* icons@> */
/**
 * Capitan mixins.scss v2.0.1
 *
 * Copyright brandung GmbH & Co.KG
 * http://www.brandung.de/
 *
 * Date: 2014-09-23
 * MIT License (MIT)
 */
/* ==========================================================================
   Global mixins
   ========================================================================== */
/**
 * Calculate percent value to given property
 *
 * @param {string} $cssProperty - which property
 * @param {number} $targetSize - element size in pixel
 * @param {number} $contextSize - context element size in pixel
 * @param {boolean} $important - set !important property
 *
 */
/**
 * Calculate PX font size to REM
 *
 * @param {number} $size - element size in pixel
 * @param {number} $base - body font size in pixel
 *
 */
/**
 * Calculates given px value to rem value
 *
 * @param {string} $prop - css property name, e.g. font-size, line-height; Default: 'font-size'
 * @param {number} $size - size in px; Default: $body-font-size-px
 *
 */
/**
* Mixin for adding vendor prefixes to CSS attributes; useful for the following CSS attributes
*
* - border-radius
* - box-shadow
* - transition
* - transform
* - background-size
* - box-sizing
* - animate
*
* @param {string} $attribute - CSS attribute that needs vendor prefixes, e.g. border-radius or transition
* @param {string} $value - The specific CSS value, e.g. "translateX .2s ease-out"
*/
/**
* Clearfix
*/
/**
 * Webfont mixin for global use
 *
 * @param {string} $family - set the font-family value
 * @param {string} $fontWeight - set the font-weight value
 * @param {string} $fontStyle - set the font-style value
 */
/**
* Mixin for adding hover transition
*
* @param {string} $colorFX - properties for color transition
* @param {string} $hoverColor - hover color
* @param {string} $backgroundFX - properties for backgrounf transition
* @param {string} $hoverBackground - hover background color
*/
/**
 * Mixin for defining values at an specific mediaQuerie
 *
 * @param {string} $width - breakpoint from $breakpoints map
 */
/* ==========================================================================
   Footer
   ========================================================================== */
/**
 * Block: Base Component
 */
 
 #htmlWrapper, #overallWrapper, #documentWrapper {
  height: 100%;
}

#siteWrapper {
	height: auto; 
  min-height: 92%;
}

#main { 
	padding-bottom:108px; /* Hoehe des Footers */
}

#footer {
	height:108px;
	margin-top: -108px; /* Hoehe des Footers plus Rand */
}	 
 
@media screen and (min-width: 48em) {
  #main { 
    padding-bottom:131px; /* Hoehe des Footers */
	}
 
	#footer {
		height:131px;
	  margin-top: -165px; /* Hoehe des Footers plus Rand */
  }	 
}

.footer {
  width: 100%;
  color: #fff;
  background-color: #002a54;
  padding: 5px 10px 10px 10px; }
  @media screen and (min-width: 48em) {
    .footer {
      -ms-flex-flow: row nowrap;
          flex-flow: row nowrap;
      padding: 15px 0 40px 0; } }
  .footer .bra-row {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column-reverse;
        flex-direction: column-reverse; }
    @media screen and (min-width: 48em) {
      .footer .bra-row {
        display: block; } }

/**
 * Elements: Generic
 *
 * Elements which fits in every context or/and
 * are implied to ensure the components functionality.
 *
 * @see footer.tpl for possible markup
 */
.footer__legal {
  font-size: 9px;
  font-size: 0.5625rem;
  margin: 0;
  text-align: center; }
  @media screen and (min-width: 48em) {
    .footer__legal {
      font-size: 0.75rem;
      margin: 5px 0 0 0;
      text-align: left; } }

.footer__list {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-flow: row wrap;
      flex-flow: row wrap;
  -ms-flex-pack: justify;
      justify-content: space-between;
  list-style: none;
  padding: 0;
  margin: 0 0 25px 0; }
  @media screen and (min-width: 48em) {
    .footer__list {
      float: right;
      display: block;
      margin: 0; } }

@media screen and (min-width: 48em) {
  .footer__list-item {
    float: left;
    margin: 0 0 0 10px; } }

@media screen and (min-width: 62em) {
  .footer__list-item {
    margin-right: 20px; } }

@media screen and (min-width: 80em) {
  .footer__list-item {
    margin-right: 40px; } }

.footer__link {
  font-size: 10px;
  font-size: 0.625rem;
  color: #fff;
  text-decoration: none; }
  @media screen and (min-width: 48em) {
    .footer__link {
      font-size: 0.8125rem;
      padding: 0; } }
  @media screen and (min-width: 62em) {
    .footer__link {
      font-size: 0.9375rem; } }
  @media screen and (min-width: 80em) {
    .footer__link {
      font-size: 1rem; } }
  .footer__link:hover {
    text-decoration: underline; }

/* ==========================================================================
   Utility classes
   ========================================================================== */
/**
 * Capitan utils.scss v1.0.0
 *
 * Copyright brandung GmbH & Co.KG
 * http://www.brandung.de/
 *
 * Date: 2016-04-05
 * MIT License (MIT)
 */
/* ==========================================================================
   Util classes
   ========================================================================== */
.util-unstyled {
  margin: 0;
  padding: 0;
  list-style: none; }

.util-left {
  float: left; }

.util-right {
  float: right; }

.util-center {
  display: block;
  margin: 0 auto;
  text-align: center; }

.util-clear {
  clear: both; }

.util-text-right {
  text-align: right; }

.util-text-left {
  text-align: left; }

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

.util-show-grid [class*="col-"] {
  background: grey;
  outline: 1px solid red; }

.util-show-grid header {
  background: rgba(0, 128, 0, 0.5); }

.util-show-grid footer {
  background: rgba(0, 255, 255, 0.5); }

.util-bg--pattern {
  background: url("../img/pattern.jpg") repeat 0 0; }

.util-text--light {
  color: #b2bdc6; }

.util-color--europa-go {
  color: #f39200; }

.util-reset-decoration {
  text-decoration: none; }

/**
 * Add utility class for counter in mailbox
 * navigation item
 */
.util-count-inbox {
  position: relative; }
  .util-count-inbox > span {
    font-size: 11px;
    font-size: 0.6875rem;
    position: absolute;
    top: -3.3333333333px;
    right: -20px;
    display: block;
    border-radius: 24px;
    line-height: 0;
    background-color: #e63995;
    color: #fff;
    padding: 8px 4.4444444444px; }
    .europa-go .util-count-inbox > span {
      background-color: #f39200; }

.util-reset-padding {
  padding: 0 !important; }
  .util-reset-padding-top {
    padding-top: 0 !important; }
  .util-reset-padding-right {
    padding-right: 0 !important; }
  .util-reset-padding-bottom {
    padding-bottom: 0 !important; }
  .util-reset-padding-left {
    padding-left: 0 !important; }
  .util-reset-padding-x {
    padding-left: 0 !important;
    padding-right: 0 !important; }
  .util-reset-padding-y {
    padding-top: 0 !important;
    padding-bottom: 0 !important; }

.util-add-padding {
  padding: 10px !important; }
  .util-add-padding-full {
    padding: 20px !important; }
  .util-add-padding-double {
    padding: 40px !important; }
  .util-add-padding-top {
    padding-top: 10px !important; }
    .util-add-padding-top-full {
      padding-top: 20px !important; }
    .util-add-padding-top-double {
      padding-top: 40px !important; }
  .util-add-padding-right {
    padding-right: 10px !important; }
    .util-add-padding-right-full {
      padding-right: 20px !important; }
    .util-add-padding-right-double {
      padding-right: 40px !important; }
  .util-add-padding-bottom {
    padding-bottom: 10px !important; }
    .util-add-padding-bottom-full {
      padding-bottom: 20px !important; }
    .util-add-padding-bottom-double {
      padding-bottom: 40px !important; }
  .util-add-padding-left {
    padding-left: 10px !important; }
    .util-add-padding-left-full {
      padding-left: 20px !important; }
    .util-add-padding-left-double {
      padding-left: 40px !important; }
  .util-add-padding-x {
    padding-left: 10px !important;
    padding-right: 10px !important; }
    .util-add-padding-x-full {
      padding-left: 20px !important;
      padding-right: 20px !important; }
    .util-add-padding-x-double {
      padding-left: 40px !important;
      padding-right: 40px !important; }
  .util-add-padding-y {
    padding-top: 10px !important;
    padding-bottom: 10px !important; }
    .util-add-padding-y-full {
      padding-top: 20px !important;
      padding-bottom: 20px !important; }
    .util-add-padding-y-double {
      padding-top: 40px !important;
      padding-bottom: 40px !important; }

.util-reset-margin {
  margin: 0 !important; }
  .util-reset-margin-top {
    margin-top: 0 !important; }
  .util-reset-margin-right {
    margin-right: 0 !important; }
  .util-reset-margin-bottom {
    margin-bottom: 0 !important; }
  .util-reset-margin-left {
    margin-left: 0 !important; }
  .util-reset-margin-x {
    margin-left: 0 !important;
    margin-right: 0 !important; }
  .util-reset-margin-y {
    margin-top: 0 !important;
    margin-bottom: 0 !important; }
  .util-reset-margin-auto {
    margin-left: auto !important;
    margin-right: auto !important; }

.util-add-margin {
  margin: 10px !important; }
  .util-add-margin-full {
    margin: 20px !important; }
  .util-add-margin-double {
    margin: 40px !important; }
  .util-add-margin-top {
    margin-top: 10px !important; }
    .util-add-margin-top-full {
      margin-top: 20px !important; }
    .util-add-margin-top-double {
      margin-top: 40px !important; }
  .util-add-margin-right {
    margin-right: 10px !important; }
    .util-add-margin-right-full {
      margin-right: 20px !important; }
    .util-add-margin-right-double {
      margin-right: 40px !important; }
  .util-add-margin-bottom {
    margin-bottom: 10px !important; }
    .util-add-margin-bottom-full {
      margin-bottom: 20px !important; }
    .util-add-margin-bottom-double {
      margin-bottom: 40px !important; }
  .util-add-margin-left {
    margin-left: 10px !important; }
    .util-add-margin-left-full {
      margin-left: 20px !important; }
    .util-add-margin-left-double {
      margin-left: 40px !important; }
  .util-add-margin-x {
    margin-left: 10px !important;
    margin-right: 10px !important; }
    .util-add-margin-x-full {
      margin-left: 20px !important;
      margin-right: 20px !important; }
    .util-add-margin-x-double {
      margin-left: 40px !important;
      margin-right: 40px !important; }
  .util-add-margin-y {
    margin-top: 10px !important;
    margin-bottom: 10px !important; }
    .util-add-margin-y-full {
      margin-top: 20px !important;
      margin-bottom: 20px !important; }
    .util-add-margin-y-double {
      margin-top: 40px !important;
      margin-bottom: 40px !important; }

.util-block {
  display: block; }

/** + bootstrap visibility utilities */
.util-hidden,
.util-visible-xs,
.util-visible-sm,
.util-visible-md,
.util-visible-lg,
.util-visible-xl {
  display: none !important; }

@media screen and (min-width: 20em) {
  .util-visible-xs {
    display: block !important; }
  span.util-visible-xs {
    display: inline !important; }
  .util-hidden-xs {
    display: none !important; } }

@media screen and (min-width: 30em) {
  .util-visible-sm {
    display: block !important; }
  span.util-visible-sm {
    display: inline !important; }
  .util-hidden-sm {
    display: none !important; } }

@media screen and (min-width: 48em) {
  .util-visible-md {
    display: block !important; }
  span.util-visible-md {
    display: inline !important; }
  .util-hidden-md {
    display: none !important; } }

@media screen and (min-width: 62em) {
  .util-visible-lg {
    display: block !important; }
  span.util-visible-lg {
    display: inline !important; }
  .util-hidden-lg {
    display: none !important; } }

@media screen and (min-width: 80em) {
  .util-visible-xl {
    display: block !important; }
  span.util-visible-xl {
    display: inline !important; }
  .util-hidden-xl {
    display: none !important; } }

.util-bg--black {
  background: #000; }

.util-bg--white {
  background: #fff; }

.util-bg--grey {
  background: #666; }

.util-bg--grey-dark {
  background: #414141; }

.util-bg--grey-light {
  background: #b2bdc6; }

.util-bg--grey-lighter {
  background: #e9e9e9; }

.util-bg--grey-lightest {
  background: #f7f7f7; }

.util-bg--placeholder {
  background: #999; }

.util-bg--ci {
  background: #002a54; }

.util-bg--ci-pink {
  background: #e63995; }

.util-bg--pink-hover {
  background: #f084be; }

.util-bg--ci-hover {
  background: #bbc9db; }

.util-bg--error {
  background: #cd0d00; }

.util-bg--error-light {
  background: #ffdfdf; }

.util-bg--success {
  background: #289923; }

.util-bg--green-light {
  background: #a9d6a7; }

.util-bg--warning {
  background: #f0ad4e; }

.util-bg--info {
  background: #7f91b1; }

.util-bg--blue-darkest {
  background: #002a54; }

.util-bg--blue-light {
  background: #e4e9f1; }

.util-bg--blue-highlight {
  background: #d4dbe7; }

.util-bg--blue {
  background: #8a9bbb; }

.util-bg--ci-orange {
  background: #f39200; }

.util-bg--orange-hover {
  background: #ffb84c; }

.util-bg--warning-go {
  background: #a58e3d; }