@charset "UTF-8";
/*! normalize.css v4.0.0 | MIT License | github.com/necolas/normalize.css */
/**
 * 1. Change the default font family in all browsers (opinionated).
 * 2. Prevent adjustments of font size after orientation changes in IE and iOS.
 */
@import "https://api.mapbox.com/mapbox-gl-js/v0.28.0/mapbox-gl.css";
@import 'https://code.highcharts.com/css/highcharts.css';
html {
  font-family: sans-serif;
  /* 1 */
  -ms-text-size-adjust: 100%;
  /* 2 */
  -webkit-text-size-adjust: 100%;
  /* 2 */
}
/**
 * Remove the margin in all browsers (opinionated).
 */
body {
  margin: 0;
}
/* HTML5 display definitions
   ========================================================================== */
/**
 * Add the correct display in IE 9-.
 * 1. Add the correct display in Edge, IE, and Firefox.
 * 2. Add the correct display in IE.
 */
article,
aside,
details,
figcaption,
figure,
footer,
header,
main,
menu,
nav,
section,
summary {
  /* 1 */
  display: block;
}
/**
 * Add the correct display in IE 9-.
 */
audio,
canvas,
progress,
video {
  display: inline-block;
}
/**
 * Add the correct display in iOS 4-7.
 */
audio:not([controls]) {
  display: none;
  height: 0;
}
/**
 * Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */
progress {
  vertical-align: baseline;
}
/**
 * Add the correct display in IE 10-.
 * 1. Add the correct display in IE.
 */
template,
[hidden] {
  display: none;
}
/* Links
   ========================================================================== */
/**
 * Remove the gray background on active links in IE 10.
 */
a {
  background-color: transparent;
}
/**
 * Remove the outline on focused links when they are also active or hovered
 * in all browsers (opinionated).
 */
a:active,
a:hover {
  outline-width: 0;
}
/* Text-level semantics
   ========================================================================== */
/**
 * 1. Remove the bottom border in Firefox 39-.
 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
 */
abbr[title] {
  border-bottom: none;
  /* 1 */
  text-decoration: underline;
  /* 2 */
  -webkit-text-decoration: underline dotted;
          text-decoration: underline dotted;
  /* 2 */
}
/**
 * Prevent the duplicate application of `bolder` by the next rule in Safari 6.
 */
b,
strong {
  font-weight: inherit;
}
/**
 * Add the correct font weight in Chrome, Edge, and Safari.
 */
b,
strong {
  font-weight: bolder;
}
/**
 * Add the correct font style in Android 4.3-.
 */
dfn {
  font-style: italic;
}
/**
 * Correct the font size and margin on `h1` elements within `section` and
 * `article` contexts in Chrome, Firefox, and Safari.
 */
h1 {
  font-size: 2em;
  margin: 0.67em 0;
}
/**
 * Add the correct background and color in IE 9-.
 */
mark {
  background-color: #ff0;
  color: #000;
}
/**
 * Add the correct font size in all browsers.
 */
small {
  font-size: 80%;
}
/**
 * Prevent `sub` and `sup` elements from affecting the line height in
 * all browsers.
 */
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}
sub {
  bottom: -0.25em;
}
sup {
  top: -0.5em;
}
/* Embedded content
   ========================================================================== */
/**
 * Remove the border on images inside links in IE 10-.
 */
img {
  border-style: none;
}
/**
 * Hide the overflow in IE.
 */
svg:not(:root) {
  overflow: hidden;
}
/* Grouping content
   ========================================================================== */
/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
code,
kbd,
pre,
samp {
  font-family: monospace, monospace;
  /* 1 */
  font-size: 1em;
  /* 2 */
}
/**
 * Add the correct margin in IE 8.
 */
figure {
  margin: 1em 40px;
}
/**
 * 1. Add the correct box sizing in Firefox.
 * 2. Show the overflow in Edge and IE.
 */
hr {
  -webkit-box-sizing: content-box;
          box-sizing: content-box;
  /* 1 */
  height: 0;
  /* 1 */
  overflow: visible;
  /* 2 */
}
/* Forms
   ========================================================================== */
/**
 * Change font properties to `inherit` in all browsers (opinionated).
 */
button,
input,
select,
textarea {
  font: inherit;
}
/**
 * Restore the font weight unset by the previous rule.
 */
optgroup {
  font-weight: bold;
}
/**
 * Show the overflow in IE.
 * 1. Show the overflow in Edge.
 * 2. Show the overflow in Edge, Firefox, and IE.
 */
button,
input,
select {
  /* 2 */
  overflow: visible;
}
/**
 * Remove the margin in Safari.
 * 1. Remove the margin in Firefox and Safari.
 */
button,
input,
select,
textarea {
  /* 1 */
  margin: 0;
}
/**
 * Remove the inheritance of text transform in Edge, Firefox, and IE.
 * 1. Remove the inheritance of text transform in Firefox.
 */
button,
select {
  /* 1 */
  text-transform: none;
}
/**
 * Change the cursor in all browsers (opinionated).
 */
button,
[type="button"],
[type="reset"],
[type="submit"] {
  cursor: pointer;
}
/**
 * Restore the default cursor to disabled elements unset by the previous rule.
 */
[disabled] {
  cursor: default;
}
/**
 * 1. Prevent a WebKit bug where (2) destroys native `audio` and `video`
 *    controls in Android 4.
 * 2. Correct the inability to style clickable types in iOS.
 */
button,
html [type="button"],
[type="reset"],
[type="submit"] {
  -webkit-appearance: button;
  /* 2 */
}
/**
 * Remove the inner border and padding in Firefox.
 */
button::-moz-focus-inner,
input::-moz-focus-inner {
  border: 0;
  padding: 0;
}
/**
 * Restore the focus styles unset by the previous rule.
 */
button:-moz-focusring,
input:-moz-focusring {
  outline: 1px dotted ButtonText;
}
/**
 * Change the border, margin, and padding in all browsers (opinionated).
 */
fieldset {
  border: 1px solid #c0c0c0;
  margin: 0 2px;
  padding: 0.35em 0.625em 0.75em;
}
/**
 * 1. Correct the text wrapping in Edge and IE.
 * 2. Correct the color inheritance from `fieldset` elements in IE.
 * 3. Remove the padding so developers are not caught out when they zero out
 *    `fieldset` elements in all browsers.
 */
legend {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  /* 1 */
  color: inherit;
  /* 2 */
  display: table;
  /* 1 */
  max-width: 100%;
  /* 1 */
  padding: 0;
  /* 3 */
  white-space: normal;
  /* 1 */
}
/**
 * Remove the default vertical scrollbar in IE.
 */
textarea {
  overflow: auto;
}
/**
 * 1. Add the correct box sizing in IE 10-.
 * 2. Remove the padding in IE 10-.
 */
[type="checkbox"],
[type="radio"] {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  /* 1 */
  padding: 0;
  /* 2 */
}
/**
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */
[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
  height: auto;
}
/**
 * Correct the odd appearance of search inputs in Chrome and Safari.
 */
[type="search"] {
  -webkit-appearance: textfield;
}
/**
 * Remove the inner padding and cancel buttons in Chrome on OS X and
 * Safari on OS X.
 */
[type="search"]::-webkit-search-cancel-button,
[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}
/* Slider */
.slick-slider {
  position: relative;
  display: block;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -ms-touch-action: pan-y;
  touch-action: pan-y;
  -webkit-tap-highlight-color: transparent;
}
.carousel-wrapper {
  text-align: center;
}
.carousel-wrapper--inner {
  display: inline-block;
  width: 90%;
}
@media only screen and (max-width: 34em), print {
  .carousel-wrapper--inner {
    width: 80%;
  }
}
.slick-list {
  position: relative;
  overflow: hidden;
  display: block;
  margin: 0;
  padding: 0;
}
.slick-list:focus {
  outline: none;
}
.slick-list.dragging {
  cursor: pointer;
  cursor: hand;
}
.slick-slider .slick-track,
.slick-slider .slick-list {
  -webkit-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
}
.slick-track {
  position: relative;
  left: 0;
  top: 0;
  display: block;
  margin-left: auto;
  margin-right: auto;
}
.slick-track:before,
.slick-track:after {
  content: "";
  display: table;
}
.slick-track:after {
  clear: both;
}
.slick-loading .slick-track {
  visibility: hidden;
}
.slick-slide {
  float: left;
  height: 100%;
  min-height: 1px;
  display: none;
}
[dir="rtl"] .slick-slide {
  float: right;
}
.slick-slide img {
  display: block;
}
.slick-slide.slick-loading img {
  display: none;
}
.slick-slide.dragging img {
  pointer-events: none;
}
.slick-initialized .slick-slide {
  display: block;
}
.slick-loading .slick-slide {
  visibility: hidden;
}
.slick-vertical .slick-slide {
  display: block;
  height: auto;
  border: 1px solid transparent;
}
.slick-arrow.slick-hidden {
  display: none;
}
/* Slider */
.slick-loading .slick-list {
  background: #fff url('../Images/ajax-loader.gif') center center no-repeat;
}
/* Arrows */
.slick-prev,
.slick-next {
  position: absolute;
  display: block;
  height: 60px;
  width: 60px;
  line-height: 0px;
  font-size: 0px;
  cursor: pointer;
  background: transparent;
  color: transparent;
  top: 50%;
  -webkit-transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
  transform: translate(0, -50%);
  padding: 0;
  border: none;
  outline: none;
}
.slick-prev:hover:before,
.slick-next:hover:before {
  content: url('/Assets/Icons/Carousel-arrow.svg');
  opacity: 1;
}
@media only screen and (min-width: 48em), print {
  .slick-prev:hover:before,
  .slick-next:hover:before {
    content: url('/Assets/Icons/Carousel-arrow-hover-pressed.svg');
  }
}
.slick-prev.slick-disabled:before,
.slick-next.slick-disabled:before {
  opacity: 0.25;
}
.slick-prev:before,
.slick-next:before {
  font-family: "slick";
  font-size: 20px;
  line-height: 1;
  color: white;
  opacity: 0.75;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  /* Icons */
}
@font-face {
  font-family: 'slick';
  font-weight: normal;
  font-style: normal;
  src: url('../Fonts/slick.eot');
  src: url('../Fonts/slick.eot?#iefix') format('embedded-opentype'), url('../Fonts/slick.woff') format('woff'), url('../Fonts/slick.ttf') format('truetype'), url('../Fonts/slick.svg#slick') format('svg');
}
.slick-prev {
  left: -100px;
}
[dir="rtl"] .slick-prev {
  left: auto;
  right: -100px;
}
.slick-prev:before {
  content: url('/Assets/Icons/Carousel-arrow.svg');
  -webkit-transform: rotate(180deg);
      -ms-transform: rotate(180deg);
          transform: rotate(180deg);
  display: block;
}
@media only screen and (min-width: 48em), print {
  .slick-prev:before {
    content: url('/Assets/Icons/Carousel-arrow-normal.svg');
  }
}
[dir="rtl"] .slick-prev:before {
  content: url('/Assets/Icons/Carousel-arrow-normal.svg');
}
.slick-next {
  right: -100px;
}
[dir="rtl"] .slick-next {
  left: -100px;
  right: auto;
}
.slick-next:before {
  content: url('/Assets/Icons/Carousel-arrow.svg');
}
@media only screen and (min-width: 48em), print {
  .slick-next:before {
    content: url('/Assets/Icons/Carousel-arrow-normal.svg');
  }
}
[dir="rtl"] .slick-next:before {
  content: url('/Assets/Icons/Carousel-arrow-normal.svg');
  -webkit-transform: rotate(180deg);
      -ms-transform: rotate(180deg);
          transform: rotate(180deg);
  display: block;
}
/* Dots */
.slick-dotted .slick-slider {
  margin-bottom: 30px;
}
.slick-dots {
  position: absolute;
  bottom: -25px;
  list-style: none;
  display: block;
  text-align: center;
  padding: 0;
  margin: 0;
  width: 100%;
}
.slick-dots li {
  position: relative;
  display: inline-block;
  height: 20px;
  width: 20px;
  margin: 0 5px;
  padding: 0;
  cursor: pointer;
}
.slick-dots li button {
  border: 0;
  background: transparent;
  display: block;
  height: 20px;
  width: 20px;
  outline: none;
  line-height: 0px;
  font-size: 0px;
  color: transparent;
  padding: 5px;
  cursor: pointer;
}
.slick-dots li button:hover,
.slick-dots li button:focus {
  outline: none;
}
.slick-dots li button:hover:before,
.slick-dots li button:focus:before {
  opacity: 1;
}
.slick-dots li button:before {
  position: absolute;
  top: 0;
  left: 0;
  content: "•";
  width: 20px;
  height: 20px;
  font-family: "slick";
  font-size: 6px;
  line-height: 20px;
  text-align: center;
  color: black;
  opacity: 0.25;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.slick-dots li.slick-active button:before {
  color: black;
  opacity: 0.75;
}
/* 
 * 	Core Owl Carousel CSS File
 *	v1.3.3
 */

/* clearfix */
.owl-carousel .owl-wrapper:after {
	content: ".";
	display: block;
	clear: both;
	visibility: hidden;
	line-height: 0;
	height: 0;
}
/* display none until init */
.owl-carousel{
	display: none;
	position: relative;
	width: 100%;
	-ms-touch-action: pan-y;
}
.owl-carousel .owl-wrapper{
	display: none;
	position: relative;
	-webkit-transform: translate3d(0px, 0px, 0px);
}
.owl-carousel .owl-wrapper-outer{
	overflow: hidden;
	position: relative;
	width: 100%;
}
.owl-carousel .owl-wrapper-outer.autoHeight{
	-webkit-transition: height 500ms ease-in-out;
	-o-transition: height 500ms ease-in-out;
	transition: height 500ms ease-in-out;
}
	
.owl-carousel .owl-item{
	float: left;
}
.owl-controls .owl-page,
.owl-controls .owl-buttons div{
	cursor: pointer;
}
.owl-controls {
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

/* mouse grab icon */
.grabbing { 
    cursor:url(grabbing.png) 8 8, move;
}

/* fix */
.owl-carousel  .owl-wrapper,
.owl-carousel  .owl-item{
	-webkit-backface-visibility: hidden;
	-moz-backface-visibility:    hidden;
	-ms-backface-visibility:     hidden;
  -webkit-transform: translate3d(0,0,0);
  -moz-transform: translate3d(0,0,0);
  -ms-transform: translate3d(0,0,0);
}


@media screen and (max-width: 640px) {
  .mobHigh {
    height: 300px !important;
  }
}
@media screen and (max-width: 768px) {
}
html {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  font-family: 'Whitney SSm A', 'Whitney SSm B', 'Arial';
  font-size: 100%;
  line-height: 1.8;
  height: 100%;
}
*,
*::before,
*::after {
  -webkit-box-sizing: inherit;
          box-sizing: inherit;
}
body {
  background-color: #f3f3f3;
  color: #333;
  height: 100%;
}
/** 
 * Typography
 */
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 300;
  src: local('Open Sans Light'), local('OpenSans-Light'), url(https://fonts.gstatic.com/s/opensans/v17/mem5YaGs126MiZpBA-UN_r8OUuhs.ttf) format('truetype');
}
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 400;
  src: local('Open Sans Regular'), local('OpenSans-Regular'), url(https://fonts.gstatic.com/s/opensans/v17/mem8YaGs126MiZpBA-UFVZ0e.ttf) format('truetype');
}
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 600;
  src: local('Open Sans SemiBold'), local('OpenSans-SemiBold'), url(https://fonts.gstatic.com/s/opensans/v17/mem5YaGs126MiZpBA-UNirkOUuhs.ttf) format('truetype');
}
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 700;
  src: local('Open Sans Bold'), local('OpenSans-Bold'), url(https://fonts.gstatic.com/s/opensans/v17/mem5YaGs126MiZpBA-UN7rgOUuhs.ttf) format('truetype');
}
p {
  margin-bottom: 1em;
}
.Preamble,
.Preamble p {
  font-weight: 400;
  margin-bottom: 1.5em;
  font-size: 1.2em;
  line-height: 1.5em;
  max-width: 98%;
}
@media only screen and (min-width: 57.5em), print {
  .Preamble,
  .Preamble p {
    margin-bottom: 2em;
    max-width: 90%;
  }
}
ol,
ul,
dl {
  margin-bottom: 1em;
}
ol ol,
ol ul,
ul ol,
ul ul {
  margin-bottom: 0;
}
ul.nodiscs {
  list-style-type: none;
}
code {
  background: rgba(221, 221, 221, 0.3);
  padding: 0 3px;
  border-radius: 4px;
}
/** 
 * Links
 */
p a,
table a,
td a,
li a {
  color: #009fdf;
}
p a:hover,
table a:hover,
td a:hover,
li a:hover {
  text-decoration: underline;
}
a {
  color: #333;
  text-decoration: none;
}
a:hover {
  color: #009fdf;
  text-decoration: underline;
}
/**
 * Elements  
 */
img {
  max-width: 100%;
  vertical-align: middle;
}
img.Rounded {
  border-radius: 50%;
}
img.smallProfilePic {
  height: 56px !important;
  width: 56px !important;
}
hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #ddd;
  margin: 1.25em 0;
  padding: 0;
}
figure {
  margin: 0;
}
/**
 * Tables
 */
table {
  width: 100%;
  max-width: 100%;
  margin: 0 0 1em;
  border-collapse: collapse;
}
table th,
table td {
  padding: 0.5em;
  vertical-align: top;
  text-align: left;
}
table th {
  border-bottom: 2px solid #eaeaea;
}
/**
 * Form  
 */
input[type=text],
input[type=password],
input[type=number],
input[type=search],
input[type=tel],
input[type=email],
input[type=url],
textarea {
  font-family: inherit;
  border: 1px solid #ddd;
  padding: 0.625em;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}
input[type=text]:focus,
input[type=password]:focus,
input[type=number]:focus,
input[type=search]:focus,
input[type=tel]:focus,
input[type=email]:focus,
input[type=url]:focus,
textarea:focus {
  outline: none;
  -webkit-box-shadow: 0 0 1px 1px #009fdf;
          box-shadow: 0 0 1px 1px #009fdf;
}
input[type=text]:disabled,
input[type=password]:disabled,
input[type=number]:disabled,
input[type=search]:disabled,
input[type=tel]:disabled,
input[type=email]:disabled,
input[type=url]:disabled,
textarea:disabled {
  background: #f7f7f7;
  opacity: 0.8;
  color: #aaa;
  cursor: not-allowed;
}
textarea {
  height: 5.8em;
  resize: vertical;
}
label {
  display: inline-block;
}
/**
 * Form Validation
 */
/* stylelint-disable selector-class-pattern  */
.field-validation-valid,
.field-validation-error {
  display: block;
  margin-top: 0.83333333em;
  font-size: 1.25em;
}
.field-validation-valid {
  display: none;
}
.input-validation-error {
  border-color: #ff9191 !important;
}
/* stylelint-enable */
/** 
 * Print styles.
 * Inlined to avoid required HTTP connection.
 */
@media print {
  @page {
    margin: 0.5cm;
  }
  *,
  *:before,
  *:after {
    background: transparent !important;
    color: #000 !important;
    /* Black prints faster: http://www.sanbeiji.com/archives/953 */
    -webkit-box-shadow: none !important;
            box-shadow: none !important;
    text-shadow: none !important;
  }
  a,
  a:visited {
    text-decoration: underline;
  }
  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;
  }
  #epi-quickNavigator {
    /* stylelint-disable-line */
    display: none !important;
  }
}
.sr-only {
  position: absolute;
  overflow: hidden;
  clip: rect(0 0 0 0);
  height: 1px;
  width: 1px;
  margin: -1px;
  padding: 0;
  border: 0;
}
/**
 * Vertical alignment utilities
 * Depends on an appropriate `display` value.
 */
