@charset "UTF-8";
/* ----- Imports ----- */
/*! normalize.css v7.0.0 | MIT License | github.com/necolas/normalize.css */
/* Document
   ========================================================================== */
/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in
 *    IE on Windows Phone and in iOS.
 */
html {
  line-height: 1.15;
  /* 1 */
  -ms-text-size-adjust: 100%;
  /* 2 */
  -webkit-text-size-adjust: 100%;
  /* 2 */
}

/* Sections
   ========================================================================== */
/**
 * Remove the margin in all browsers (opinionated).
 */
body {
  margin: 0;
}

/**
 * Add the correct display in IE 9-.
 */
article,
aside,
footer,
header,
nav,
section {
  display: block;
}

/**
 * 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;
}

/* Grouping content
   ========================================================================== */
/**
 * Add the correct display in IE 9-.
 * 1. Add the correct display in IE.
 */
figcaption,
figure,
main {
  /* 1 */
  display: block;
}

/**
 * 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 {
  box-sizing: content-box;
  /* 1 */
  height: 0;
  /* 1 */
  overflow: visible;
  /* 2 */
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
pre {
  font-family: monospace, monospace;
  /* 1 */
  font-size: 1em;
  /* 2 */
}

/* Text-level semantics
   ========================================================================== */
/**
 * 1. Remove the gray background on active links in IE 10.
 * 2. Remove gaps in links underline in iOS 8+ and Safari 8+.
 */
a {
  background-color: transparent;
  /* 1 */
  -webkit-text-decoration-skip: objects;
  /* 2 */
}

/**
 * 1. Remove the bottom border in Chrome 57- and 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 */
  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;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
code,
kbd,
samp {
  font-family: monospace, monospace;
  /* 1 */
  font-size: 1em;
  /* 2 */
}

/**
 * Add the correct font style in Android 4.3-.
 */
dfn {
  font-style: italic;
}

/**
 * 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
   ========================================================================== */
/**
 * Add the correct display in IE 9-.
 */
audio,
video {
  display: inline-block;
}

/**
 * Add the correct display in iOS 4-7.
 */
audio:not([controls]) {
  display: none;
  height: 0;
}

/**
 * Remove the border on images inside links in IE 10-.
 */
img {
  border-style: none;
}

/**
 * Hide the overflow in IE.
 */
svg:not(:root) {
  overflow: hidden;
}

/* Forms
   ========================================================================== */
/**
 * 1. Change the font styles in all browsers (opinionated).
 * 2. Remove the margin in Firefox and Safari.
 */
button,
input,
optgroup,
select,
textarea {
  font-family: sans-serif;
  /* 1 */
  font-size: 100%;
  /* 1 */
  line-height: 1.15;
  /* 1 */
  margin: 0;
  /* 2 */
}

/**
 * Show the overflow in IE.
 * 1. Show the overflow in Edge.
 */
button,
input {
  /* 1 */
  overflow: visible;
}

/**
 * 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;
}

/**
 * 1. Prevent a WebKit bug where (2) destroys native `audio` and `video`
 *    controls in Android 4.
 * 2. Correct the inability to style clickable types in iOS and Safari.
 */
button,
html [type="button"],
[type="reset"],
[type="submit"] {
  -webkit-appearance: button;
  /* 2 */
}

/**
 * Remove the inner border and padding in Firefox.
 */
button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
  border-style: none;
  padding: 0;
}

/**
 * Restore the focus styles unset by the previous rule.
 */
button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
  outline: 1px dotted ButtonText;
}

/**
 * Correct the padding in Firefox.
 */
fieldset {
  padding: 0.35em 0.75em 0.625em;
}

/**
 * 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 {
  box-sizing: border-box;
  /* 1 */
  color: inherit;
  /* 2 */
  display: table;
  /* 1 */
  max-width: 100%;
  /* 1 */
  padding: 0;
  /* 3 */
  white-space: normal;
  /* 1 */
}

/**
 * 1. Add the correct display in IE 9-.
 * 2. Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */
progress {
  display: inline-block;
  /* 1 */
  vertical-align: baseline;
  /* 2 */
}

/**
 * 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"] {
  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;
}

/**
 * 1. Correct the odd appearance in Chrome and Safari.
 * 2. Correct the outline style in Safari.
 */
[type="search"] {
  -webkit-appearance: textfield;
  /* 1 */
  outline-offset: -2px;
  /* 2 */
}

/**
 * Remove the inner padding and cancel buttons in Chrome and Safari on macOS.
 */
[type="search"]::-webkit-search-cancel-button,
[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}

/**
 * 1. Correct the inability to style clickable types in iOS and Safari.
 * 2. Change font properties to `inherit` in Safari.
 */
::-webkit-file-upload-button {
  -webkit-appearance: button;
  /* 1 */
  font: inherit;
  /* 2 */
}

/* Interactive
   ========================================================================== */
/*
 * Add the correct display in IE 9-.
 * 1. Add the correct display in Edge, IE, and Firefox.
 */
details,
menu {
  display: block;
}

/*
 * Add the correct display in all browsers.
 */
summary {
  display: list-item;
}

/* Scripting
   ========================================================================== */
/**
 * Add the correct display in IE 9-.
 */
canvas {
  display: inline-block;
}

/**
 * Add the correct display in IE.
 */
template {
  display: none;
}

/* Hidden
   ========================================================================== */
/**
 * Add the correct display in IE 10-.
 */
[hidden] {
  display: none;
}

/* ----- Scale ----- */
/* ----- Colors ----- */
/* ----- Font-family ----- */
/* ----- Font-size ----- */
/* ----- Layout ----- */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video,
input, textarea, select {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  vertical-align: baseline;
  border-radius: 0;
}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block;
}

html, body {
  width: 100%;
  height: 100%;
  overflow-x: hidden;
}
/*  added by jvl 29-01-2019    */
#largeview 
{
    border: 1px solid #969B94;
    /*background: #000000;*/
    width:67%; /*width: 800px;*/
    height:auto; /*height: 600px;  */
    position: absolute;
    left: 200px; 
    top: 10px; /*top: 68px; */
	z-index:998; /* added  */
}
#largeview  img
{
    top: 20%;
	width:100%; 
    height:auto; 
}

@media (max-width: 400px) {
	#largeview {
		width:90%; /*width: 800px;*/
		left: 10px; 
		top: 25px; /*top: 68px; */
	}
}
@media (min-width: 401px) and (max-width: 670px) {
	#largeview {
		width:70%; /*width: 800px;*/
		left: 15%; 
		top: 25px; /*top: 68px; */
	}
}

/*    tilføjet jvl 03-08-2018 husk Andreas*/

.errorLinkTopLeftStyle  {
	top:-40px; 
	left: calc(100% - 32px); 
	transform: translateX(-100%);
}
/*    tilføjet jvl 25-06-2019  */
@media (max-width: 400px) {
	.errorLinkTopLeftStyle-belowTablet  {
		left: calc(100% - 1px); 
	}
}

.rightAnswersPercentHolder{
	line-height: 0.9;
}

.forceLowerCase {
	text-transform: lowercase !important;
}

/*    slut tilføjet jvl 03-08-2018 */
html::-webkit-scrollbar, body::-webkit-scrollbar {
  width: 4px;
}

html::-webkit-scrollbar-track, body::-webkit-scrollbar-track {
  background: #f4f4f7;
}

html::-webkit-scrollbar-thumb, body::-webkit-scrollbar-thumb {
  background: #454a73;
}

html {
  box-sizing: border-box;
  -webkit-tap-highlight-color: transparent;
}

*,
*:before,
*:after {
  box-sizing: inherit;
}

.padding-top-8-1 {
  padding-top: 128px !important;
}

.padding-top-7-1 {
  padding-top: 112px !important;
}

.padding-top-6-1 {
  padding-top: 96px !important;
}

.padding-top-5-1 {
  padding-top: 80px !important;
}

.padding-top-4-1 {
  padding-top: 64px !important;
}

.padding-top-3-1 {
  padding-top: 48px !important;
}

.padding-top-2-1 {
  padding-top: 32px !important;
}

.padding-top-1-1 {  /* added (changed) by jvl after intro */
  padding-top: 24px !important;
}

.padding-top {
  padding-top: 16px !important;
}

.padding-top-1-2 {
  padding-top: 8px !important;
}

.padding-top-1-3 {
  padding-top: 5.3333333333px !important;
}

.padding-top-1-4 {
  padding-top: 4px !important;
}

.padding-top-1-5 {
  padding-top: 3.2px !important;
}

.padding-top-1-6 {
  padding-top: 2.6666666667px !important;
}

.padding-top-1-7 {
  padding-top: 2.2857142857px !important;
}

.padding-top-1-8 {
  padding-top: 2px !important;
}

.padding-right-8-1 {
  padding-right: 128px !important;
}

.padding-right-7-1 {
  padding-right: 112px !important;
}

.padding-right-6-1 {
  padding-right: 96px !important;
}

.padding-right-5-1 {
  padding-right: 80px !important;
}

.padding-right-4-1 {
  padding-right: 64px !important;
}

.padding-right-3-1 {
  padding-right: 48px !important;
}

.padding-right-2-1 {
  padding-right: 32px !important;
}

.padding-right {
  padding-right: 16px !important;
}

.padding-right-1-2 {
  padding-right: 8px !important;
}

.padding-right-1-3 {
  padding-right: 5.3333333333px !important;
}

.padding-right-1-4 {
  padding-right: 4px !important;
}

.padding-right-1-5 {
  padding-right: 3.2px !important;
}

.padding-right-1-6 {
  padding-right: 2.6666666667px !important;
}

.padding-right-1-7 {
  padding-right: 2.2857142857px !important;
}

.padding-right-1-8 {
  padding-right: 2px !important;
}

.padding-bottom-8-1 {
  padding-bottom: 128px !important;
}

.padding-bottom-7-1 {
  padding-bottom: 112px !important;
}

.padding-bottom-6-1 {
  padding-bottom: 96px !important;
}

.padding-bottom-5-1 {
  padding-bottom: 80px !important;
}

.padding-bottom-4-1 {
  padding-bottom: 64px !important;
}

.padding-bottom-3-1 {
  padding-bottom: 48px !important;
}

.padding-bottom-2-1 {
  padding-bottom: 32px !important;
}

.padding-bottom-1-1 {  /* added by jvl after intro  */
  padding-bottom: 24px !important;
}

.padding-bottom {
  padding-bottom: 16px !important;
}

.padding-bottom-1-2 {
  padding-bottom: 8px !important;
}

.padding-bottom-1-3 {
  padding-bottom: 5.3333333333px !important;
}

.padding-bottom-1-4 {
  padding-bottom: 4px !important;
}

.padding-bottom-1-5 {
  padding-bottom: 3.2px !important;
}

.padding-bottom-1-6 {
  padding-bottom: 2.6666666667px !important;
}

.padding-bottom-1-7 {
  padding-bottom: 2.2857142857px !important;
}

.padding-bottom-1-8 {
  padding-bottom: 2px !important;
}

.padding-left-8-1 {
  padding-left: 128px !important;
}

.padding-left-7-1 {
  padding-left: 112px !important;
}

.padding-left-6-1 {
  padding-left: 96px !important;
}

.padding-left-5-1 {
  padding-left: 80px !important;
}

.padding-left-4-1 {
  padding-left: 64px !important;
}

.padding-left-3-1 {
  padding-left: 48px !important;
}

.padding-left-2-1 {
  padding-left: 32px !important;
}

.padding-left {
  padding-left: 16px !important;
}

.padding-left-1-2 {
  padding-left: 8px !important;
}

.padding-left-1-3 {
  padding-left: 5.3333333333px !important;
}

.padding-left-1-4 {
  padding-left: 4px !important;
}

.padding-left-1-5 {
  padding-left: 3.2px !important;
}

.padding-left-1-6 {
  padding-left: 2.6666666667px !important;
}

.padding-left-1-7 {
  padding-left: 2.2857142857px !important;
}

.padding-left-1-8 {
  padding-left: 2px !important;
}

.padding-8-1 {
  padding: 128px !important;
}

.padding-7-1 {
  padding: 112px !important;
}

.padding-6-1 {
  padding: 96px !important;
}

.padding-5-1 {
  padding: 80px !important;
}

.padding-4-1 {
  padding: 64px !important;
}

.padding-3-1 {
  padding: 48px !important;
}

.padding-2-1 {
  padding: 32px !important;
}

.padding {
  padding: 16px !important;
}

.padding-1-2 {
  padding: 8px !important;
}

.padding-1-3 {
  padding: 5.3333333333px !important;
}

.padding-1-4 {
  padding: 4px !important;
}

.padding-1-5 {
  padding: 3.2px !important;
}

.padding-1-6 {
  padding: 2.6666666667px !important;
}

.padding-1-7 {
  padding: 2.2857142857px !important;
}

.padding-1-8 {
  padding: 2px !important;
}

@media (max-width: 767px) {
  .padding-top-8-1-belowTablet {
    padding-top: 128px !important;
  }
}

@media (max-width: 767px) {
  .padding-top-7-1-belowTablet {
    padding-top: 112px !important;
  }
}

@media (max-width: 767px) {
  .padding-top-6-1-belowTablet {
    padding-top: 96px !important;
  }
}

@media (max-width: 767px) {
  .padding-top-5-1-belowTablet {
    padding-top: 80px !important;
  }
}

@media (max-width: 767px) {
  .padding-top-4-1-belowTablet {
    padding-top: 64px !important;
  }
}

@media (max-width: 767px) {
  .padding-top-3-1-belowTablet {
    padding-top: 48px !important;
  }
}

@media (max-width: 767px) {
  .padding-top-2-1-belowTablet {
    padding-top: 16px !important;  /*  padding-top: 32px !important;  */  /* changed by jvl  */
  }
}

@media (max-width: 767px) {
  .padding-top-belowTablet {
    padding-top: 16px !important;
  }
}

@media (max-width: 767px) {
  .padding-top-1-2-belowTablet {
    padding-top: 8px !important;
  }
}

@media (max-width: 767px) {
  .padding-top-1-3-belowTablet {
    padding-top: 5.3333333333px !important;
  }
}

@media (max-width: 767px) {
  .padding-top-1-4-belowTablet {
    padding-top: 4px !important;
  }
}

@media (max-width: 767px) {
  .padding-top-1-5-belowTablet {
    padding-top: 3.2px !important;
  }
}

@media (max-width: 767px) {
  .padding-top-1-6-belowTablet {
    padding-top: 2.6666666667px !important;
  }
}

@media (max-width: 767px) {
  .padding-top-1-7-belowTablet {
    padding-top: 2.2857142857px !important;
  }
}

@media (max-width: 767px) {
  .padding-top-1-8-belowTablet {
    padding-top: 2px !important;
  }
}

@media (max-width: 767px) {
  .padding-right-8-1-belowTablet {
    padding-right: 128px !important;
  }
}

@media (max-width: 767px) {
  .padding-right-7-1-belowTablet {
    padding-right: 112px !important;
  }
}

@media (max-width: 767px) {
  .padding-right-6-1-belowTablet {
    padding-right: 96px !important;
  }
}

@media (max-width: 767px) {
  .padding-right-5-1-belowTablet {
    padding-right: 80px !important;
  }
}

@media (max-width: 767px) {
  .padding-right-4-1-belowTablet {
    padding-right: 64px !important;
  }
}

@media (max-width: 767px) {
  .padding-right-3-1-belowTablet {
    padding-right: 48px !important;
  }
}

@media (max-width: 767px) {
  .padding-right-2-1-belowTablet {
    padding-right: 16px !important;   /* padding-right: 32px !important;  */  /* changed by jvl  */
  }
}

@media (max-width: 767px) {
  .padding-right-belowTablet {
    padding-right: 16px !important;
  }
}

@media (max-width: 767px) {
  .padding-right-1-2-belowTablet {
    padding-right: 8px !important;
  }
}

@media (max-width: 767px) {
  .padding-right-1-3-belowTablet {
    padding-right: 5.3333333333px !important;
  }
}

@media (max-width: 767px) {
  .padding-right-1-4-belowTablet {
    padding-right: 4px !important;
  }
}

@media (max-width: 767px) {
  .padding-right-1-5-belowTablet {
    padding-right: 3.2px !important;
  }
}

@media (max-width: 767px) {
  .padding-right-1-6-belowTablet {
    padding-right: 2.6666666667px !important;
  }
}

@media (max-width: 767px) {
  .padding-right-1-7-belowTablet {
    padding-right: 2.2857142857px !important;
  }
}

@media (max-width: 767px) {
  .padding-right-1-8-belowTablet {
    padding-right: 2px !important;
  }
}

@media (max-width: 767px) {
  .padding-bottom-8-1-belowTablet {
    padding-bottom: 128px !important;
  }
}

@media (max-width: 767px) {
  .padding-bottom-7-1-belowTablet {
    padding-bottom: 112px !important;
  }
}

@media (max-width: 767px) {
  .padding-bottom-6-1-belowTablet {
    padding-bottom: 96px !important;
  }
}

@media (max-width: 767px) {
  .padding-bottom-5-1-belowTablet {
    padding-bottom: 80px !important;
  }
}

@media (max-width: 767px) {
  .padding-bottom-4-1-belowTablet {
    padding-bottom: 64px !important;
  }
}

@media (max-width: 767px) {
  .padding-bottom-3-1-belowTablet {
    padding-bottom: 48px !important;
  }
}

@media (max-width: 767px) {
  .padding-bottom-2-1-belowTablet {
    padding-bottom: 16px !important;   /*  padding-bottom: 32px !important;   /*  /* changed by jvl  */
  }
}

@media (max-width: 767px) {
  .padding-bottom-belowTablet {
    padding-bottom: 16px !important;
  }
}

@media (max-width: 767px) {
  .padding-bottom-1-2-belowTablet {
    padding-bottom: 8px !important;
  }
}

@media (max-width: 767px) {
  .padding-bottom-1-3-belowTablet {
    padding-bottom: 5.3333333333px !important;
  }
}

@media (max-width: 767px) {
  .padding-bottom-1-4-belowTablet {
    padding-bottom: 4px !important;
  }
}

@media (max-width: 767px) {
  .padding-bottom-1-5-belowTablet {
    padding-bottom: 3.2px !important;
  }
}

@media (max-width: 767px) {
  .padding-bottom-1-6-belowTablet {
    padding-bottom: 2.6666666667px !important;
  }
}

@media (max-width: 767px) {
  .padding-bottom-1-7-belowTablet {
    padding-bottom: 2.2857142857px !important;
  }
}

@media (max-width: 767px) {
  .padding-bottom-1-8-belowTablet {
    padding-bottom: 2px !important;
  }
}

@media (max-width: 767px) {
  .padding-left-8-1-belowTablet {
    padding-left: 128px !important;
  }
}

@media (max-width: 767px) {
  .padding-left-7-1-belowTablet {
    padding-left: 112px !important;
  }
}

@media (max-width: 767px) {
  .padding-left-6-1-belowTablet {
    padding-left: 96px !important;
  }
}

@media (max-width: 767px) {
  .padding-left-5-1-belowTablet {
    padding-left: 80px !important;
  }
}

@media (max-width: 767px) {
  .padding-left-4-1-belowTablet {
    padding-left: 64px !important;
  }
}

@media (max-width: 767px) {
  .padding-left-3-1-belowTablet {
    padding-left: 48px !important;
  }
}

@media (max-width: 767px) {
  .padding-left-2-1-belowTablet {
    padding-left: 16px !important;   /* padding-left: 32px !important;  */  /* changed by jvl  */
  }
}

@media (max-width: 767px) {
  .padding-left-belowTablet {
    padding-left: 16px !important;
  }
}

@media (max-width: 767px) {
  .padding-left-1-2-belowTablet {
    padding-left: 8px !important;
  }
}

@media (max-width: 767px) {
  .padding-left-1-3-belowTablet {
    padding-left: 5.3333333333px !important;
  }
}

@media (max-width: 767px) {
  .padding-left-1-4-belowTablet {
    padding-left: 4px !important;
  }
}

@media (max-width: 767px) {
  .padding-left-1-5-belowTablet {
    padding-left: 3.2px !important;
  }
}

@media (max-width: 767px) {
  .padding-left-1-6-belowTablet {
    padding-left: 2.6666666667px !important;
  }
}

@media (max-width: 767px) {
  .padding-left-1-7-belowTablet {
    padding-left: 2.2857142857px !important;
  }
}

@media (max-width: 767px) {
  .padding-left-1-8-belowTablet {
    padding-left: 2px !important;
  }
}

@media (max-width: 767px) {
  .padding-8-1-belowTablet {
    padding: 128px !important;
  }
}

@media (max-width: 767px) {
  .padding-7-1-belowTablet {
    padding: 112px !important;
  }
}

@media (max-width: 767px) {
  .padding-6-1-belowTablet {
    padding: 96px !important;
  }
}

@media (max-width: 767px) {
  .padding-5-1-belowTablet {
    padding: 80px !important;
  }
}

@media (max-width: 767px) {
  .padding-4-1-belowTablet {
    padding: 64px !important;
  }
}

@media (max-width: 767px) {
  .padding-3-1-belowTablet {
    padding: 48px !important;
  }
}

@media (max-width: 767px) {
  .padding-2-1-belowTablet {
    padding: 32px !important;
  }
}

@media (max-width: 767px) {
  .padding-belowTablet {
    padding: 16px !important;
  }
}

@media (max-width: 767px) {
  .padding-1-2-belowTablet {
    padding: 8px !important;
  }
}

@media (max-width: 767px) {
  .padding-1-3-belowTablet {
    padding: 5.3333333333px !important;
  }
}

@media (max-width: 767px) {
  .padding-1-4-belowTablet {
    padding: 4px !important;
  }
}

@media (max-width: 767px) {
  .padding-1-5-belowTablet {
    padding: 3.2px !important;
  }
}

@media (max-width: 767px) {
  .padding-1-6-belowTablet {
    padding: 2.6666666667px !important;
  }
}

@media (max-width: 767px) {
  .padding-1-7-belowTablet {
    padding: 2.2857142857px !important;
  }
}

@media (max-width: 767px) {
  .padding-1-8-belowTablet {
    padding: 2px !important;
  }
}

.padding-none {
  padding: 0 !important;
}

.padding-none-top {
  padding-top: 0 !important;
}

.padding-none-bottom {
  padding-bottom: 0 !important;
}

.margin-top-8-1 {
  margin-top: 128px !important;
}

.margin-top-7-1 {
  margin-top: 112px !important;
}

.margin-top-6-1 {
  margin-top: 96px !important;
}

.margin-top-5-1 {
  margin-top: 80px !important;
}

.margin-top-4-1 {
  margin-top: 64px !important;
}

.margin-top-3-1 {
  margin-top: 48px !important;
}

.margin-top-2-1 {
  margin-top: 32px !important;
}

.margin-top {
  margin-top: 16px !important;
}

@media (max-width: 1024px) {
  .margin-top-desktop {
    margin-top: 16px !important;
  }
}

.margin-top-1-2 {
  margin-top: 8px !important;
}

.margin-top-1-3 {
  margin-top: 5.3333333333px !important;
}

.margin-top-1-4 {
  margin-top: 4px !important;
}

.margin-top-1-5 {
  margin-top: 3.2px !important;
}

.margin-top-1-6 {
  margin-top: 2.6666666667px !important;
}

.margin-top-1-7 {
  margin-top: 2.2857142857px !important;
}

.margin-top-1-8 {
  margin-top: 2px !important;
}

.margin-right-8-1 {
  margin-right: 128px !important;
}

.margin-right-7-1 {
  margin-right: 112px !important;
}

.margin-right-6-1 {
  margin-right: 96px !important;
}

.margin-right-5-1 {
  margin-right: 80px !important;
}

.margin-right-4-1 {
  margin-right: 64px !important;
}

