@media only screen and (max-width: 640px) {
  .hide-for-small-only {
    display: none; } }

@media only screen and (min-width: 641px) {
  .hide-for-medium-up {
    display: none; } }

.makeRelative {
  position: relative; }

.textCenter {
  text-align: center; }

.textLeft {
  text-align: left; }

.textRight {
  text-align: right; }

nav li {
  display: inline-block; }

hr {
  width: 100%;
  height: 1px;
  clear: both;
  background: rgba(17, 17, 17, 0.25);
  color: rgba(17, 17, 17, 0.25);
  margin: 1rem 0;
  border: none; }

[class*="column"] + [class*="column"]:last-child {
  float: left !important; }

a {
  text-decoration: none;
  color: inherit;
  cursor: pointer; }

* {
  outline: none;
  outline: none;
  border-box: border-box;
  -webkit-overflow-scrolling: touch;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility; }
  *:focus {
    outline: none; }
  *:invalid {
    box-shadow: none; }
  *:-moz-submit-invalid {
    box-shadow: none; }
  *:-moz-ui-invalid {
    box-shadow: none; }

ul, li {
  margin: 0;
  padding: 0;
  list-style-type: none; }

body, html {
  width: 100%;
  height: 100%;
  max-width: 100%;
  margin: 0;
  padding: 0;
  color: #111111;
  font-size: 16px; }
  .touch body, .touch html {
    overflow-x: hidden; }
  body header, body section, body footer, html header, html section, html footer {
    font-size: 0.875rem; }

.collapse-text-toggle {
  font-size: 0.9em;
  color: #666666;
  cursor: pointer; }

.collapse-text-toggle:hover {
  color: #222222; }

.collapse-text-toggle:before {
  content: '\00a0('; }

.collapse-text-toggle:after {
  content: ')'; }

.extra-margin.bottom {
  margin-bottom: 10px; }

.extra-margin.right {
  margin-right: 10px; }

.extra-margin.left {
  margin-left: 10px; }

.extra-margin.top5 {
  margin-top: 5px; }

.extra-margin.bottom5 {
  margin-bottom: 5px; }

.extra-margin.bottom20 {
  margin-bottom: 20px; }

.extra-margin.top {
  margin-top: 10px; }

.extra-margin.top20 {
  margin-top: 20px; }

.padding-top5 {
  padding-top: 5px; }

.extra-padding.top {
  padding-top: 10px; }

.extra-padding.top20 {
  padding-top: 20px; }

.extra-padding.bottom {
  padding-bottom: 10px; }

/*
	Use font-include for single fonts
	and font-list for a list using the $*-font-weights list
*/
@font-face {
  font-family: "Montserrat";
  src: url("../fonts/Montserrat-Light.eot?#iefix") format("embedded-opentype"), url("../fonts/Montserrat-Light.woff") format("woff"), url("../fonts/Montserrat-Light.ttf") format("truetype"), url("../fonts/Montserrat-Light.svg#Montserrat") format("svg");
  /* Legacy iOS */
  font-weight: 300;
  font-style: normal; }

@font-face {
  font-family: "Montserrat";
  src: url("../fonts/Montserrat-Regular.eot?#iefix") format("embedded-opentype"), url("../fonts/Montserrat-Regular.woff") format("woff"), url("../fonts/Montserrat-Regular.ttf") format("truetype"), url("../fonts/Montserrat-Regular.svg#Montserrat") format("svg");
  /* Legacy iOS */
  font-weight: 400;
  font-style: normal; }

@font-face {
  font-family: "Montserrat";
  src: url("../fonts/Montserrat-Bold.eot?#iefix") format("embedded-opentype"), url("../fonts/Montserrat-Bold.woff") format("woff"), url("../fonts/Montserrat-Bold.ttf") format("truetype"), url("../fonts/Montserrat-Bold.svg#Montserrat") format("svg");
  /* Legacy iOS */
  font-weight: 700;
  font-style: normal; }

@font-face {
  font-family: "Netto OT";
  src: url("../fonts/NettoOT-Light.eot?#iefix") format("embedded-opentype"), url("../fonts/NettoOT-Light.woff") format("woff"), url("../fonts/NettoOT-Light.ttf") format("truetype"), url("../fonts/NettoOT-Light.svg#Netto OT") format("svg");
  /* Legacy iOS */
  font-weight: 300;
  font-style: normal; }

@font-face {
  font-family: "Netto OT";
  src: url("../fonts/NettoOT-Regular.eot?#iefix") format("embedded-opentype"), url("../fonts/NettoOT-Regular.woff") format("woff"), url("../fonts/NettoOT-Regular.ttf") format("truetype"), url("../fonts/NettoOT-Regular.svg#Netto OT") format("svg");
  /* Legacy iOS */
  font-weight: 400;
  font-style: normal; }

@font-face {
  font-family: "Netto OT";
  src: url("../fonts/NettoOT-Bold.eot?#iefix") format("embedded-opentype"), url("../fonts/NettoOT-Bold.woff") format("woff"), url("../fonts/NettoOT-Bold.ttf") format("truetype"), url("../fonts/NettoOT-Bold.svg#Netto OT") format("svg");
  /* Legacy iOS */
  font-weight: 700;
  font-style: normal; }

h1, h2, h3, h4, h5, h6 {
  font-family: Montserrat, sans-serif;
  text-align: left;
  font-weight: 700;
  padding: 0;
  margin: 0; }
  h1.sub, h2.sub, h3.sub, h4.sub, h5.sub, h6.sub {
    font-weight: 300; }

h1 {
  font-size: 2.5rem;
  line-height: 2.5rem; }

h2 {
  font-size: 1.875rem;
  line-height: 2.5rem;
  font-family: "Netto OT"; }

h3 {
  font-size: 1rem;
  line-height: 1.5rem; }

h4 {
  font-size: 0.875rem;
  line-height: 0.875rem; }

h5 {
  font-size: 0.75rem;
  line-height: 0.75rem; }

h6 {
  font-size: 0.625rem;
  line-height: 0.625rem; }

.font-Light {
  font-weight: 300; }

.font-Regular {
  font-weight: 400; }

.font-Bold {
  font-weight: 700; }

.font-bold, strong {
  font-weight: 700; }

small {
  font-size: smaller; }

del {
  text-decoration: line-through; }

ins {
  text-decoration: underline; }

sub {
  vertical-align: sub;
  font-size: smaller; }

sup {
  vertical-align: sup;
  font-size: smaller; }

p {
  margin: 0;
  padding: 0;
  font-size: 0.875rem;
  line-height: 1.625rem; }
  p.text-tiny {
    font-size: 0.75rem; }
  p.text-small {
    font-size: 0.875rem; }
  p.text-regular {
    font-size: 1rem; }
  p.text-large {
    font-size: 1.125rem; }
  p.text-xlarge {
    font-size: 1.5rem; }

h1 + h3 {
  margin-top: 1rem; }

h2 + p {
  margin-top: 1rem; }

h3 + h1 {
  margin-top: .75rem; }

h3 + p {
  margin-top: 2rem; }

h3 + .row {
  margin-top: 1rem; }

p + p {
  margin-top: .5rem; }

p + .button,
p + .button + .button,
p + .button + button,
p + button,
p + button + .button,
p + button + button {
  margin-top: 2rem; }

/* Slider */
.slick-slider {
  position: relative;
  display: block;
  box-sizing: border-box;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -ms-touch-action: pan-y;
  touch-action: pan-y;
  -webkit-tap-highlight-color: transparent; }

.slick-list {
  position: relative;
  display: block;
  margin: 0;
  padding: 0; }
  .slick-list:focus {
    outline: none; }
  .slick-list.dragging {
    cursor: pointer;
    cursor: hand; }

.slick-slider .slick-track,
.slick-slider .slick-list {
  height: 100%;
  transform: translate3d(0, 0, 0); }

.slick-track {
  position: relative;
  left: 0;
  top: 0;
  display: block; }
  .slick-track:before, .slick-track:after {
    content: "";
    display: table; }
  .slick-track:after {
    clear: both; }
  .slick-loading .slick-track {
    visibility: hidden; }

.slick-slide {
  float: left;
  height: 100%;
  min-height: 1px;
  display: none; }
  [dir="rtl"] .slick-slide {
    float: right; }
  .slick-slide img {
    display: block; }
  .slick-slide.slick-loading img {
    display: none; }
  .slick-slide.dragging img {
    pointer-events: none; }
  .slick-initialized .slick-slide {
    display: block; }
  .slick-loading .slick-slide {
    visibility: hidden; }
  .slick-vertical .slick-slide {
    display: block;
    height: auto;
    border: 1px solid transparent; }

.slick-arrow.slick-hidden {
  display: none; }

ul.slick-dots {
  font-size: 0;
  text-align: center;
  padding-top: 3rem; }
  ul.slick-dots li {
    display: inline-block;
    width: 1rem;
    height: 1rem;
    background: transparent;
    border: 2px solid rgba(0, 0, 0, 0.1);
    border-radius: 1rem;
    margin: 0 .5rem;
    position: relative; }
    ul.slick-dots li:before {
      content: "";
      width: 1rem;
      height: 1rem;
      border-radius: 1rem;
      background: blue;
      position: absolute;
      left: 50%;
      top: 50%;
      transform: translate(-50%, -50%) scale(0.25);
      transition: 0.3s; }
    ul.slick-dots li.slick-active:before {
      transform: translate(-50%, -50%) scale(1);
      transition: 0.3s; }
    ul.slick-dots li button {
      display: block;
      width: 100%;
      height: 100%;
      opacity: 0; }

/**
 * Foundation for Sites by ZURB
 * Version 6.3.1
 * foundation.zurb.com
 * Licensed under MIT Open Source
 */
/*! normalize-scss | MIT/GPLv2 License | bit.ly/normalize-scss */
/* Document
       ========================================================================== */
/**
     * 1. Change the default font family in all browsers (opinionated).
     * 2. Correct the line height in all browsers.
     * 3. Prevent adjustments of font size after orientation changes in
     *    IE on Windows Phone and in iOS.
     */
/* 
  Allow angular.js to be loaded in body, hiding cloaked elements until 
  templates compile.  The !important is important given that there may be 
  other selectors that are more specific or come later and might alter display.  
 */
[ng\:cloak], [ng-cloak], .ng-cloak {
  display: none !important; }

html {
  font-family: Montserrat, sans-serif;
  /* 1 */
  line-height: 1.15;
  /* 2 */
  -ms-text-size-adjust: 100%;
  /* 3 */
  -webkit-text-size-adjust: 100%;
  /* 3 */ }

/* 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-.
     */
figcaption, figure {
  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 */ }

/**
     * Add the correct display in IE.
     */
main {
  display: block; }

/**
     * 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: Montserrat, sans-serif;
  /* 1 */
  font-size: 1em;
  /* 2 */ }

/* Links
       ========================================================================== */
/**
     * 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 */ }

/**
     * Remove the outline on focused links when they are also active or hovered
     * in all browsers (opinionated).
     */
a:active, a:hover {
  outline-width: 0; }

/* Text-level semantics
       ========================================================================== */
/**
     * 1. Remove the bottom border in Firefox 39-.
     * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
     */
abbr[title] {
  border-bottom: none;
  /* 1 */
  text-decoration: underline;
  /* 2 */
  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: Montserrat, sans-serif;
  /* 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: Montserrat, sans-serif;
  /* 1 */
  font-size: 130%;
  /* 1 */
  line-height: 1.15;
  /* 1 */
  margin: 0;
  /* 2 */ }

/**
     * Show the overflow in IE.
     */
button {
  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 */ }

button, [type="button"], [type="reset"], [type="submit"] {
  /**
       * Remove the inner border and padding in Firefox.
       */
  /**
       * Restore the focus styles unset by the previous rule.
       */ }

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

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

/**
     * Show the overflow in Edge.
     */
input {
  overflow: visible; }

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

/**
     * Change the border, margin, and padding in all browsers (opinionated).
     */
fieldset {
  border: 1px solid #c0c0c0;
  margin: 0 2px;
  padding: 0.35em 0.625em 0.75em; }

/**
     * 1. Correct the text wrapping in Edge and IE.
     * 2. Correct the color inheritance from `fieldset` elements in IE.
     * 3. Remove the padding so developers are not caught out when they zero out
     *    `fieldset` elements in all browsers.
     */
legend {
  box-sizing: border-box;
  /* 1 */
  display: table;
  /* 1 */
  max-width: 100%;
  /* 1 */
  padding: 0;
  /* 3 */
  color: inherit;
  /* 2 */
  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; }

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

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

/*
     * Add the correct display in IE 9-.
     */
menu {
  display: block; }

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

.foundation-mq {
  font-family: "small=0em&medium=40em&large=64em&xlarge=75em&xxlarge=90em"; }

html {
  box-sizing: border-box;
  font-size: 100%; }

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