.u-alignBaseline {
  vertical-align: baseline !important;
}
.u-alignBottom {
  vertical-align: bottom !important;
}
.u-alignMiddle {
  vertical-align: middle !important;
}
.u-alignTop {
  vertical-align: top !important;
}
.u-alignCenter {
  margin-left: auto !important;
  margin-right: auto !important;
}
.u-alignSelfMid {
  -ms-flex-item-align: center;
      align-self: center;
}
.u-alignContentMid {
  -ms-flex-line-pack: center;
      align-content: center;
}
.u-alignItemsMid {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.u-alignJustifyMid {
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.u-alignContentScatter {
  height: 100%;
  -ms-flex-line-pack: justify;
      align-content: space-between;
}
.u-outerGrid {
  margin-left: -3.125em;
  margin-right: -3.125em;
  width: 103.125%;
}
.u-breakGrid {
  margin-left: -20px;
  margin-right: -20px;
}
@media only screen and (min-width: 48em), print {
  .u-breakGrid {
    width: calc(100% + 6.25em);
    /*less calc escaped string */
    max-width: none;
    margin-left: -3.125em;
    margin-right: 0;
  }
  .u-breakGrid--multiCol {
    width: calc(100% + 3.25em);
    /*less calc escaped string */
  }
}
@media only screen and (min-width: 57.5em), print {
  .u-breakRightCorner {
    position: relative;
    left: 10px;
    top: -10px;
    padding: 0 !important;
  }
  .u-breakRightCorner img {
    height: calc(100% + 1.25em);
    width: calc(100% + 30px);
    max-width: none;
  }
}
/*USE WITH CAUTION*/
@media only screen and (min-width: 48em), print {
  .u-ArticleBreakFull {
    width: calc(100% + 6.25em);
    margin-left: -3.125em;
    padding: 2.25em 0;
    background-color: #f3f3f3;
  }
}
@media only screen and (min-width: 57.5em), print {
  .u-ArticleBreakFull {
    width: calc(100% + 15.25em);
    margin-left: -12.125em;
    padding: 2.25em 0;
    background-color: #f3f3f3;
  }
}
/**
* Add classes for common colors.
*/
.u-colorText {
  color: #333;
}
.u-colorTextLight {
  color: #aaa;
}
.u-colorBlue {
  color: #009fdf;
}
.u-colorWhite * {
  color: #fff !important;
}
.u-colorBlack * {
  color: #000 !important;
}
.u-colorBgWhite {
  background-color: #fff !important;
}
/* stylelint-disable selector-no-qualifying-type */
/**
* Display-type utilities
*/
.u-hidden,
.u-xxsm-block,
.u-xxsm-inline,
.u-xxsm-inlineBlock,
.u-xxsm-tableCell,
.u-xxsm-flex,
.u-xsm-block,
.u-xsm-inline,
.u-xsm-inlineBlock,
.u-xsm-tableCell,
.u-xsm-flex,
.u-sm-block,
.u-sm-inline,
.u-sm-inlineBlock,
.u-sm-tableCell,
.u-sm-flex,
.u-md-block,
.u-md-inline,
.u-md-inlineBlock,
.u-md-tableCell,
.u-md-flex,
.u-lg-block,
.u-lg-inline,
.u-lg-inlineBlock,
.u-lg-tableCell,
.u-lg-flex,
.u-xlg-block,
.u-xlg-inline,
.u-xlg-inlineBlock,
.u-xlg-tableCell,
.u-xlg-flex {
  display: none !important;
}
.u-visibilityHidden {
  visibility: hidden !important;
}
/**
* Completely remove from the flow but leave available to screen readers.
*/
.u-hiddenVisually {
  position: absolute !important;
  overflow: hidden !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  border: 0 !important;
  clip: rect(1px, 1px, 1px, 1px) !important;
}
.u-block {
  display: block !important;
}
.u-inline {
  display: inline !important;
}
/**
* 1. Fix for Firefox bug: an image styled `max-width:100%` within an
* inline-block will display at its default size, and not limit its width to
* 100% of an ancestral container.
*/
.u-inlineBlock {
  display: inline-block !important;
  max-width: 100%;
  /* 1 */
}
.u-table {
  display: table !important;
}
.u-tableRow {
  display: table-row !important;
}
.u-tableCell {
  display: table-cell !important;
}
.u-flex {
  display: -webkit-box !important;
  display: -ms-flexbox !important;
  display: flex !important;
}
.is-no-flexbox .u-flex {
  display: inline-block !important;
}
/**
* Show/hide depending on Media Query breakpoints. 
*/
@media only screen and (min-width: 0em), print {
  .u-xxsm-hidden {
    display: none !important;
  }
  .u-xxsm-block {
    display: block !important;
  }
  .u-xxsm-inline {
    display: inline !important;
  }
  .u-xxsm-inlineBlock {
    display: inline-block !important;
    max-width: 100%;
    /* 1 */
  }
  .u-xxsm-tableCell {
    display: table-cell !important;
  }
  .u-xxsm-flex {
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
  }
  .is-no-flexbox .u-xxsm-flex {
    display: inline-block !important;
  }
}
@media only screen and (min-width: 26.25em), print {
  .u-xsm-hidden {
    display: none !important;
  }
  .u-xsm-block {
    display: block !important;
  }
  .u-xsm-inline {
    display: inline !important;
  }
  .u-xsm-inlineBlock {
    display: inline-block !important;
    max-width: 100%;
    /* 1 */
  }
  .u-xsm-tableCell {
    display: table-cell !important;
  }
  .u-xsm-flex {
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
  }
  .is-no-flexbox .u-xsm-flex {
    display: inline-block !important;
  }
}
@media only screen and (min-width: 34em), print {
  .u-sm-hidden {
    display: none !important;
  }
  .u-sm-block {
    display: block !important;
  }
  .u-sm-inline {
    display: inline !important;
  }
  .u-sm-inlineBlock {
    display: inline-block !important;
    max-width: 100%;
    /* 1 */
  }
  .u-sm-tableCell {
    display: table-cell !important;
  }
  .u-sm-flex {
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
  }
  .is-no-flexbox .u-sm-flex {
    display: inline-block !important;
  }
}
@media only screen and (min-width: 48em), print {
  .u-md-hidden {
    display: none !important;
  }
  .u-md-block {
    display: block !important;
  }
  .u-md-inline {
    display: inline !important;
  }
  .u-md-inlineBlock {
    display: inline-block !important;
    max-width: 100%;
    /* 1 */
  }
  .u-md-tableCell {
    display: table-cell !important;
  }
  .u-md-flex {
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
  }
  .is-no-flexbox .u-md-flex {
    display: inline-block !important;
  }
}
@media only screen and (min-width: 57.5em), print {
  .u-lg-hidden {
    display: none !important;
  }
  .u-lg-block {
    display: block !important;
  }
  .u-lg-inline {
    display: inline !important;
  }
  .u-lg-inlineBlock {
    display: inline-block !important;
    max-width: 100%;
    /* 1 */
  }
  .u-lg-tableCell {
    display: table-cell !important;
  }
  .u-lg-flex {
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
  }
  .is-no-flexbox .u-lg-flex {
    display: inline-block !important;
  }
}
@media only screen and (min-width: 75em) {
  .u-xlg-hidden {
    display: none !important;
  }
  .u-xlg-block {
    display: block !important;
  }
  .u-xlg-inline {
    display: inline !important;
  }
  .u-xlg-inlineBlock {
    display: inline-block !important;
    max-width: 100%;
    /* 1 */
  }
  .u-xlg-tableCell {
    display: table-cell !important;
  }
  .u-xlg-flex {
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
  }
  .is-no-flexbox .u-xlg-flex {
    display: inline-block !important;
  }
}
/**
 * Contain floats
 *
 * Make an element expand to contain floated children.
 * Uses pseudo-elements (micro clearfix).
 *
 * 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 the
 *    element.
 * 2. The use of `table` rather than `block` is only necessary if using
 *    `:before` to contain the top-margins of child elements.
 */
.u-cf:before,
.u-cf:after {
  content: " ";
  /* 1 */
  display: table;
  /* 2 */
}
.u-cf:after {
  clear: both;
}
/**
 * New block formatting context
 *
 * This affords some useful properties to the element. It won't wrap under
 * floats. Will also contain any floated children.

 * N.B. This will clip overflow. Use the alternative method below if this is
 * problematic.
 */
.u-nbfc {
  overflow: hidden !important;
}
/**
 * Floats
 */
.u-pullLeft {
  float: left !important;
}
.u-pullRight {
  float: right !important;
}
.u-clear {
  clear: both;
}
/**
 * Clean link
 *
 * A link without any text-decoration at all.
 */
.u-linkClean,
.u-linkClean:hover,
.u-linkClean:focus,
.u-linkClean:active {
  text-decoration: none !important;
}
/**
 * Link complex
 *
 * A common pattern is to have a link with several pieces of text and/or an
 * icon, where only one piece of text should display the underline when the
 * link is the subject of user interaction.
 *
 * Example HTML:
 *
 * <a class="u-linkComplex" href="#">
 *   Link complex
 *   <span class="u-linkComplexTarget">target</span>
 * </a>
 */
.u-linkComplex,
.u-linkComplex:hover,
.u-linkComplex:focus,
.u-linkComplex:active {
  text-decoration: none !important;
}
.u-linkComplex:hover .u-linkComplexTarget,
.u-linkComplex:focus .u-linkComplexTarget,
.u-linkComplex:active .u-linkComplexTarget {
  text-decoration: underline !important;
}
/**
 * Block-level link
 *
 * Combination of traits commonly used in vertical navigation lists.
 */
.u-linkBlock,
.u-linkBlock:hover,
.u-linkBlock:focus,
.u-linkBlock:active {
  display: block !important;
  text-decoration: none !important;
}
/**
 * Changes a link to look like plain text.
 */
.u-linkText {
  color: #333;
}
.u-cursorPointer {
  cursor: pointer;
}
/* 
 * Offset Before 
 * .u-xx-before1of2 
 */
/* 
 * Offset After
 * .u-xx-after1of2 
 */
.u-posAbsolute {
  position: absolute !important;
}
/**
 * Pins to all corners by default. But when a width and/or height are
 * provided, the element will be centered in its nearest relatively-positioned
 * ancestor.
 */
.u-posAbsoluteCenter {
  bottom: 0 !important;
  left: 0 !important;
  margin: auto !important;
  position: absolute !important;
  right: 0 !important;
  top: 0 !important;
}
/**
 * 1. Make sure fixed elements are promoted into a new layer, for performance
 *    reasons.
 */
.u-posFixed {
  position: fixed !important;
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
  /* 1 */
}
.u-posRelative {
  position: relative !important;
}
.u-posStatic {
  position: static !important;
}
@media print {
  .u-printHidden {
    display: none !important;
  }
  .u-printSizeFull {
    width: 100% !important;
    display: block !important;
  }
}
/*
    Size Utility
    
    This generates size classes that can be used with the Grid component. 
    The classes are only active from a specified breakpoint.

    For example if you apply .u-md-size1of2 to an element
    it will get width 50% when the screen-width is larger than medium width (@bpMedium).

    Adding another class of .u-lg-size1of4 would mean the element gets 25% when @bpLarge breakpoint gets active.
*/
.u-sizeFull,
.u-size1of1 {
  width: 100% !important;
}
.u-sizeAuto {
  width: auto !important;
}
/**
 * Size utilities
 * .u-size1of4
 * .u-sm-size1of4
 */
/* Intrinsic widths
   ========================================================================== */
/**
     * Make an element the width of its parent.
     */
.u-sizeFull,
.u-size1of1 {
  width: 100% !important;
}
/**
     * Make an element fill the remaining space.
     * N.B. This will hide overflow.
     */
.u-sizeFill {
  display: block !important;
  overflow: hidden !important;
  width: auto !important;
}
/* Proportional widths
       ========================================================================== */
/**
     * Specify the proportional width of an object.
     * Intentional redundancy build into each set of unit classes.
     * Supports: 2, 3, 4, 5, 6, 8, 10, 12 part
     *
     * 1. Use `flex-basis: auto` with a width to avoid box-sizing bug in IE10/11
     *    http://git.io/vllMD
     */
[class*="u-size"] {
  -ms-flex-preferred-size: auto !important;
      flex-basis: auto !important;
  /* 1 */
}
.u-size1of12 {
  width: 8.33333333% !important;
}
.u-size1of10 {
  width: 10% !important;
}
.u-size1of8 {
  width: 12.5% !important;
}
.u-size1of6,
.u-size2of12 {
  width: 16.66666667% !important;
}
.u-size1of5,
.u-size2of10 {
  width: 20% !important;
}
.u-size1of4,
.u-size2of8,
.u-size3of12 {
  width: 25% !important;
}
.u-size3of10 {
  width: 30% !important;
}
.u-size1of3,
.u-size2of6,
.u-size4of12 {
  width: 33.33333333% !important;
}
.u-size3of8 {
  width: 37.5% !important;
}
.u-size2of5,
.u-size4of10 {
  width: 40% !important;
}
.u-size5of12 {
  width: 41.66666667% !important;
}
.u-size1of2,
.u-size2of4,
.u-size3of6,
.u-size4of8,
.u-size5of10,
.u-size6of12 {
  width: 50% !important;
}
.u-size7of12 {
  width: 58.33333333% !important;
}
.u-size3of5,
.u-size6of10 {
  width: 60% !important;
}
.u-size5of8 {
  width: 62.5% !important;
}
.u-size2of3,
.u-size4of6,
.u-size8of12 {
  width: 66.66666667% !important;
}
.u-size7of10 {
  width: 70% !important;
}
.u-size3of4,
.u-size6of8,
.u-size9of12 {
  width: 75% !important;
}
.u-size4of5,
.u-size8of10 {
  width: 80% !important;
}
.u-size5of6,
.u-size10of12 {
  width: 83.33333333% !important;
}
.u-size7of8 {
  width: 87.5% !important;
}
.u-size6of9 {
  width: 66.66666667% !important;
}
.u-size3of9 {
  width: 33.33333333% !important;
}
.u-size9of10 {
  width: 90% !important;
}
.u-size11of12 {
  width: 91.66666667% !important;
}
@media only screen and (min-width: 26.25em), print {
  /* Intrinsic widths
   ========================================================================== */
  /**
     * Make an element the width of its parent.
     */
  .u-xsm-sizeFull,
  .u-xsm-size1of1 {
    width: 100% !important;
  }
  /**
     * Make an element fill the remaining space.
     * N.B. This will hide overflow.
     */
  .u-xsm-sizeFill {
    display: block !important;
    overflow: hidden !important;
    width: auto !important;
  }
  /* Proportional widths
       ========================================================================== */
  /**
     * Specify the proportional width of an object.
     * Intentional redundancy build into each set of unit classes.
     * Supports: 2, 3, 4, 5, 6, 8, 10, 12 part
     *
     * 1. Use `flex-basis: auto` with a width to avoid box-sizing bug in IE10/11
     *    http://git.io/vllMD
     */
  [class*="u-xsm-size"] {
    -ms-flex-preferred-size: auto !important;
        flex-basis: auto !important;
    /* 1 */
  }
  .u-xsm-size1of12 {
    width: 8.33333333% !important;
  }
  .u-xsm-size1of10 {
    width: 10% !important;
  }
  .u-xsm-size1of8 {
    width: 12.5% !important;
  }
  .u-xsm-size1of6,
  .u-xsm-size2of12 {
    width: 16.66666667% !important;
  }
  .u-xsm-size1of5,
  .u-xsm-size2of10 {
    width: 20% !important;
  }
  .u-xsm-size1of4,
  .u-xsm-size2of8,
  .u-xsm-size3of12 {
    width: 25% !important;
  }
  .u-xsm-size3of10 {
    width: 30% !important;
  }
  .u-xsm-size1of3,
  .u-xsm-size2of6,
  .u-xsm-size4of12 {
    width: 33.33333333% !important;
  }
  .u-xsm-size3of8 {
    width: 37.5% !important;
  }
  .u-xsm-size2of5,
  .u-xsm-size4of10 {
    width: 40% !important;
  }
  .u-xsm-size5of12 {
    width: 41.66666667% !important;
  }
  .u-xsm-size1of2,
  .u-xsm-size2of4,
  .u-xsm-size3of6,
  .u-xsm-size4of8,
  .u-xsm-size5of10,
  .u-xsm-size6of12 {
    width: 50% !important;
  }
  .u-xsm-size7of12 {
    width: 58.33333333% !important;
  }
  .u-xsm-size3of5,
  .u-xsm-size6of10 {
    width: 60% !important;
  }
  .u-xsm-size5of8 {
    width: 62.5% !important;
  }
  .u-xsm-size2of3,
  .u-xsm-size4of6,
  .u-xsm-size8of12 {
    width: 66.66666667% !important;
  }
  .u-xsm-size7of10 {
    width: 70% !important;
  }
  .u-xsm-size3of4,
  .u-xsm-size6of8,
  .u-xsm-size9of12 {
    width: 75% !important;
  }
  .u-xsm-size4of5,
  .u-xsm-size8of10 {
    width: 80% !important;
  }
  .u-xsm-size5of6,
  .u-xsm-size10of12 {
    width: 83.33333333% !important;
  }
  .u-xsm-size7of8 {
    width: 87.5% !important;
  }
  .u-xsm-size6of9 {
    width: 66.66666667% !important;
  }
  .u-xsm-size3of9 {
    width: 33.33333333% !important;
  }
  .u-xsm-size9of10 {
    width: 90% !important;
  }
  .u-xsm-size11of12 {
    width: 91.66666667% !important;
  }
}
@media only screen and (min-width: 34em), print {
  /* Intrinsic widths
   ========================================================================== */
  /**
     * Make an element the width of its parent.
     */
  .u-sm-sizeFull,
  .u-sm-size1of1 {
    width: 100% !important;
  }
  /**
     * Make an element fill the remaining space.
     * N.B. This will hide overflow.
     */
  .u-sm-sizeFill {
    display: block !important;
    overflow: hidden !important;
    width: auto !important;
  }
  /* Proportional widths
       ========================================================================== */
  /**
     * Specify the proportional width of an object.
     * Intentional redundancy build into each set of unit classes.
     * Supports: 2, 3, 4, 5, 6, 8, 10, 12 part
     *
     * 1. Use `flex-basis: auto` with a width to avoid box-sizing bug in IE10/11
     *    http://git.io/vllMD
     */
  [class*="u-sm-size"] {
    -ms-flex-preferred-size: auto !important;
        flex-basis: auto !important;
    /* 1 */
  }
  .u-sm-size1of12 {
    width: 8.33333333% !important;
  }
  .u-sm-size1of10 {
    width: 10% !important;
  }
  .u-sm-size1of8 {
    width: 12.5% !important;
  }
  .u-sm-size1of6,
  .u-sm-size2of12 {
    width: 16.66666667% !important;
  }
  .u-sm-size1of5,
  .u-sm-size2of10 {
    width: 20% !important;
  }
  .u-sm-size1of4,
  .u-sm-size2of8,
  .u-sm-size3of12 {
    width: 25% !important;
  }
  .u-sm-size3of10 {
    width: 30% !important;
  }
  .u-sm-size1of3,
  .u-sm-size2of6,
  .u-sm-size4of12 {
    width: 33.33333333% !important;
  }
  .u-sm-size3of8 {
    width: 37.5% !important;
  }
  .u-sm-size2of5,
  .u-sm-size4of10 {
    width: 40% !important;
  }
  .u-sm-size5of12 {
    width: 41.66666667% !important;
  }
  .u-sm-size1of2,
  .u-sm-size2of4,
  .u-sm-size3of6,
  .u-sm-size4of8,
  .u-sm-size5of10,
  .u-sm-size6of12 {
    width: 50% !important;
  }
  .u-sm-size7of12 {
    width: 58.33333333% !important;
  }
  .u-sm-size3of5,
  .u-sm-size6of10 {
    width: 60% !important;
  }
  .u-sm-size5of8 {
    width: 62.5% !important;
  }
  .u-sm-size2of3,
  .u-sm-size4of6,
  .u-sm-size8of12 {
    width: 66.66666667% !important;
  }
  .u-sm-size7of10 {
    width: 70% !important;
  }
  .u-sm-size3of4,
  .u-sm-size6of8,
  .u-sm-size9of12 {
    width: 75% !important;
  }
  .u-sm-size4of5,
  .u-sm-size8of10 {
    width: 80% !important;
  }
  .u-sm-size5of6,
  .u-sm-size10of12 {
    width: 83.33333333% !important;
  }
  .u-sm-size7of8 {
    width: 87.5% !important;
  }
  .u-sm-size6of9 {
    width: 66.66666667% !important;
  }
  .u-sm-size3of9 {
    width: 33.33333333% !important;
  }
  .u-sm-size9of10 {
    width: 90% !important;
  }
  .u-sm-size11of12 {
    width: 91.66666667% !important;
  }
}
@media only screen and (min-width: 48em), print {
  /* Intrinsic widths
   ========================================================================== */
  /**
     * Make an element the width of its parent.
     */
  .u-md-sizeFull,
  .u-md-size1of1 {
    width: 100% !important;
  }
  /**
     * Make an element fill the remaining space.
     * N.B. This will hide overflow.
     */
  .u-md-sizeFill {
    display: block !important;
    overflow: hidden !important;
    width: auto !important;
  }
  /* Proportional widths
       ========================================================================== */
  /**
     * Specify the proportional width of an object.
     * Intentional redundancy build into each set of unit classes.
     * Supports: 2, 3, 4, 5, 6, 8, 10, 12 part
     *
     * 1. Use `flex-basis: auto` with a width to avoid box-sizing bug in IE10/11
     *    http://git.io/vllMD
     */
  [class*="u-md-size"] {
    -ms-flex-preferred-size: auto !important;
        flex-basis: auto !important;
    /* 1 */
  }
  .u-md-size1of12 {
    width: 8.33333333% !important;
  }
  .u-md-size1of10 {
    width: 10% !important;
  }
  .u-md-size1of8 {
    width: 12.5% !important;
  }
  .u-md-size1of6,
  .u-md-size2of12 {
    width: 16.66666667% !important;
  }
  .u-md-size1of5,
  .u-md-size2of10 {
    width: 20% !important;
  }
  .u-md-size1of4,
  .u-md-size2of8,
  .u-md-size3of12 {
    width: 25% !important;
  }
  .u-md-size3of10 {
    width: 30% !important;
  }
  .u-md-size1of3,
  .u-md-size2of6,
  .u-md-size4of12 {
    width: 33.33333333% !important;
  }
  .u-md-size3of8 {
    width: 37.5% !important;
  }
  .u-md-size2of5,
  .u-md-size4of10 {
    width: 40% !important;
  }
  .u-md-size5of12 {
    width: 41.66666667% !important;
  }
  .u-md-size1of2,
  .u-md-size2of4,
  .u-md-size3of6,
  .u-md-size4of8,
  .u-md-size5of10,
  .u-md-size6of12 {
    width: 50% !important;
  }
  .u-md-size7of12 {
    width: 58.33333333% !important;
  }
  .u-md-size3of5,
  .u-md-size6of10 {
    width: 60% !important;
  }
  .u-md-size5of8 {
    width: 62.5% !important;
  }
  .u-md-size2of3,
  .u-md-size4of6,
  .u-md-size8of12 {
    width: 66.66666667% !important;
  }
  .u-md-size7of10 {
    width: 70% !important;
  }
  .u-md-size3of4,
  .u-md-size6of8,
  .u-md-size9of12 {
    width: 75% !important;
  }
  .u-md-size4of5,
  .u-md-size8of10 {
    width: 80% !important;
  }
  .u-md-size5of6,
  .u-md-size10of12 {
    width: 83.33333333% !important;
  }
  .u-md-size7of8 {
    width: 87.5% !important;
  }
  .u-md-size6of9 {
    width: 66.66666667% !important;
  }
  .u-md-size3of9 {
    width: 33.33333333% !important;
  }
  .u-md-size9of10 {
    width: 90% !important;
  }
  .u-md-size11of12 {
    width: 91.66666667% !important;
  }
}
@media only screen and (min-width: 57.5em), print {
  /* Intrinsic widths
   ========================================================================== */
  /**
     * Make an element the width of its parent.
     */
  .u-lg-sizeFull,
  .u-lg-size1of1 {
    width: 100% !important;
  }
  /**
     * Make an element fill the remaining space.
     * N.B. This will hide overflow.
     */
  .u-lg-sizeFill {
    display: block !important;
    overflow: hidden !important;
    width: auto !important;
  }
  /* Proportional widths
       ========================================================================== */
  /**
     * Specify the proportional width of an object.
     * Intentional redundancy build into each set of unit classes.
     * Supports: 2, 3, 4, 5, 6, 8, 10, 12 part
     *
     * 1. Use `flex-basis: auto` with a width to avoid box-sizing bug in IE10/11
     *    http://git.io/vllMD
     */
  [class*="u-lg-size"] {
    -ms-flex-preferred-size: auto !important;
        flex-basis: auto !important;
    /* 1 */
  }
  .u-lg-size1of12 {
    width: 8.33333333% !important;
  }
  .u-lg-size1of10 {
    width: 10% !important;
  }
  .u-lg-size1of8 {
    width: 12.5% !important;
  }
  .u-lg-size1of6,
  .u-lg-size2of12 {
    width: 16.66666667% !important;
  }
  .u-lg-size1of5,
  .u-lg-size2of10 {
    width: 20% !important;
  }
  .u-lg-size1of4,
  .u-lg-size2of8,
  .u-lg-size3of12 {
    width: 25% !important;
  }
  .u-lg-size3of10 {
    width: 30% !important;
  }
  .u-lg-size1of3,
  .u-lg-size2of6,
  .u-lg-size4of12 {
    width: 33.33333333% !important;
  }
  .u-lg-size3of8 {
    width: 37.5% !important;
  }
  .u-lg-size2of5,
  .u-lg-size4of10 {
    width: 40% !important;
  }
  .u-lg-size5of12 {
    width: 41.66666667% !important;
  }
  .u-lg-size1of2,
  .u-lg-size2of4,
  .u-lg-size3of6,
  .u-lg-size4of8,
  .u-lg-size5of10,
  .u-lg-size6of12 {
    width: 50% !important;
  }
  .u-lg-size7of12 {
    width: 58.33333333% !important;
  }
  .u-lg-size3of5,
  .u-lg-size6of10 {
    width: 60% !important;
  }
  .u-lg-size5of8 {
    width: 62.5% !important;
  }
  .u-lg-size2of3,
  .u-lg-size4of6,
  .u-lg-size8of12 {
    width: 66.66666667% !important;
  }
  .u-lg-size7of10 {
    width: 70% !important;
  }
  .u-lg-size3of4,
  .u-lg-size6of8,
  .u-lg-size9of12 {
    width: 75% !important;
  }
  .u-lg-size4of5,
  .u-lg-size8of10 {
    width: 80% !important;
  }
  .u-lg-size5of6,
  .u-lg-size10of12 {
    width: 83.33333333% !important;
  }
  .u-lg-size7of8 {
    width: 87.5% !important;
  }
  .u-lg-size6of9 {
    width: 66.66666667% !important;
  }
  .u-lg-size3of9 {
    width: 33.33333333% !important;
  }
  .u-lg-size9of10 {
    width: 90% !important;
  }
  .u-lg-size11of12 {
    width: 91.66666667% !important;
  }
}
@media only screen and (min-width: 75em) {
  /* Intrinsic widths
   ========================================================================== */
  /**
     * Make an element the width of its parent.
     */
  .u-xlg-sizeFull,
  .u-xlg-size1of1 {
    width: 100% !important;
  }
  /**
     * Make an element fill the remaining space.
     * N.B. This will hide overflow.
     */
  .u-xlg-sizeFill {
    display: block !important;
    overflow: hidden !important;
    width: auto !important;
  }
  /* Proportional widths
       ========================================================================== */
  /**
     * Specify the proportional width of an object.
     * Intentional redundancy build into each set of unit classes.
     * Supports: 2, 3, 4, 5, 6, 8, 10, 12 part
     *
     * 1. Use `flex-basis: auto` with a width to avoid box-sizing bug in IE10/11
     *    http://git.io/vllMD
     */
  [class*="u-xlg-size"] {
    -ms-flex-preferred-size: auto !important;
        flex-basis: auto !important;
    /* 1 */
  }
  .u-xlg-size1of12 {
    width: 8.33333333% !important;
  }
  .u-xlg-size1of10 {
    width: 10% !important;
  }
  .u-xlg-size1of8 {
    width: 12.5% !important;
  }
  .u-xlg-size1of6,
  .u-xlg-size2of12 {
    width: 16.66666667% !important;
  }
  .u-xlg-size1of5,
  .u-xlg-size2of10 {
    width: 20% !important;
  }
  .u-xlg-size1of4,
  .u-xlg-size2of8,
  .u-xlg-size3of12 {
    width: 25% !important;
  }
  .u-xlg-size3of10 {
    width: 30% !important;
  }
  .u-xlg-size1of3,
  .u-xlg-size2of6,
  .u-xlg-size4of12 {
    width: 33.33333333% !important;
  }
  .u-xlg-size3of8 {
    width: 37.5% !important;
  }
  .u-xlg-size2of5,
  .u-xlg-size4of10 {
    width: 40% !important;
  }
  .u-xlg-size5of12 {
    width: 41.66666667% !important;
  }
  .u-xlg-size1of2,
  .u-xlg-size2of4,
  .u-xlg-size3of6,
  .u-xlg-size4of8,
  .u-xlg-size5of10,
  .u-xlg-size6of12 {
    width: 50% !important;
  }
  .u-xlg-size7of12 {
    width: 58.33333333% !important;
  }
  .u-xlg-size3of5,
  .u-xlg-size6of10 {
    width: 60% !important;
  }
  .u-xlg-size5of8 {
    width: 62.5% !important;
  }
  .u-xlg-size2of3,
  .u-xlg-size4of6,
  .u-xlg-size8of12 {
    width: 66.66666667% !important;
  }
  .u-xlg-size7of10 {
    width: 70% !important;
  }
  .u-xlg-size3of4,
  .u-xlg-size6of8,
  .u-xlg-size9of12 {
    width: 75% !important;
  }
  .u-xlg-size4of5,
  .u-xlg-size8of10 {
    width: 80% !important;
  }
  .u-xlg-size5of6,
  .u-xlg-size10of12 {
    width: 83.33333333% !important;
  }
  .u-xlg-size7of8 {
    width: 87.5% !important;
  }
  .u-xlg-size6of9 {
    width: 66.66666667% !important;
  }
  .u-xlg-size3of9 {
    width: 33.33333333% !important;
  }
  .u-xlg-size9of10 {
    width: 90% !important;
  }
  .u-xlg-size11of12 {
    width: 91.66666667% !important;
  }
}
/*
    Change the default spacing between and inside components.

    Example HTML: 

    <div class="u-marginTlg u-marginBmd"> 			// large margin-top and medium margin-bottom
        <h1 class="u-marginTz">Hello World</h1>		// zero margin-top
    </div>

    Directions:
        A = all
        T = top 
        B = bottom
        R = right
        L = left
        H = horizontal (right and left)
        V = vertical (top and bottom)

    Sizes:
        z  = zero
        xsm = xsmall
        sm  = small
        md  = medium
        lg  = large
        xlg = xlarge
*/
/* stylelint-disable rule-non-nested-empty-line-before */
/** 
 * Margins, .u-margin{direction}{size}
 */
.u-marginAuto {
  margin: auto !important;
}
.u-marginAz {
  margin: 0 !important;
}
.u-marginTz {
  margin-top: 0 !important;
}
.u-marginBz {
  margin-bottom: 0 !important;
}
.u-marginRz {
  margin-right: 0 !important;
}
.u-marginLz {
  margin-left: 0 !important;
}
.u-marginHz {
  margin-left: 0 !important;
  margin-right: 0 !important;
}
.u-marginVz {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}
.u-marginAxsm {
  margin: 0.625em !important;
}
.u-marginAsm {
  margin: 0.83333333em !important;
}
.u-marginAmd,
.u-marginA {
  margin: 1.25em !important;
}
.u-marginAlg {
  margin: 1.875em !important;
}
.u-marginAxlg {
  margin: 2.5em !important;
}
.u-marginHxsm {
  margin-left: 0.625em !important;
  margin-right: 0.625em !important;
}
.u-marginHsm {
  margin-left: 0.83333333em !important;
  margin-right: 0.83333333em !important;
}
.u-marginHmd,
.u-marginH {
  margin-left: 1.25em !important;
  margin-right: 1.25em !important;
}
.u-marginHlg {
  margin-left: 1.875em !important;
  margin-right: 1.875em !important;
}
.u-marginHxlg {
  margin-left: 2.5em !important;
  margin-right: 2.5em !important;
}
.u-marginVxsm {
  margin-top: 0.625em !important;
  margin-bottom: 0.625em !important;
}
.u-marginVsm {
  margin-top: 0.83333333em !important;
  margin-bottom: 0.83333333em !important;
}
.u-marginVmd,
.u-marginV {
  margin-top: 1.25em !important;
  margin-bottom: 1.25em !important;
}
.u-marginVlg {
  margin-top: 1.875em !important;
  margin-bottom: 1.875em !important;
}
.u-marginVxlg {
  margin-top: 2.5em !important;
  margin-bottom: 2.5em !important;
}
.u-marginTxsm {
  margin-top: 0.625em !important;
}
.u-marginTsm {
  margin-top: 0.83333333em !important;
}
.u-marginTmd,
.u-marginT {
  margin-top: 1.25em !important;
}
.u-marginTlg {
  margin-top: 1.875em !important;
}
.u-marginTxlg {
  margin-top: 2.5em !important;
}
.u-marginBxsm {
  margin-bottom: 0.625em !important;
}
.u-marginBsm {
  margin-bottom: 0.83333333em !important;
}
.u-marginBmd,
.u-marginB {
  margin-bottom: 1.25em !important;
}
.u-marginBlg {
  margin-bottom: 1.875em !important;
}
.u-marginBxlg {
  margin-bottom: 2.5em !important;
}
.u-marginRxsm {
  margin-right: 0.625em !important;
}
.u-marginRsm {
  margin-right: 0.83333333em !important;
}
.u-marginRmd,
.u-marginR {
  margin-right: 1.25em !important;
}
.u-marginRlg {
  margin-right: 1.875em !important;
}
.u-marginRxlg {
  margin-right: 2.5em !important;
}
.u-marginLxsm {
  margin-left: 0.625em !important;
}
.u-marginLsm {
  margin-left: 0.83333333em !important;
}
.u-marginLmd,
.u-marginL {
  margin-left: 1.25em !important;
}
.u-marginLlg {
  margin-left: 1.875em !important;
}
.u-marginLxlg {
  margin-left: 2.5em !important;
}
/** 
 * Paddings, .u-padding{direction}{size}
 */
.u-paddingSpTeaser {
  padding: 5%;
}
.u-paddingAz {
  padding: 0 !important;
}
.u-paddingTz {
  padding-top: 0 !important;
}
.u-paddingBz {
  padding-bottom: 0 !important;
}
.u-paddingRz {
  padding-right: 0 !important;
}
.u-paddingLz {
  padding-left: 0 !important;
}
.u-paddingHz {
  padding-left: 0 !important;
  padding-right: 0 !important;
}
.u-paddingVz {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}
.u-paddingAxsm {
  padding: 0.625em !important;
}
.u-paddingAsm {
  padding: 0.83333333em !important;
}
.u-paddingAmd,
.u-paddingA {
  padding: 1.25em !important;
}
.u-paddingAlg {
  padding: 1.875em !important;
}
.u-paddingAxlg {
  padding: 2.5em !important;
}
.u-paddingHxsm {
  padding-left: 0.625em !important;
  padding-right: 0.625em !important;
}
.u-paddingHsm {
  padding-left: 0.83333333em !important;
  padding-right: 0.83333333em !important;
}
.u-paddingHmd,
.u-paddingH {
  padding-left: 1.25em !important;
  padding-right: 1.25em !important;
}
.u-paddingHlg {
  padding-left: 1.875em !important;
  padding-right: 1.875em !important;
}
.u-paddingHxlg {
  padding-left: 2.5em !important;
  padding-right: 2.5em !important;
}
.u-paddingVxsm {
  padding-top: 0.625em !important;
  padding-bottom: 0.625em !important;
}
.u-paddingVsm {
  padding-top: 0.83333333em !important;
  padding-bottom: 0.83333333em !important;
}
.u-paddingVmd,
.u-paddingV {
  padding-top: 1.25em !important;
  padding-bottom: 1.25em !important;
}
.u-paddingVlg {
  padding-top: 1.875em !important;
  padding-bottom: 1.875em !important;
}
.u-paddingVxlg {
  padding-top: 2.5em !important;
  padding-bottom: 2.5em !important;
}
.u-paddingTxsm {
  padding-top: 0.625em !important;
}
.u-paddingTsm {
  padding-top: 0.83333333em !important;
}
.u-paddingTmd,
.u-paddingT {
  padding-top: 1.25em !important;
}
.u-paddingTlg {
  padding-top: 1.875em !important;
}
.u-paddingTxlg {
  padding-top: 2.5em !important;
}
.u-paddingBxsm {
  padding-bottom: 0.625em !important;
}
.u-paddingBsm {
  padding-bottom: 0.83333333em !important;
}
.u-paddingBmd,
.u-paddingB {
  padding-bottom: 1.25em !important;
}
.u-paddingBlg {
  padding-bottom: 1.875em !important;
}
.u-paddingBxlg {
  padding-bottom: 2.5em !important;
}
.u-paddingRxsm {
  padding-right: 0.625em !important;
}
.u-paddingRsm {
  padding-right: 0.83333333em !important;
}
.u-paddingRmd,
.u-paddingR {
  padding-right: 1.25em !important;
}
.u-paddingRlg {
  padding-right: 1.875em !important;
}
.u-paddingRxlg {
  padding-right: 2.5em !important;
}
.u-paddingLxsm {
  padding-left: 0.625em !important;
}
.u-paddingLsm {
  padding-left: 0.83333333em !important;
}
.u-paddingLmd,
.u-paddingL {
  padding-left: 1.25em !important;
}
.u-paddingLlg {
  padding-left: 1.875em !important;
}
.u-paddingLxlg {
  padding-left: 2.5em !important;
}
/** 
 * Collapsing margins
 * Negative margins to pull content beyond paddings, using e.g. margin-top: -1em;
 */
.u-pullHxsm {
  margin-left: -0.625em !important;
  margin-right: -0.625em !important;
}
.u-pullHsm {
  margin-left: -0.83333333em !important;
  margin-right: -0.83333333em !important;
}
.u-pullHmd,
.u-pullH {
  margin-left: -1.25em !important;
  margin-right: -1.25em !important;
}
.u-pullHlg {
  margin-left: -1.875em !important;
  margin-right: -1.875em !important;
}
.u-pullHxlg {
  margin-left: -2.5em !important;
  margin-right: -2.5em !important;
}
.u-pullVxsm {
  margin-top: -0.625em !important;
  margin-bottom: -0.625em !important;
}
.u-pullVsm {
  margin-top: -0.83333333em !important;
  margin-bottom: -0.83333333em !important;
}
.u-pullVmd,
.u-pullV {
  margin-top: -1.25em !important;
  margin-bottom: -1.25em !important;
}
.u-pullVlg {
  margin-top: -1.875em !important;
  margin-bottom: -1.875em !important;
}
.u-pullVxlg {
  margin-top: -2.5em !important;
  margin-bottom: -2.5em !important;
}
.u-pullTxsm {
  margin-top: -0.625em;
}
.u-pullTsm {
  margin-top: -0.83333333em;
}
.u-pullTmd,
.u-pullT {
  margin-top: -1.25em;
}
.u-pullTlg {
  margin-top: -1.875em;
}
.u-pullTxlg {
  margin-top: -2.5em;
}
/**
 * Mixins used to generate classes.
 */
/* stylelint-enable */
/**
 * Text font size.
 */
.u-textXSmall {
  font-size: 1.125em !important;
}
.u-textSmall {
  font-size: 1.25em !important;
}
.u-textMedium,
.u-textNormal {
  font-size: 2em !important;
}
.u-textLarge {
  font-size: 2.5em !important;
}
.u-textXLarge {
  font-size: 3.5em !important;
}
/**
 * Text font weights
 */
.u-textWeightThin {
  font-weight: 100 !important;
}
.u-textWeightLight {
  font-weight: 200 !important;
}
.u-textWeightNormal {
  font-weight: normal !important;
}
.u-textWeightMedium {
  font-weight: 500 !important;
}
.u-textWeightHeavy {
  font-weight: 600 !important;
}
.u-textWeightBold {
  font-weight: bold !important;
}
/**
 * Word breaking
 *
 * Break strings when their length exceeds the width of their container.
 */
.u-textBreak {
  word-wrap: break-word !important;
}
/**
 * Horizontal text alignment
 */
.u-textCenter {
  text-align: center !important;
}
.u-textCenter ul li {
  text-align: left;
}
.u-textLeft {
  text-align: left !important;
}
.u-textRight {
  text-align: right !important;
}
/**
 * Prevent whitespace wrapping
 */
.u-textNoWrap {
  white-space: nowrap !important;
}
/**
 * Text truncation
 *
 * Prevent text from wrapping onto multiple lines, and truncate with an
 * ellipsis.
 *
 * 1. Ensure that the node has a maximum width after which truncation can
 *    occur.
 * 2. Fix for IE 8/9 if `word-wrap: break-word` is in effect on ancestor
 *    nodes.
 */
.u-textTruncate {
  max-width: 100%;
  /* 1 */
  overflow: hidden !important;
  -o-text-overflow: ellipsis !important;
     text-overflow: ellipsis !important;
  white-space: nowrap !important;
  word-wrap: normal !important;
  /* 2 */
}
/*
 * Inherit the ancestor's text color.
 */
.u-textInheritColor {
  color: inherit !important;
}
.u-border {
  border: 1px solid #dddddd;
}
.u-textUppercase {
  text-transform: uppercase;
}
.u-textNoUnderline:hover {
  text-decoration: none;
}
.u-textLargeNum {
  font-size: 68px;
  font-weight: 900;
}
/**
 * Vertical alignment utilities
 * Depends on an appropriate `display` value.
 */
.u-showHide {
  display: none !important;
}
.u-showHide.is-active {
  display: block !important;
}
/*#


*/
.AspectRatio {
  position: relative;
}
.AspectRatio--1by1:before {
  content: "";
  display: block;
  padding-bottom: 100%;
}
.AspectRatio--4by3:before {
  content: "";
  display: block;
  padding-bottom: 75%;
}
.AspectRatio--3by2:before {
  content: "";
  display: block;
  padding-bottom: 66.66%;
}
.AspectRatio--8by5:before {
  content: "";
  display: block;
  padding-bottom: 62.5%;
}
.AspectRatio--16by9:before {
  content: "";
  display: block;
  padding-bottom: 56.25%;
}
.AspectRatio--21by9:before {
  content: "";
  display: block;
  padding-bottom: 42.8571%;
}
.AspectRatio > * {
  position: absolute !important;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  height: 100% !important;
  width: 100% !important;
}
/*#

Display badges with optional arrow pointing in any of following directions: top, bottom, right, left. 
The badge can display borders using Badge--bordered.

Examples:

<div>
    <span class="Badge Badge--arrowTop">The content of the badge.</span>
    <span class="Badge Badge--arrowRight">The content of the badge.</span>
    <span class="Badge Badge--arrowBottom">The content of the badge.</span>
    <span class="Badge Badge--arrowLeft">The content of the badge.</span>
    
    <b>Bordered:<br></b>
    <span class="Badge Badge--bordered Badge--arrowTop">The content of the badge.</span>
    <span class="Badge Badge--bordered Badge--arrowRight">The content of the badge.</span>
    <span class="Badge Badge--bordered Badge--arrowBottom">The content of the badge.</span>
    <span class="Badge Badge--bordered Badge--arrowLeft">The content of the badge.</span>
</div>

*/
.Badge {
  background: #ddd;
  border: 1px solid #ddd;
  display: inline-block;
  font-size: 1.125em;
  position: relative;
  padding: 0.625em;
  border-radius: 3px;
}
.Badge:before {
  content: "";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
  border: solid transparent;
  border-color: transparent;
  border-width: 8px;
}
.Badge--arrowTop {
  margin-top: 11px;
}
.Badge--arrowTop:before {
  bottom: 100%;
  left: 50%;
  border-bottom-color: #ddd;
  margin-left: -8px;
}
.Badge--arrowBottom {
  margin-bottom: 11px;
}
.Badge--arrowBottom:before {
  top: 100%;
  left: 50%;
  border-top-color: #ddd;
  margin-left: -8px;
}
.Badge--arrowRight {
  margin-right: 11px;
}
.Badge--arrowRight:before {
  left: 100%;
  top: 50%;
  border-left-color: #ddd;
  margin-top: -8px;
}
.Badge--arrowLeft {
  margin-left: 11px;
}
.Badge--arrowLeft:before {
  right: 100%;
  top: 50%;
  border-right-color: #ddd;
  margin-top: -8px;
}
.Badge--bordered {
  background: #fff;
}
.Badge--bordered:after {
  content: "";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
  border: solid transparent;
  border-color: transparent;
  border-width: 7px;
}
.Badge--bordered.Badge--arrowTop:after {
  bottom: 100%;
  left: 50%;
  border-bottom-color: #fff;
  margin-left: -7px;
}
.Badge--bordered.Badge--arrowBottom:after {
  top: 100%;
  left: 50%;
  border-top-color: #fff;
  margin-left: -7px;
}
.Badge--bordered.Badge--arrowRight:after {
  left: 100%;
  top: 50%;
  border-left-color: #fff;
  margin-top: -7px;
}
.Badge--bordered.Badge--arrowLeft:after {
  right: 100%;
  top: 50%;
  border-right-color: #fff;
  margin-top: -7px;
}
.BgOverlay img {
  height: auto;
  width: 100%;
}
.BgOverlay:after {
  /*mix-blend-mode: multiply;*/
  opacity: 0.8;
  -webkit-box-shadow: none;
          box-shadow: none;
  content: '';
  display: block;
  position: absolute;
  top: 0;
  width: 100%;
  height: 100%;
}
.BgOverlay--Blue:after {
  background-color: #009fdf;
}
.BgOverlay--DarkBlue:after {
  background-color: #002d72;
}
.BgOverlay--Green:after {
  background-color: #78be20;
}
.BgOverlay--Purple:after {
  background-color: #7a4183;
}
.BgOverlay--Pink:after {
  background-color: #EA7EB4;
}
.BgOverlay--Yellow:after {
  background-color: yellow;
}
.BgOverlay--White:after {
  background-color: #ffffff;
}
.BgOverlay-opacity:after {
  mix-blend-mode: inherit;
  opacity: 0.5;
}
@media only screen and (min-width: 48em), print {
  .BgOverlay {
    height: 100%;
  }
}
/*#

The button classes are best applied to links and buttons.
These components can be used in forms, as calls to action, or as part of the general UI of the site/app.

Examples:

<div>
    <button class="Button">Button</button> 
    <a href="#" class="Button">Link Button</a>
</div>

*/
.Button {
  background: #009fdf;
  cursor: pointer;
  display: inline-block;
  margin: 0;
  position: relative;
  text-align: center;
  text-decoration: none;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  font-size: inherit;
  line-height: 1em;
  vertical-align: middle;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  white-space: normal;
  color: #ffffff;
  padding: 1.5em 2.5em;
  border: none;
  width: 100%;
  -webkit-transition: background ease-in-out 0.2s;
  -o-transition: background ease-in-out 0.2s;
  transition: background ease-in-out 0.2s;
}
.Button:hover,
.Button.is-active {
  background: #002d72;
  text-decoration: none;
  color: #fff;
}
.Button:focus {
  outline: none;
  -webkit-box-shadow: 0 0 1px 1px #009fdf;
          box-shadow: 0 0 1px 1px #009fdf;
}
.Button:disabled {
  opacity: 0.5;
}
.no .Button-cta {
  font-weight: bold;
}
.no .Button-cta--secondary,
.no .Push-actions .Button-cta--secondary {
  background-color: #ffffff;
  color: #009fdf !important;
  border: solid 2px #009fdf;
  border-radius: 34px;
}
.no .Button-cta--secondary:hover:hover,
.no .Push-actions .Button-cta--secondary:hover:hover,
.no .Button-cta--secondary.is-active:hover,
.no .Push-actions .Button-cta--secondary.is-active:hover,
.no .Button-cta--secondary:hover.is-active,
.no .Push-actions .Button-cta--secondary:hover.is-active,
.no .Button-cta--secondary.is-active.is-active,
.no .Push-actions .Button-cta--secondary.is-active.is-active {
  background: #002d72;
  text-decoration: none;
  color: #fff !important;
}
@media only screen and (min-width: 48em), print {
  .Button {
    width: auto;
  }
}
.Button--small {
  padding: 0.5em 1em;
  background-color: #ffffff;
  color: #009fdf;
  border: 1px solid #009fdf;
  width: auto;
  margin-bottom: 0.3em;
}
.Button--small .is-active {
  background: #002d72;
  color: #ffffff;
}
.Button--full {
  padding-left: 0.3em;
  padding-right: 0.3em;
  width: 100%;
}
.Button-ghost {
  border-color: #000;
  color: #000;
  background-color: transparent;
  padding: 0.8em 1.5em;
}
.Button-ghost:hover {
  background: #002d72;
  border-color: #002d72;
  color: #fff;
}
.Button-menu {
  border-color: #333;
  color: #000;
  background-color: transparent;
  padding: 0.8em 1.5em;
}
.Button-menu:hover {
  background: #002d72;
  border-color: #002d72;
  color: #fff;
}
.Button--white {
  background-color: #ffffff;
  color: #333;
}
.Button--rounded {
  border-radius: 2em;
}
.Button--border {
  border-width: 2px;
  border-style: solid;
}
.ButtonContainer {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.ButtonContainer.ButtonContainer--left .Button {
  -ms-flex-item-align: start;
      align-self: flex-start;
}
.ButtonContainer.ButtonContainer--center .Button {
  margin: 0 auto;
}
.ButtonContainer.ButtonContainer--right {
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
      -ms-flex-direction: row-reverse;
          flex-direction: row-reverse;
}
.ButtonContainer.ButtonContainer--right .Button {
  -ms-flex-item-align: end;
      align-self: flex-end;
}
.LoadMoreButton {
  display: inline-block;
}
/*.EPiServerForms .Form__NavigationBar button.Form__NavigationBar__Action{
    background: #fff !important;
    cursor: pointer!important;
    display: inline-block!important;
    margin: 0!important;
    position: relative!important;
    text-align: center!important;
    text-decoration: none!important;
    user-select: none!important;
    font-size: inherit!important;
    line-height: 1em!important; // adjusts so that link button and <button> is equal height
    vertical-align!important: middle;
    appearance: none!important;
    white-space: normal!important;

    // styling
    color: @colorBlue !important;
    padding: 1.5em 2.5em!important;
    border: none!important; // every button type have borders so that they are all in the same height
    
    -webkit-transition: background-color ease-in-out .2s;
    -moz-transition: background-color ease-in-out .2s;
    -o-transition: background-color ease-in-out .2s;
    transition: background-color ease-in-out .2s;

    &:hover, &.is-active {
        background-color: @colorDarkBlue!important;
        text-decoration: none!important;
        color: #fff!important;
    }
    
    &:focus {
        outline: none;
        box-shadow: 0 0 1px 1px @colorFocus!important;
    }
    
    &:disabled {
        opacity: 0.5!important;
    }
}*/
/*#

Styling for custom checkboxes. Supports focus and disabled states.

Examples:

<div>
    <span class="Checkbox u-marginRsm">
        <input id="cb11" type="checkbox" name="newsletter" class="Checkbox-input">
        <label for="cb11" class="Checkbox-label">Tech newsletter</label>
    </span>

    <span class="Checkbox u-marginRsm">
        <input id="cb33" type="checkbox" name="newsletter" class="Checkbox-input" disabled>
        <label for="cb33" class="Checkbox-label">Disabled newsletter</label>
    </span>
</div>

*/
.Checkbox {
  position: relative;
  display: inline-block;
}
.Checkbox .Checkbox-input:disabled + .Checkbox-label,
.Checkbox.is-disabled .Checkbox-label {
  opacity: 0.5;
  cursor: not-allowed;
}
.Checkbox-input {
  opacity: 0;
  position: absolute;
}
.Checkbox-input:checked + .Checkbox-label:after {
  -webkit-transform: scale(0.7);
      -ms-transform: scale(0.7);
          transform: scale(0.7);
  opacity: 1;
}
.Checkbox-input:focus + .Checkbox-label:before {
  -webkit-box-shadow: 0 0 1px 1px #009fdf;
          box-shadow: 0 0 1px 1px #009fdf;
}
.Checkbox-label {
  padding-left: 1.5em;
  position: relative;
  cursor: pointer;
}
.Checkbox-label:before {
  content: " ";
  position: absolute;
  left: 0;
  top: 0.2em;
  width: 1em;
  height: 1em;
  display: block;
  background: white;
  border: 2px solid #ddd;
  border-radius: 3px;
}
.Checkbox-label:after {
  content: " ";
  position: absolute;
  left: 0;
  top: 0.2em;
  width: 1em;
  height: 1em;
  display: inline-block;
  z-index: 1;
  background: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjE4MS4yIDI3MyAxNyAxNiIgZW5hYmxlLWJhY2tncm91bmQ9Im5ldyAxODEuMiAyNzMgMTcgMTYiPjxwYXRoIGQ9Ik0tMzA2LjMgNTEuMmwtMTEzLTExM2MtOC42LTguNi0yNC04LjYtMzQuMyAwbC01MDYuOSA1MDYuOS0yMTIuNC0yMTIuNGMtOC42LTguNi0yNC04LjYtMzQuMyAwbC0xMTMgMTEzYy04LjYgOC42LTguNiAyNCAwIDM0LjNsMjMxLjIgMjMxLjIgMTEzIDExM2M4LjYgOC42IDI0IDguNiAzNC4zIDBsMTEzLTExMyA1MjQtNTI0YzctMTAuMyA3LTI1LjctMS42LTM2eiIvPjxwYXRoIGZpbGw9IiMzNzM3MzciIGQ9Ik0xOTcuNiAyNzcuMmwtMS42LTEuNmMtLjEtLjEtLjMtLjEtLjUgMGwtNy40IDcuNC0zLjEtMy4xYy0uMS0uMS0uMy0uMS0uNSAwbC0xLjYgMS42Yy0uMS4xLS4xLjMgMCAuNWwzLjMgMy4zIDEuNiAxLjZjLjEuMS4zLjEuNSAwbDEuNi0xLjYgNy42LTcuNmMuMy0uMS4zLS4zLjEtLjV6Ii8+PHBhdGggZD0iTTExODcuMSAxNDMuN2wtNTYuNS01Ni41Yy01LjEtNS4xLTEyLTUuMS0xNy4xIDBsLTI1My41IDI1My41LTEwNi4yLTEwNi4yYy01LjEtNS4xLTEyLTUuMS0xNy4xIDBsLTU2LjUgNTYuNWMtNS4xIDUuMS01LjEgMTIgMCAxNy4xbDExNC43IDExNC43IDU2LjUgNTYuNWM1LjEgNS4xIDEyIDUuMSAxNy4xIDBsNTYuNS01Ni41IDI2Mi0yNjJjNS4yLTMuNCA1LjItMTIgLjEtMTcuMXpNMTYzNC4xIDE2OS40bC0zNy43LTM3LjdjLTMuNC0zLjQtOC42LTMuNC0xMiAwbC0xNjkuNSAxNjkuNS03MC4yLTcxLjljLTMuNC0zLjQtOC42LTMuNC0xMiAwbC0zNy43IDM3LjdjLTMuNCAzLjQtMy40IDguNiAwIDEybDc3LjEgNzcuMSAzNy43IDM3LjdjMy40IDMuNCA4LjYgMy40IDEyIDBsMzcuNy0zNy43IDE3NC43LTE3Ni40YzEuNi0xLjcgMS42LTYuOS0uMS0xMC4zeiIvPjwvc3ZnPg==") no-repeat center center;
  -webkit-transition: all 0.15s ease;
  -o-transition: all 0.15s ease;
  transition: all 0.15s ease;
  -webkit-transform: scale(0);
      -ms-transform: scale(0);
          transform: scale(0);
  opacity: 0;
}
.Cite {
  display: block;
  border-left: 2px solid #009fdf;
  padding-left: 0.83333333em;
}
@media only screen and (min-width: 57.5em), print {
  .Cite {
    padding-left: 3.125em;
    margin: 3.125em 0 3.125em -3.125em;
  }
}
.Cite-text {
  font-size: 1.5em;
  line-height: 1.6em;
  font-weight: 200;
  font-style: normal;
}
@media only screen and (min-width: 57.5em), print {
  .Cite-text {
    font-size: 3em;
  }
}
.Cite-author {
  margin: 2.5em 0;
}
.Cite-author span {
  display: block;
}
.CiteAuthor-name {
  font-weight: bold;
}
/*#

<h1 class="Heading Heading--h1">Heading 1</h1>
<h2 class="Heading Heading--h2">Heading 2</h2>
<h3 class="Heading Heading--h3">Heading 3</h3>
<h4 class="Heading Heading--h4">Heading 4</h4>
<h5 class="Heading Heading--h5">Heading 5</h5>
<h6 class="Heading Heading--h6">Heading 6</h6>

*/
.Heading,
.Heading--h1,
h1,
.Heading--h2,
h2,
.Heading--h3,
h3,
.Heading--h4,
h4,
.Heading--h5,
h5,
.Heading--h6,
h6,
.Heading--h7 {
  display: block;
  margin-top: 0;
  margin-bottom: 0.5em;
  color: #333333;
  font-weight: bold;
  /*a:hover & {
        color: @colorLinkHover;
    }*/
}
.Heading.Heading-thin,
.Heading--h1.Heading-thin,
h1.Heading-thin,
.Heading--h2.Heading-thin,
h2.Heading-thin,
.Heading--h3.Heading-thin,
h3.Heading-thin,
.Heading--h4.Heading-thin,
h4.Heading-thin,
.Heading--h5.Heading-thin,
h5.Heading-thin,
.Heading--h6.Heading-thin,
h6.Heading-thin,
.Heading--h7.Heading-thin {
  font-weight: normal;
}
.Heading--h1,
h1 {
  font-size: 1.75em;
  line-height: 32px !important;
  font-weight: 900;
}
@media only screen and (min-width: 48em), print {
  .Heading--h1,
  h1 {
    font-size: 2.5em;
    line-height: 46px !important;
  }
}
@media only screen and (min-width: 57.5em), print {
  .Heading--h1,
  h1 {
    font-size: 3.75em;
    line-height: 72px !important;
  }
}
.Heading--h2,
h2 {
  font-size: 1.5em;
  line-height: 28px !important;
  font-weight: 900;
}
@media only screen and (min-width: 48em), print {
  .Heading--h2,
  h2 {
    font-size: 1.875em;
    line-height: 32px !important;
  }
}
@media only screen and (min-width: 57.5em), print {
  .Heading--h2,
  h2 {
    font-size: 2.5em;
    line-height: 48px !important;
  }
}
.Heading--h3,
h3 {
  font-size: 1.25em;
  line-height: 26px !important;
  font-weight: 900;
}
@media only screen and (min-width: 48em), print {
  .Heading--h3,
  h3 {
    font-size: 1.625em;
    line-height: 30px !important;
  }
}
@media only screen and (min-width: 57.5em), print {
  .Heading--h3,
  h3 {
    font-size: 2em;
    line-height: 40px !important;
  }
}
.Heading--h4,
h4 {
  font-size: 1.125em;
  line-height: 24px !important;
}
@media only screen and (min-width: 48em), print {
  .Heading--h4,
  h4 {
    font-size: 1.375em;
    line-height: 28px !important;
  }
}
@media only screen and (min-width: 57.5em), print {
  .Heading--h4,
  h4 {
    font-size: 1.5em;
    line-height: 32px !important;
  }
}
.Heading--h5,
h5 {
  font-size: 1em;
  line-height: 24px !important;
}
.Heading--h5.h5--tweaked,
h5.h5--tweaked {
  font-size: 0.8em;
  line-height: 24px;
  font-weight: 100;
  text-transform: uppercase;
}
.no .u-md-size1of1 .Heading--h5.h5--tweaked,
.no .u-md-size1of1 h5.h5--tweaked {
  font-weight: bold;
  padding-bottom: 20px;
  border-bottom: 1px solid #eee;
}
@media only screen and (min-width: 48em), print {
  .Heading--h5,
  h5 {
    font-size: 1.125em;
    line-height: 24px !important;
  }
}
@media only screen and (min-width: 57.5em), print {
  .Heading--h5,
  h5 {
    font-size: 1.125em;
    line-height: 30px !important;
  }
  .Heading--h5.h5--tweaked,
  h5.h5--tweaked {
    font-size: 1.25em;
  }
}
.Heading--h6,
h6 {
  font-size: 0.875em;
  line-height: 20px !important;
}
@media only screen and (min-width: 48em), print {
  .Heading--h6,
  h6 {
    font-size: 1em;
    line-height: 20px !important;
  }
}
@media only screen and (min-width: 57.5em), print {
  .Heading--h6,
  h6 {
    font-size: 1em;
    line-height: 24px !important;
  }
}
.Heading--h7 {
  font-size: 0.75em;
  line-height: 20px !important;
}
@media only screen and (min-width: 48em), print {
  .Heading--h7 {
    font-size: 0.75em;
    line-height: 20px !important;
  }
}
@media only screen and (min-width: 57.5em), print {
  .Heading--h7 {
    font-size: 0.75em;
    line-height: 18px !important;
  }
}
.Icon {
  fill: currentColor;
  width: 1em;
  height: 1em;
  max-height: 1em;
  display: inline-block;
}
.Icon-close {
  height: 1em;
  background: url('/Assets/Icons/minimera.svg') no-repeat center;
  background-size: cover;
}
.Icon-scroll {
  height: 2em;
  max-height: 2em;
  width: 1.3em;
  background: url('/Assets/Icons/mouse.svg') no-repeat center;
  background-size: cover;
}
.Icon-downarrow {
  height: 1.5em;
  max-height: 1.5em;
  background: url('/Assets/Icons/Scrollpil.svg') no-repeat center;
  background-size: cover;
}
.Icon--medium {
  width: 50px;
  height: 50px;
}
.icon-phone {
  max-width: 1.4em;
  margin-right: 15px;
  margin-bottom: 5px;
}
/*#

Styling for lead text in an article.

Examples:

<div>
    <div class="Lead">
        <p>Lorem ipsum dolor sit amet.</p>
    </div>    
</div>

*/
.Lead {
  font-size: 1.5em;
}
@media only screen and (max-width: 34em), print {
  .lead-image-mobile {
    display: unset !important;
  }
  .lead-image-desktop {
    display: none !important;
  }
}
@media only screen and (min-width: 26.25em), print {
  .lead-image-mobile {
    display: none !important;
  }
  .lead-image-desktop {
    display: unset !important;
  }
}
/*#
<h6>.Link</h6>
<p><a href="#" class="Link">Lorem ipsum dolor sit amet</a></p>

*/
a.LongLink {
  word-break: break-all;
}
.Link--skipLink {
  border: 0;
  clip: rect(0 0 0 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
}
.Link--skipLink:focus {
  clip: auto;
  height: auto;
  margin: 0;
  width: auto;
  background: #fff;
  padding: 0.1875em 0.3125em;
  z-index: 1000;
}
.Link--blue {
  color: #009fdf;
}
.Link--withArrow {
  font-weight: 600;
}
/*#

Display a loading animation to let user know that something is processing in the background. 

Examples:

<div>
    <span class="Loading Loading--spinning">
        <span class="Loading-icon"></span>                        
        <span class="Loading-text">Your profile is loading...</span>
    </span>
    
    <span class="Loading Loading--dots">
        <span class="Loading-icon"></span>                        
        <span class="Loading-text">Your profile is loading...</span>
    </span>
    
    <button class="Button" data-module="toggler" data-toggler="contentElement: '.js-loading1'">
        Start loading 
        <span class="Loading Loading--spinning Loading--small Loading--fill u-hidden js-loading1">
            <span class="Loading-icon"></span>
        </span>
    </button>
</div>

*/
.Loading {
  display: inline-block;
  padding: 1.25em;
  text-align: center;
  vertical-align: middle;
}
.Loading--full {
  width: 100%;
}
.Loading--fill {
  position: absolute;
  background: #fff;
  padding: 0;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.Loading--compact {
  padding: 0;
}
.Loading--xsmall {
  font-size: 0.5em;
}
.Loading--small {
  font-size: 1.125em;
}
.Loading--large {
  font-size: 3.5em;
}
.Loading-text {
  display: block;
  font-size: 1.25em;
  margin-top: 0.83333333em;
  color: #aaa;
}
.Loading--spinning .Loading-icon {
  display: inline-block;
  height: 2em;
  width: 2em;
  border: 0.25em solid #009fdf;
  border-right-color: transparent;
  border-radius: 50%;
  -webkit-animation: rotate 0.9s infinite linear;
          animation: rotate 0.9s infinite linear;
}
.Loading--dots .Loading-icon:before,
.Loading--dots .Loading-icon:after,
.Loading--dots .Loading-icon {
  border-radius: 50%;
  width: 2em;
  height: 2em;
  -webkit-animation-fill-mode: both;
          animation-fill-mode: both;
  -webkit-animation: circlePulse 1.5s infinite ease-in-out;
          animation: circlePulse 1.5s infinite ease-in-out;
}
.Loading--dots .Loading-icon {
  display: inline-block;
  color: #009fdf;
  position: relative;
  top: -2em;
  -webkit-transform: translateZ(0);
          transform: translateZ(0);
  -webkit-animation-delay: -0.16s;
          animation-delay: -0.16s;
}
.Loading--dots .Loading-icon:before {
  left: -2.5em;
  -webkit-animation-delay: -0.32s;
          animation-delay: -0.32s;
}
.Loading--dots .Loading-icon:after {
  left: 2.5em;
}
.Loading--dots .Loading-icon:before,
.Loading--dots .Loading-icon:after {
  content: "";
  position: absolute;
  top: 0;
}
@-webkit-keyframes rotate {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}
@keyframes rotate {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}
@-webkit-keyframes circlePulse {
  0%,
  80%,
  100% {
    -webkit-box-shadow: 0 2em 0 -1em;
            box-shadow: 0 2em 0 -1em;
  }
  40% {
    -webkit-box-shadow: 0 2em 0 0;
            box-shadow: 0 2em 0 0;
  }
}
@keyframes circlePulse {
  0%,
  80%,
  100% {
    -webkit-box-shadow: 0 2em 0 -1em;
            box-shadow: 0 2em 0 -1em;
  }
  40% {
    -webkit-box-shadow: 0 2em 0 0;
            box-shadow: 0 2em 0 0;
  }
}
/*#

Custom styling for radio buttons. Supports focus and disabled states.

Examples:

<div>
    <span class="Radio u-marginRsm">
        <input id="rb1" type="radio" name="priority" class="Radio-input">
        <label for="rb1" class="Radio-label">Low Priority</label>
    </span>

    <span class="Radio u-marginRsm">
        <input id="rb2" type="radio" name="priority" class="Radio-input">
        <label for="rb2" class="Radio-label">Medium Priority</label>
    </span>

    <span class="Radio u-marginRsm">
        <input id="rb3" type="radio" name="priority" class="Radio-input">
        <label for="rb3" class="Radio-label">High Priority</label>
    </span>
</div>

*/
.Radio .Radio-input:disabled + .Radio-label,
.Radio.is-disabled .Radio-label {
  opacity: 0.5;
  cursor: not-allowed;
}
.Radio-input {
  opacity: 0;
  position: absolute;
}
.Radio-input:focus + .Radio-label:before {
  -webkit-box-shadow: 0 0 1px 1px #009fdf;
          box-shadow: 0 0 1px 1px #009fdf;
}
.Radio-input:checked:focus + .Radio-label:before {
  -webkit-box-shadow: 0 0 1px 1px #009fdf, inset 0 0 0 0.2em #fff;
          box-shadow: 0 0 1px 1px #009fdf, inset 0 0 0 0.2em #fff;
}
.Radio-input,
.Radio-label {
  display: inline-block;
  vertical-align: middle;
  cursor: pointer;
}
.Radio-label {
  position: relative;
}
.Radio-label:before {
  content: "";
  background: #fff;
  border: 2px solid #ddd;
  display: inline-block;
  width: 1em;
  height: 1em;
  padding: 0.25em;
  margin-right: 0.3em;
  text-align: center;
  border-radius: 50%;
  vertical-align: -0.1em;
}
.Radio-input:checked + .Radio-label:before {
  background: #777777;
  -webkit-box-shadow: inset 0 0 0 0.2em #fff;
          box-shadow: inset 0 0 0 0.2em #fff;
}
/*#

Custom styling for Select dropdowns. Supports focus and disabled states.

Examples:

<div>
    <span class="Select u-sm-size1of3X">
        <select class="Select-input">
            <option>Select an option</option>
            <option>Invoice</option>
            <option>Emergency</option>
            <option>Question</option>
            <option>A very long item is here that will never end</option>
            <option>Other</option>
        </select>
    </span>
</div>

*/
.Select {
  position: relative;
  padding: 0;
  display: inline-block;
  background: #fff;
  border: 2px solid #ddd;
  border-radius: 3px;
}
.Select:after {
  content: "";
  position: absolute;
  width: 2.2em;
  top: 1px;
  bottom: 1px;
  right: 1px;
  background-color: #f7f7f7;
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAAPCAYAAADphp8SAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAMJJREFUeNpinDRlugMDAwMIUwRYgPgBEOcDsQAlBjHl5WSCDJpIoYM2MMJYQC/eB1IKZBjyAYgNmZAEEsl0zUSQrxiRRYCuWg+kAkgw5ALQEENwGKFJJEKdSiwohAc2sijQdJAhjUQasgCo/gBWg6CGTQA5mYgALkSJfhwKCQV8I9T1+A0CKgK5aAIOQw5AXc1AjIsYoGH1AV8AE2UQ1OnomiZAXctAiotAhi0AeQXKfYAvRpmIiGZYwBeiBzAyAAgwAO6ENKpThEdEAAAAAElFTkSuQmCC");
  background-repeat: no-repeat;
  background-size: 9px 8px;
  background-position: center;
  pointer-events: none;
  z-index: 2;
}
.Select-input {
  width: 100%;
  margin: 0;
  background: none;
  border: 1px solid transparent;
  outline: none;
  cursor: pointer;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  vertical-align: middle;
  padding: 0.2em 0.625em;
  padding-right: 3em;
}
.Select-input:hover {
  -webkit-box-shadow: 0 0 1px 1px #b7b7b7;
          box-shadow: 0 0 1px 1px #b7b7b7;
}
.Select-input:focus {
  outline: none;
  -webkit-box-shadow: 0 0 1px 1px #009fdf;
          box-shadow: 0 0 1px 1px #009fdf;
}
.Select-input:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}
.Select-input:disabled:hover {
  -webkit-box-shadow: none;
          box-shadow: none;
}
.is-no-appearance .Select {
  overflow: hidden;
}
.is-no-appearance .Select-input {
  width: calc(100% + 60px);
}
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
  .Select-input::-ms-expand {
    display: none;
  }
  .Select-input:focus::-ms-value {
    background: transparent;
    color: #333;
  }
}
.Toolbar {
  position: relative;
}
.List.selectLanguage-box {
  position: absolute;
  background-color: #ffffff;
  padding: 20px;
  -webkit-box-shadow: 0px 2px 10px 2px rgba(0, 0, 0, 0.1);
          box-shadow: 0px 2px 10px 2px rgba(0, 0, 0, 0.1);
  right: 10px;
  top: 75px;
  width: 300px;
  text-align: left;
  z-index: 9999;
}
.List.selectLanguage-box .List-item {
  padding-right: 0.625em !important;
  display: block;
}
.List.selectLanguage-box a {
  text-decoration: none;
  text-transform: capitalize;
}
.text-white {
  color: #fff !important;
}
.text-white * {
  color: #fff;
}
.text-black {
  color: #333 !important;
}
.text-black * {
  color: #333 !important;
}
.text-blue {
  color: #009fdf !important;
}
.text-blue * {
  color: #009fdf !important;
}
.contentWidth1of2 {
  width: 50%;
}
.contentWidth2of3 {
  width: 66%;
}
.font-size-10-5 {
  font-size: 10.5px;
}
.font-size-15 {
  font-size: 15px;
}
.font-size-14 {
  font-size: 14px;
}
.font-size-13 {
  font-size: 13px;
}
.font-size-12 {
  font-size: 12px;
}
.font-size-11 {
  font-size: 11px;
}
.font-size-10 {
  font-size: 10px;
}
.font-size-9 {
  font-size: 9px;
}
.font-size-8 {
  font-size: 8px;
}
.font-size-7 {
  font-size: 7px;
}
.font-size-6 {
  font-size: 6px;
}
.font-size-5 {
  font-size: 5px;
}
.font-size-4 {
  font-size: 4px;
}
.font-size-3 {
  font-size: 3px;
}
.font-size-2 {
  font-size: 2px;
}
.font-size-1 {
  font-size: 1px;
}
/*#

Component for showing an accordion on page.
Can be used in conjunction with the "accordion" js-module.

<div class="Accordion" data-module="accordion" data-accordion="expandFirst: true">
    <h4 class="Accordion-header" data-name="panel1"><a href="#" class="Accordion-headerLink">Panel 1</a></h4>
    <div class="Accordion-panel">
        <p>
            Mauris mauris ante, blandit et, ultrices a, suscipit eget, quam. Integer
            ut neque. Vivamus nisi metus, molestie vel, gravida in, condimentum sit
            amet, nunc. Nam a nibh. Donec suscipit eros. Nam mi. Proin viverra leo ut
            odio. Curabitur malesuada. Vestibulum a velit eu ante scelerisque vulputate.
        </p>
    </div>
    <h4 class="Accordion-header" data-name="panel2"><a href="#" class="Accordion-headerLink">Panel 2</a></h4>
    <div class="Accordion-panel">
        <p>
            Sed non urna. Donec et ante. Phasellus eu ligula. Vestibulum sit amet
            purus. Vivamus hendrerit, dolor at aliquet laoreet, mauris turpis porttitor
            velit, faucibus interdum tellus libero ac justo. Vivamus non quam. In
            suscipit faucibus urna.
        </p>
    </div>
    <h4 class="Accordion-header" data-name="panel3"><a href="#" class="Accordion-headerLink">Panel 3</a></h4>
    <div class="Accordion-panel">
        <p>
            Sed non urna. Donec et ante. Phasellus eu ligula. Vestibulum sit amet
            purus. Vivamus hendrerit, dolor at aliquet laoreet, mauris turpis porttitor
            velit, faucibus interdum tellus libero ac justo. Vivamus non quam. In
            suscipit faucibus urna.
        </p>
    </div>
</div>

*/
.Accordion {
  width: 100%;
  margin-bottom: 1.25em;
}
.Accordion.js-ready .Accordion-panel {
  display: none;
}
.Accordion--readmore .Accordion-header {
  margin-bottom: 0;
  background: url('/Assets/Icons/ikon_plus.svg') 0 50% no-repeat;
}
.Accordion--readmore .Accordion-header.is-active {
  background: url('/Assets/Icons/ikon_minus.svg') 0 50% no-repeat;
}
.Accordion--readmore .Accordion-header.is-active .Accordion-headerLink {
  color: #009fdf;
  text-decoration: underline;
}
.Accordion--readmore .Accordion-headerLink {
  color: #009fdf;
  padding-left: 30px;
  text-decoration: underline;
}
.Accordion--readmore .Accordion-panel {
  margin-top: 15px;
  padding: 25px;
  border: 2px solid #009fdf;
}
.Accordion--readmore .Accordion-panel.is-active {
  background-color: white;
  margin-top: 15px;
  padding: 25px;
  border: 2px solid #009fdf;
}
.Accordion-header {
  /*margin: @spaceSmall 0 0;*/
  margin-bottom: 0;
  background: url('/Assets/Icons/chevron_down.svg') 100% 50% no-repeat;
}
.Accordion-header.is-active {
  background: url('/Assets/Icons/chevron_up.svg') 100% 50% no-repeat;
}
.Accordion-header.is-active .Accordion-headerLink {
  color: #333;
}
.Accordion-headerLink {
  /*display: block;
    padding: .2em @spaceXSmall;
    color: @colorLink;
    border: 1px solid @colorGrey;
    text-decoration: none;*/
}
.Accordion-headerLink:before {
  /*content: "+";*/
  display: inline-block;
  width: 1em;
  margin-right: 0.2em;
  font-size: 1.2em;
  text-align: center;
}
.is-active .Accordion-headerLink:before {
  /*content: "-";*/
}
.Accordion-headerLink:hover {
  text-decoration: none;
}
.Accordion-panel:after,
.Accordion-panel:before {
  content: "";
  display: table;
}
.Accordion-panel.is-active {
  display: block;
}
@media print {
  .Accordion .Accordion-panel {
    display: block !important;
  }
  .Accordion-headerLink:before {
    display: none;
  }
}
@media only screen and (min-width: 48em), print {
  .Anchor:before {
    content: "";
    display: block;
    padding-top: 95px;
    margin-top: -50px;
  }
}
.Article-heading {
  border-bottom: 2px solid #ccc;
  margin-bottom: 10px;
}
@media only screen and (min-width: 48em), print {
  .Article-heading {
    margin-bottom: 0;
    border: 0;
  }
}
.Article-heading h4 {
  white-space: nowrap;
  overflow: hidden;
  -o-text-overflow: ellipsis;
     text-overflow: ellipsis;
}
@media only screen and (min-width: 48em), print {
  .Article-heading h4 {
    white-space: normal;
    overflow: hidden;
    -o-text-overflow: inherit;
       text-overflow: inherit;
  }
}
.Article section {
  /*padding:25px 0;*/
}
@media only screen and (min-width: 75em) {
  .Article--smallSpaceLeft {
    padding-left: 5.5em !important;
  }
}
@media only screen and (min-width: 75em) {
  .Article--spaceLeft {
    margin-left: 9em !important;
  }
}
@media only screen and (min-width: 75em) {
  .Article--spaceRight {
    margin-right: 9em !important;
  }
}
@media only screen and (min-width: 57.5em), print {
  .Article-mainImg {
    margin-left: -12.125em;
    max-width: 116%;
  }
}
.article-listing {
  margin-top: 2.25em;
}
.article-listing--item {
  margin-top: 0.25em;
}
.bc-height-50 .blockcontainercontentblock,
.bc-height-50 .Grid-cell > div {
  height: 50px;
}
@media only screen and (max-width: 48em), print {
  .bc-height-50 .blockcontainercontentblock,
  .bc-height-50 .Grid-cell > div {
    height: auto;
    min-height: 50px;
  }
}
@media only screen and (max-width: 34em), print {
  .bc-height-50 .blockcontainercontentblock,
  .bc-height-50 .Grid-cell > div {
    min-height: unset;
  }
}
.bc-height-75 .blockcontainercontentblock,
.bc-height-75 .Grid-cell > div {
  height: 75px;
}
@media only screen and (max-width: 48em), print {
  .bc-height-75 .blockcontainercontentblock,
  .bc-height-75 .Grid-cell > div {
    height: auto;
    min-height: 75px;
  }
}
@media only screen and (max-width: 34em), print {
  .bc-height-75 .blockcontainercontentblock,
  .bc-height-75 .Grid-cell > div {
    min-height: unset;
  }
}
.bc-height-100 .blockcontainercontentblock,
.bc-height-100 .Grid-cell > div {
  height: 100px;
}
@media only screen and (max-width: 48em), print {
  .bc-height-100 .blockcontainercontentblock,
  .bc-height-100 .Grid-cell > div {
    height: auto;
    min-height: 100px;
  }
}
@media only screen and (max-width: 34em), print {
  .bc-height-100 .blockcontainercontentblock,
  .bc-height-100 .Grid-cell > div {
    min-height: unset;
  }
}
.bc-height-125 .blockcontainercontentblock,
.bc-height-125 .Grid-cell > div {
  height: 125px;
}
@media only screen and (max-width: 48em), print {
  .bc-height-125 .blockcontainercontentblock,
  .bc-height-125 .Grid-cell > div {
    height: auto;
    min-height: 125px;
  }
}
@media only screen and (max-width: 34em), print {
  .bc-height-125 .blockcontainercontentblock,
  .bc-height-125 .Grid-cell > div {
    min-height: unset;
  }
}
.bc-height-150 .blockcontainercontentblock,
.bc-height-150 .Grid-cell > div {
  height: 150px;
}
@media only screen and (max-width: 48em), print {
  .bc-height-150 .blockcontainercontentblock,
  .bc-height-150 .Grid-cell > div {
    height: auto;
    min-height: 150px;
  }
}
@media only screen and (max-width: 34em), print {
  .bc-height-150 .blockcontainercontentblock,
  .bc-height-150 .Grid-cell > div {
    min-height: unset;
  }
}
.bc-height-175 .blockcontainercontentblock,
.bc-height-175 .Grid-cell > div {
  height: 175px;
}
@media only screen and (max-width: 48em), print {
  .bc-height-175 .blockcontainercontentblock,
  .bc-height-175 .Grid-cell > div {
    height: auto;
    min-height: 175px;
  }
}
@media only screen and (max-width: 34em), print {
  .bc-height-175 .blockcontainercontentblock,
  .bc-height-175 .Grid-cell > div {
    min-height: unset;
  }
}
.bc-height-200 .blockcontainercontentblock,
.bc-height-200 .Grid-cell > div {
  height: 200px;
}
@media only screen and (max-width: 48em), print {
  .bc-height-200 .blockcontainercontentblock,
  .bc-height-200 .Grid-cell > div {
    height: auto;
    min-height: 200px;
  }
}
@media only screen and (max-width: 34em), print {
  .bc-height-200 .blockcontainercontentblock,
  .bc-height-200 .Grid-cell > div {
    min-height: unset;
  }
}
.bc-height-225 .blockcontainercontentblock,
.bc-height-225 .Grid-cell > div {
  height: 225px;
}
@media only screen and (max-width: 48em), print {
  .bc-height-225 .blockcontainercontentblock,
  .bc-height-225 .Grid-cell > div {
    height: auto;
    min-height: 225px;
  }
}
@media only screen and (max-width: 34em), print {
  .bc-height-225 .blockcontainercontentblock,
  .bc-height-225 .Grid-cell > div {
    min-height: unset;
  }
}
.bc-height-250 .blockcontainercontentblock,
.bc-height-250 .Grid-cell > div {
  height: 250px;
}
@media only screen and (max-width: 48em), print {
  .bc-height-250 .blockcontainercontentblock,
  .bc-height-250 .Grid-cell > div {
    height: auto;
    min-height: 250px;
  }
}
@media only screen and (max-width: 34em), print {
  .bc-height-250 .blockcontainercontentblock,
  .bc-height-250 .Grid-cell > div {
    min-height: unset;
  }
}
.bc-height-275 .blockcontainercontentblock,
.bc-height-275 .Grid-cell > div {
  height: 275px;
}
@media only screen and (max-width: 48em), print {
  .bc-height-275 .blockcontainercontentblock,
  .bc-height-275 .Grid-cell > div {
    height: auto;
    min-height: 275px;
  }
}
@media only screen and (max-width: 34em), print {
  .bc-height-275 .blockcontainercontentblock,
  .bc-height-275 .Grid-cell > div {
    min-height: unset;
  }
}
.bc-height-300 .blockcontainercontentblock,
.bc-height-300 .Grid-cell > div {
  height: 300px;
}
@media only screen and (max-width: 48em), print {
  .bc-height-300 .blockcontainercontentblock,
  .bc-height-300 .Grid-cell > div {
    height: auto;
    min-height: 300px;
  }
}
@media only screen and (max-width: 34em), print {
  .bc-height-300 .blockcontainercontentblock,
  .bc-height-300 .Grid-cell > div {
    min-height: unset;
  }
}
.bc-height-325 .blockcontainercontentblock,
.bc-height-325 .Grid-cell > div {
  height: 325px;
}
@media only screen and (max-width: 48em), print {
  .bc-height-325 .blockcontainercontentblock,
  .bc-height-325 .Grid-cell > div {
    height: auto;
    min-height: 325px;
  }
}
@media only screen and (max-width: 34em), print {
  .bc-height-325 .blockcontainercontentblock,
  .bc-height-325 .Grid-cell > div {
    min-height: unset;
  }
}
.bc-height-350 .blockcontainercontentblock,
.bc-height-350 .Grid-cell > div {
  height: 350px;
}
@media only screen and (max-width: 48em), print {
  .bc-height-350 .blockcontainercontentblock,
  .bc-height-350 .Grid-cell > div {
    height: auto;
    min-height: 350px;
  }
}
@media only screen and (max-width: 34em), print {
  .bc-height-350 .blockcontainercontentblock,
  .bc-height-350 .Grid-cell > div {
    min-height: unset;
  }
}
.bc-height-375 .blockcontainercontentblock,
.bc-height-375 .Grid-cell > div {
  height: 375px;
}
@media only screen and (max-width: 48em), print {
  .bc-height-375 .blockcontainercontentblock,
  .bc-height-375 .Grid-cell > div {
    height: auto;
    min-height: 375px;
  }
}
@media only screen and (max-width: 34em), print {
  .bc-height-375 .blockcontainercontentblock,
  .bc-height-375 .Grid-cell > div {
    min-height: unset;
  }
}
.bc-height-400 .blockcontainercontentblock,
.bc-height-400 .Grid-cell > div {
  height: 400px;
}
@media only screen and (max-width: 48em), print {
  .bc-height-400 .blockcontainercontentblock,
  .bc-height-400 .Grid-cell > div {
    height: auto;
    min-height: 400px;
  }
}
@media only screen and (max-width: 34em), print {
  .bc-height-400 .blockcontainercontentblock,
  .bc-height-400 .Grid-cell > div {
    min-height: unset;
  }
}
.bc-height-425 .blockcontainercontentblock,
.bc-height-425 .Grid-cell > div {
  height: 425px;
}
@media only screen and (max-width: 48em), print {
  .bc-height-425 .blockcontainercontentblock,
  .bc-height-425 .Grid-cell > div {
    height: auto;
    min-height: 425px;
  }
}
@media only screen and (max-width: 34em), print {
  .bc-height-425 .blockcontainercontentblock,
  .bc-height-425 .Grid-cell > div {
    min-height: unset;
  }
}
.bc-height-450 .blockcontainercontentblock,
.bc-height-450 .Grid-cell > div {
  height: 450px;
}
@media only screen and (max-width: 48em), print {
  .bc-height-450 .blockcontainercontentblock,
  .bc-height-450 .Grid-cell > div {
    height: auto;
    min-height: 450px;
  }
}
@media only screen and (max-width: 34em), print {
  .bc-height-450 .blockcontainercontentblock,
  .bc-height-450 .Grid-cell > div {
    min-height: unset;
  }
}
.bc-height-475 .blockcontainercontentblock,
.bc-height-475 .Grid-cell > div {
  height: 475px;
}
@media only screen and (max-width: 48em), print {
  .bc-height-475 .blockcontainercontentblock,
  .bc-height-475 .Grid-cell > div {
    height: auto;
    min-height: 475px;
  }
}
@media only screen and (max-width: 34em), print {
  .bc-height-475 .blockcontainercontentblock,
  .bc-height-475 .Grid-cell > div {
    min-height: unset;
  }
}
.bc-height-500 .blockcontainercontentblock,
.bc-height-500 .Grid-cell > div {
  height: 500px;
}
@media only screen and (max-width: 48em), print {
  .bc-height-500 .blockcontainercontentblock,
  .bc-height-500 .Grid-cell > div {
    height: auto;
    min-height: 500px;
  }
}
@media only screen and (max-width: 34em), print {
  .bc-height-500 .blockcontainercontentblock,
  .bc-height-500 .Grid-cell > div {
    min-height: unset;
  }
}
.bc-height-525 .blockcontainercontentblock,
.bc-height-525 .Grid-cell > div {
  height: 525px;
}
@media only screen and (max-width: 48em), print {
  .bc-height-525 .blockcontainercontentblock,
  .bc-height-525 .Grid-cell > div {
    height: auto;
    min-height: 525px;
  }
}
@media only screen and (max-width: 34em), print {
  .bc-height-525 .blockcontainercontentblock,
  .bc-height-525 .Grid-cell > div {
    min-height: unset;
  }
}
.bc-height-550 .blockcontainercontentblock,
.bc-height-550 .Grid-cell > div {
  height: 550px;
}
@media only screen and (max-width: 48em), print {
  .bc-height-550 .blockcontainercontentblock,
  .bc-height-550 .Grid-cell > div {
    height: auto;
    min-height: 550px;
  }
}
@media only screen and (max-width: 34em), print {
  .bc-height-550 .blockcontainercontentblock,
  .bc-height-550 .Grid-cell > div {
    min-height: unset;
  }
}
.bc-height-575 .blockcontainercontentblock,
.bc-height-575 .Grid-cell > div {
  height: 575px;
}
@media only screen and (max-width: 48em), print {
  .bc-height-575 .blockcontainercontentblock,
  .bc-height-575 .Grid-cell > div {
    height: auto;
    min-height: 575px;
  }
}
@media only screen and (max-width: 34em), print {
  .bc-height-575 .blockcontainercontentblock,
  .bc-height-575 .Grid-cell > div {
    min-height: unset;
  }
}
.bc-height-600 .blockcontainercontentblock,
.bc-height-600 .Grid-cell > div {
  height: 600px;
}
@media only screen and (max-width: 48em), print {
  .bc-height-600 .blockcontainercontentblock,
  .bc-height-600 .Grid-cell > div {
    height: auto;
    min-height: 600px;
  }
}
@media only screen and (max-width: 34em), print {
  .bc-height-600 .blockcontainercontentblock,
  .bc-height-600 .Grid-cell > div {
    min-height: unset;
  }
}
.bc-height-625 .blockcontainercontentblock,
.bc-height-625 .Grid-cell > div {
  height: 625px;
}
@media only screen and (max-width: 48em), print {
  .bc-height-625 .blockcontainercontentblock,
  .bc-height-625 .Grid-cell > div {
    height: auto;
    min-height: 625px;
  }
}
@media only screen and (max-width: 34em), print {
  .bc-height-625 .blockcontainercontentblock,
  .bc-height-625 .Grid-cell > div {
    min-height: unset;
  }
}
.bc-height-650 .blockcontainercontentblock,
.bc-height-650 .Grid-cell > div {
  height: 650px;
}
@media only screen and (max-width: 48em), print {
  .bc-height-650 .blockcontainercontentblock,
  .bc-height-650 .Grid-cell > div {
    height: auto;
    min-height: 650px;
  }
}
@media only screen and (max-width: 34em), print {
  .bc-height-650 .blockcontainercontentblock,
  .bc-height-650 .Grid-cell > div {
    min-height: unset;
  }
}
.bc-height-675 .blockcontainercontentblock,
.bc-height-675 .Grid-cell > div {
  height: 675px;
}
@media only screen and (max-width: 48em), print {
  .bc-height-675 .blockcontainercontentblock,
  .bc-height-675 .Grid-cell > div {
    height: auto;
    min-height: 675px;
  }
}
@media only screen and (max-width: 34em), print {
  .bc-height-675 .blockcontainercontentblock,
  .bc-height-675 .Grid-cell > div {
    min-height: unset;
  }
}
.bc-height-700 .blockcontainercontentblock,
.bc-height-700 .Grid-cell > div {
  height: 700px;
}
@media only screen and (max-width: 48em), print {
  .bc-height-700 .blockcontainercontentblock,
  .bc-height-700 .Grid-cell > div {
    height: auto;
    min-height: 700px;
  }
}
@media only screen and (max-width: 34em), print {
  .bc-height-700 .blockcontainercontentblock,
  .bc-height-700 .Grid-cell > div {
    min-height: unset;
  }
}
.bc-height-725 .blockcontainercontentblock,
.bc-height-725 .Grid-cell > div {
  height: 725px;
}
@media only screen and (max-width: 48em), print {
  .bc-height-725 .blockcontainercontentblock,
  .bc-height-725 .Grid-cell > div {
    height: auto;
    min-height: 725px;
  }
}
@media only screen and (max-width: 34em), print {
  .bc-height-725 .blockcontainercontentblock,
  .bc-height-725 .Grid-cell > div {
    min-height: unset;
  }
}
.bc-height-750 .blockcontainercontentblock,
.bc-height-750 .Grid-cell > div {
  height: 750px;
}
@media only screen and (max-width: 48em), print {
  .bc-height-750 .blockcontainercontentblock,
  .bc-height-750 .Grid-cell > div {
    height: auto;
    min-height: 750px;
  }
}
@media only screen and (max-width: 34em), print {
  .bc-height-750 .blockcontainercontentblock,
  .bc-height-750 .Grid-cell > div {
    min-height: unset;
  }
}
.bc-height-775 .blockcontainercontentblock,
.bc-height-775 .Grid-cell > div {
  height: 775px;
}
@media only screen and (max-width: 48em), print {
  .bc-height-775 .blockcontainercontentblock,
  .bc-height-775 .Grid-cell > div {
    height: auto;
    min-height: 775px;
  }
}
@media only screen and (max-width: 34em), print {
  .bc-height-775 .blockcontainercontentblock,
  .bc-height-775 .Grid-cell > div {
    min-height: unset;
  }
}
.bc-height-800 .blockcontainercontentblock,
.bc-height-800 .Grid-cell > div {
  height: 800px;
}
@media only screen and (max-width: 48em), print {
  .bc-height-800 .blockcontainercontentblock,
  .bc-height-800 .Grid-cell > div {
    height: auto;
    min-height: 800px;
  }
}
@media only screen and (max-width: 34em), print {
  .bc-height-800 .blockcontainercontentblock,
  .bc-height-800 .Grid-cell > div {
    min-height: unset;
  }
}
.bc-height-825 .blockcontainercontentblock,
.bc-height-825 .Grid-cell > div {
  height: 825px;
}
@media only screen and (max-width: 48em), print {
  .bc-height-825 .blockcontainercontentblock,
  .bc-height-825 .Grid-cell > div {
    height: auto;
    min-height: 825px;
  }
}
@media only screen and (max-width: 34em), print {
  .bc-height-825 .blockcontainercontentblock,
  .bc-height-825 .Grid-cell > div {
    min-height: unset;
  }
}
.bc-height-850 .blockcontainercontentblock,
.bc-height-850 .Grid-cell > div {
  height: 850px;
}
@media only screen and (max-width: 48em), print {
  .bc-height-850 .blockcontainercontentblock,
  .bc-height-850 .Grid-cell > div {
    height: auto;
    min-height: 850px;
  }
}
@media only screen and (max-width: 34em), print {
  .bc-height-850 .blockcontainercontentblock,
  .bc-height-850 .Grid-cell > div {
    min-height: unset;
  }
}
.bc-height-875 .blockcontainercontentblock,
.bc-height-875 .Grid-cell > div {
  height: 875px;
}
@media only screen and (max-width: 48em), print {
  .bc-height-875 .blockcontainercontentblock,
  .bc-height-875 .Grid-cell > div {
    height: auto;
    min-height: 875px;
  }
}
@media only screen and (max-width: 34em), print {
  .bc-height-875 .blockcontainercontentblock,
  .bc-height-875 .Grid-cell > div {
    min-height: unset;
  }
}
.bc-height-900 .blockcontainercontentblock,
.bc-height-900 .Grid-cell > div {
  height: 900px;
}
@media only screen and (max-width: 48em), print {
  .bc-height-900 .blockcontainercontentblock,
  .bc-height-900 .Grid-cell > div {
    height: auto;
    min-height: 900px;
  }
}
@media only screen and (max-width: 34em), print {
  .bc-height-900 .blockcontainercontentblock,
  .bc-height-900 .Grid-cell > div {
    min-height: unset;
  }
}
.bc-height-925 .blockcontainercontentblock,
.bc-height-925 .Grid-cell > div {
  height: 925px;
}
@media only screen and (max-width: 48em), print {
  .bc-height-925 .blockcontainercontentblock,
  .bc-height-925 .Grid-cell > div {
    height: auto;
    min-height: 925px;
  }
}
@media only screen and (max-width: 34em), print {
  .bc-height-925 .blockcontainercontentblock,
  .bc-height-925 .Grid-cell > div {
    min-height: unset;
  }
}
.bc-height-950 .blockcontainercontentblock,
.bc-height-950 .Grid-cell > div {
  height: 950px;
}
@media only screen and (max-width: 48em), print {
  .bc-height-950 .blockcontainercontentblock,
  .bc-height-950 .Grid-cell > div {
    height: auto;
    min-height: 950px;
  }
}
@media only screen and (max-width: 34em), print {
  .bc-height-950 .blockcontainercontentblock,
  .bc-height-950 .Grid-cell > div {
    min-height: unset;
  }
}
.bc-height-975 .blockcontainercontentblock,
.bc-height-975 .Grid-cell > div {
  height: 975px;
}
@media only screen and (max-width: 48em), print {
  .bc-height-975 .blockcontainercontentblock,
  .bc-height-975 .Grid-cell > div {
    height: auto;
    min-height: 975px;
  }
}
@media only screen and (max-width: 34em), print {
  .bc-height-975 .blockcontainercontentblock,
  .bc-height-975 .Grid-cell > div {
    min-height: unset;
  }
}
.bc-height-1000 .blockcontainercontentblock,
.bc-height-1000 .Grid-cell > div {
  height: 1000px;
}
@media only screen and (max-width: 48em), print {
  .bc-height-1000 .blockcontainercontentblock,
  .bc-height-1000 .Grid-cell > div {
    height: auto;
    min-height: 1000px;
  }
}
@media only screen and (max-width: 34em), print {
  .bc-height-1000 .blockcontainercontentblock,
  .bc-height-1000 .Grid-cell > div {
    min-height: unset;
  }
}
[class*="bc-height-"] .Grid {
  height: 100%;
}
[class*="bc-height-"] .Grid [class*=u-size] {
  height: 100%;
}
.block-container {
  position: relative;
}
.Grid--gutterH .block-container.BgOverlay {
  width: calc(100% + 30px);
}
.block-container.fullwidth {
  margin-left: -50px;
  width: calc(100% + 100px) !important;
}
@media only screen and (max-width: 48em), print {
  .block-container.fullwidth {
    margin-left: -20px;
    width: calc(100% + 40px) !important;
  }
}
.blockcontainercontentblock {
  margin-bottom: 7.5px;
  margin-top: -7.5px;
}
.blockcontainercontentblock-contentwrapper {
  height: 100%;
  display: table;
}
.bc-height-flex .blockcontainercontentblock-contentwrapper .blockcontainercontentblock-content {
  position: relative;
}
.blockcontainercontentblock-contentwrapper .blockcontainercontentblock-content {
  position: relative;
  -ms-flex-preferred-size: auto;
      flex-basis: auto;
}
.blockcontainercontentblock-link {
  z-index: 1;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  display: table;
  bottom: 0;
  /*margin-bottom: 0px;
    margin-bottom: 60px;
    margin-left: 60px;
    margin-right: 60px;*/
  /*end flex*/
  white-space: nowrap;
}
@media only screen and (max-width: 48em), print {
  .blockcontainercontentblock-link {
    margin-bottom: 15px;
    margin-left: 15px;
    width: auto;
    margin-right: 15px;
  }
}
.blockcontainercontentblock-contentwrapper {
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}
.blockcontainercontentblock {
  position: relative;
  z-index: 10;
  height: 100%;
  overflow: hidden;
  -webkit-transition: 0.5s;
  -o-transition: 0.5s;
  transition: 0.5s;
}
.blockcontainercontentblock-image {
  position: relative;
  display: block;
  padding: 20px;
  z-index: 15;
  max-width: 100%;
  width: auto;
  margin: 0 auto 20px auto;
}
.BgOverlay .blockcontainercontentblock-image {
  width: auto;
}
.blockcontainercontentblock-content {
  position: relative;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  position: absolute;
  /*padding: 60px;*/
  z-index: 20;
  bottom: 0;
}
@media only screen and (max-width: 48em), print {
  .blockcontainercontentblock-content {
    position: relative;
    padding: 20px;
  }
}
.blockcontainercontentblock-content.VerticalAlign-top {
  bottom: auto;
}
.blockcontainercontentblock-content.VerticalAlign-middle {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  position: relative;
  vertical-align: middle;
}
.blockcontainercontentblock-content.VerticalAlign-bottom {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
}
@media only screen and (max-width: 48em), print {
  .blockcontainercontentblock-content.contentWidth1of2,
  .blockcontainercontentblock-content.contentWidth2of3 {
    width: 100%;
  }
}
.blockcontainercontentblock-content .Button-cta--primary {
  color: #fff !important;
}
.blockcontainercontentblock--nohover:hover {
  -webkit-box-shadow: none !important;
          box-shadow: none !important;
  text-decoration: none !important;
  cursor: auto !important;
}
.hoverpointer:hover {
  cursor: pointer !important;
}
.blockcontainercontentblock:hover {
  -webkit-box-shadow: 0 0 11px rgba(33, 33, 33, 0.2);
          box-shadow: 0 0 11px rgba(33, 33, 33, 0.2);
  text-decoration: none;
  color: #333;
  cursor: pointer;
}
.blockcontainercontentblock-nolink:hover {
  -webkit-box-shadow: 0 0 0px !important;
          box-shadow: 0 0 0px !important;
  text-decoration: none !important;
  cursor: auto !important;
}
@media only screen and (min-width: 48em), print {
  .tb-padding-0 {
    padding-top: 0px !important;
    padding-bottom: 0px !important;
  }
}
@media only screen and (max-width: 34em), print {
  .tb-padding-0--mb {
    padding-top: 0px !important;
    padding-bottom: 0px !important;
  }
}
@media only screen and (min-width: 48em), print {
  .lr-padding-0 {
    padding-left: 0px !important;
    padding-right: 0px !important;
  }
}
@media only screen and (max-width: 34em), print {
  .lr-padding-0--mb {
    padding-left: 0px !important;
    padding-right: 0px !important;
  }
}
@media only screen and (min-width: 48em), print {
  .tb-padding-10 {
    padding-top: 10px !important;
    padding-bottom: 10px !important;
  }
}
@media only screen and (max-width: 34em), print {
  .tb-padding-10--mb {
    padding-top: 10px !important;
    padding-bottom: 10px !important;
  }
}
@media only screen and (min-width: 48em), print {
  .lr-padding-10 {
    padding-left: 10px !important;
    padding-right: 10px !important;
  }
}
@media only screen and (max-width: 34em), print {
  .lr-padding-10--mb {
    padding-left: 10px !important;
    padding-right: 10px !important;
  }
}
@media only screen and (min-width: 48em), print {
  .tb-padding-20 {
    padding-top: 20px !important;
    padding-bottom: 20px !important;
  }
}
@media only screen and (max-width: 34em), print {
  .tb-padding-20--mb {
    padding-top: 20px !important;
    padding-bottom: 20px !important;
  }
}
@media only screen and (min-width: 48em), print {
  .lr-padding-20 {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }
}
@media only screen and (max-width: 34em), print {
  .lr-padding-20--mb {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }
}
@media only screen and (min-width: 48em), print {
  .tb-padding-30 {
    padding-top: 30px !important;
    padding-bottom: 30px !important;
  }
}
@media only screen and (max-width: 34em), print {
  .tb-padding-30--mb {
    padding-top: 30px !important;
    padding-bottom: 30px !important;
  }
}
@media only screen and (min-width: 48em), print {
  .lr-padding-30 {
    padding-left: 30px !important;
    padding-right: 30px !important;
  }
}
@media only screen and (max-width: 34em), print {
  .lr-padding-30--mb {
    padding-left: 30px !important;
    padding-right: 30px !important;
  }
}
@media only screen and (min-width: 48em), print {
  .tb-padding-40 {
    padding-top: 40px !important;
    padding-bottom: 40px !important;
  }
}
@media only screen and (max-width: 34em), print {
  .tb-padding-40--mb {
    padding-top: 40px !important;
    padding-bottom: 40px !important;
  }
}
@media only screen and (min-width: 48em), print {
  .lr-padding-40 {
    padding-left: 40px !important;
    padding-right: 40px !important;
  }
}
@media only screen and (max-width: 34em), print {
  .lr-padding-40--mb {
    padding-left: 40px !important;
    padding-right: 40px !important;
  }
}
@media only screen and (min-width: 48em), print {
  .tb-padding-50 {
    padding-top: 50px !important;
    padding-bottom: 50px !important;
  }
}
@media only screen and (max-width: 34em), print {
  .tb-padding-50--mb {
    padding-top: 50px !important;
    padding-bottom: 50px !important;
  }
}
@media only screen and (min-width: 48em), print {
  .lr-padding-50 {
    padding-left: 50px !important;
    padding-right: 50px !important;
  }
}
@media only screen and (max-width: 34em), print {
  .lr-padding-50--mb {
    padding-left: 50px !important;
    padding-right: 50px !important;
  }
}
@media only screen and (min-width: 48em), print {
  .tb-padding-60 {
    padding-top: 60px !important;
    padding-bottom: 60px !important;
  }
}
@media only screen and (max-width: 34em), print {
  .tb-padding-60--mb {
    padding-top: 60px !important;
    padding-bottom: 60px !important;
  }
}
@media only screen and (min-width: 48em), print {
  .lr-padding-60 {
    padding-left: 60px !important;
    padding-right: 60px !important;
  }
}
@media only screen and (max-width: 34em), print {
  .lr-padding-60--mb {
    padding-left: 60px !important;
    padding-right: 60px !important;
  }
}
@media only screen and (min-width: 48em), print {
  .tb-padding-70 {
    padding-top: 70px !important;
    padding-bottom: 70px !important;
  }
}
@media only screen and (max-width: 34em), print {
  .tb-padding-70--mb {
    padding-top: 70px !important;
    padding-bottom: 70px !important;
  }
}
@media only screen and (min-width: 48em), print {
  .lr-padding-70 {
    padding-left: 70px !important;
    padding-right: 70px !important;
  }
}
@media only screen and (max-width: 34em), print {
  .lr-padding-70--mb {
    padding-left: 70px !important;
    padding-right: 70px !important;
  }
}
@media only screen and (min-width: 48em), print {
  .tb-padding-80 {
    padding-top: 80px !important;
    padding-bottom: 80px !important;
  }
}
@media only screen and (max-width: 34em), print {
  .tb-padding-80--mb {
    padding-top: 80px !important;
    padding-bottom: 80px !important;
  }
}
@media only screen and (min-width: 48em), print {
  .lr-padding-80 {
    padding-left: 80px !important;
    padding-right: 80px !important;
  }
}
@media only screen and (max-width: 34em), print {
  .lr-padding-80--mb {
    padding-left: 80px !important;
    padding-right: 80px !important;
  }
}
@media only screen and (min-width: 48em), print {
  .tb-padding-90 {
    padding-top: 90px !important;
    padding-bottom: 90px !important;
  }
}
@media only screen and (max-width: 34em), print {
  .tb-padding-90--mb {
    padding-top: 90px !important;
    padding-bottom: 90px !important;
  }
}
@media only screen and (min-width: 48em), print {
  .lr-padding-90 {
    padding-left: 90px !important;
    padding-right: 90px !important;
  }
}
@media only screen and (max-width: 34em), print {
  .lr-padding-90--mb {
    padding-left: 90px !important;
    padding-right: 90px !important;
  }
}
@media only screen and (min-width: 48em), print {
  .tb-padding-100 {
    padding-top: 100px !important;
    padding-bottom: 100px !important;
  }
}
@media only screen and (max-width: 34em), print {
  .tb-padding-100--mb {
    padding-top: 100px !important;
    padding-bottom: 100px !important;
  }
}
@media only screen and (min-width: 48em), print {
  .lr-padding-100 {
    padding-left: 100px !important;
    padding-right: 100px !important;
  }
}
@media only screen and (max-width: 34em), print {
  .lr-padding-100--mb {
    padding-left: 100px !important;
    padding-right: 100px !important;
  }
}
@media only screen and (min-width: 48em), print {
  .tb-padding-110 {
    padding-top: 110px !important;
    padding-bottom: 110px !important;
  }
}
@media only screen and (max-width: 34em), print {
  .tb-padding-110--mb {
    padding-top: 110px !important;
    padding-bottom: 110px !important;
  }
}
@media only screen and (min-width: 48em), print {
  .lr-padding-110 {
    padding-left: 110px !important;
    padding-right: 110px !important;
  }
}
@media only screen and (max-width: 34em), print {
  .lr-padding-110--mb {
    padding-left: 110px !important;
    padding-right: 110px !important;
  }
}
@media only screen and (min-width: 48em), print {
  .tb-padding-120 {
    padding-top: 120px !important;
    padding-bottom: 120px !important;
  }
}
@media only screen and (max-width: 34em), print {
  .tb-padding-120--mb {
    padding-top: 120px !important;
    padding-bottom: 120px !important;
  }
}
@media only screen and (min-width: 48em), print {
  .lr-padding-120 {
    padding-left: 120px !important;
    padding-right: 120px !important;
  }
}
@media only screen and (max-width: 34em), print {
  .lr-padding-120--mb {
    padding-left: 120px !important;
    padding-right: 120px !important;
  }
}
@media only screen and (min-width: 48em), print {
  .tb-padding-130 {
    padding-top: 130px !important;
    padding-bottom: 130px !important;
  }
}
@media only screen and (max-width: 34em), print {
  .tb-padding-130--mb {
    padding-top: 130px !important;
    padding-bottom: 130px !important;
  }
}
@media only screen and (min-width: 48em), print {
  .lr-padding-130 {
    padding-left: 130px !important;
    padding-right: 130px !important;
  }
}
@media only screen and (max-width: 34em), print {
  .lr-padding-130--mb {
    padding-left: 130px !important;
    padding-right: 130px !important;
  }
}
@media only screen and (min-width: 48em), print {
  .tb-padding-140 {
    padding-top: 140px !important;
    padding-bottom: 140px !important;
  }
}
@media only screen and (max-width: 34em), print {
  .tb-padding-140--mb {
    padding-top: 140px !important;
    padding-bottom: 140px !important;
  }
}
@media only screen and (min-width: 48em), print {
  .lr-padding-140 {
    padding-left: 140px !important;
    padding-right: 140px !important;
  }
}
@media only screen and (max-width: 34em), print {
  .lr-padding-140--mb {
    padding-left: 140px !important;
    padding-right: 140px !important;
  }
}
@media only screen and (min-width: 48em), print {
  .tb-padding-150 {
    padding-top: 150px !important;
    padding-bottom: 150px !important;
  }
}
@media only screen and (max-width: 34em), print {
  .tb-padding-150--mb {
    padding-top: 150px !important;
    padding-bottom: 150px !important;
  }
}
@media only screen and (min-width: 48em), print {
  .lr-padding-150 {
    padding-left: 150px !important;
    padding-right: 150px !important;
  }
}
@media only screen and (max-width: 34em), print {
  .lr-padding-150--mb {
    padding-left: 150px !important;
    padding-right: 150px !important;
  }
}
@media only screen and (min-width: 48em), print {
  .tb-padding-160 {
    padding-top: 160px !important;
    padding-bottom: 160px !important;
  }
}
@media only screen and (max-width: 34em), print {
  .tb-padding-160--mb {
    padding-top: 160px !important;
    padding-bottom: 160px !important;
  }
}
@media only screen and (min-width: 48em), print {
  .lr-padding-160 {
    padding-left: 160px !important;
    padding-right: 160px !important;
  }
}
@media only screen and (max-width: 34em), print {
  .lr-padding-160--mb {
    padding-left: 160px !important;
    padding-right: 160px !important;
  }
}
@media only screen and (min-width: 48em), print {
  .tb-padding-170 {
    padding-top: 170px !important;
    padding-bottom: 170px !important;
  }
}
@media only screen and (max-width: 34em), print {
  .tb-padding-170--mb {
    padding-top: 170px !important;
    padding-bottom: 170px !important;
  }
}
@media only screen and (min-width: 48em), print {
  .lr-padding-170 {
    padding-left: 170px !important;
    padding-right: 170px !important;
  }
}
@media only screen and (max-width: 34em), print {
  .lr-padding-170--mb {
    padding-left: 170px !important;
    padding-right: 170px !important;
  }
}
@media only screen and (min-width: 48em), print {
  .tb-padding-180 {
    padding-top: 180px !important;
    padding-bottom: 180px !important;
  }
}
@media only screen and (max-width: 34em), print {
  .tb-padding-180--mb {
    padding-top: 180px !important;
    padding-bottom: 180px !important;
  }
}
@media only screen and (min-width: 48em), print {
  .lr-padding-180 {
    padding-left: 180px !important;
    padding-right: 180px !important;
  }
}
@media only screen and (max-width: 34em), print {
  .lr-padding-180--mb {
    padding-left: 180px !important;
    padding-right: 180px !important;
  }
}
@media only screen and (min-width: 48em), print {
  .tb-padding-190 {
    padding-top: 190px !important;
    padding-bottom: 190px !important;
  }
}
@media only screen and (max-width: 34em), print {
  .tb-padding-190--mb {
    padding-top: 190px !important;
    padding-bottom: 190px !important;
  }
}
@media only screen and (min-width: 48em), print {
  .lr-padding-190 {
    padding-left: 190px !important;
    padding-right: 190px !important;
  }
}
@media only screen and (max-width: 34em), print {
  .lr-padding-190--mb {
    padding-left: 190px !important;
    padding-right: 190px !important;
  }
}
@media only screen and (min-width: 48em), print {
  .tb-padding-200 {
    padding-top: 200px !important;
    padding-bottom: 200px !important;
  }
}
@media only screen and (max-width: 34em), print {
  .tb-padding-200--mb {
    padding-top: 200px !important;
    padding-bottom: 200px !important;
  }
}
@media only screen and (min-width: 48em), print {
  .lr-padding-200 {
    padding-left: 200px !important;
    padding-right: 200px !important;
  }
}
@media only screen and (max-width: 34em), print {
  .lr-padding-200--mb {
    padding-left: 200px !important;
    padding-right: 200px !important;
  }
}
@media only screen and (min-width: 48em), print {
  .tb-padding-notset {
    padding-top: 60px;
    padding-bottom: 60px;
  }
}
@media only screen and (max-width: 34em), print {
  .tb-padding-notset--mb {
    padding-top: unset;
    padding-bottom: unset;
  }
}
@media only screen and (min-width: 48em), print {
  .lr-padding-notset {
    padding-left: 60px;
    padding-right: 60px;
  }
}
@media only screen and (max-width: 34em), print {
  .lr-padding-notset--mb {
    padding-left: unset;
    padding-right: unset;
  }
}
.blockcontainercontant-content {
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}
/*#
<div class="BlogSlider u-size4of5">
    <div class="BlogSlider-wrapper" data-module="Slider" data-slider="'autoPlay':false">
        <div class="BlogSlider-item">
            <div class="BlogSlider-itemWrapper">
                <img src="/Assets/Images/johanna-2.jpg" class="BlogSlider-itemImage" />
                <div class="BlogSlider-itemInfo">
                    <a href="#">
                        <p class="BlogSlider-itemTitle">Lorem ipsum dolor amhet</p>
                        <span class="BlogSlider-itemName">Karl Svenzon</span>
                    </a>
                </div>
            </div>
        </div>
        <div class="BlogSlider-item">
            <div class="BlogSlider-itemWrapper">
                <img src="/Assets/Images/johanna-2.jpg" class="BlogSlider-itemImage" />
                <div class="BlogSlider-itemInfo">
                    <a href="#">
                        <p class="BlogSlider-itemTitle">Lorem ipsum dolor amhet</p>
                        <span class="BlogSlider-itemName">Karl Svenzon</span>
                    </a>
                </div>
            </div>
        </div>
        <div class="BlogSlider-item">
            <div class="BlogSlider-itemWrapper">
                <img src="/Assets/Images/johanna-2.jpg" class="BlogSlider-itemImage" />
                <div class="BlogSlider-itemInfo">
                    <a href="#">
                        <p class="BlogSlider-itemTitle">Lorem ipsum dolor amhet</p>
                        <span class="BlogSlider-itemName">Karl Svenzon</span>
                    </a>
                </div>
            </div>
        </div>
        <div class="BlogSlider-item">
            <div class="BlogSlider-itemWrapper">
                <img src="/Assets/Images/johanna-2.jpg" class="BlogSlider-itemImage" />
                <div class="BlogSlider-itemInfo">
                    <a href="">
                        <p class="BlogSlider-itemTitle">Lorem ipsum dolor amhet</p>
                        <span class="BlogSlider-itemName">Karl Svenzon</span>
                    </a>
                </div>
            </div>
        </div>
        <div class="BlogSlider-item">
            <div class="BlogSlider-itemWrapper">
                <img src="/Assets/Images/johanna-2.jpg" class="BlogSlider-itemImage" />
                <div class="BlogSlider-itemInfo">
                    <a href="#">
                        <p class="BlogSlider-itemTitle">Lorem ipsum dolor amhet</p>
                        <span class="BlogSlider-itemName">Karl Svenzon</span>
                    </a>
                </div>
            </div>
        </div>
    </div>
    <span class="BlogSlider-navigation BlogSlider-navigation--prev">PREV</span>
    <span class="BlogSlider-navigation BlogSlider-navigation--next">NEXT</span>
</div>
*/
.BlogSlider {
  display: block;
  position: relative;
  margin-right: -50px;
  margin-left: -10px;
  padding: 20px 50px 20px 10px;
  overflow-x: hidden;
}
.BlogSlider-itemInfo {
  color: #fff;
}
.BlogSlider-itemInfo a:hover {
  color: #fff;
}
.BlogSlider-item {
  position: relative;
  float: left;
  padding: 0 0.625em;
  color: #fff;
  width: 100%;
}
@media only screen and (min-width: 48em), print {
  .BlogSlider-item {
    padding: 0 0.83333333em;
  }
}
.BlogSlider-itemWrapper {
  height: 0;
  padding-bottom: 125%;
  overflow: hidden;
  -webkit-box-shadow: inset 0px -100px 100px -40px rgba(0, 0, 0, 0.6);
          box-shadow: inset 0px -100px 100px -40px rgba(0, 0, 0, 0.6);
  -webkit-transition: box-shadow 0.3s;
  -o-transition: box-shadow 0.3s;
  -webkit-transition: -webkit-box-shadow 0.3s;
  transition: -webkit-box-shadow 0.3s;
  transition: box-shadow 0.3s;
  transition: box-shadow 0.3s, -webkit-box-shadow 0.3s;
}
.BlogSlider-itemWrapper:hover {
  -webkit-box-shadow: inset 0px -100px 100px -40px rgba(0, 0, 0, 0.6), 0px 8px 30px -8px #000;
          box-shadow: inset 0px -100px 100px -40px rgba(0, 0, 0, 0.6), 0px 8px 30px -8px #000;
}
.BlogSlider-itemInfo {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  padding: 0.83333333em 1.875em;
  word-break: break-word;
}
.BlogSlider-itemTitle {
  margin: 0;
  line-height: 1.3;
  font-size: 0.9375em;
}
.BlogSlider-itemName {
  display: block;
  margin-top: 0.625em;
  line-height: 1.3;
  font-weight: 600;
}
.BlogSlider-itemImage {
  position: relative;
  z-index: -1;
}
.BlogSlider-navigation {
  width: 50px;
  height: 50px;
  line-height: 45px;
  border: 2px solid #eee;
  border-radius: 50%;
  background: #fff;
  position: absolute;
  text-align: center;
  cursor: pointer;
  opacity: 0;
  visibility: hidden;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  -webkit-transition: opacity 0.3s, visibility 0.3s;
  -o-transition: opacity 0.3s, visibility 0.3s;
  transition: opacity 0.3s, visibility 0.3s;
}
.BlogSlider-navigation.is-active {
  opacity: 1;
  visibility: visible;
}
.BlogSlider-navigation.BlogSlider-navigation--prev {
  left: 0;
}
.BlogSlider-navigation.BlogSlider-navigation--next {
  right: 40px;
}
.BlogSlider .owl-wrapper-outer {
  overflow: initial;
}
/*#

Component displaying a navigation breadcrumb.

Examples:

<div>
    <div class="Breadcrumb">
        <ol class="Breadcrumb-list">
            <li class="Breadcrumb-item"><a href="#" class="Breadcrumb-itemLink">Home</a></li>
            <li class="Breadcrumb-item"><a href="#" class="Breadcrumb-itemLink">Education</a></li>
            <li class="Breadcrumb-item"><a href="#" class="Breadcrumb-itemLink">Patients</a></li>
            <li class="Breadcrumb-item"><a href="#" class="Breadcrumb-itemLink">Balloon Pump Therapy (IABP)</a></li>
            <li class="Breadcrumb-item"><a href="#" class="Breadcrumb-itemLink">Your Heart: How It Works</a></li>
        </ol>
    </div>    
</div>

*/
.Breadcrumb {
  color: #aeaeae;
  font-size: 0.85714286em;
  padding: 0 0.5em;
  min-height: 25px;
}
@media only screen and (min-width: 100.3125em) {
  .Breadcrumb {
    padding: 0;
  }
}
.Breadcrumb-home {
  width: 20px;
  height: 20px;
  position: relative;
  top: -2px;
}
.Breadcrumb-list {
  padding-top: 0.83333333em !important;
}
.Breadcrumb-mobile {
  color: #aeaeae;
  font-size: 0.8em;
  min-height: 25px;
  padding-top: 2px;
}
.Breadcrumb-mobile .Breadcrumb-list {
  padding-bottom: 2px;
  padding-top: 0.9em !important;
}
.Breadcrumb-mobile .Breadcrumb-list .Breadcrumb-item.toggler.is-active {
  display: none;
}
.Breadcrumb-mobile .Breadcrumb-list .Breadcrumb-home {
  width: 22px;
  height: 22px;
}
@media only screen and (max-width: 34em), print {
  .Page-container.u-paddingVsm {
    padding-bottom: 0px !important;
  }
}
.Breadcrumb-expanded-list {
  display: none;
  color: #aeaeae;
  font-size: 0.75em;
  min-height: 25px;
}
.Breadcrumb-expanded-list ul {
  list-style: none;
  padding: 0.5em 1.813em 0 1.813em;
}
.Breadcrumb-expanded-list.is-active {
  display: block !important;
}
.Breadcrumb-expanded-list .Breadcrumb-exp-item:after {
  content: "›";
  margin-left: 0.6em;
}
.Breadcrumb-list {
  max-width: 1605px;
  list-style: none;
  margin: 0 auto;
  padding: 0;
}
.Breadcrumb-item {
  margin-right: 0.4em;
  display: inline-block;
}
.Breadcrumb-item-hidden {
  display: none;
}
.Breadcrumb-item:after {
  content: "›";
  margin-left: 0.6em;
}
.Breadcrumb-item:last-child {
  margin-right: 0;
}
.Breadcrumb-item:last-child:after {
  content: none;
}
.Breadcrumb-item.is-active {
  display: inline-block;
}
.Breadcrumb-itemLink {
  color: #009fdf;
  display: inline-block;
  /*color: @Breadcrumb-linkColor;*/
}
.Byline {
  border-top: 4px solid #ddd;
}
.Byline-author {
  border-top: 4px solid #002d72;
  -webkit-box-shadow: 0px 4px 8px #ddd;
          box-shadow: 0px 4px 8px #ddd;
  padding: 1em 0;
}
.Byline--Green {
  border-top-color: #78be20;
}
.Byline--Blue {
  border-top-color: #009fdf;
}
.Byline--Darkblue {
  border-top-color: #002d72;
}
.Byline--Red {
  border-top-color: red;
}
.Byline--Purple {
  border-top-color: #7a4183;
}
.Byline--trafficlightYellow {
  border-top-color: #ffcd00;
}
.Byline--trafficlightRed {
  border-top-color: #a61731;
}
.Byline a {
  color: #009fdf;
}
.Byline .Button {
  width: 100%;
  color: #ffffff;
}
.Byline p {
  font-size: 0.8125em;
}
@media only screen and (min-width: 57.5em), print {
  .Byline p {
    font-size: 1em;
  }
  .Byline p:first-child {
    margin-top: 0;
  }
}
.Byline img {
  width: 100%;
  height: auto;
}
.Byline img.Icon {
  width: 0.8em;
  max-height: 0.8em;
}
.Byline-document img {
  width: 50%;
}
.Byline-author .Social-list {
  margin-top: 1.25em;
  margin-bottom: 1.25em;
}
.Byline-author .Social-list img {
  width: auto;
  height: auto;
}
img.Byline-author--image {
  height: 50px;
  width: 50px;
  border-radius: 5em;
}
@media only screen and (min-width: 48em), print {
  img.Byline-author--image {
    margin-top: 20px;
    height: 112px;
    width: 112px;
    margin-bottom: 20px;
  }
}
@media only screen and (min-width: 75em) {
  .Byline {
    width: 300px;
    margin-left: auto;
  }
}
.Card {
  position: relative;
  background-color: #fff;
}
@media only screen and (min-width: 57.5em), print {
  .Card:hover {
    -webkit-box-shadow: #ccc 0 5px 10px 0px;
            box-shadow: #ccc 0 5px 10px 0px;
    cursor: pointer;
  }
  .Card:hover .Link--blue {
    text-decoration: underline;
  }
}
.Card .Link--blue {
  position: absolute;
  bottom: 2em;
  width: 100%;
  left: 0;
}
.Card .Link--blue img {
  height: 12px;
  position: relative;
  top: -1px;
  left: 6px;
}
.Card a:hover {
  text-decoration: none;
  color: #333;
}
.Card-content {
  margin-bottom: 65px;
}
.Card--noHover:hover {
  -webkit-box-shadow: none;
          box-shadow: none;
  cursor: default;
}
@media only screen and (min-width: 48em), print {
  .Card--withBorder::after {
    content: "";
    display: block;
    height: 75%;
    width: 1px;
    position: absolute;
    right: -1em;
    top: 5%;
    background-color: #f3f3f3;
  }
}
.circle {
  width: 250px;
  height: 250px;
  border-radius: 50%;
  float: right;
}
.circle--Blue {
  background-color: #009fdf;
}
.circle--DarkBlue {
  background-color: #002d72;
}
.circle--Green {
  background-color: #78be20;
}
.circle--Purple {
  background-color: #7a4183;
}
.circle--Pink {
  background-color: #EA7EB4;
}
.circle--Yellow {
  background-color: yellow;
}
.circle--White {
  background-color: #ffffff;
}
.circle-text--white {
  color: #ffffff;
}
.circle-text--black {
  color: #333333;
}
.inner-circle {
  border-radius: 50%;
  width: 100%;
  height: 100%;
  padding: 10px;
  display: table;
}
.inner-circle p {
  display: table-cell;
  text-align: center;
  vertical-align: middle;
  font-size: 24px;
  font-weight: bold;
  font-family: "Whitney SSm A", "Whitney SSm B", Arial;
  line-height: 35px;
}
.circle-wrapper {
  display: none;
}
@media only screen and (min-width: 75em) {
  .circle-wrapper {
    display: inline-block;
    position: relative;
    z-index: 99;
    text-align: center;
    height: 100%;
    width: 100%;
    margin-bottom: -80px;
  }
}
@media only screen and (min-width: 75em) {
  .Push > .has-circle {
    display: inline-block;
  }
}
/*#
<div>
    <h2>CityItem--big</h2>
    <a href="#" class="CityItem CityItem--big u-md-size1of3">
        <div class="AspectRatio AspectRatio--21by9">
            <div class="CityItem-image CityItem-image--static"></div>
        </div>
        <span class="CityItem-badge">13</span>
        <h3 class="CityItem-title CityItem-title--thin">Ankeborg</h3>
    </a>
</div>
<div>
    <h2 class="u-marginTlg">CityItem--small</h2>
    <a href="#" class="CityItem CityItem--small u-md-size1of4">
        <div class="CityItem-image CityItem-image--static"></div>
        <span class="CityItem-badge">13</span>
        <h4 class="CityItem-title CityItem-title--thin">Ankeborg</h4>
    </a>
</div>
*/
.CityItem {
  display: block;
  position: relative;
}
.CityItem:hover {
  color: #333;
  text-decoration: none;
}
.CityItem-image {
  position: relative;
  overflow: hidden;
  background-size: cover;
  background-position: center;
}
.CityItem-image.CityItem-image--static {
  display: block;
  background-color: cadetblue;
}
.CityItem-title {
  display: inline-block;
  font-size: 1.25em;
}
.CityItem-title.CityItem-title--thin {
  font-weight: normal;
}
.CityItem-title.CityItem-title-bold {
  font-weight: bold;
}
.CityItem-info {
  font-size: 1.25em;
  margin: 0;
}
.CityItem-badge {
  border: 1px solid #ddd;
  font-size: 1.125em;
  padding-top: 3px;
  position: relative;
  display: inline-block;
  border-radius: 50%;
  height: 40px;
  width: 40px;
  text-align: center;
  font-weight: bold;
  background: #fff;
}
.CityItem.CityItem--big .CityItem-title {
  margin-top: 20px;
}
.CityItem.CityItem--big .CityItem-badge {
  margin-right: 0.83333333em;
}
.CityItem.CityItem--small .CityItem-image {
  height: 100px;
  width: 100px;
  display: inline-block;
  vertical-align: middle;
}
.CityItem.CityItem--small .CityItem-title {
  margin-left: 1.25em;
}
.CityItem.CityItem--small .CityItem-badge {
  position: absolute;
  margin-right: 0;
  margin-top: 29px;
  margin-left: -25px;
}
.CityItem.CityItem--thumbnail .CityItem-title {
  line-height: 1.5 !important;
  margin-top: 0.83333333em;
}
.CityItem.CityItem--thumbnail .CityItem-info {
  font-size: 0.9375em;
}
.CityItem.CityItem--thumbnail .CityItem-link {
  display: inline-block;
  font-weight: bold;
  margin-top: 0.83333333em;
  color: #009fdf;
  text-decoration: underline;
}
.Contactblock {
  text-align: center;
  border: 4px solid #009fdf;
  word-break: break-word;
  margin: 30px;
}
@media only screen and (max-width: 48em), print {
  .Contactblock {
    margin: 10px;
  }
}
@media only screen and (max-width: 26.25em), print {
  .Contactblock {
    margin: auto;
  }
}
.Contactblock a {
  color: #009fdf;
  font-weight: 700;
}
.Contactblock a[href^="mailto:"] {
  font-size: 1.5em;
  text-decoration: underline;
}
.Contactblock-topheading {
  background-color: #009fdf;
}
.Contactblock-topheading h3 {
  color: white;
  padding: 40px;
  line-height: 1.5em !important;
}
.Contactblock-content {
  margin: 30px;
}
.Contactblock-content h4 {
  font-weight: 750;
}
.Contactblock-content--text {
  line-height: 1.5em;
  font-weight: 500;
  font-size: 0.9em;
  padding-bottom: 20px;
  padding-top: 10px;
}
.Contactblock-content--btn {
  padding-bottom: 15px;
  padding-top: 35px;
}
.Contactblock .Contact-image {
  border-radius: 50%;
  overflow: hidden;
  width: 200px;
  height: 200px;
  margin: 0 auto;
}
@media only screen and (min-width: 48em) and (max-width: 57.5em), print {
  .Contactblock .Contact-image {
    height: 130px;
    width: 130px;
  }
}
.Contactblock .Contact-image--small {
  height: 130px;
  width: 130px;
}
.Contactblock .Contact-image img {
  height: 100%;
  max-width: none;
}
.Contactblock .Contact-info--label {
  margin-bottom: 0px;
}
.Contactblock .Contact-info--phone {
  font-size: 2.1em;
}
.Contactblock .Contact-info--name {
  color: #009fdf;
}
.Contactblock .contactdivider {
  padding-bottom: 30px;
}
.Contactperson-block {
  background-color: #fff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-top: 15px;
  position: relative;
}
.Contactperson-block--overlay {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  right: 0;
}
.Contactperson-block--overlay:hover {
  -webkit-box-shadow: 0 0 14px rgba(33, 33, 33, 0.2);
          box-shadow: 0 0 14px rgba(33, 33, 33, 0.2);
}
.Contactperson-block .Contact {
  width: 100%;
  float: left;
  -webkit-box-shadow: 0px 0px 6px #ddd;
          box-shadow: 0px 0px 6px #ddd;
  color: #333;
  padding-top: 30px;
  padding-bottom: 30px;
}
.Contactperson-block .Contact .Grid .Grid-cell {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.Contactperson-block .Contact .Contact-image-wrapper {
  display: table;
  height: 100%;
  width: 100%;
}
.Contactperson-block .Contact .Contact-image-wrapper--inner {
  display: table-cell;
  vertical-align: middle;
}
.Contactperson-block .Contact-image {
  border-radius: 50%;
  overflow: hidden;
  width: 200px;
  margin-left: 40px;
  height: 200px;
  margin: 0 auto;
}
.Contactperson-block .Contact-image .circle--Green {
  float: none !important;
}
.Contactperson-block .Contact-image--small {
  height: 130px;
  width: 130px;
  margin-left: 40px !important;
}
.Contactperson-block .Contact-image--small .circle-text--white {
  font-size: 45px;
}
@media only screen and (max-width: 57.5em), print {
  .Contactperson-block .Contact-image--small {
    height: 200px;
    width: 200px;
    margin-left: auto !important;
  }
}
.Contactperson-block .Contact-image--small img {
  height: 100%;
  max-width: none;
}
.Contactperson-block .Contact .Contact-w {
  margin-left: 30px;
  width: 100%;
  height: 100%;
  display: table;
  vertical-align: middle;
}
@media only screen and (max-width: 57.5em), print {
  .Contactperson-block .Contact .Contact-w {
    margin-left: auto !important;
    text-align: center;
    padding-top: 30px !important;
  }
}
.Contactperson-block .Contact .Contact-w .Contact-info {
  display: table-cell;
  vertical-align: middle;
  line-height: 1.5;
}
.Contactperson-block .Contact .Contact-w .Contact-info--title {
  font-size: 18px;
  font-style: italic;
  margin-top: -0.5em;
  margin-bottom: 0.3em;
}
.Contactperson-block .Contact .Contact-w .Contact-info--title:hover {
  text-decoration: none !important;
  color: #333 !important;
}
.Contactperson-block .Contact .Contact-w .Contact-info--phone {
  font-size: 18px;
  position: relative;
  z-index: 1;
  pointer-events: all;
}
.Contactperson-block .Contact .Contact-w .Contact-info--email {
  font-size: 18px;
  color: #009fdf;
  position: relative;
  z-index: 1;
  pointer-events: all;
}
.Contactperson-block .Contact .contact-text {
  margin: 24px;
  vertical-align: bottom;
  background-color: #d2edfd;
  border-radius: 25px;
  float: right;
}
.Contactperson-block .Contact .contact-text--inner {
  margin: 20px;
}
.u-md-size1of3 .Contactperson-block {
  left: 0.83333333em;
  width: 300px;
  margin-left: auto;
  position: relative;
  text-align: center;
}
@media only screen and (max-width: 57.5em), print {
  .u-md-size1of3 .Contactperson-block {
    margin: auto;
    left: auto;
  }
}
.u-md-size1of3 .Contactperson-block .Grid {
  display: block !important;
}
.u-md-size1of3 .Contactperson-block .Grid .u-lg-size1of5,
.u-md-size1of3 .Contactperson-block .Grid .u-lg-size2of5 {
  width: unset !important;
}
.u-md-size1of3 .Contactperson-block .Grid .u-lg-size1of5 .Contact-w,
.u-md-size1of3 .Contactperson-block .Grid .u-lg-size2of5 .Contact-w {
  margin-left: auto !important;
  padding-top: 30px;
}
.u-md-size1of3 .Contactperson-block .Grid .u-lg-size1of5 .Contact-image--small,
.u-md-size1of3 .Contactperson-block .Grid .u-lg-size2of5 .Contact-image--small {
  height: 200px;
  width: 200px;
  margin-left: auto;
}
.u-md-size1of3 .Contactperson-block .Grid .u-lg-size1of5 .Contact-image--small .circle-text--white,
.u-md-size1of3 .Contactperson-block .Grid .u-lg-size2of5 .Contact-image--small .circle-text--white {
  font-size: 55px;
}
/*#
<div>
    <div class="ContactItem u-cf u-sm-size1of2">
        <div class="ContactItem-image">
            <img src="/Assets/Images/johanna-2.jpg" />
        </div>
        <div class="ContactItem-info">
            <h4 class="u-marginAz">Karl Anksson</h4>
            <p class="u-marginAz">Lorem ipsum dolor ahmet</p>
            <hr />
            <a href="#" class="Link Link--blue">karl.anksson@ankeborg.nu</a>
            <hr />
            <p>0707 7070 7070</p>
        </div>
    </div>
    <br>
    <div class="ContactItem u-cf u-sm-size1of2">
        <span class="ContactItem-image ContactItem-image--static"></span>
        <div class="ContactItem-info">
            <h4 class="u-marginAz">Karl Anksson</h4>
            <p class="u-marginAz">Lorem ipsum dolor ahmet</p>
            <hr />
            <a href="#" class="Link Link--blue">karl.anksson@ankeborg.nu</a>
            <hr />
            <p>0707 7070 7070</p>
        </div>
    </div>
</div>
*/
.ContactItem {
  display: block;
  min-height: 200px;
  text-align: center;
}
@media only screen and (min-width: 48em), print {
  .ContactItem {
    display: inline-block;
    text-align: left;
  }
}
@media only screen and (max-width: 34em), print {
  .ContactItem-anchor:target::before {
    content: "";
    display: block;
    height: 99px;
    margin: -99px 0 0;
  }
}
.ContactItem-image {
  width: 100px;
  height: 100px;
  border-radius: 50%;
  display: block;
  overflow: hidden;
  margin: 0 auto;
}
.ContactItem-image.ContactItem-image--small {
  width: 50px;
  height: 50px;
  margin-right: 8px;
  float: left;
}
.ContactItem-image.ContactItem-image--medium {
  width: 125px;
  height: 125px;
}
@media only screen and (min-width: 57.5em), print {
  .ContactItem-image.ContactItem-image--medium {
    float: left;
  }
}
.ContactItem-image.ContactItem-image--large {
  width: 200px;
  height: 200px;
}
@media only screen and (min-width: 57.5em), print {
  .ContactItem-image.ContactItem-image--large {
    float: right;
  }
}
@media only screen and (min-width: 48em), print {
  .ContactItem-image {
    float: left;
  }
}
.ContactItem-image.ContactItem-image--static {
  background-color: cadetblue;
}
.ContactItem-image .circle-text--white {
  font-size: 35px;
  font-weight: normal;
}
.ContactItem-image .circle-text--white--small {
  font-size: 17.5px;
}
.ContactItem-image .circle-text--white--medium {
  font-size: 45px;
}
.ContactItem-image .circle-text--white--large {
  font-size: 70px;
}
.ContactItem-info {
  margin-top: 0.83333333em;
  display: inline-block;
  width: 100%;
}
@media only screen and (min-width: 48em), print {
  .ContactItem-info {
    display: block;
    margin-top: 0;
    margin-left: 120px;
    width: auto;
  }
}
.ContactItem-info a {
  word-break: break-word;
}
/*#

Responsible for styling CMS content where it is not possible to add custom CSS-classes. 
For example adding styling for <p>, <ul> etc.

Examples:

<div class="Content">
    <h2>Heading</h2>
    <p>Lorem ipsum dolor sit amet.</p>
    <ul>
        <li>List item</li>
        <li>List item</li>
    </ul>
    <img src="" />
</div>

*/
.contentfilter-content {
  width: 60%;
  margin: auto;
  text-align: center;
}
.contentfilter-button {
  position: relative;
  left: -4px;
}
.contentfilter-input {
  display: inline;
  width: 50%;
}
input[type=text].contentfilter-input {
  padding-bottom: 18px;
  padding-top: 15px;
}
* .contentfilter-hidden {
  display: none;
}
/*#

Display a cookie consent dialog to let users know that this website is using cookies.

Examples:

<div>
    <div class="CookieConsent CookieConsent--bottomRight">
        <div class="CookieConsent-dialog">
            <span class="CookieConsent-content">
                <span class="CookieConsent-message">This website uses cookies to ensure you get the best experience on our website</span>
                <a href="/cookie-policy" class="CookieConsent-learnMore">More info</a>
            </span>
            
            <button class="Button CookieConsent-accept">Got it</button>
        </div>
    </div>    
</div>

*/
.CookieConsent {
  position: relative;
  z-index: 10000;
  width: 100%;
  height: 100%;
}
.CookieConsent .Cookie-grid {
  margin-left: auto;
  margin-right: auto;
}
.CookieConsent .Cookie-grid .dismissContainer {
  float: right;
  padding-right: 2em;
}
.CookieConsent .Cookie-grid .learnMoreContainer {
  float: right;
  padding-right: 2em;
  padding-top: 0.5em;
}
.allow-read .CookieConsent {
  height: 0;
}
.CookieConsent-checkboxlabel {
  margin-right: 30px;
  position: relative;
}
.CookieConsent-checkbox {
  width: 20px;
  margin-right: 6px;
  display: none;
}
.CookieConsent-checkbox + label::before {
  content: "";
  display: inline-block;
  background-color: #ffffff;
  border: solid 1px #ddd;
  width: 20px;
  height: 20px;
  position: relative;
  top: 3px;
  left: -5px;
}
.CookieConsent-checkbox:checked:disabled + label::before {
  background-color: #ddd;
}
.CookieConsent-checkbox:checked + label::before {
  background: no-repeat url('/Assets/Icons/check.svg');
  background-position: center;
  background-size: 90%;
  background-color: #009fdf;
}
.CookieConsent-checkboxcontainer {
  margin-top: 30px;
  padding-left: 6px;
}
@media only screen and (min-width: 34em), print {
  .CookieConsent .learnMoreContainer {
    text-align: right;
    padding-right: 20px;
  }
}
.CookieConsent-dialog {
  color: inherit;
  display: none;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 1.25em;
  font-size: 0.8125em;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  position: fixed;
  bottom: 0;
  border-top: solid 4px #002d72;
  background-color: #ffffff;
}
.is-active .CookieConsent-dialog {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
@media only screen and (min-width: 34em), print {
  .CookieConsent-dialog {
    font-size: 1em;
  }
}
.CookieConsent-dialog > * div {
  -ms-flex-item-align: center;
      align-self: center;
}
.CookieConsent-dialog Button {
  outline: none;
  -webkit-box-shadow: 0 0 1px 1px #000;
          box-shadow: 0 0 1px 1px #000;
}
.CookieConsent-dialog Button.CookieConsent-dismiss {
  white-space: nowrap;
  -webkit-box-shadow: none;
          box-shadow: none;
}
.CookieConsent-content {
  -webkit-box-flex: 1;
      -ms-flex: 1 1 auto;
          flex: 1 1 auto;
  padding-right: 1.25em;
  line-height: 1.4em;
}
.CookieConsent--top {
  height: 3.75rem;
  margin-top: -3.75rem;
  -webkit-transition: margin-top 0.8s ease-in-out;
  -o-transition: margin-top 0.8s ease-in-out;
  transition: margin-top 0.8s ease-in-out;
}
.CookieConsent--top.is-active {
  margin-top: 0;
}
.CookieConsent--top.is-active .CookieConsent-dialog {
  -webkit-transform: translateY(0);
      -ms-transform: translateY(0);
          transform: translateY(0);
  -webkit-box-shadow: 0 0 8px rgba(0, 0, 0, 0.15);
          box-shadow: 0 0 8px rgba(0, 0, 0, 0.15);
}
.CookieConsent--top .CookieConsent-dialog {
  height: 3.75rem;
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  -webkit-box-shadow: none;
          box-shadow: none;
  -webkit-transition: 0.8s ease-in-out;
  -o-transition: 0.8s ease-in-out;
  transition: 0.8s ease-in-out;
  -webkit-transition-property: -webkit-transform, -webkit-box-shadow;
  transition-property: -webkit-transform, -webkit-box-shadow;
  -o-transition-property: transform, box-shadow;
  transition-property: transform, box-shadow;
  transition-property: transform, box-shadow, -webkit-transform, -webkit-box-shadow;
}
@media only screen and (min-width: 34em), print {
  .CookieConsent--top .CookieConsent-dialog {
    position: fixed;
    -webkit-transform: translateY(-100%);
        -ms-transform: translateY(-100%);
            transform: translateY(-100%);
  }
}
.CookieConsent--bottom,
.CookieConsent--bottomRight {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  -webkit-transform: translateY(120%);
      -ms-transform: translateY(120%);
          transform: translateY(120%);
  -webkit-transition: -webkit-transform 0.8s ease-in-out;
  transition: -webkit-transform 0.8s ease-in-out;
  -o-transition: transform 0.8s ease-in-out;
  transition: transform 0.8s ease-in-out;
  transition: transform 0.8s ease-in-out, -webkit-transform 0.8s ease-in-out;
}
.CookieConsent--bottom.is-active,
.CookieConsent--bottomRight.is-active {
  -webkit-transform: translateY(0);
      -ms-transform: translateY(0);
          transform: translateY(0);
}
@media only screen and (min-width: 34em), print {
  .CookieConsent--bottomRight {
    left: inherit;
    right: 1.25em;
    bottom: 1.25em;
  }
  .CookieConsent--bottomRight .CookieConsent-dialog {
    max-width: 22em;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
  .CookieConsent--bottomRight .CookieConsent-content {
    display: block;
    margin-bottom: 1em;
    padding-right: 0;
  }
  .CookieConsent--bottomRight .CookieConsent-dismiss {
    width: 100%;
  }
}
.CookieConsent-learnMore {
  text-decoration: none;
}
@media only screen and (max-width: 34em), print {
  .CookieConsent-learnMore {
    margin-top: 20px;
    margin-bottom: 20px;
  }
}
/*#


*/
.DropdownMenu {
  position: relative;
  padding: 1.25em 0;
}
@media only screen and (min-width: 57.5em), print {
  .DropdownMenu {
    padding: 0;
  }
}
.DropdownMenu-list {
  display: none;
  position: relative;
  background-color: #ffffff;
  padding: 1.25em;
  margin: 0;
  -webkit-box-shadow: 0px 2px 10px 2px rgba(0, 0, 0, 0.1);
          box-shadow: 0px 2px 10px 2px rgba(0, 0, 0, 0.1);
  list-style-type: none;
  margin-top: 1.25em;
  z-index: 2;
}
@media only screen and (min-width: 48em), print {
  .DropdownMenu-list {
    position: absolute;
    left: 120px;
    min-width: 400px;
    margin-top: 0;
  }
}
.DropdownMenu-list.is-active {
  display: block;
}
.DropdownMenu-item {
  font-weight: bold;
  margin: 0.83333333em 0;
}
.DropdownMenu-image {
  float: left;
  width: 80px;
  height: 80px;
}
.DropdownMenu-title {
  display: block;
  font-size: 1.25em;
  font-weight: bold;
  margin-left: 100px;
  cursor: pointer;
  padding-right: 30px;
  background: url('/Assets/Icons/chevron_down.svg') 100% 50% no-repeat;
}
.DropdownMenu-title.is-active {
  background: url('/Assets/Icons/chevron_up_blue.svg') 100% 50% no-repeat;
  background-size: 15px;
}
@media only screen and (min-width: 34em), print {
  .DropdownMenu-title {
    display: inline-block;
    line-height: 80px;
    margin-left: 40px;
  }
}
.Event {
  padding-top: 2em;
}
@media only screen and (min-width: 57.5em), print {
  .Event {
    padding-top: 0;
  }
}
#EventForm .Button,
#EventForm input {
  width: 60%;
}
#EventForm .Button {
  margin-top: 2em;
}
#EventForm .EventBlock-box {
  padding: 70px 0;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
  -webkit-box-shadow: 0px 4px 8px #ddd;
  box-shadow: 0px 4px 8px #ddd;
  border-top: 4px solid #002d72;
  background: white;
}
#EventForm form p,
#EventForm #notfound {
  color: red !important;
  margin: 0;
}
/*#
<div>
    <a href="#" class="EventItem u-cf u-sm-size1of2">
        <div class="EventItem-badge">
            <div class="EventItem-badgeContent">
                <span class="EventItem-badgeDay">23</span>
                <span class="EventItem-badgeMonth">Juli</span>
            </div>
        </div>
        <div class="EventItem-info">
            <h4 class="u-marginAz">Titel</h4>
            <p class="u-marginTz">Beskrivning</p>
        </div>
    </a>
</div>
 */
.EventItem {
  display: block;
}
.EventItem:hover {
  text-decoration: none;
}
.EventItem-badge {
  width: 150px;
  height: 120px;
  color: #fff;
  display: block;
  background-color: #009fdf;
}
@media only screen and (min-width: 48em), print {
  .EventItem-badge {
    float: left;
  }
}
.EventItem-badgeContent {
  text-align: center;
  padding-top: 0.83333333em;
}
.EventItem-badgeDay {
  display: block;
  font-size: 2.5em;
  font-weight: bold;
  line-height: 1.2;
}
.EventItem-badgeMonth {
  font-size: 1.25em;
  font-weight: bold;
}
.EventItem-info {
  margin-top: 0.83333333em;
}
@media only screen and (min-width: 48em), print {
  .EventItem-info {
    margin-top: 0;
    margin-left: 170px;
  }
}
/*#

Display figure captions to images and other media.

Examples:

<div>
    <figure class="Figure">
        <img src="assets/images/temp/nansen-office-flowers.jpg" class="Figure-object" />
        <figcaption class="Figure-caption">Flowers in the Nansen Chicago office.</figcaption>
    </figure>    
</div>

*/
.Figure {
  margin: 0;
  display: inline-block;
}
.Figure-caption {
  font-size: 1.125em;
  color: #aaa;
  margin: 0.5em 0;
}
.Figure-caption.Figure-caption--right {
  text-align: right;
}
.Figure--right {
  float: right;
  margin-left: 1.25em;
}
.Figure--left {
  float: left;
  margin-right: 1.25em;
}
/*#

Form styling.

Examples:

<div>
    <!-- replace this comment with example HTML -->    
</div>

*/
.Form {
  padding: 5%;
  position: fixed;
  height: 100%;
  width: 100%;
  overflow: auto;
  top: 0;
  left: 0;
  z-index: 99999;
  background-color: #009fdf;
  padding-bottom: 50px;
}
.Form * {
  color: #ffffff;
}
.Form ::-webkit-scrollbar {
  display: none;
}
.Form ::-webkit-input-placeholder {
  color: rgba(255, 255, 255, 0.5) !important;
}
.Form label,
.Form input {
  /*display: block;*/
  /*width: 100%;*/
}
.Form label {
  font-weight: bold;
}
.Form input {
  margin-bottom: 2.5em;
  color: rgba(255, 255, 255, 0.5) !important;
  background-color: rgba(0, 45, 114, 0.2);
  border: 0 !important;
}
.Form textarea,
.Form select {
  margin-bottom: 2.5em;
  color: rgba(255, 255, 255, 0.5) !important;
  background-color: rgba(0, 45, 114, 0.2);
  border: 0 !important;
}
.Form input[type=text],
.Form textarea {
  display: block;
  width: 100%;
  color: #000 !important;
}
.Form button {
  display: block;
  width: auto;
}
.Form-wrap {
  position: relative;
  width: 100%;
  /*height: ~"calc(100% - 65px)";*/
  margin: 0 auto;
  max-width: 1440px;
  top: 20px;
}
.Form-content {
  /*height: ~"calc(100% + 85px)"; /*less calc escaped string */
}
/*.js-form {
    display: none;

    &.is-active {
        display: block;
    }
}*/
.Form-Trigger {
  display: block;
  height: 50px;
  width: 50px;
  border-radius: 100%;
  bottom: 10px;
  right: 2%;
  -webkit-transition: background ease-in-out 0.2s;
  -o-transition: background ease-in-out 0.2s;
  transition: background ease-in-out 0.2s;
  text-align: center;
  position: relative;
  z-index: 999;
}
.Form-Trigger--Green {
  background-color: #78be20;
}
.Form-Trigger--Blue {
  background-color: #009fdf;
}
.Form-Trigger--DarkBlue {
  background-color: #002d72;
}
.Form-Trigger img {
  position: relative;
  top: 10px;
}
.Form-Trigger:hover {
  background-color: #002d72;
}
.Form-Trigger span {
  font-weight: 800;
  position: absolute;
  top: -40px;
  left: -15px;
  line-height: 1em;
}
@media only screen and (max-width: 57.5em), print {
  .Form-Trigger span {
    display: none !important;
  }
}
@media only screen and (min-width: 57.5em), print {
  .Form-Trigger {
    height: auto;
    width: auto;
    bottom: 50px;
    right: 30px;
    border-top-left-radius: 0.5em;
    border-bottom-left-radius: 0.5em;
    border-top-right-radius: 0.5em;
    border-bottom-right-radius: 0.5em;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding: 10px;
  }
  .Form-Trigger .form-icon {
    position: unset;
    display: inline-block;
    margin-right: 7px;
  }
  .Form-Trigger span {
    font-weight: 550;
    position: unset;
    display: inline-block !important;
    line-height: initial;
    color: white;
  }
  .Form-Trigger span img {
    position: inherit;
  }
}
@media only screen and (min-width: 48em), print {
  .Form {
    padding: 0;
  }
  .Form-wrap {
    height: 100%;
    top: 0;
  }
  .Form-content {
    position: static;
    margin-top: 10%;
  }
}
.contact-sticky {
  z-index: 999;
  display: none;
  -webkit-transition: all ease-in 0.5s;
  -o-transition: all ease-in 0.5s;
  transition: all ease-in 0.5s;
  display: block;
  position: fixed;
  bottom: 30px;
  right: -100%;
}
.contact-sticky.is-sticky {
  right: 0;
}
.contact-sticky * {
  display: inline;
  white-space: nowrap;
}
.contact-sticky .Form-Trigger {
  display: inline-block;
}
.contact-sticky .Form-Trigger img {
  top: 0;
  margin-right: 0;
  margin-left: 7px;
}
.contact-sticky .Form-Trigger img.form-icon {
  margin-right: 7px;
  margin-left: 0;
  position: relative;
}
@media only screen and (max-width: 57.5em), print {
  .contact-sticky .Form-Trigger img.form-icon {
    top: 11px;
    left: 3px;
  }
}
.contact-sticky .Form-Trigger span {
  text-align: left !important;
  position: static;
  display: inline !important;
  font-weight: 500;
}
@media only screen and (max-width: 57.5em), print {
  .contact-sticky .Form-Trigger .u-hidden {
    display: none !important;
  }
}
/*#
  **Core grid component**
 
  The Grid-cell should be combined with a utils-size class for the specific breakpoint you want to target.
  
  DO NOT apply dimension or offset utilities to the `Grid` element. All cell
  widths and offsets should be applied to child grid cells.
  
  **Example uses:**
 
  <div class="Grid Grid--withGutter [Grid--alignCenter|Grid--alignRight|Grid--withGutter]">
    <div class="Grid-cell [Grid-cell--center] u-xsm-size1of2">1of2</div>
    <div class="Grid-cell u-xsm-size1of2">1of2</div>
    <div class="Grid-cell u-xsm-size1of3">1of3</div>
    <div class="Grid-cell u-xsm-size2of3">2of3</div>
  </div>
 */
/* stylelint-disable declaration-property-unit-whitelist, no-duplicate-selectors */
.Grid {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-flow: row wrap;
          flex-flow: row wrap;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  margin: 0;
  padding: 0;
}
.Grid-cell {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 100%;
          flex: 0 0 100%;
  -webkit-box-sizing: inherit;
          box-sizing: inherit;
}
.Grid-cell--fit {
  -webkit-box-flex: 0 !important;
      -ms-flex: 0 0 auto !important;
          flex: 0 0 auto !important;
}
.Grid-cell--center {
  display: block !important;
  margin-right: auto !important;
  margin-left: auto !important;
}
.Grid--alignCenter {
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.Grid--alignRight {
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
}
.Grid--alignMiddle {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.Grid--alignBottom {
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
}
.Grid--fit > .Grid-cell {
  -webkit-box-flex: 1;
      -ms-flex: 1 1 0%;
          flex: 1 1 0%;
}
.Grid--equalHeight > .Grid-cell {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
/** 
 * Browser fallback for Flexible Box Layout. 
 * Can also be forced using .Grid--simple. 
 */
.is-no-flexbox .Grid,
.Grid--simple {
  display: block;
  font-size: 0;
  margin: 0;
  padding: 0;
  text-align: left;
}
.is-no-flexbox .Grid > .Grid-cell,
.Grid--simple > .Grid-cell {
  -webkit-box-flex: 0;
      -ms-flex: none;
          flex: none;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  display: inline-block;
  font-size: 16px;
  font-size: 1rem;
  margin-right: 0;
  margin-left: 0;
  padding-right: 0;
  padding-left: 0;
  text-align: left;
  vertical-align: top;
  width: 100%;
}
.is-no-flexbox .Grid.Grid--alignCenter,
.Grid--simple.Grid--alignCenter {
  text-align: center;
}
.is-no-flexbox .Grid.Grid--alignRight,
.Grid--simple.Grid--alignRight {
  text-align: right;
}
.is-no-flexbox .Grid.Grid--alignMiddle > .Grid-cell,
.Grid--simple.Grid--alignMiddle > .Grid-cell {
  vertical-align: middle;
}
.is-no-flexbox .Grid.Grid--alignBottom > .Grid-cell,
.Grid--simple.Grid--alignBottom > .Grid-cell {
  vertical-align: bottom;
}
.is-no-flexbox .Grid.Grid--fit,
.Grid--simple.Grid--fit {
  display: table;
  table-layout: fixed;
  width: 100%;
  margin: 0 !important;
}
.is-no-flexbox .Grid.Grid--fit > .Grid-cell,
.Grid--simple.Grid--fit > .Grid-cell {
  display: table-cell;
  width: auto;
}
.is-no-flexbox .Grid.Grid--fit > .Grid-cell:first-child,
.Grid--simple.Grid--fit > .Grid-cell:first-child {
  padding-left: 0;
}
.is-no-flexbox .Grid.Grid--fit > .Grid-cell:last-child,
.Grid--simple.Grid--fit > .Grid-cell:last-child {
  padding-right: 0;
}
/**
 * Grid Gutter Sizes
 * Wrap in .Grid to increase specificity. 
 * All gutters are in Pixels to support both Flexbox and Simple mode.
 * 
 * Format: Grid--gutter[direction:A|V|H][size:xsm|sm|md|lg|xlg]
 * Examples: Grid--gutterA (All), Grid--gutterH (Horizontal), Grid--gutterHlg (large horizontal gutter)
 * 
 * Gutter directions:
 *    A = all (right, left, top, bottom)
 *    H = horizontal (right, left)
 *    V = vertical (top, bottom)
 *	
 * Gutter sizes:
 *    xs = xsmall
 *	  s  = small
 *	  m  = medium
 *	  l  = large
 *	  xl = xlarge
 */
.Grid {
  /**
     * Horizontal gutters (left & right)
     */
  /**
     * Vertical gutters (top & bottom)
     */
}
.Grid.Grid--gutterH,
.Grid.Grid--gutterA {
  margin-left: -15px;
  margin-right: -15px;
}
.Grid.Grid--gutterH > .Grid-cell,
.Grid.Grid--gutterA > .Grid-cell {
  padding-left: 15px;
  padding-right: 15px;
}
.Grid.Grid--gutterHxsm,
.Grid.Grid--gutterAxsm {
  margin-left: -5px;
  margin-right: -5px;
}
.Grid.Grid--gutterHxsm > .Grid-cell,
.Grid.Grid--gutterAxsm > .Grid-cell {
  padding-left: 5px;
  padding-right: 5px;
}
.Grid.Grid--gutterHsm,
.Grid.Grid--gutterAsm {
  margin-left: -6.66666667px;
  margin-right: -6.66666667px;
}
.Grid.Grid--gutterHsm > .Grid-cell,
.Grid.Grid--gutterAsm > .Grid-cell {
  padding-left: 6.66666667px;
  padding-right: 6.66666667px;
}
.Grid.Grid--gutterHmd,
.Grid.Grid--gutterAmd {
  margin-left: -10px;
  margin-right: -10px;
}
.Grid.Grid--gutterHmd > .Grid-cell,
.Grid.Grid--gutterAmd > .Grid-cell {
  padding-left: 10px;
  padding-right: 10px;
}
.Grid.Grid--gutterHlg,
.Grid.Grid--gutterAlg {
  margin-left: -15px;
  margin-right: -15px;
}
.Grid.Grid--gutterHlg > .Grid-cell,
.Grid.Grid--gutterAlg > .Grid-cell {
  padding-left: 15px;
  padding-right: 15px;
}
.Grid.Grid--gutterHxlg,
.Grid.Grid--gutterAxlg {
  margin-left: -20px;
  margin-right: -20px;
}
.Grid.Grid--gutterHxlg > .Grid-cell,
.Grid.Grid--gutterAxlg > .Grid-cell {
  padding-left: 20px;
  padding-right: 20px;
}
.Grid.Grid--gutterV,
.Grid.Grid--gutterA {
  margin-top: -15px;
  margin-bottom: -15px;
}
.Grid.Grid--gutterV > .Grid-cell,
.Grid.Grid--gutterA > .Grid-cell {
  padding-top: 15px;
  padding-bottom: 15px;
}
.Grid.Grid--gutterVxsm,
.Grid.Grid--gutterAxsm {
  margin-top: -5px;
  margin-bottom: -5px;
}
.Grid.Grid--gutterVxsm > .Grid-cell,
.Grid.Grid--gutterAxsm > .Grid-cell {
  padding-top: 5px;
  padding-bottom: 5px;
}
.Grid.Grid--gutterVsm,
.Grid.Grid--gutterAsm {
  margin-top: -6.66666667px;
  margin-bottom: -6.66666667px;
}
.Grid.Grid--gutterVsm > .Grid-cell,
.Grid.Grid--gutterAsm > .Grid-cell {
  padding-top: 6.66666667px;
  padding-bottom: 6.66666667px;
}
.Grid.Grid--gutterVmd,
.Grid.Grid--gutterAmd {
  margin-top: -10px;
  margin-bottom: -10px;
}
.Grid.Grid--gutterVmd > .Grid-cell,
.Grid.Grid--gutterAmd > .Grid-cell {
  padding-top: 10px;
  padding-bottom: 10px;
}
.Grid.Grid--gutterVlg,
.Grid.Grid--gutterAlg {
  margin-top: -15px;
  margin-bottom: -15px;
}
.Grid.Grid--gutterVlg > .Grid-cell,
.Grid.Grid--gutterAlg > .Grid-cell {
  padding-top: 15px;
  padding-bottom: 15px;
}
.Grid.Grid--gutterVxlg,
.Grid.Grid--gutterAxlg {
  margin-top: -20px;
  margin-bottom: -20px;
}
.Grid.Grid--gutterVxlg > .Grid-cell,
.Grid.Grid--gutterAxlg > .Grid-cell {
  padding-top: 20px;
  padding-bottom: 20px;
}
.Grid.Grid--gutterOuter {
  margin-top: 15px;
  margin-bottom: 15px;
}
@media screen and (max-width: 640px) {
  .Grid.Grid--gutterA {
    margin-right: -3.5px;
    margin-left: -3.5px;
  }
  .Grid.Grid--gutterA > .Grid-cell {
    padding-right: 3.5px;
    padding-left: 3.5px;
  }
}
/*TWEAK FOR STARPAGE MODULES*/
.Page-main > .Page-container > .Grid--gutterA > div:first-child {
  padding-top: 0;
}
.Highcharts-container {
  padding: 1.25em 0;
}
@media bpMedium {
  .Highcharts-container {
    padding: 1.25em;
    margin-bottom: 1.875em;
  }
}
.Highcharts-container .Heading-thin {
  font-size: 16px;
}
.Highcharts-container p {
  font-size: 12px;
}
.highcharts-title,
.highcharts-legend-item text {
  font-family: 'Whitney SSm A', 'Whitney SSm B', 'Arial';
}
.highcharts-title {
  font-size: 2em !important;
}
.highcharts-color-0 {
  fill: #009fdf;
  stroke: #009fdf;
}
.highcharts-color-1 {
  fill: #002d72;
  stroke: #002d72;
}
.highcharts-color-2 {
  fill: #78be20;
  stroke: #78be20;
}
.highcharts-color-3 {
  fill: #99d9f2;
  stroke: #99d9f2;
}
.highcharts-color-4 {
  fill: #7c878e;
  stroke: #7c878e;
}
.highcharts-color-5 {
  fill: #c9e5a6;
  stroke: #c9e5a6;
}
/*#


*/
.Image {
  position: relative;
  overflow: hidden;
  width: 100%;
  height: 100%;
}
.Image.Image--cover {
  background-size: cover;
}
.Image.Image--cover img {
  position: absolute;
  left: -9999px;
  right: -9999px;
  max-width: none;
  height: 100%;
  margin: 0 auto;
}
.Image.Image--center {
  background-position: center;
}
.img-left {
  margin-top: -20px;
  margin-bottom: -20px;
  margin-left: -50px;
}
.img-right {
  margin-top: -20px;
  margin-bottom: -20px;
  margin-right: -50px;
  float: right;
}
/*#

Group inputs together with a text label or button.

Examples:

<div>
    <div class="InputGroup u-marginBsm">
        <span class="InputGroup-addon">@</span>
        <input class="InputGroup-input" type="text" placeholder="Username" />
    </div>
    
    <div class="InputGroup u-marginBsm"> 
        <input type="text" class="InputGroup-input" placeholder="Recipient's username" /> 
        <span class="InputGroup-addon">@example.com</span> 
    </div>
</div>

*/
.InputGroup {
  background: #f1f1f1;
  border: 2px solid #ddd;
  border-radius: 4px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.InputGroup-addon {
  display: inline-block;
  padding-right: 1.25em;
  padding-left: 1.25em;
  font-size: 1.125em;
  -ms-flex-item-align: center;
      align-self: center;
}
.InputGroup-input {
  -webkit-box-flex: 1;
      -ms-flex: 1 0 auto;
          flex: 1 0 auto;
  border: none !important;
  border-radius: 0 !important;
}
.InputGroup-addon--button {
  -ms-flex-item-align: stretch;
      align-self: stretch;
  border: none;
  border-radius: 0;
}
.vendor-ie-9 .InputGroup,
.vendor-ie-8 .InputGroup {
  display: table !important;
  width: 100%;
}
.vendor-ie-9 .InputGroup-addon,
.vendor-ie-8 .InputGroup-addon,
.vendor-ie-9 .InputGroup-input,
.vendor-ie-8 .InputGroup-input {
  display: table-cell !important;
  width: 1%;
}
.vendor-ie-9 .InputGroup-input,
.vendor-ie-8 .InputGroup-input {
  width: 100%;
}
@media only screen and (min-width: 48em), print {
  .Extra-padding-IntroBlock-Box {
    padding: 60px 50px !important;
    font-size: 2em !important;
  }
}
.Extra-padding-IntroBlock-header {
  padding-top: 2.5em !important;
  padding-bottom: 2.5em !important;
}
@media only screen and (min-width: 48em), print {
  .Extra-padding-IntroBlock-header {
    padding-top: 6.5em !important;
    padding-bottom: 2.5em !important;
  }
}
.introtext-block {
  position: relative;
  background-color: #ffffff;
  padding-bottom: 10px;
}
.introtext-block--text {
  background-color: #fff;
  padding: 0px 10px;
}
@media only screen and (min-width: 48em), print {
  .introtext-block--text {
    padding: 30px 180px;
  }
}
@media only screen and (max-width: 34em), print {
  .introtext-block--text.collapsable {
    max-height: 200px;
    overflow: hidden;
  }
}
.introtext-block--text.collapsable.is-expanded {
  max-height: none;
}
.introtext-block--read-more {
  position: -webkit-sticky;
  position: sticky;
  bottom: -10px;
  margin: 0 auto;
  display: block;
  height: 50px;
  text-align: center;
  padding-top: 19px;
  background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0.1)), color-stop(rgba(255, 255, 255, 0.95)), to(#ffffff));
  background-image: -o-linear-gradient(top, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.95), #ffffff);
  background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.95), #ffffff);
}
@media only screen and (min-width: 34em), print {
  .introtext-block--read-more {
    display: none;
  }
}
.introtext-block--read-more-button {
  background: none;
  color: #009fdf;
  background: no-repeat url('/Assets/Icons/chevron_down_blue.svg') right 6px;
  padding-right: 20px;
}
.introtext-block--read-more-button.up {
  background: no-repeat url('/Assets/Icons/chevron_up_blue_origsize.svg') right 6px;
}
.linkcollection {
  padding: 20px;
}
.linkcollection-image {
  height: 100px;
  margin-bottom: 20px;
}
.linkcollection-image img {
  height: 100%;
}
.linkcollection h3 {
  font-weight: 500;
  font-size: 1.25em;
}
.linkcollection-links ul {
  list-style: none none outside;
  padding-left: 0;
}
.linkcollection-links a {
  color: #333;
}
.linkcollection-links a:after {
  content: " >";
}
/*#

Listing content in either horizontal or vertical direction, while supporting all gutter sizes. It is often used in combination with a ``UL/OL`` tag but it is not required.

Examples:
 
<div>
    <b>List:</b>
    <ul class="List">
        <li class="List-item">Item 1</li>
        <li class="List-item">Item 2</li>
    </ul>
    
    <b>List--gutterVxlg:</b>
    <ul class="List List--gutterVxlg">
        <li class="List-item">Item 1</li>
        <li class="List-item">Item 2</li>
    </ul>
    
    <b>List-horizontal & List--center & List--bordered:</b>    
    <ul class="List List--bordered List--horizontal List--center">
        <li class="List-item"><a href="#">Item 1</a></li>
        <li class="List-item"><a href="#">Item 2</a></li>
        <li class="List-item"><a href="#">Item 3</a></li>
    </ul>
</div>
*/
.List:not(.Segment ul),
.List:not(.Segment ol) {
  padding-left: 0;
  list-style: none;
}
.Segment ul,
.Segment ol {
  padding-left: 1.25em;
}
.List-item {
  padding-top: 0.3125em;
  padding-bottom: 0.3125em;
}
.List > .List-item:first-child {
  padding-top: 0;
}
.List > .List-item:last-child {
  padding-bottom: 0;
}
.List--center {
  text-align: center;
}
.List--right {
  text-align: right;
}
.List--bordered > .List-item {
  border-bottom: 1px solid #ddd;
}
.List--bordered > .List-item:last-child {
  border-bottom: none;
}
.List--striped > .List-item {
  padding-top: 0;
  padding-bottom: 0;
}
.List--striped > .List-item .List-itemContent {
  display: block;
  padding: 0.3125em 0.625em;
}
.List--striped > .List-item:nth-child(odd) .List-itemContent {
  background: #f7f7f7;
}
.List--horizontal {
  margin-left: -0.625em;
  margin-right: -0.625em;
}
.List--horizontal .List-item {
  display: inline-block;
  margin-right: -0.25em;
  padding-right: 0.625em;
  padding-left: 0.625em;
}
.List--horizontal .List-item:last-child {
  padding-right: 0;
}
.List--horizontal.List--bordered > .List-item {
  border-right: 1px solid #ddd;
  border-bottom: none;
}
.List--horizontal.List--bordered > .List-item:last-child {
  border-right: none;
}
.List--horizontal.List--striped {
  margin-left: 0 !important;
  margin-right: 0 !important;
}
.List--horizontal.List--striped > .List-item {
  padding-left: 0;
  padding-right: 0;
}
.List--horizontal.Toolbar .List-item {
  padding-left: 0;
}
@media only screen and (min-width: 57.5em), print {
  .List--horizontal.Toolbar .List-item {
    padding-left: 0.625em;
  }
}
.List--vertical .List-item {
  display: block;
}
/* 
    Vertical gutters (top, bottom) 
*/
.List--gutterVz > .List-item {
  padding-top: 0;
  padding-bottom: 0;
}
.List--gutterVxsm > .List-item {
  padding-top: 0.3125em;
  padding-bottom: 0.3125em;
}
.List--gutterVsm > .List-item {
  padding-top: 0.41666667em;
  padding-bottom: 0.41666667em;
}
.List--gutterVmd > .List-item {
  padding-top: 0.625em;
  padding-bottom: 0.625em;
}
.List--gutterVlg > .List-item {
  padding-top: 0.9375em;
  padding-bottom: 0.9375em;
}
.List--gutterVxlg > .List-item {
  padding-top: 1.25em;
  padding-bottom: 1.25em;
}
/* 
    Horizontal gutters (right, left) 
*/
.List--gutterHz {
  margin-right: 0;
  margin-left: 0;
}
.List--gutterHz > .List-item {
  padding-right: 0;
  padding-left: 0;
}
.List--gutterHxsm {
  margin-right: -0.3125em;
  margin-left: -0.3125em;
}
.List--gutterHxsm > .List-item {
  padding-right: 0.3125em;
  padding-left: 0.3125em;
}
.List--gutterHsm {
  margin-right: -0.41666667em;
  margin-left: -0.41666667em;
}
.List--gutterHsm > .List-item {
  padding-right: 0.41666667em;
  padding-left: 0.41666667em;
}
.List--gutterHmd {
  margin-right: -0.625em;
  margin-left: -0.625em;
}
.List--gutterHmd > .List-item {
  padding-right: 0.625em;
  padding-left: 0.625em;
}
.List--gutterHlg {
  margin-right: -0.9375em;
  margin-left: -0.9375em;
}
.List--gutterHlg > .List-item {
  padding-right: 0.9375em;
  padding-left: 0.9375em;
}
.List--gutterHxlg {
  margin-right: -1.25em;
  margin-left: -1.25em;
}
.List--gutterHxlg > .List-item {
  padding-right: 1.25em;
  padding-left: 1.25em;
}
/*#

The Media component is used for splitting content into a fixed width column and a fluid column that works nicely with for different screen widths.

Based on the Flag object by CSS Wizardry, but renamed to Media because it's more common name for this layout.
http://csswizardry.com/2013/05/the-flag-object/

<div class="Media Media--top">
    <div class="Media-side">
        <img src="/assets/images/temp/100.gif" />
    </div>
    <div class="Media-body">
        <p>This is the body of the Media object. You can change the alignment of the body to be either middle (default), top or bottom.</p>
        
        <div class="Media Media--top">
            <div class="Media-side">
                <img src="/assets/images/temp/100.gif" />
            </div>
            <div class="Media-body">
                <p>Nested Media object works as well.</p>
            </div>
        </div>
    </div>
</div>
*/
.Media {
  display: table;
  width: 100%;
}
.Media-side,
.Media-body {
  display: table-cell;
  vertical-align: middle;
}
.Media--top .Media-side,
.Media--top .Media-body {
  vertical-align: top;
}
.Media--bottom .Media-side,
.Media--bottom .Media-body {
  vertical-align: bottom;
}
.Media--right .Media-side {
  padding-right: 0;
  padding-left: 1.25em;
  display: table-cell;
}
.Media-side {
  padding-right: 1.25em;
}
.Media-side > img {
  display: block;
  max-width: none;
}
.Media-body {
  width: 100%;
}
.Media--equal .Media-body {
  width: auto;
}
/*#
Component for showing a modal window on page.
Can be used in conjunction with the "modal" js-module.

<div>
    <p><a href="#" class="Button" data-module="modal" data-modal="contentElement: '.js-demoModal'">Open modal</a></p>
    
    <section class="Modal js-demoModal">
        <div class="Modal-dialog">
            <h3>Modal header</h3>
            <a class="Modal-close js-close" href="#">&times;</a>
            
            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean maximus eget ipsum id mattis. Aliquam nec erat sed justo ullamcorper congue eget id orci. Phasellus eleifend rhoncus lacinia.</p>
            
            <div class="Modal-footer">
                <a href="#" class="u-linkText u-marginRmd js-close">Cancel</a>
                <a href="#" class="Button Button--wide">Send</a>
            </div>
        </div>
    </section>
</div>
*/
body.modal-open {
  overflow: hidden;
}
.Modal {
  position: fixed;
  display: none;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  padding: 1em;
  z-index: 998;
}
@media only screen and (max-width: 48em), print {
  .Modal {
    padding: 0.1em;
  }
}
.Modal:after {
  content: "";
  background: rgba(0, 0, 0, 0.6);
  position: fixed;
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 998;
}
.Modal.is-active {
  display: block;
  /*.Modal-dialog {
            animation: slide-in .25s ease-out;
        }*/
}
.Modal-dialog {
  position: relative;
  top: 50%;
  -webkit-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
          transform: translateY(-50%);
  background: #fff;
  margin: auto;
  z-index: 999;
  width: 100%;
  max-width: 80%;
  padding: 4em;
  padding-top: calc(4em - 45px);
  overflow: auto;
  max-height: 100%;
}
@media only screen and (max-width: 48em), print {
  .Modal-dialog {
    padding: 1em;
    max-width: 90%;
    max-height: 75%;
    top: 20%;
    -webkit-transform: initial;
        -ms-transform: initial;
            transform: initial;
  }
}
.Modal-footer {
  margin: 4em -4em -4em;
  padding: 4em;
  text-align: right;
  background: #f7f7f7;
}
.Modal-close {
  font-size: 1.6em;
  text-decoration: none;
  padding: 0 0.25em 0.05em;
  position: relative;
  right: -22px;
}
@media only screen and (max-width: 48em), print {
  .Modal-close {
    right: -8px;
  }
}
.Modal-close:hover {
  color: #fff;
  text-decoration: none;
}
.Modal-close--container {
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  text-align: right;
  z-index: 1500;
}
@-webkit-keyframes slide-in {
  0% {
    -webkit-transform: translateY(-100%);
            transform: translateY(-100%);
  }
  100% {
    -webkit-transform: translateY(0%);
            transform: translateY(0%);
  }
}
@keyframes slide-in {
  0% {
    -webkit-transform: translateY(-100%);
            transform: translateY(-100%);
  }
  100% {
    -webkit-transform: translateY(0%);
            transform: translateY(0%);
  }
}
/*#
<div>
    <article class="NewsItem">
        <div class="Grid Grid--gutterHxlg">
            <div class="Grid-cell u-size3of5">
                <a href="#" class="u-block">
                    <h5 class="NewsItem-category">Försäkringsnytt</h5>
                    <h3 class="NewsItem-title">Söderberg & Partners lanserar nytt koncept</h3>
                    <div class="u-md-block">
                        <p>
                            Bacon ipsum dolor amet shankle meatloaf jerky, capicola andouille shoulder burgdoggen pancetta.
                            Short ribs flank picanha, cow shankle chicken meatloaf rump strip steak pork belly drumstick.
                        </p>
                        <div class="NewsItem-author u-cf">
                            <div class="NewsItem-authorImage">
                                <img src="/Assets/Images/default_teaser_background.jpg" />
                            </div>
                            <div class="NewsItem-authorInfo">
                                <h6 class="u-marginAz">Karl</h6>
                                <p class="u-marginAz">Anksson</p>
                            </div>
                        </div>
                    </div>
                </a>
            </div>
            <div class="Grid-cell u-size2of5 u-marginAuto">
                <div class="NewsItem-image">
                    <div class="Image Image--cover Image--center" style="background-image: url('/Assets/Images/default_teaser_background.jpg')"></div>
                </div>
            </div>
        </div>
    </article>
</div>
 */
@media only screen and (min-width: 48em), print {
  .NewsItem {
    padding: 1.875em 0;
  }
}
.NewsItem:hover * {
  text-decoration: none;
}
.NewsItem-category {
  color: #009fdf;
  margin-bottom: 1.25em;
  line-height: 1.3;
}
.NewsItem-categoryList li:before {
  content: ",";
  color: #009fdf;
  display: inline-block;
  margin-right: 5px;
  position: relative;
  left: -4px;
}
.NewsItem-categoryList li:first-child:before {
  content: none;
}
.NewsItem-categoryList li a {
  display: inline-block;
  margin-bottom: 0;
}
.NewsItem-title {
  line-height: 1.5;
  word-break: break-word;
}
@media only screen and (min-width: 48em), print {
  .NewsItem-title {
    font-size: 1.5em;
  }
}
.NewsItem-author {
  margin-top: 1.875em;
}
.NewsItem-authorImage {
  width: 60px;
  height: 60px;
  border-radius: 50%;
  display: block;
  overflow: hidden;
}
@media only screen and (min-width: 48em), print {
  .NewsItem-authorImage {
    float: left;
  }
}
.NewsItem-authorImage.NewsItem-authorImage--static {
  background-color: cadetblue;
}
.NewsItem-authorInfo {
  margin-top: 0.83333333em;
  display: inline-block;
}
@media only screen and (min-width: 48em), print {
  .NewsItem-authorInfo {
    display: block;
    margin-top: 0;
    margin-left: 70px;
  }
}
.NewsItem-date {
  font-size: 0.9em;
  font-weight: 100;
}
.NewsItem-image {
  width: 100%;
  max-width: 150px;
  max-height: 150px;
  position: relative;
  float: right;
}
@media only screen and (min-width: 48em), print {
  .NewsItem-image {
    max-width: 300px;
    max-height: 300px;
  }
}
.NewsItem-image:after {
  content: '';
  display: block;
  padding-bottom: 100%;
}
.NewsItem-image div {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  height: 100%;
  width: 100%;
}
.Newsletter {
  margin: 0 auto;
  border-top: 4px solid #009fdf;
  padding: 2.5em 0;
}
.Newsletter-header {
  font-size: 2.5em;
  line-height: 48px !important;
}
.Newsletter-form input {
  display: inline-block;
  vertical-align: middle;
  width: 100%;
  margin-bottom: 10px;
}
@media only screen and (min-width: 48em), print {
  .Newsletter-form input {
    font-size: 1.5em;
    width: 70%;
    margin-bottom: 0;
  }
}
.Newsletter-form Button {
  font-size: 19px;
  display: inline-block;
}
@media screen and (max-width: 640px) {
  .mobHigh {
    height: 300px !important;
  }
}
@media screen and (max-width: 768px) {
}
.OffCanvas {
  position: relative;
  overflow-x: hidden;
  width: 100%;
}
.OffCanvas.is-active {
  min-width: 320px;
}
.OffCanvas.is-active .OffCanvas-menu {
  /*transform: translateX(269px);*/
  -webkit-transform: translateX(100%);
      -ms-transform: translateX(100%);
          transform: translateX(100%);
}
.OffCanvas.is-active .megamenu-secondarynav--offCanvas .js-closeOffCanvas {
  /*transform: translateX(61px);*/
  -webkit-transform: translateX(98%);
      -ms-transform: translateX(98%);
          transform: translateX(98%);
}
.OffCanvas.is-active .megamenu-secondarynav--offCanvas .js-closeOffCanvas img {
  max-height: -webkit-fill-available;
  padding-left: 5px;
}
.OffCanvas-page {
  width: 100%;
  height: 100%;
  position: relative;
  -webkit-transition: 0.3s ease all;
  -o-transition: 0.3s ease all;
  transition: 0.3s ease all;
}
.OffCanvas-page .Page-main,
.OffCanvas-page .Footer {
  -webkit-transition: 0.3s opacity ease;
  -o-transition: 0.3s opacity ease;
  transition: 0.3s opacity ease;
}
.megamenu-secondarynav--offCanvas .js-closeOffCanvas {
  position: absolute;
  z-index: 1;
  top: 0px;
  right: 0px;
  background-color: #fff;
  width: 19%;
  height: 50px;
  border-radius: 0px 12px 12px 0px;
  border-top: 1px solid #ccc;
  border-left: 1px solid #ccc;
  -webkit-box-shadow: 6px 7px 14px -8px rgba(0, 0, 0, 0.1);
          box-shadow: 6px 7px 14px -8px rgba(0, 0, 0, 0.1);
  padding-top: 0px !important;
}
.megamenu-secondarynav--offCanvas .PageNav-mobile .lang {
  border-bottom: unset !important;
}
.megamenu-secondarynav--offCanvas .PageNav-mobile .lang a {
  padding-left: 30px;
}
.OffCanvas-menu {
  z-index: 99999;
  /*width: 271px;*/
  width: 85%;
  min-height: 100%;
  position: fixed;
  top: 0px;
  /*left: -270px;*/
  left: -86%;
  background-color: #ffffff;
  -webkit-transition: 0.3s ease all;
  -o-transition: 0.3s ease all;
  transition: 0.3s ease all;
  -webkit-box-shadow: 1px 6px 10px 1px rgba(0, 0, 0, 0.1);
          box-shadow: 1px 6px 10px 1px rgba(0, 0, 0, 0.1);
}
.OffCanvas-menu .search-area {
  width: 100%;
}
.OffCanvas-menu .js-closeOffCanvas {
  padding-top: 25px;
}
.no .OffCanvas-menu {
  background-color: #d2edfd;
}
.OffCanvas-menu a {
  padding: 5px;
  color: #333;
}
.OffCanvas-menu a:hover {
  text-decoration: none;
}
.OffCanvas-menu a.is-active {
  border-left: 2px solid #009fdf;
}
.no .OffCanvas-menu a.Link {
  /*border-left: 2px solid @colorLightBlue;*/
}
.OffCanvas-menu .PageNav-item > a.is-active {
  border-left: none;
  color: #009fdf;
}
.OffCanvas-menu .Header-nav-button {
  padding: 0.8em 1.5em;
  position: relative;
  left: 3px;
}
.OffCanvas-section {
  border-bottom: 1px solid #fff;
  margin: 0;
  overflow: visible;
}
.OffCanvas-searchSection {
  padding: 0.79em;
}
.megamenu-secondarynav--offCanvas > OffCanvas-mainNav {
  font-size: 14px;
}
.megamenu-secondarynav--offCanvas > OffCanvas-mainNav a {
  padding: 0px;
}
.megamenu-secondarynav--offCanvas > OffCanvas-mainNav .List-item {
  border-bottom: 1px solid #ccc;
  padding-bottom: 0px;
  padding-top: 0;
}
.megamenu-secondarynav--offCanvas > .offcanvas-menu-wrapper {
  position: absolute;
  height: 100%;
  width: 100%;
  overflow: auto;
}
.megamenu-secondarynav--offCanvas > .offcanvas-menu-wrapper .List.OffCanvas-section .List-item {
  padding: 0 !important;
  border-bottom: 1px solid #dedede;
}
.Link-noArrow {
  background: none !important;
}
.megamenu-category.Links {
  padding: 0 !important;
}
.megamenu-category.Links .Link-noArrow {
  padding-left: 30px;
  padding-top: 7px !important;
  padding-bottom: 7px !important;
}
.megamenu-category.Links .is-active {
  background: url(/Assets/Icons/chevron_up_white.svg) 50% 50% no-repeat !important;
}
.megamenu-category.Links .Link--only-arrow {
  border-left: 1px solid #fff !important;
}
.Link-empty {
  pointer-events: none;
}
.List-item.is-open .Links--level1 {
  background-color: #009fdf;
  border-bottom: 1px solid #fff;
}
.List-item.is-open .Links--level1 a {
  color: #ffffff;
}
.List-item.is-open .Links--level1 .is-active {
  padding-left: 20px !important;
  background: url(/Assets/Icons/chevron_up_white.svg) 50% 50% no-repeat !important;
}
.Links {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.Links--level1 {
  padding-left: 15px !important;
  font-weight: 600;
}
.Link--direct-and-childs {
  width: calc(100% - 60px) !important;
  float: left;
  padding-top: 12.6px !important;
  padding-bottom: 12.6px !important;
}
.Link--only-arrow {
  width: 60px !important;
  padding-top: 12.6px !important;
  padding-bottom: 12.6px !important;
  float: left;
  border-left: 1px solid #dedede !important;
  background: url(/Assets/Icons/chevron_down.svg) 50% 50% no-repeat !important;
}
.Link--only-arrow .is-active {
  border-left: 1px solid white !important;
}
.OffCanvas-mainNav {
  font-size: 16px;
  height: 100%;
  padding: 0;
  border-bottom: none;
  position: absolute;
  overflow: visible;
  width: 100%;
  padding-bottom: 50px;
}
.OffCanvas-mainNav > .List-item > .Link {
  background: url('/Assets/Icons/chevron_down.svg') 100% 50% no-repeat;
}
.megamenu-secondarynav--offCanvas .OffCanvas-mainNav > .List-item > .Link {
  background: url('/Assets/Icons/chevron_down.svg') 93% 50% no-repeat;
  background-size: 14px;
  font-weight: 600;
  padding-left: 20px;
  padding-top: 12.6px;
  padding-bottom: 12.6px;
}
.OffCanvas-mainNav > .List-item > .Link.is-active {
  background: url('/Assets/Icons/chevron_up_blue.svg') 100% 50% no-repeat;
  background-size: 15px;
}
.megamenu-secondarynav--offCanvas .OffCanvas-mainNav > .List-item > .Link.is-active {
  background: url('/Assets/Icons/chevron_up_white.svg') 93% 50% no-repeat;
  background-size: 14px;
  padding-left: 20px;
  color: #ffffff;
  background-color: #009fdf;
  width: 100%;
  margin-bottom: 1px;
  padding-top: 12.6px;
  padding-bottom: 12.6px;
}
.OffCanvas-mainNav > .List-item > .Link-noArrow {
  background: none !important;
}
.OffCanvas-mainNav .List-item {
  border-bottom: 2px solid #fff;
}
.no .OffCanvas-mainNav .List-item {
  border-bottom: 1px solid #fff;
}
.no .OffCanvas-mainNav .List-item .Link--only-arrow {
  border-left: 1px solid #fff !important;
}
.no .OffCanvas-mainNav .List-item .PageNav-mobile > li {
  margin-bottom: 0px !important;
  border-bottom: 1px solid #fff;
}
.OffCanvas-mainNav .List-item .Link {
  display: block;
  width: 100%;
}
.OffCanvas-mainNav .List-item .Link:hover {
  color: #009fdf;
}
.OffCanvas-mainNav .List-item .Link.is-selected {
  background: #fff;
}
.megamenu-secondarynav--offCanvas .OffCanvas-mainNav.is-open .List-item.is-open {
  display: list-item;
}
.OffCanvas-mainNav .OffCanvas-mainNavTitle {
  display: block;
}
.OffCanvas-mainNav .OffCanvas-mainNavByline {
  text-transform: none;
  font-weight: normal;
}
.OffCanvas-menu .Menu-heading {
  text-transform: uppercase;
  font-size: 19px;
  text-align: center;
}
.OffCanvas-menu .Menu-heading p {
  margin: 7px;
}
.OffCanvas-menu .Buttons > ul {
  list-style: none;
  padding: 20px 20px;
}
.OffCanvas-menu .Buttons > ul > li {
  padding-bottom: 8px;
}
.OffCanvas-menu .Buttons > ul > li img {
  max-height: 20px;
}
.megamenu-secondarynav--offCanvas.OffCanvas-menu .link-lang.is-active > img {
  float: right;
  padding-right: 40%;
  padding-top: 5px;
  margin-right: -6px;
}
.megamenu-secondarynav--offCanvas.OffCanvas-menu .Buttons > ul {
  list-style: none;
  padding: 20px 20px;
}
.megamenu-secondarynav--offCanvas.OffCanvas-menu .Buttons > ul > li {
  padding-bottom: 8px;
  font-weight: 600;
}
.megamenu-secondarynav--offCanvas.OffCanvas-menu .Buttons > ul > li a {
  border-color: #ccc;
}
.megamenu-secondarynav--offCanvas.OffCanvas-menu .Buttons > ul > li img {
  max-height: 20px;
}
.megamenu-secondarynav--offCanvas.OffCanvas-menu a.Link.is-active {
  color: #ffffff;
}
.megamenu-secondarynav--offCanvas.OffCanvas-menu .PageNav-mobile.is-active:last-child {
  margin-bottom: -2px;
}
.megamenu-secondarynav--offCanvas.OffCanvas-menu .PageNav-mobile.PageNav-mobile.is-active:last-child {
  margin-bottom: 0px;
}
.megamenu-secondarynav--offCanvas.OffCanvas-menu .PageNav-mobile.is-active > li.is-open > h6 {
  background-color: #009fdf;
}
.megamenu-secondarynav--offCanvas.OffCanvas-menu .PageNav-mobile.is-active > li.is-open > h6 a {
  background: url(/Assets/Icons/chevron_up_white.svg) 93% 50% no-repeat;
  background-size: 14px;
  color: #ffffff;
  font-weight: 600;
}
.megamenu-secondarynav--offCanvas.OffCanvas-menu h6 {
  margin-bottom: 1px;
  font-size: 14px;
  font-weight: 400;
  padding-top: 7px;
  padding-bottom: 7px;
  padding-left: 30px;
  line-height: 36px !important;
}
.megamenu-secondarynav--offCanvas.OffCanvas-menu h6 a {
  padding: 0px;
  color: #333;
}
.megamenu-secondarynav--offCanvas.OffCanvas-menu h6 a.have-children {
  background: url(/Assets/Icons/chevron_down.svg) 93% 50% no-repeat;
  background-size: 14px;
  display: block;
}
.megamenu-secondarynav--offCanvas.OffCanvas-menu .PageNav-mobile {
  list-style-type: none;
  padding-left: 0px;
}
.megamenu-secondarynav--offCanvas.OffCanvas-menu .PageNav-mobile > li {
  line-height: 50px;
  padding-top: 0.2px;
  padding-bottom: 0.2px;
  margin-bottom: 1px;
  background-color: #d2edfd;
}
.megamenu-secondarynav--offCanvas.OffCanvas-menu .PageNav-mobile > li.lang .Toolbar-language-list-Flag {
  padding-top: 15px;
  float: right;
  padding-right: 40%;
}
.megamenu-secondarynav--offCanvas.OffCanvas-menu .PageNav-mobile > li.is-open {
  background-color: #ffffff;
}
.megamenu-secondarynav--offCanvas.OffCanvas-menu .PageNav-mobile > li .megamenu-linklist--item {
  background-color: #f0fafe;
  padding-left: 40px;
}
@media only screen and (min-width: 48em), print {
  .OffCanvas-menu {
    display: none;
  }
  .OffCanvas-page .Page-main,
  .OffCanvas-page .Footer {
    opacity: 1 !important;
  }
}
.officeinfo {
  background-color: #fff;
  padding: 40px 50px;
  min-height: 424px;
}
@media only screen and (max-width: 48em), print {
  .officeinfo {
    min-height: 550px;
  }
}
@media only screen and (max-width: 34em), print {
  .officeinfo {
    min-height: initial;
  }
}
.officeinfo-address,
.officeinfo-contact,
.officeinfo-map {
  margin-bottom: 20px;
}
.officeinfo-address h4,
.officeinfo-contact h4,
.officeinfo-map h4 {
  margin-bottom: 0;
  font-size: 18px;
}
.Grid-cell .officeinfo {
  margin-left: -30px;
}
@media only screen and (min-width: 48em), print {
  .Grid-cell:first-child .officeinfo {
    margin-left: 0;
  }
}
.office-address {
  font-size: 1.5em;
}
@media only screen and (max-width: 48em), print {
  .office-address {
    font-size: 1em;
  }
}
.Telephone {
  margin-bottom: 30px;
}
/* Always set the map height explicitly to define the size of the div
* element that contains the map. */
#map {
  height: 100%;
}
.OfficeMap {
  width: 100%;
  height: 600px;
}
.OfficeMap.OfficeMap--withMarginB {
  margin-bottom: 50px;
}
.OfficeMap .mapboxgl-popup-content {
  min-width: 180px;
  border-radius: 0;
}
.OfficeMap .mapboxgl-popup-content .mapboxgl-popup-close-button {
  display: none;
}
/*#

<div>
    <ul class="OpeningHoursList u-md-size1of3">
        <li class="OpeningHoursList-item">
            <span class="OpeningHoursList-itemDay">Idag</span>
            <span class="OpeningHoursList-itemHours" id="OpeningHoursToday">11:00 - 18:00</span>
        </li>
        <li class="OpeningHoursList-item">
            <span class="OpeningHoursList-itemDay">Idag</span>
            <span class="OpeningHoursList-itemHours" id="OpeningHoursToday">11:00 - 18:00</span>
        </li>
        <li class="OpeningHoursList-item">
            <span class="OpeningHoursList-itemDay">Idag</span>
            <span class="OpeningHoursList-itemHours" id="OpeningHoursToday">11:00 - 18:00</span>
        </li>
        <li class="OpeningHoursList-item">
            <span class="OpeningHoursList-itemDay">Idag</span>
            <span class="OpeningHoursList-itemHours" id="OpeningHoursToday">11:00 - 18:00</span>
        </li>
    </ul>
</div>

*/
.OpeningHoursList {
  margin: 0;
  padding: 0;
  list-style-type: none;
}
.OpeningHoursList-item {
  padding: 0.83333333em 0;
  border-bottom: 1px solid #ddd;
}
.OpeningHoursList-item:last-of-type {
  border: none;
}
.OpeningHoursList-itemHours {
  float: right;
}
/*#

Display a page navigation that can be used for both vertical and horizontal navigations, e.g. header nav or sidebar nav.

Examples:

<div>
    <h4>Horizontal</h4>
    <nav class="PageNav PageNav--horizontal">
        <ul class="PageNav-list">
            <li class="PageNav-item">
                <a href="#" class="PageNav-itemLink is-active">Frontend Docs</a>
            </li>
            <li class="PageNav-item">
                <a href="#" class="PageNav-itemLink">Backend Docs</a>
            </li>
            <li class="PageNav-item">
                <a href="#" class="PageNav-itemLink">About Encore</a>
            </li>
        </ul>
    </nav>
    
    <h4>Vertical</h4>
    <nav class="PageNav PageNav--vertical">
        <ul class="PageNav-list">
            <li class="PageNav-item">
                <a href="#" class="PageNav-itemLink is-active">Frontend Docs</a>
            </li>
            <li class="PageNav-item">
                <a href="#" class="PageNav-itemLink">Backend Docs</a>
            </li>
            <li class="PageNav-item">
                <a href="#" class="PageNav-itemLink">About Encore</a>
            </li>
        </ul>
    </nav>
</div>

*/
.PageNav-list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.PageNav-item {
  padding: 0;
}
.PageNav-image {
  margin-left: 0.83333333em;
}
.PageNav-itemLink {
  color: #333;
  text-decoration: none;
  font-weight: bold;
}
.PageNav-itemLink:hover {
  color: grey;
  text-decoration: none;
}
.PageNav--horizontal {
  font-size: 1.125em;
}
.PageNav--horizontal .PageNav-item {
  display: inline-block;
  padding: 0.83333333em 0;
  margin-right: 0.625em;
}
.PageNav--horizontal .PageNav-item:last-child {
  margin-right: 0;
}
.PageNav--horizontal .PageNav-itemLink {
  padding-bottom: 0.7em;
}
.PageNav--horizontal .PageNav-itemLink.is-active,
.PageNav--horizontal .PageNav-itemLink.is-current {
  border-bottom: 4px solid #009fdf;
}
.PageNav--vertical {
  border-top: 1px solid #009fdf;
}
.PageNav--vertical .PageNav-item .PageNav-list {
  margin-left: 1.25em;
}
.PageNav--vertical .PageNav-itemLink {
  display: block;
  padding: 0.83333333em 0;
  border-bottom: 1px solid #009fdf;
}
.PageNav--vertical .PageNav-itemLink.is-active {
  font-weight: bold;
}
.PageNav-sticky {
  top: 0;
  left: 0;
  background: #fff;
  max-width: 1605px;
  margin: 0 auto;
}
.PageNav-sticky.is-fixed {
  width: 100%;
  position: fixed;
  margin: 0;
  z-index: 10000;
  max-width: 100%;
}
@media only screen and (min-width: 75em) {
  .PageNav-sticky.is-fixed {
    padding: 0 1.25em;
  }
}
.PageNav-sticky .PageNav-list {
  padding-bottom: 0.83333333em;
  border-bottom: 1px solid #ddd;
  margin-bottom: -1.25em;
}
.PageNav--compact.PageNav--horizontal .PageNav-list {
  padding-bottom: 0;
}
.PageNav--compact.PageNav--horizontal .PageNav-list .PageNav-item {
  padding: 0.7em 0;
  line-height: 1;
}
.PageNav--compact.PageNav--horizontal .PageNav-list .PageNav-item .PageNav-itemLink {
  padding-bottom: 0.7em;
  display: inline-block;
}
.PageNav--compact.PageNav--horizontal.PageNav--multirow .PageNav-list .PageNav-item {
  padding: 0.7em 0;
  line-height: 1;
}
.PageNav--compact.PageNav--horizontal.PageNav--multirow .PageNav-list .PageNav-item .PageNav-itemLink {
  padding-top: 0.7em;
  display: inline-block;
}
.PageNav--large {
  font-size: 3.5em;
}
.sectionpage-menuprefix {
  font-weight: bold;
}
@media only screen and (min-width: 57.5em), print {
  .PageNav--horizontal .PageNav-item {
    margin-right: 2.5em;
  }
}
.no .Header-secondaryContainer {
  background-color: #d2edfd;
}
.PageNav-mobile {
  display: none;
  padding-left: 1.25em;
}
.PageNav-mobile.is-active {
  display: block;
}
.Header-secondaryNav .megamenu-category {
  text-transform: uppercase;
  font-weight: bold;
  margin-bottom: 4px;
}
.Header-secondaryNav .megamenu-category a:after {
  content: " >";
}
.megamenu-linklist {
  list-style: none inside;
  padding-left: 0;
  margin-top: 0;
}
.Header-secondaryNav .megamenu-linklist--item a {
  color: #333;
  font-weight: normal;
}
.Header-secondaryNav .megamenu-linklist--item a:after {
  content: " >";
}
.megamenu-toggler {
  background: url('/Assets/Icons/chevron_down.svg') right 8px no-repeat;
  padding-right: 20px;
}
.megamenu-toggler.is-open {
  background: url('/Assets/Icons/chevron_up.svg') right 8px no-repeat;
}
.megamenu-infobox {
  border: solid 2px #009fdf;
  padding: 20px 20px;
  margin-bottom: 20px;
}
.megamenu-infobox h1,
.megamenu-infobox h2,
.megamenu-infobox h3,
.megamenu-infobox h4,
.megamenu-infobox h5,
.megamenu-infobox h6 {
  text-transform: uppercase;
}
@media only screen and (max-width: 48em), print {
  .megamenu-infobox {
    display: none;
  }
}
/*#

Navigation between large data sets.

Examples:

<div>
    <ul class="Pagination">
        <li class="Pagination-item Pagination-item--nav is-disabled"><a href="#prev" class="Pagination-link">Previous</a></li>
        <li class="Pagination-item"><a href="#" class="Pagination-link">1</a></li>
        <li class="Pagination-item Pagination-item--separator">…</li>
        <li class="Pagination-item"><a href="#" class="Pagination-link">4</a></li>
        <li class="Pagination-item is-active"><a href="#" class="Pagination-link">5</a></li>
        <li class="Pagination-item"><a href="#" class="Pagination-link">6</a></li>
        <li class="Pagination-item Pagination-item--separator">…</li>
        <li class="Pagination-item"><a href="#" class="Pagination-link">14</a></li>                            
        <li class="Pagination-item Pagination-item--nav"><a href="#next" class="Pagination-link">Next</a></li>
    </ul>
</div>

*/
.Pagination {
  list-style: none;
  padding: 0;
}
.Pagination-item {
  display: inline-block;
}
.Pagination-item.is-active .Pagination-link {
  background-color: rgba(221, 221, 221, 0.5);
  cursor: default;
  font-weight: bold;
  pointer-events: none;
}
.Pagination-item--nav .Pagination-link {
  border-color: #ddd;
  padding-right: 1.25em;
  padding-left: 1.25em;
}
.Pagination-item--nav.is-disabled {
  pointer-events: none;
}
.Pagination-item--nav.is-disabled .Pagination-link {
  border-color: rgba(221, 221, 221, 0.5);
  color: #ddd;
}
.Pagination-item--separator {
  color: #dedede;
}
.Pagination-item--text {
  color: #aaa;
  font-size: 1.25em;
  padding-right: 0.83333333em;
  padding-left: 0.83333333em;
}
.Pagination-link {
  display: inline-block;
  padding: 0.625em 0.83333333em;
  border-radius: 3px;
  color: #333;
  border: 2px solid transparent;
}
.Pagination-link:hover {
  border-color: #009fdf;
  background-color: #009fdf;
  text-decoration: none;
  color: #fff;
}
.profileinfo {
  background-color: #fff;
  padding: 40px 10px;
  min-height: 424px;
  text-align: center;
}
@media only screen and (max-width: 34em), print {
  .profileinfo {
    min-height: initial;
  }
}
.profileinfo-image {
  margin: 0 auto;
  height: 150px;
  width: 150px;
  overflow: hidden;
  border-radius: 75px;
  text-align: center;
  background-position: center center;
  background-size: cover;
  margin-bottom: 20px;
}
.profileinfo-name {
  font-weight: bold;
  font-size: 110%;
}
.profileinfo-contact {
  margin-top: 20px;
}
.ProgressNav {
  top: 0;
  left: 0;
  z-index: 100;
  margin: 0 -1.25em;
}
@media only screen and (min-width: 48em), print {
  .ProgressNav {
    margin: 0;
  }
}
.ProgressNav.is-fixed {
  width: 100%;
  position: fixed;
  margin: 0;
}
.ProgressNav-container {
  max-width: 1605px;
  background: #fff;
  position: relative;
  margin: 0 auto;
  border-bottom: 1px solid #ddd;
  /*box-shadow: 0px 18px 21px -14px rgba(0,0,0,0.55);
        -webkit-box-shadow: 0px 18px 21px -14px rgba(0,0,0,0.25);
        -moz-box-shadow: 0px 18px 21px -14px rgba(0,0,0,0.25);
        -o-box-shadow: 0px 18px 21px -14px rgba(0,0,0,0.25);*/
}
.ProgressNav-container::after {
  content: "";
  display: block;
}
.ProgressNav-title {
  white-space: nowrap;
  overflow: hidden;
  -o-text-overflow: ellipsis;
     text-overflow: ellipsis;
  margin: 0;
  text-align: center;
  padding: 0.83333333em 1.25em;
}
@media only screen and (min-width: 48em), print {
  .ProgressNav-title {
    white-space: normal;
    overflow: hidden;
    -o-text-overflow: inherit;
       text-overflow: inherit;
    text-align: left;
    padding: 0;
  }
}
.ProgressNav-bar {
  width: 0;
  height: 4px;
  display: block;
  background: #009fdf;
}
.Push {
  width: 100%;
  height: 100%;
  /*max-height:700px;*/
  overflow: hidden;
  position: relative;
}
.Push--color .Push-content {
  color: #ffffff;
}
@media only screen and (min-width: 48em), print {
  .Push--color .Push-content {
    margin-top: 0;
    padding: 130px 0;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
  }
}
.Push--color .Push-content .Heading,
.Push--color .Push-content .Heading--h1,
.Push--color .Push-content h1,
.Push--color .Push-content .Heading--h2,
.Push--color .Push-content h2,
.Push--color .Push-content .Heading--h3,
.Push--color .Push-content h3,
.Push--color .Push-content .Heading--h4,
.Push--color .Push-content h4,
.Push--color .Push-content .Heading--h5,
.Push--color .Push-content h5,
.Push--color .Push-content .Heading--h6,
.Push--color .Push-content h6,
.Push--color .Push-content .Heading--h7 {
  color: #ffffff;
}
.Push.Push--center {
  text-align: center;
}
.Push.Push--center .Push-content {
  text-align: center;
  margin-left: 0;
  padding: 6em 2em;
}
.Push--multicol {
  position: relative;
  overflow: visible;
}
.Push--multicol h2,
.Push--multicol h4 {
  text-align: center;
}
.Push--multicol h4 {
  font-weight: normal;
  text-transform: uppercase;
  letter-spacing: 6px;
}
.Push--multicol .Grid-cell:first-child {
  -webkit-box-ordinal-group: 3;
      -ms-flex-order: 2;
          order: 2;
}
@media only screen and (min-width: 48em), print {
  .Push--multicol .Grid-cell:first-child {
    -webkit-box-ordinal-group: 1;
        -ms-flex-order: 0;
            order: 0;
  }
}
.Push--multicol .Push-content {
  font-size: 1.125em;
  line-height: 1.25em;
  height: auto;
  position: absolute;
  bottom: auto;
  top: 30%;
  width: 100%;
  right: 0;
  padding: 1em 2em;
  background-color: #009fdf;
  color: #ffffff;
}
@media only screen and (min-width: 48em), print {
  .Push--multicol .Push-content {
    font-size: 1.125em;
    width: 80%;
    right: 10%;
    bottom: 10%;
    top: auto;
  }
}
@media only screen and (min-width: 57.5em), print {
  .Push--multicol .Push-content {
    width: 70%;
    right: 15%;
    font-size: 1.5em;
  }
}
@media only screen and (min-width: 75em) {
  .Push--multicol .Push-content {
    width: 50%;
    right: 15%;
  }
}
.Push--multicol .Push-content span {
  font-size: 12px;
  font-weight: 300;
}
.Push--multicol .Push-content p {
  margin-bottom: 0;
}
.Push-content {
  text-align: center;
  padding: 3em;
  position: relative;
  z-index: 99;
  height: 100%;
}
@media only screen and (min-width: 48em), print {
  .Push-content {
    padding: 6em 3em;
    text-align: left;
  }
}
@media only screen and (min-width: 75em) {
  .Push-content {
    padding: 6em 2em 6em 10em;
  }
}
.Push-actions .Button {
  margin-right: 30px;
  color: #fff !important;
}
.Push-actions .Button:last-child {
  margin-right: 0px;
}
.Push-bgImage,
.Push-overlay {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-size: cover;
}
.Push-bgImage video,
.Push-overlay video,
.Push-bgImage iframe,
.Push-overlay iframe {
  min-width: 100%;
  position: absolute;
  left: -9999px;
  right: -9999px;
  top: -9999px;
  bottom: -9999px;
  margin: auto;
}
.Push-video {
  height: 100%;
}
.Push-video .Push-content {
  height: 100%;
}
.Push-video video,
.Push-video iframe {
  min-width: 100%;
  position: absolute;
  left: -9999px;
  right: -9999px;
  top: -9999px;
  bottom: -9999px;
  margin: auto;
}
.Push-video:hover * {
  text-decoration: none;
}
.Push-overlay {
  z-index: 9;
}
.Push-lead {
  width: calc(100% + 6.25em);
  /*less calc escaped string */
  max-width: none;
  margin-left: -3.125em;
  margin-bottom: 1.25em;
}
@media only screen and (min-width: 48em), print {
  .Push-lead {
    width: 100%;
    max-width: 100%;
    margin: 0;
  }
}
@media only screen and (max-width: 48em), print {
  .Push-actions .Button {
    margin-right: 0px;
    margin-top: 8px;
  }
  .Push-actions .Button:last-child {
    margin-right: 0px;
  }
}
.Report-sticky-wrapper {
  padding-left: 10px;
}
@media only screen and (min-width: 34em), print {
  .Report-sticky-wrapper {
    float: right;
    min-height: 161.76px;
    min-width: 80px;
  }
}
@media only screen and (min-width: 48em), print {
  .Report-sticky-wrapper {
    min-width: 87.5px;
  }
}
@media only screen and (min-width: 100.3125em) {
  .Report-sticky-wrapper {
    min-width: 74.5px;
  }
}
.Report-SocialList-Wrapper.is-sticky {
  padding-right: 60px;
}
@media only screen and (min-width: 100.3125em) {
  .Report-SocialList-Wrapper.is-sticky {
    padding-right: 75px !important;
  }
}
.Report-SocialList-Wrapper.is-sticky > .Report-SocialList {
  position: fixed;
  top: 0;
  right: inherit;
}
.Report-container {
  margin-top: -3.25em;
  position: -webkit-sticky;
  position: sticky;
}
@media only screen and (max-width: 100.3125em) {
  .ReportStartPage .Report-container,
  .ReportPage .Report-container {
    margin-left: 10px;
    margin-right: 10px;
  }
}
@media only screen and (max-width: 48em), print {
  .ReportStartPage .Report-container,
  .ReportPage .Report-container {
    margin-left: -10px;
    margin-right: -10px;
  }
}
@media only screen and (max-width: 34em), print {
  .ReportStartPage .Report-container,
  .ReportPage .Report-container {
    margin-top: -0.5em;
  }
}
.Report-content {
  padding-top: 3.25em;
  padding-bottom: 3.25em;
  padding-left: 3.25em;
  padding-right: 3.25em;
}
@media only screen and (max-width: 34em), print {
  .Report-content {
    padding-left: 3px;
    padding-right: 3px;
  }
}
@media only screen and (min-width: 57.5em), print {
  .Report-content .Grid.Grid--gutterV > .Grid-cell {
    padding-top: 30px;
    padding-bottom: 30px;
  }
  .Report-content .Grid.Grid--gutterV > .Grid-cell > .Grid.Report-content--header {
    margin-bottom: -30px;
  }
}
.ReportStartPage .Report-content--text,
.ReportPage .Report-content--text {
  margin-bottom: 20px;
}
.Report-collapsable-panel {
  margin-bottom: 20px;
}
@media only screen and (min-width: 57.5em), print {
  .Report-collapsable-panel {
    margin-top: -30px;
  }
}
.Report-collapsable-content {
  display: none;
}
.Report-collapsable-header,
.Report-collapsable-footer {
  text-align: center;
}
.Report-collapsable-header a,
.Report-collapsable-footer a {
  display: inline-block;
  font-weight: bold;
  line-height: 2em;
}
.Report-collapsable-header a:hover,
.Report-collapsable-footer a:hover {
  text-decoration: none;
  color: #333;
}
.Report-collapsable-header a .icon,
.Report-collapsable-footer a .icon {
  padding-top: 50px;
  display: block;
  width: 35px;
  height: 35px;
  background: url('/Assets/Icons/expandera.svg') no-repeat;
  background-position: center;
  background-size: 100%;
  margin: 0 auto;
}
.Report-collapsable-header a .icon.icon-collapse,
.Report-collapsable-footer a .icon.icon-collapse {
  background-image: url('/Assets/Icons/minimera.svg');
}
.Report-collapsable-footer {
  position: relative;
}
.Report-collapsable-footer a {
  display: none;
}
.Report-SocialList {
  font-size: 12px;
  text-transform: uppercase;
  list-style: none;
}
.Report-SocialList-Viewmode--Desktop {
  float: right;
  padding-top: 3.25em;
}
.Report-SocialList-Viewmode--Desktop .List-item {
  padding-bottom: 2em;
}
@media only screen and (max-width: 48em), print {
  .Report-SocialList-Viewmode--Desktop {
    display: none;
  }
}
.Report-SocialList-Viewmode--Mobile {
  padding-left: 0;
}
.Report-SocialList-Viewmode--Mobile .List-item {
  float: left;
  padding-right: 2em;
  line-height: 2em;
}
.Report-SocialList-Viewmode--Mobile .List-item:first-child {
  position: relative;
  top: 7px;
}
.ReportPage .Report-Header,
.ReportStartPage .Report-Header {
  z-index: 990;
  border-top-width: 3px;
}
.Report-Header .PageNav-item {
  padding: 0;
}
.Report-Header .PageNav-itemLink {
  padding: 1.25em 0;
  line-height: 4em;
}
.Report-Header--mobilenav {
  position: absolute;
  top: 96px;
  width: 100%;
}
.Report-LeadContainer {
  background-size: cover;
  height: calc(100vh - 178px);
  max-height: calc(100vh - 178px);
  min-height: 390px;
  position: relative;
  -webkit-transition: max-height 1s;
  -o-transition: max-height 1s;
  transition: max-height 1s;
}
@media only screen and (max-width: 34em), print {
  .Report-LeadContainer {
    height: 165px;
    min-height: 165px;
  }
}
.Report-LeadContainer-scrollindicator {
  width: 34px;
  text-align: center;
  position: absolute;
  margin: auto;
  left: 0;
  right: 0;
  bottom: 60px;
}
@media only screen and (max-width: 34em), print {
  .Report-LeadContainer-scrollindicator {
    display: none;
  }
}
.Report-LeadContainer-scrolled {
  max-height: 300px;
}
.Report-LeadContainer-scrolled .Report-Lead-text,
.Report-LeadContainer-scrolled .Report-LeadContainer-scrollindicator {
  visibility: hidden;
  opacity: 0;
}
@media only screen and (max-width: 48em), print {
  .ReportStartPage .Report-LeadContainer,
  .ReportPage .Report-LeadContainer {
    margin-left: -20px;
    margin-right: -20px;
  }
}
.Report-Lead {
  color: #fff;
  margin: 0 auto;
  max-width: 1605px;
  position: relative;
  top: 34%;
}
.Report-Lead h5,
.Report-Lead .Heading--h2 {
  color: #fff;
}
.Report-Lead-text {
  -webkit-transition: opacity 0.5s linear, visibility 1s;
  -o-transition: opacity 0.5s linear, visibility 1s;
  transition: opacity 0.5s linear, visibility 1s;
}
@media only screen and (max-width: 34em), print {
  .Report-Lead-text {
    display: none;
  }
}
@media only screen and (max-width: 100.3125em) {
  .ReportStartPage .Report-Lead,
  .ReportPage .Report-Lead {
    margin-left: 10px;
    margin-right: 10px;
    padding-left: 6.25em;
    padding-right: 6.25em;
  }
}
@media only screen and (max-width: 48em), print {
  .ReportStartPage .Report-Lead,
  .ReportPage .Report-Lead {
    margin-left: 10px;
    margin-right: 10px;
    padding-left: 3.25em;
    padding-right: 3.25em;
  }
}
@media only screen and (max-width: 34em), print {
  .ReportStartPage .Report-Lead,
  .ReportPage .Report-Lead {
    margin-left: 20px;
    margin-right: 20px;
    padding-left: 0;
    padding-right: 0;
  }
}
.Report-colored-box {
  border: solid 3px;
  padding: 40px 30px;
  height: 100%;
  position: relative;
}
@media only screen and (max-width: 48em), print {
  .Report-colored-box {
    height: auto;
  }
}
.Report-colored-box--circle {
  margin-top: 35px;
  height: 90%;
}
.Report-colored-box--circle .border-circle {
  display: none;
  position: absolute;
  width: 70px;
  height: 70px;
  border-radius: 50%;
  top: -35px;
  left: calc(50% - 35px);
}
.Report-colored-box ul {
  list-style: none;
}
.Report-colored-box ul li::before {
  content: "\2022";
  display: inline-block;
  width: 0.8em;
  margin-left: -1em;
  line-height: 0;
  font-size: 150%;
  position: relative;
  top: 3px;
}
.Report-colored-box--blue {
  border-color: #009fdf;
}
.Report-colored-box--blue li::before {
  color: #009fdf;
}
.Report-colored-box--blue .border-circle {
  background-color: #009fdf;
  display: block;
}
.Report-colored-box--green {
  border-color: #78be20;
}
.Report-colored-box--green li::before {
  color: #78be20;
}
.Report-colored-box--green .border-circle {
  background-color: #78be20;
  display: block;
}
.Report-colored-box--purple {
  border-color: #7a4183;
}
.Report-colored-box--purple li::before {
  color: #7a4183;
}
.Report-colored-box--purple .border-circle {
  background-color: #7a4183;
  display: block;
}
.Report-colored-box--trafficlightyellow {
  border-color: #ffcd00;
}
.Report-colored-box--trafficlightyellow li::before {
  color: #ffcd00;
}
.Report-colored-box--trafficlightyellow .border-circle {
  background-color: #ffcd00;
  display: block;
}
.Report-colored-box--red {
  border-color: red;
}
.Report-colored-box--red li::before {
  color: red;
}
.Report-colored-box--red .border-circle {
  background-color: red;
  display: block;
}
.Report-colored-box--trafficlightred {
  border-color: #a61731;
}
.Report-colored-box--trafficlightred li::before {
  color: #a61731;
}
.Report-colored-box--trafficlightred .border-circle {
  background-color: #a61731;
  display: block;
}
.Report-modal-link {
  color: #009fdf;
  font-weight: bold;
}
.Report-modal-link::before {
  content: "i";
  display: inline-block;
  font-size: 80%;
  text-align: center;
  width: 20px;
  height: 20px;
  margin-right: 5px;
  background-color: #009fdf;
  color: #fff;
  border-radius: 50%;
}
.Report-related-content {
  margin-top: 40px;
  border-top: solid 3px #009fdf;
}
.Report-related-content-link:hover {
  text-decoration: none;
}
.Report-related-content-item {
  position: relative;
  height: 352px;
  background-size: cover;
  width: 100%;
}
@media only screen and (max-width: 34em), print {
  .Report-related-content-item {
    height: 88px;
    background-position: center 30%;
  }
}
.Report-related-content-title {
  position: relative;
  top: 50%;
  -webkit-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
          transform: translateY(-50%);
  font-family: 'Whitney SSm A', 'Whitney SSm B', 'Arial';
  font-size: 1.5em;
  font-weight: bold;
  color: #fff;
  text-align: center;
  line-height: 1.3em;
  padding: 0 10px;
}
@media only screen and (max-width: 34em), print {
  .Report-related-content-title {
    font-size: 1em;
  }
}
.Report-quote {
  width: 100%;
  height: 565px;
  padding: 2em;
  position: relative;
  background-size: cover;
}
@media only screen and (max-width: 48em), print {
  .Report-quote {
    height: 206px;
    padding-left: 1em;
  }
}
.Report-quote blockquote {
  position: relative;
  top: 50%;
  -webkit-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
          transform: translateY(-50%);
  color: #fff;
  font-size: 2em;
  line-height: 1.5em;
  font-weight: bold;
  border-left: solid 3px #fff;
  padding-left: 1em;
}
@media only screen and (max-width: 48em), print {
  .Report-quote blockquote {
    font-size: 1em;
    padding-left: 0.5em;
    margin: 0;
  }
}
.Report-mobilenav--headline {
  display: block;
  background-color: #eee;
  width: 100%;
  text-align: center;
  line-height: 57px;
  font-size: 20px;
  font-family: 'Whitney SSm A', 'Whitney SSm B', 'Arial';
  font-weight: bold;
}
.Report-mobilenav--headline:active,
.Report-mobilenav--headline:visited,
.Report-mobilenav--headline:hover {
  color: #333;
  text-decoration: none;
}
.Report-mobilenav--headline::after {
  content: "";
  display: inline-block;
  width: 15px;
  height: 10px;
  margin-left: 5px;
  background: url(/Assets/Icons/chevron_down.svg) no-repeat;
}
.Report-mobilenav--headline.navopen + ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.Report-mobilenav--headline.navopen::after {
  background: url(/Assets/Icons/chevron_up.svg) no-repeat;
}
.Report-mobilenav--navitems {
  background-color: #fff;
  margin-top: 0;
  height: calc(100vh - 156px);
  max-height: calc(100vh - 156px);
  list-style: none none inside;
  padding: 0;
  display: none;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
}
.Report-mobilenav--navitem {
  display: block;
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  margin-bottom: 2px;
  background-size: cover;
  background-position: center 30%;
  position: relative;
}
.Report-mobilenav--navitemlink {
  display: block;
  width: 100%;
  text-align: center;
  color: #fff;
  height: 100%;
  font-size: 18px;
  font-weight: bold;
}
.Report-mobilenav--navitemlink span {
  display: block;
  position: relative;
  top: 50%;
  -webkit-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
          transform: translateY(-50%);
}
.Report-mobilenav--navitemlink:active,
.Report-mobilenav--navitemlink:visited,
.Report-mobilenav--navitemlink:hover {
  color: #fff;
  text-decoration: none;
}
.Report-statistics--item {
  margin-top: auto;
  text-align: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  height: 100%;
}
.Report-statistics--item > h4 {
  margin-top: auto;
}
@media only screen and (max-width: 34em), print {
  .ReportStartPage .Page-main,
  .ReportPage .Page-main {
    padding-top: 156px;
  }
}
.ScrollTop {
  display: none;
  -webkit-transition: all ease-in 0.5s;
  -o-transition: all ease-in 0.5s;
  transition: all ease-in 0.5s;
  z-index: 1000;
}
.ScrollTop.is-sticky {
  right: 0;
}
@media only screen and (min-width: 48em), print {
  .ScrollTop {
    display: block;
    position: fixed;
    bottom: 200px;
    right: -80px;
    background-color: #009fdf;
    height: 50px;
    width: 50px;
    border-top-left-radius: 0.8em;
    border-bottom-left-radius: 0.8em;
    cursor: pointer;
  }
  .ScrollTop:before {
    content: "";
    display: block;
    height: 20px;
    width: 20px;
    border-top: 3px solid #fff;
    border-left: 3px solid #fff;
    -webkit-transform: rotate(45deg);
        -ms-transform: rotate(45deg);
            transform: rotate(45deg);
    position: absolute;
    top: calc(50% - 5px);
    left: calc(50% - 10px);
  }
}
.ScrollTop span {
  height: 50px;
  width: 50px;
  display: block;
  position: relative;
  z-index: 999;
}
.no .Search-container {
  margin-top: 0em !important;
}
.no .Search-container .Header-logo-search {
  display: block !important;
  margin-bottom: 20px;
}
@media only screen and (max-width: 34em), print {
  .no .Search-container .Header-logo-search {
    padding: 10px;
    margin-bottom: 10px;
  }
}
.Search-container {
  max-width: 1605px;
  margin-left: auto;
  margin-right: auto;
  right: 0;
  left: 0;
  height: 100%;
  width: 100%;
  position: fixed;
}
.Search-container > .Page-container {
  margin-right: 20px;
  background-color: #fff;
  float: right;
  position: relative;
  -webkit-box-shadow: 0 0 11px rgba(33, 33, 33, 0.2);
          box-shadow: 0 0 11px rgba(33, 33, 33, 0.2);
  padding: 1.5em 2em;
}
.search-input-wrap {
  display: inline-block;
}
.Search > form > .Button {
  margin-left: 20px;
  padding: 1.1em 2.1em;
}
.Header-primarySearch.is-active::after {
  content: '';
  position: absolute;
  bottom: -95px;
  display: block;
  width: 0;
  height: 0;
  border: 20px solid transparent;
  border-bottom-color: #fff;
  margin-left: -10px;
  margin-top: -20px;
  z-index: 99;
}
@media only screen and (min-width: 75em) {
  .Header-primarySearch.is-active::after {
    bottom: -40px;
  }
}
.OffCanvas-menu > div > .Search {
  margin-bottom: 2em;
}
.megamenu-secondarynav--offCanvas > div > .Search {
  margin-bottom: 0em;
}
.Search {
  position: relative;
}
.Search input {
  width: 100%;
  padding: 0.625em 4em;
  border: none;
  border-bottom: 1px solid #ccc;
  border-top: 1px solid #ccc;
  border-left: 1px solid #ccc;
  border-right: 1px solid #ccc;
  border-radius: 0;
  background-image: url('/Assets/Icons/temp/SearchIcon.svg');
  background-position: 20px center;
  background-repeat: no-repeat;
}
.Search input:focus {
  -webkit-box-shadow: none;
          box-shadow: none;
}
.Search-close {
  position: absolute;
  height: 100%;
  width: 40px;
  top: 0;
  right: 20px;
  background-position: right top;
  background-repeat: no-repeat;
}
@media only screen and (min-width: 48em), print {
  .Search-close {
    right: 0;
  }
}
.Search-shortcuts a {
  font-size: 1.125em;
  font-weight: bold;
}
@media only screen and (min-width: 57.5em), print {
  .Search-shortcuts a {
    font-size: 1.5em;
  }
}
.Search-shortcuts a:hover {
  color: #333;
}
.Search-page-header {
  border-bottom: 1px solid #ddd;
}
@media only screen and (max-width: 48em), print {
  .Search-page-header {
    border-bottom: none;
  }
}
.Search-page-header div > h1 {
  padding-right: 1.5em;
}
.Search-page-header .Search {
  vertical-align: middle;
  float: right;
  padding-top: 0.5em;
}
@media only screen and (max-width: 48em), print {
  .Search-page-header .Search {
    width: 100%;
    padding-bottom: 30px;
  }
  .Search-page-header .Search form > .search-input-wrap {
    width: 100%;
  }
  .Search-page-header .Search .Button {
    display: none;
  }
  .Search-page-header .Search form > button {
    display: none;
  }
}
.Search-page-header .Search form > button {
  padding: 1.1em 3.5em;
}
.Search-page-header .Search .Button {
  width: 92%;
  margin-left: 8%;
  height: 50.8px;
  line-height: 0;
}
.search-filter {
  display: none;
}
@media only screen and (min-width: 34em), print {
  .search-filter {
    display: block;
  }
}
.search-filter.is-active {
  display: block;
}
.Filter-toggler {
  background: url(/Assets/Icons/chevron_down_blue.svg) center 8px no-repeat;
  -webkit-transition: -webkit-transform 1s linear;
  transition: -webkit-transform 1s linear;
  -o-transition: transform 1s linear;
  transition: transform 1s linear;
  transition: transform 1s linear, -webkit-transform 1s linear;
  background-position-x: 63%;
  background-position-y: center;
}
.Filter-toggler.is-active {
  background: url(/Assets/Icons/chevron_up_blue_origsize.svg) center 8px no-repeat;
  -webkit-transition: -webkit-transform 1s linear;
  transition: -webkit-transform 1s linear;
  -o-transition: transform 1s linear;
  transition: transform 1s linear;
  transition: transform 1s linear, -webkit-transform 1s linear;
  background-position-x: 63%;
  background-position-y: center;
  text-decoration: unset;
  color: #009fdf;
}
.search-sort a.is-active {
  text-decoration: underline;
  font-weight: 600;
  pointer-events: none;
  cursor: default;
}
.search-sort a.is-active:hover {
  color: #333;
}
.mobile-suggestions {
  position: fixed !important;
  padding-bottom: 15px;
  margin-top: 0;
  border-top: 1px solid #eee;
  border-bottom: 1px solid #eee;
}
@media only screen and (min-width: 48em), print {
  .mobile-suggestions {
    overflow: hidden;
    font-size: 14px;
    border-bottom: 1px solid #eee;
    -webkit-box-shadow: 0px 10px 33px -20px #cccccc;
    box-shadow: 0px 10px 33px -20px #cccccc;
  }
}
.lead-suggestions {
  margin-top: 0px;
}
.desktop-suggestions {
  border-top: 1px solid #eee;
}
.autocomplete-suggestions {
  padding-left: 0px;
  position: absolute;
  z-index: 99999;
  list-style: none;
  overflow: hidden;
  overflow-y: auto;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  background-color: #ffffff;
  display: none;
}
@media only screen and (min-width: 48em), print {
  .autocomplete-suggestions {
    overflow: hidden;
    font-size: 14px;
  }
}
.autocomplete-suggestions .List-item {
  padding: 1em;
}
.autocomplete-suggestions .List-item:first-child {
  padding-top: 14px;
}
.autocomplete-suggestions .List-item:last-child {
  padding: 1em;
}
.autocomplete-suggestions .List-item div > a {
  line-height: 50px;
}
.autocomplete-suggestions .List-item a {
  color: #333;
  font-size: 16;
}
.autocomplete-suggestions .List-item:hover {
  background-color: #f1f1f1;
  z-index: 999991;
}
@media only screen and (min-width: 75em) {
  .Search-shortcuts li:last-child {
    display: inline-block;
  }
}
@media only screen and (min-width: 75em) {
  .spb-full-width {
    padding-right: 48px !important;
  }
  .spb-paddingV {
    padding-top: 3.75em !important;
    padding-bottom: 5em !important;
  }
  .spb-paddingV .img-left {
    margin-top: -60px;
    margin-bottom: -80px;
    margin-left: -50px;
  }
  .spb-paddingV .img-right {
    margin-top: -60px;
    margin-bottom: -80px;
    margin-right: -50px;
    float: right;
  }
}
.Segment {
  height: 100%;
  font-size: 12px;
  padding: 1.25em 1.875em;
  /*THEMES*/
}
@media only screen and (min-width: 48em), print {
  .Segment {
    padding: 1.875em;
  }
}
.Segment .Heading,
.Segment .Heading--h1,
.Segment h1,
.Segment .Heading--h2,
.Segment h2,
.Segment .Heading--h3,
.Segment h3,
.Segment .Heading--h4,
.Segment h4,
.Segment .Heading--h5,
.Segment h5,
.Segment .Heading--h6,
.Segment h6,
.Segment .Heading--h7 {
  text-align: center;
  font-weight: 900;
  text-transform: uppercase;
}
@media only screen and (min-width: 48em), print {
  .Segment p {
    margin-top: 25px;
  }
}
.Segment ul,
.Segment ol {
  border-top: 1px dotted #333;
  padding-top: 0.83333333em;
  margin-bottom: 0;
}
.Segment.u-colorWhite ul,
.Segment.u-colorWhite ol {
  border-color: #fff;
}
.Segment--themeCyan {
  background-color: #ccecf9;
}
.Segment--themeGreen {
  background-color: #78be20;
  color: #ffffff;
}
.Segment--themeGreenLight {
  background-color: #c9e5a6;
}
.Segment--themeRed {
  background-color: #a61731;
  color: #ffffff;
}
.Segment--themeYellow {
  background-color: #ffcd00;
}
.slick-prev,
.slick-next {
  z-index: 998;
}
.slick-prev::before,
.slick-next:before {
  color: rgba(0, 0, 0, 0.7);
  font-size: 30px;
}
@media only screen and (max-width: 75em) {
  .slick-prev {
    left: -55px;
  }
}
@media only screen and (max-width: 48em), print {
  .slick-prev {
    left: -40px;
  }
}
@media only screen and (max-width: 34em), print {
  .slick-prev {
    left: -48px;
  }
}
@media only screen and (max-width: 75em) {
  .slick-next {
    right: -55px;
  }
}
@media only screen and (max-width: 48em), print {
  .slick-next {
    right: -40px;
  }
}
@media only screen and (max-width: 34em), print {
  .slick-next {
    right: -48px;
  }
}
.slide-item {
  text-align: center;
  padding: 0 10px;
}
.slide-item img {
  display: inline;
}
.slider-link {
  padding-top: 20px;
  text-align: center;
}
.slick-carousel a::after,
.slick-carousel + .slider-link a::after {
  content: ">";
  padding-left: 5px;
}
/*#

Allows to create a slider with any type of content.

<div class="Slider owl-carousel owl-theme" data-module="slider">
    <div class="Slider-item"><h2 style="height: 150px; background: #eee;margin:0;padding: 1em 2em 2em;">Slide 1</h2></div>
    <div class="Slider-item"><h2 style="height: 150px; background: #ddd;margin:0;padding: 1em 2em 2em;">Slide 2</h2></div>
    <div class="Slider-item"><h2 style="height: 150px; background: #ccc;margin:0;padding: 1em 2em 2em;">Slide 3</h2></div>
</div>

*/
.Slider-item {
  position: relative;
}
.Slider-item img {
  display: block;
  height: auto;
  width: 100%;
}
.Slider-item a {
  display: block;
}
.slide-item--wrapper {
  padding: 3px;
}
.slide-item--innerwrapper {
  padding: 3px;
}
.slide-item a {
  display: block;
  -webkit-transition: 0.5s;
  -o-transition: 0.5s;
  transition: 0.5s;
}
.slide-item a .slide-item-readmore:hover {
  text-decoration: underline;
  color: #009fdf;
}
.slide-item a .slide-item-readmore::after {
  content: ">";
  padding-left: 5px;
}
.slide-item a::after {
  content: "";
  padding-bottom: 5px;
}
.slide-item a:hover {
  -webkit-box-shadow: 0 0 11px rgba(33, 33, 33, 0.2);
          box-shadow: 0 0 11px rgba(33, 33, 33, 0.2);
  text-decoration: none;
  color: #333;
}
.SocialSharing {
  padding-top: 0.2em;
}
.SocialSharing ul {
  padding: 0;
}
@media only screen and (max-width: 34em), print {
  .SocialSharing li:first-child {
    display: none;
  }
  .SocialSharing li:last-child {
    padding-right: 0 !important;
  }
}
.SocialSharing .List-item {
  padding-left: 0;
}
@media only screen and (max-width: 26.25em), print {
  .SocialSharing .List-item {
    padding-right: 5px;
  }
  .SocialSharing--top {
    float: right;
    padding-top: 0;
  }
  .SocialSharing--top .List > .List-item .Sharing {
    width: 50px;
    height: 25px;
    text-align: center;
  }
  .SocialSharing--top .List > .List-item .Sharing a {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
  }
  .SocialSharing--top .List > .List-item .Sharing img {
    width: 28px;
    height: 28px;
  }
}
.SocialSharing--bottom {
  text-align: center;
  padding-top: 2em;
}
@media only screen and (max-width: 26.25em), print {
  .SocialSharing--bottom .Sharing {
    width: 70px;
  }
}
.Social-list {
  margin: 0;
}
.Social-list--noBg .List-item:last-child {
  padding-right: 1.25em;
}
@media only screen and (min-width: 57.5em), print {
  .Social-list--noBg .List-item:last-child {
    padding-right: 1.875em;
  }
}
@media only screen and (min-width: 100.3125em) {
  .Social-list--noBg .List-item:last-child {
    padding-right: 0.2em;
  }
}
.Social-list img {
  width: 35px;
  height: 35px;
}
.Social-list .Sharing {
  padding: 0px;
}
@media only screen and (min-width: 34em), print {
  .Social-list .Sharing {
    border-radius: 50%;
    text-align: center;
  }
}
.Social-list .Sharing--twitter {
  background-color: #1da1f2;
}
.Social-list .Sharing--facebook {
  background-color: #4267b2;
}
.Social-list .Sharing--linkedin {
  background-color: #0077b5;
}
footer .Social-list {
  padding-left: 0;
  margin: 20px 0;
}
footer .Social-list .List-item:last-child {
  padding-right: 0.83333333em;
}
footer .Social-list img {
  width: 49px;
  height: 49px;
}
/*#
Component used to display status messages.

<div class="Status"><p>This is plain status message</p></div>
<div class="Status Status--success"><p>This is a success message</p></div>
<div class="Status Status--info"><p>This is an info message</p></div>
<div class="Status Status--warning"><p>This is a warning message</p></div>
    
*/
.Status {
  padding: 0.1em 1em;
  margin: 1em 0;
  background-color: #f1f1f1;
}
.Status--rounded {
  border-radius: 1em;
}
.Status--fixedBottom {
  margin: 0;
  position: fixed;
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
  /* 1 */
  bottom: 0;
  right: 0;
  z-index: 10;
}
.Status--center {
  text-align: center;
}
.Status--transparent {
  background-color: transparent;
}
.Status--tight {
  padding-right: 0;
  padding-left: 0;
}
.Status--condensed {
  padding-right: 0.4em;
  padding-left: 0.4em;
}
.Status--success {
  background-color: #e2f9be;
}
.Status--info {
  background-color: #fff6cb;
}
.Status--warning {
  background-color: #ffd9c8;
}
/*# 

<table class="Table">
    <thead>
        <tr>
            <th>Header 1</th>
            <th>Header 2</th>
            <th><a href="#">Header 3</a></th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>Row col 1</td>
            <td>Row col 2</td>
            <td>Row col 3</td>
        </tr>
        <tr>
            <td>Row col 1</td>
            <td>Row col 2</td>
            <td>Row col 3</td>
        </tr>
    </tbody>
</table>

*/
.Table--striped tbody tr:nth-child(odd) {
  background-color: #f7f7f7;
}
.Table--bordered td {
  border-bottom: 1px solid #ddd;
}
.Table--alignMiddle td {
  vertical-align: middle;
}
@media only screen and (max-width: 34em), print {
  /**
     * Enable this modifier to display a flat table layout in small screens.
     * Utilizing a data-th attribute to display headings before each column.
     *
     * Example HTML:
     *   <tr>
     *       <td data-th="Movie Title">Star Wars</td>
     *       <td data-th="Genre">Adventure, Sci-fi</td>
     *       <td data-th="Year">1977</td>
     *       <td data-th="Gross">$460,935,665</td>
     *   </tr> 
     */
  .Table--flatInSmall tr {
    border-top: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
  }
  .Table--flatInSmall th {
    display: none;
  }
  .Table--flatInSmall td {
    display: block;
  }
  .Table--flatInSmall td:before {
    content: attr(data-th) ": ";
    display: inline-block;
    font-weight: bold;
    vertical-align: top;
    margin-right: 0.5em;
  }
}
/*#

Component for dividing content into different tab panels on page.
Uses the "tabs" js-module.

<div class="Tabs" data-module="tabs">
    <ul class="Tabs-list">
        <li class="Tabs-item" data-name="tab-one"><a href="#" class="Tabs-link">Tab 1</a></li>
        <li class="Tabs-item" data-name="tab-two"><a href="#" class="Tabs-link">Tab 2</a></li>
    </ul>

    <div class="Tabs-panel">
        Panel 1
    </div>

    <div class="Tabs-panel">
        Panel 2
    </div>
</div>

*/
.Tabs {
  margin-bottom: 1.25em;
}
.Tabs-list {
  margin: 0;
  padding-left: 0;
  width: 100%;
  text-align: left;
  border-bottom: 1px solid #ddd;
}
.Tabs-item {
  vertical-align: bottom;
  display: inline-block;
  padding: 0;
  margin: 0;
  margin-right: 1.25em;
}
.Tabs-item:before {
  content: none;
}
.Tabs-item.is-active .Tabs-link {
  color: #009fdf;
  border-bottom-color: #009fdf;
}
.Tabs-link {
  display: block;
  text-decoration: none;
  padding: 0.83333333em 0;
  overflow: hidden !important;
  -o-text-overflow: ellipsis !important;
     text-overflow: ellipsis !important;
  white-space: nowrap !important;
  word-wrap: normal !important;
  border-bottom: 3px solid transparent;
  color: #333;
}
.Tabs-link:hover {
  color: #009fdf;
  text-decoration: none;
}
.Tabs-panel {
  display: none;
}
.Tabs-panel.is-active {
  display: block;
}
.Tabs--equalWidth .Tabs-list {
  display: table;
  table-layout: fixed;
}
.Tabs--equalWidth .Tabs-item {
  display: table-cell;
}
.Teaser {
  position: relative;
  overflow: hidden;
}
.Teaser h4 {
  font-weight: bold;
}
.Teaser--small {
  min-height: 200px;
}
.Teaser--tall {
  min-height: 300px;
}
.Teaser--mobHigh {
  height: 300px;
}
.Teaser-content {
  padding: 0% 5%;
  z-index: 9;
}
.Teaser-item {
  padding: 0% 20% 0% 0% !important;
  z-index: 9;
}
.Teaser--contentBottom {
  position: absolute;
  bottom: 5px;
  z-index: 1;
  width: 100%;
}
.Teaser--contentBottom p {
  margin: 0.625em 0;
}
.Teaser--textInverted {
  color: #ffffff;
}
.Teaser--textInverted * {
  color: #ffffff;
}
.Teaser--textInverted a:hover {
  color: #ffffff;
}
.Teaser--contentMid {
  position: absolute;
  top: 20px;
  height: 100%;
}
.Teaser-social.Teaser--facebook {
  background-color: #3d5b97;
  color: #ffffff;
}
.Teaser-social.Teaser--facebook h6 {
  color: #ffffff;
}
.Teaser-social.Teaser--twitter {
  background-color: #1da1f2;
  color: #ffffff;
}
.Teaser-social.Teaser--twitter h6 {
  color: #ffffff;
}
.Teaser-social.Teaser--linkedin {
  background-color: #ffffff;
}
.Teaser-social img {
  float: left;
  margin-right: 15px;
}
.Teaser-social p {
  font-size: 1em;
}
.Teaser--lead .Teaser-content {
  padding: 5%;
  position: static;
}
.Teaser-bgImage {
  width: 100%;
  height: 100%;
  overflow: hidden;
  position: relative;
  background-repeat: no-repeat;
  background-size: cover;
}
.Teaser-bgImage:after {
  content: '';
  display: block;
  width: 100%;
  height: 100%;
  -webkit-box-shadow: inset 0 -210px 120px -70px rgba(0, 0, 0, 0.5);
          box-shadow: inset 0 -210px 120px -70px rgba(0, 0, 0, 0.5);
  position: absolute;
  bottom: 0;
}
.Teaser-bgImage.BgOverlay:after {
  -webkit-box-shadow: none;
          box-shadow: none;
}
.Teaser-bgImage.Teaser-bgImage--noShadow:after {
  -webkit-box-shadow: none;
          box-shadow: none;
}
.Teaser-dateBox {
  background-color: #009fdf;
  color: #ffffff;
  text-align: center;
  padding: 5px 20px;
  margin-right: 1.25em;
}
.Teaser-dateBox span {
  display: block;
  font-size: 1em;
  font-weight: bold;
}
.Teaser-dateBox span:first-child {
  font-size: 1.5em;
}
.Teaser-category {
  height: 250px;
}
.Teaser-category .Teaser-content {
  z-index: 99;
}
.Teaser-author {
  position: absolute;
  bottom: 30px;
}
.Teaser-author .Teaser-authorImg {
  display: inline-block;
  vertical-align: middle;
  margin-right: 0.83333333em;
}
.Teaser-author .Teaser-authorInfo {
  display: inline-block;
  vertical-align: middle;
  text-align: left;
}
.Teaser-author .Teaser-authorInfo h6 {
  margin-bottom: 0;
}
@media only screen and (min-width: 48em), print {
  .Teaser--small {
    height: 299px;
  }
  .Teaser--small.Teaser-social {
    height: 269px;
    /*margin: 15px 0;*/
  }
  .Teaser--tall {
    min-height: 598px;
  }
  .Teaser-social p {
    font-size: 22px;
  }
  .Teaser--linkedin {
    height: 269px;
  }
  .Teaser-content {
    padding: 2% 5%;
  }
  .Teaser--contentBottom {
    bottom: 15px;
  }
  .Teaser-category {
    height: 340px;
  }
  .Teaser--contentMid {
    position: absolute;
    top: 0;
    height: 100%;
    width: 100%;
    padding-top: 50px;
  }
  .Teaser-author {
    bottom: 45px;
  }
  .Teaser a {
    position: relative;
    z-index: 800;
  }
  .Teaser a:hover .u-linkState {
    text-decoration: underline !important;
  }
  .Teaser > a {
    display: block;
    height: 100%;
  }
}
@media only screen and (min-width: 75em) {
  .Teaser--contentMid {
    padding-top: 75px;
  }
}
.Testamonials-image {
  text-align: center;
  margin-bottom: 1.875em;
}
@media only screen and (min-width: 48em), print {
  .Testamonials-image {
    text-align: right;
    margin-right: 1.875em;
    margin-bottom: 0;
  }
}
.Testamonials-text {
  text-align: center;
}
@media only screen and (min-width: 48em), print {
  .Testamonials-text {
    text-align: left;
  }
}
/*#

Display tooltips

Examples:

<div class="Tooltip Tooltip--arrowE">
    <div class="Tooltip-content">
        The content of the tooltip.
    </div>
    <div class="Tooltip-arrow"></div>
</div>

*/
.Tooltip {
  max-width: 320px;
  padding: 5px;
  position: absolute;
  z-index: 1000;
  opacity: 0;
  -webkit-animation: fade-in ease-in 0.3s 0.25s forwards;
          animation: fade-in ease-in 0.3s 0.25s forwards;
}
.Tooltip-content {
  display: block;
  font-size: 1.125em;
  color: #fff;
  background-color: #4d4d4d;
  padding: 0.625em;
}
.Tooltip-arrow {
  position: absolute;
  line-height: 0;
  border: 6px solid transparent;
}
.Tooltip--arrowN .Tooltip-arrow {
  border-bottom: 0;
  border-top-color: #4d4d4d;
  bottom: 0;
  left: 50%;
  margin-left: -5px;
}
.Tooltip--arrowS .Tooltip-arrow {
  border-bottom-color: #4d4d4d;
  border-top: 0;
  left: 50%;
  margin-left: -5px;
  top: 0;
}
.Tooltip--arrowW .Tooltip-arrow {
  border-left-color: #4d4d4d;
  border-right: 0;
  margin-top: -5px;
  right: 0;
  top: 50%;
}
.Tooltip--arrowE .Tooltip-arrow {
  border-left: 0;
  border-right-color: #4d4d4d;
  left: 0;
  margin-top: -5px;
  top: 50%;
}
.Tooltip--arrowNW .Tooltip-arrow {
  border-bottom: 0;
  border-left: 0;
  border-top-color: #4d4d4d;
  bottom: 0;
  left: 5px;
}
.Tooltip--arrowNE .Tooltip-arrow {
  border-bottom: 0;
  border-right: 0;
  border-top-color: #4d4d4d;
  bottom: 0;
  right: 5px;
}
.Tooltip--arrowSW .Tooltip-arrow {
  border-bottom-color: #4d4d4d;
  border-bottom-style: solid;
  border-left: 0;
  border-right-color: transparent;
  border-top: 0;
  left: 5px;
  top: 0;
}
.Tooltip--arrowSE .Tooltip-arrow {
  border-bottom-color: #4d4d4d;
  border-bottom-style: solid;
  border-left-color: transparent;
  border-right: 0;
  border-top: 0;
  right: 5px;
  top: 0;
}
@-webkit-keyframes fade-in {
  from {
    -webkit-transform: translateY(0.8em);
            transform: translateY(0.8em);
    opacity: 0;
  }
  50% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
  to {
    opacity: 1;
  }
}
@keyframes fade-in {
  from {
    -webkit-transform: translateY(0.8em);
            transform: translateY(0.8em);
    opacity: 0;
  }
  50% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
  to {
    opacity: 1;
  }
}
/*#

<h4>Video</h4>
<div class="Video" data-module="Video" data-video="'videoType': 'video','videoUrl':'http://www.cloudreel.se/assets/CustomerData/Soederberg-Partners/KoncernInfo/214_HiresVideoFile_uni.mp4'">
    <div class="Video-play js-videoPlay">Play</div>
    <div class="Video-info">
        <h6>Titel</h6>
        <h3>Beskrivning</h3>
    </div>
    <div class="Video-poster">
        <div class="Video-posterImage" style="background-image: url('/Assets/Images/office-default.jpg')"></div>
    </div>
    <div class="Video-modal js-videoModal">
        <div class="Video-modalContainer">
            <div class="Video-media js-videoMedia"></div>
        </div>
    </div>
</div>
<br>
<h4>iFrame</h4>
<div class="Video" data-module="Video" data-video="'videoType': 'iframe','videoUrl':'laasoy84YLY'">
    <div class="Video-play js-videoPlay">Play</div>
    <div class="Video-info">
        <h6>Titel</h6>
        <h3>Beskrivning</h3>
    </div>
    <div class="Video-poster">
        <div class="Video-posterImage" style="background-image: url('/Assets/Images/office-default.jpg')"></div>
    </div>
    <div class="Video-modal js-videoModal">
        <div class="Video-modalContainer">
            <div class="Video-media js-videoMedia"></div>
        </div>
    </div>
</div>

*/
.Video {
  position: relative;
}
@media only screen and (max-width: 57.5em), print {
  .Video.is-active .Video-media {
    position: relative;
  }
}
.Video.is-active .Video-modal {
  opacity: 1;
  visibility: visible;
}
.Video-play {
  position: absolute;
  width: 80px;
  height: 80px;
  line-height: 80px;
  border-radius: 50%;
  border: 2px solid #fff;
  text-align: center;
  background: rgba(0, 0, 0, 0.3);
  color: #fff;
  cursor: pointer;
  z-index: 2;
  margin: 0 auto;
  left: 0;
  right: 0;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}
@media only screen and (min-width: 57.5em), print {
  .Video-play {
    width: 100px;
    height: 100px;
    line-height: 100px;
  }
}
.Video.is-active .Video-info,
.Video.is-active .Video-play {
  display: none;
}
.Video-poster {
  position: relative;
}
.Video-poster:after {
  content: '';
  display: block;
  padding-bottom: 56.25%;
}
.Video-posterImage {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  background-size: cover;
  background-position: center;
}
.Video-info {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  padding: 0.625em 1.25em 0 1.25em;
  color: #fff;
  -webkit-box-shadow: inset 0px -100px 100px -80px #000;
          box-shadow: inset 0px -100px 100px -80px #000;
  z-index: 1;
}
@media only screen and (min-width: 57.5em), print {
  .Video-info {
    padding: 1.875em 2.5em;
  }
}
@media only screen and (min-width: 75em) {
  .Video-info {
    padding: 2.5em 5em;
  }
}
.Video-info * {
  font-weight: normal;
  color: #fff;
}
.Video-player-container {
  position: absolute;
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
}
.Video-modal {
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 9999;
  background: rgba(0, 0, 0, 0.7);
  overflow: auto;
  opacity: 0;
  visibility: hidden;
  -webkit-transition: opacity 0.3s, visibility 0.3s;
  -o-transition: opacity 0.3s, visibility 0.3s;
  transition: opacity 0.3s, visibility 0.3s;
}
.Video-modalContainer {
  max-width: 1605px;
  width: 100%;
  max-height: 100%;
  padding: 1.25em 3.125em;
  position: absolute;
  left: 0;
  right: 0;
  margin: 0 auto;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}
.Video-media {
  position: absolute;
}
@media only screen and (min-width: 57.5em), print {
  .Video-media {
    position: relative;
  }
}
.Video-media:after {
  content: '';
  display: block;
  padding-bottom: 56.25%;
}
.Video-media * {
  position: absolute !important;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  height: 100% !important;
  width: 100% !important;
}
@media only screen and (min-width: 57.5em), print {
  .Teaser--tall .Push .Video {
    max-height: 598px;
  }
  .Push .Video {
    max-height: 700px;
  }
}
aside {
  width: 100%;
}
@media only screen and (min-width: 48em), print {
  aside {
    position: relative;
    left: 0.83333333em;
  }
}
/*#

Component for the footer section.

Examples:

<div>
    <footer class="Footer">
        <div class="Page-container">
            <nav class="PageNav PageNav--horizontal Footer-nav">
                <ul class="PageNav-list">
                    <li class="PageNav-item">
                        <a href="#" class="PageNav-itemLink is-active">Frontend Docs</a>
                    </li>
                    <li class="PageNav-item">
                        <a href="#" class="PageNav-itemLink">Backend Docs</a>
                    </li>
                    <li class="PageNav-item">
                        <a href="#" class="PageNav-itemLink">About Encore</a>
                    </li>
                </ul>
            </nav>

            <div class="Footer-logo">
                <a href="#"><img src="/assets/images/logo/nansen-encore.png" class="Header-logoImage" width="160" /></a>
            </div>
        </div>
    </footer>  
</div>

*/
.Footer {
  background: #fff;
  border-top: 1px solid #e7e7e7;
  margin-top: 2.5em;
  text-align: center;
  padding-top: 0;
}
.Footer-primaryContent {
  max-width: 1605px;
  margin: 0 auto;
  display: block;
  text-align: center;
}
.Footer-nav {
  -webkit-box-flex: 1;
      -ms-flex: 1 1 auto;
          flex: 1 1 auto;
  text-align: left;
  font-size: 1em;
}
.PageNav--horizontal.Footer-nav .PageNav-item {
  display: block;
  width: 100%;
  text-align: center;
}
@media only screen and (min-width: 57.5em), print {
  .Footer {
    padding-bottom: 2.5em;
  }
  .Footer-primaryContent {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    border-top: 1px solid #d0d0d0;
    margin-top: 1.875em;
    margin-bottom: 1.875em;
    padding-top: 1.25em;
    padding-bottom: 1.25em;
    border-bottom: 1px dotted #e3e3e3;
  }
  .PageNav--horizontal.Footer-nav .PageNav-item {
    display: inline-block;
    text-align: left;
    width: auto;
  }
  .Footer-logo {
    margin-right: 1.875em;
  }
  .Footer-nav {
    text-align: center;
  }
  .Footer-nav .PageNav-item {
    display: block;
    width: 100%;
  }
}
/*#

Component for the header section.

Examples:

<div>
    <header class="Header">
        <div class="Header-secondary">
            <div class="Page-container">
                <nav class="PageNav PageNav--horizontal PageNav--small Header-secondaryNav">
                    <ul class="PageNav-list">
                        <li class="PageNav-item">
                            <a href="#" class="PageNav-itemLink">About</a>
                        </li>
                        <li class="PageNav-item">
                            <a href="#" class="PageNav-itemLink">Contribute</a>
                        </li>
                        <li class="PageNav-item">
                            <a href="#" class="PageNav-itemLink">About</a>
                        </li>
                    </ul>
                </nav>
            </div>
        </div>

        <div class="Header-primary">
            <div class="Page-container Header-primaryContainer">
                <div class="Header-logo">
                    <a href="#"><img src="/assets/images/logo/nansen-encore.png" class="Header-logoImage" width="160" /></a>
                </div>

                <nav class="PageNav PageNav--horizontal PageNav--large Header-primaryNav">
                    <ul class="PageNav-list">
                        <li class="PageNav-item">
                            <a href="#" class="PageNav-itemLink is-active">Frontend Docs</a>
                        </li>
                        <li class="PageNav-item">
                            <a href="#" class="PageNav-itemLink">Backend Docs</a>
                        </li>
                        <li class="PageNav-item">
                            <a href="#" class="PageNav-itemLink">About Encore</a>
                        </li>
                    </ul>
                </nav>
            </div>
        </div>
    </header>
</div>

*/
.Header {
  border-top: 4px solid #002d72;
  border-bottom: 1px solid #d0d0d0;
  width: 100%;
  background: #ffffff;
  position: fixed;
  display: block;
  min-height: 90px;
  z-index: 999;
  transition: transform linear 400ms, -webkit-transform linear 400ms;
  -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0);
}
.Header .Header-menuButton {
  -webkit-box-flex: 0;
      -ms-flex: none;
          flex: none;
}
.hide-navigation {
  display: none !important;
}
.header-hideonscroll {
  -webkit-transform: translate(0, -100%);
      -ms-transform: translate(0, -100%);
          transform: translate(0, -100%);
}
@media only screen and (max-width: 26.25em), print {
  .Header-logo-wrapper {
    width: calc(100% - 2.635em);
    position: absolute;
  }
}
.Header-logo {
  text-align: center;
  /*@media @bpXSmallMax{
        padding-bottom: 8px;
    }*/
}
@media only screen and (max-width: 26.25em), print {
  .Header .menu-notext .Header-logo {
    padding-bottom: 0px;
  }
  .Header .menu-notext .Header-menuButton > img {
    padding-top: 4px;
  }
}
.Header-secondary {
  padding: 0 1.25em;
  background: #ffffff;
  text-align: right;
}
.Header-primary {
  padding: 1.375em 1.25em;
}
.Header-primaryContainer {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
@media only screen and (min-width: 48em), print {
  .Header-primaryContainer {
    padding-bottom: 55px;
  }
}
@media only screen and (min-width: 75em) {
  .Header-primaryContainer {
    padding-bottom: 0;
  }
}
.Header-primaryContainer > * {
  -webkit-box-flex: 1;
      -ms-flex: 1 1 auto;
          flex: 1 1 auto;
}
.Header-primaryNav {
  -webkit-box-flex: 1;
      -ms-flex: 1 1 auto;
          flex: 1 1 auto;
  text-align: right;
  position: absolute;
  top: 80px;
  left: 0;
  right: 0;
}
@media only screen and (min-width: 75em) {
  .Header-primaryNav {
    position: static;
  }
}
.Header-secondaryNav {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
}
@media only screen and (min-width: 75em) {
  .Header-secondaryNav .Grid-cell:last-child {
    padding-left: 5%;
  }
}
.Toolbar {
  text-align: right;
}
.Toolbar-languageFlag,
.Toolbar-languageTrigger {
  display: inline-block;
}
.Toolbar-language-list-Flag {
  float: right;
  padding-right: 4px;
  padding-top: 0.4125em;
}
.Toolbar-languageTrigger {
  margin-left: 5px;
  width: 15px;
  height: 8px;
  background: url('/Assets/Icons/chevron_down.svg') 0 0 no-repeat;
}
.Toolbar-languageTrigger.is-active {
  background: url('/Assets/Icons/chevron_up_blue.svg') 0 0 no-repeat;
}
.Toolbar-mobile {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
}
@media only screen and (max-width: 26.25em), print {
  .Header {
    min-height: 65px;
  }
  .Header .Header-menuButton--text {
    text-transform: uppercase;
    /*font-size: 8px;*/
    font-weight: 600;
    margin-top: -9px;
    margin-bottom: 0px;
  }
  .Header-primary {
    padding-left: 1.25em;
    padding-right: 1.25em;
    padding-top: 1em;
    padding-bottom: 1em;
  }
  .Header-primaryContainer .u-marginRxlg {
    z-index: 2;
    margin-right: auto !important;
  }
  .Header-logo > a > img {
    max-width: 105px;
  }
}
@media only screen and (min-width: 48em), print {
  .Header {
    position: relative;
    z-index: 9999;
    min-height: 100%;
  }
  .hide-border {
    border-bottom: 0px !important;
  }
  .Header-primary {
    padding-bottom: 0;
    position: static;
    padding: 0 1.25em;
  }
  .Header-logo {
    text-align: left;
  }
  .Header-primaryContainer > * {
    -webkit-box-flex: 1;
        -ms-flex: auto;
            flex: auto;
  }
  .Header-secondaryContainer {
    position: absolute;
    background: #fff;
    z-index: 999;
    width: 100%;
    box-shadow: 0px 18px 15px -20px rgba(0, 0, 0, 0.55);
    -webkit-box-shadow: 0px 18px 15px -20px rgba(0, 0, 0, 0.25);
    -moz-box-shadow: 0px 18px 15px -20px rgba(0, 0, 0, 0.25);
    -o-box-shadow: 0px 18px 15px -20px rgba(0, 0, 0, 0.25);
  }
  .Header-secondaryNav {
    max-width: 1605px;
    width: 100%;
    padding: 20px 3.125em 0;
    margin: 0 auto;
    -webkit-transition: 0.3s opacity ease;
    -o-transition: 0.3s opacity ease;
    transition: 0.3s opacity ease;
    opacity: 0;
  }
  .Header-secondaryNav.is-active {
    opacity: 1;
  }
  .Header-secondaryNav a {
    font-weight: bold;
  }
  .Header-secondaryNav a:hover {
    text-decoration: none !important;
    color: grey;
  }
  .Header-secondaryNav a.is-active {
    border-bottom: 4px solid #009fdf;
    padding-bottom: 2px;
  }
  .Header-secondaryNav h6 {
    font-weight: normal;
  }
  .Header-primarySearch,
  .Toolbar-language {
    cursor: pointer;
  }
}
/*#

Component for containing the entire page. Useful for setting page wide styling.  
It also has a .Page-container that is used for containing the site within the max-width.

*/
.Page {
  padding: 0;
}
.Page.is-active {
  overflow: hidden;
  position: fixed;
  width: 100%;
}
.Page.Page--WhiteBg {
  background-color: white;
}
.Page-container {
  max-width: 1605px;
  margin-left: auto;
  margin-right: auto;
  background-color: #ffffff;
}
.Page-container.Page-container--small {
  max-width: 1200px;
}
.Page-container.Page-container--spacing {
  margin-bottom: 4em;
  padding-top: 0;
}
@media only screen and (min-width: 57.5em), print {
  .Page-container.Page-container--spacing {
    margin-bottom: 5em;
    padding-top: 5em;
    padding-bottom: 3em;
  }
}
.Page-container.Page-container--fullwidth {
  max-width: 100%;
}
.Page-main {
  padding: 0 1.25em;
  padding-top: 90px;
  background: #fff;
}
@media only screen and (max-width: 26.25em), print {
  .Page-main {
    padding-top: 65px;
  }
}
@media only screen and (min-width: 48em), print {
  .Page-main {
    background: transparent;
    padding: 0;
  }
  .Page-main.is-active {
    opacity: 0.3 !important;
  }
  .Page-main.is-active::before {
    display: block;
    content: "";
    position: fixed;
    top: 0;
    height: 100%;
    width: 100%;
    z-index: 999;
  }
}
/*Used outside of Page-container to flow wide*/
.Page-section {
  width: 100%;
  max-width: 1605px;
  margin-left: auto;
  margin-right: auto;
}
@media only screen and (min-width: 48em), print {
  .Page-main {
    padding-top: 0;
  }
  .Header-primary .Page-container {
    padding: 0;
  }
  .Page-container {
    padding: 1.25em 3.125em;
  }
  .Page-container.Page-container--noPadding {
    padding: 0;
  }
  .Page-container.Page-container--noBg {
    background-color: transparent;
  }
  .Page-container.Page-container--White {
    background-color: #fff;
  }
  .Page-container.Page-container--Blue {
    background-color: #009fdf;
  }
  .Page-container.Page-container--DarkBlue {
    background-color: #002d72;
  }
  .Page-container.Page-container--Purple {
    background-color: #7a4183;
  }
  .Page-container.Page-container--Green {
    background-color: #78be20;
  }
}

/*# sourceMappingURL=app.css.map */