.margin-right-3-1 {
  margin-right: 48px !important;
}

.margin-right-2-1 {
  margin-right: 32px !important;
}

.margin-right {
  margin-right: 16px !important;
}

@media (max-width: 1024px) {
  .margin-right-desktop {
    margin-right: 16px !important;
  }
}

.margin-right-1-2 {
  margin-right: 8px !important;
}

.margin-right-1-3 {
  margin-right: 5.3333333333px !important;
}

.margin-right-1-4 {
  margin-right: 4px !important;
}

.margin-right-1-5 {
  margin-right: 3.2px !important;
}

.margin-right-1-6 {
  margin-right: 2.6666666667px !important;
}

.margin-right-1-7 {
  margin-right: 2.2857142857px !important;
}

.margin-right-1-8 {
  margin-right: 2px !important;
}

.margin-bottom-8-1 {
  margin-bottom: 128px !important;
}

.margin-bottom-7-1 {
  margin-bottom: 112px !important;
}

.margin-bottom-6-1 {
  margin-bottom: 96px !important;
}

.margin-bottom-5-1 {
  margin-bottom: 80px !important;
}

.margin-bottom-4-1 {
  margin-bottom: 64px !important;
}

.margin-bottom-3-1 {
  margin-bottom: 48px !important;
}

.margin-bottom-2-1 {
  margin-bottom: 32px !important;
}

.margin-bottom {
  margin-bottom: 16px !important;
}

@media (max-width: 1024px) {
  .margin-bottom-desktop {
    margin-bottom: 16px !important;
  }
}

.margin-bottom-1-2 {
  margin-bottom: 8px !important;
}

.margin-bottom-1-3 {
  margin-bottom: 5.3333333333px !important;
}

.margin-bottom-1-4 {
  margin-bottom: 4px !important;
}

.margin-bottom-1-5 {
  margin-bottom: 3.2px !important;
}

.margin-bottom-1-6 {
  margin-bottom: 2.6666666667px !important;
}

.margin-bottom-1-7 {
  margin-bottom: 2.2857142857px !important;
}

.margin-bottom-1-8 {
  margin-bottom: 2px !important;
}

.margin-left-8-1 {
  margin-left: 128px !important;
}

.margin-left-7-1 {
  margin-left: 112px !important;
}

.margin-left-6-1 {
  margin-left: 96px !important;
}

.margin-left-5-1 {
  margin-left: 80px !important;
}

.margin-left-4-1 {
  margin-left: 64px !important;
}

.margin-left-3-1 {
  margin-left: 48px !important;
}

.margin-left-2-1 {
  margin-left: 32px !important;
}

.margin-left {
  margin-left: 16px !important;
}

@media (max-width: 1024px) {
  .margin-left-desktop {
    margin-left: 16px !important;
  }
}

.margin-left-1-2 {
  margin-left: 8px !important;
}

.margin-left-1-3 {
  margin-left: 5.3333333333px !important;
}

.margin-left-1-4 {
  margin-left: 4px !important;
}

.margin-left-1-5 {
  margin-left: 3.2px !important;
}

.margin-left-1-6 {
  margin-left: 2.6666666667px !important;
}

.margin-left-1-7 {
  margin-left: 2.2857142857px !important;
}

.margin-left-1-8 {
  margin-left: 2px !important;
}

.margin-8-1 {
  margin: 128px !important;
}

.margin-7-1 {
  margin: 112px !important;
}

.margin-6-1 {
  margin: 96px !important;
}

.margin-5-1 {
  margin: 80px !important;
}

.margin-4-1 {
  margin: 64px !important;
}

.margin-3-1 {
  margin: 48px !important;
}

.margin-2-1 {
  margin: 32px !important;
}

.margin {
  margin: 16px !important;
}

@media (max-width: 1024px) {
  .margin-desktop {
    margin: 16px !important;
  }
}

.margin-1-2 {
  margin: 8px !important;
}

.margin-1-3 {
  margin: 5.3333333333px !important;
}

.margin-1-4 {
  margin: 4px !important;
}

.margin-1-5 {
  margin: 3.2px !important;
}

.margin-1-6 {
  margin: 2.6666666667px !important;
}

.margin-1-7 {
  margin: 2.2857142857px !important;
}

.margin-1-8 {
  margin: 2px !important;
}

@media (max-width: 767px) {
  .margin-top-8-1-belowTablet {
    margin-top: 128px !important;
  }
}

@media (max-width: 767px) {
  .margin-top-7-1-belowTablet {
    margin-top: 112px !important;
  }
}

@media (max-width: 767px) {
  .margin-top-6-1-belowTablet {
    margin-top: 96px !important;
  }
}

@media (max-width: 767px) {
  .margin-top-5-1-belowTablet {
    margin-top: 80px !important;
  }
}

@media (max-width: 767px) {
  .margin-top-4-1-belowTablet {
    margin-top: 64px !important;
  }
}

@media (max-width: 767px) {
  .margin-top-3-1-belowTablet {
    margin-top: 48px !important;
  }
}

@media (max-width: 767px) {
  .margin-top-2-1-belowTablet {
    margin-top: 32px !important;
  }
}

@media (max-width: 767px) {
  .margin-top-belowTablet {
    margin-top: 16px !important;
  }
}

@media (max-width: 767px) {
  .margin-top-1-2-belowTablet {
    margin-top: 8px !important;
  }
}

@media (max-width: 767px) {
  .margin-top-1-3-belowTablet {
    margin-top: 5.3333333333px !important;
  }
}

@media (max-width: 767px) {
  .margin-top-1-4-belowTablet {
    margin-top: 4px !important;
  }
}

@media (max-width: 767px) {
  .margin-top-1-5-belowTablet {
    margin-top: 3.2px !important;
  }
}

@media (max-width: 767px) {
  .margin-top-1-6-belowTablet {
    margin-top: 2.6666666667px !important;
  }
}

@media (max-width: 767px) {
  .margin-top-1-7-belowTablet {
    margin-top: 2.2857142857px !important;
  }
}

@media (max-width: 767px) {
  .margin-top-1-8-belowTablet {
    margin-top: 2px !important;
  }
}

@media (max-width: 767px) {
  .margin-right-8-1-belowTablet {
    margin-right: 128px !important;
  }
}

@media (max-width: 767px) {
  .margin-right-7-1-belowTablet {
    margin-right: 112px !important;
  }
}

@media (max-width: 767px) {
  .margin-right-6-1-belowTablet {
    margin-right: 96px !important;
  }
}

@media (max-width: 767px) {
  .margin-right-5-1-belowTablet {
    margin-right: 80px !important;
  }
}

@media (max-width: 767px) {
  .margin-right-4-1-belowTablet {
    margin-right: 64px !important;
  }
}

@media (max-width: 767px) {
  .margin-right-3-1-belowTablet {
    margin-right: 48px !important;
  }
}

@media (max-width: 767px) {
  .margin-right-2-1-belowTablet {
    margin-right: 32px !important;
  }
}

@media (max-width: 767px) {
  .margin-right-belowTablet {
    margin-right: 16px !important;
  }
}

@media (max-width: 767px) {
  .margin-right-1-2-belowTablet {
    margin-right: 8px !important;
  }
}

@media (max-width: 767px) {
  .margin-right-1-3-belowTablet {
    margin-right: 5.3333333333px !important;
  }
}

@media (max-width: 767px) {
  .margin-right-1-4-belowTablet {
    margin-right: 4px !important;
  }
}

@media (max-width: 767px) {
  .margin-right-1-5-belowTablet {
    margin-right: 3.2px !important;
  }
}

@media (max-width: 767px) {
  .margin-right-1-6-belowTablet {
    margin-right: 2.6666666667px !important;
  }
}

@media (max-width: 767px) {
  .margin-right-1-7-belowTablet {
    margin-right: 2.2857142857px !important;
  }
}

@media (max-width: 767px) {
  .margin-right-1-8-belowTablet {
    margin-right: 2px !important;
  }
}

@media (max-width: 767px) {
  .margin-bottom-8-1-belowTablet {
    margin-bottom: 128px !important;
  }
}

@media (max-width: 767px) {
  .margin-bottom-7-1-belowTablet {
    margin-bottom: 112px !important;
  }
}

@media (max-width: 767px) {
  .margin-bottom-6-1-belowTablet {
    margin-bottom: 96px !important;
  }
}

@media (max-width: 767px) {
  .margin-bottom-5-1-belowTablet {
    margin-bottom: 80px !important;
  }
}

@media (max-width: 767px) {
  .margin-bottom-4-1-belowTablet {
    margin-bottom: 64px !important;
  }
}

@media (max-width: 767px) {
  .margin-bottom-3-1-belowTablet {
    margin-bottom: 48px !important;
  }
}

@media (max-width: 767px) {
  .margin-bottom-2-1-belowTablet {
    margin-bottom: 32px !important;
  }
}

@media (max-width: 767px) {
  .margin-bottom-belowTablet {
    margin-bottom: 16px !important;
  }
}

@media (max-width: 767px) {
  .margin-bottom-1-2-belowTablet {
    margin-bottom: 8px !important;
  }
}

@media (max-width: 767px) {
  .margin-bottom-1-3-belowTablet {
    margin-bottom: 5.3333333333px !important;
  }
}

@media (max-width: 767px) {
  .margin-bottom-1-4-belowTablet {
    margin-bottom: 4px !important;
  }
}

@media (max-width: 767px) {
  .margin-bottom-1-5-belowTablet {
    margin-bottom: 3.2px !important;
  }
}

@media (max-width: 767px) {
  .margin-bottom-1-6-belowTablet {
    margin-bottom: 2.6666666667px !important;
  }
}

@media (max-width: 767px) {
  .margin-bottom-1-7-belowTablet {
    margin-bottom: 2.2857142857px !important;
  }
}

@media (max-width: 767px) {
  .margin-bottom-1-8-belowTablet {
    margin-bottom: 2px !important;
  }
}

@media (max-width: 767px) {
  .margin-left-8-1-belowTablet {
    margin-left: 128px !important;
  }
}

@media (max-width: 767px) {
  .margin-left-7-1-belowTablet {
    margin-left: 112px !important;
  }
}

@media (max-width: 767px) {
  .margin-left-6-1-belowTablet {
    margin-left: 96px !important;
  }
}

@media (max-width: 767px) {
  .margin-left-5-1-belowTablet {
    margin-left: 80px !important;
  }
}

@media (max-width: 767px) {
  .margin-left-4-1-belowTablet {
    margin-left: 64px !important;
  }
}

@media (max-width: 767px) {
  .margin-left-3-1-belowTablet {
    margin-left: 48px !important;
  }
}

@media (max-width: 767px) {
  .margin-left-2-1-belowTablet {
    margin-left: 32px !important;
  }
}

@media (max-width: 767px) {
  .margin-left-belowTablet {
    margin-left: 16px !important;
  }
}

@media (max-width: 767px) {
  .margin-left-1-2-belowTablet {
    margin-left: 8px !important;
  }
}

@media (max-width: 767px) {
  .margin-left-1-3-belowTablet {
    margin-left: 5.3333333333px !important;
  }
}

@media (max-width: 767px) {
  .margin-left-1-4-belowTablet {
    margin-left: 4px !important;
  }
}

@media (max-width: 767px) {
  .margin-left-1-5-belowTablet {
    margin-left: 3.2px !important;
  }
}

@media (max-width: 767px) {
  .margin-left-1-6-belowTablet {
    margin-left: 2.6666666667px !important;
  }
}

@media (max-width: 767px) {
  .margin-left-1-7-belowTablet {
    margin-left: 2.2857142857px !important;
  }
}

@media (max-width: 767px) {
  .margin-left-1-8-belowTablet {
    margin-left: 2px !important;
  }
}

@media (max-width: 767px) {
  .margin-8-1-belowTablet {
    margin: 128px !important;
  }
}

@media (max-width: 767px) {
  .margin-7-1-belowTablet {
    margin: 112px !important;
  }
}

@media (max-width: 767px) {
  .margin-6-1-belowTablet {
    margin: 96px !important;
  }
}

@media (max-width: 767px) {
  .margin-5-1-belowTablet {
    margin: 80px !important;
  }
}

@media (max-width: 767px) {
  .margin-4-1-belowTablet {
    margin: 64px !important;
  }
}

@media (max-width: 767px) {
  .margin-3-1-belowTablet {
    margin: 48px !important;
  }
}

@media (max-width: 767px) {
  .margin-2-1-belowTablet {
    margin: 32px !important;
  }
}

@media (max-width: 767px) {
  .margin-belowTablet {
    margin: 16px !important;
  }
}

@media (max-width: 767px) {
  .margin-1-2-belowTablet {
    margin: 8px !important;
  }
}

@media (max-width: 767px) {
  .margin-1-3-belowTablet {
    margin: 5.3333333333px !important;
  }
}

@media (max-width: 767px) {
  .margin-1-4-belowTablet {
    margin: 4px !important;
  }
}

@media (max-width: 767px) {
  .margin-1-5-belowTablet {
    margin: 3.2px !important;
  }
}

@media (max-width: 767px) {
  .margin-1-6-belowTablet {
    margin: 2.6666666667px !important;
  }
}

@media (max-width: 767px) {
  .margin-1-7-belowTablet {
    margin: 2.2857142857px !important;
  }
}

@media (max-width: 767px) {
  .margin-1-8-belowTablet {
    margin: 2px !important;
  }
}

.margin-none {
  margin: 0 !important;
}

.margin-none-top {
  margin-top: 0 !important;
}

.margin-none-bottom {
  margin-bottom: 0 !important;
}

@media (max-width: 1024px) {
  .margin-none-desktop {
    margin: 0 !important;
  }
}

.fontSize-display {
  font-size: 140px;
}

.fontSize-xxxlarge {
  font-size: 36px;
}

.fontSize-xxlarge {
  font-size: 24px;
}

.fontSize-xlarge {
  font-size: 18px;
}

@media (max-width: 767px) {
  .fontSize-xlarge-belowTablet {
    font-size: 18px;
  }
}

.fontSize-large {
  font-size: 16px;
}

.fontSize-base {
  font-size: 14px;
}

.fontSize-small {
  font-size: 12px;
}

.fontSize-xsmall {
  font-size: 11px;
}

.fontSize-xxsmall {
  font-size: 10px;
}

.fontFamily-system {
  font-family: "Roboto", "Helvetica Neue", sans-serif !important;
}

.fontWeight-bold {
  font-weight: 600 !important;
}

.textTransform-uppercase {
  text-transform: uppercase;
}

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

.textAlign-left{   /* added by jvl after intro  */
  text-align: left;
}

.letterSpacing {
  letter-spacing: 0.4px;
}

.color-primary {
  color: #00c878 !important;
}

.color-dismiss {
  color: #ff3c32 !important;
}

.color-base {
  color: #454a73 !important;
}

.color-base-lighter-1 {
  color: #616588;
}

.color-base-lighter-2 {
  color: #7d809d;
}

.color-base-lighter-3 {
  color: #a2a5b9;
}

.color-base-lighter-4 {
  color: #c7c9d5;
}

.color-base-lighter-5 {
  color: #dadbe3;
}

.color-base-lighter-6 {
  color: #e9e9ee;
}

.color-base-lighter-7 {
  color: #f4f4f7;
}

.display-none {
  display: none !important;
}
/* added classes by jvl   */
.visibility-hidden { 
    visibility: hidden;
}

.visibility-visible {
	visibility: visible;
}
/* end of added classes by jvl  */

@media (max-width: 767px) {
  .display-none-belowTablet {
    display: none !important;
  }
}

/*   new class jvl 22-08-2018   */
@media (max-width: 1024px) {
  .display-none-belowDesktop {
    display: none !important;
  }
}
/* end of new class  22-08-2018   */