body {
  margin: 0;
  padding: 0;
  background: #fefefe;
  font-family: Montserrat, sans-serif;
  font-weight: normal;
  line-height: 1.5;
  color: #0a0a0a;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale; }

img {
  display: inline-block;
  vertical-align: middle;
  max-width: 100%;
  height: auto;
  -ms-interpolation-mode: bicubic; }

textarea {
  height: auto;
  min-height: 50px;
  border-radius: 0; }

select {
  box-sizing: border-box;
  width: 100%;
  border-radius: 0; }

.map_canvas img, .map_canvas embed, .map_canvas object, .mqa-display img, .mqa-display embed, .mqa-display object {
  max-width: none !important; }

button {
  padding: 0;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border: 0;
  border-radius: 0;
  background: transparent;
  line-height: 1; }

[data-whatinput='mouse'] button {
  outline: 0; }

pre {
  overflow: auto; }

.is-visible {
  display: block !important; }

.is-hidden {
  display: none !important; }

.row {
  max-width: 75rem;
  margin-right: auto;
  margin-left: auto;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-flow: row wrap;
  flex-flow: row wrap; }

.row .row {
  margin-right: -0.625rem;
  margin-left: -0.625rem; }

@media print, screen and (min-width: 40em) {
  .row .row {
    margin-right: -0.9375rem;
    margin-left: -0.9375rem; } }

@media print, screen and (min-width: 64em) {
  .row .row {
    margin-right: -0.9375rem;
    margin-left: -0.9375rem; } }

.row .row.collapse {
  margin-right: 0;
  margin-left: 0; }

.row.expanded {
  max-width: none; }

.row:not(.expanded) .row {
  max-width: none; }

.row.collapse > .column, .row.collapse > .columns {
  padding-right: 0;
  padding-left: 0; }

.row.is-collapse-child, .row.collapse > .column > .row, .row.collapse > .columns > .row {
  margin-right: 0;
  margin-left: 0; }

.column, .columns {
  -ms-flex: 1 1 0px;
  flex: 1 1 0px;
  padding-right: 0.625rem;
  padding-left: 0.625rem;
  min-width: initial; }

@media print, screen and (min-width: 40em) {
  .column, .columns {
    padding-right: 0.9375rem;
    padding-left: 0.9375rem; } }

.column.row.row, .row.row.columns {
  float: none;
  display: block; }

.row .column.row.row, .row .row.row.columns {
  margin-right: 0;
  margin-left: 0;
  padding-right: 0;
  padding-left: 0; }

.flex-container {
  display: -ms-flexbox;
  display: flex; }

.flex-child-auto {
  -ms-flex: 1 1 auto;
  flex: 1 1 auto; }

.flex-child-grow {
  -ms-flex: 1 0 auto;
  flex: 1 0 auto; }

.flex-child-shrink {
  -ms-flex: 0 1 auto;
  flex: 0 1 auto; }

.flex-dir-row {
  -ms-flex-direction: row;
  flex-direction: row; }

.flex-dir-row-reverse {
  -ms-flex-direction: row-reverse;
  flex-direction: row-reverse; }

.flex-dir-column {
  -ms-flex-direction: column;
  flex-direction: column; }

.flex-dir-column-reverse {
  -ms-flex-direction: column-reverse;
  flex-direction: column-reverse; }

.small-1 {
  -ms-flex: 0 0 8.3333333333%;
  flex: 0 0 8.3333333333%;
  max-width: 8.3333333333%; }

.small-offset-0 {
  margin-left: 0%; }

.small-2 {
  -ms-flex: 0 0 16.6666666667%;
  flex: 0 0 16.6666666667%;
  max-width: 16.6666666667%; }

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

.small-3 {
  -ms-flex: 0 0 25%;
  flex: 0 0 25%;
  max-width: 25%; }

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

.small-4 {
  -ms-flex: 0 0 33.3333333333%;
  flex: 0 0 33.3333333333%;
  max-width: 33.3333333333%; }

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

.small-5 {
  -ms-flex: 0 0 41.6666666667%;
  flex: 0 0 41.6666666667%;
  max-width: 41.6666666667%; }

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

.small-6 {
  -ms-flex: 0 0 50%;
  flex: 0 0 50%;
  max-width: 50%; }

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

.small-7 {
  -ms-flex: 0 0 58.3333333333%;
  flex: 0 0 58.3333333333%;
  max-width: 58.3333333333%; }

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

.small-8 {
  -ms-flex: 0 0 66.6666666667%;
  flex: 0 0 66.6666666667%;
  max-width: 66.6666666667%; }

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

.small-9 {
  -ms-flex: 0 0 75%;
  flex: 0 0 75%;
  max-width: 75%; }

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

.small-10 {
  -ms-flex: 0 0 83.3333333333%;
  flex: 0 0 83.3333333333%;
  max-width: 83.3333333333%; }

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

.small-11 {
  -ms-flex: 0 0 91.6666666667%;
  flex: 0 0 91.6666666667%;
  max-width: 91.6666666667%; }

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

.small-12 {
  -ms-flex: 0 0 100%;
  flex: 0 0 100%;
  max-width: 100%; }

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

.small-order-1 {
  -ms-flex-order: 1;
  order: 1; }

.small-order-2 {
  -ms-flex-order: 2;
  order: 2; }

.small-order-3 {
  -ms-flex-order: 3;
  order: 3; }

.small-order-4 {
  -ms-flex-order: 4;
  order: 4; }

.small-order-5 {
  -ms-flex-order: 5;
  order: 5; }

.small-order-6 {
  -ms-flex-order: 6;
  order: 6; }

.small-up-1 {
  -ms-flex-wrap: wrap;
  flex-wrap: wrap; }

.small-up-1 > .column, .small-up-1 > .columns {
  -ms-flex: 0 0 100%;
  flex: 0 0 100%;
  max-width: 100%; }

.small-up-2 {
  -ms-flex-wrap: wrap;
  flex-wrap: wrap; }

.small-up-2 > .column, .small-up-2 > .columns {
  -ms-flex: 0 0 50%;
  flex: 0 0 50%;
  max-width: 50%; }

.small-up-3 {
  -ms-flex-wrap: wrap;
  flex-wrap: wrap; }

.small-up-3 > .column, .small-up-3 > .columns {
  -ms-flex: 0 0 33.3333333333%;
  flex: 0 0 33.3333333333%;
  max-width: 33.3333333333%; }

.small-up-4 {
  -ms-flex-wrap: wrap;
  flex-wrap: wrap; }

.small-up-4 > .column, .small-up-4 > .columns {
  -ms-flex: 0 0 25%;
  flex: 0 0 25%;
  max-width: 25%; }

.small-up-5 {
  -ms-flex-wrap: wrap;
  flex-wrap: wrap; }

.small-up-5 > .column, .small-up-5 > .columns {
  -ms-flex: 0 0 20%;
  flex: 0 0 20%;
  max-width: 20%; }

.small-up-6 {
  -ms-flex-wrap: wrap;
  flex-wrap: wrap; }

.small-up-6 > .column, .small-up-6 > .columns {
  -ms-flex: 0 0 16.6666666667%;
  flex: 0 0 16.6666666667%;
  max-width: 16.6666666667%; }

.small-up-7 {
  -ms-flex-wrap: wrap;
  flex-wrap: wrap; }

.small-up-7 > .column, .small-up-7 > .columns {
  -ms-flex: 0 0 14.2857142857%;
  flex: 0 0 14.2857142857%;
  max-width: 14.2857142857%; }

.small-up-8 {
  -ms-flex-wrap: wrap;
  flex-wrap: wrap; }

.small-up-8 > .column, .small-up-8 > .columns {
  -ms-flex: 0 0 12.5%;
  flex: 0 0 12.5%;
  max-width: 12.5%; }

.small-collapse > .column, .small-collapse > .columns {
  padding-right: 0;
  padding-left: 0; }

.small-uncollapse > .column, .small-uncollapse > .columns {
  padding-right: 0.625rem;
  padding-left: 0.625rem; }

@media print, screen and (min-width: 40em) {
  .medium-1 {
    -ms-flex: 0 0 8.3333333333%;
    flex: 0 0 8.3333333333%;
    max-width: 8.3333333333%; }
  .medium-offset-0 {
    margin-left: 0%; }
  .medium-2 {
    -ms-flex: 0 0 16.6666666667%;
    flex: 0 0 16.6666666667%;
    max-width: 16.6666666667%; }
  .medium-offset-1 {
    margin-left: 8.3333333333%; }
  .medium-3 {
    -ms-flex: 0 0 25%;
    flex: 0 0 25%;
    max-width: 25%; }
  .medium-offset-2 {
    margin-left: 16.6666666667%; }
  .medium-4 {
    -ms-flex: 0 0 33.3333333333%;
    flex: 0 0 33.3333333333%;
    max-width: 33.3333333333%; }
  .medium-offset-3 {
    margin-left: 25%; }
  .medium-5 {
    -ms-flex: 0 0 41.6666666667%;
    flex: 0 0 41.6666666667%;
    max-width: 41.6666666667%; }
  .medium-offset-4 {
    margin-left: 33.3333333333%; }
  .medium-6 {
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%; }
  .medium-offset-5 {
    margin-left: 41.6666666667%; }
  .medium-7 {
    -ms-flex: 0 0 58.3333333333%;
    flex: 0 0 58.3333333333%;
    max-width: 58.3333333333%; }
  .medium-offset-6 {
    margin-left: 50%; }
  .medium-8 {
    -ms-flex: 0 0 66.6666666667%;
    flex: 0 0 66.6666666667%;
    max-width: 66.6666666667%; }
  .medium-offset-7 {
    margin-left: 58.3333333333%; }
  .medium-9 {
    -ms-flex: 0 0 75%;
    flex: 0 0 75%;
    max-width: 75%; }
  .medium-offset-8 {
    margin-left: 66.6666666667%; }
  .medium-10 {
    -ms-flex: 0 0 83.3333333333%;
    flex: 0 0 83.3333333333%;
    max-width: 83.3333333333%; }
  .medium-offset-9 {
    margin-left: 75%; }
  .medium-11 {
    -ms-flex: 0 0 91.6666666667%;
    flex: 0 0 91.6666666667%;
    max-width: 91.6666666667%; }
  .medium-offset-10 {
    margin-left: 83.3333333333%; }
  .medium-12 {
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%; }
  .medium-offset-11 {
    margin-left: 91.6666666667%; }
  .medium-order-1 {
    -ms-flex-order: 1;
    order: 1; }
  .medium-order-2 {
    -ms-flex-order: 2;
    order: 2; }
  .medium-order-3 {
    -ms-flex-order: 3;
    order: 3; }
  .medium-order-4 {
    -ms-flex-order: 4;
    order: 4; }
  .medium-order-5 {
    -ms-flex-order: 5;
    order: 5; }
  .medium-order-6 {
    -ms-flex-order: 6;
    order: 6; }
  .medium-up-1 {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap; }
  .medium-up-1 > .column, .medium-up-1 > .columns {
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%; }
  .medium-up-2 {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap; }
  .medium-up-2 > .column, .medium-up-2 > .columns {
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%; }
  .medium-up-3 {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap; }
  .medium-up-3 > .column, .medium-up-3 > .columns {
    -ms-flex: 0 0 33.3333333333%;
    flex: 0 0 33.3333333333%;
    max-width: 33.3333333333%; }
  .medium-up-4 {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap; }
  .medium-up-4 > .column, .medium-up-4 > .columns {
    -ms-flex: 0 0 25%;
    flex: 0 0 25%;
    max-width: 25%; }
  .medium-up-5 {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap; }
  .medium-up-5 > .column, .medium-up-5 > .columns {
    -ms-flex: 0 0 20%;
    flex: 0 0 20%;
    max-width: 20%; }
  .medium-up-6 {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap; }
  .medium-up-6 > .column, .medium-up-6 > .columns {
    -ms-flex: 0 0 16.6666666667%;
    flex: 0 0 16.6666666667%;
    max-width: 16.6666666667%; }
  .medium-up-7 {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap; }
  .medium-up-7 > .column, .medium-up-7 > .columns {
    -ms-flex: 0 0 14.2857142857%;
    flex: 0 0 14.2857142857%;
    max-width: 14.2857142857%; }
  .medium-up-8 {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap; }
  .medium-up-8 > .column, .medium-up-8 > .columns {
    -ms-flex: 0 0 12.5%;
    flex: 0 0 12.5%;
    max-width: 12.5%; } }

@media print, screen and (min-width: 40em) and (min-width: 40em) {
  .medium-expand {
    -ms-flex: 1 1 0px;
    flex: 1 1 0px; } }

@media print, screen and (min-width: 40em) {
  .medium-flex-dir-row {
    -ms-flex-direction: row;
    flex-direction: row; }
  .medium-flex-dir-row-reverse {
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse; }
  .medium-flex-dir-column {
    -ms-flex-direction: column;
    flex-direction: column; }
  .medium-flex-dir-column-reverse {
    -ms-flex-direction: column-reverse;
    flex-direction: column-reverse; }
  .medium-flex-child-auto {
    -ms-flex: 1 1 auto;
    flex: 1 1 auto; }
  .medium-flex-child-grow {
    -ms-flex: 1 0 auto;
    flex: 1 0 auto; }
  .medium-flex-child-shrink {
    -ms-flex: 0 1 auto;
    flex: 0 1 auto; } }

.row.medium-unstack > .column, .row.medium-unstack > .columns {
  -ms-flex: 0 0 100%;
  flex: 0 0 100%; }

@media print, screen and (min-width: 40em) {
  .row.medium-unstack > .column, .row.medium-unstack > .columns {
    -ms-flex: 1 1 0px;
    flex: 1 1 0px; } }

@media print, screen and (min-width: 40em) {
  .medium-collapse > .column, .medium-collapse > .columns {
    padding-right: 0;
    padding-left: 0; }
  .medium-uncollapse > .column, .medium-uncollapse > .columns {
    padding-right: 0.9375rem;
    padding-left: 0.9375rem; } }

@media print, screen and (min-width: 64em) {
  .large-1 {
    -ms-flex: 0 0 8.3333333333%;
    flex: 0 0 8.3333333333%;
    max-width: 8.3333333333%; }
  .large-offset-0 {
    margin-left: 0%; }
  .large-2 {
    -ms-flex: 0 0 16.6666666667%;
    flex: 0 0 16.6666666667%;
    max-width: 16.6666666667%; }
  .large-offset-1 {
    margin-left: 8.3333333333%; }
  .large-3 {
    -ms-flex: 0 0 25%;
    flex: 0 0 25%;
    max-width: 25%; }
  .large-offset-2 {
    margin-left: 16.6666666667%; }
  .large-4 {
    -ms-flex: 0 0 33.3333333333%;
    flex: 0 0 33.3333333333%;
    max-width: 33.3333333333%; }
  .large-offset-3 {
    margin-left: 25%; }
  .large-5 {
    -ms-flex: 0 0 41.6666666667%;
    flex: 0 0 41.6666666667%;
    max-width: 41.6666666667%; }
  .large-offset-4 {
    margin-left: 33.3333333333%; }
  .large-6 {
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%; }
  .large-offset-5 {
    margin-left: 41.6666666667%; }
  .large-7 {
    -ms-flex: 0 0 58.3333333333%;
    flex: 0 0 58.3333333333%;
    max-width: 58.3333333333%; }
  .large-offset-6 {
    margin-left: 50%; }
  .large-8 {
    -ms-flex: 0 0 66.6666666667%;
    flex: 0 0 66.6666666667%;
    max-width: 66.6666666667%; }
  .large-offset-7 {
    margin-left: 58.3333333333%; }
  .large-9 {
    -ms-flex: 0 0 75%;
    flex: 0 0 75%;
    max-width: 75%; }
  .large-offset-8 {
    margin-left: 66.6666666667%; }
  .large-10 {
    -ms-flex: 0 0 83.3333333333%;
    flex: 0 0 83.3333333333%;
    max-width: 83.3333333333%; }
  .large-offset-9 {
    margin-left: 75%; }
  .large-11 {
    -ms-flex: 0 0 91.6666666667%;
    flex: 0 0 91.6666666667%;
    max-width: 91.6666666667%; }
  .large-offset-10 {
    margin-left: 83.3333333333%; }
  .large-12 {
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%; }
  .large-offset-11 {
    margin-left: 91.6666666667%; }
  .large-order-1 {
    -ms-flex-order: 1;
    order: 1; }
  .large-order-2 {
    -ms-flex-order: 2;
    order: 2; }
  .large-order-3 {
    -ms-flex-order: 3;
    order: 3; }
  .large-order-4 {
    -ms-flex-order: 4;
    order: 4; }
  .large-order-5 {
    -ms-flex-order: 5;
    order: 5; }
  .large-order-6 {
    -ms-flex-order: 6;
    order: 6; }
  .large-up-1 {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap; }
  .large-up-1 > .column, .large-up-1 > .columns {
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%; }
  .large-up-2 {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap; }
  .large-up-2 > .column, .large-up-2 > .columns {
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%; }
  .large-up-3 {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap; }
  .large-up-3 > .column, .large-up-3 > .columns {
    -ms-flex: 0 0 33.3333333333%;
    flex: 0 0 33.3333333333%;
    max-width: 33.3333333333%; }
  .large-up-4 {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap; }
  .large-up-4 > .column, .large-up-4 > .columns {
    -ms-flex: 0 0 25%;
    flex: 0 0 25%;
    max-width: 25%; }
  .large-up-5 {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap; }
  .large-up-5 > .column, .large-up-5 > .columns {
    -ms-flex: 0 0 20%;
    flex: 0 0 20%;
    max-width: 20%; }
  .large-up-6 {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap; }
  .large-up-6 > .column, .large-up-6 > .columns {
    -ms-flex: 0 0 16.6666666667%;
    flex: 0 0 16.6666666667%;
    max-width: 16.6666666667%; }
  .large-up-7 {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap; }
  .large-up-7 > .column, .large-up-7 > .columns {
    -ms-flex: 0 0 14.2857142857%;
    flex: 0 0 14.2857142857%;
    max-width: 14.2857142857%; }
  .large-up-8 {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap; }
  .large-up-8 > .column, .large-up-8 > .columns {
    -ms-flex: 0 0 12.5%;
    flex: 0 0 12.5%;
    max-width: 12.5%; } }

@media print, screen and (min-width: 64em) and (min-width: 64em) {
  .large-expand {
    -ms-flex: 1 1 0px;
    flex: 1 1 0px; } }

@media print, screen and (min-width: 64em) {
  .large-flex-dir-row {
    -ms-flex-direction: row;
    flex-direction: row; }
  .large-flex-dir-row-reverse {
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse; }
  .large-flex-dir-column {
    -ms-flex-direction: column;
    flex-direction: column; }
  .large-flex-dir-column-reverse {
    -ms-flex-direction: column-reverse;
    flex-direction: column-reverse; }
  .large-flex-child-auto {
    -ms-flex: 1 1 auto;
    flex: 1 1 auto; }
  .large-flex-child-grow {
    -ms-flex: 1 0 auto;
    flex: 1 0 auto; }
  .large-flex-child-shrink {
    -ms-flex: 0 1 auto;
    flex: 0 1 auto; } }

.row.large-unstack > .column, .row.large-unstack > .columns {
  -ms-flex: 0 0 100%;
  flex: 0 0 100%; }

@media print, screen and (min-width: 64em) {
  .row.large-unstack > .column, .row.large-unstack > .columns {
    -ms-flex: 1 1 0px;
    flex: 1 1 0px; } }

@media print, screen and (min-width: 64em) {
  .large-collapse > .column, .large-collapse > .columns {
    padding-right: 0;
    padding-left: 0; }
  .large-uncollapse > .column, .large-uncollapse > .columns {
    padding-right: 0.9375rem;
    padding-left: 0.9375rem; } }

.shrink {
  -ms-flex: 0 0 auto;
  flex: 0 0 auto;
  max-width: 100%; }

.column-block {
  margin-bottom: 1.25rem; }

.column-block > :last-child {
  margin-bottom: 0; }

@media print, screen and (min-width: 40em) {
  .column-block {
    margin-bottom: 1.875rem; }
  .column-block > :last-child {
    margin-bottom: 0; } }

.hide {
  display: none !important; }

.invisible {
  visibility: hidden; }

@media screen and (max-width: 39.9375em) {
  .hide-for-small-only {
    display: none !important; } }

@media screen and (max-width: 0em), screen and (min-width: 40em) {
  .show-for-small-only {
    display: none !important; } }

@media print, screen and (min-width: 40em) {
  .hide-for-medium {
    display: none !important; } }

@media screen and (max-width: 39.9375em) {
  .show-for-medium {
    display: none !important; } }

@media screen and (min-width: 40em) and (max-width: 63.9375em) {
  .hide-for-medium-only {
    display: none !important; } }

@media screen and (max-width: 39.9375em), screen and (min-width: 64em) {
  .show-for-medium-only {
    display: none !important; } }

@media print, screen and (min-width: 64em) {
  .hide-for-large {
    display: none !important; } }

@media screen and (max-width: 63.9375em) {
  .show-for-large {
    display: none !important; } }

@media screen and (min-width: 64em) and (max-width: 74.9375em) {
  .hide-for-large-only {
    display: none !important; } }

@media screen and (max-width: 63.9375em), screen and (min-width: 75em) {
  .show-for-large-only {
    display: none !important; } }

.show-for-sr, .show-on-focus {
  position: absolute !important;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0); }

.show-on-focus:active, .show-on-focus:focus {
  position: static !important;
  width: auto;
  height: auto;
  overflow: visible;
  clip: auto; }

.show-for-landscape, .hide-for-portrait {
  display: block !important; }

@media screen and (orientation: landscape) {
  .show-for-landscape, .hide-for-portrait {
    display: block !important; } }

@media screen and (orientation: portrait) {
  .show-for-landscape, .hide-for-portrait {
    display: none !important; } }

.hide-for-landscape, .show-for-portrait {
  display: none !important; }

@media screen and (orientation: landscape) {
  .hide-for-landscape, .show-for-portrait {
    display: none !important; } }

@media screen and (orientation: portrait) {
  .hide-for-landscape, .show-for-portrait {
    display: block !important; } }

.float-left {
  float: left !important; }

.float-right {
  float: right !important; }

.float-center {
  display: block;
  margin-right: auto;
  margin-left: auto; }

.clearfix::before, .clearfix::after {
  display: table;
  content: ' '; }

.clearfix::after {
  clear: both; }

.media-object {
  display: block;
  margin-bottom: 1rem; }

.media-object img {
  max-width: none; }

@media screen and (max-width: 39.9375em) {
  .media-object.stack-for-small .media-object-section {
    padding: 0;
    padding-bottom: 1rem;
    display: block; }
  .media-object.stack-for-small .media-object-section img {
    width: 100%; } }

.media-object-section {
  display: table-cell;
  vertical-align: top; }