.display-flex {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

@media (min-width: 481px) {
  .display-flex-aboveMobile {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
}

.display-block {
  display: block;
}

.display-inlineBlock {
  display: inline-block;
}

.opacity-0 {
  opacity: 0;
}

/*  added by jvl   */
.opacity-two-thirds{   /* Added  JVL 29-01-2021  */
  opacity: 0.666;
}
.opacity-half {
  opacity: 0.5;
}
.opacity-third {
  opacity: 0.333;
}
.opacity-forth {
  opacity: 0.25;
}
.opacity-tenth {
  opacity: 0.10;
}
/* end of added by jvl  */

.justifyContent-center {
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.justifyContent-spaceBetween {
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.justifyContent-spaceAround {
  -ms-flex-pack: distribute;
      justify-content: space-around;
}

.alignItems-flexEnd {
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
}

.alignItems-center {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.flexWrap {
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}

.flexDirection-columnReverse {
  -webkit-box-orient: vertical;
  -webkit-box-direction: reverse;
      -ms-flex-direction: column-reverse;
          flex-direction: column-reverse;
}

@media (max-width: 840px) {
  .flexDirection-columnReverse-belowDesktop {
    -webkit-box-orient: vertical;
    -webkit-box-direction: reverse;
        -ms-flex-direction: column-reverse;
            flex-direction: column-reverse;
  }
}

.float-left {
  float: left;
}

.float-right {
  float: right;
}

.width-full {
  width: 100%;
}

@media (max-width: 1024px) {
  .width-fill-right, .box-coursesAndTests, .image-coursesAndTests {
    width: calc( 100% + 64px) !important;
  }
}

@media (max-width: 840px) {
  .width-fill-right, .box-coursesAndTests, .image-coursesAndTests {
    width: calc( 100% + 64px) !important;
    margin-left: -96px !important;
    margin-right: 0 !important;
  }
}

@media (max-width: 767px) {
  .width-fill-right, .box-coursesAndTests, .image-coursesAndTests {
    width: calc( 100% + 128px) !important;
    margin-left: -32px !important;
    margin-right: 0 !important;
  }
}

@media (min-width: 1025px) {
  .width-fill-right, .box-coursesAndTests, .image-coursesAndTests {
    width: calc( 100% + 128px) !important;
  }
}

@media (min-width: 1600px) {
  .width-fill-right, .box-coursesAndTests, .image-coursesAndTests {
    width: auto !important;
  }
}

.height-full {
  height: 100%;
}

.backgroundColor-white {
  background-color: white;
}

.backgroundColor-primary {
  background-color: #00c878;
}

.backgroundColor-base {
  background-color: #454a73;
}

.backgroundColor-base-lighter {
  background-color: #f4f4f7;
}

.background-pattern:after {
  content: '';
  position: absolute;
  bottom: 0;
  right: 0;
  width: 100vw;
  height: 100vh;
  z-index: -1;
  background-image: url("/images/new/illu_streger.svg");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: 0 150px;
}

.background-pattern-dimmed:after {
  opacity: 0.5;
}

.background-pattern-subtle:after {
  opacity: 0.05;
}

.background-pattern-white:after {
  background-image: url("/images/new/illu_streger_hvid.svg");
}

.background-pattern-base:after {
  background-image: url("/images/new/illu_streger_base.svg");
}

.background-full::before {
  content: '';
  position: absolute;
  height: 100%;
  width: 200vw;
  background-color: inherit;
  top: 0;
  left: -100%;
  z-index: -1;
}

.list-unstyled {
  list-style: none;
}

@media (max-width: 767px) {
  .border-top-base-lighter-tablet {
    border-top: 1px solid #e9e9ee;
  }
}

.position-relative {
  position: relative !important;
}

.position-absolute {
  position: absolute !important;
}

.position-fixed {
  position: fixed !important;
}

.position-fixed-bottom {
  bottom: 0;
}

@media (max-width: 480px) {
  .position-fixed-bottom-mobile {
    position: fixed !important;
  }
}

@media (max-width: 767px) {
  .position-fixed-bottom-tablet {
    position: fixed !important;
  }
}

.center {
  display: block;
  margin: 0 auto;
}

.clearfix:after {
  content: '';
  clear: both;
  display: table;
}

.overflow-hidden {
  overflow: hidden;
}

@-webkit-keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

.fadeIn {
  -webkit-animation: fadeIn ease-out forwards;
          animation: fadeIn ease-out forwards;
  -webkit-animation-duration: 300ms;
          animation-duration: 300ms;
}

.fadeIn-slow {
  -webkit-animation-duration: 600ms;
          animation-duration: 600ms;
}

@-webkit-keyframes slideDown {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, -20px, 0);
            transform: translate3d(0, -20px, 0);
  }
  100% {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
  }
}

@keyframes slideDown {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, -20px, 0);
            transform: translate3d(0, -20px, 0);
  }
  100% {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
  }
}

.slideDown {
  -webkit-animation: slideDown cubic-bezier(0.25, 0.75, 0.25, 1) forwards;
          animation: slideDown cubic-bezier(0.25, 0.75, 0.25, 1) forwards;
  -webkit-animation-duration: 600ms;
          animation-duration: 600ms;
}

.slideDown-fast {
  -webkit-animation-duration: 300ms;
          animation-duration: 300ms;
}

.slideDown-slow {
  -webkit-animation-duration: 1200ms;
          animation-duration: 1200ms;
}

.stackable {
  position: absolute;
  top: 0;
  left: 0;
}

.visibleControlBar {
  padding-bottom: 180px !important;
}

.gridBlock {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  display: -webkit-flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-flex-wrap: wrap;
  padding: 96px 0;
  margin: 0 auto;
}

.gridBlock-dialogsContainer {
  position: absolute;
  left: 50%;
  -webkit-transform: translate(-50%);
          transform: translate(-50%);
  margin-top: 32px;
  z-index: 1004;
}

.gridBlock-noPadding {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

@media (max-width: 767px) {
  .gridBlock-noPadding {
    padding: 0 32px !important;
  }
}
/*  new class from jvl  */
@media (max-width: 767px) {
  .gridBlock-noPadding_belowDesktop {
    padding: 0 32px !important;
  }
}
/*  end new class from jvl  */
.gridBlock-noWrap {
  -ms-flex-wrap: nowrap !important;
      flex-wrap: nowrap !important;
}

.gridBlock > * {
  padding: 0 32px;
}

@media (max-width: 1024px) {  /* jvl   */
  .simple .gridBlock > * {
	  padding: 0 16px;
	}
}

@media (max-width: 767px) {
  .gridBlock > * {
    width: 100%;
    padding: 0;
  }
}

.gridBlock-colPaddingSmall > * {
  padding: 0 8px;
}

.gridBlock-noLeftRightPadding {  /* jvl   */
   padding-right: 0 !important;
   padding-left: 0 !important;
}

@media (max-width: 1024px) {
  .gridBlock {
    width: 100%;
    padding: 96px 96px;    /*  padding: 96px 64px; changed by jvl   */
  }
  .simple .gridBlock {      /* jvl   */
    width: 100%;
    padding: 48px 48px;    
  }
}


@media (max-width: 767px) {
  .gridBlock {
    width: 100%;
    padding: 32px;
  }
}

@media (min-width: 1025px) {
  .gridBlock {
    width: 100%;
    padding: 96px 128px;
  }

}

@media (min-width: 1600px) {
  .gridBlock {
    width: 1552px;
  }
}

.gridBlock-columns-2 > * {
  position: relative;
  width: 50% !important;
  -webkit-flex-basis: 50% !important;
}

@media (max-width: 840px) {
  .gridBlock-columns-2 > * {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-2 > *.span-0 {
    width: 0% !important;
    -webkit-flex-basis: 0% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-2 > *.span-0 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-2 > *.span-0-belowDesktop {
    width: 0% !important;
    -webkit-flex-basis: 0% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-2 > *.span-0-belowTablet {
    width: 0% !important;
    -webkit-flex-basis: 0% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-2 > *.span-0-tablet {
    width: 0% !important;
    -webkit-flex-basis: 0% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-2 > *.span-0-mobile {
    width: 0% !important;
    -webkit-flex-basis: 0% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-2 > *.offset-0 {
    margin-left: 0% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-2 > *.offset-0 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-2 > *.offset-0-belowDesktop {
    margin-left: 0% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-2 > *.offset-0-tablet {
    margin-left: 0% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-2 > *.offset-0-mobile {
    margin-left: 0% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-2 > *.span-1 {
    width: 50% !important;
    -webkit-flex-basis: 50% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-2 > *.span-1 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-2 > *.span-1-belowDesktop {
    width: 50% !important;
    -webkit-flex-basis: 50% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-2 > *.span-1-belowTablet {
    width: 50% !important;
    -webkit-flex-basis: 50% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-2 > *.span-1-tablet {
    width: 50% !important;
    -webkit-flex-basis: 50% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-2 > *.span-1-mobile {
    width: 50% !important;
    -webkit-flex-basis: 50% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-2 > *.offset-1 {
    margin-left: 50% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-2 > *.offset-1 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-2 > *.offset-1-belowDesktop {
    margin-left: 50% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-2 > *.offset-1-tablet {
    margin-left: 50% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-2 > *.offset-1-mobile {
    margin-left: 50% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-2 > *.span-2 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-2 > *.span-2 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-2 > *.span-2-belowDesktop {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-2 > *.span-2-belowTablet {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-2 > *.span-2-tablet {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-2 > *.span-2-mobile {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-2 > *.offset-2 {
    margin-left: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-2 > *.offset-2 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-2 > *.offset-2-belowDesktop {
    margin-left: 100% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-2 > *.offset-2-tablet {
    margin-left: 100% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-2 > *.offset-2-mobile {
    margin-left: 100% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-2 > *.span-3 {
    width: 150% !important;
    -webkit-flex-basis: 150% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-2 > *.span-3 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-2 > *.span-3-belowDesktop {
    width: 150% !important;
    -webkit-flex-basis: 150% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-2 > *.span-3-belowTablet {
    width: 150% !important;
    -webkit-flex-basis: 150% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-2 > *.span-3-tablet {
    width: 150% !important;
    -webkit-flex-basis: 150% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-2 > *.span-3-mobile {
    width: 150% !important;
    -webkit-flex-basis: 150% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-2 > *.offset-3 {
    margin-left: 150% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-2 > *.offset-3 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-2 > *.offset-3-belowDesktop {
    margin-left: 150% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-2 > *.offset-3-tablet {
    margin-left: 150% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-2 > *.offset-3-mobile {
    margin-left: 150% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-2 > *.span-4 {
    width: 200% !important;
    -webkit-flex-basis: 200% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-2 > *.span-4 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-2 > *.span-4-belowDesktop {
    width: 200% !important;
    -webkit-flex-basis: 200% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-2 > *.span-4-belowTablet {
    width: 200% !important;
    -webkit-flex-basis: 200% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-2 > *.span-4-tablet {
    width: 200% !important;
    -webkit-flex-basis: 200% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-2 > *.span-4-mobile {
    width: 200% !important;
    -webkit-flex-basis: 200% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-2 > *.offset-4 {
    margin-left: 200% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-2 > *.offset-4 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-2 > *.offset-4-belowDesktop {
    margin-left: 200% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-2 > *.offset-4-tablet {
    margin-left: 200% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-2 > *.offset-4-mobile {
    margin-left: 200% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-2 > *.span-5 {
    width: 250% !important;
    -webkit-flex-basis: 250% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-2 > *.span-5 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-2 > *.span-5-belowDesktop {
    width: 250% !important;
    -webkit-flex-basis: 250% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-2 > *.span-5-belowTablet {
    width: 250% !important;
    -webkit-flex-basis: 250% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-2 > *.span-5-tablet {
    width: 250% !important;
    -webkit-flex-basis: 250% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-2 > *.span-5-mobile {
    width: 250% !important;
    -webkit-flex-basis: 250% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-2 > *.offset-5 {
    margin-left: 250% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-2 > *.offset-5 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-2 > *.offset-5-belowDesktop {
    margin-left: 250% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-2 > *.offset-5-tablet {
    margin-left: 250% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-2 > *.offset-5-mobile {
    margin-left: 250% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-2 > *.span-6 {
    width: 300% !important;
    -webkit-flex-basis: 300% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-2 > *.span-6 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-2 > *.span-6-belowDesktop {
    width: 300% !important;
    -webkit-flex-basis: 300% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-2 > *.span-6-belowTablet {
    width: 300% !important;
    -webkit-flex-basis: 300% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-2 > *.span-6-tablet {
    width: 300% !important;
    -webkit-flex-basis: 300% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-2 > *.span-6-mobile {
    width: 300% !important;
    -webkit-flex-basis: 300% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-2 > *.offset-6 {
    margin-left: 300% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-2 > *.offset-6 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-2 > *.offset-6-belowDesktop {
    margin-left: 300% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-2 > *.offset-6-tablet {
    margin-left: 300% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-2 > *.offset-6-mobile {
    margin-left: 300% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-2 > *.span-7 {
    width: 350% !important;
    -webkit-flex-basis: 350% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-2 > *.span-7 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-2 > *.span-7-belowDesktop {
    width: 350% !important;
    -webkit-flex-basis: 350% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-2 > *.span-7-belowTablet {
    width: 350% !important;
    -webkit-flex-basis: 350% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-2 > *.span-7-tablet {
    width: 350% !important;
    -webkit-flex-basis: 350% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-2 > *.span-7-mobile {
    width: 350% !important;
    -webkit-flex-basis: 350% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-2 > *.offset-7 {
    margin-left: 350% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-2 > *.offset-7 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-2 > *.offset-7-belowDesktop {
    margin-left: 350% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-2 > *.offset-7-tablet {
    margin-left: 350% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-2 > *.offset-7-mobile {
    margin-left: 350% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-2 > *.span-8 {
    width: 400% !important;
    -webkit-flex-basis: 400% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-2 > *.span-8 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-2 > *.span-8-belowDesktop {
    width: 400% !important;
    -webkit-flex-basis: 400% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-2 > *.span-8-belowTablet {
    width: 400% !important;
    -webkit-flex-basis: 400% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-2 > *.span-8-tablet {
    width: 400% !important;
    -webkit-flex-basis: 400% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-2 > *.span-8-mobile {
    width: 400% !important;
    -webkit-flex-basis: 400% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-2 > *.offset-8 {
    margin-left: 400% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-2 > *.offset-8 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-2 > *.offset-8-belowDesktop {
    margin-left: 400% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-2 > *.offset-8-tablet {
    margin-left: 400% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-2 > *.offset-8-mobile {
    margin-left: 400% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-2 > *.span-9 {
    width: 450% !important;
    -webkit-flex-basis: 450% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-2 > *.span-9 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-2 > *.span-9-belowDesktop {
    width: 450% !important;
    -webkit-flex-basis: 450% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-2 > *.span-9-belowTablet {
    width: 450% !important;
    -webkit-flex-basis: 450% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-2 > *.span-9-tablet {
    width: 450% !important;
    -webkit-flex-basis: 450% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-2 > *.span-9-mobile {
    width: 450% !important;
    -webkit-flex-basis: 450% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-2 > *.offset-9 {
    margin-left: 450% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-2 > *.offset-9 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-2 > *.offset-9-belowDesktop {
    margin-left: 450% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-2 > *.offset-9-tablet {
    margin-left: 450% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-2 > *.offset-9-mobile {
    margin-left: 450% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-2 > *.span-10 {
    width: 500% !important;
    -webkit-flex-basis: 500% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-2 > *.span-10 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-2 > *.span-10-belowDesktop {
    width: 500% !important;
    -webkit-flex-basis: 500% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-2 > *.span-10-belowTablet {
    width: 500% !important;
    -webkit-flex-basis: 500% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-2 > *.span-10-tablet {
    width: 500% !important;
    -webkit-flex-basis: 500% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-2 > *.span-10-mobile {
    width: 500% !important;
    -webkit-flex-basis: 500% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-2 > *.offset-10 {
    margin-left: 500% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-2 > *.offset-10 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-2 > *.offset-10-belowDesktop {
    margin-left: 500% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-2 > *.offset-10-tablet {
    margin-left: 500% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-2 > *.offset-10-mobile {
    margin-left: 500% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-2 > *.span-11 {
    width: 550% !important;
    -webkit-flex-basis: 550% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-2 > *.span-11 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-2 > *.span-11-belowDesktop {
    width: 550% !important;
    -webkit-flex-basis: 550% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-2 > *.span-11-belowTablet {
    width: 550% !important;
    -webkit-flex-basis: 550% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-2 > *.span-11-tablet {
    width: 550% !important;
    -webkit-flex-basis: 550% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-2 > *.span-11-mobile {
    width: 550% !important;
    -webkit-flex-basis: 550% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-2 > *.offset-11 {
    margin-left: 550% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-2 > *.offset-11 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-2 > *.offset-11-belowDesktop {
    margin-left: 550% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-2 > *.offset-11-tablet {
    margin-left: 550% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-2 > *.offset-11-mobile {
    margin-left: 550% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-2 > *.span-12 {
    width: 600% !important;
    -webkit-flex-basis: 600% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-2 > *.span-12 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-2 > *.span-12-belowDesktop {
    width: 600% !important;
    -webkit-flex-basis: 600% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-2 > *.span-12-belowTablet {
    width: 600% !important;
    -webkit-flex-basis: 600% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-2 > *.span-12-tablet {
    width: 600% !important;
    -webkit-flex-basis: 600% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-2 > *.span-12-mobile {
    width: 600% !important;
    -webkit-flex-basis: 600% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-2 > *.offset-12 {
    margin-left: 600% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-2 > *.offset-12 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-2 > *.offset-12-belowDesktop {
    margin-left: 600% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-2 > *.offset-12-tablet {
    margin-left: 600% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-2 > *.offset-12-mobile {
    margin-left: 600% !important;
  }
}

.gridBlock-columns-3 > * {
  position: relative;
  width: 33.3333333333% !important;
  -webkit-flex-basis: 33.3333333333% !important;
}

@media (max-width: 840px) {
  .gridBlock-columns-3 > * {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-3 > *.span-0 {
    width: 0% !important;
    -webkit-flex-basis: 0% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-3 > *.span-0 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-3 > *.span-0-belowDesktop {
    width: 0% !important;
    -webkit-flex-basis: 0% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-3 > *.span-0-belowTablet {
    width: 0% !important;
    -webkit-flex-basis: 0% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-3 > *.span-0-tablet {
    width: 0% !important;
    -webkit-flex-basis: 0% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-3 > *.span-0-mobile {
    width: 0% !important;
    -webkit-flex-basis: 0% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-3 > *.offset-0 {
    margin-left: 0% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-3 > *.offset-0 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-3 > *.offset-0-belowDesktop {
    margin-left: 0% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-3 > *.offset-0-tablet {
    margin-left: 0% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-3 > *.offset-0-mobile {
    margin-left: 0% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-3 > *.span-1 {
    width: 33.3333333333% !important;
    -webkit-flex-basis: 33.3333333333% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-3 > *.span-1 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-3 > *.span-1-belowDesktop {
    width: 33.3333333333% !important;
    -webkit-flex-basis: 33.3333333333% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-3 > *.span-1-belowTablet {
    width: 33.3333333333% !important;
    -webkit-flex-basis: 33.3333333333% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-3 > *.span-1-tablet {
    width: 33.3333333333% !important;
    -webkit-flex-basis: 33.3333333333% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-3 > *.span-1-mobile {
    width: 33.3333333333% !important;
    -webkit-flex-basis: 33.3333333333% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-3 > *.offset-1 {
    margin-left: 33.3333333333% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-3 > *.offset-1 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-3 > *.offset-1-belowDesktop {
    margin-left: 33.3333333333% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-3 > *.offset-1-tablet {
    margin-left: 33.3333333333% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-3 > *.offset-1-mobile {
    margin-left: 33.3333333333% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-3 > *.span-2 {
    width: 66.6666666667% !important;
    -webkit-flex-basis: 66.6666666667% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-3 > *.span-2 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-3 > *.span-2-belowDesktop {
    width: 66.6666666667% !important;
    -webkit-flex-basis: 66.6666666667% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-3 > *.span-2-belowTablet {
    width: 66.6666666667% !important;
    -webkit-flex-basis: 66.6666666667% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-3 > *.span-2-tablet {
    width: 66.6666666667% !important;
    -webkit-flex-basis: 66.6666666667% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-3 > *.span-2-mobile {
    width: 66.6666666667% !important;
    -webkit-flex-basis: 66.6666666667% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-3 > *.offset-2 {
    margin-left: 66.6666666667% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-3 > *.offset-2 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-3 > *.offset-2-belowDesktop {
    margin-left: 66.6666666667% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-3 > *.offset-2-tablet {
    margin-left: 66.6666666667% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-3 > *.offset-2-mobile {
    margin-left: 66.6666666667% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-3 > *.span-3 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-3 > *.span-3 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-3 > *.span-3-belowDesktop {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-3 > *.span-3-belowTablet {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-3 > *.span-3-tablet {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-3 > *.span-3-mobile {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-3 > *.offset-3 {
    margin-left: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-3 > *.offset-3 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-3 > *.offset-3-belowDesktop {
    margin-left: 100% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-3 > *.offset-3-tablet {
    margin-left: 100% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-3 > *.offset-3-mobile {
    margin-left: 100% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-3 > *.span-4 {
    width: 133.333333333% !important;
    -webkit-flex-basis: 133.333333333% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-3 > *.span-4 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-3 > *.span-4-belowDesktop {
    width: 133.333333333% !important;
    -webkit-flex-basis: 133.333333333% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-3 > *.span-4-belowTablet {
    width: 133.333333333% !important;
    -webkit-flex-basis: 133.333333333% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-3 > *.span-4-tablet {
    width: 133.333333333% !important;
    -webkit-flex-basis: 133.333333333% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-3 > *.span-4-mobile {
    width: 133.333333333% !important;
    -webkit-flex-basis: 133.333333333% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-3 > *.offset-4 {
    margin-left: 133.333333333% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-3 > *.offset-4 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-3 > *.offset-4-belowDesktop {
    margin-left: 133.333333333% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-3 > *.offset-4-tablet {
    margin-left: 133.333333333% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-3 > *.offset-4-mobile {
    margin-left: 133.333333333% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-3 > *.span-5 {
    width: 166.666666667% !important;
    -webkit-flex-basis: 166.666666667% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-3 > *.span-5 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-3 > *.span-5-belowDesktop {
    width: 166.666666667% !important;
    -webkit-flex-basis: 166.666666667% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-3 > *.span-5-belowTablet {
    width: 166.666666667% !important;
    -webkit-flex-basis: 166.666666667% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-3 > *.span-5-tablet {
    width: 166.666666667% !important;
    -webkit-flex-basis: 166.666666667% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-3 > *.span-5-mobile {
    width: 166.666666667% !important;
    -webkit-flex-basis: 166.666666667% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-3 > *.offset-5 {
    margin-left: 166.666666667% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-3 > *.offset-5 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-3 > *.offset-5-belowDesktop {
    margin-left: 166.666666667% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-3 > *.offset-5-tablet {
    margin-left: 166.666666667% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-3 > *.offset-5-mobile {
    margin-left: 166.666666667% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-3 > *.span-6 {
    width: 200% !important;
    -webkit-flex-basis: 200% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-3 > *.span-6 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-3 > *.span-6-belowDesktop {
    width: 200% !important;
    -webkit-flex-basis: 200% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-3 > *.span-6-belowTablet {
    width: 200% !important;
    -webkit-flex-basis: 200% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-3 > *.span-6-tablet {
    width: 200% !important;
    -webkit-flex-basis: 200% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-3 > *.span-6-mobile {
    width: 200% !important;
    -webkit-flex-basis: 200% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-3 > *.offset-6 {
    margin-left: 200% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-3 > *.offset-6 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-3 > *.offset-6-belowDesktop {
    margin-left: 200% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-3 > *.offset-6-tablet {
    margin-left: 200% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-3 > *.offset-6-mobile {
    margin-left: 200% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-3 > *.span-7 {
    width: 233.333333333% !important;
    -webkit-flex-basis: 233.333333333% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-3 > *.span-7 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-3 > *.span-7-belowDesktop {
    width: 233.333333333% !important;
    -webkit-flex-basis: 233.333333333% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-3 > *.span-7-belowTablet {
    width: 233.333333333% !important;
    -webkit-flex-basis: 233.333333333% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-3 > *.span-7-tablet {
    width: 233.333333333% !important;
    -webkit-flex-basis: 233.333333333% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-3 > *.span-7-mobile {
    width: 233.333333333% !important;
    -webkit-flex-basis: 233.333333333% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-3 > *.offset-7 {
    margin-left: 233.333333333% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-3 > *.offset-7 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-3 > *.offset-7-belowDesktop {
    margin-left: 233.333333333% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-3 > *.offset-7-tablet {
    margin-left: 233.333333333% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-3 > *.offset-7-mobile {
    margin-left: 233.333333333% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-3 > *.span-8 {
    width: 266.666666667% !important;
    -webkit-flex-basis: 266.666666667% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-3 > *.span-8 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-3 > *.span-8-belowDesktop {
    width: 266.666666667% !important;
    -webkit-flex-basis: 266.666666667% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-3 > *.span-8-belowTablet {
    width: 266.666666667% !important;
    -webkit-flex-basis: 266.666666667% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-3 > *.span-8-tablet {
    width: 266.666666667% !important;
    -webkit-flex-basis: 266.666666667% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-3 > *.span-8-mobile {
    width: 266.666666667% !important;
    -webkit-flex-basis: 266.666666667% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-3 > *.offset-8 {
    margin-left: 266.666666667% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-3 > *.offset-8 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-3 > *.offset-8-belowDesktop {
    margin-left: 266.666666667% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-3 > *.offset-8-tablet {
    margin-left: 266.666666667% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-3 > *.offset-8-mobile {
    margin-left: 266.666666667% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-3 > *.span-9 {
    width: 300% !important;
    -webkit-flex-basis: 300% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-3 > *.span-9 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-3 > *.span-9-belowDesktop {
    width: 300% !important;
    -webkit-flex-basis: 300% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-3 > *.span-9-belowTablet {
    width: 300% !important;
    -webkit-flex-basis: 300% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-3 > *.span-9-tablet {
    width: 300% !important;
    -webkit-flex-basis: 300% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-3 > *.span-9-mobile {
    width: 300% !important;
    -webkit-flex-basis: 300% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-3 > *.offset-9 {
    margin-left: 300% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-3 > *.offset-9 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-3 > *.offset-9-belowDesktop {
    margin-left: 300% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-3 > *.offset-9-tablet {
    margin-left: 300% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-3 > *.offset-9-mobile {
    margin-left: 300% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-3 > *.span-10 {
    width: 333.333333333% !important;
    -webkit-flex-basis: 333.333333333% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-3 > *.span-10 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-3 > *.span-10-belowDesktop {
    width: 333.333333333% !important;
    -webkit-flex-basis: 333.333333333% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-3 > *.span-10-belowTablet {
    width: 333.333333333% !important;
    -webkit-flex-basis: 333.333333333% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-3 > *.span-10-tablet {
    width: 333.333333333% !important;
    -webkit-flex-basis: 333.333333333% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-3 > *.span-10-mobile {
    width: 333.333333333% !important;
    -webkit-flex-basis: 333.333333333% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-3 > *.offset-10 {
    margin-left: 333.333333333% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-3 > *.offset-10 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-3 > *.offset-10-belowDesktop {
    margin-left: 333.333333333% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-3 > *.offset-10-tablet {
    margin-left: 333.333333333% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-3 > *.offset-10-mobile {
    margin-left: 333.333333333% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-3 > *.span-11 {
    width: 366.666666667% !important;
    -webkit-flex-basis: 366.666666667% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-3 > *.span-11 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-3 > *.span-11-belowDesktop {
    width: 366.666666667% !important;
    -webkit-flex-basis: 366.666666667% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-3 > *.span-11-belowTablet {
    width: 366.666666667% !important;
    -webkit-flex-basis: 366.666666667% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-3 > *.span-11-tablet {
    width: 366.666666667% !important;
    -webkit-flex-basis: 366.666666667% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-3 > *.span-11-mobile {
    width: 366.666666667% !important;
    -webkit-flex-basis: 366.666666667% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-3 > *.offset-11 {
    margin-left: 366.666666667% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-3 > *.offset-11 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-3 > *.offset-11-belowDesktop {
    margin-left: 366.666666667% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-3 > *.offset-11-tablet {
    margin-left: 366.666666667% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-3 > *.offset-11-mobile {
    margin-left: 366.666666667% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-3 > *.span-12 {
    width: 400% !important;
    -webkit-flex-basis: 400% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-3 > *.span-12 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-3 > *.span-12-belowDesktop {
    width: 400% !important;
    -webkit-flex-basis: 400% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-3 > *.span-12-belowTablet {
    width: 400% !important;
    -webkit-flex-basis: 400% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-3 > *.span-12-tablet {
    width: 400% !important;
    -webkit-flex-basis: 400% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-3 > *.span-12-mobile {
    width: 400% !important;
    -webkit-flex-basis: 400% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-3 > *.offset-12 {
    margin-left: 400% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-3 > *.offset-12 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-3 > *.offset-12-belowDesktop {
    margin-left: 400% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-3 > *.offset-12-tablet {
    margin-left: 400% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-3 > *.offset-12-mobile {
    margin-left: 400% !important;
  }
}

.gridBlock-columns-4 > * {
  position: relative;
  width: 25% !important;
  -webkit-flex-basis: 25% !important;
}

@media (max-width: 840px) {
  .gridBlock-columns-4 > * {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-4 > *.span-0 {
    width: 0% !important;
    -webkit-flex-basis: 0% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-4 > *.span-0 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-4 > *.span-0-belowDesktop {
    width: 0% !important;
    -webkit-flex-basis: 0% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-4 > *.span-0-belowTablet {
    width: 0% !important;
    -webkit-flex-basis: 0% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-4 > *.span-0-tablet {
    width: 0% !important;
    -webkit-flex-basis: 0% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-4 > *.span-0-mobile {
    width: 0% !important;
    -webkit-flex-basis: 0% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-4 > *.offset-0 {
    margin-left: 0% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-4 > *.offset-0 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-4 > *.offset-0-belowDesktop {
    margin-left: 0% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-4 > *.offset-0-tablet {
    margin-left: 0% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-4 > *.offset-0-mobile {
    margin-left: 0% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-4 > *.span-1 {
    width: 25% !important;
    -webkit-flex-basis: 25% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-4 > *.span-1 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-4 > *.span-1-belowDesktop {
    width: 25% !important;
    -webkit-flex-basis: 25% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-4 > *.span-1-belowTablet {
    width: 25% !important;
    -webkit-flex-basis: 25% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-4 > *.span-1-tablet {
    width: 25% !important;
    -webkit-flex-basis: 25% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-4 > *.span-1-mobile {
    width: 25% !important;
    -webkit-flex-basis: 25% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-4 > *.offset-1 {
    margin-left: 25% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-4 > *.offset-1 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-4 > *.offset-1-belowDesktop {
    margin-left: 25% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-4 > *.offset-1-tablet {
    margin-left: 25% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-4 > *.offset-1-mobile {
    margin-left: 25% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-4 > *.span-2 {
    width: 50% !important;
    -webkit-flex-basis: 50% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-4 > *.span-2 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-4 > *.span-2-belowDesktop {
    width: 50% !important;
    -webkit-flex-basis: 50% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-4 > *.span-2-belowTablet {
    width: 50% !important;
    -webkit-flex-basis: 50% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-4 > *.span-2-tablet {
    width: 50% !important;
    -webkit-flex-basis: 50% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-4 > *.span-2-mobile {
    width: 50% !important;
    -webkit-flex-basis: 50% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-4 > *.offset-2 {
    margin-left: 50% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-4 > *.offset-2 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-4 > *.offset-2-belowDesktop {
    margin-left: 50% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-4 > *.offset-2-tablet {
    margin-left: 50% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-4 > *.offset-2-mobile {
    margin-left: 50% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-4 > *.span-3 {
    width: 75% !important;
    -webkit-flex-basis: 75% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-4 > *.span-3 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-4 > *.span-3-belowDesktop {
    width: 75% !important;
    -webkit-flex-basis: 75% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-4 > *.span-3-belowTablet {
    width: 75% !important;
    -webkit-flex-basis: 75% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-4 > *.span-3-tablet {
    width: 75% !important;
    -webkit-flex-basis: 75% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-4 > *.span-3-mobile {
    width: 75% !important;
    -webkit-flex-basis: 75% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-4 > *.offset-3 {
    margin-left: 75% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-4 > *.offset-3 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-4 > *.offset-3-belowDesktop {
    margin-left: 75% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-4 > *.offset-3-tablet {
    margin-left: 75% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-4 > *.offset-3-mobile {
    margin-left: 75% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-4 > *.span-4 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-4 > *.span-4 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-4 > *.span-4-belowDesktop {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-4 > *.span-4-belowTablet {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-4 > *.span-4-tablet {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-4 > *.span-4-mobile {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-4 > *.offset-4 {
    margin-left: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-4 > *.offset-4 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-4 > *.offset-4-belowDesktop {
    margin-left: 100% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-4 > *.offset-4-tablet {
    margin-left: 100% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-4 > *.offset-4-mobile {
    margin-left: 100% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-4 > *.span-5 {
    width: 125% !important;
    -webkit-flex-basis: 125% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-4 > *.span-5 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-4 > *.span-5-belowDesktop {
    width: 125% !important;
    -webkit-flex-basis: 125% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-4 > *.span-5-belowTablet {
    width: 125% !important;
    -webkit-flex-basis: 125% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-4 > *.span-5-tablet {
    width: 125% !important;
    -webkit-flex-basis: 125% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-4 > *.span-5-mobile {
    width: 125% !important;
    -webkit-flex-basis: 125% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-4 > *.offset-5 {
    margin-left: 125% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-4 > *.offset-5 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-4 > *.offset-5-belowDesktop {
    margin-left: 125% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-4 > *.offset-5-tablet {
    margin-left: 125% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-4 > *.offset-5-mobile {
    margin-left: 125% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-4 > *.span-6 {
    width: 150% !important;
    -webkit-flex-basis: 150% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-4 > *.span-6 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-4 > *.span-6-belowDesktop {
    width: 150% !important;
    -webkit-flex-basis: 150% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-4 > *.span-6-belowTablet {
    width: 150% !important;
    -webkit-flex-basis: 150% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-4 > *.span-6-tablet {
    width: 150% !important;
    -webkit-flex-basis: 150% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-4 > *.span-6-mobile {
    width: 150% !important;
    -webkit-flex-basis: 150% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-4 > *.offset-6 {
    margin-left: 150% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-4 > *.offset-6 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-4 > *.offset-6-belowDesktop {
    margin-left: 150% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-4 > *.offset-6-tablet {
    margin-left: 150% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-4 > *.offset-6-mobile {
    margin-left: 150% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-4 > *.span-7 {
    width: 175% !important;
    -webkit-flex-basis: 175% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-4 > *.span-7 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-4 > *.span-7-belowDesktop {
    width: 175% !important;
    -webkit-flex-basis: 175% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-4 > *.span-7-belowTablet {
    width: 175% !important;
    -webkit-flex-basis: 175% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-4 > *.span-7-tablet {
    width: 175% !important;
    -webkit-flex-basis: 175% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-4 > *.span-7-mobile {
    width: 175% !important;
    -webkit-flex-basis: 175% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-4 > *.offset-7 {
    margin-left: 175% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-4 > *.offset-7 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-4 > *.offset-7-belowDesktop {
    margin-left: 175% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-4 > *.offset-7-tablet {
    margin-left: 175% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-4 > *.offset-7-mobile {
    margin-left: 175% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-4 > *.span-8 {
    width: 200% !important;
    -webkit-flex-basis: 200% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-4 > *.span-8 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-4 > *.span-8-belowDesktop {
    width: 200% !important;
    -webkit-flex-basis: 200% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-4 > *.span-8-belowTablet {
    width: 200% !important;
    -webkit-flex-basis: 200% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-4 > *.span-8-tablet {
    width: 200% !important;
    -webkit-flex-basis: 200% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-4 > *.span-8-mobile {
    width: 200% !important;
    -webkit-flex-basis: 200% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-4 > *.offset-8 {
    margin-left: 200% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-4 > *.offset-8 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-4 > *.offset-8-belowDesktop {
    margin-left: 200% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-4 > *.offset-8-tablet {
    margin-left: 200% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-4 > *.offset-8-mobile {
    margin-left: 200% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-4 > *.span-9 {
    width: 225% !important;
    -webkit-flex-basis: 225% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-4 > *.span-9 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-4 > *.span-9-belowDesktop {
    width: 225% !important;
    -webkit-flex-basis: 225% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-4 > *.span-9-belowTablet {
    width: 225% !important;
    -webkit-flex-basis: 225% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-4 > *.span-9-tablet {
    width: 225% !important;
    -webkit-flex-basis: 225% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-4 > *.span-9-mobile {
    width: 225% !important;
    -webkit-flex-basis: 225% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-4 > *.offset-9 {
    margin-left: 225% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-4 > *.offset-9 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-4 > *.offset-9-belowDesktop {
    margin-left: 225% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-4 > *.offset-9-tablet {
    margin-left: 225% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-4 > *.offset-9-mobile {
    margin-left: 225% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-4 > *.span-10 {
    width: 250% !important;
    -webkit-flex-basis: 250% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-4 > *.span-10 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-4 > *.span-10-belowDesktop {
    width: 250% !important;
    -webkit-flex-basis: 250% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-4 > *.span-10-belowTablet {
    width: 250% !important;
    -webkit-flex-basis: 250% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-4 > *.span-10-tablet {
    width: 250% !important;
    -webkit-flex-basis: 250% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-4 > *.span-10-mobile {
    width: 250% !important;
    -webkit-flex-basis: 250% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-4 > *.offset-10 {
    margin-left: 250% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-4 > *.offset-10 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-4 > *.offset-10-belowDesktop {
    margin-left: 250% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-4 > *.offset-10-tablet {
    margin-left: 250% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-4 > *.offset-10-mobile {
    margin-left: 250% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-4 > *.span-11 {
    width: 275% !important;
    -webkit-flex-basis: 275% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-4 > *.span-11 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-4 > *.span-11-belowDesktop {
    width: 275% !important;
    -webkit-flex-basis: 275% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-4 > *.span-11-belowTablet {
    width: 275% !important;
    -webkit-flex-basis: 275% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-4 > *.span-11-tablet {
    width: 275% !important;
    -webkit-flex-basis: 275% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-4 > *.span-11-mobile {
    width: 275% !important;
    -webkit-flex-basis: 275% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-4 > *.offset-11 {
    margin-left: 275% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-4 > *.offset-11 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-4 > *.offset-11-belowDesktop {
    margin-left: 275% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-4 > *.offset-11-tablet {
    margin-left: 275% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-4 > *.offset-11-mobile {
    margin-left: 275% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-4 > *.span-12 {
    width: 300% !important;
    -webkit-flex-basis: 300% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-4 > *.span-12 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-4 > *.span-12-belowDesktop {
    width: 300% !important;
    -webkit-flex-basis: 300% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-4 > *.span-12-belowTablet {
    width: 300% !important;
    -webkit-flex-basis: 300% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-4 > *.span-12-tablet {
    width: 300% !important;
    -webkit-flex-basis: 300% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-4 > *.span-12-mobile {
    width: 300% !important;
    -webkit-flex-basis: 300% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-4 > *.offset-12 {
    margin-left: 300% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-4 > *.offset-12 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-4 > *.offset-12-belowDesktop {
    margin-left: 300% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-4 > *.offset-12-tablet {
    margin-left: 300% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-4 > *.offset-12-mobile {
    margin-left: 300% !important;
  }
}

.gridBlock-columns-5 > * {
  position: relative;
  width: 20% !important;
  -webkit-flex-basis: 20% !important;
}

@media (max-width: 840px) {
  .gridBlock-columns-5 > * {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-5 > *.span-0 {
    width: 0% !important;
    -webkit-flex-basis: 0% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-5 > *.span-0 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-5 > *.span-0-belowDesktop {
    width: 0% !important;
    -webkit-flex-basis: 0% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-5 > *.span-0-belowTablet {
    width: 0% !important;
    -webkit-flex-basis: 0% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-5 > *.span-0-tablet {
    width: 0% !important;
    -webkit-flex-basis: 0% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-5 > *.span-0-mobile {
    width: 0% !important;
    -webkit-flex-basis: 0% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-5 > *.offset-0 {
    margin-left: 0% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-5 > *.offset-0 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-5 > *.offset-0-belowDesktop {
    margin-left: 0% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-5 > *.offset-0-tablet {
    margin-left: 0% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-5 > *.offset-0-mobile {
    margin-left: 0% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-5 > *.span-1 {
    width: 20% !important;
    -webkit-flex-basis: 20% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-5 > *.span-1 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-5 > *.span-1-belowDesktop {
    width: 20% !important;
    -webkit-flex-basis: 20% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-5 > *.span-1-belowTablet {
    width: 20% !important;
    -webkit-flex-basis: 20% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-5 > *.span-1-tablet {
    width: 20% !important;
    -webkit-flex-basis: 20% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-5 > *.span-1-mobile {
    width: 20% !important;
    -webkit-flex-basis: 20% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-5 > *.offset-1 {
    margin-left: 20% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-5 > *.offset-1 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-5 > *.offset-1-belowDesktop {
    margin-left: 20% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-5 > *.offset-1-tablet {
    margin-left: 20% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-5 > *.offset-1-mobile {
    margin-left: 20% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-5 > *.span-2 {
    width: 40% !important;
    -webkit-flex-basis: 40% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-5 > *.span-2 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-5 > *.span-2-belowDesktop {
    width: 40% !important;
    -webkit-flex-basis: 40% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-5 > *.span-2-belowTablet {
    width: 40% !important;
    -webkit-flex-basis: 40% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-5 > *.span-2-tablet {
    width: 40% !important;
    -webkit-flex-basis: 40% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-5 > *.span-2-mobile {
    width: 40% !important;
    -webkit-flex-basis: 40% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-5 > *.offset-2 {
    margin-left: 40% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-5 > *.offset-2 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-5 > *.offset-2-belowDesktop {
    margin-left: 40% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-5 > *.offset-2-tablet {
    margin-left: 40% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-5 > *.offset-2-mobile {
    margin-left: 40% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-5 > *.span-3 {
    width: 60% !important;
    -webkit-flex-basis: 60% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-5 > *.span-3 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-5 > *.span-3-belowDesktop {
    width: 60% !important;
    -webkit-flex-basis: 60% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-5 > *.span-3-belowTablet {
    width: 60% !important;
    -webkit-flex-basis: 60% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-5 > *.span-3-tablet {
    width: 60% !important;
    -webkit-flex-basis: 60% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-5 > *.span-3-mobile {
    width: 60% !important;
    -webkit-flex-basis: 60% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-5 > *.offset-3 {
    margin-left: 60% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-5 > *.offset-3 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-5 > *.offset-3-belowDesktop {
    margin-left: 60% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-5 > *.offset-3-tablet {
    margin-left: 60% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-5 > *.offset-3-mobile {
    margin-left: 60% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-5 > *.span-4 {
    width: 80% !important;
    -webkit-flex-basis: 80% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-5 > *.span-4 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-5 > *.span-4-belowDesktop {
    width: 80% !important;
    -webkit-flex-basis: 80% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-5 > *.span-4-belowTablet {
    width: 80% !important;
    -webkit-flex-basis: 80% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-5 > *.span-4-tablet {
    width: 80% !important;
    -webkit-flex-basis: 80% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-5 > *.span-4-mobile {
    width: 80% !important;
    -webkit-flex-basis: 80% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-5 > *.offset-4 {
    margin-left: 80% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-5 > *.offset-4 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-5 > *.offset-4-belowDesktop {
    margin-left: 80% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-5 > *.offset-4-tablet {
    margin-left: 80% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-5 > *.offset-4-mobile {
    margin-left: 80% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-5 > *.span-5 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-5 > *.span-5 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-5 > *.span-5-belowDesktop {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-5 > *.span-5-belowTablet {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-5 > *.span-5-tablet {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-5 > *.span-5-mobile {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-5 > *.offset-5 {
    margin-left: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-5 > *.offset-5 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-5 > *.offset-5-belowDesktop {
    margin-left: 100% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-5 > *.offset-5-tablet {
    margin-left: 100% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-5 > *.offset-5-mobile {
    margin-left: 100% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-5 > *.span-6 {
    width: 120% !important;
    -webkit-flex-basis: 120% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-5 > *.span-6 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-5 > *.span-6-belowDesktop {
    width: 120% !important;
    -webkit-flex-basis: 120% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-5 > *.span-6-belowTablet {
    width: 120% !important;
    -webkit-flex-basis: 120% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-5 > *.span-6-tablet {
    width: 120% !important;
    -webkit-flex-basis: 120% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-5 > *.span-6-mobile {
    width: 120% !important;
    -webkit-flex-basis: 120% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-5 > *.offset-6 {
    margin-left: 120% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-5 > *.offset-6 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-5 > *.offset-6-belowDesktop {
    margin-left: 120% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-5 > *.offset-6-tablet {
    margin-left: 120% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-5 > *.offset-6-mobile {
    margin-left: 120% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-5 > *.span-7 {
    width: 140% !important;
    -webkit-flex-basis: 140% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-5 > *.span-7 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-5 > *.span-7-belowDesktop {
    width: 140% !important;
    -webkit-flex-basis: 140% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-5 > *.span-7-belowTablet {
    width: 140% !important;
    -webkit-flex-basis: 140% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-5 > *.span-7-tablet {
    width: 140% !important;
    -webkit-flex-basis: 140% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-5 > *.span-7-mobile {
    width: 140% !important;
    -webkit-flex-basis: 140% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-5 > *.offset-7 {
    margin-left: 140% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-5 > *.offset-7 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-5 > *.offset-7-belowDesktop {
    margin-left: 140% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-5 > *.offset-7-tablet {
    margin-left: 140% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-5 > *.offset-7-mobile {
    margin-left: 140% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-5 > *.span-8 {
    width: 160% !important;
    -webkit-flex-basis: 160% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-5 > *.span-8 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-5 > *.span-8-belowDesktop {
    width: 160% !important;
    -webkit-flex-basis: 160% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-5 > *.span-8-belowTablet {
    width: 160% !important;
    -webkit-flex-basis: 160% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-5 > *.span-8-tablet {
    width: 160% !important;
    -webkit-flex-basis: 160% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-5 > *.span-8-mobile {
    width: 160% !important;
    -webkit-flex-basis: 160% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-5 > *.offset-8 {
    margin-left: 160% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-5 > *.offset-8 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-5 > *.offset-8-belowDesktop {
    margin-left: 160% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-5 > *.offset-8-tablet {
    margin-left: 160% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-5 > *.offset-8-mobile {
    margin-left: 160% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-5 > *.span-9 {
    width: 180% !important;
    -webkit-flex-basis: 180% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-5 > *.span-9 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-5 > *.span-9-belowDesktop {
    width: 180% !important;
    -webkit-flex-basis: 180% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-5 > *.span-9-belowTablet {
    width: 180% !important;
    -webkit-flex-basis: 180% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-5 > *.span-9-tablet {
    width: 180% !important;
    -webkit-flex-basis: 180% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-5 > *.span-9-mobile {
    width: 180% !important;
    -webkit-flex-basis: 180% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-5 > *.offset-9 {
    margin-left: 180% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-5 > *.offset-9 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-5 > *.offset-9-belowDesktop {
    margin-left: 180% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-5 > *.offset-9-tablet {
    margin-left: 180% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-5 > *.offset-9-mobile {
    margin-left: 180% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-5 > *.span-10 {
    width: 200% !important;
    -webkit-flex-basis: 200% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-5 > *.span-10 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-5 > *.span-10-belowDesktop {
    width: 200% !important;
    -webkit-flex-basis: 200% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-5 > *.span-10-belowTablet {
    width: 200% !important;
    -webkit-flex-basis: 200% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-5 > *.span-10-tablet {
    width: 200% !important;
    -webkit-flex-basis: 200% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-5 > *.span-10-mobile {
    width: 200% !important;
    -webkit-flex-basis: 200% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-5 > *.offset-10 {
    margin-left: 200% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-5 > *.offset-10 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-5 > *.offset-10-belowDesktop {
    margin-left: 200% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-5 > *.offset-10-tablet {
    margin-left: 200% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-5 > *.offset-10-mobile {
    margin-left: 200% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-5 > *.span-11 {
    width: 220% !important;
    -webkit-flex-basis: 220% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-5 > *.span-11 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-5 > *.span-11-belowDesktop {
    width: 220% !important;
    -webkit-flex-basis: 220% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-5 > *.span-11-belowTablet {
    width: 220% !important;
    -webkit-flex-basis: 220% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-5 > *.span-11-tablet {
    width: 220% !important;
    -webkit-flex-basis: 220% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-5 > *.span-11-mobile {
    width: 220% !important;
    -webkit-flex-basis: 220% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-5 > *.offset-11 {
    margin-left: 220% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-5 > *.offset-11 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-5 > *.offset-11-belowDesktop {
    margin-left: 220% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-5 > *.offset-11-tablet {
    margin-left: 220% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-5 > *.offset-11-mobile {
    margin-left: 220% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-5 > *.span-12 {
    width: 240% !important;
    -webkit-flex-basis: 240% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-5 > *.span-12 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-5 > *.span-12-belowDesktop {
    width: 240% !important;
    -webkit-flex-basis: 240% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-5 > *.span-12-belowTablet {
    width: 240% !important;
    -webkit-flex-basis: 240% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-5 > *.span-12-tablet {
    width: 240% !important;
    -webkit-flex-basis: 240% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-5 > *.span-12-mobile {
    width: 240% !important;
    -webkit-flex-basis: 240% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-5 > *.offset-12 {
    margin-left: 240% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-5 > *.offset-12 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-5 > *.offset-12-belowDesktop {
    margin-left: 240% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-5 > *.offset-12-tablet {
    margin-left: 240% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-5 > *.offset-12-mobile {
    margin-left: 240% !important;
  }
}

.gridBlock-columns-6 > * {
  position: relative;
  width: 16.6666666667% !important;
  -webkit-flex-basis: 16.6666666667% !important;
}

@media (max-width: 840px) {
  .gridBlock-columns-6 > * {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-6 > *.span-0 {
    width: 0% !important;
    -webkit-flex-basis: 0% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-6 > *.span-0 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-6 > *.span-0-belowDesktop {
    width: 0% !important;
    -webkit-flex-basis: 0% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-6 > *.span-0-belowTablet {
    width: 0% !important;
    -webkit-flex-basis: 0% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-6 > *.span-0-tablet {
    width: 0% !important;
    -webkit-flex-basis: 0% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-6 > *.span-0-mobile {
    width: 0% !important;
    -webkit-flex-basis: 0% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-6 > *.offset-0 {
    margin-left: 0% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-6 > *.offset-0 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-6 > *.offset-0-belowDesktop {
    margin-left: 0% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-6 > *.offset-0-tablet {
    margin-left: 0% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-6 > *.offset-0-mobile {
    margin-left: 0% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-6 > *.span-1 {
    width: 16.6666666667% !important;
    -webkit-flex-basis: 16.6666666667% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-6 > *.span-1 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-6 > *.span-1-belowDesktop {
    width: 16.6666666667% !important;
    -webkit-flex-basis: 16.6666666667% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-6 > *.span-1-belowTablet {
    width: 16.6666666667% !important;
    -webkit-flex-basis: 16.6666666667% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-6 > *.span-1-tablet {
    width: 16.6666666667% !important;
    -webkit-flex-basis: 16.6666666667% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-6 > *.span-1-mobile {
    width: 16.6666666667% !important;
    -webkit-flex-basis: 16.6666666667% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-6 > *.offset-1 {
    margin-left: 16.6666666667% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-6 > *.offset-1 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-6 > *.offset-1-belowDesktop {
    margin-left: 16.6666666667% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-6 > *.offset-1-tablet {
    margin-left: 16.6666666667% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-6 > *.offset-1-mobile {
    margin-left: 16.6666666667% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-6 > *.span-2 {
    width: 33.3333333333% !important;
    -webkit-flex-basis: 33.3333333333% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-6 > *.span-2 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-6 > *.span-2-belowDesktop {
    width: 33.3333333333% !important;
    -webkit-flex-basis: 33.3333333333% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-6 > *.span-2-belowTablet {
    width: 33.3333333333% !important;
    -webkit-flex-basis: 33.3333333333% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-6 > *.span-2-tablet {
    width: 33.3333333333% !important;
    -webkit-flex-basis: 33.3333333333% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-6 > *.span-2-mobile {
    width: 33.3333333333% !important;
    -webkit-flex-basis: 33.3333333333% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-6 > *.offset-2 {
    margin-left: 33.3333333333% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-6 > *.offset-2 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-6 > *.offset-2-belowDesktop {
    margin-left: 33.3333333333% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-6 > *.offset-2-tablet {
    margin-left: 33.3333333333% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-6 > *.offset-2-mobile {
    margin-left: 33.3333333333% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-6 > *.span-3 {
    width: 50% !important;
    -webkit-flex-basis: 50% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-6 > *.span-3 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-6 > *.span-3-belowDesktop {
    width: 50% !important;
    -webkit-flex-basis: 50% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-6 > *.span-3-belowTablet {
    width: 50% !important;
    -webkit-flex-basis: 50% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-6 > *.span-3-tablet {
    width: 50% !important;
    -webkit-flex-basis: 50% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-6 > *.span-3-mobile {
    width: 50% !important;
    -webkit-flex-basis: 50% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-6 > *.offset-3 {
    margin-left: 50% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-6 > *.offset-3 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-6 > *.offset-3-belowDesktop {
    margin-left: 50% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-6 > *.offset-3-tablet {
    margin-left: 50% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-6 > *.offset-3-mobile {
    margin-left: 50% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-6 > *.span-4 {
    width: 66.6666666667% !important;
    -webkit-flex-basis: 66.6666666667% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-6 > *.span-4 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-6 > *.span-4-belowDesktop {
    width: 66.6666666667% !important;
    -webkit-flex-basis: 66.6666666667% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-6 > *.span-4-belowTablet {
    width: 66.6666666667% !important;
    -webkit-flex-basis: 66.6666666667% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-6 > *.span-4-tablet {
    width: 66.6666666667% !important;
    -webkit-flex-basis: 66.6666666667% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-6 > *.span-4-mobile {
    width: 66.6666666667% !important;
    -webkit-flex-basis: 66.6666666667% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-6 > *.offset-4 {
    margin-left: 66.6666666667% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-6 > *.offset-4 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-6 > *.offset-4-belowDesktop {
    margin-left: 66.6666666667% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-6 > *.offset-4-tablet {
    margin-left: 66.6666666667% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-6 > *.offset-4-mobile {
    margin-left: 66.6666666667% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-6 > *.span-5 {
    width: 83.3333333333% !important;
    -webkit-flex-basis: 83.3333333333% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-6 > *.span-5 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-6 > *.span-5-belowDesktop {
    width: 83.3333333333% !important;
    -webkit-flex-basis: 83.3333333333% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-6 > *.span-5-belowTablet {
    width: 83.3333333333% !important;
    -webkit-flex-basis: 83.3333333333% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-6 > *.span-5-tablet {
    width: 83.3333333333% !important;
    -webkit-flex-basis: 83.3333333333% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-6 > *.span-5-mobile {
    width: 83.3333333333% !important;
    -webkit-flex-basis: 83.3333333333% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-6 > *.offset-5 {
    margin-left: 83.3333333333% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-6 > *.offset-5 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-6 > *.offset-5-belowDesktop {
    margin-left: 83.3333333333% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-6 > *.offset-5-tablet {
    margin-left: 83.3333333333% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-6 > *.offset-5-mobile {
    margin-left: 83.3333333333% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-6 > *.span-6 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-6 > *.span-6 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-6 > *.span-6-belowDesktop {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-6 > *.span-6-belowTablet {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-6 > *.span-6-tablet {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-6 > *.span-6-mobile {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-6 > *.offset-6 {
    margin-left: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-6 > *.offset-6 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-6 > *.offset-6-belowDesktop {
    margin-left: 100% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-6 > *.offset-6-tablet {
    margin-left: 100% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-6 > *.offset-6-mobile {
    margin-left: 100% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-6 > *.span-7 {
    width: 116.666666667% !important;
    -webkit-flex-basis: 116.666666667% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-6 > *.span-7 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-6 > *.span-7-belowDesktop {
    width: 116.666666667% !important;
    -webkit-flex-basis: 116.666666667% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-6 > *.span-7-belowTablet {
    width: 116.666666667% !important;
    -webkit-flex-basis: 116.666666667% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-6 > *.span-7-tablet {
    width: 116.666666667% !important;
    -webkit-flex-basis: 116.666666667% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-6 > *.span-7-mobile {
    width: 116.666666667% !important;
    -webkit-flex-basis: 116.666666667% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-6 > *.offset-7 {
    margin-left: 116.666666667% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-6 > *.offset-7 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-6 > *.offset-7-belowDesktop {
    margin-left: 116.666666667% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-6 > *.offset-7-tablet {
    margin-left: 116.666666667% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-6 > *.offset-7-mobile {
    margin-left: 116.666666667% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-6 > *.span-8 {
    width: 133.333333333% !important;
    -webkit-flex-basis: 133.333333333% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-6 > *.span-8 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-6 > *.span-8-belowDesktop {
    width: 133.333333333% !important;
    -webkit-flex-basis: 133.333333333% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-6 > *.span-8-belowTablet {
    width: 133.333333333% !important;
    -webkit-flex-basis: 133.333333333% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-6 > *.span-8-tablet {
    width: 133.333333333% !important;
    -webkit-flex-basis: 133.333333333% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-6 > *.span-8-mobile {
    width: 133.333333333% !important;
    -webkit-flex-basis: 133.333333333% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-6 > *.offset-8 {
    margin-left: 133.333333333% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-6 > *.offset-8 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-6 > *.offset-8-belowDesktop {
    margin-left: 133.333333333% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-6 > *.offset-8-tablet {
    margin-left: 133.333333333% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-6 > *.offset-8-mobile {
    margin-left: 133.333333333% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-6 > *.span-9 {
    width: 150% !important;
    -webkit-flex-basis: 150% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-6 > *.span-9 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-6 > *.span-9-belowDesktop {
    width: 150% !important;
    -webkit-flex-basis: 150% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-6 > *.span-9-belowTablet {
    width: 150% !important;
    -webkit-flex-basis: 150% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-6 > *.span-9-tablet {
    width: 150% !important;
    -webkit-flex-basis: 150% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-6 > *.span-9-mobile {
    width: 150% !important;
    -webkit-flex-basis: 150% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-6 > *.offset-9 {
    margin-left: 150% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-6 > *.offset-9 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-6 > *.offset-9-belowDesktop {
    margin-left: 150% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-6 > *.offset-9-tablet {
    margin-left: 150% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-6 > *.offset-9-mobile {
    margin-left: 150% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-6 > *.span-10 {
    width: 166.666666667% !important;
    -webkit-flex-basis: 166.666666667% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-6 > *.span-10 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-6 > *.span-10-belowDesktop {
    width: 166.666666667% !important;
    -webkit-flex-basis: 166.666666667% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-6 > *.span-10-belowTablet {
    width: 166.666666667% !important;
    -webkit-flex-basis: 166.666666667% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-6 > *.span-10-tablet {
    width: 166.666666667% !important;
    -webkit-flex-basis: 166.666666667% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-6 > *.span-10-mobile {
    width: 166.666666667% !important;
    -webkit-flex-basis: 166.666666667% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-6 > *.offset-10 {
    margin-left: 166.666666667% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-6 > *.offset-10 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-6 > *.offset-10-belowDesktop {
    margin-left: 166.666666667% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-6 > *.offset-10-tablet {
    margin-left: 166.666666667% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-6 > *.offset-10-mobile {
    margin-left: 166.666666667% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-6 > *.span-11 {
    width: 183.333333333% !important;
    -webkit-flex-basis: 183.333333333% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-6 > *.span-11 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-6 > *.span-11-belowDesktop {
    width: 183.333333333% !important;
    -webkit-flex-basis: 183.333333333% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-6 > *.span-11-belowTablet {
    width: 183.333333333% !important;
    -webkit-flex-basis: 183.333333333% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-6 > *.span-11-tablet {
    width: 183.333333333% !important;
    -webkit-flex-basis: 183.333333333% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-6 > *.span-11-mobile {
    width: 183.333333333% !important;
    -webkit-flex-basis: 183.333333333% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-6 > *.offset-11 {
    margin-left: 183.333333333% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-6 > *.offset-11 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-6 > *.offset-11-belowDesktop {
    margin-left: 183.333333333% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-6 > *.offset-11-tablet {
    margin-left: 183.333333333% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-6 > *.offset-11-mobile {
    margin-left: 183.333333333% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-6 > *.span-12 {
    width: 200% !important;
    -webkit-flex-basis: 200% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-6 > *.span-12 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-6 > *.span-12-belowDesktop {
    width: 200% !important;
    -webkit-flex-basis: 200% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-6 > *.span-12-belowTablet {
    width: 200% !important;
    -webkit-flex-basis: 200% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-6 > *.span-12-tablet {
    width: 200% !important;
    -webkit-flex-basis: 200% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-6 > *.span-12-mobile {
    width: 200% !important;
    -webkit-flex-basis: 200% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-6 > *.offset-12 {
    margin-left: 200% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-6 > *.offset-12 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-6 > *.offset-12-belowDesktop {
    margin-left: 200% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-6 > *.offset-12-tablet {
    margin-left: 200% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-6 > *.offset-12-mobile {
    margin-left: 200% !important;
  }
}

.gridBlock-columns-8 > * {
  position: relative;
  width: 12.5% !important;
  -webkit-flex-basis: 12.5% !important;
}

@media (max-width: 840px) {
  .gridBlock-columns-8 > * {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-8 > *.span-0 {
    width: 0% !important;
    -webkit-flex-basis: 0% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-8 > *.span-0 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-8 > *.span-0-belowDesktop {
    width: 0% !important;
    -webkit-flex-basis: 0% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-8 > *.span-0-belowTablet {
    width: 0% !important;
    -webkit-flex-basis: 0% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-8 > *.span-0-tablet {
    width: 0% !important;
    -webkit-flex-basis: 0% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-8 > *.span-0-mobile {
    width: 0% !important;
    -webkit-flex-basis: 0% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-8 > *.offset-0 {
    margin-left: 0% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-8 > *.offset-0 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-8 > *.offset-0-belowDesktop {
    margin-left: 0% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-8 > *.offset-0-tablet {
    margin-left: 0% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-8 > *.offset-0-mobile {
    margin-left: 0% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-8 > *.span-1 {
    width: 12.5% !important;
    -webkit-flex-basis: 12.5% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-8 > *.span-1 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-8 > *.span-1-belowDesktop {
    width: 12.5% !important;
    -webkit-flex-basis: 12.5% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-8 > *.span-1-belowTablet {
    width: 12.5% !important;
    -webkit-flex-basis: 12.5% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-8 > *.span-1-tablet {
    width: 12.5% !important;
    -webkit-flex-basis: 12.5% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-8 > *.span-1-mobile {
    width: 12.5% !important;
    -webkit-flex-basis: 12.5% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-8 > *.offset-1 {
    margin-left: 12.5% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-8 > *.offset-1 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-8 > *.offset-1-belowDesktop {
    margin-left: 12.5% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-8 > *.offset-1-tablet {
    margin-left: 12.5% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-8 > *.offset-1-mobile {
    margin-left: 12.5% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-8 > *.span-2 {
    width: 25% !important;
    -webkit-flex-basis: 25% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-8 > *.span-2 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-8 > *.span-2-belowDesktop {
    width: 25% !important;
    -webkit-flex-basis: 25% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-8 > *.span-2-belowTablet {
    width: 25% !important;
    -webkit-flex-basis: 25% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-8 > *.span-2-tablet {
    width: 25% !important;
    -webkit-flex-basis: 25% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-8 > *.span-2-mobile {
    width: 25% !important;
    -webkit-flex-basis: 25% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-8 > *.offset-2 {
    margin-left: 25% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-8 > *.offset-2 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-8 > *.offset-2-belowDesktop {
    margin-left: 25% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-8 > *.offset-2-tablet {
    margin-left: 25% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-8 > *.offset-2-mobile {
    margin-left: 25% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-8 > *.span-3 {
    width: 37.5% !important;
    -webkit-flex-basis: 37.5% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-8 > *.span-3 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-8 > *.span-3-belowDesktop {
    width: 37.5% !important;
    -webkit-flex-basis: 37.5% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-8 > *.span-3-belowTablet {
    width: 37.5% !important;
    -webkit-flex-basis: 37.5% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-8 > *.span-3-tablet {
    width: 37.5% !important;
    -webkit-flex-basis: 37.5% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-8 > *.span-3-mobile {
    width: 37.5% !important;
    -webkit-flex-basis: 37.5% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-8 > *.offset-3 {
    margin-left: 37.5% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-8 > *.offset-3 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-8 > *.offset-3-belowDesktop {
    margin-left: 37.5% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-8 > *.offset-3-tablet {
    margin-left: 37.5% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-8 > *.offset-3-mobile {
    margin-left: 37.5% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-8 > *.span-4 {
    width: 50% !important;
    -webkit-flex-basis: 50% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-8 > *.span-4 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-8 > *.span-4-belowDesktop {
    width: 50% !important;
    -webkit-flex-basis: 50% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-8 > *.span-4-belowTablet {
    width: 50% !important;
    -webkit-flex-basis: 50% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-8 > *.span-4-tablet {
    width: 50% !important;
    -webkit-flex-basis: 50% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-8 > *.span-4-mobile {
    width: 50% !important;
    -webkit-flex-basis: 50% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-8 > *.offset-4 {
    margin-left: 50% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-8 > *.offset-4 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-8 > *.offset-4-belowDesktop {
    margin-left: 50% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-8 > *.offset-4-tablet {
    margin-left: 50% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-8 > *.offset-4-mobile {
    margin-left: 50% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-8 > *.span-5 {
    width: 62.5% !important;
    -webkit-flex-basis: 62.5% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-8 > *.span-5 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-8 > *.span-5-belowDesktop {
    width: 62.5% !important;
    -webkit-flex-basis: 62.5% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-8 > *.span-5-belowTablet {
    width: 62.5% !important;
    -webkit-flex-basis: 62.5% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-8 > *.span-5-tablet {
    width: 62.5% !important;
    -webkit-flex-basis: 62.5% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-8 > *.span-5-mobile {
    width: 62.5% !important;
    -webkit-flex-basis: 62.5% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-8 > *.offset-5 {
    margin-left: 62.5% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-8 > *.offset-5 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-8 > *.offset-5-belowDesktop {
    margin-left: 62.5% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-8 > *.offset-5-tablet {
    margin-left: 62.5% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-8 > *.offset-5-mobile {
    margin-left: 62.5% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-8 > *.span-6 {
    width: 75% !important;
    -webkit-flex-basis: 75% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-8 > *.span-6 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-8 > *.span-6-belowDesktop {
    width: 75% !important;
    -webkit-flex-basis: 75% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-8 > *.span-6-belowTablet {
    width: 75% !important;
    -webkit-flex-basis: 75% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-8 > *.span-6-tablet {
    width: 75% !important;
    -webkit-flex-basis: 75% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-8 > *.span-6-mobile {
    width: 75% !important;
    -webkit-flex-basis: 75% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-8 > *.offset-6 {
    margin-left: 75% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-8 > *.offset-6 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-8 > *.offset-6-belowDesktop {
    margin-left: 75% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-8 > *.offset-6-tablet {
    margin-left: 75% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-8 > *.offset-6-mobile {
    margin-left: 75% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-8 > *.span-7 {
    width: 87.5% !important;
    -webkit-flex-basis: 87.5% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-8 > *.span-7 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-8 > *.span-7-belowDesktop {
    width: 87.5% !important;
    -webkit-flex-basis: 87.5% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-8 > *.span-7-belowTablet {
    width: 87.5% !important;
    -webkit-flex-basis: 87.5% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-8 > *.span-7-tablet {
    width: 87.5% !important;
    -webkit-flex-basis: 87.5% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-8 > *.span-7-mobile {
    width: 87.5% !important;
    -webkit-flex-basis: 87.5% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-8 > *.offset-7 {
    margin-left: 87.5% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-8 > *.offset-7 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-8 > *.offset-7-belowDesktop {
    margin-left: 87.5% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-8 > *.offset-7-tablet {
    margin-left: 87.5% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-8 > *.offset-7-mobile {
    margin-left: 87.5% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-8 > *.span-8 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-8 > *.span-8 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-8 > *.span-8-belowDesktop {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-8 > *.span-8-belowTablet {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-8 > *.span-8-tablet {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-8 > *.span-8-mobile {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-8 > *.offset-8 {
    margin-left: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-8 > *.offset-8 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-8 > *.offset-8-belowDesktop {
    margin-left: 100% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-8 > *.offset-8-tablet {
    margin-left: 100% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-8 > *.offset-8-mobile {
    margin-left: 100% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-8 > *.span-9 {
    width: 112.5% !important;
    -webkit-flex-basis: 112.5% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-8 > *.span-9 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-8 > *.span-9-belowDesktop {
    width: 112.5% !important;
    -webkit-flex-basis: 112.5% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-8 > *.span-9-belowTablet {
    width: 112.5% !important;
    -webkit-flex-basis: 112.5% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-8 > *.span-9-tablet {
    width: 112.5% !important;
    -webkit-flex-basis: 112.5% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-8 > *.span-9-mobile {
    width: 112.5% !important;
    -webkit-flex-basis: 112.5% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-8 > *.offset-9 {
    margin-left: 112.5% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-8 > *.offset-9 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-8 > *.offset-9-belowDesktop {
    margin-left: 112.5% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-8 > *.offset-9-tablet {
    margin-left: 112.5% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-8 > *.offset-9-mobile {
    margin-left: 112.5% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-8 > *.span-10 {
    width: 125% !important;
    -webkit-flex-basis: 125% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-8 > *.span-10 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-8 > *.span-10-belowDesktop {
    width: 125% !important;
    -webkit-flex-basis: 125% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-8 > *.span-10-belowTablet {
    width: 125% !important;
    -webkit-flex-basis: 125% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-8 > *.span-10-tablet {
    width: 125% !important;
    -webkit-flex-basis: 125% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-8 > *.span-10-mobile {
    width: 125% !important;
    -webkit-flex-basis: 125% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-8 > *.offset-10 {
    margin-left: 125% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-8 > *.offset-10 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-8 > *.offset-10-belowDesktop {
    margin-left: 125% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-8 > *.offset-10-tablet {
    margin-left: 125% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-8 > *.offset-10-mobile {
    margin-left: 125% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-8 > *.span-11 {
    width: 137.5% !important;
    -webkit-flex-basis: 137.5% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-8 > *.span-11 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-8 > *.span-11-belowDesktop {
    width: 137.5% !important;
    -webkit-flex-basis: 137.5% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-8 > *.span-11-belowTablet {
    width: 137.5% !important;
    -webkit-flex-basis: 137.5% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-8 > *.span-11-tablet {
    width: 137.5% !important;
    -webkit-flex-basis: 137.5% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-8 > *.span-11-mobile {
    width: 137.5% !important;
    -webkit-flex-basis: 137.5% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-8 > *.offset-11 {
    margin-left: 137.5% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-8 > *.offset-11 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-8 > *.offset-11-belowDesktop {
    margin-left: 137.5% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-8 > *.offset-11-tablet {
    margin-left: 137.5% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-8 > *.offset-11-mobile {
    margin-left: 137.5% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-8 > *.span-12 {
    width: 150% !important;
    -webkit-flex-basis: 150% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-8 > *.span-12 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-8 > *.span-12-belowDesktop {
    width: 150% !important;
    -webkit-flex-basis: 150% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-8 > *.span-12-belowTablet {
    width: 150% !important;
    -webkit-flex-basis: 150% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-8 > *.span-12-tablet {
    width: 150% !important;
    -webkit-flex-basis: 150% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-8 > *.span-12-mobile {
    width: 150% !important;
    -webkit-flex-basis: 150% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-8 > *.offset-12 {
    margin-left: 150% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-8 > *.offset-12 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-8 > *.offset-12-belowDesktop {
    margin-left: 150% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-8 > *.offset-12-tablet {
    margin-left: 150% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-8 > *.offset-12-mobile {
    margin-left: 150% !important;
  }
}

.gridBlock-columns-12 > * {
  position: relative;
  width: 8.3333333333% !important;
  -webkit-flex-basis: 8.3333333333% !important;
}

@media (max-width: 840px) {
  .gridBlock-columns-12 > * {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-12 > *.span-0 {
    width: 0% !important;
    -webkit-flex-basis: 0% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-12 > *.span-0 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-12 > *.span-0-belowDesktop {
    width: 0% !important;
    -webkit-flex-basis: 0% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-12 > *.span-0-belowTablet {
    width: 0% !important;
    -webkit-flex-basis: 0% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-12 > *.span-0-tablet {
    width: 0% !important;
    -webkit-flex-basis: 0% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-12 > *.span-0-mobile {
    width: 0% !important;
    -webkit-flex-basis: 0% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-12 > *.offset-0 {
    margin-left: 0% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-12 > *.offset-0 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-12 > *.offset-0-belowDesktop {
    margin-left: 0% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-12 > *.offset-0-tablet {
    margin-left: 0% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-12 > *.offset-0-mobile {
    margin-left: 0% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-12 > *.span-1 {
    width: 8.3333333333% !important;
    -webkit-flex-basis: 8.3333333333% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-12 > *.span-1 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-12 > *.span-1-belowDesktop {
    width: 8.3333333333% !important;
    -webkit-flex-basis: 8.3333333333% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-12 > *.span-1-belowTablet {
    width: 8.3333333333% !important;
    -webkit-flex-basis: 8.3333333333% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-12 > *.span-1-tablet {
    width: 8.3333333333% !important;
    -webkit-flex-basis: 8.3333333333% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-12 > *.span-1-mobile {
    width: 8.3333333333% !important;
    -webkit-flex-basis: 8.3333333333% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-12 > *.offset-1 {
    margin-left: 8.3333333333% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-12 > *.offset-1 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-12 > *.offset-1-belowDesktop {
    margin-left: 8.3333333333% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-12 > *.offset-1-tablet {
    margin-left: 8.3333333333% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-12 > *.offset-1-mobile {
    margin-left: 8.3333333333% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-12 > *.span-2 {
    width: 16.6666666667% !important;
    -webkit-flex-basis: 16.6666666667% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-12 > *.span-2 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-12 > *.span-2-belowDesktop {
    width: 16.6666666667% !important;
    -webkit-flex-basis: 16.6666666667% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-12 > *.span-2-belowTablet {
    width: 16.6666666667% !important;
    -webkit-flex-basis: 16.6666666667% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-12 > *.span-2-tablet {
    width: 16.6666666667% !important;
    -webkit-flex-basis: 16.6666666667% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-12 > *.span-2-mobile {
    width: 16.6666666667% !important;
    -webkit-flex-basis: 16.6666666667% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-12 > *.offset-2 {
    margin-left: 16.6666666667% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-12 > *.offset-2 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-12 > *.offset-2-belowDesktop {
    margin-left: 16.6666666667% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-12 > *.offset-2-tablet {
    margin-left: 16.6666666667% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-12 > *.offset-2-mobile {
    margin-left: 16.6666666667% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-12 > *.span-3 {
    width: 25% !important;
    -webkit-flex-basis: 25% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-12 > *.span-3 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-12 > *.span-3-belowDesktop {
    width: 25% !important;
    -webkit-flex-basis: 25% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-12 > *.span-3-belowTablet {
    width: 25% !important;
    -webkit-flex-basis: 25% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-12 > *.span-3-tablet {
    width: 25% !important;
    -webkit-flex-basis: 25% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-12 > *.span-3-mobile {
    width: 25% !important;
    -webkit-flex-basis: 25% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-12 > *.offset-3 {
    margin-left: 25% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-12 > *.offset-3 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-12 > *.offset-3-belowDesktop {
    margin-left: 25% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-12 > *.offset-3-tablet {
    margin-left: 25% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-12 > *.offset-3-mobile {
    margin-left: 25% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-12 > *.span-4 {
    width: 33.3333333333% !important;
    -webkit-flex-basis: 33.3333333333% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-12 > *.span-4 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-12 > *.span-4-belowDesktop {
    width: 33.3333333333% !important;
    -webkit-flex-basis: 33.3333333333% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-12 > *.span-4-belowTablet {
    width: 33.3333333333% !important;
    -webkit-flex-basis: 33.3333333333% !important;
  }
}
/* added by jvl  */
@media (max-height: 480px) and (min-width: 568px)  {
  .gridBlock-columns-12 > *.span-4-landscape-belowTablet {
    width: 66.6% !important;
    -webkit-flex-basis: 66.6% !important;
  }
}
/* end added by jvl */
@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-12 > *.span-4-tablet {
    width: 33.3333333333% !important;
    -webkit-flex-basis: 33.3333333333% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-12 > *.span-4-mobile {
    width: 33.3333333333% !important;
    -webkit-flex-basis: 33.3333333333% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-12 > *.offset-4 {
    margin-left: 33.3333333333% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-12 > *.offset-4 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-12 > *.offset-4-belowDesktop {
    margin-left: 33.3333333333% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-12 > *.offset-4-tablet {
    margin-left: 33.3333333333% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-12 > *.offset-4-mobile {
    margin-left: 33.3333333333% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-12 > *.span-5 {
    width: 41.6666666667% !important;
    -webkit-flex-basis: 41.6666666667% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-12 > *.span-5 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-12 > *.span-5-belowDesktop {
    width: 41.6666666667% !important;
    -webkit-flex-basis: 41.6666666667% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-12 > *.span-5-belowTablet {
    width: 41.6666666667% !important;
    -webkit-flex-basis: 41.6666666667% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-12 > *.span-5-tablet {
    width: 41.6666666667% !important;
    -webkit-flex-basis: 41.6666666667% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-12 > *.span-5-mobile {
    width: 41.6666666667% !important;
    -webkit-flex-basis: 41.6666666667% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-12 > *.offset-5 {
    margin-left: 41.6666666667% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-12 > *.offset-5 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-12 > *.offset-5-belowDesktop {
    margin-left: 41.6666666667% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-12 > *.offset-5-tablet {
    margin-left: 41.6666666667% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-12 > *.offset-5-mobile {
    margin-left: 41.6666666667% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-12 > *.span-6 {
    width: 50% !important;
    -webkit-flex-basis: 50% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-12 > *.span-6 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-12 > *.span-6-belowDesktop {
    width: 50% !important;
    -webkit-flex-basis: 50% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-12 > *.span-6-belowTablet {
    width: 50% !important;
    -webkit-flex-basis: 50% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-12 > *.span-6-tablet {
    width: 50% !important;
    -webkit-flex-basis: 50% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-12 > *.span-6-mobile {
    width: 50% !important;
    -webkit-flex-basis: 50% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-12 > *.offset-6 {
    margin-left: 50% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-12 > *.offset-6 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-12 > *.offset-6-belowDesktop {
    margin-left: 50% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-12 > *.offset-6-tablet {
    margin-left: 50% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-12 > *.offset-6-mobile {
    margin-left: 50% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-12 > *.span-7 {
    width: 58.3333333333% !important;
    -webkit-flex-basis: 58.3333333333% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-12 > *.span-7 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-12 > *.span-7-belowDesktop {
    width: 58.3333333333% !important;
    -webkit-flex-basis: 58.3333333333% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-12 > *.span-7-belowTablet {
    width: 58.3333333333% !important;
    -webkit-flex-basis: 58.3333333333% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-12 > *.span-7-tablet {
    width: 58.3333333333% !important;
    -webkit-flex-basis: 58.3333333333% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-12 > *.span-7-mobile {
    width: 58.3333333333% !important;
    -webkit-flex-basis: 58.3333333333% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-12 > *.offset-7 {
    margin-left: 58.3333333333% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-12 > *.offset-7 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-12 > *.offset-7-belowDesktop {
    margin-left: 58.3333333333% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-12 > *.offset-7-tablet {
    margin-left: 58.3333333333% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-12 > *.offset-7-mobile {
    margin-left: 58.3333333333% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-12 > *.span-8 {
    width: 66.6666666667% !important;
    -webkit-flex-basis: 66.6666666667% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-12 > *.span-8 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-12 > *.span-8-belowDesktop {
    width: 66.6666666667% !important;
    -webkit-flex-basis: 66.6666666667% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-12 > *.span-8-belowTablet {
    width: 66.6666666667% !important;
    -webkit-flex-basis: 66.6666666667% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-12 > *.span-8-tablet {
    width: 66.6666666667% !important;
    -webkit-flex-basis: 66.6666666667% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-12 > *.span-8-mobile {
    width: 66.6666666667% !important;
    -webkit-flex-basis: 66.6666666667% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-12 > *.offset-8 {
    margin-left: 66.6666666667% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-12 > *.offset-8 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-12 > *.offset-8-belowDesktop {
    margin-left: 66.6666666667% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-12 > *.offset-8-tablet {
    margin-left: 66.6666666667% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-12 > *.offset-8-mobile {
    margin-left: 66.6666666667% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-12 > *.span-9 {
    width: 75% !important;
    -webkit-flex-basis: 75% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-12 > *.span-9 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-12 > *.span-9-belowDesktop {
    width: 75% !important;
    -webkit-flex-basis: 75% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-12 > *.span-9-belowTablet {
    width: 75% !important;
    -webkit-flex-basis: 75% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-12 > *.span-9-tablet {
    width: 75% !important;
    -webkit-flex-basis: 75% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-12 > *.span-9-mobile {
    width: 75% !important;
    -webkit-flex-basis: 75% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-12 > *.offset-9 {
    margin-left: 75% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-12 > *.offset-9 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-12 > *.offset-9-belowDesktop {
    margin-left: 75% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-12 > *.offset-9-tablet {
    margin-left: 75% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-12 > *.offset-9-mobile {
    margin-left: 75% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-12 > *.span-10 {
    width: 83.3333333333% !important;
    -webkit-flex-basis: 83.3333333333% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-12 > *.span-10 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-12 > *.span-10-belowDesktop {
    width: 83.3333333333% !important;
    -webkit-flex-basis: 83.3333333333% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-12 > *.span-10-belowTablet {
    width: 83.3333333333% !important;
    -webkit-flex-basis: 83.3333333333% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-12 > *.span-10-tablet {
    width: 83.3333333333% !important;
    -webkit-flex-basis: 83.3333333333% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-12 > *.span-10-mobile {
    width: 83.3333333333% !important;
    -webkit-flex-basis: 83.3333333333% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-12 > *.offset-10 {
    margin-left: 83.3333333333% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-12 > *.offset-10 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-12 > *.offset-10-belowDesktop {
    margin-left: 83.3333333333% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-12 > *.offset-10-tablet {
    margin-left: 83.3333333333% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-12 > *.offset-10-mobile {
    margin-left: 83.3333333333% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-12 > *.span-11 {
    width: 91.6666666667% !important;
    -webkit-flex-basis: 91.6666666667% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-12 > *.span-11 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-12 > *.span-11-belowDesktop {
    width: 91.6666666667% !important;
    -webkit-flex-basis: 91.6666666667% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-12 > *.span-11-belowTablet {
    width: 91.6666666667% !important;
    -webkit-flex-basis: 91.6666666667% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-12 > *.span-11-tablet {
    width: 91.6666666667% !important;
    -webkit-flex-basis: 91.6666666667% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-12 > *.span-11-mobile {
    width: 91.6666666667% !important;
    -webkit-flex-basis: 91.6666666667% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-12 > *.offset-11 {
    margin-left: 91.6666666667% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-12 > *.offset-11 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-12 > *.offset-11-belowDesktop {
    margin-left: 91.6666666667% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-12 > *.offset-11-tablet {
    margin-left: 91.6666666667% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-12 > *.offset-11-mobile {
    margin-left: 91.6666666667% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-12 > *.span-12 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-12 > *.span-12 {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-12 > *.span-12-belowDesktop {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 767px) {
  .gridBlock-columns-12 > *.span-12-belowTablet {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-12 > *.span-12-tablet {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-12 > *.span-12-mobile {
    width: 100% !important;
    -webkit-flex-basis: 100% !important;
  }
}

@media (min-width: 768px) {
  .gridBlock-columns-12 > *.offset-12 {
    margin-left: 100% !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-12 > *.offset-12 {
    margin-left: 0 !important;
  }
}

@media (max-width: 840px) {
  .gridBlock-columns-12 > *.offset-12-belowDesktop {
    margin-left: 100% !important;
  }
}

@media (min-width: 481px) and (max-width: 768px) {
  .gridBlock-columns-12 > *.offset-12-tablet {
    margin-left: 100% !important;
  }
}

@media (max-width: 480px) {
  .gridBlock-columns-12 > *.offset-12-mobile {
    margin-left: 100% !important;
  }
}
/* tilføjet af JVL  */
@media (min-width: 769px) {
	.logo-width-Desktop {
		width: 67% !important;
	}
}
@media (max-width:480px) {
	.logo-width-below-Desktop {
		width: 25% ! important;
		margin-left: 70% !important;
		position: relative !important;
		top: 64px !important;
	}
}
@media (min-width: 481px) and (max-width: 768px) {
	.logo-width-below-Desktop {
		width: 25% ! important;
		margin-left: 70% !important;
		position: relative !important;
		top: -64px !important;
	}
}
/* end added by jvl */
body {
  -webkit-font-smoothing: subpixel-antialiased;
}

h1, h2, h3, h4, h5, h6, p, a, li, td, button, label,
input[type="text"],
input[type="email"],
input[type="tel"],
select {
  font-family: "Raleway", "Roboto", "Helvetica Neue", sans-serif;
  color: #282828;   /*color: #454a73;  changed by jvl after intro*/
  -webkit-font-variant-ligatures: none;
     -moz-font-variant-ligatures: none;
          font-variant-ligatures: none;
}

h1, h2, h3, h4, h5, h6 {
  line-height: 1.3;
}

p,
td,
label,
input[type="text"],
input[type="email"],
input[type="tel"],
select {
  font-size: 13px;   /*  font-size: 14px;  changed by jvl after intro*/
  line-height: 1.5;
  color: #282828;   /*color: #454a73;  changed by jvl after intro*/
}

label {
  font-weight: 600;
}

a {
  color: #00c878;
  font-weight: 600;
  text-decoration: none;
}

a.small {
  font-size: 12px;
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

.zombiecontainer_important {
  width: 100% !important;
  height: auto !important;
}

/*   jvl til Andreas*/
.center-me {
    display: block;
    margin-left: auto;
    margin-right: auto;
    width: 70%;
}

@media (max-width: 767px) {
	.center-me {
/*		width: 50%;   til Andreas */
	}
}

@media (max-width: 1023px) {
	.center-me {
		width: 50%;
	}
}
/* slut jvl  til Andreas */

.btn {
  position: relative;
  display: inline-block;
  border-radius: 100px;
  text-transform: uppercase;
  font-size: 11px; /*font-size: 12px;    ændring jvl 22-10-2018   */
  letter-spacing: 1px;
  font-weight: 700;
  height: 38px;
  white-space: nowrap;
  font-family: "Raleway", "Roboto", "Helvetica Neue", sans-serif;
  line-height: 1;
}

.btn_inner {
  width: calc(100% - 2px);
  height: calc(100% - 2px);
  margin-top: 1px;
  margin-left: 1px;
  border-radius: 100px;
  padding: 12px 32px;
}

.btn {
  cursor: pointer;
  text-decoration: none;
}

.btn-cursor-pointer {   /* new class from jvl after intro  */
  cursor: pointer;
  text-decoration: none;
}

.btn-small {
  height: 26px;
  font-size: 11px;
}

.btn-small > * {
  padding: 6px 16px;
  padding-top: 7px;
}

.btn-withDivider:before, .btn-withDivider:after {
  content: '';
  position: absolute;
  top: 50%;
  height: 1px;
  width: 50vw;
  background-color: #e9e9ee;
}

.btn-withDivider:before {
  right: 100%;
}

.btn-withDivider:after {
  left: 100%;
}

.btn-svg {
  height: 38px;
  position: relative;
  display: inline-block;
}

.btn-svg img {
  height: 100%;
}

.btn-svg img:not(:first-child) {
  position: absolute;
  left: 0;
  top: 0;
}

.btn-svg img:not(:first-child):active {
  display: none;
}

.btn-svg-small {
  height: 26px;
}

.btn-primary {
  background-color: #00c878;
  background: linear-gradient(to bottom, #26d08c 0%, #00b26b 100%);
}

.btn-primary > * {
  color: white;
}

.btn-primary .btn_inner {
  background-color: #00c878;
  background: linear-gradient(to bottom, #4dd9a1 0%, #00c878 100%);
}

.btn-primary .btn_inner:active, .btn-primary .btn_inner.active {
  background: linear-gradient(to top, #4dd9a1 0%, #00c878 100%);
}

.btn-base {
  background-color: #454a73;
  background: linear-gradient(to bottom, #616588 0%, #3d4266 100%);
}

.btn-base > * {
  color: white;
}

.btn-base .btn_inner {
  background-color: #454a73;
  background: linear-gradient(to bottom, #7d809d 0%, #454a73 100%);
}

.btn-base .btn_inner:active, .btn-base .btn_inner.active {
  background: linear-gradient(to top, #7d809d 0%, #454a73 100%);
}

.btn-light {
  background-color: #fbfbfc;
  background: linear-gradient(to bottom, #f4f4f7 0%, #dadbe3 100%);
}

.btn-light > * {
  color: #454a73;
}

.btn-light .btn_inner {
  background-color: #f4f4f7;
  background: linear-gradient(to bottom, #fbfbfc 0%, #e9e9ee 100%);
}

.btn-light .btn_inner:active, .btn-light .btn_inner.active {
  background: linear-gradient(to top, #fbfbfc 0%, #e9e9ee 100%);
}

.btn-dismiss {
  background-color: #ff3c32;
  background: linear-gradient(to bottom, #ff5951 0%, #e3352d 100%);
}

.btn-dismiss > * {
  color: white;
}

.btn-dismiss .btn_inner {
  background-color: #e3352d;
  background: linear-gradient(to bottom, #ff7770 0%, #ff3c32 100%);
}

.btn-dismiss .btn_inner:active, .btn-dismiss .btn_inner.active {
  background: linear-gradient(to top, #ff7770 0%, #ff3c32 100%);
}

.btn-control {
  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;
  min-width: 40px;
  max-width: 40px;
  height: 40px;
  border-radius: 50%;
  /* background: #fbfbfc; */
  /* background: linear-gradient(to bottom, #f4f4f7 0%, #dadbe3 100%); */
  background: #cfd1df;
}

/*   indført af jvl NB Andreas 14-08-2018   */
@media (max-width: 375px){
	.btn-control {
		min-width: 	35px !important;
		max-width: 	35px !important;
		height: 	35px !important;
	}
}

.btn-control-dark {
  background: #454a73;
  background: linear-gradient(to bottom, #616588 0%, #3d4266 100%);
}

.btn-control-primary {
  background: #00c878;
  background: linear-gradient(to bottom, #26d08c 0%, #00b26b 100%);
}

.btn-control-dismiss {
  background: #ff3c32;
  background: linear-gradient(to bottom, #ff5951 0%, #e3352d 100%);
}

.btn-control_inner {
  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;
  width: 38px;
  height: 38px;
  padding-left: 2px;
  border-radius: inherit;
  background: #f4f4f7;
  background: linear-gradient(to bottom, #fbfbfc 0%, #e9e9ee 100%);
}

.btn-control_inner:active, .btn-control_inner.active {
  background: linear-gradient(to top, #fbfbfc 0%, #e9e9ee 100%);
}

.btn-control_inner-dark {
  background: #3d4266;
  background: linear-gradient(to bottom, #7d809d 0%, #454a73 100%);
}

.btn-control_inner-dark:active, .btn-control_inner-dark.active {
  background: linear-gradient(to top, #7d809d 0%, #454a73 100%);
}

.btn-control_inner-primary {
  background: #00b26b;
  background: linear-gradient(to bottom, #4dd9a1 0%, #00c878 100%);
}

.btn-control_inner-primary:active, .btn-control_inner-primary.active {
  background: linear-gradient(to top, #4dd9a1 0%, #00c878 100%);
}

.btn-control_inner-dismiss {
  background: #e3352d;
  background: linear-gradient(to bottom, #ff7770 0%, #ff3c32 100%);
}

.btn-control_inner-dismiss:active, .btn-control_inner-dismiss.active {
  background: linear-gradient(to top, #ff7770 0%, #ff3c32 100%);
}

.btnGroup {
  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;
}

.btnGroup-vertical {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}

.btnGroupWrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  bottom: 0;
  left: 0;
  z-index: 1;
  background-color: #f4f4f7;
  padding: 16px;
}

@media (max-width: 1024px) {
  .btnGroupWrap {
    border-top: 1px solid #e9e9ee;
    position: fixed !important;
  }
}

textarea {
  width: 100%;
  padding-top: 24px;
  padding-bottom: 24px;
  padding-left: 32px;
  padding-right: 32px;
  color: #454a73;
  font-family: "Raleway", "Roboto", "Helvetica Neue", sans-serif;
}

textarea:focus {
  outline: none;
}

.burger {
  cursor: pointer;
  height: 22px;
  width: 28px;
}

.burger span {
  display: block;
  position: absolute;
  height: 3px;
  width: 28px;
  background: #454a73;
  opacity: 1;
  left: 0;
  -webkit-transform: rotate(0deg);
          transform: rotate(0deg);
  transition: .25s ease-in-out;
}

.burger span:nth-child(1) {
  top: 0px;
  -webkit-transform-origin: left center;
          transform-origin: left center;
}

.burger span:nth-child(2) {
  top: 9px;
  -webkit-transform-origin: left center;
          transform-origin: left center;
}

.burger span:nth-child(3) {
  top: 18px;
  -webkit-transform-origin: left center;
          transform-origin: left center;
}

.burger:active span:nth-child(1), .burger-active span:nth-child(1) {
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
  top: -1px;
  left: 4px;
}

.burger:active span:nth-child(2), .burger-active span:nth-child(2) {
  width: 0%;
  opacity: 0;
}

.burger:active span:nth-child(3), .burger-active span:nth-child(3) {
  -webkit-transform: rotate(-45deg);
          transform: rotate(-45deg);
  top: 19px;
  left: 4px;
}

.controlBar {
  position: fixed;
  bottom: 0;
  width: 100vw;
  background-color: #f4f4f7;
  padding: 12px 0 12px;   /* padding: 32px 0 32px; changed by jvl 05-08-2019   */
  border-top: 1px solid #e9e9ee;
  z-index: 999;
}

@media (min-width: 1400px) {    /* @media (max-width: 1400px) changed by jvl after intro 05-08-2019 */
  .controlBar {
    padding: 16px 0 16px;
  }
}

@media (max-width: 1024px) {    /*  @media (max-width: 480px) { changed by jvl after intro */
  .controlBar {
    padding: 8px 0 8px;
  }
}

.controlBar_boxExplanation {
  position: absolute;
  top: 0px;
  -webkit-transform: translateY(-100%);
          transform: translateY(-100%);
}

@media (min-width: 1025px) {
  .controlBar_boxExplanation {
    position: relative;
    top: -32px;
  }
}

.controlBar_breadcrumbWrap {
  width: 100%;
  background-color: rgba(233, 233, 238, 0.9);
  position: absolute;
  top: 0;
  -webkit-transform: translateY(-100%);
          transform: translateY(-100%);
}

.controlBar_breadcrumb {
  list-style: none;
  font-size: 11px;
  padding-top: 6px;
  padding-bottom: 4px;
}

.controlBar_breadcrumb li {
  display: inline-block;
  margin: 2px 0;
}

.controlBar_breadcrumb li, .controlBar_breadcrumb a {
  font-family: "Roboto", "Helvetica Neue", sans-serif;
  font-weight: 500;
}

.controlBar_buttons {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
}

@media (max-width: 1024px) {
  .controlBar_buttons {
    -webkit-box-pack: end;
        -ms-flex-pack: end;
            justify-content: flex-end;
  }
}

@media (max-width: 767px) {
  .controlBar_buttons {
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    padding: 0 32px;
  }
}

.controlBar_buttons-SVG {
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
}

.controlBar_buttons .btn-control {
  margin-bottom: 8px;
}

.controlBar_time {
  position: absolute;
  height: 100%;
  font-size: 24px;
  line-height: 40px;
  font-weight: 600;
  font-family: "Roboto", "Helvetica Neue", sans-serif;
}

@media (max-width: 767px) {
  .controlBar_time {
    max-width: 40px;
    position: fixed;
    height: auto;
    font-size: 12px;
    bottom: 16px;
    right: 32px;
  }
}

@media (max-width: 480px) {
  .controlBar_time {
    bottom: 8px;
    right: 16px;
  }
}

.progressBar {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
  list-style: none;
  position: absolute;
  bottom: 0;
  width: 100%;
  z-index: 10000;
}

.progressBar-done .progressBar_step {
  background-color: #00c878;
}

.progressBar_step {
  height: 8px;
  position: relative;
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  background-color: #454a73;
  margin-right: 2px;
  transition: -webkit-transform 300ms ease-out;
  transition: transform 300ms ease-out;
  -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0);
   max-width: 200px;   /*   new jvl 27-09-2018   */
}
/*  new class jvl 20-09-2018  */
.progressBar_step-button{
	/* cursor: pointer; */
	text-decoration: none;
}
.progressBar_step-current {
	height: 12px !important;
}
/* end new class */
@-webkit-keyframes toFullWidth {
  0% {
    -webkit-transform: scale3d(0, 1, 1);
            transform: scale3d(0, 1, 1);
  }
  100% {
    -webkit-transform: scale3d(1, 1, 1);
            transform: scale3d(1, 1, 1);
  }
}

@keyframes toFullWidth {
  0% {
    -webkit-transform: scale3d(0, 1, 1);
            transform: scale3d(0, 1, 1);
  }
  100% {
    -webkit-transform: scale3d(1, 1, 1);
            transform: scale3d(1, 1, 1);
  }
}

.progressBar_step .completion {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #00c878;
  -webkit-transform-origin: left;
          transform-origin: left;
  -webkit-transform: scale3d(0, 1, 1);
          transform: scale3d(0, 1, 1);
  -webkit-animation: none;
          animation: none;
  -webkit-animation-play-state: running;
          animation-play-state: running;
}

.progressBar_step:last-child {
  margin-right: 0;
}

.progressBar_step.done {
  background-color: #00c878;
}

.progressBar_step.done .thumbnail-withText {
  border-color: #00c878;
}

.progressBar_step.done .thumbnail-withText:after {
   background-color: rgba(0, 200, 120, 0.5);    /*background-color: rgba(0, 200, 120, 0.8); jvl ændring fra Andreas    */
}

.progressBar_step.active {
  -webkit-transform: translate3d(0, 8px, 0);
          transform: translate3d(0, 8px, 0);
}

.progressBar_step .thumbnail-withText {
  position: absolute;
  -webkit-transform: translateY(-100%);
          transform: translateY(-100%);
  border: 8px solid #454a73;
  border-bottom: 0;
}
/*  new class JVL 09-09-2018   */
.progressBar_step .thumbnail-withText-right {
	right: 0;
}
/*  slettet af JVL 19-09-2018
.progressBar_step:nth-last-child(-n+3) .thumbnail-withText {
  right: 0;
}
*/
@-webkit-keyframes shrinkStep {
  from {
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
    box-shadow: 0px 0px 0px 10000px rgba(244, 244, 247, 0.8);
  }
  to {
    -webkit-transform: translate3d(0, 32px, 0);
            transform: translate3d(0, 32px, 0);
    box-shadow: none;
  }
}

@keyframes shrinkStep {
  from {
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
    box-shadow: 0px 0px 0px 10000px rgba(244, 244, 247, 0.8);
  }
  to {
    -webkit-transform: translate3d(0, 32px, 0);
            transform: translate3d(0, 32px, 0);
    box-shadow: none;
  }
}

.progressBar.firstVisit .progressBar_step:first-child {
  height: 40px;
  -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0);
  box-shadow: 0px 0px 0px 10000px rgba(244, 244, 247, 0.8);
  -webkit-animation: shrinkStep 0.25s 5s ease-out forwards;
          animation: shrinkStep 0.25s 5s ease-out forwards;
}

.progressBar.firstVisit .progressBar_step:first-child:after {
  content: 'Hover og følg din fremgang på disse trin';
  position: absolute;
  top: 8px;
  left: calc( 100% + 4px);
  max-width: 100%;
  font-size: 12px;
  font-weight: bold;
  color: #454a73;
  background-color: transparent;
  white-space: nowrap;
}

.thumbnailPanel {
  position: absolute;
  top: 0;
  white-space: nowrap;
  background: #454a73;
  width: 100%;
  height: 120px;
  -webkit-transform: translate3d(0, -120px, 0);
          transform: translate3d(0, -120px, 0);
  z-index: -2;
  transition: all 300ms cubic-bezier(0.25, 0.75, 0.25, 1);
}

.thumbnailPanel_close {
  cursor: pointer;
  position: absolute;
  top: 17px;
  right: 17px;
  width: 12px;
  height: 12px;
  z-index: 2;
}

.thumbnailPanel_close polygon {
  fill: #1c1e2f;
}

.thumbnailPanel_inner {
  width: 100%;
  height: 100%;
  padding: 0 20px;
  overflow-x: scroll;
  overflow-y: hidden;
}

.thumbnailPanel_inner::-webkit-scrollbar {
  height: 4px;
}

.thumbnailPanel_inner::-webkit-scrollbar-track {
  background: #454a73;
}

.thumbnailPanel_inner::-webkit-scrollbar-thumb {
  background: #00c878;
}

.thumbnailPanel-hidden {
  -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0);
}

.thumbnailPanel_left, .thumbnailPanel_right {
  position: absolute;
  height: 32px;
  width: 32px;
  background-color: rgba(69, 74, 115, 0.8);
  border: 1px solid #454a73;
  border-radius: 50%;
  padding: 4px;
  top: calc( 50% - 16px);
  z-index: 2;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  cursor: pointer;
  transition: background-color 0.15s ease-out;
}

.thumbnailPanel_left img, .thumbnailPanel_right img {
  height: 12px;
}

.thumbnailPanel_left:hover, .thumbnailPanel_right:hover {
  background-color: #3d4266;
}

.thumbnailPanel_left {
  left: 8px;
}

.thumbnailPanel_left img {
  margin-left: 7px;
}

.thumbnailPanel_right {
  right: 8px;
}

.thumbnailPanel_right img {
  margin-left: 9px;
}

.thumbnail {
  display: inline-block;
  white-space: normal;
  position: relative;
  width: 138px;
  margin: 8px 0 8px 4px;
}

.thumbnail_image {
  display: block;
  cursor: pointer;
  opacity: 1;
  width: 100%;
  transition: opacity 150ms ease-in;
}

.thumbnail_image:hover {
  opacity: 0.03;
}

.thumbnail_text {
  width: 100%;
  height: 150px;   /*  height: 100px;   jvl 29-09-2018  */
  overflow: hidden;
  text-overflow: ellipsis;
  position: absolute;
  top: 0;
  padding: 8px;
  color: #f4f4f7;
  font-size: 11px;
  z-index: -1;
}

.thumbnail-current {
  border: 1px solid #f4f4f7;
}

.thumbnail-current:before {
  opacity: 1;
  transition: opacity 0.15s ease-out;
}

.thumbnail-current:hover:before {
  opacity: 0;
}

.thumbnail-withText {
  display: none;
   min-width: 200px;     /* min-width: 250px; jvl 27-09-2018   */
  margin: 0;
  opacity: 0;
  -webkit-animation: fadeIn 0.15s ease-out forwards;
          animation: fadeIn 0.15s ease-out forwards;
}

@media (max-width: 480px) {
  .thumbnail-withText {
    min-width: 200px;
  }
}

.thumbnail-withText:after {
  content: '';
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  z-index: 0;
  background-color: rgba(69, 74, 115, 0.6);
}

.thumbnail-withText .thumbnail_text {
  font-size: 14px;
  padding: 16px;
  z-index: 1;
}
/*  new class jvl 27-09-2018*/
.thumbnail_text_italic {
  font-size: 11px;
  font-style: italic;
}
/* end new class */

.thumbnail-withText.active {
  display: inline-block;
}

.statements-expandedImage {
  position: absolute;
  right: 0;
  top: 0;
  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;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  height: 200px;}

@media (min-width:768px){   /* added by jvl  */
	.statements-expandedImage .statement .answers li {
		min-width: 36px;
		height: 36px;
	}

	.statements-expandedImage .statement .answers label {
		padding-top: 12px;
		font-size: 11px;
	}
}/* added by jvl  */

@media (max-width:767px){   /* added by jvl  dette afsnit er helt nyt. */
	.statements-expandedImage .statement .answers li {
		min-width: 28px;
		height: 28px;
	}

	.statements-expandedImage .statement .answers label {
		padding-top: 9px;
		font-size: 10px;
	}
	
	.statements-expandedImage .statement {
    min-height: 36px;
  }
}/* added by jvl  */
.statements-expandedImage-mobile {
  background-color: rgba(69, 74, 115, 0.8);
  padding: 1rem;
  width: 112px;
  height: 234px;
  top: calc(100vw * 0.5);
  left: 1rem;
  right: auto;
}

@media (min-width: 375px) {
  .statements-expandedImage-mobile {
    top: calc(100vw * 0.7);
  }
}

.statements-expandedImage-mobile .statement {
  min-height: 42px;
}

.statements-expandedImage-mobile .statement:not(:first-child) {
  margin-top: 12px;
}

.statements-expandedImage-mobile .statement .answers {
  left: 0;
  margin: 0;
}

.statement {
  position: relative;
}

@media (max-width: 767px) {
  .statement {
    min-height: 42px;
  }
}

.statement:not(:first-child) {
  margin-top: 32px;
}

@media (max-width: 767px) {
  .statement:not(:first-child) {
    margin-top: 12px;
  }
}

@media (max-width: 767px) {
  .statement_text {
    padding-left: 96px;
    font-size: 12px;
  }
}

.statement .answers {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap;
  position: absolute;
  right: 100%;
  margin-top: 2px;
  margin-right: 5px;   /*  margin-right: 32px; changed jvl  */
  list-style: none;
}

@media (max-width: 767px) {
  .statement .answers {
    right: auto;
  }
}
@media (max-width: 767px) {   /*  added by jvl   */
  .right-belowDesktop {
    right: 0 !important;
  }
}

@media (max-width: 1024px) {
  .statement .answers {
    margin-right: 3px;       /* margin-right: 16px;     changed by jvl */
  }
}

.statement .answers li {
  position: relative;
  min-width: 36px;   /*  min-width: 24px; changed by jvl   */
  height: 36px;      /* height: 24px;  changed by jvl   */
}

@media (max-width: 767px) {
  .statement .answers li {
    min-width: 28px;  /* min-width: 36px; changed by jvl   */
    height: 28px;   /*  height: 36px; changed by jvl   */
  }
}

.statement .answers li:first-child {
  margin-right: 8px;
}

.statement .answers li input[type="radio"] {
  position: absolute;
  visibility: hidden;
}

.statement .answers li input[type="radio"]:checked ~ .check {
  background: #454a73;
  transition: background 100ms ease-in;
}

.statement .answers li input[type="radio"]:checked ~ label {
  color: white;
}

.statement .answers li input[type="radio"]:checked ~ label:hover {
  background-color: transparent;
}

.statement .answers li label {
  position: absolute;
  z-index: 1;
  width: 100%;
  height: 100%;
  padding-top: 12px;     /* changed by jvl   */
  line-height: 1;
  color: #7d809d;
  font-size: 10px;   /* changed by jvl   */
  font-family: "Roboto", "Helvetica Neue", sans-serif;
  font-weight: 700;
  text-align: center;
  text-transform: uppercase;
  letter-spacing: 0.2px;
  border-radius: 50%;
  cursor: pointer;
  transition: all 100ms ease-out;
}

.statement .answers li label:hover {
  color: #454a73;
  background-color: #e9e9ee;
}

@media (max-width: 767px) {
  .statement .answers li label {
    padding-top: 10px;  /* changed by jvl   */
    font-size: 9px;   /* changed by jvl   */
  }
}
/* new classes from jvl  */
.answered-correctly {
  background-image: url("/images/new/checkmark_green.png"); 
  background-repeat: no-repeat;
  background-position: center 3px;
  background-size: 80%;
  width: 70%;
  height: 70%;
  margin-right: 5px;
  margin-top: 4px;
  margin-left: 4px;
  /*color: white;
  background-color: #454a73;*/
}
.answered-incorrectly {
  background-image: url("/images/new/checkmark_red.png"); 
  background-repeat: no-repeat;
  background-position: center 3px;
  background-size: 80%;
  width: 70%;
  height: 70%;
  margin-right: 5px;
  margin-top: 4px;
  margin-left: 4px;
  /*color: white;
  background-color: #454a73;  */
}
/* end new classes from jvl  */
.statement .answers li .check {
  position: absolute;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background: #fbfbfc;
}

.dialog {
  width: 100vw;
  height: 100vh;
  position: fixed;
  overflow-y: scroll;
  overflow-x: hidden;
  top: 0;
  left: 0;
  z-index: 1005;
  background: rgba(244, 244, 247, 0.98);
  opacity: 1;
  transition: opacity 200ms ease-out;
}

.dialog::-webkit-scrollbar {
  width: 4px;
}

.dialog::-webkit-scrollbar-track {
  background: #f4f4f7;
}

.dialog::-webkit-scrollbar-thumb {
  background: #454a73;
}

.dialog_inner {
  position: absolute;
  width: 100%;
  max-width: 100%;
  margin-top: 10vh;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}

.dialog-hidden {
  pointer-events: none;
  opacity: 0 !important;
}

.dialog-dark {
  background: rgba(69, 74, 115, 0.99);
}

.menuBackground {
  position: absolute;
  width: 5000px;
  height: 5000px;
  top: calc( -2500px + 36px);
  left: calc( -2500px + 42px);
  background: rgba(244, 244, 247, 0.98);
  border-radius: 100%;
  pointer-events: auto;
  z-index: 1000;
  opacity: 1;
  -webkit-transform: scale3d(1, 1, 1);
          transform: scale3d(1, 1, 1);
  -webkit-transform-origin: center;
          transform-origin: center;
  transition: -webkit-transform 2000ms cubic-bezier(0.23, 1, 0.32, 1);
  transition: transform 2000ms cubic-bezier(0.23, 1, 0.32, 1);
  border: 2px solid #c7c9d5;
}

@media (max-width: 767px) {
  .menuBackground {
    top: auto;
    bottom: calc( -2000px + 43px);
    left: calc( -2000px + 30px);
  }
}

@media (max-width: 480px) {
  .menuBackground {
    bottom: calc( -2000px + 32px);
  }
}

.menuBackground-hidden {
  transition: opacity 200ms 400ms ease-out, -webkit-transform 400ms ease-in;
  transition: opacity 200ms 400ms ease-out, transform 400ms ease-in;
  pointer-events: none;
  opacity: 0;
  -webkit-transform: scale3d(0, 0, 0);
          transform: scale3d(0, 0, 0);
}

.menu {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  overflow: hidden;
  z-index: 1001;
  opacity: 1;
  pointer-events: auto;
  transition: opacity 200ms 200ms ease-out;
}

.menu-hidden {
  transition: opacity 200ms ease-out;
  pointer-events: none;
  opacity: 0;
}

.menu_inner {
  max-height: 100vh;
  overflow-y: scroll;
  overflow-x: hidden;
  padding: 96px 0 96px 128px;
  padding-top: 55px !important;
  margin: 0 0 0 auto;
}

@media (max-width: 840px) {
  .menu_inner {
    padding: 32px;
  }
}

@media (max-width: 767px) {
  .menu_inner {
    padding-top: 32px !important;
  }
}

.menu_inner::-webkit-scrollbar {
  width: 4px;
}

.menu_inner::-webkit-scrollbar-track {
  background: #dadbe3;
}

.menu_inner::-webkit-scrollbar-thumb {
  background: #454a73;
}

.menu_inner ul {
  list-style: none;
}

.menu_inner a {
  color: #454a73;
  font-weight: 600;
  font-size: 14px;
  transition: opacity 200ms ease-out;
}

.menu_inner a:hover {
  opacity: 0.5;
}

.menu_inner .level {
  position: relative;
  margin-top: 16px;
  padding-left: 32px;
  transition: max-height 3000ms cubic-bezier(0.25, 0.75, 0.25, 1), opacity 200ms 300ms ease-out;
  max-height: 2500px;    /* changed by jvl 13-08-2019  max-height: 1000px;  */
  opacity: 1;
}

@media (max-width: 480px) {
  .menu_inner .level {
    padding-left: 16px;
  }
}

.menu_inner .level-closed {
  position: absolute;
  max-height: 0;
  opacity: 0;
  overflow: hidden;
  transition: none;
}

.menu_inner .level-1 {
  margin-top: 0;
}

.menu_inner .level-1 > li {
  margin-bottom: 16px;
}

.menu_inner .level-1 > li > a {
  font-size: 24px;
}

.menu_inner .level-2 {
  margin-bottom: 48px;
}

@media (max-width: 480px) {
  .menu_inner .level-2 {
    padding-left: 32px;
  }
}

.menu_inner .level-2 > li {
  position: relative;
  padding-bottom: 8px;
}

.menu_inner .level-3 > li {
  position: relative;
  padding-bottom: 8px;
}

.menu_inner .level-3 > li a {
  font-weight: 400;
}

.menu_inner .level-4 {
  margin-top: 16px;
}

.menu_inner .level-4 li {
  position: relative;
  padding-bottom: 16px;
}

.menu_inner .level-4 li a {
  position: relative;
  font-weight: 400;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.menu_inner .level-4 li a.active {
  font-weight: 600;
}

.menu_inner .level-4 li a.active:after {
  right: -8px !important;
  top: -2px !important;
  -webkit-transform: translateX(100%);
          transform: translateX(100%);
  white-space: nowrap;
}

@media (max-width: 840px) {
  .menu_inner .level-4 li a.active:after {
    right: 0 !important;
  }
}

@media (max-width: 767px) {
  .menu_inner .level-4 li a.active:after {
    -webkit-transform: rotate(90deg) translateY(-300%);
            transform: rotate(90deg) translateY(-300%);
    top: 50% !important;
  }
}

.progressDot {
  position: absolute;
  width: 11px;
  height: 11px;
  left: -24px;
  top: 3px;
  border-radius: 50%;
  border: 1px solid #9ea2b9; /* border: 1px solid #caccd8;   /*  border: 1px solid #dadbe3; jvl  til Andreas*/
  overflow: hidden;
  z-index: 1;
  /* This makes overflow: hidden; actually apply for this element that has also border-radius applied to it. In Chrome. */
}

.progressDot_fill {
  position: absolute;
  top: 100%;
  width: 100%;
  height: 100%;
  background-color: #caccd8;  /*  background-color: #dadbe3;  til Andreas jvl*/
}

.level li[data-completion="0"] > .progressDot .progressDot_fill {
  top: 100%;
}

.level li[data-completion="10"] > .progressDot .progressDot_fill {
  top: 90%;
}

.level li[data-completion="20"] > .progressDot .progressDot_fill {
  top: 80%;
}

.level li[data-completion="30"] > .progressDot .progressDot_fill {
  top: 70%;
}

.level li[data-completion="40"] > .progressDot .progressDot_fill {
  top: 60%;
}

.level li[data-completion="50"] > .progressDot .progressDot_fill {
  top: 50%;
}

.level li[data-completion="60"] > .progressDot .progressDot_fill {
  top: 40%;
}

.level li[data-completion="70"] > .progressDot .progressDot_fill {
  top: 30%;
}

.level li[data-completion="80"] > .progressDot .progressDot_fill {
  top: 20%;
}

.level li[data-completion="90"] > .progressDot .progressDot_fill {
  top: 10%;
}

.level li[data-completion="100"] > .progressDot {
  background-color: #00c878;
  border-color: #00c878;
}

.level li[data-completion="100"] > .progressDot .progressDot_fill {
  display: none;
}
/*
.level-withConnector > li[completion="100"] > .progressDotConnector {
  display: block;
}

.level-withConnector li:not([completion="100"]) ~ li > .progressDotConnector {
  display: none;
}
*/

.level-withConnector > li  > .progressDotConnector[data-completion="100"]{    /*  jvl 13-06-2018 til Andreas */
	display: block;
}
.level-withConnector > li  > .progressDotConnector:not([data-completion="100"]){  /*  jvl 13-06-2018 til Andreas*/
	display: none;
}

.progressDotConnector {
  display: none;
  position: absolute;
  left: -19px;
  top: 17px;
  width: 1px;
  height: calc( 100% - 17px);
  min-height: 9px;
  background-color: #00c878;
}

.leftRightMarkers {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  width: 100%;
  position: relative;
  top: calc( -25px - 16px);
}

@media (max-width: 840px) {
  .leftRightMarkers {
    display: none;
  }
}

.leftRightMarkers_marker-left {
  margin-left: 16px;
  height: 24px;   /* Added by JVL 29-01-2021  */
}
/*  added by jvl  */
.imglink::after {
	content:"Klik her for at se billedet i fuld størrelse";
}

/* end added by jvl  */
.leftRightMarkers_marker-right {
  margin-right: 16px;
  height: 24px;   /* Added by JVL 29-01-2021  */
}

.leftRightMarkers-imageTop {
  position: absolute;
  top: 16px;
}

.leftRightMarkers-mobile {
  background-color: #454a73 !important;
  display: none;
  opacity:0.7;   /* added by jvl  */
}

@media (max-width: 840px) {
  .leftRightMarkers-mobile {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    width: 100%;
    background-color: white;
    margin-bottom: 1px;
    top: 0;
  }
   .leftRightMarkers-mobile .label, .leftRightMarkers-mobile .thumbnail-current:before, .leftRightMarkers-mobile .menu_inner .level-4 li a.active:after, .menu_inner .level-4 li .leftRightMarkers-mobile a.active:after, .leftRightMarkers-mobile .panel-current:before, .leftRightMarkers-mobile .message {
    padding-top: 10px;
    padding-bottom: 0.5rem;
    padding-left: 1rem;
    padding-right: 1rem;
    text-align: center;
    margin-left: 0;
    margin-right: 0;
    background-color: transparent !important;
    border-top-width: 0 !important;
  }
  .leftRightMarkers-mobile .label:first-child, .leftRightMarkers-mobile .thumbnail-current:first-child:before, .leftRightMarkers-mobile .menu_inner .level-4 li a.active:first-child:after, .menu_inner .level-4 li .leftRightMarkers-mobile a.active:first-child:after, .leftRightMarkers-mobile .panel-current:first-child:before, .leftRightMarkers-mobile .message:first-child {
    border-left-width: 0 !important;
  }
  .leftRightMarkers-mobile .label:last-child, .leftRightMarkers-mobile .thumbnail-current:last-child:before, .leftRightMarkers-mobile .menu_inner .level-4 li a.active:last-child:after, .menu_inner .level-4 li .leftRightMarkers-mobile a.active:last-child:after, .leftRightMarkers-mobile .panel-current:last-child:before, .leftRightMarkers-mobile .message:last-child {
    border-right-width: 0 !important;
  }
  .leftRightMarkers-mobile .btn {
    margin-top: 4px;
  }
}

.icon {
  position: relative;
}

.icon-cross {
  height: 24px;
  width: 28px;
  z-index: 1015;
}

.icon-cross span {
  display: block;
  position: absolute;
  height: 3px;
  width: 100%;
  background: #454a73;
  top: 50%;
  left: 0;
}

.icon-cross span:nth-child(1) {
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
}

.icon-cross span:nth-child(2) {
  -webkit-transform: rotate(-45deg);
          transform: rotate(-45deg);
}

.headline {
  font-weight: 700;
  font-size: 36px;
  margin-bottom: 2px;
}

.headline-small {
  font-size: 18px;
}

@media (max-width: 767px) {
  .headline-small-belowTablet {
    font-size: 18px;
  }
}

.headline span {
  font-weight: 100;
}

.label, .thumbnail-current:before, .menu_inner .level-4 li a.active:after, .panel-current:before, .message {
  position: relative;
  padding: 4px 8px;
  padding-bottom: calc( 4px - 1px);
  font-size: 11px;
  font-weight: 600;
  font-family: "Raleway", "Roboto", "Helvetica Neue", sans-serif;
  letter-spacing: 0.4px;
  text-transform: uppercase;
  display: inline-block;
  z-index: 1;
}

.label-primary, .message-success {
  background: rgba(0, 200, 120, 0.8);
  border: 1px solid #00b26b;
  color: white;
}

.label-warning, .message-warning {
  background: rgba(255, 163, 65, 0.8);
  border: 1px solid #e3913a;
  color: white;
}

.label-dismiss, .message-error {
  background: rgba(255, 60, 50, 0.8);
  border: 1px solid #e3352d;
  color: white;
}

.label-base, .menu_inner .level-4 li a.active:after, .panel-current:before, .message-base {
  background: rgba(69, 74, 115, 0.8);
  border: 1px solid #3d4266;
  color: #f4f4f7;
}

.label-dismiss svg path, .message-error svg path, .label-dismiss svg polygon, .message-error svg polygon, .label-primary svg path, .message-success svg path, .label-primary svg polygon, .message-success svg polygon {
  fill: white;
}

.label-light, .thumbnail-current:before {
  background: rgba(255, 255, 255, 0.8);
  border: 1px solid #f4f4f7;
  color: #454a73;
}

.label-lightInvert {
  background: rgba(244, 244, 247, 0.8);
  border: 1px solid white;
  color: #454a73;
}

.label-lightDarkBorder {
  background: rgba(255, 255, 255, 0.8);
  border: 1px solid #454a73;
  color: #454a73;
}

.label-withIcon {
  padding-right: 24px;
}

.labelIcon {
  display: block;
  margin: 0 auto;
  height: 100%;
}

.labelIcon_wrap {
  position: absolute;
  right: 7px;
  top: 5px;
  height: 9px;
}

/*  ny klasse oprettes af jvl den 07-08-2018 */
.label-info-position {
	position: absolute; 
	right: 8px; 
	bottom: 8px;
}
/* slut klasse */

.label-info {
  min-width: 24px;
  min-height: 24px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  border-radius: 50%;
  text-transform: none;
  cursor: pointer;
}

.label-icon {
  position: absolute;
  width: 22px;
  height: 22px;
}

.label-icon svg {
  position: relative;
}

.label-icon-cross svg {
  width: 9px;
  margin-left: -2px;
}

.label-icon-checkmark svg {
  width: 11px;
  margin-left: -3px;
}

.label-current, .thumbnail-current:before, .menu_inner .level-4 li a.active:after, .panel-current:before {
  content: 'Du er her';
  line-height: 1.1;
  position: absolute;
  right: -1px;
  top: -1px;
}
/* new class JVL 24-09-2018   */
.level-4 li a.active:after {
	position: relative !important;
}
/* end of new class */
.panel {
  position: relative;
  margin-top: 16px;
  width: 100%;
}

.panel-overflow {
  margin-top: 16px;
  margin-left: -24px;
  width: calc( 100% + 48px);
}

.panel_header {
  background-color: white;
  padding: 16px;
  padding-top: calc( 4px + 2px);
  padding-bottom: calc( 4px + 2px);
  border-bottom: 1px solid #f4f4f7;
}

.panel_header_label {
  font-size: 12px;
  font-weight: 700;
}

.panel_header_label span {
  color: #e9e9ee;
}

.panel_content {
  position: relative;
  width: 100%;
  padding: 8px 16px;
  background-color: white;
}

.panel_content ul {
  list-style: none;
}

.panel_content > p {
  font-size: 12px;
}

.panel_list {
  position: relative;
  z-index: 1;
}

.panel_list > li {
  position: relative;
  margin-bottom: 2px;
}

.panel_list > li:last-child {
  margin-bottom: 0;
}

.panel_list > li > .label, .panel_list > li > .thumbnail-current:before, .menu_inner .level-4 .panel_list > li > a.active:after, .panel_list > li > .panel-current:before, .panel_list > li > .message {
  left: -32px;
}

.panel_list li {
  font-size: 10px;
}

.panel_list li p {
  font-family: "Roboto", "Helvetica Neue", sans-serif;
  font-size: 10px;
  font-weight: 600;
  line-height: 1.1;
  margin-right: 4px;
}

.panel_list li > * {
  display: inline-block;
}

.panel_list_yesno li {
  position: relative;
}

.panel_list_yesno li:first-child {
  width: 52px;  /* changed by JVL 15-02-2021 from  width: 44px; */
  text-align: right;
}

.panel_list_yesno li:first-child .panel_list_yesno_iconWrap {
  left: 6px;
}

.panel_list_yesno li:last-child {
  width: 52px;
}

.panel_list_yesno li:last-child .panel_list_yesno_iconWrap {
  right: 6px;
}

.panel_list_yesno_iconWrap {
  position: absolute;
  top: 5px;
  height: 8px;
  width: 13px;
}

.panel_list_yesno_icon {
  display: block;
  margin: 0 auto;
  height: 100%;
}

.panel_image {
  position: absolute;
  top: -31px;
  right: 0;
  height: calc( 100% + 31px);
  padding: 8px;
  background-color: white;
}
/* the following overrides #content img in another css file */
#content .panel_image {  /* new jvl 2019-09-12  */
  position: absolute;
  top: -31px;
  left:auto;
  right: 0;
  height: calc( 100% + 31px);
  padding: 8px;
  background-color: white;
}

.panel-current {
  border: 1px solid #454a73;
}

.contextLine {
  color: #7d809d;
  font-weight: 500;
  text-transform: uppercase;
  font-size: 11px;
  font-family: "Roboto", "Helvetica Neue", sans-serif;
  letter-spacing: 0.4px;
  display: block;
}

table {
  padding: 8px;
  background-color: white;
  border: 1px solid #e9e9ee;
}

table td {
  padding: 4px 8px;
}

table.light {
  background-color: rgba(244, 244, 247, 0.98);
  border: 1px solid #dadbe3;
}

.bar {
  position: relative;
  height: 16px;
  width: 100%;
  background-color: white;
}

.bar_fill {
  position: absolute;
  width: 100%;
  -webkit-transform: scaleX(0);
          transform: scaleX(0);
  height: 100%;
  background-color: #454a73;
  transition: -webkit-transform 2400ms ease-out;
  transition: transform 2400ms ease-out;
  -webkit-transform-origin: left;
          transform-origin: left;
}

.bar_fill-final {
  -webkit-transform: scaleX(1);
          transform: scaleX(1);
}

.bar_fillWrap {
  position: absolute;
  height: 100%;
  width: 0;
}

.bar_marker {
  position: absolute;
  width: 1px;
  top: -4px;
  height: calc( 100% + 8px);
  left: 80%;
  background-color: #dadbe3;
}

.bar_marker:after {
  content: '80%';
  position: absolute;
  bottom: -18px;
  left: -12px;
  font-family: "Raleway", "Roboto", "Helvetica Neue", sans-serif;
  font-size: 12px;
  margin-left: 4px;
  color: #a2a5b9;
  font-weight: 100;
}

.box {
  width: 100%;
  padding: 32px;
  padding-top: 24px;
  background-color: rgba(35, 82, 124, 1);/* rgba(69, 74, 115, 0.98); changed by JVL 15-02-2021*/
  border: 1px solid #3d4266;
  z-index: 1004;
}

.box-noFade {
  -webkit-animation-duration: 0s;
          animation-duration: 0s;
}

.box h1, .box h2, .box h3, .box h4, .box h5, .box h6, .box li, .box p, .box a {
  color: white;
}

.box_headlineWrap {
  position: absolute;
  bottom: 100%;
  left: 0;
  height: 100px;
  width: 100%;
}

.box_buttonsWrap {
  position: absolute;
  top: calc( 100% + 32px);
  left: 0;
  height: 100px;
  width: 100%;
}

.box h1, .box h2 {
  position: absolute;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  font-size: 28px;
  bottom: 32px;
}

@media (max-width: 767px) {
  .box h1, .box h2 {
    font-size: 20px;
    bottom: 16px;
  }
}

.box_close {
  cursor: pointer;
  position: absolute;
  top: 8px;
  right: 8px;
  width: 12px;
  height: 12px;
}

.box_close-inside {
  cursor: pointer;
  position: absolute;
  top: 50px;
  right: 50px;
  width: 12px;
  height: 12px;
}

.box_close polygon {
  fill: #1c1e2f;
}

.box-small {
  position: relative;
  max-width: 320px;
  height: auto;
}

.box-light {
  background-color: rgba(244, 244, 247, 0.98);
  border: 1px solid #dadbe3;
}

.box-light p {
  color: #454a73;
}

.box-usermeta {
  z-index: 0;
  left: 14px;
  top: -7px;
  width: 320px;
  max-width: calc( 100vw - 64px);
  padding-left: 16px;
  padding-top: 12px;
  padding-right: 32px;
  padding-bottom: 12px;
}

/* ændret af jvl 06-08-2018  til Andreas*/
@media (max-width: 480px) {   /* @media (max-width: 840px) { */
  .box-usermeta {
    top: auto;
    bottom: 375px;/*bottom: 259px;   */
  }
}
/* ny klasse af jvl 06-08-2018  til Andreas*/
@media (max-width: 1023px)  {
  .box-usermeta {
    top: auto;
    bottom: 375px;/*bottom: 259px;   */
  }
}

.box-usermeta ul {
  list-style: none;
}

.box-usermeta li, .box-usermeta p, .box-usermeta a {
  font-size: 12px;
}

.box-usermeta_key {
  font-family: "Roboto", "Helvetica Neue", sans-serif;
  margin-top: 5.3333333333px;
  font-weight: bold;
/*   color: #1c1e2f !important; */ 
  color: #b5b5b5 !important;
  font-size: 12px !important;
}

.box-usermeta a {
  margin-bottom: 12px;
  display: block;
  transition: opacity 200ms ease-out;
}

.box-usermeta a:hover {
  opacity: 0.5;
}

.box-usermeta a:last-child {
  margin-bottom: 8px;
}

.box-usermeta_split {
  height: 1px;
  width: calc( 100% + 48px);
  background-color: #3d4266;
  margin-top: 16px;
  margin-bottom: 20px;
  margin-left: -16px;
}

.box-paddingLarge {
  padding: 32px 48px;
}

.box-backdrop {
  box-shadow: 0px 0px 0px 10000px rgba(69, 74, 115, 0.95);
  border: 4px solid #3d4266;
}

.box .inputWrap:last-child {
  margin-bottom: 0;
}

.box-btn {
  position: absolute;
  left: 0;
  bottom: 12px;
  z-index: -1;
}

.box-coursesAndTests {
  bottom: 0;
}

@media (max-width: 1024px) {
  .box-coursesAndTests {
    width: calc( 100% + 32px) !important;
  }
}

@media (max-width: 840px) {
  .box-coursesAndTests {
    width: calc( 100% + 128px) !important;
  }
}

@media (max-width: 767px) {
  .box-coursesAndTests {
    width: calc( 100% + 64px) !important;
  }
}

@media (min-width: 1025px) {
  .box-coursesAndTests {
    width: calc( 100% + 96px) !important;
  }
}

@media (min-width: 1600px) {
  .box-coursesAndTests {
    width: calc( 100% + 96px) !important;
  }
}

input, select {
  padding: 8px 8px;
  width: 100%;
  border: 1px solid white;
}

input:focus, select:focus {
  outline: none !important;
  border-color: #dadbe3;
  box-shadow: 0 0 4px #dadbe3;
}

input[type="password"] {
  padding-top: 10px;
  padding-bottom: 9px;
}

input[type="checkbox"] {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  border: none;
}

input[type="checkbox"]:focus {
  border-color: none;
  box-shadow: none;
}

input[type="checkbox"]:after {
  content: '';
  position: absolute;
  width: 100%;
  min-height: 100%;
  background-color: white;
  border: 1px solid #dadbe3;
}

input[type="checkbox"]:checked:after {
  content: '';
  background-image: url("/images/new/ic_checkmark_white_small_fat.svg");
  background-repeat: no-repeat;
  background-position: center 3px;
  background-size: 80%;
  color: white;
  background-color: #454a73;
}

input[disabled] {
  border-color: rgba(255, 255, 255, 0.5);
  background-color: #fbfbfc;
}

input.input-error,
textarea.input-error {
  border: 1px solid #ff3c32;
}

.inputGroup {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
}

.inputGroup .inputWrap:not(:last-child) {
  margin-right: 16px;
}

.inputWrap {
  position: relative;
  margin-bottom: 16px;
  -ms-flex-preferred-size: 100%;
      flex-basis: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  white-space: nowrap;
}

@media (max-width: 767px) {
  .inputWrap {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
}

.inputWrap.shortLabel label {
  width: 80px;
}

@media (max-width: 767px) {
  .inputWrap.shortLabel label {
    width: 100%;
  }
}

.inputWrap.shortLabel input {
  width: calc(100% - 80px);
}

@media (max-width: 767px) {
  .inputWrap.shortLabel input {
    width: 100%;
  }
}

.inputWrap.longLabel label {
  width: 200px;
}

@media (max-width: 767px) {
  .inputWrap.longLabel label {
    width: 100%;
  }
}

.inputWrap.longLabel input {
  width: calc(100% - 200px);
}

@media (max-width: 767px) {
  .inputWrap.longLabel input {
    width: 100%;
  }
}

.inputWrap.checkbox {
  position: relative;
  width: 16px;
  height: 16px;
}

.inputWrap.checkbox input {
  width: 100%;
  height: 100%;
}

.inputWrap.checkbox label {
  font-size: 11px;
  position: relative;
  left: calc( 100% + 4px);
  text-align: left;
  background-color: transparent;
  border: none;
  width: auto;
  margin-right: auto;
  top: 12px;  /* jvl  */
}

@media (max-width: 767px) {
  .inputWrap.checkbox label {
    white-space: normal;
    min-width: 100px;
	top: 0px; /* jvl   */
  }
}

.inputWrap label {
  display: inline-block;
  padding: 8px 8px;
  width: 120px;
  text-align: right;
  background-color: #fbfbfc;
  border: 1px solid white;
  margin-right: 1px;
  vertical-align: middle; /* Fixes any weird issues in Firefox and IE */
}

@media (max-width: 767px) {
  .inputWrap label {
    text-align: left;
    width: 100%;
    padding: 0 8px;
    padding-left: 0;
    margin-bottom: 8px;
    background: none;
    border: none;
  }
}

.inputWrap input {
  display: inline-block;
  width: calc(100% - 120px);
  vertical-align: middle; /* Fixes any weird issues in Firefox and IE */
}

@media (max-width: 767px) {
  .inputWrap input {
    width: 100%;
  }
}

select {
  background-color: white;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  /* remove default arrow */
  background-image: url("/new/images/ic_down.svg");
  /* add custom arrow */
  background-repeat: no-repeat;
  background-position: calc( 100% - 16px);
}

select::-ms-expand {
  display: none;
  /* hide the default arrow in ie10 and ie11 */
}

.message {
  position: fixed;
  top: 0px;
  left: -1px;
  z-index: 1010;
  text-transform: none;
  font-size: 14px;
  font-weight: 400;
  text-align: center;
  min-width: 100vw;
  width: calc( 100vw + 2px);
  padding: 22px 32px;
  -webkit-transform: translate3d(0, -100px, 0);
          transform: translate3d(0, -100px, 0);
  transition: -webkit-transform 600ms ease-out;
  transition: transform 600ms ease-out;
}

.message-showing {
  -webkit-transform: translate3d(0, -1px, 0);
          transform: translate3d(0, -1px, 0);
}

.image-coursesAndTests {
  z-index: 997;
  position: absolute;
}

@media (max-width: 1024px) {
  .image-coursesAndTests {
    width: calc( 100% + 32px) !important;
  }
}

@media (max-width: 840px) {
  .image-coursesAndTests {
    width: calc( 100% + 192px) !important;
    position: relative;
  }
}

@media (max-width: 767px) {
  .image-coursesAndTests {
    width: calc( 100% + 64px) !important;
    position: relative;
  }
}

@media (min-width: 1025px) {
  .image-coursesAndTests {
    width: calc( 100% + 96px) !important;
  }
}

.image-coursesAndTests_image {
  width: 100%;
}

@media (max-width: 840px) {
  .image-coursesAndTests-smallScreenFriendly {
    width: auto !important;
    margin: auto !important;
    position: fixed;
  }
}

@media (max-width: 840px) {
  .image-coursesAndTests-smallScreenFriendly_image {
    display: block;
    position: absolute;
    width: calc( 100vw - 32px) !important;
    -webkit-transform: scale3d(0.4, 0.4, 0.4);  /*  -webkit-transform: scale3d(0.5, 0.5, 0.5);  */
            transform: scale3d(0.4, 0.4, 0.4);  /*  transform: scale3d(0.5, 0.5, 0.5);    */
    transition: -webkit-transform 200ms ease-out;
    transition: transform 200ms ease-out;
  }
    #videoplayer { /* added by jvl */
	
      -webkit-transform: scale3d(0.4, 0.4, 0.4);    /*  -webkit-transform: scale3d(0.5, 0.5, 0.5);  */
            transform: scale3d(0.4, 0.4, 0.4);    /*  transform: scale3d(0.5, 0.5, 0.5);    */
      transition: -webkit-transform 200ms ease-out;
      transition: transform 200ms ease-out;
			
    }
    .image-coursesAndTests-smallScreenFriendly_image.expanded {
    -webkit-transform: scale3d(1, 1, 1);
            transform: scale3d(1, 1, 1);
    }
    #videoplayer.expanded{ /* added by jvl */
	 -webkit-transform: scale3d(1, 1, 1);
            transform: scale3d(1, 1, 1);
	}
}

@media (max-width: 840px) {
  .image-coursesAndTests-smallScreenFriendly #btnExpandImageDesktop {
    display: none;
  }
}

.image-coursesAndTests-smallScreenFriendly #btnExpandImage {
  position: absolute;
}

@media (min-width: 841px) {
  .image-coursesAndTests-smallScreenFriendly #btnExpandImage {
    display: none;
  }
}

.image-coursesAndTests-smallScreenFriendly #btnExpandImage #iconShrink {
  width: 16px;
  height: 16px;
}

@media (max-width: 840px) {
  .image-coursesAndTests-smallScreenFriendly.bottomRight {
    right: 16px;
    left: auto;
    top: auto;
    bottom: calc( 138px + 16px);
  }
}

@media (max-width: 840px) and (max-width: 456px) {
  .image-coursesAndTests-smallScreenFriendly.bottomRight {  /*  changed by jvl  */
    bottom: calc( 120px + 0px);   /*  bottom: calc( 154px + 16px);  */
  }
  
}

@media (max-width: 840px) {
  .image-coursesAndTests-smallScreenFriendly.bottomRight img {
    right: 0;
    left: auto;
    bottom: 0;
    top: auto;
    -webkit-transform-origin: bottom right;
            transform-origin: bottom right;
  }
  .image-coursesAndTests-smallScreenFriendly.bottomRight #videoplayer {   /* added by jvl */
    right: 0;
    left: auto;
    bottom: 0;
    top: auto;
    -webkit-transform-origin: bottom right;
            transform-origin: bottom right;
  }
  .image-coursesAndTests-smallScreenFriendly.bottomRight .btn {
    right: 8px;
    left: auto;
    bottom: 8px;
    top: auto;
  }
  .image-coursesAndTests-smallScreenFriendly.bottomLeft {
    right: auto;
    left: 16px;
    top: auto;
    bottom: calc( 138px + 16px);
  }
}

@media (max-width: 840px) and (max-width: 456px) {
  .image-coursesAndTests-smallScreenFriendly.bottomLeft {   /*  changed by jvl   */
    bottom: calc( 120px + 0px);   /*  bottom: calc( 154px + 16px);  */
  }
}

@media (max-width: 840px) {
  .image-coursesAndTests-smallScreenFriendly.bottomLeft img {
    right: auto;
    left: 0;
    bottom: 0;
    top: auto;
    -webkit-transform-origin: bottom left;
            transform-origin: bottom left;
  }
  .image-coursesAndTests-smallScreenFriendly.bottomLeft #videoplayer {  /* added by jvl   */
    right: auto;
    left: 0;
    bottom: 0;
    top: auto;
    -webkit-transform-origin: bottom left;
            transform-origin: bottom left;
   }
  .image-coursesAndTests-smallScreenFriendly.bottomLeft .btn {
    right: auto;
    left: 8px;
    bottom: 8px;
    top: auto;
  }
  .image-coursesAndTests-smallScreenFriendly.topRight {
    right: 16px;
    left: auto;
    top: 16px;
    bottom: auto;
  }
  .image-coursesAndTests-smallScreenFriendly.topRight img {   /* changed by jvl  */
    right: 0;
    left: auto;
    bottom: auto;
    top: 9px;/*top: 0; */
    -webkit-transform-origin: top right;
            transform-origin: top right;
  }
  .image-coursesAndTests-smallScreenFriendly.topRight  #videoplayer {  /* added by jvl   */
    right: 0;
    left: auto;
    bottom: auto;
    top: 10px;/*top: 0; */
    -webkit-transform-origin: top right;
            transform-origin: top right;
  }
  .image-coursesAndTests-smallScreenFriendly.topRight .btn {
    right: 8px;
    left: auto;
    bottom: auto;
    top: 8px;
  }
  .image-coursesAndTests-smallScreenFriendly.topLeft {
    right: auto;
    left: 16px;
    top: 16px;
    bottom: auto;
  }
  .image-coursesAndTests-smallScreenFriendly.topLeft img {  /* changed by jvl  */
    right: auto;
    left: 0;
    bottom: auto;
    top: 10px;   /* top: 0;  */
    -webkit-transform-origin: top left;
            transform-origin: top left;
  }
   .image-coursesAndTests-smallScreenFriendly.topLeft  #videoplayer {  /* added by jvl  */
    right: auto;
    left: 0;
    bottom: auto;
    top: 9px;/*top: 0; */
    -webkit-transform-origin: top left;
            transform-origin: top left;
  }
  /* end added by jvl */
  .image-coursesAndTests-smallScreenFriendly.topLeft .btn {
    right: auto;
    left: 8px;
    bottom: auto;
    top: 8px;
  }
}

#dialogExpandedImageDesktop {
  z-index: 998;
}

@media (max-width: 840px) {
 /* #dialogExpandedImageDesktop {   changed by jvl
    display: none;
  }*/
  
	#dialogExpandedImageDesktop #expandedImageDesktopWrap {
		position: absolute;
		top: 10px;
		left: 10px;
		width:auto; /*height: calc( 100vh - 20px);*/
		width: calc( 100vw - 40px);
	/*overflow: hidden;*/
	}
}
@media (min-width: 841px) {
	#dialogExpandedImageDesktop #expandedImageDesktopWrap {
		position: absolute;
		top: 16px;
		left: 80px;
		height: calc( 100vh - 170px);
		width: calc( 100vw - 232px);
	/*overflow: hidden;   */
	}

	#dialogExpandedImageDesktop #expandedImageDesktopWrap img {
		/*position: absolute;
		  min-width: 100%;   changed by jvl july 2019
		  min-height: 100%; */   /*   det skar toppen og bunden af image af  */
		/*left: 50%;
		top: 50%;*/
		max-width:90%;
		height:auto;
	/*	padding-left:10%;    Deleted JVL 29-01-2021 */
	/*	-webkit-transform: translate3d(-50%, -50%, 0);
          transform: translate3d(-50%, -50%, 0);  changed by jvl after intro*/
	}
}
@media (max-width: 840px) {   /* added by jvl  */
    
 	#dialogExpandedImageDesktop #expandedImageDesktopWrap img {  /* added by jvl  */
		/*position: absolute;
		width: 100%;
		left: 0;
		top: 0; changed by jvl after intro*/
		max-width:100%;
		height:auto;
		padding-left:0%;
    }
}

@media (min-width: 1025px) {
  #dialogExpandedImageDesktop #expandedImageDesktopWrap img {
		/*max-width:70%;
		top: 40%;  changed by jvl after intro*/
	}
}



#dialogExpandedImageMobile {   /* til info: er ikke taget i brug jvl    */
  z-index: 998;
}

@media (min-width: 841px) {   /* til info: er ikke taget i brug jvl    */
  #dialogExpandedImageMobile {
    display: none;
  }
}

#dialogExpandedImageMobile img {  /* til info: er ikke taget i brug jvl    */
  position: absolute;
  width: 100%;
  left: 0;
  top: 0;
}

.avatar {
  display: block;
  position: relative;
  min-height: 32px;
  width: 32px;
  border-radius: 50%;
}

.avatar_background {
  position: absolute;
}

.avatar_initials {
  position: absolute;
  text-align: center;
  width: inherit;
  top: 7px;
  font-size: 12px;
  font-weight: 600;
  color: #f4f4f7;
  text-transform: uppercase;
  z-index: 1;
}

.nav {
  position: fixed;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  left: 28px;
  top: 24px;
  z-index: 1002;
}

@media (max-width: 840px) {
  .nav {
    bottom: 26px;
    top: auto;
    transition: 0.15s ease-out;
  }
}

@media (max-width: 480px) {
  .nav {
    left: 16px;
    bottom: 20px;
  }
}

.nav .avatar {
  top: 9px;
  left: -2px;
}

.resultat .icon-clock {
  width: 17px;
  height: 17px;
  margin-top: -1px;
  margin-right: 8px;
}

.resultat .icon-clock svg {
  width: 100%;
}

.resultat .icon-clock svg path, .resultat .icon-clock svg polygon {
  fill: #a2a5b9;
}

#contentTextWrapper p {
	margin: 0 0 12px 0;
}

.notifications {
    width: 99%;
    padding: 15px;
    z-index: 5000;
    background-color: #fefabc;
    line-height: 1.5em;
    color: black;
    box-shadow: 0px 4px 6px #333;
    -moz-box-shadow: 0px 4px 6px #333;
    -webkit-box-shadow: 0px 4px 6px #333;
}

.box_close-notification {
  cursor: pointer;
  position: absolute;
 /* top: 10px;*/
  right: 50px;
  width: 12px;
  height: 12px;
}

.test01Svgknapper #btnShowAnswers {
  background-image: url("./../../../assets/btn_showanswers_blue_up_small.svg");
  background-repeat: no-repeat;
  min-width: 100px;
  height: 26px;
  outline: none;
}

.test01Svgknapper #btnShowAnswers:active {
  background-image: url("./../../../assets/btn_showanswers_blue_down_small.svg");
}

.test01Svgknapper .statements .statement {
  position: relative;
}

@media (max-width: 767px) {
  .test01Svgknapper .statements .statement {
    min-height: 42px;
  }
}

.test01Svgknapper .statements .statement:not(:first-child) {
  margin-top: 32px;
}

@media (max-width: 767px) {
  .test01Svgknapper .statements .statement_text {
    padding-left: 96px;
  }
}

.test01Svgknapper .statements .statement .answers {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap;
  position: absolute;
  right: 100%;
  margin-top: 2px;
  margin-right: 32px;
  list-style: none;
}

@media (max-width: 767px) {
  .test01Svgknapper .statements .statement .answers {
    right: auto;
  }
}

@media (max-width: 1024px) {
  .test01Svgknapper .statements .statement .answers {
    margin-right: 16px;
  }
}

.test01Svgknapper .statements .statement .answers li {
  position: relative;
  min-width: 28px;
  height: 28px;
}

@media (max-width: 767px) {
  .test01Svgknapper .statements .statement .answers li {
    min-width: 36px;
    height: 36px;
  }
}

.test01Svgknapper .statements .statement .answers li:first-child {
  margin-right: 8px;
}

.test01Svgknapper .statements .statement .answers li input[type="radio"] {
  position: absolute;
  visibility: hidden;
}

.test01Svgknapper .statements .statement .answers li input[type="radio"]:checked ~ .check {
  transition: background-image 100ms ease-in;
}

.test01Svgknapper .statements .statement .answers li input[type="radio"]:checked ~ .check-yes {
  background-image: url("./../../../assets/btn_answer_yes_down.svg");
}

.test01Svgknapper .statements .statement .answers li input[type="radio"]:checked ~ .check-no {
  background-image: url("./../../../assets/btn_answer_no_down.svg");
}

.test01Svgknapper .statements .statement .answers li label {
  opacity: 0;
}

.test01Svgknapper .statements .statement .answers li .check {
  position: absolute;
  width: 100%;
  height: 100%;
  background-size: cover;
  background-repeat: no-repeat;
}

.test01Svgknapper .statements .statement .answers li .check-yes {
  background-image: url("./../../../assets/btn_answer_yes_up.svg");
}

.test01Svgknapper .statements .statement .answers li .check-no {
  background-image: url("./../../../assets/btn_answer_no_up.svg");
}

.test01Svgknapper .statements .statement .answers .btn-statementSVG {
  min-width: auto;
  max-width: 1000px;
  height: auto;
}

.test01Svgknapper .btn-control-SVG {
  visibility: visible;
  position: relative;
  min-width: 40px;
  width: 40px;
  height: 40px;
}

.test01Svgknapper .btn-control-SVG_inner {
  left: 0px;
  top: 0px;
  position: absolute;
}