.media-object-section:first-child {
  padding-right: 1rem; }

.media-object-section:last-child:not(:nth-child(2)) {
  padding-left: 1rem; }

.media-object-section > :last-child {
  margin-bottom: 0; }

.media-object-section.middle {
  vertical-align: middle; }

.media-object-section.bottom {
  vertical-align: bottom; }

.is-off-canvas-open {
  overflow: hidden; }

.js-off-canvas-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  transition: opacity 0.5s ease, visibility 0.5s ease;
  background: rgba(254, 254, 254, 0.25);
  opacity: 0;
  visibility: hidden;
  overflow: hidden; }

.js-off-canvas-overlay.is-visible {
  opacity: 1;
  visibility: visible; }

.js-off-canvas-overlay.is-closable {
  cursor: pointer; }

.js-off-canvas-overlay.is-overlay-absolute {
  position: absolute; }

.js-off-canvas-overlay.is-overlay-fixed {
  position: fixed; }

.off-canvas-wrapper {
  position: relative;
  overflow: hidden; }

.off-canvas {
  position: fixed;
  z-index: 1;
  transition: transform 0.5s ease;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  background: #e6e6e6; }

[data-whatinput='mouse'] .off-canvas {
  outline: 0; }

.off-canvas.is-transition-overlap {
  z-index: 10; }

.off-canvas.is-transition-overlap.is-open {
  box-shadow: 0 0 10px rgba(10, 10, 10, 0.7); }

.off-canvas.is-open {
  transform: translate(0, 0); }

.off-canvas-absolute {
  position: absolute;
  z-index: 1;
  transition: transform 0.5s ease;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  background: #e6e6e6; }

[data-whatinput='mouse'] .off-canvas-absolute {
  outline: 0; }

.off-canvas-absolute.is-transition-overlap {
  z-index: 10; }

.off-canvas-absolute.is-transition-overlap.is-open {
  box-shadow: 0 0 10px rgba(10, 10, 10, 0.7); }

.off-canvas-absolute.is-open {
  transform: translate(0, 0); }

.position-left {
  top: 0;
  left: 0;
  width: 250px;
  height: 100%;
  transform: translateX(-250px);
  overflow-y: auto; }

.position-left.is-open ~ .off-canvas-content {
  transform: translateX(250px); }

.position-left.is-transition-push::after {
  position: absolute;
  top: 0;
  right: 0;
  height: 100%;
  width: 1px;
  box-shadow: 0 0 10px rgba(10, 10, 10, 0.7);
  content: " "; }

.position-left.is-transition-overlap.is-open ~ .off-canvas-content {
  transform: none; }

.position-right {
  top: 0;
  right: 0;
  width: 250px;
  height: 100%;
  transform: translateX(250px);
  overflow-y: auto; }

.position-right.is-open ~ .off-canvas-content {
  transform: translateX(-250px); }

.position-right.is-transition-push::after {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 1px;
  box-shadow: 0 0 10px rgba(10, 10, 10, 0.7);
  content: " "; }

.position-right.is-transition-overlap.is-open ~ .off-canvas-content {
  transform: none; }

.position-top {
  top: 0;
  left: 0;
  width: 100%;
  height: 250px;
  transform: translateY(-250px);
  overflow-x: auto; }

.position-top.is-open ~ .off-canvas-content {
  transform: translateY(250px); }

.position-top.is-transition-push::after {
  position: absolute;
  bottom: 0;
  left: 0;
  height: 1px;
  width: 100%;
  box-shadow: 0 0 10px rgba(10, 10, 10, 0.7);
  content: " "; }

.position-top.is-transition-overlap.is-open ~ .off-canvas-content {
  transform: none; }

.position-bottom {
  bottom: 0;
  left: 0;
  width: 100%;
  height: 250px;
  transform: translateY(250px);
  overflow-x: auto; }

.position-bottom.is-open ~ .off-canvas-content {
  transform: translateY(-250px); }

.position-bottom.is-transition-push::after {
  position: absolute;
  top: 0;
  left: 0;
  height: 1px;
  width: 100%;
  box-shadow: 0 0 10px rgba(10, 10, 10, 0.7);
  content: " "; }

.position-bottom.is-transition-overlap.is-open ~ .off-canvas-content {
  transform: none; }

.off-canvas-content {
  transition: transform 0.5s ease;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden; }

@media print, screen and (min-width: 40em) {
  .position-left.reveal-for-medium {
    transform: none;
    z-index: 1; }
  .position-left.reveal-for-medium ~ .off-canvas-content {
    margin-left: 250px; }
  .position-right.reveal-for-medium {
    transform: none;
    z-index: 1; }
  .position-right.reveal-for-medium ~ .off-canvas-content {
    margin-right: 250px; }
  .position-top.reveal-for-medium {
    transform: none;
    z-index: 1; }
  .position-top.reveal-for-medium ~ .off-canvas-content {
    margin-top: 250px; }
  .position-bottom.reveal-for-medium {
    transform: none;
    z-index: 1; }
  .position-bottom.reveal-for-medium ~ .off-canvas-content {
    margin-bottom: 250px; } }

@media print, screen and (min-width: 64em) {
  .position-left.reveal-for-large {
    transform: none;
    z-index: 1; }
  .position-left.reveal-for-large ~ .off-canvas-content {
    margin-left: 250px; }
  .position-right.reveal-for-large {
    transform: none;
    z-index: 1; }
  .position-right.reveal-for-large ~ .off-canvas-content {
    margin-right: 250px; }
  .position-top.reveal-for-large {
    transform: none;
    z-index: 1; }
  .position-top.reveal-for-large ~ .off-canvas-content {
    margin-top: 250px; }
  .position-bottom.reveal-for-large {
    transform: none;
    z-index: 1; }
  .position-bottom.reveal-for-large ~ .off-canvas-content {
    margin-bottom: 250px; } }

@media print, screen and (min-width: 40em) {
  section .AfleveradresForm .text-align-center,
  section .BetalingForm .text-align-center {
    text-align: center !important; }
  section .AfleveradresForm .inputField .label-text {
    text-align: right; }
  section .AfleveradresForm .inputField .margin-top-10-small,
  section .BetalingForm .inputField .margin-top-10-small {
    margin-top: 0px !important; } }

@media print, screen and (min-width: 64em) {
  section .AfleveradresForm .inputField .label-optioneel,
  section .BetalingForm .inputField .label-optioneel {
    margin-left: 0px !important; } }

.btnClose {
  background-color: #a6ada7;
  color: white; }

section .AfleveradresForm .inputField:last-child .label-text,
section .BetalingForm .inputField:last-child .label-text {
  align-self: flex-start; }

section .AfleveradresForm .inputField .label-text,
section .BetalingForm .inputField .label-text {
  font-family: Montserrat, sans-serif;
  font-size: 130%;
  color: rgba(10, 10, 10, 0.7);
  font-weight: bolder;
  width: 15%;
  margin-right: 15px; }

section .AfleveradresForm .inputField .label-text input[type="radio"],
section .BetalingForm .inputField .label-text input[type="radio"] {
  margin: 0px 10px 0px 5px; }

section .AfleveradresForm .Title,
section .BetalingForm .Title {
  font-weight: bold; }

section .BetalingForm .ImgPayment {
  margin: 0px 15px 0px 0px;
  height: 40px; }

section .AfleveradresForm .margin-right-15,
section .BetalingForm .margin-right-15 {
  margin-right: 15px; }

section .AfleveradresForm .inputField .margin-top-10-small,
section .BetalingForm .inputField .margin-top-10-small {
  margin-top: 10px; }

section .AfleveradresForm .inputField .margin-left-15,
section .BetalingForm .inputField .margin-left-15 {
  margin-left: 15px; }

section .AfleveradresForm .inputField .ng-invalid.ng-touched:not(.ng-empty),
section .BetalingForm .inputField .ng-invalid.ng-touched:not(.ng-empty) {
  background-color: lightpink;
  border-color: darkred; }

section .AfleveradresForm .ng-valid.ng-touched:not(.ng-empty),
section .BetalingForm .ng-valid.ng-touched:not(.ng-empty) {
  border-bottom-color: darkgreen !important; }

section .AfleveradresForm .inputField .label-optioneel,
section .BetalingForm .inputField .label-optioneel {
  color: #999;
  font-size: 80%;
  margin-left: 20%; }

section .BetalingForm .PaymentOverview {
  background-color: #ECF1ED;
  padding: 0px 25px 0px 25px;
  /* border: 2px solid; */
  border-radius: 10px; }

section .AfleveradresForm .inputField select,
section .AfleveradresForm .inputField input,
section .AfleveradresForm .inputField textarea,
section .BetalingForm .inputField select,
section .BetalingForm .inputField input,
section .BetalingForm .inputField textarea {
  width: 100%;
  padding: 5px 15px;
  min-height: 35px;
  max-height: 35px;
  border-radius: 4px;
  border: 2px solid #f4f3f1;
  font-family: Montserrat, sans-serif;
  color: #666;
  align-self: center; }

section .AfleveradresForm .inputField select:active,
section .AfleveradresForm .inputField select:focus,
section .AfleveradresForm .inputField input:active,
section .AfleveradresForm .inputField input:focus,
section .AfleveradresForm .inputField textarea:active,
section .AfleveradresForm .inputField textarea:focus {
  border-color: #e33d10; }

section .AfleveradresForm .inputField .min-width-17 {
  min-width: 17%; }

@media only screen and (max-width: 1024px) {
  section .AfleveradresForm,
  section .BetalingForm {
    padding: 0 25px; } }

.flex-inline-wrap {
  display: flex;
  flex-wrap: wrap; }

section .AfleveradresForm .inputField,
section .BetalingForm .inputField {
  width: 100%;
  display: flex;
  padding: 10px 0; }

section .AfleveradresForm .inputField input[type="radio"],
section .BetalingForm .inputField input[type="radio"] {
  width: 20px;
  min-height: 10px; }

section .AfleveradresForm .inputField textarea,
section .BetalingForm .inputField textarea {
  min-height: 150px;
  padding: 10px 15px;
  resize: none; }

@-moz-document url-prefix() {
  section .AfleveradresForm .inputField select,
  section .BetalingForm .inputField select {
    padding: 0px 15px;
    height: 50px;
    line-height: 50px; } }

.newActionLoading {
  height: 50px;
  width: 50px;
  background: url("../img/loader50px.gif") no-repeat; }

section.IHF {
  position: relative; }

section.IHF .row {
  position: relative;
  padding: 20px 0; }

section.IHF h2 {
  color: #555555; }

section.IHF .boldSpan {
  color: #e33d10;
  font-weight: bold; }

section.IHF p {
  /*font-weight: bold;*/ }

section.IHF ul, section.IHF li {
  width: auto;
  margin: unset;
  padding: unset;
  list-style-type: unset; }

section.IHF .modal-close {
  position: absolute;
  right: 0px; }

section.IHF ul.product {
  margin: 0px 0px 0px 0px; }

section.IHF ul.product li {
  display: -ms-flexbox;
  display: flex;
  margin: 0;
  position: relative;
  -ms-flex-pack: start;
  justify-content: flex-start;
  display: inline-block;
  float: left;
  vertical-align: top;
  width: 45%;
  margin-right: 20px; }

section.IHF .ihf-row p {
  width: 100%; }

section.IHF .ihf-row a,
section.IHF .ihf-row span,
section.IHF .ihf-row p {
  margin: 0px;
  font-size: 14px;
  line-height: inherit; }

@media only screen and (max-width: 1024px) {
  section.IHF ul.product li {
    float: none;
    width: 100%;
    margin-right: 0px; }
  section.IHF ul.product li .Prio1 img,
  section.IHF ul.product li .Prio2 img,
  section.IHF ul.product li .Prio3 img {
    display: none; } }

section.IHF ul.product li .IHFInfo {
  padding: 20px;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -ms-flex-direction: column;
  flex-direction: column;
  display: -ms-flexbox;
  background-color: #f4f3f1;
  border-radius: 8px; }

section.IHF ul.product li .IHFInfo .Title {
  min-height: 130px; }

section.IHF ul.product li .Prio1 img,
section.IHF ul.product li .Prio2 img,
section.IHF ul.product li .Prio3 img {
  height: 25px;
  position: absolute;
  left: 20px; }

section.IHF ul.product li .Prio1 {
  padding: 32px 40px;
  margin-top: 5px;
  margin-bottom: 10px;
  align-items: unset; }

section.IHF ul.product li .Prio1 img {
  top: 30%; }

section.IHF ul.product li .Prio2 {
  padding: 24px 30px;
  margin-top: 5px;
  margin-bottom: 10px;
  align-items: unset; }

section.IHF ul.product li .Prio2 img {
  top: 25%; }

section.IHF ul.product li .Prio3 {
  padding: 16px 20px;
  margin-top: 5px;
  margin-bottom: 10px;
  align-items: unset; }

section.IHF ul.product li .Prio3 img {
  top: 20%; }

section.IHF ul.product li .IHFInfo .productImg {
  text-indent: -9999px;
  height: 100%;
  background-position: center top;
  background-size: contain;
  background-repeat: no-repeat;
  position: relative;
  left: 0;
  padding: 20px; }

section.IHF ul.product li .IHFInfo .productImgWrapper {
  padding: 20px;
  background-color: #fff; }

@media only screen and (max-width: 1024px) {
  section.IHF ul.product li .IHFInfo .productImg {
    position: relative;
    margin-bottom: 20px; }
  section.IHF ul.product li .IHFInfo .productImgWrapper {
    padding: 0px; } }

section.IHF .vraag {
  padding: 16px 20px;
  margin-top: 5px;
  margin-bottom: 10px;
  align-items: unset; }

section.IHF .vraagStaatErNietBij {
  width: 30%; }

@media only screen and (max-width: 1024px) {
  section.IHF {
    margin: 0px 15px; }
  section.IHF ul.product li .IHFInfo {
    display: block; }
  section.IHF ul.product li .IHFInfo .Title {
    min-height: 0px; }
  section.IHF .button {
    margin-top: 5px;
    margin-bottom: 10px; }
  section.IHF .vraagStaatErNietBij {
    width: 100%; } }

/* Vraag pad */
section.IHF .VraagPad {
  padding-top: 10px;
  padding-bottom: 10px; }

section.IHF .VraagPad span a {
  color: #000000; }

section.IHF .VraagPad .iconhome {
  background-image: url("/Areas/Gebruikers/img/svg/icon_home.svg");
  color: #000000;
  margin: 0px 1px;
  height: 20px;
  background-size: 0.9375rem;
  background-repeat: no-repeat;
  background-position: left;
  display: inline-block;
  transition: 0.3s; }

section.IHF .VraagPad .vraagPadItem {
  background-image: url("/Areas/Gebruikers/img/svg/icon_down.svg");
  transform: rotate(270deg);
  width: 10px;
  height: 10px;
  background-size: 10px; }

section.IHF .VraagPad span:last-of-type a {
  color: #111111; }

@media only screen and (min-width: 40em) and (max-width: 64em) {
  section.IHF .imgRambo {
    margin-right: auto;
    margin-left: auto; } }

@media only screen and (min-width: 1024px) and (max-width: 1500px) {
  section.IHF ul.product li,
  section.IHF .vraagStaatErNietBij {
    width: 46%; } }

@media only screen and (min-width: 1024px) and (max-width: 1750px) {
  section.IHF ul.product li .Prio1 img,
  section.IHF ul.product li .Prio2 img,
  section.IHF ul.product li .Prio3 img {
    left: 25px; } }

@media only screen and (min-width: 64em) {
  section.IHF .large-margin {
    margin: 0px 0px 0px 5%; }
  section.IHF .imgRambo img {
    float: right; } }

.ArtikelPreview {
  display: block; }
  @media only screen and (max-width: 1024px) {
    .ArtikelPreview {
      margin: 10px; } }

@media only screen and (max-width: 1024px) {
  .ArtikelPreview .topContainer {
    margin-top: 30px;
    padding-top: 30px;
    border-top: solid 2px #ececec; } }

.ArtikelPreview .top {
  background: #4594EC;
  color: #fff;
  border-radius: 4px; }

.ArtikelPreview .topContent {
  padding-left: 20px; }

.ArtikelPreview .schooljaar {
  vertical-align: bottom; }

.ArtikelPreview .Categorie {
  font-weight: bold;
  background-color: #ECF1ED;
  padding: 13px 20px;
  color: #e33d10;
  border-radius: 10px; }

.ArtikelPreview .DatumRow {
  background-color: #ECF1ED;
  border-radius: 4px; }

.ArtikelPreview .Datum {
  padding: 20px; }

.ArtikelPreview .artikelblok {
  display: flex;
  margin: 0 20px; }
  @media only screen and (max-width: 1024px) {
    .ArtikelPreview .artikelblok {
      flex-direction: column; } }

.ArtikelPreview .Artikelomschrijving {
  margin-bottom: 20px; }

.ArtikelPreview .Totaalbedrag {
  font-weight: bold; }

.ArtikelPreview .productCode {
  font-weight: bold; }

.ArtikelPreview .artikelExtraInfo {
  color: gray; }

.ArtikelPreview .Totaalblok {
  display: flex;
  font-weight: bold;
  background-color: #ECF1ED;
  padding: 13px 20px;
  color: #e33d10;
  border-radius: 4px; }
  @media only screen and (max-width: 1024px) {
    .ArtikelPreview .Totaalblok {
      flex-direction: column; } }

.ArtikelPreview hr {
  height: 1px;
  color: #ECF1ED; }

.bannerSchoolImg {
  height: 150px;
  width: 800px; }
  @media only screen and (max-width: 767px) {
    .bannerSchoolImg {
      display: none; } }

@media only screen and (max-width: 1024px) {
  .LeermiddelenOverzichtForm {
    padding: 0 40px; } }

.icon {
  margin: 0px 1px;
  text-indent: -9999px;
  height: 1.875rem;
  width: 1.875rem;
  background-size: 0.9375rem;
  background-repeat: no-repeat;
  background-position: center;
  display: inline-block;
  border-radius: 0.9375rem;
  text-align: center;
  transition: 0.3s; }
  .icon.close {
    background-image: url("/Areas/Gebruikers/img/svg/icon_close-sinas.svg");
    background-size: 1.25rem;
    transition: 0.3s;
    position: absolute;
    right: 0;
    width: 60px;
    height: 60px;
    background-position: center center;
    display: none;
    cursor: pointer;
    z-index: 7; }
    @media only screen and (max-width: 1024px) {
      .icon.close {
        display: block; } }
  .icon.open {
    background-image: url("/Areas/Gebruikers/img/svg/icon_menu.svg");
    background-size: 1.25rem;
    transition: 0.3s;
    position: absolute;
    left: 0;
    width: 60px;
    height: 60px;
    background-position: center center;
    cursor: pointer;
    z-index: 7;
    display: none; }
    @media only screen and (max-width: 1024px) {
      .icon.open {
        display: block; }
        .icon.open.active {
          display: none; } }
  .icon.modelClose {
    background-image: url("/Areas/Gebruikers/img/svg/icon_close-sinas.svg");
    background-size: 1.25rem;
    transition: 0.3s;
    position: absolute;
    right: 0;
    width: 60px;
    background-position: center center;
    display: inline;
    cursor: pointer;
    z-index: 7; }
  .icon.fb, .icon.tw, .icon.yb, .icon.search, .icon.mail {
    transition: 0.3s; }
    .icon.fb:hover, .icon.tw:hover, .icon.yb:hover, .icon.search:hover, .icon.mail:hover {
      opacity: 0.6;
      transition: 0.3s; }
  .icon.trash {
    background-image: url("/Areas/Gebruikers/img/icon_delete.png");
    cursor: pointer;
    background-position: left center;
    border-radius: 0; }
  .icon.discount, .icon.check, .icon.truck, .icon.download {
    background-size: 1.25rem;
    margin-right: 4px;
    position: relative;
    top: 9px; }
  .icon.discount {
    background-image: url("/Areas/Gebruikers/img/svg/icon_discount.svg"); }
  .icon.check {
    background-image: url("/Areas/Gebruikers/img/svg/icon_check.svg");
    left: -6px;
    margin-right: -4px; }
  .icon.truck {
    background-image: url("/Areas/Gebruikers/img/svg/icon_truck.svg");
    background-size: 1.625rem; }
  .icon.download {
    background-image: url("/Areas/Gebruikers/img/svg/icon_download-orange.svg");
    cursor: pointer;
    border-radius: 0;
    background-position: left center;
    top: 0; }
    @media only screen and (max-width: 1024px) {
      .icon.download {
        margin-left: 10px; } }
  .icon.mail {
    background-image: url("/Areas/Gebruikers/img/svg/icon_mail-orange.svg");
    border-radius: 0;
    background-size: contain;
    width: 1.375rem;
    height: 1.375rem;
    margin-top: 10px;
    cursor: pointer;
    background-position: left center; }
    @media only screen and (max-width: 1024px) {
      .icon.mail {
        margin-top: 6px;
        margin-left: 10px; } }
  .icon.arrow {
    background-image: url("/Areas/Gebruikers/img/svg/icon_arrow-white.svg");
    top: -2px;
    left: 5px;
    position: relative; }
  .icon.arrowBlue {
    background-image: url("/Areas/Gebruikers/img/svg/icon_arrow-lightblue.svg");
    top: -2px;
    left: 5px;
    position: relative; }
  .icon.shopCartIcon {
    background-image: url("/Areas/Gebruikers/img/svg/icon_shopping-cart-sinas.svg");
    top: -5px;
    position: relative;
    margin: 0; }
  .icon.information {
    background-image: url("/Areas/Gebruikers/img/svg/icon_information.svg");
    top: 0px;
    position: relative;
    margin: 0;
    background-size: 1.25rem;
    cursor: pointer; }
    @media only screen and (max-width: 640px) {
      .icon.information {
        width: 3rem;
        height: 3rem;
        padding-right: 15px; } }
  .icon.dropdown {
    width: 8px;
    height: 5px;
    display: inline-block;
    position: relative;
    top: 5px;
    left: 3px;
    background-image: url("/Areas/Gebruikers/img/svg/icon_down_black.svg");
    background-repeat: no-repeat;
    background-size: 100%; }
    @media only screen and (max-width: 1024px) {
      .icon.dropdown {
        display: none; } }
    .icon.dropdown:hover {
      background-image: url("/Areas/Gebruikers/img/svg/icon_down_black.svg"); }
    .icon.dropdown.red {
      background-image: url("/Areas/Gebruikers/img/svg/icon_down-grey.svg"); }
      .icon.dropdown.red:hover {
        background-image: url("/Areas/Gebruikers/img/svg/icon_down-grey.svg"); }

footer {
  background-color: #ECF1ED;
  padding: 35px 0px 0;
  margin-top: 40px; }
  @media only screen and (max-width: 1024px) {
    footer .footerMenu {
      padding: 0 20px; } }
  footer p, footer li, footer ul, footer a {
    color: #111111;
    font-family: Montserrat, sans-serif;
    font-size: 0.875rem;
    font-weight: 400;
    letter-spacing: .6px;
    line-height: 28px;
    text-decoration: none; }
  footer a:hover {
    text-decoration: underline; }
  footer h3 {
    font-family: Montserrat, sans-serif;
    color: #111111;
    font-weight: 700;
    font-size: 1.375rem;
    line-height: 28px;
    padding-bottom: 10px; }
  footer ul {
    padding-bottom: 15px; }
  footer .checkItems {
    padding-bottom: 30px; }
    footer .checkItems ul {
      padding-bottom: 0; }
      footer .checkItems ul li {
        display: -ms-flexbox;
        display: flex;
        -ms-flex-align: center;
        align-items: center; }
        footer .checkItems ul li span.check {
          top: 0;
          margin: 0;
          left: -4px; }
        footer .checkItems ul li p {
          line-height: 14px; }
  footer .sponsors {
    width: 100%;
    background: white; }
    footer .sponsors h4 {
      color: #111111;
      font-size: 0.875rem;
      line-height: 24px;
      display: inline-block;
      float: left;
      font-family: Montserrat, sans-serif;
      font-weight: 400;
      align-self: center;
      padding-left: 15px; }
      @media only screen and (max-width: 640px) {
        footer .sponsors h4 {
          text-align: center;
          width: 100%;
          display: block;
          padding-top: 5px; } }
    footer .sponsors ul {
      display: flex;
      align-items: center;
      padding: 0;
      justify-content: flex-start; }
      @media only screen and (max-width: 640px) {
        footer .sponsors ul {
          justify-content: center;
          width: 100%; } }
      footer .sponsors ul li {
        padding: 12px; }
        @media only screen and (max-width: 640px) {
          footer .sponsors ul li {
            padding: 5px 8px 10px; } }
        footer .sponsors ul li img {
          height: 25px; }
          @media only screen and (max-width: 640px) {
            footer .sponsors ul li img {
              height: 20px; } }

.button {
  text-transform: uppercase;
  font-size: 0.875rem;
  letter-spacing: .6px;
  text-align: center;
  margin: 0;
  line-height: 20px;
  text-decoration: none;
  font-weight: 700;
  font-family: "Montserrat";
  cursor: pointer;
  transition: 0.3s;
  display: inline-block;
  border-radius: 10px;
  position: relative;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  border: none; }
  @media only screen and (max-width: 640px) {
    .button {
      letter-spacing: unset;
      /*anders staat tekst niet in midden button*/ } }
  .button.wide {
    width: calc(100% - 80px);
    padding: 16px 20px;
    margin: 10px 40px; }
  .button.full {
    width: 100%;
    padding: 16px 20px;
    margin: 10px 0px; }
  .button.margin-full {
    padding: 16px 20px;
    margin: 10px 20px; }
  .button.medium-full {
    width: 100%;
    padding: 6px 20px;
    margin: 10px 0px; }
  .button.blue {
    background: #555555;
    color: white;
    transition: 0.3s; }
    .button.blue:hover {
      background: #172983; }
  .button.sinas {
    background: #000000;
    color: white;
    transition: 0.3s; }
    .button.sinas:hover {
      background: #5A5A5A; }
    .button.sinas:disabled {
      background: #aaa; }
  .button.betaling {
    background-color: #fff;
    border: 2px solid #BBBBBB;
    color: #BBBBBB; }
    .button.betaling span {
      color: #BBBBBB;
      margin: 0px;
      min-width: 145px; }
    .button.betaling.selected {
      border-color: #00B900;
      color: #00B900; }
      .button.betaling.selected span {
        color: #00B900;
        min-width: 145px; }
  .button.winkelwagenDefault, .button.winkelwagenDefaultFirst {
    color: #fff;
    background-color: #00B900;
    border: 2px solid #00B900; }
    .button.winkelwagenDefault span, .button.winkelwagenDefaultFirst span {
      margin: 0px;
      color: #fff;
      min-width: 145px; }
  .button.dark {
    background: #111111;
    color: white;
    transition: 0.3s; }
    .button.dark:hover {
      background-color: #555555; }
  .button.left {
    margin: 10px 0; }
  .button.small {
    width: 65%;
    padding: 16px 20px; }
  .button.tweeOpRij {
    width: 50%;
    padding: 16px 20px;
    display: inline; }
    @media only screen and (max-width: 640px) {
      .button.tweeOpRij {
        width: 100%;
        padding: 16px 20px;
        display: block; } }
  .button.drieOpRij {
    width: 30%;
    padding: 16px 20px;
    display: inline; }
    @media only screen and (max-width: 640px) {
      .button.drieOpRij {
        width: 100%;
        padding: 16px 20px;
        display: block; } }
  .button.cookiemelding {
    margin-left: 12px;
    padding: 5px 8px;
    display: inline-block;
    background: #9F6000;
    color: white; }
    @media only screen and (max-width: 1109px) {
      .button.cookiemelding {
        width: 100%;
        margin-left: 0; } }
  @media only screen and (max-width: 1024px) {
    .button.cookiesMessageMain {
      margin-top: 180px !important; } }
  .button.arrow:after {
    content: "";
    display: block;
    margin: 0px 1px;
    text-indent: -9999px;
    width: 1rem;
    height: 1rem;
    background-size: 0.9375rem;
    background-repeat: no-repeat;
    background-position: center;
    display: inline-block;
    border-radius: 0.9375rem;
    text-align: center;
    transition: 0.3s;
    background-image: url("/Areas/Gebruikers/img/svg/icon_arrow-white.svg");
    top: -2px;
    left: 5px;
    position: relative; }
  .button.arrow:hover:after {
    left: 10px; }

.pl-10 {
  padding-left: 10px; }

.pl-20 {
  padding-left: 20px; }

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

@media only screen and (max-width: 1025px) {
  .pl-10-m {
    padding-left: 10px; }
  .pl-20-m {
    padding-left: 20px; }
  .pl-30-m {
    padding-left: 30px; } }

.inputFieldRadio label {
  padding: 10px 5px;
  width: 30%;
  text-align: left;
  font-family: Montserrat, sans-serif;
  color: #666; }

@media only screen and (max-width: 1024px) {
  section {
    padding-top: 30px; } }

section h2 {
  text-align: left;
  color: #111111;
  font-size: 2rem;
  font-family: Montserrat, sans-serif;
  margin: 15px 0; }
  @media only screen and (max-width: 1024px) {
    section h2 {
      margin: 10px 0; } }
  @media only screen and (max-width: 640px) {
    section h2 {
      font-size: 1.75rem; } }

section h3 {
  font-size: 1.75rem;
  text-align: left;
  color: #111111;
  font-family: Montserrat, sans-serif;
  margin: 20px 0;
  font-weight: 700; }
  @media only screen and (max-width: 1024px) {
    section h3 {
      margin: 10px 0; } }
  @media only screen and (max-width: 640px) {
    section h3 {
      font-size: 1.5rem; } }

section h4, section h5 {
  text-align: left;
  color: #111111;
  font-size: 1rem;
  line-height: 20px;
  font-family: Montserrat, sans-serif;
  margin: 20px 0;
  font-weight: 400; }
  @media only screen and (max-width: 640px) {
    section h4, section h5 {
      font-size: 1.125rem; } }

section p, section a, section li, section ul, section span, section l {
  font-size: 0.875rem;
  color: #666;
  font-family: Montserrat, sans-serif;
  line-height: 1.5rem;
  margin: 0;
  padding: 0;
  margin: 15px 0; }

section ol li {
  list-style-type: decimal; }

section a {
  color: #111111;
  font-weight: 700; }
  section a:hover {
    color: #000000; }

section .meldingForm,
section .contactForm {
  margin-top: 10px; }
  @media only screen and (max-width: 1024px) {
    section .meldingForm,
    section .contactForm {
      padding: 0 20px; } }
  section .meldingForm .inputField,
  section .contactForm .inputField {
    width: 100%;
    display: flex;
    padding: 10px 0; }
    section .meldingForm .inputField:last-child label,
    section .contactForm .inputField:last-child label {
      align-self: flex-start; }
    section .meldingForm .inputField label,
    section .contactForm .inputField label {
      padding: 10px 5px;
      width: 30%;
      text-align: left;
      font-family: Montserrat, sans-serif;
      color: #666; }
      @media only screen and (max-width: 640px) {
        section .meldingForm .inputField label,
        section .contactForm .inputField label {
          display: none; } }
    section .meldingForm .inputField input, section .meldingForm .inputField select, section .meldingForm .inputField textarea,
    section .contactForm .inputField input,
    section .contactForm .inputField select,
    section .contactForm .inputField textarea {
      width: 70%;
      padding: 5px 15px;
      min-height: 50px;
      border-radius: 4px;
      border: 2px solid #f4f3f1;
      font-family: Montserrat, sans-serif;
      color: #666; }
      @media only screen and (max-width: 640px) {
        section .meldingForm .inputField input, section .meldingForm .inputField select, section .meldingForm .inputField textarea,
        section .contactForm .inputField input,
        section .contactForm .inputField select,
        section .contactForm .inputField textarea {
          width: 100%; } }
    section .meldingForm .inputField input[type="radio"],
    section .contactForm .inputField input[type="radio"] {
      width: 20px;
      min-height: 10px; }
    section .meldingForm .inputField textarea,
    section .contactForm .inputField textarea {
      min-height: 150px;
      padding: 10px 15px;
      resize: none; }
    section .meldingForm .inputField select,
    section .contactForm .inputField select {
      min-height: 50px; }

@-moz-document url-prefix() {
  section .meldingForm .inputField select,
  section .contactForm .inputField select {
    padding: 0px 15px;
    height: 50px;
    line-height: 50px; } }
  section .meldingForm .button.full.formInput,
  section .contactForm .button.full.formInput {
    width: 70%;
    left: 30%;
    border: none;
    white-space: normal; }
    @media only screen and (max-width: 640px) {
      section .meldingForm .button.full.formInput,
      section .contactForm .button.full.formInput {
        width: 100%;
        left: 0; } }
  section .meldingForm .button.full.formInput.disabled:hover,
  section .meldingForm .button.full.formInput.disabled,
  section .contactForm .button.full.formInput.disabled:hover,
  section .contactForm .button.full.formInput.disabled {
    background-color: #83d5f0;
    cursor: default; }

section.contactContent .row > form div.formSendingLoader {
  height: 100px;
  width: 100px;
  background: url("../img/loadAddAction100px.gif") no-repeat;
  margin: 0 auto; }

section.meldingenContactContent div.modal-content div.formSendingLoader {
  height: 100px;
  width: 100px;
  background: url("../img/loadAddAction100px.gif") no-repeat;
  margin: 0 auto; }

section.meldingenContactContent div.modal-content div.modal-footer {
  background-color: #555555; }

section.meldingenContactContent div.modal-content div.modal-header {
  background-color: #555555; }
  section.meldingenContactContent div.modal-content div.modal-header h2 > small {
    float: right;
    padding: 0px 10px; }
    section.meldingenContactContent div.modal-content div.modal-header h2 > small i {
      cursor: pointer; }
    section.meldingenContactContent div.modal-content div.modal-header h2 > small .fa-close {
      color: #e33d10; }

section.meldingenContactContent div > #contactForm {
  width: 100%; }

section.meldingenContactContent .button.full.formInput.disabled:hover,
section.meldingenContactContent .button.full.formInput.disabled {
  background-color: #ffbe72;
  cursor: default; }

section.meldingenContactContent #meldingForm > div > .button {
  display: inline-block; }

#incidentFileUpload {
  padding: 16px 20px;
  margin: 10px 0px;
  font-size: 100%; }

section.singleMeldingContent div.meldingAttachments h3 {
  margin: 0; }

section.singleMeldingContent div.meldingAttachments div.attachment img.operatorAttachment {
  overflow: hidden;
  margin-left: -15px;
  float: left;
  height: 24px; }

section.singleMeldingContent div.meldingAttachments div.attachment a.attachmentLink {
  cursor: pointer; }

section.singleMeldingContent div.meldingProgressTrailItem {
  border-bottom: 1px solid #ccc;
  padding-bottom: 10px; }
  section.singleMeldingContent div.meldingProgressTrailItem div.actionHead > div > h4 {
    font-weight: bold;
    float: left; }
  section.singleMeldingContent div.meldingProgressTrailItem div.actionHead > div > p.actionTimestamp {
    float: right;
    margin: 10px 0; }
  section.singleMeldingContent div.meldingProgressTrailItem div.trailItemAttachment h3 {
    margin: 0; }
  section.singleMeldingContent div.meldingProgressTrailItem div.trailItemAttachment div > a.attachmentLink {
    cursor: pointer;
    text-decoration: underline; }
  section.singleMeldingContent div.meldingProgressTrailItem div.trailItemAttachment div.attachment img.operatorAttachment {
    overflow: hidden;
    margin-left: -15px;
    float: left;
    height: 24px; }
  section.singleMeldingContent div.meldingProgressTrailItem div.request > div.requestBody,
  section.singleMeldingContent div.meldingProgressTrailItem div > div.actionBody {
    padding: 0px 10px 10px 10px; }
  section.singleMeldingContent div.meldingProgressTrailItem div.request > div.requestBody,
  section.singleMeldingContent div.meldingProgressTrailItem div.meldingActions > div.action:not(:last-child) {
    clear: both;
    border-bottom: 2px solid #f4f3f1; }
  section.singleMeldingContent div.meldingProgressTrailItem div > div.actionBody {
    width: 75%;
    border-radius: 8px; }

section.singleMeldingContent div.addAction {
  padding: 5px; }
  section.singleMeldingContent div.addAction div.tab-content-wrapper div.addFile form#addFileForm > #incidentFileUpload {
    padding: 16px 20px;
    margin: 10px 0px;
    font-size: 100%;
    width: 70%;
    min-height: 50px;
    border-radius: 4px;
    border: 2px solid #f4f3f1;
    font-family: Montserrat, sans-serif;
    color: #666; }
  section.singleMeldingContent div.addAction div.tab-content-wrapper div.addFile form#addFileForm > .attachmentLoader > .form-control {
    height: 50px;
    width: 50px;
    background: url("../img/loader50px.gif") no-repeat;
    margin: 0 auto; }
  section.singleMeldingContent div.addAction .tab-nav-wrapper {
    max-width: 100%;
    margin: 0 auto; }
  section.singleMeldingContent div.addAction ul li {
    display: inline;
    text-align: center; }
  section.singleMeldingContent div.addAction a {
    cursor: pointer;
    display: inline-block;
    width: 25%;
    padding: .75rem 0;
    margin: 0;
    text-decoration: none;
    border-bottom: 3px solid white;
    text-transform: uppercase;
    font-weight: 700; }
  section.singleMeldingContent div.addAction a:hover {
    color: #172983;
    border-color: #172983; }
  section.singleMeldingContent div.addAction a.selected {
    color: #02aae0;
    border-color: #02aae0; }

section.singleMeldingContent h3 > small.close {
  float: right;
  font-size: 30px;
  color: #172983; }
  section.singleMeldingContent h3 > small.close i {
    cursor: pointer; }

section.singleMeldingContent dl.meldingInfo dl {
  border: 3px double #ccc;
  padding: 0.5em; }

section.singleMeldingContent dl.meldingInfo dt {
  float: left;
  clear: left;
  width: 120px;
  font-weight: bold;
  font-family: Montserrat, sans-serif;
  color: #172983;
  margin-top: -3px; }

section.singleMeldingContent dl.meldingInfo dt::after {
  content: ":"; }

section.singleMeldingContent dl.meldingInfo dd {
  margin: 0 0 0 110px;
  padding: 0 0 0.5em 0; }

section.singleMeldingContent dl.meldingInfo dt label {
  font-size: 1.2em; }

section.singleMeldingContent div.meldingOpties {
  width: 100%; }
  section.singleMeldingContent div.meldingOpties a.button.full.formInput {
    display: inline-block;
    width: 49%;
    left: unset; }
    section.singleMeldingContent div.meldingOpties a.button.full.formInput span {
      color: white; }
  section.singleMeldingContent div.meldingOpties a.button.full.formInput.active {
    background-color: #172983; }

section.singleMeldingContent .meldingRequests,
section.singleMeldingContent .meldingActions {
  padding: 5px; }

section.singleMeldingContent .actionsTitle {
  margin-bottom: -30px; }

section.singleMeldingContent .request {
  margin-bottom: 10px; }

section.singleMeldingContent .requestHead,
section.singleMeldingContent .actionHead {
  overflow: auto; }

section.singleMeldingContent .requestHead h4,
section.singleMeldingContent .actionHead h4 {
  margin: 10px 0px; }

section.singleMeldingContent .requestPerson,
section.singleMeldingContent .actionPerson,
section.singleMeldingContent .actionOperator {
  overflow: hidden;
  padding: 5px; }

section.singleMeldingContent p.requestTimestamp,
section.singleMeldingContent p.actionPersonTimestamp,
section.singleMeldingContent p.actionOperatorTimestamp {
  margin-bottom: 0px; }

section.singleMeldingContent div.request > div.requestBody,
section.singleMeldingContent div.action > div > div.actionBody {
  padding: 0px 10px 10px 10px; }

section.singleMeldingContent div.request > div.requestBody,
section.singleMeldingContent div.action > div > div.actionBody {
  color: #172983;
  font-family: Montserrat, sans-serif;
  font-size: 16px; }

section.singleMeldingContent div.meldingActions > div.action:not(:last-child) {
  clear: both;
  border-bottom: 2px solid #f4f3f1; }

section.singleMeldingContent div.action > div > div.actionBody {
  width: 75%;
  border-radius: 8px; }

section.singleMeldingContent #addActionMessage {
  width: 100%;
  resize: none;
  padding: 5px 15px;
  min-height: 150px;
  border-radius: 4px;
  border: 2px solid #f4f3f1;
  font-family: Montserrat, sans-serif;
  color: #666;
  white-space: pre-wrap; }

section.singleMeldingContent .newActionLoading {
  height: 50px;
  width: 50px;
  background: url("../img/loader50px.gif") no-repeat; }

section.singleMeldingContent .meldingActions {
  overflow: hidden; }

section.singleMeldingContent a.attachmentsRefresh,
section.singleMeldingContent a.actionsRefresh {
  cursor: pointer; }

section.singleMeldingContent div.requestHead > i,
section.singleMeldingContent div.actionHead > img {
  overflow: hidden;
  margin-left: -15px;
  margin-right: -15px;
  float: left;
  height: 50px; }

section.meldingenContent {
  position: relative;
  border-right: 2px solid #f4f3f1; }
  section.meldingenContent div.meldingInfo > h4 {
    margin: 15px 0px; }
  section.meldingenContent .row {
    position: relative; }
  section.meldingenContent ul {
    width: 100%; }
  section.meldingenContent ul.meldingen li {
    display: -ms-flexbox;
    display: flex;
    min-height: 180px;
    margin: 0;
    position: relative;
    -ms-flex-pack: start;
    justify-content: flex-start;
    display: inline-block;
    float: left;
    vertical-align: top;
    width: 95%;
    margin-right: 20px; }
  section.meldingenContent ul.meldingen li:not(:last-child) {
    border-bottom: 2px solid #f4f3f1; }
  section.meldingenContent ul.meldingen li div.meldingInfo div.meldingStatus {
    padding: 0px; }
  section.meldingenContent ul.meldingen li div.meldingInfo .row {
    padding: 5px 15px; }
  section.meldingenContent ul.meldingen li div.meldingInfo {
    padding: 15px;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -ms-flex-direction: column;
    flex-direction: column;
    display: -ms-flexbox;
    border-radius: 8px; }
  section.meldingenContent input[type="checkbox"] {
    padding: 5px 15px;
    border-radius: 4px;
    border: 2px solid #f4f3f1; }
  section.meldingenContent label {
    font-family: Montserrat, sans-serif;
    color: #666; }
  section.meldingenContent .meldingenLoading {
    width: 75%; }
  section.meldingenContent .loader {
    height: 100px;
    width: 100px;
    background: url("../img/loadAddAction100px.gif") no-repeat;
    margin: 0 auto; }
  section.meldingenContent div.meldingInfo.selected {
    background-color: #f4f3f1; }
  section.meldingenContent div.meldingInfo > div.row {
    max-width: 100%; }
  section.meldingenContent div.meldingInfo > div > a {
    padding: 7px; }

.banner {
  background-color: #fff;
  position: relative; }
  @media only screen and (max-width: 767px) {
    .banner {
      display: none; } }
  .banner .bannerImg {
    display: block;
    height: 396px;
    background-position: center center;
    background-size: cover; }
  .banner .bannerText {
    background: white;
    display: inline-block;
    position: absolute;
    left: 50%;
    top: 50%;
    width: 50px;
    height: 50px;
    transform: translate(-50%, -50%);
    border-radius: 50%;
    text-indent: -9999px;
    border: 2px solid white; }
    .banner .bannerText:hover a.playVideo {
      background-image: url("/Areas/Gebruikers/img/svg/icon-play-blue.svg"); }
    .banner .bannerText a {
      width: 100%;
      height: 100%;
      position: absolute;
      left: 0;
      top: 0;
      display: block; }
      .banner .bannerText a.playVideo {
        background-image: url("/Areas/Gebruikers/img/svg/img/svg/icon-play.svg");
        background-size: 100%;
        width: 100%;
        height: 100%;
        position: absolute;
        background-repeat: no-repeat;
        background-position: center center;
        transition: 0.3s;
        margin: 0; }
    .banner .bannerText .bannerImgLogo {
      width: 80px;
      height: 80px;
      display: inline-block;
      float: left; }
  .banner img {
    width: 100%; }

.video {
  width: 100%;
  position: fixed;
  top: 0%;
  height: 100%;
  z-index: 5;
  left: -100%;
  background: transparent;
  transition: background .3s; }
  .video.active {
    left: 0;
    background: rgba(0, 0, 0, 0.5); }
    .video.active .videoContainer {
      opacity: 1; }
  .video .videoContainer {
    position: relative;
    max-width: 1024px;
    width: 100%;
    height: 100%;
    margin-left: 50%;
    transform: translateX(-50%);
    opacity: 0;
    transition: .8s; }
    .video .videoContainer .closeVideo {
      position: absolute;
      color: white;
      font-size: 1.375rem;
      right: 0;
      top: 2%;
      cursor: pointer; }
  .video .videoItems {
    width: 100%;
    height: 100%;
    margin: 0 auto;
    top: 10%;
    position: absolute;
    left: 50%;
    transform: translate(-50%, 0%);
    z-index: 5; }
  .video iframe {
    width: 100%; }
  @media only screen and (max-width: 1024px) {
    .video {
      position: relative;
      left: 0;
      height: auto; }
      .video .videoContainer {
        opacity: 1;
        position: relative; }
        .video .videoContainer .closeVideo {
          display: none; }
        .video .videoContainer .videoItems {
          position: relative; } }

section.subNavigation {
  margin-top: 20px; }
  @media only screen and (max-width: 1024px) {
    section.subNavigation {
      display: none; } }
  section.subNavigation nav.subNav ul {
    position: relative; }
    section.subNavigation nav.subNav ul:after {
      content: '';
      display: block;
      width: calc(100% - 15px);
      height: 2px;
      background-color: #f4f3f1;
      position: absolute;
      bottom: 0;
      left: 15px; }
    section.subNavigation nav.subNav ul li {
      padding: 10px 0; }
      section.subNavigation nav.subNav ul li a {
        color: #555555;
        font-size: 0.875rem;
        font-family: Montserrat, sans-serif;
        text-transform: uppercase;
        letter-spacing: .6px;
        transition: 0.3s;
        font-weight: 700;
        padding: 15px; }
        section.subNavigation nav.subNav ul li a:hover, section.subNavigation nav.subNav ul li a.active {
          color: #172983; }

@media only screen and (max-width: 1024px) {
  section.moreInfo {
    padding-top: 0; } }

section .infoPage {
  margin-top: 40px;
  padding-bottom: 40px;
  position: relative;
  float: left; }
  @media only screen and (max-width: 640px) {
    section .infoPage {
      margin: 0;
      padding: 20px 20px;
      margin-top: 0px; }
      section .infoPage:first-child {
        margin-top: 40px; } }
    @media only screen and (max-width: 640px) and (max-width: 1024px) {
      section .infoPage:first-child {
        margin-top: 0; } }
  section .infoPage:last-child {
    border-left: 2px solid #d8d8d8;
    float: right; }
    @media only screen and (max-width: 640px) {
      section .infoPage:last-child {
        border: none; }
        section .infoPage:last-child:before {
          content: '';
          display: block;
          width: 100%;
          height: 1px;
          background-color: #d8d8d8;
          top: 0px;
          position: absolute; } }
  section .infoPage h2 {
    text-align: center;
    color: #111111;
    font-size: 2rem;
    font-family: Montserrat, sans-serif;
    margin: 15px 0; }

section .headerPublish {
  text-align: center;
  color: #111111;
  font-size: 2rem;
  margin: 30px 0 15px;
  font-family: Montserrat, sans-serif; }

section .allPublishers {
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-filter: grayscale(100%);
  /* Safari 6.0 - 9.0 */
  filter: grayscale(100%); }
  section .allPublishers .imageContainer {
    padding: 7px; }
    section .allPublishers .imageContainer .imagePublisher {
      height: 100px;
      background-size: contain;
      background-position: center center;
      background-repeat: no-repeat; }
      @media only screen and (max-width: 640px) {
        section .allPublishers .imageContainer .imagePublisher {
          height: unset; } }
      section .allPublishers .imageContainer .imagePublisher a {
        display: block;
        width: 100%;
        height: 100%; }
        section .allPublishers .imageContainer .imagePublisher a p {
          text-indent: -9999px; }

section.loginPage .infoPage {
  padding: 0px 80px; }
  @media only screen and (min-width: 641px) and (max-width: 1024px) {
    section.loginPage .infoPage {
      padding: 0 40px; } }
  @media only screen and (max-width: 640px) {
    section.loginPage .infoPage {
      padding: 0 20px; } }
  section.loginPage .infoPage h2 {
    text-align: left;
    min-height: 100px; }
    @media only screen and (min-width: 641px) and (max-width: 1024px) {
      section.loginPage .infoPage h2 {
        min-height: 120px; } }
    @media only screen and (max-width: 640px) {
      section.loginPage .infoPage h2 {
        min-height: auto; } }
  section.loginPage .infoPage p {
    min-height: 78px;
    color: #666;
    line-height: 1.5rem;
    font-family: Montserrat, sans-serif; }
    @media only screen and (min-width: 641px) and (max-width: 1024px) {
      section.loginPage .infoPage p {
        min-height: 104; } }
    @media only screen and (max-width: 640px) {
      section.loginPage .infoPage p {
        min-height: auto; } }

section.loginPage .loginInput h2 {
  text-align: center; }

section.loginPage .grayImage {
  -webkit-filter: grayscale(100%);
  filter: grayscale(100%); }

section .contactForm.centered {
  margin: 0 auto; }
  section .contactForm.centered .inputField input {
    width: 100%; }
  section .contactForm.centered .button.full {
    left: 0;
    width: 100%; }

section .centreer {
  margin: auto;
  width: 50%;
  text-align: center; }

section .centreer h2 {
  text-align: center; }

.box_info, .box_success, .box_warning, .box_error {
  border-radius: 10px;
  margin: 10px 0px;
  padding: 12px; }

.box_info {
  color: #000000;
  background-color: #D2ABEE; }

.box_success {
  color: #4F8A10;
  background-color: #DFF2BF; }

.box_warning {
  color: #9F6000;
  background-color: #FEEFB3; }

.box_error {
  color: #D8000C;
  background-color: #FFD2D2; }

.box_info i, .box_success i, .box_warning i, .box_error i {
  margin: 10px 22px;
  font-size: 2em;
  vertical-align: middle; }

.box_info span {
  color: #ffffff; }

/* Modal Box */
.modal {
  display: none;
  position: fixed;
  z-index: 1000;
  padding-top: 100px;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: auto;
  background-color: black;
  background-color: rgba(0, 0, 0, 0.4);
  border-radius: 4px; }

/* Modal Content */
.modal-content {
  position: relative;
  margin: auto;
  padding: 0;
  width: 80%;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  -webkit-animation-name: animatetop;
  -webkit-animation-duration: 0.4s;
  animation-name: animatetop;
  animation-duration: 0.4s; }

@-webkit-keyframes animatetop {
  from {
    top: -300px;
    opacity: 0; }
  to {
    top: 0;
    opacity: 1; } }

@keyframes animatetop {
  from {
    top: -300px;
    opacity: 0; }
  to {
    top: 0;
    opacity: 1; } }

.close {
  color: white;
  float: right;
  font-size: 28px;
  font-weight: bold; }

.close:hover,
.close:focus {
  color: #172983;
  text-decoration: none;
  cursor: pointer; }

.modal-header {
  padding: 2px 16px;
  background-color: #555555;
  color: white;
  border-top-left-radius: 4px;
  border-top-right-radius: 4px; }

.modal-body {
  padding: 16px;
  background-color: #fefefe; }

.modal-footer {
  padding: 2px 16px;
  background-color: #555555;
  color: #ffffff;
  border-bottom-left-radius: 4px;
  border-bottom-right-radius: 4px; }

.modal-header h1,
.modal-header h2,
.modal-header h3 {
  color: #ffffff; }

.modal-header p {
  color: #ffffff; }

h3 {
  font-family: Montserrat, sans-serif;
  font-size: 1.375rem;
  text-align: left;
  color: #111111;
  padding: 10px 0;
  line-height: 32px;
  margin: 0;
  font-weight: 400; }

h2 {
  font-family: Montserrat, sans-serif;
  font-size: 2rem;
  text-align: left;
  color: #111111;
  padding: 10px 0;
  line-height: 36px;
  margin: 0;
  font-weight: 700; }

p {
  font-family: Montserrat, sans-serif;
  font-size: 1rem;
  color: #666;
  padding: 10px 0;
  line-height: 1.5rem;
  font-weight: 400;
  margin: 0; }

.LetOp {
  color: #e33d10; }

section.Licenties {
  position: relative; }

section.Readers {
  position: relative; }

section.Licenties .row {
  position: relative;
  padding: 20px 0; }

section.Readers .row {
  position: relative;
  padding: 20px 0; }

section.Licenties ul {
  width: 100%; }

section.Readers ul {
  width: 100%; }

section.Licenties ul.product li {
  display: -ms-flexbox;
  display: flex;
  min-height: 180px;
  margin: 0;
  position: relative;
  -ms-flex-pack: start;
  justify-content: flex-start;
  display: inline-block;
  float: left;
  vertical-align: top;
  width: 20%;
  margin-right: 20px; }

section.Readers ul.product li {
  display: -ms-flexbox;
  display: flex;
  min-height: 180px;
  margin: 0;
  position: relative;
  -ms-flex-pack: start;
  justify-content: flex-start;
  display: inline-block;
  float: left;
  vertical-align: top;
  width: 20%;
  margin-right: 20px; }

@media only screen and (max-width: 1024px) {
  section.Licenties ul.product li {
    float: none;
    width: 100%; }
  section.Readers ul.product li {
    float: none;
    width: 100%; }
  section.leermiddelen {
    margin: 15px; }
  section.leermiddelen ul.product li:before {
    width: calc( 100% - 30px);
    left: 15px; }
  section.leermiddelen ul.product li:last-child:after {
    width: calc( 100% - 30px);
    left: 15px; } }

section.leermiddelen img {
  max-width: 100px !important; }

section.Licenties ul.product .SluitLicentieTip {
  top: 15px;
  position: absolute; }

@media only screen and (max-width: 1024px) {
  section.Licenties ul.product .SluitLicentieTip {
    margin-left: 15px;
    position: relative; } }

section.Licenties ul.product .LicentieTip {
  width: 501px;
  height: 287px;
  margin: 20px 0px;
  position: absolute; }

@media only screen and (max-width: 1024px) {
  section.Licenties ul.product .LicentieTip {
    margin: 0px; } }

section.Licenties ul.product li .LicenseInfo {
  padding: 20px;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -ms-flex-direction: column;
  flex-direction: column;
  display: -ms-flexbox;
  background-color: #f4f3f1;
  border-radius: 8px; }

section.Readers ul.product li .ReaderInfo {
  padding: 20px;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -ms-flex-direction: column;
  flex-direction: column;
  display: -ms-flexbox;
  background-color: #f4f3f1;
  border-radius: 8px; }

section.Licenties ul.product li .LicenseInfo .Title {
  min-height: 130px; }

section.Readers ul.product li .ReaderInfo .Title {
  min-height: 130px; }

section.Licenties ul.product li .LicenseInfo .productImg {
  text-indent: -9999px;
  height: 100px;
  background-position: center top;
  background-size: contain;
  background-repeat: no-repeat;
  position: relative;
  left: 0;
  padding: 20px; }

section.Readers ul.product li .ReaderInfo .productImg {
  text-indent: -9999px;
  height: 100%;
  background-position: center top;
  background-size: contain;
  background-repeat: no-repeat;
  position: relative;
  left: 0;
  padding: 20px; }

section.Licenties ul.product li .LicenseInfo .productImgWrapper {
  /*  padding: 20px;*/
  background-color: #fff; }

section.Readers ul.product li .ReaderInfo .productImgWrapper {
  padding: 20px;
  background-color: #fff; }

@media only screen and (max-width: 1024px) {
  section.Licenties ul.product li .LicenseInfo .productImg {
    position: relative;
    margin-bottom: 20px; }
  section.Readers ul.product li .ReaderInfo .productImg {
    position: relative;
    margin-bottom: 20px; }
  section.Licenties ul.product li .LicenseInfo .productImgWrapper {
    padding: 0px; }
  section.Readers ul.product li .ReaderInfo .productImgWrapper {
    padding: 0px; } }

section.Licenties .startbutton {
  padding: 16px 20px;
  margin-top: 5px;
  margin-bottom: 20px;
  align-items: unset; }

section.Readers .startbutton {
  padding: 16px 20px;
  margin-top: 5px;
  margin-bottom: 20px;
  align-items: unset; }

.renew-button-container {
  display: flex; }

.renew-button {
  margin-top: 10px;
  padding: 16px 20px; }

@media only screen and (max-width: 1024px) {
  section.Licenties {
    margin: 15px; }
  section.Readers {
    margin: 15px; }
  section.Licenties ul.product li .LicenseInfo {
    display: block; }
  section.Readers ul.product li .ReaderInfo {
    display: block; }
  section.Licenties ul.product li .LicenseInfo .Title {
    min-height: 0px; }
  section.Readers ul.product li .ReaderInfo .Title {
    min-height: 0px; }
  section.Licenties .startbutton {
    margin-top: 5px;
    margin-bottom: 20px; }
  section.Readers .startbutton {
    margin-top: 5px;
    margin-bottom: 20px; } }

section.productsChoice {
  position: relative; }

section.invoice .inputField.inputFieldRadio {
  display: block; }

section.invoice .inputField input[type="radio"] {
  width: unset;
  min-height: unset;
  font-size: 1rem; }

section.productsChoice h3.titleCategory {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  width: 100%;
  color: #e33d10; }

@media only screen and (max-width: 1024px) {
  section.productsChoice h3.titleCategory {
    padding: 0 5px;
    font-size: 1.25rem; } }

section.productsChoice h3 span.information:hover .extraInformation {
  display: block; }

section.productsChoice h3 .extraInformation {
  margin: 0;
  position: absolute;
  left: 55px;
  top: 55px;
  max-width: 400px;
  color: #ffffff;
  z-index: 2;
  padding: 20px;
  background-color: #02aae0;
  font-family: Montserrat, sans-serif;
  font-weight: 400;
  line-height: 1.5rem;
  font-size: 1rem;
  display: none; }

@media only screen and (max-width: 1024px) {
  section.productsChoice h3 .extraInformation {
    width: calc( 100% - 30px);
    left: 25px;
    top: 75px; } }

section.productsChoice h3 .extraInformation p {
  color: #ffffff;
  position: relative;
  display: block;
  margin: 0; }

section.productsChoice h3 .extraInformation.active {
  display: block; }

section.productsChoice h4.subTitleCategory {
  font-family: Montserrat, sans-serif;
  font-size: 1.375rem;
  text-align: left;
  color: #555555;
  line-height: 24px;
  margin: 0;
  font-weight: 400; }

@media only screen and (max-width: 1024px) {
  section.productsChoice h4.subTitleCategory {
    padding: 0 5px;
    font-size: 1.25rem; } }

section.productsChoice .row {
  position: relative;
  padding: 10px 10px; }

section.productsChoice ul {
  width: 100%;
  margin: 0px; }

section.productsChoice ul.product li {
  display: -ms-flexbox;
  display: flex;
  min-height: 180px;
  margin: 0;
  position: relative;
  -ms-flex-pack: start;
  justify-content: flex-start; }

section.productsChoice ul.product:last-of-type {
  border-bottom: 2px solid #f4f3f1; }
  @media only screen and (max-width: 1024px) {
    section.productsChoice ul.product:last-of-type {
      border-bottom: none; } }

section.productsChoice ul.product li:before {
  content: '';
  width: 100%;
  left: 0%;
  top: 0;
  position: absolute;
  height: 2px;
  background-color: #f4f3f1; }

section.productsChoice ul.product li:last-child:after {
  content: '';
  width: 100%;
  left: 0%;
  bottom: 0;
  position: absolute;
  height: 2px;
  /*background-color: #f4f3f1;*/ }

@media only screen and (max-width: 1024px) {
  /* section.productsChoice ul.product li:before {
        width: calc( 100% - 30px);
        left: 15px; 
    }*/
  section.productsChoice ul.product li:last-child:after {
    width: calc( 100% - 30px);
    left: 15px; } }

section.productsChoice ul.product li .productInfo {
  padding: 30px 20px;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -ms-flex-direction: column;
  flex-direction: column;
  display: -ms-flexbox;
  display: flex;
  border-right: 2px solid #f4f3f1; }

@media only screen and (max-width: 1024px) {
  section.productsChoice ul.product li .productInfo {
    display: block;
    border-right: none; } }

section.productsChoice ul.product li .tekstblok li {
  min-height: unset; }

section.productsChoice ul.product li .productInfo .productImg {
  text-indent: -9999px;
  width: 150px;
  height: 100%;
  max-height: 150px;
  background-position: center top;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center 5px;
  position: relative;
  position: absolute;
  left: 0; }

@media only screen and (max-width: 1024px) {
  section.productsChoice ul.product li .productInfo .productImg {
    position: relative;
    margin-bottom: 20px; }
  section.productsChoice ul.product li .box_info {
    background-color: #fff;
    padding: 0px !important; }
  section.productsChoice ul.product li .box_info b {
    background-color: #BDE5F8; } }

.imgButton {
  height: 35px; }

section.productsChoice ul.product li .productInfo .mainInfo {
  position: relative;
  left: 150px; }

@media only screen and (max-width: 1024px) and (min-width: 40em) {
  .mg-auto-medium {
    margin: auto; } }

@media (min-width: 1024px) {
  .MobileDisplay {
    display: none !important; } }

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

@media only screen and (max-width: 1024px) {
  section.productsChoice ul.product li .productInfo .mainInfo {
    left: 120px;
    position: absolute;
    top: 80px; } }

section.productsChoice ul.product li .productInfo .descriptionProduct, section.productsChoice ul.product li .productInfo .productCode {
  position: relative;
  left: 150px; }

section.productsChoice ul.product li .productInfo .keuzegroep {
  position: relative;
  left: 150px;
  padding: 20px 20px 0px;
  margin: 0px 0px 5px 0px !important;
  width: calc( 100% - 150px); }

section.productsChoice ul.product li .productInfo .keuzegroep i {
  margin: 3px !important; }

section.productsChoice ul.product li .productInfo .keuzegroep .subtext {
  display: block;
  margin-left: 37px;
  margin-top: 0px;
  color: #00529B; }

@media only screen and (max-width: 1024px) {
  section.productsChoice ul.product li .productInfo .keuzegroep {
    left: 0;
    width: 100%;
    margin: 0px 0px 5px 0px !important;
    line-height: 2em; } }

@media only screen and (max-width: 1024px) {
  section.productsChoice ul.product li .productInfo .descriptionProduct, section.productsChoice ul.product li .productInfo .productCode {
    left: 0; } }

section.productsChoice ul.product li .productInfo .mainInfo {
  width: calc( 100% - 150px);
  display: -ms-flexbox;
  display: flex;
  /* height: 24px; veroorzaakt overlappende tekst bij grote artikelnaam */ }

@media only screen and (max-width: 1024px) {
  section.productsChoice ul.product li .productInfo .mainInfo {
    display: contents; } }

section.productsChoice ul.product li .productInfo .mainInfo h3 {
  font-family: Montserrat, sans-serif;
  font-size: 1.375rem;
  text-align: left;
  color: #000000;
  line-height: 24px;
  margin: 0;
  font-weight: 700;
  position: relative;
  padding: 0px 20px; }

section.productsChoice ul.product li .tekstblokKop h3 {
  font-family: Montserrat, sans-serif;
  font-size: 1.375rem;
  text-align: left;
  color: #000000;
  line-height: 24px;
  margin: 0;
  font-weight: 700;
  position: relative; }

@media only screen and (max-width: 1024px) {
  section.productsChoice ul.product li .productInfo .mainInfo h3, section.productsChoice ul.product li .tekstblokKop h3 {
    padding: 0 5px;
    font-size: 1.25rem; }
  .tekstblok {
    padding: 0 5px;
    font-size: 1.25rem; } }

section.productsChoice ul.product li .productInfo .mainInfo h3:after {
  display: block;
  width: 2px;
  height: 100%;
  background-color: #02aae0;
  position: absolute;
  content: '';
  right: 0;
  top: 0; }

section.productsChoice ul.product li .productInfo span.price {
  margin: 0;
  font-family: Montserrat, sans-serif;
  font-size: 1.25rem;
  text-align: left;
  color: #e33d10;
  line-height: 24px;
  font-weight: 700;
  padding-left: 15px; }

section.productsChoice ul.product li .productInfo span.productCode {
  padding: 20px 20px 0px;
  margin: 0;
  font-family: Montserrat, sans-serif;
  font-size: 1rem;
  color: black;
  font-weight: 700;
  width: calc( 100% - 150px); }

section.productsChoice ul.product li .productInfo span.productCode .bigNumber {
  font-size: 1.125rem;
  color: black;
  font-family: Montserrat, sans-serif; }

section.productsChoice ul.product li .productInfo p.descriptionProduct {
  width: calc( 100% - 150px);
  padding: 0px 20px;
  margin: 0;
  color: #666;
  font-size: 1rem;
  font-weight: 400;
  font-family: Montserrat, sans-serif;
  line-height: 1.5rem; }

section.productsChoice ul.product li .productInfo p.descriptionProduct li {
  list-style-type: disc;
  min-height: unset;
  display: list-item;
  margin: unset;
  padding: unset;
  position: unset; }

section.productsChoice ul.product li .productOption {
  -ms-flex-direction: column;
  flex-direction: column;
  padding: 30px 20px;
  position: relative; }

@media only screen and (max-width: 1024px) {
  section.productsChoice ul.product li .productOption:before {
    content: '';
    display: block;
    height: 90%;
    top: 5%;
    left: 0;
    /*background-color: #f4f3f1;*/
    width: 2px;
    position: absolute; } }

section.productsChoice ul.product li .productOption p {
  font-family: Montserrat, sans-serif;
  font-size: 1rem;
  color: #666;
  line-height: 1.5rem;
  font-weight: 400;
  margin: 0;
  display: block;
  height: 24px; }

section.productsChoice ul.product li .productOption p.required {
  color: #df0019; }

section.productsChoice ul.product li .productOption p.required:before {
  content: '*'; }

section.productsChoice ul.product li .productOption form {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -ms-flex-direction: column;
  flex-direction: column;
  height: 100%;
  padding: 15px 0px;
  -ms-flex-pack: distribute;
  justify-content: space-around; }

section.productsChoice ul.product li .productOption form .optionRadio {
  width: 100%; }

section.productsChoice ul.product li .productOption form input {
  -webkit-appearance: radio;
  margin: 5px 15px 5px 0; }

@media only screen and (max-width: 1024px) {
  section.productsChoice ul.product li {
    -ms-flex-direction: column;
    flex-direction: column;
    min-height: auto; }
  section .invoice,
  section .productsChoice {
    padding: 0 25px; }
  section.productsChoice ul.product li .productInfo {
    -ms-flex-direction: row;
    flex-direction: row;
    padding-bottom: 10px; }
  section.productsChoice ul.product li .productInfo .productImg {
    width: 100px;
    height: 100px; }
  section.productsChoice ul.product li .productInfo .mainInfo {
    width: calc( 100% - 80px);
    height: auto;
    -ms-flex-direction: column;
    flex-direction: column; }
  section.productsChoice ul.product li .productInfo .mainInfo h3 {
    width: calc(100% - 50px); }
  section.productsChoice ul.product li .productInfo .mainInfo h3:after {
    content: none; }
  section.productsChoice ul.product li .productInfo span.productCode, section.productsChoice ul.product li .productInfo p.descriptionProduct {
    width: 100%;
    padding: 20px 0px 0; }
  section.productsChoice.inputField .ng-invalid.ng-touched:not(.ng-empty) {
    background-color: lightpink;
    border-color: darkred; }
  section.productsChoice .ng-valid.ng-touched:not(.ng-empty) {
    border-bottom-color: darkgreen !important; }
  section.productsChoice ul.product li .productInfo p.descriptionProduct {
    padding: 10px 0 0; }
  section.productsChoice ul.product li .productOption {
    padding: 0px 0px; }
  section.productsChoice ul.product li .productOption form {
    -ms-flex-direction: row;
    flex-direction: row;
    -ms-flex-pack: start;
    justify-content: flex-start; }
  section.productsChoice ul.product li .productOption form .optionRadio {
    width: auto;
    padding-right: 15px; } }

@media (min-width: 1024px) {
  .SelecteerAlles {
    left: 100%;
    transform: translateX(-100%);
    position: relative; } }

@media (max-width: 1024px) {
  .SelecteerAlles {
    width: 60%; } }

@media (max-width: 40em) {
  .SelecteerAlles {
    width: 100%; } }

@media (min-width: 1024px) {
  .PaymentOverview .subTotal {
    transform: translateX(calc(-50% + 50px)); } }

.subTotal {
  position: relative;
  left: calc(100% - 180px);
  margin-top: 20px;
  width: 250px;
  transform: translateX(calc(-100% + 50px)); }
  @media (min-width: 40em) and (max-width: 1024px) {
    .subTotal {
      left: 0px;
      width: 60%;
      transform: none; } }
  @media (max-width: 40em) {
    .subTotal {
      left: 0px;
      width: 100%;
      transform: none; } }
  @media (max-width: 40em) {
    .subTotal .winkelwagenDefault,
    .subTotal .betaling {
      width: calc(100% - 85px); } }
  .subTotal p {
    font-size: 1rem;
    color: #666;
    font-family: Montserrat, sans-serif;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: justify;
    justify-content: space-between; }
    .subTotal p .price {
      margin: 0;
      padding-left: 15px;
      font-family: Montserrat, sans-serif; }
    .subTotal p.total {
      font-weight: 700;
      /*border-top: 2px solid #f4f3f1;*/
      margin: 0;
      padding: 15px 0; }
      @media only screen and (max-width: 1024px) {
        .subTotal p.total {
          padding: 15px 20px; } }
  .subTotal .back {
    right: calc(100% + 10px);
    display: -ms-flexbox;
    display: flex;
    width: 100px; }
    @media (min-width: 40em) {
      .subTotal .back {
        position: absolute; } }
    @media (max-width: 40em) {
      .subTotal .back {
        right: unset;
        float: left; } }
    @media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
      .subTotal .back {
        /* IE10+ CSS style - anders zit de terug knop half achter de andere knoppen en werkt het pijltje niet */
        position: static; } }
    .subTotal .back a {
      color: #BBBBBB;
      font-family: Montserrat, sans-serif;
      font-weight: 700;
      cursor: pointer;
      position: relative; }
      .subTotal .back a:hover {
        text-decoration: underline; }
    .subTotal .back .icon.dropdown {
      transform: rotate(90deg);
      top: 23px; }
      @media only screen and (max-width: 1024px) {
        .subTotal .back .icon.dropdown {
          display: block; } }

section.stepControl ul.steps {
  display: -ms-flexbox;
  display: flex; }
  section.stepControl ul.steps li {
    padding: 10px; }
    section.stepControl ul.steps li .step {
      position: relative; }
      section.stepControl ul.steps li .step a {
        display: block;
        position: relative;
        margin: 0;
        width: 100%;
        height: 56px;
        cursor: default; }
        section.stepControl ul.steps li .step a span {
          font-family: Montserrat, sans-serif;
          letter-spacing: .6px;
          line-height: 22px;
          /*font-size: rem(14);*/
          font-weight: 700;
          float: left;
          position: relative;
          margin: 0; }
          section.stepControl ul.steps li .step a span.number {
            display: inline-block;
            background-color: #555555;
            padding: 16px 20px;
            border-bottom-left-radius: 4px;
            border-top-left-radius: 4px;
            color: #ffffff; }
            section.stepControl ul.steps li .step a span.number.active {
              background-color: #e33d10; }
          section.stepControl ul.steps li .step a span.title {
            background-color: #f4f3f1;
            padding: 16px 20px;
            border-bottom-right-radius: 4px;
            border-top-right-radius: 4px;
            color: #555555; }
            section.stepControl ul.steps li .step a span.title.active {
              color: #e33d10; }
        @media only screen and (max-width: 1024px) {
          section.stepControl ul.steps li .step a span.number {
            border-radius: 4px; }
          section.stepControl ul.steps li .step a span.title {
            display: none; } }

p.price, span.price {
  margin: 0;
  font-family: Montserrat, sans-serif;
  font-size: 1.25rem;
  text-align: left;
  color: #e33d10;
  line-height: 24px;
  font-weight: 700;
  margin: 15px 0; }

@media only screen and (max-width: 1024px) {
  .schoolInfo h3, .schoolInfo h2, .schoolInfo p, .invoice h3, .invoice h2, .invoice p {
    padding: 0 10px; } }

.schoollogo {
  text-indent: -9999px;
  width: 150px;
  max-height: 150px;
  background-position: center top;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center 5px; }

@media only screen and (max-width: 1024px) {
  .schoollogo {
    width: 58px;
    height: 58px;
    margin-left: 20px; } }

.sortorder:after {
  content: '\25b2'; }

.sortorder.reverse:after {
  content: '\25bc'; }

.overview li button {
  cursor: pointer;
  text-decoration: underline; }

section.productsChoice ul.product li .productInfo .keuzegroep {
  position: relative;
  left: 150px;
  padding: 20px 20px 0px;
  margin: 0px 0px 5px 0px !important;
  width: calc( 100% - 150px); }

section.productsChoice ul.product li .productInfo .keuzegroep i {
  margin: 3px !important; }

section.productsChoice ul.product li .productInfo .keuzegroep .subtext {
  display: block;
  margin-left: 37px;
  margin-top: 0px;
  color: #00529B; }

@media only screen and (max-width: 1024px) {
  section.productsChoice ul.product li .productInfo .keuzegroep {
    left: 0;
    width: 100%;
    margin: 0px 0px 5px 0px !important;
    line-height: 2em; } }

.afnemen {
  text-align: right;
  vertical-align: middle;
  margin-top: -38px;
  margin-bottom: 5px; }
  .afnemen span {
    font-size: 2em;
    vertical-align: middle;
    border-radius: 4px;
    margin: 10px 0px;
    padding: 12px; }

.afnemen.ja span {
  color: green; }

.afnemen.nee span {
  color: red; }

.retour {
  vertical-align: middle;
  margin-bottom: 5px; }
  .retour span {
    font-size: 2em;
    vertical-align: middle;
    border-radius: 4px;
    margin: 10px 0px;
    padding: 12px; }

.retour.ja {
  color: green; }

.retour.actief {
  color: orange; }

.retour.nee {
  color: red; }

.dataloading {
  margin: 10px; }

/* Voucher activatie spul */
/* Modal Box */
.modal {
  width: 100%; }

/* Modal Content */
[id^="voucherContentBox_"] .modal-content,
[id^="activationBox_"] .modal-content {
  width: 100%; }

[id^="voucherContentBox_"] a.startbutton,
[id^="activationBox_"] a.startbutton {
  display: inline-block; }

[id^="voucherContentBox_"] .modal-body p,
[id^="activationBox_"] .modal-body p {
  font-family: Montserrat, sans-serif;
  font-size: 1.5rem;
  font-weight: bold; }

[id^="voucherContentBox_"] .close:hover,
[id^="activationBox_"] .close:hover,
[id^="voucherContentBox_"] .close:focus,
[id^="activationBox_"] .close:focus,
[id^="voucherContentBox_"] .close,
[id^="activationBox_"] .close {
  color: #172983;
  text-decoration: none;
  cursor: pointer; }

[id^="voucherContentBox_"] .modal-header,
[id^="voucherContentBox_"] .modal-body,
[id^="voucherContentBox_"] .modal-footer,
[id^="activationBox_"] .modal-header,
[id^="activationBox_"] .modal-body,
[id^="activationBox_"] .modal-footer {
  background-color: white;
  padding: 2px 46px; }

[id^="voucherContentBox_"] .startbutton,
[id^="activationBox_"] .startbutton {
  margin-right: 10px; }

/* rule for visually disabling license button */
section.Licenties .startbutton.disabled:hover,
section.Licenties .startbutton.disabled {
  background-color: #83d5f0;
  cursor: default; }

/* rule for visually disabling order button */
.button.full.sinas.disabled:hover,
.button.full.sinas.disabled {
  background-color: #ffbe72;
  cursor: default; }

.LeermiddelenOverzichtFooter {
  margin-top: 40px; }
  @media only screen and (max-width: 1024px) {
    .LeermiddelenOverzichtFooter {
      padding: 0 40px; } }

.LeermiddelenOverzichtFooterContent {
  margin-top: 20px; }

.LeermiddelenOverzichtContent {
  margin-top: 10px; }
  .LeermiddelenOverzichtContent .pageHeader {
    padding: 0 20px; }
  .LeermiddelenOverzichtContent .inputField {
    width: 100%;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 10px 0;
    -ms-flex-align: center;
    align-items: center; }
    .LeermiddelenOverzichtContent .inputField:last-child label {
      align-self: flex-start; }
    .LeermiddelenOverzichtContent .inputField label {
      width: 30%;
      text-align: left;
      font-family: Montserrat, sans-serif;
      color: #666; }
      @media only screen and (max-width: 640px) {
        .LeermiddelenOverzichtContent .inputField label {
          display: none; } }
    .LeermiddelenOverzichtContent .inputField input, .LeermiddelenOverzichtContent .inputField select, .LeermiddelenOverzichtContent .inputField textarea {
      width: 70%;
      padding: 5px 15px;
      min-height: 50px;
      border-radius: 4px;
      border: 2px solid #f4f3f1;
      font-family: Montserrat, sans-serif;
      color: #666; }
      @media only screen and (max-width: 640px) {
        .LeermiddelenOverzichtContent .inputField input, .LeermiddelenOverzichtContent .inputField select, .LeermiddelenOverzichtContent .inputField textarea {
          width: 100%; } }
    .LeermiddelenOverzichtContent .inputField textarea {
      min-height: 150px;
      padding: 10px 15px;
      resize: none; }
    .LeermiddelenOverzichtContent .inputField select {
      min-height: 50px; }

@-moz-document url-prefix() {
  .LeermiddelenOverzichtContent .inputField select {
    padding: 0px 15px;
    height: 50px;
    line-height: 50px; } }
  .LeermiddelenOverzichtContent .button.full.formInput {
    width: 70%;
    left: 30%;
    border: none;
    white-space: normal; }
    @media only screen and (max-width: 640px) {
      .LeermiddelenOverzichtContent .button.full.formInput {
        width: 100%;
        left: 0; } }

.centerstripe {
  border-right: solid;
  border-right-width: 1px;
  border-right-color: #666; }
  @media only screen and (max-width: 1024px) {
    .centerstripe {
      border-right: none; } }

.overview {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
  flex-direction: column;
  width: 100%;
  margin: 0 15px;
  padding: 10px;
  border: 3px solid #f4f3f1; }
  .overview .overview {
    padding: 0px;
    border-top: 4px dotted #f4f3f1;
    border-bottom: none;
    border-left: none;
    border-right: none;
    padding-top: 10px; }
  .overview li, .overview span, .overview p, .overview a {
    font-size: 1rem;
    line-height: 1.5rem;
    letter-spacing: .6px;
    font-family: Montserrat, sans-serif;
    font-weight: 400;
    margin: 15px 0; }
    @media only screen and (max-width: 1024px) {
      .overview li, .overview span, .overview p, .overview a {
        margin: 5px 0; } }
  .overview .sortorder {
    color: #e33d10; }
  .overview button {
    color: #e33d10; }
    .overview button span {
      color: #e33d10; }
  .overview li {
    margin: 0; }
    .overview li .icon.download {
      top: -2px; }
    .overview li ul {
      display: flex;
      width: 100%;
      justify-content: space-between;
      margin: 0;
      position: relative;
      /*&:after {
                content: '';
                position: absolute;
                bottom: 0;
                width: 100%;
                height: 2px;
                display: block;
                background: color(HeaderGrey);
            }*/ }
      .overview li ul li {
        display: -ms-flexbox;
        /*display: flex;*/
        width: 100%;
        margin: 0;
        position: relative;
        padding-right: 10px; }
        .overview li ul li.center {
          text-align: center;
          display: inline; }
        @media only screen and (max-width: 640px) {
          .overview li ul li.hide-on-mobile {
            display: none; } }
        .overview li ul li.deleteProduct {
          width: 200px; }
          @media only screen and (max-width: 1024px) {
            .overview li ul li.deleteProduct {
              width: 100%; }
              .overview li ul li.deleteProduct span {
                display: none; } }
        .overview li ul li.smaller {
          width: 400px; }
          @media only screen and (max-width: 1024px) {
            .overview li ul li.smaller {
              width: 100%; } }
    .overview li.labels span {
      color: #e33d10; }
    @media only screen and (max-width: 1024px) {
      .overview li.labels ul:after {
        width: 100vw;
        left: -20px; }
      .overview li.labels ul li {
        display: none; } }
    .overview li.labels span, .overview li.labels p, .overview li.labels a, .overview li.labels {
      font-weight: 700; }
    .overview li.invoiceInfo.border-bottom:not(:last-child) {
      border-bottom: 3px solid #f4f3f1;
      margin-left: -10px;
      margin-right: -10px;
      padding-right: 10px;
      padding-left: 10px; }
    .overview li.invoiceInfo .phoneSpan {
      display: none; }
      @media only screen and (max-width: 1024px) {
        .overview li.invoiceInfo .phoneSpan {
          display: block;
          font-weight: 700; } }
    .overview li.invoiceInfo p.heading {
      color: #111111;
      font-weight: 700; }
    .overview li.invoiceInfo p.price {
      font-weight: 700;
      font-family: Montserrat, sans-serif; }
    .overview li.invoiceInfo li.center {
      text-align: center;
      display: inline; }
    .overview li.invoiceInfo ul:not(.overview) {
      display: -ms-flexbox;
      display: flex;
      -ms-flex-direction: row;
      flex-direction: row;
      -ms-flex-align: center;
      align-items: center; }
      @media only screen and (max-width: 1024px) {
        .overview li.invoiceInfo ul:not(.overview) {
          display: -ms-flexbox;
          display: flex;
          -ms-flex-direction: column;
          flex-direction: column;
          padding: 15px 0; }
          .overview li.invoiceInfo ul:not(.overview):after {
            width: 100vw;
            left: -20px; }
          .overview li.invoiceInfo ul:not(.overview) li span, .overview li.invoiceInfo ul:not(.overview) li p {
            /*width: 50%;*/ } }
      .overview li.invoiceInfo ul:not(.overview) li a {
        font-weight: bold; }

.retourTitle {
  padding-left: 20px !important; }

.stepControl {
  padding: 0 10px; }

.mobileView {
  display: none; }

.returnPadding {
  padding: 0 20px !important; }

.unavailablePadding {
  padding-top: 20px !important;
  padding-left: 0px !important;
  padding-bottom: 10px !important; }

.btnContainer {
  margin: 0 20px;
  width: 300px; }

.createReturnTest {
  color: #e33d10;
  border: blue solid; }

.contactForm {
  padding: 0 10px !important; }

@media only screen and (max-width: 640px) {
  .returnReasonMobileContainer {
    display: flex;
    flex-direction: column; } }

@media only screen and (max-width: 1025px) {
  .iconInfo {
    display: none; }
  .hideOnMobile {
    display: none; }
  .mobileView {
    display: block;
    padding: 20px;
    padding-bottom: 5px; }
    .mobileView .card {
      width: calc(100% - 0px);
      margin-bottom: 20px;
      background-color: rgba(238, 238, 238, 0.2);
      border-radius: 8px;
      box-shadow: 0px 4px 10px 1px rgba(0, 0, 0, 0.11); }
      .mobileView .card .card-content {
        padding: 20px; }
        .mobileView .card .card-content .card-title {
          padding: 0 10px;
          margin: 5px 0;
          margin-top: 7px; }
          .mobileView .card .card-content .card-title .title-desc {
            font-size: 18px;
            font-weight: bold; }
        .mobileView .card .card-content .card-bottom {
          margin: 5px 0; }
        .mobileView .card .card-content .photo-container {
          display: flex;
          flex-direction: row;
          align-items: center; }
          .mobileView .card .card-content .photo-container .input_container {
            border: 1px solid #e5e5e5;
            border-radius: 6px 0px 0px 6px;
            width: 215px;
            border-right: none;
            padding: 1px; }
          .mobileView .card .card-content .photo-container input[type=file] {
            font-size: 12px; }
          .mobileView .card .card-content .photo-container input[type=file]::file-selector-button {
            background-color: #fff;
            color: #000;
            border: 0px;
            border-right: 1px solid #e5e5e5;
            padding: 10px 15px;
            margin-right: 20px;
            transition: .5s;
            border-radius: 6px 0px 0px 6px; }
          .mobileView .card .card-content .photo-container input[type=file]::file-selector-button:hover {
            background-color: #eee;
            border: 0px;
            border-right: 1px solid #e5e5e5; }
          .mobileView .card .card-content .photo-container .btn {
            padding: 16px 20px;
            color: #eeeeee;
            font-size: 12px;
            font-weight: 600;
            border-radius: 0px 6px 6px 0px;
            cursor: pointer;
            transition: background-color 0.3s ease-in-out; }
          .mobileView .card .card-content .photo-container .confirm-button {
            padding: 12px 12px;
            background-color: #397b44;
            color: #ffffff;
            font-weight: 500;
            border: solid 1px #e5e5e5; }
            .mobileView .card .card-content .photo-container .confirm-button:hover {
              background-color: #5b9c66; }
          .mobileView .card .card-content .photo-container .view-button {
            margin-left: 10px;
            margin-right: 4px; }
          .mobileView .card .card-content .photo-container .cancel-button {
            font-weight: 700;
            color: #eeeeee;
            background-color: red;
            border-radius: 50%;
            padding: 2px 7px;
            padding-bottom: 5px; }
            .mobileView .card .card-content .photo-container .cancel-button:hover {
              background-color: #991818; }
      .mobileView .card .checkbox-container {
        display: flex;
        flex-direction: row; }
        .mobileView .card .checkbox-container .container-left {
          display: flex;
          align-items: center;
          padding-left: 4px;
          padding-right: 14px; }
      .mobileView .card .unavailable-card-content {
        padding: 10px 30px;
        display: flex;
        flex-direction: row; }
        .mobileView .card .unavailable-card-content .row-item {
          margin: 0;
          padding: 0; }
      .mobileView .card .schoolitems-card-content {
        padding: 16px 30px;
        display: flex;
        flex-direction: column; }
        .mobileView .card .schoolitems-card-content .schoolartikel-rows {
          display: flex;
          flex-direction: row;
          flex-wrap: wrap; }
          .mobileView .card .schoolitems-card-content .schoolartikel-rows .title-desc {
            color: black;
            margin-right: 5px; }
        .mobileView .card .schoolitems-card-content .row-item {
          margin: 0;
          padding: 0; } }

@media (min-width: 1024px) {
  main {
    margin-top: 130px; } }

header {
  width: 100%;
  padding-top: 15px;
  position: fixed;
  top: 0;
  background: #fff;
  z-index: 1000; }
  @media only screen and (max-width: 1024px) {
    header {
      padding-top: 0px;
      height: 60px;
      position: fixed;
      top: 0;
      z-index: 6;
      width: 100%;
      background: white;
      border-bottom: 2px solid #000000; } }
  header .innerHeader {
    height: 100%;
    position: relative;
    height: 70px; }
    @media (max-width: 1300px) {
      header .innerHeader {
        max-width: 90%; } }
    @media (min-width: 1025px) and (max-width: 1260px) {
      header .innerHeader {
        height: 85px; } }
    @media only screen and (max-width: 1024px) {
      header .innerHeader {
        height: 58px;
        max-width: 100%; } }
    header .innerHeader .logo {
      padding-left: 10px;
      position: relative;
      /*
 * Let's target IE to respect aspect ratios and sizes for img tags containing SVG files
 *
 * [1] IE9
 * [2] IE10+
 */
      /* 1 */
      /* 2 */ }
      @media only screen and (max-width: 1024px) {
        header .innerHeader .logo {
          padding: 0; } }
      header .innerHeader .logo a {
        display: block;
        width: 100%;
        height: 100%; }
        header .innerHeader .logo a img {
          height: 60px; }
      @media only screen and (max-width: 1024px) {
        header .innerHeader .logo {
          position: absolute;
          left: 50%;
          transform: translateX(-50%); }
          header .innerHeader .logo a img {
            height: 20px;
            margin-top: 20px; } }
      header .innerHeader .logo .ie9 img[src$=".svg"] {
        width: 100%;
        height: auto !important; }
      @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
        header .innerHeader .logo img[src$=".svg"] {
          width: 100%;
          height: auto !important; } }
    header .innerHeader nav#nav {
      position: absolute;
      right: 0;
      top: 20px;
      transition: 0.3s; }
      @media (min-width: 1025px) and (max-width: 1260px) {
        header .innerHeader nav#nav {
          top: 50px; } }
      header .innerHeader nav#nav ul {
        display: inline-block;
        padding: 0;
        margin: 0;
        float: left; }
        header .innerHeader nav#nav ul.shopCart {
          padding-left: 7px;
          position: relative; }
          header .innerHeader nav#nav ul.shopCart:before {
            content: '';
            display: block;
            width: 2px;
            background-color: #bdbab1;
            height: 15px;
            position: absolute;
            top: 3px;
            left: 0; }
          header .innerHeader nav#nav ul.shopCart a, header .innerHeader nav#nav ul.shopCart li {
            color: #111111;
            display: block;
            letter-spacing: .6px;
            font-weight: 700; }
            header .innerHeader nav#nav ul.shopCart a:hover, header .innerHeader nav#nav ul.shopCart a.active, header .innerHeader nav#nav ul.shopCart li:hover, header .innerHeader nav#nav ul.shopCart li.active {
              color: #000000; }
              header .innerHeader nav#nav ul.shopCart a:hover span, header .innerHeader nav#nav ul.shopCart a.active span, header .innerHeader nav#nav ul.shopCart li:hover span, header .innerHeader nav#nav ul.shopCart li.active span {
                background-image: url("/Areas/Gebruikers/img/svg/icon_shopping-cart.svg"); }
          header .innerHeader nav#nav ul.shopCart li.shoppingTab {
            position: relative;
            display: -ms-flexbox;
            display: flex; }
            header .innerHeader nav#nav ul.shopCart li.shoppingTab span {
              padding-right: 15px; }
            header .innerHeader nav#nav ul.shopCart li.shoppingTab a {
              display: -ms-flexbox;
              display: flex; }
          @media only screen and (max-width: 1024px) {
            header .innerHeader nav#nav ul.shopCart {
              margin-right: 15px; }
              header .innerHeader nav#nav ul.shopCart:before {
                content: none; } }
        header .innerHeader nav#nav ul.logIn li {
          padding: 0 15px 0 0;
          position: relative;
          height: 34px; }
          header .innerHeader nav#nav ul.logIn li ul.subMenu {
            display: block;
            position: absolute;
            width: auto;
            height: auto;
            display: -ms-flexbox;
            display: flex;
            -ms-flex-direction: column;
            flex-direction: column;
            background: #4594EC;
            top: 100%;
            left: -20px;
            z-index: 1;
            border-radius: 4px;
            height: 0;
            overflow: hidden; }
            header .innerHeader nav#nav ul.logIn li ul.subMenu:before {
              content: '';
              display: block;
              position: absolute;
              bottom: 100%;
              left: 20px;
              width: 0.875rem;
              height: 0.875rem;
              background: #4594EC;
              transform: rotate(45deg);
              transform-origin: 0 100%;
              height: 0; }
            header .innerHeader nav#nav ul.logIn li ul.subMenu li {
              display: inline-block;
              margin: 0 20px;
              border-bottom: 2px solid rgba(255, 255, 255, 0.2);
              height: auto;
              padding: 0; }
              header .innerHeader nav#nav ul.logIn li ul.subMenu li:last-child {
                border: none; }
              header .innerHeader nav#nav ul.logIn li ul.subMenu li, header .innerHeader nav#nav ul.logIn li ul.subMenu li a {
                color: #ffffff; }
                header .innerHeader nav#nav ul.logIn li ul.subMenu li:hover, header .innerHeader nav#nav ul.logIn li ul.subMenu li a:hover {
                  text-decoration: underline; }
              header .innerHeader nav#nav ul.logIn li ul.subMenu li a {
                display: inline-block;
                white-space: nowrap;
                padding: 15px;
                width: 100%; }
          @media only screen and (max-width: 1024px) {
            header .innerHeader nav#nav ul.logIn li {
              display: inline-block; }
              header .innerHeader nav#nav ul.logIn li ul.subMenu {
                height: auto;
                position: fixed;
                top: 0;
                left: -105%;
                height: calc(100vh - 60px);
                width: 100vw;
                top: 60px;
                background-color: #ffffff;
                z-index: 2;
                padding-top: 30px; }
                header .innerHeader nav#nav ul.logIn li ul.subMenu.active {
                  left: 0; }
                header .innerHeader nav#nav ul.logIn li ul.subMenu:before {
                  content: none; }
                header .innerHeader nav#nav ul.logIn li ul.subMenu li {
                  border-bottom: 2px solid #f4f3f1; }
                  header .innerHeader nav#nav ul.logIn li ul.subMenu li:last-child {
                    border-bottom: 2px solid #f4f3f1; }
                  header .innerHeader nav#nav ul.logIn li ul.subMenu li a, header .innerHeader nav#nav ul.logIn li ul.subMenu li {
                    color: #000000; }
                  header .innerHeader nav#nav ul.logIn li ul.subMenu li a {
                    width: 100%;
                    position: relative; }
                    header .innerHeader nav#nav ul.logIn li ul.subMenu li a:after {
                      top: 27px;
                      left: auto;
                      right: 0;
                      position: absolute; } }
        header .innerHeader nav#nav ul.logIn li, header .innerHeader nav#nav ul.logIn a {
          color: #111111;
          text-transform: uppercase;
          font-weight: 700;
          cursor: pointer; }
          header .innerHeader nav#nav ul.logIn li.active, header .innerHeader nav#nav ul.logIn a.active {
            border-bottom: 2px solid;
            border-bottom-color: #e33d10; }
          header .innerHeader nav#nav ul.logIn li:hover, header .innerHeader nav#nav ul.logIn li.active, header .innerHeader nav#nav ul.logIn a:hover, header .innerHeader nav#nav ul.logIn a.active {
            color: #e33d10; }
            header .innerHeader nav#nav ul.logIn li:hover span.dropdown, header .innerHeader nav#nav ul.logIn li.active span.dropdown, header .innerHeader nav#nav ul.logIn a:hover span.dropdown, header .innerHeader nav#nav ul.logIn a.active span.dropdown {
              background-image: url("/Areas/Gebruikers/img/svg/icon_down_bluegreen.svg");
              top: 7px; }
            header .innerHeader nav#nav ul.logIn li:hover ul.subMenu, header .innerHeader nav#nav ul.logIn li.active ul.subMenu, header .innerHeader nav#nav ul.logIn a:hover ul.subMenu, header .innerHeader nav#nav ul.logIn a.active ul.subMenu {
              height: auto;
              overflow: visible; }
              header .innerHeader nav#nav ul.logIn li:hover ul.subMenu:before, header .innerHeader nav#nav ul.logIn li.active ul.subMenu:before, header .innerHeader nav#nav ul.logIn a:hover ul.subMenu:before, header .innerHeader nav#nav ul.logIn a.active ul.subMenu:before {
                height: 0.875rem; }
          header .innerHeader nav#nav ul.logIn li.active ul.subMenu, header .innerHeader nav#nav ul.logIn a.active ul.subMenu {
            left: 0;
            height: 100vh;
            width: 100vw;
            overflow: scroll; }
        header .innerHeader nav#nav ul.logIn a {
          display: -ms-flexbox;
          display: flex; }
        @media only screen and (max-width: 1024px) {
          header .innerHeader nav#nav ul.logIn {
            width: 100%;
            position: absolute;
            left: 0; } }
        header .innerHeader nav#nav ul.logIn li.contentPage {
          display: none; }
        header .innerHeader nav#nav ul .personInfo {
          margin-top: 20px;
          margin-left: 25px;
          cursor: default; }
        header .innerHeader nav#nav ul .personInfo p {
          padding: 0px;
          color: #000;
          font-weight: bolder;
          margin-left: 15px;
          font-size: 0.875rem;
          line-height: 1.0rem; }
        header .innerHeader nav#nav ul .personInfo img {
          width: 20%; }
        header .innerHeader nav#nav ul a, header .innerHeader nav#nav ul li {
          line-height: 1.375rem;
          display: block;
          font-size: 0.875rem;
          font-family: Montserrat, sans-serif;
          display: inline-block;
          letter-spacing: .6px; }
      @media only screen and (max-width: 1024px) {
        header .innerHeader nav#nav {
          width: 100%;
          top: 0; }
          header .innerHeader nav#nav ul.shopCart {
            position: absolute;
            right: 0;
            top: 20px; }
            header .innerHeader nav#nav ul.shopCart.active {
              display: none; }
          header .innerHeader nav#nav ul.logIn {
            height: 100%;
            display: block;
            position: absolute;
            left: -100%;
            top: 0px;
            background: white;
            width: 100%;
            /*transition: $transition;*/
            display: -ms-flexbox;
            display: flex;
            -ms-flex-direction: column;
            flex-direction: column;
            padding-top: 30px; }
            header .innerHeader nav#nav ul.logIn.active {
              left: 0; }
            header .innerHeader nav#nav ul.logIn li {
              display: block;
              padding: 20px;
              border-bottom: 2px solid #f4f3f1;
              margin: 0 20px;
              height: auto; }
              header .innerHeader nav#nav ul.logIn li a {
                color: #000000;
                display: -ms-flexbox;
                display: flex;
                -ms-flex-pack: justify;
                justify-content: space-between; }
                header .innerHeader nav#nav ul.logIn li a:after {
                  content: '';
                  display: inline-block;
                  background-image: url("/Areas/Gebruikers/img/svg/icon_down.svg");
                  width: 8px;
                  height: 5px;
                  background-size: 100%;
                  background-repeat: no-repeat;
                  transform: rotate(-90deg);
                  position: relative;
                  top: 7px; }
            header .innerHeader nav#nav ul.logIn li:hover, header .innerHeader nav#nav ul.logIn li.active, header .innerHeader nav#nav ul.logIn a:hover, header .innerHeader nav#nav ul.logIn a.active {
              color: #e33d10; } }
      @media only screen and (max-width: 1024px) {
        header .innerHeader nav#nav.active {
          height: calc( 100vh - 60px);
          top: 60px;
          overflow: auto; } }
  header .titleDescription {
    position: relative; }
  header .back {
    position: absolute;
    line-height: 60px;
    color: #000000;
    font-weight: 700;
    letter-spacing: .6px;
    cursor: pointer;
    font-family: Montserrat, sans-serif;
    font-size: 0.875rem;
    text-transform: uppercase;
    padding: 0 30px;
    display: none;
    z-index: 7; }
    header .back.active {
      display: block; }
  header .cookiesMessage {
    position: absolute;
    z-index: 9; }

.usp {
  padding: 0px 0px 9px;
  margin-top: 0px;
  width: 100%; }
  @media only screen and (max-width: 1024px) {
    .usp {
      display: none; } }
  .usp.bg-grey {
    background-color: #f4f3f1; }
  .usp.bg-lightGreen {
    background-color: #ECF1ED; }
  .usp.bg-darkGreen {
    background-color: #b2c9c2; }
  .usp ul {
    text-align: center;
    display: flex; }
    .usp ul li {
      display: inline-block;
      padding-right: 1.25rem;
      font-size: 1rem;
      font-family: Montserrat, sans-serif;
      font-weight: 400;
      line-height: 1.375rem;
      color: #666;
      white-space: nowrap; }
      .usp ul li a {
        transition: 0.3s; }

/*
 * Let's target IE to respect aspect ratios and sizes for img tags containing SVG files
 *
 * [1] IE9
 * [2] IE10+
 */
/* 1 */
.ie9 img[src$=".svg"] {
  width: 100%; }

/* 2 */
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
  img[src$=".svg"] {
    width: 100%; } }

.has-error .help-block, .has-error .control-label, .has-error .radio, .has-error .checkbox, .has-error .radio-inline, .has-error .checkbox-inline {
  color: #a94442; }

.help-block {
  display: block;
  margin-top: 5px;
  margin-bottom: 10px;
  color: #737373; }

.has-error .form-control, input .ng-invalid {
  border-color: #a94442;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); }

.has-feedback .form-control {
  padding-right: 42.5px; }

.camera {
  font-size: 16px;
  font-family: "Lucida Grande", "Arial", sans-serif;
  width: 760px; }
  .camera .webcam {
    display: inline-block; }
    .camera .webcam video {
      border: 1px solid black;
      box-shadow: 2px 2px 3px black;
      width: 100%;
      height: 100%;
      object-fit: contain; }
  .camera #canvas {
    display: none; }
  .camera label {
    display: block; }
  .camera .output li {
    display: inline;
    padding: 5px; }
  .camera .output img {
    height: 50px; }

.desktopOnly {
  display: block; }
  @media only screen and (max-width: 1024px) {
    .desktopOnly {
      display: none; } }

.mobileOnly {
  display: none; }
  @media only screen and (max-width: 1024px) {
    .mobileOnly {
      display: block; } }

.row {
  /*max-width: 1080px;*/ }

body {
  background-color: #ffffff; }
  body.menuActive {
    overflow: hidden; }
  @media only screen and (max-width: 1024px) {
    body main#main {
      margin-top: 60px; } }

section {
  overflow: hidden; }
  @media only screen and (max-width: 1024px) {
    section {
      padding-top: 0; } }

.popup {
  width: 90%;
  max-width: 640px;
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background: #172983;
  border-radius: 4px;
  padding: 25px;
  z-index: 20;
  display: none; }
  .popup.active {
    display: block; }
  .popup h2 {
    color: #ffffff;
    margin: 0;
    font-size: 2rem;
    line-height: 1.5rem;
    letter-spacing: .6px;
    font-weight: 700;
    font-family: "Netto OT"; }
  .popup p {
    color: #ffffff;
    font-size: 1rem;
    line-height: 1.5rem;
    letter-spacing: .6px;
    font-weight: 400;
    font-family: "Montserrat";
    margin: 10px 0; }
  .popup a {
    cursor: pointer; }

.welcome-container {
  max-width: 1024px;
  margin: 0 auto; }
  @media only screen and (max-width: 1200px) {
    .welcome-container {
      padding: 40px; } }
  @media only screen and (max-width: 769px) {
    .welcome-container {
      padding: 30px; } }
  @media only screen and (max-width: 363px) {
    .welcome-container {
      padding: 15px; } }
  .welcome-container .header-text {
    font-weight: bold; }
  .welcome-container .grid-container {
    display: flex;
    flex-direction: column;
    align-items: center; }
    .welcome-container .grid-container .welcome-grid {
      display: grid;
      grid-template-columns: 225px 225px 225px 225px;
      gap: 40px; }
      @media only screen and (max-width: 1200px) {
        .welcome-container .grid-container .welcome-grid {
          grid-template-columns: 225px 225px 225px; } }
      @media only screen and (max-width: 900px) {
        .welcome-container .grid-container .welcome-grid {
          grid-template-columns: 225px 225px; } }
      @media only screen and (max-width: 564px) {
        .welcome-container .grid-container .welcome-grid {
          gap: 20px;
          grid-template-columns: 143px 143px; } }
      .welcome-container .grid-container .welcome-grid .grid-tile {
        background-color: #f1f1f1;
        border-radius: 13px;
        padding: 25px;
        display: flex;
        align-items: center;
        flex-direction: column;
        user-select: none;
        max-height: 225px;
        margin: 0; }
        @media only screen and (max-width: 564px) {
          .welcome-container .grid-container .welcome-grid .grid-tile {
            padding: 15px; } }
        .welcome-container .grid-container .welcome-grid .grid-tile:hover {
          background-color: #ff7320;
          transition: 0.8s;
          cursor: pointer; }
          .welcome-container .grid-container .welcome-grid .grid-tile:hover svg.tile-icon {
            fill: #fff;
            transform: scale(1.1);
            transition: 0.4s; }
            .welcome-container .grid-container .welcome-grid .grid-tile:hover svg.tile-icon .cls-1, .welcome-container .grid-container .welcome-grid .grid-tile:hover svg.tile-icon .cls-2 {
              fill: #ff7320;
              stroke: #fff; }
          .welcome-container .grid-container .welcome-grid .grid-tile:hover .tile-text {
            color: #fff; }
        .welcome-container .grid-container .welcome-grid .grid-tile svg.tile-icon {
          display: flex;
          justify-content: center;
          fill: #ff7320;
          font-size: 80px;
          margin-top: 10px; }
          @media only screen and (max-width: 564px) {
            .welcome-container .grid-container .welcome-grid .grid-tile svg.tile-icon {
              font-size: 40px; } }
          .welcome-container .grid-container .welcome-grid .grid-tile svg.tile-icon .cls-1, .welcome-container .grid-container .welcome-grid .grid-tile svg.tile-icon .cls-2 {
            fill: #fff;
            stroke: #ff7320; }
        .welcome-container .grid-container .welcome-grid .grid-tile .text-wrapper {
          display: flex;
          max-width: 80%;
          flex-wrap: wrap;
          min-height: 75px; }
          @media only screen and (max-width: 564px) {
            .welcome-container .grid-container .welcome-grid .grid-tile .text-wrapper {
              min-height: 40px; } }
          .welcome-container .grid-container .welcome-grid .grid-tile .text-wrapper .tile-text {
            font-weight: 700;
            font-size: 1.1rem;
            text-align: center;
            margin-bottom: 0; }
            @media only screen and (max-width: 564px) {
              .welcome-container .grid-container .welcome-grid .grid-tile .text-wrapper .tile-text {
                font-size: 0.8rem; } }