@import url(https://fonts.googleapis.com/css?family=Montserrat:300,400,500,600,800);@charset "UTF-8";
/*! normalize.css v7.0.0 | MIT License | github.com/necolas/normalize.css */
/* Document
   ========================================================================== */
/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in
 *    IE on Windows Phone and in iOS.
 */
html {
  line-height: 1.15;
  /* 1 */
  -ms-text-size-adjust: 100%;
  /* 2 */
  -webkit-text-size-adjust: 100%;
  /* 2 */
}

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

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

/**
 * Correct the font size and margin on `h1` elements within `section` and
 * `article` contexts in Chrome, Firefox, and Safari.
 */
h1 {
  font-size: 2em;
  margin: 0.67em 0;
}

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

/**
 * Add the correct margin in IE 8.
 */
figure {
  margin: 1em 40px;
}

/**
 * 1. Add the correct box sizing in Firefox.
 * 2. Show the overflow in Edge and IE.
 */
hr {
  -webkit-box-sizing: content-box;
          box-sizing: content-box;
  /* 1 */
  height: 0;
  /* 1 */
  overflow: visible;
  /* 2 */
}

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

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

/**
 * 1. Remove the bottom border in Chrome 57- and Firefox 39-.
 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
 */
abbr[title] {
  border-bottom: none;
  /* 1 */
  text-decoration: underline;
  /* 2 */
  -webkit-text-decoration: underline dotted;
          text-decoration: underline dotted;
  /* 2 */
}

/**
 * Prevent the duplicate application of `bolder` by the next rule in Safari 6.
 */
b,
strong {
  font-weight: inherit;
}

/**
 * Add the correct font weight in Chrome, Edge, and Safari.
 */
b,
strong {
  font-weight: bolder;
}

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

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

/**
 * Add the correct background and color in IE 9-.
 */
mark {
  background-color: #ff0;
  color: #000;
}

/**
 * Add the correct font size in all browsers.
 */
small {
  font-size: 80%;
}

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

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

/* Embedded content
   ========================================================================== */
/**
 * Add the correct display in IE 9-.
 */
audio,
video {
  display: inline-block;
}

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

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

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

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

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

/**
 * Remove the inheritance of text transform in Edge, Firefox, and IE.
 * 1. Remove the inheritance of text transform in Firefox.
 */
button,
select {
  /* 1 */
  text-transform: none;
}

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

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

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

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

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

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

/**
 * Remove the default vertical scrollbar in IE.
 */
textarea {
  overflow: auto;
}

/**
 * 1. Add the correct box sizing in IE 10-.
 * 2. Remove the padding in IE 10-.
 */
[type="checkbox"],
[type="radio"] {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  /* 1 */
  padding: 0;
  /* 2 */
}

/**
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */
[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
  height: auto;
}

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

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

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

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

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

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

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

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

.wrapper {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  max-width: 1200px;
  margin: 0 auto;
}

.container-fluid {
  margin-right: auto;
  margin-left: auto;
  padding-right: 2rem;
  padding-left: 2rem;
}

.row {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  display: -webkit-box;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-flex: 0;
  -moz-flex: 0 1 auto;
  -ms-flex: 0 1 auto;
  flex: 0 1 auto;
  -webkit-box-direction: normal;
  -webkit-box-orient: horizontal;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  flex-direction: row;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  margin-right: -0.5rem;
  margin-left: -0.5rem;
}

.row.reverse {
  -webkit-box-direction: reverse;
  -webkit-box-orient: horizontal;
  -moz-flex-direction: row-reverse;
  -ms-flex-direction: row-reverse;
  flex-direction: row-reverse;
}

.col.reverse {
  -webkit-box-direction: reverse;
  -webkit-box-orient: vertical;
  -moz-flex-direction: column-reverse;
  -ms-flex-direction: column-reverse;
  flex-direction: column-reverse;
}

.col-xs {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -webkit-box-flex: 0;
  -moz-flex-grow: 0;
  -ms-flex-positive: 0;
  flex-grow: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  padding-right: 0.5rem;
  padding-left: 0.5rem;
  -ms-flex-preferred-size: auto;
  flex-basis: auto;
}

.col-xs-1 {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -webkit-box-flex: 0;
  -moz-flex-grow: 0;
  -ms-flex-positive: 0;
  flex-grow: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  padding-right: 0.5rem;
  padding-left: 0.5rem;
  -ms-flex-preferred-size: 8.33333333%;
  flex-basis: 8.33333333%;
  max-width: 8.33333333%;
}

.col-xs-2 {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -webkit-box-flex: 0;
  -moz-flex-grow: 0;
  -ms-flex-positive: 0;
  flex-grow: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  padding-right: 0.5rem;
  padding-left: 0.5rem;
  -ms-flex-preferred-size: 16.66666667%;
  flex-basis: 16.66666667%;
  max-width: 16.66666667%;
}

.col-xs-3 {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -webkit-box-flex: 0;
  -moz-flex-grow: 0;
  -ms-flex-positive: 0;
  flex-grow: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  padding-right: 0.5rem;
  padding-left: 0.5rem;
  -ms-flex-preferred-size: 25%;
  flex-basis: 25%;
  max-width: 25%;
}

.col-xs-4 {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -webkit-box-flex: 0;
  -moz-flex-grow: 0;
  -ms-flex-positive: 0;
  flex-grow: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  padding-right: 0.5rem;
  padding-left: 0.5rem;
  -ms-flex-preferred-size: 33.33333333%;
  flex-basis: 33.33333333%;
  max-width: 33.33333333%;
}

.col-xs-5 {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -webkit-box-flex: 0;
  -moz-flex-grow: 0;
  -ms-flex-positive: 0;
  flex-grow: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  padding-right: 0.5rem;
  padding-left: 0.5rem;
  -ms-flex-preferred-size: 41.66666667%;
  flex-basis: 41.66666667%;
  max-width: 41.66666667%;
}

.col-xs-6 {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -webkit-box-flex: 0;
  -moz-flex-grow: 0;
  -ms-flex-positive: 0;
  flex-grow: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  padding-right: 0.5rem;
  padding-left: 0.5rem;
  -ms-flex-preferred-size: 50%;
  flex-basis: 50%;
  max-width: 50%;
}

.col-xs-7 {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -webkit-box-flex: 0;
  -moz-flex-grow: 0;
  -ms-flex-positive: 0;
  flex-grow: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  padding-right: 0.5rem;
  padding-left: 0.5rem;
  -ms-flex-preferred-size: 58.33333333%;
  flex-basis: 58.33333333%;
  max-width: 58.33333333%;
}

.col-xs-8 {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -webkit-box-flex: 0;
  -moz-flex-grow: 0;
  -ms-flex-positive: 0;
  flex-grow: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  padding-right: 0.5rem;
  padding-left: 0.5rem;
  -ms-flex-preferred-size: 66.66666667%;
  flex-basis: 66.66666667%;
  max-width: 66.66666667%;
}

.col-xs-9 {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -webkit-box-flex: 0;
  -moz-flex-grow: 0;
  -ms-flex-positive: 0;
  flex-grow: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  padding-right: 0.5rem;
  padding-left: 0.5rem;
  -ms-flex-preferred-size: 75%;
  flex-basis: 75%;
  max-width: 75%;
}

.col-xs-10 {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -webkit-box-flex: 0;
  -moz-flex-grow: 0;
  -ms-flex-positive: 0;
  flex-grow: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  padding-right: 0.5rem;
  padding-left: 0.5rem;
  -ms-flex-preferred-size: 83.33333333%;
  flex-basis: 83.33333333%;
  max-width: 83.33333333%;
}

.col-xs-11 {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -webkit-box-flex: 0;
  -moz-flex-grow: 0;
  -ms-flex-positive: 0;
  flex-grow: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  padding-right: 0.5rem;
  padding-left: 0.5rem;
  -ms-flex-preferred-size: 91.66666667%;
  flex-basis: 91.66666667%;
  max-width: 91.66666667%;
}

.col-xs-12 {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -webkit-box-flex: 0;
  -moz-flex-grow: 0;
  -ms-flex-positive: 0;
  flex-grow: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  padding-right: 0.5rem;
  padding-left: 0.5rem;
  -ms-flex-preferred-size: 100%;
  flex-basis: 100%;
  max-width: 100%;
}

.col-xs-offset-1 {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -webkit-box-flex: 0;
  -moz-flex-grow: 0;
  -ms-flex-positive: 0;
  flex-grow: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  padding-right: 0.5rem;
  padding-left: 0.5rem;
  margin-left: 8.33333333%;
}

.col-xs-offset-2 {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -webkit-box-flex: 0;
  -moz-flex-grow: 0;
  -ms-flex-positive: 0;
  flex-grow: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  padding-right: 0.5rem;
  padding-left: 0.5rem;
  margin-left: 16.66666667%;
}

.col-xs-offset-3 {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -webkit-box-flex: 0;
  -moz-flex-grow: 0;
  -ms-flex-positive: 0;
  flex-grow: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  padding-right: 0.5rem;
  padding-left: 0.5rem;
  margin-left: 25%;
}

.col-xs-offset-4 {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -webkit-box-flex: 0;
  -moz-flex-grow: 0;
  -ms-flex-positive: 0;
  flex-grow: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  padding-right: 0.5rem;
  padding-left: 0.5rem;
  margin-left: 33.33333333%;
}

.col-xs-offset-5 {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -webkit-box-flex: 0;
  -moz-flex-grow: 0;
  -ms-flex-positive: 0;
  flex-grow: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  padding-right: 0.5rem;
  padding-left: 0.5rem;
  margin-left: 41.66666667%;
}

.col-xs-offset-6 {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -webkit-box-flex: 0;
  -moz-flex-grow: 0;
  -ms-flex-positive: 0;
  flex-grow: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  padding-right: 0.5rem;
  padding-left: 0.5rem;
  margin-left: 50%;
}

.col-xs-offset-7 {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -webkit-box-flex: 0;
  -moz-flex-grow: 0;
  -ms-flex-positive: 0;
  flex-grow: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  padding-right: 0.5rem;
  padding-left: 0.5rem;
  margin-left: 58.33333333%;
}

.col-xs-offset-8 {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -webkit-box-flex: 0;
  -moz-flex-grow: 0;
  -ms-flex-positive: 0;
  flex-grow: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  padding-right: 0.5rem;
  padding-left: 0.5rem;
  margin-left: 66.66666667%;
}

.col-xs-offset-9 {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -webkit-box-flex: 0;
  -moz-flex-grow: 0;
  -ms-flex-positive: 0;
  flex-grow: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  padding-right: 0.5rem;
  padding-left: 0.5rem;
  margin-left: 75%;
}

.col-xs-offset-10 {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -webkit-box-flex: 0;
  -moz-flex-grow: 0;
  -ms-flex-positive: 0;
  flex-grow: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  padding-right: 0.5rem;
  padding-left: 0.5rem;
  margin-left: 83.33333333%;
}

.col-xs-offset-11 {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -webkit-box-flex: 0;
  -moz-flex-grow: 0;
  -ms-flex-positive: 0;
  flex-grow: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  padding-right: 0.5rem;
  padding-left: 0.5rem;
  margin-left: 91.66666667%;
}

.col-xs-offset-12 {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -webkit-box-flex: 0;
  -moz-flex-grow: 0;
  -ms-flex-positive: 0;
  flex-grow: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  padding-right: 0.5rem;
  padding-left: 0.5rem;
  margin-left: 100%;
}

.col-xs {
  -webkit-box-flex: 1;
  -moz-flex-grow: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
  -ms-flex-preferred-size: 0;
  flex-basis: 0;
  max-width: 100%;
}

.start-xs {
  -webkit-box-pack: start;
  -ms-flex-pack: start;
  -moz-justify-content: flex-start;
  justify-content: flex-start;
  text-align: start;
}

.center-xs {
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  -moz-justify-content: center;
  justify-content: center;
  text-align: center;
}

.end-xs {
  -webkit-box-pack: end;
  -ms-flex-pack: end;
  -moz-justify-content: flex-end;
  justify-content: flex-end;
  text-align: end;
}

.top-xs {
  -webkit-box-align: start;
  -ms-flex-align: start;
  -moz-align-items: flex-start;
  align-items: flex-start;
}

.middle-xs {
  -webkit-box-align: center;
  -ms-flex-align: center;
  -moz-align-items: center;
  align-items: center;
}

.bottom-xs {
  -webkit-box-align: end;
  -ms-flex-align: end;
  -moz-align-items: flex-end;
  align-items: flex-end;
}

.around-xs {
  -ms-flex-pack: distribute;
  -moz-justify-content: space-around;
  justify-content: space-around;
}

.between-xs {
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -moz-justify-content: space-between;
  justify-content: space-between;
}

.first-xs {
  -webkit-box-ordinal-group: 0;
      -ms-flex-order: -1;
          order: -1;
}

.last-xs {
  -webkit-box-ordinal-group: 2;
      -ms-flex-order: 1;
          order: 1;
}

@media only screen and (min-width: 48em) {
  .container {
    width: 46rem;
  }
  .col-sm {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-box-flex: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 0.5rem;
    padding-left: 0.5rem;
    -ms-flex-preferred-size: auto;
    flex-basis: auto;
  }
  .col-sm-1 {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-box-flex: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 0.5rem;
    padding-left: 0.5rem;
    -ms-flex-preferred-size: 8.33333333%;
    flex-basis: 8.33333333%;
    max-width: 8.33333333%;
  }
  .col-sm-2 {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-box-flex: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 0.5rem;
    padding-left: 0.5rem;
    -ms-flex-preferred-size: 16.66666667%;
    flex-basis: 16.66666667%;
    max-width: 16.66666667%;
  }
  .col-sm-3 {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-box-flex: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 0.5rem;
    padding-left: 0.5rem;
    -ms-flex-preferred-size: 25%;
    flex-basis: 25%;
    max-width: 25%;
  }
  .col-sm-4 {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-box-flex: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 0.5rem;
    padding-left: 0.5rem;
    -ms-flex-preferred-size: 33.33333333%;
    flex-basis: 33.33333333%;
    max-width: 33.33333333%;
  }
  .col-sm-5 {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-box-flex: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 0.5rem;
    padding-left: 0.5rem;
    -ms-flex-preferred-size: 41.66666667%;
    flex-basis: 41.66666667%;
    max-width: 41.66666667%;
  }
  .col-sm-6 {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-box-flex: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 0.5rem;
    padding-left: 0.5rem;
    -ms-flex-preferred-size: 50%;
    flex-basis: 50%;
    max-width: 50%;
  }
  .col-sm-7 {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-box-flex: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 0.5rem;
    padding-left: 0.5rem;
    -ms-flex-preferred-size: 58.33333333%;
    flex-basis: 58.33333333%;
    max-width: 58.33333333%;
  }
  .col-sm-8 {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-box-flex: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 0.5rem;
    padding-left: 0.5rem;
    -ms-flex-preferred-size: 66.66666667%;
    flex-basis: 66.66666667%;
    max-width: 66.66666667%;
  }
  .col-sm-9 {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-box-flex: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 0.5rem;
    padding-left: 0.5rem;
    -ms-flex-preferred-size: 75%;
    flex-basis: 75%;
    max-width: 75%;
  }
  .col-sm-10 {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-box-flex: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 0.5rem;
    padding-left: 0.5rem;
    -ms-flex-preferred-size: 83.33333333%;
    flex-basis: 83.33333333%;
    max-width: 83.33333333%;
  }
  .col-sm-11 {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-box-flex: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 0.5rem;
    padding-left: 0.5rem;
    -ms-flex-preferred-size: 91.66666667%;
    flex-basis: 91.66666667%;
    max-width: 91.66666667%;
  }
  .col-sm-12 {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-box-flex: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 0.5rem;
    padding-left: 0.5rem;
    -ms-flex-preferred-size: 100%;
    flex-basis: 100%;
    max-width: 100%;
  }
  .col-sm-offset-1 {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-box-flex: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 0.5rem;
    padding-left: 0.5rem;
    margin-left: 8.33333333%;
  }
  .col-sm-offset-2 {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-box-flex: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 0.5rem;
    padding-left: 0.5rem;
    margin-left: 16.66666667%;
  }
  .col-sm-offset-3 {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-box-flex: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 0.5rem;
    padding-left: 0.5rem;
    margin-left: 25%;
  }
  .col-sm-offset-4 {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-box-flex: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 0.5rem;
    padding-left: 0.5rem;
    margin-left: 33.33333333%;
  }
  .col-sm-offset-5 {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-box-flex: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 0.5rem;
    padding-left: 0.5rem;
    margin-left: 41.66666667%;
  }
  .col-sm-offset-6 {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-box-flex: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 0.5rem;
    padding-left: 0.5rem;
    margin-left: 50%;
  }
  .col-sm-offset-7 {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-box-flex: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 0.5rem;
    padding-left: 0.5rem;
    margin-left: 58.33333333%;
  }
  .col-sm-offset-8 {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-box-flex: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 0.5rem;
    padding-left: 0.5rem;
    margin-left: 66.66666667%;
  }
  .col-sm-offset-9 {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-box-flex: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 0.5rem;
    padding-left: 0.5rem;
    margin-left: 75%;
  }
  .col-sm-offset-10 {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-box-flex: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 0.5rem;
    padding-left: 0.5rem;
    margin-left: 83.33333333%;
  }
  .col-sm-offset-11 {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-box-flex: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 0.5rem;
    padding-left: 0.5rem;
    margin-left: 91.66666667%;
  }
  .col-sm-offset-12 {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-box-flex: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 0.5rem;
    padding-left: 0.5rem;
    margin-left: 100%;
  }
  .col-sm {
    -webkit-box-flex: 1;
    -moz-flex-grow: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    -ms-flex-preferred-size: 0;
    flex-basis: 0;
    max-width: 100%;
  }
  .start-sm {
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    -moz-justify-content: flex-start;
    justify-content: flex-start;
    text-align: start;
  }
  .center-sm {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -moz-justify-content: center;
    justify-content: center;
    text-align: center;
  }
  .end-sm {
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    -moz-justify-content: flex-end;
    justify-content: flex-end;
    text-align: end;
  }
  .top-sm {
    -webkit-box-align: start;
    -ms-flex-align: start;
    -moz-align-items: flex-start;
    align-items: flex-start;
  }
  .middle-sm {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -moz-align-items: center;
    align-items: center;
  }
  .bottom-sm {
    -webkit-box-align: end;
    -ms-flex-align: end;
    -moz-align-items: flex-end;
    align-items: flex-end;
  }
  .around-sm {
    -ms-flex-pack: distribute;
    -moz-justify-content: space-around;
    justify-content: space-around;
  }
  .between-sm {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    -moz-justify-content: space-between;
    justify-content: space-between;
  }
  .first-sm {
    -webkit-box-ordinal-group: 0;
        -ms-flex-order: -1;
            order: -1;
  }
  .last-sm {
    -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
            order: 1;
  }
}

@media only screen and (min-width: 64em) {
  .container {
    width: 62rem;
  }
  .col-md {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-box-flex: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 0.5rem;
    padding-left: 0.5rem;
    -ms-flex-preferred-size: auto;
    flex-basis: auto;
  }
  .col-md-1 {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-box-flex: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 0.5rem;
    padding-left: 0.5rem;
    -ms-flex-preferred-size: 8.33333333%;
    flex-basis: 8.33333333%;
    max-width: 8.33333333%;
  }
  .col-md-2 {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-box-flex: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 0.5rem;
    padding-left: 0.5rem;
    -ms-flex-preferred-size: 16.66666667%;
    flex-basis: 16.66666667%;
    max-width: 16.66666667%;
  }
  .col-md-3 {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-box-flex: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 0.5rem;
    padding-left: 0.5rem;
    -ms-flex-preferred-size: 25%;
    flex-basis: 25%;
    max-width: 25%;
  }
  .col-md-4 {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-box-flex: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 0.5rem;
    padding-left: 0.5rem;
    -ms-flex-preferred-size: 33.33333333%;
    flex-basis: 33.33333333%;
    max-width: 33.33333333%;
  }
  .col-md-5 {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-box-flex: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 0.5rem;
    padding-left: 0.5rem;
    -ms-flex-preferred-size: 41.66666667%;
    flex-basis: 41.66666667%;
    max-width: 41.66666667%;
  }
  .col-md-6 {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-box-flex: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 0.5rem;
    padding-left: 0.5rem;
    -ms-flex-preferred-size: 50%;
    flex-basis: 50%;
    max-width: 50%;
  }
  .col-md-7 {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-box-flex: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 0.5rem;
    padding-left: 0.5rem;
    -ms-flex-preferred-size: 58.33333333%;
    flex-basis: 58.33333333%;
    max-width: 58.33333333%;
  }
  .col-md-8 {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-box-flex: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 0.5rem;
    padding-left: 0.5rem;
    -ms-flex-preferred-size: 66.66666667%;
    flex-basis: 66.66666667%;
    max-width: 66.66666667%;
  }
  .col-md-9 {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-box-flex: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 0.5rem;
    padding-left: 0.5rem;
    -ms-flex-preferred-size: 75%;
    flex-basis: 75%;
    max-width: 75%;
  }
  .col-md-10 {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-box-flex: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 0.5rem;
    padding-left: 0.5rem;
    -ms-flex-preferred-size: 83.33333333%;
    flex-basis: 83.33333333%;
    max-width: 83.33333333%;
  }
  .col-md-11 {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-box-flex: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 0.5rem;
    padding-left: 0.5rem;
    -ms-flex-preferred-size: 91.66666667%;
    flex-basis: 91.66666667%;
    max-width: 91.66666667%;
  }
  .col-md-12 {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-box-flex: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 0.5rem;
    padding-left: 0.5rem;
    -ms-flex-preferred-size: 100%;
    flex-basis: 100%;
    max-width: 100%;
  }
  .col-md-offset-1 {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-box-flex: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 0.5rem;
    padding-left: 0.5rem;
    margin-left: 8.33333333%;
  }
  .col-md-offset-2 {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-box-flex: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 0.5rem;
    padding-left: 0.5rem;
    margin-left: 16.66666667%;
  }
  .col-md-offset-3 {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-box-flex: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 0.5rem;
    padding-left: 0.5rem;
    margin-left: 25%;
  }
  .col-md-offset-4 {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-box-flex: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 0.5rem;
    padding-left: 0.5rem;
    margin-left: 33.33333333%;
  }
  .col-md-offset-5 {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-box-flex: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 0.5rem;
    padding-left: 0.5rem;
    margin-left: 41.66666667%;
  }
  .col-md-offset-6 {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-box-flex: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 0.5rem;
    padding-left: 0.5rem;
    margin-left: 50%;
  }
  .col-md-offset-7 {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-box-flex: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 0.5rem;
    padding-left: 0.5rem;
    margin-left: 58.33333333%;
  }
  .col-md-offset-8 {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-box-flex: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 0.5rem;
    padding-left: 0.5rem;
    margin-left: 66.66666667%;
  }
  .col-md-offset-9 {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-box-flex: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 0.5rem;
    padding-left: 0.5rem;
    margin-left: 75%;
  }
  .col-md-offset-10 {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-box-flex: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 0.5rem;
    padding-left: 0.5rem;
    margin-left: 83.33333333%;
  }
  .col-md-offset-11 {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-box-flex: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 0.5rem;
    padding-left: 0.5rem;
    margin-left: 91.66666667%;
  }
  .col-md-offset-12 {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-box-flex: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 0.5rem;
    padding-left: 0.5rem;
    margin-left: 100%;
  }
  .col-md {
    -webkit-box-flex: 1;
    -moz-flex-grow: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    -ms-flex-preferred-size: 0;
    flex-basis: 0;
    max-width: 100%;
  }
  .start-md {
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    -moz-justify-content: flex-start;
    justify-content: flex-start;
    text-align: start;
  }
  .center-md {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -moz-justify-content: center;
    justify-content: center;
    text-align: center;
  }
  .end-md {
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    -moz-justify-content: flex-end;
    justify-content: flex-end;
    text-align: end;
  }
  .top-md {
    -webkit-box-align: start;
    -ms-flex-align: start;
    -moz-align-items: flex-start;
    align-items: flex-start;
  }
  .middle-md {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -moz-align-items: center;
    align-items: center;
  }
  .bottom-md {
    -webkit-box-align: end;
    -ms-flex-align: end;
    -moz-align-items: flex-end;
    align-items: flex-end;
  }
  .around-md {
    -ms-flex-pack: distribute;
    -moz-justify-content: space-around;
    justify-content: space-around;
  }
  .between-md {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    -moz-justify-content: space-between;
    justify-content: space-between;
  }
  .first-md {
    -webkit-box-ordinal-group: 0;
        -ms-flex-order: -1;
            order: -1;
  }
  .last-md {
    -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
            order: 1;
  }
}

@media only screen and (min-width: 80em) {
  .container {
    width: 75rem;
  }
  .col-lg {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-box-flex: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 0.5rem;
    padding-left: 0.5rem;
    -ms-flex-preferred-size: auto;
    flex-basis: auto;
  }
  .col-lg-1 {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-box-flex: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 0.5rem;
    padding-left: 0.5rem;
    -ms-flex-preferred-size: 8.33333333%;
    flex-basis: 8.33333333%;
    max-width: 8.33333333%;
  }
  .col-lg-2 {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-box-flex: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 0.5rem;
    padding-left: 0.5rem;
    -ms-flex-preferred-size: 16.66666667%;
    flex-basis: 16.66666667%;
    max-width: 16.66666667%;
  }
  .col-lg-3 {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-box-flex: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 0.5rem;
    padding-left: 0.5rem;
    -ms-flex-preferred-size: 25%;
    flex-basis: 25%;
    max-width: 25%;
  }
  .col-lg-4 {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-box-flex: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 0.5rem;
    padding-left: 0.5rem;
    -ms-flex-preferred-size: 33.33333333%;
    flex-basis: 33.33333333%;
    max-width: 33.33333333%;
  }
  .col-lg-5 {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-box-flex: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 0.5rem;
    padding-left: 0.5rem;
    -ms-flex-preferred-size: 41.66666667%;
    flex-basis: 41.66666667%;
    max-width: 41.66666667%;
  }
  .col-lg-6 {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-box-flex: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 0.5rem;
    padding-left: 0.5rem;
    -ms-flex-preferred-size: 50%;
    flex-basis: 50%;
    max-width: 50%;
  }
  .col-lg-7 {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-box-flex: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 0.5rem;
    padding-left: 0.5rem;
    -ms-flex-preferred-size: 58.33333333%;
    flex-basis: 58.33333333%;
    max-width: 58.33333333%;
  }
  .col-lg-8 {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-box-flex: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 0.5rem;
    padding-left: 0.5rem;
    -ms-flex-preferred-size: 66.66666667%;
    flex-basis: 66.66666667%;
    max-width: 66.66666667%;
  }
  .col-lg-9 {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-box-flex: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 0.5rem;
    padding-left: 0.5rem;
    -ms-flex-preferred-size: 75%;
    flex-basis: 75%;
    max-width: 75%;
  }
  .col-lg-10 {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-box-flex: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 0.5rem;
    padding-left: 0.5rem;
    -ms-flex-preferred-size: 83.33333333%;
    flex-basis: 83.33333333%;
    max-width: 83.33333333%;
  }
  .col-lg-11 {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-box-flex: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 0.5rem;
    padding-left: 0.5rem;
    -ms-flex-preferred-size: 91.66666667%;
    flex-basis: 91.66666667%;
    max-width: 91.66666667%;
  }
  .col-lg-12 {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-box-flex: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 0.5rem;
    padding-left: 0.5rem;
    -ms-flex-preferred-size: 100%;
    flex-basis: 100%;
    max-width: 100%;
  }
  .col-lg-offset-1 {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-box-flex: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 0.5rem;
    padding-left: 0.5rem;
    margin-left: 8.33333333%;
  }
  .col-lg-offset-2 {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-box-flex: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 0.5rem;
    padding-left: 0.5rem;
    margin-left: 16.66666667%;
  }
  .col-lg-offset-3 {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-box-flex: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 0.5rem;
    padding-left: 0.5rem;
    margin-left: 25%;
  }
  .col-lg-offset-4 {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-box-flex: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 0.5rem;
    padding-left: 0.5rem;
    margin-left: 33.33333333%;
  }
  .col-lg-offset-5 {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-box-flex: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 0.5rem;
    padding-left: 0.5rem;
    margin-left: 41.66666667%;
  }
  .col-lg-offset-6 {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-box-flex: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 0.5rem;
    padding-left: 0.5rem;
    margin-left: 50%;
  }
  .col-lg-offset-7 {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-box-flex: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 0.5rem;
    padding-left: 0.5rem;
    margin-left: 58.33333333%;
  }
  .col-lg-offset-8 {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-box-flex: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 0.5rem;
    padding-left: 0.5rem;
    margin-left: 66.66666667%;
  }
  .col-lg-offset-9 {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-box-flex: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 0.5rem;
    padding-left: 0.5rem;
    margin-left: 75%;
  }
  .col-lg-offset-10 {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-box-flex: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 0.5rem;
    padding-left: 0.5rem;
    margin-left: 83.33333333%;
  }
  .col-lg-offset-11 {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-box-flex: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 0.5rem;
    padding-left: 0.5rem;
    margin-left: 91.66666667%;
  }
  .col-lg-offset-12 {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-box-flex: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 0.5rem;
    padding-left: 0.5rem;
    margin-left: 100%;
  }
  .col-lg {
    -webkit-box-flex: 1;
    -moz-flex-grow: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    -ms-flex-preferred-size: 0;
    flex-basis: 0;
    max-width: 100%;
  }
  .start-lg {
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    -moz-justify-content: flex-start;
    justify-content: flex-start;
    text-align: start;
  }
  .center-lg {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -moz-justify-content: center;
    justify-content: center;
    text-align: center;
  }
  .end-lg {
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    -moz-justify-content: flex-end;
    justify-content: flex-end;
    text-align: end;
  }
  .top-lg {
    -webkit-box-align: start;
    -ms-flex-align: start;
    -moz-align-items: flex-start;
    align-items: flex-start;
  }
  .middle-lg {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -moz-align-items: center;
    align-items: center;
  }
  .bottom-lg {
    -webkit-box-align: end;
    -ms-flex-align: end;
    -moz-align-items: flex-end;
    align-items: flex-end;
  }
  .around-lg {
    -ms-flex-pack: distribute;
    -moz-justify-content: space-around;
    justify-content: space-around;
  }
  .between-lg {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    -moz-justify-content: space-between;
    justify-content: space-between;
  }
  .first-lg {
    -webkit-box-ordinal-group: 0;
        -ms-flex-order: -1;
            order: -1;
  }
  .last-lg {
    -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
            order: 1;
  }
}

@-webkit-keyframes plyr-progress {
  to {
    background-position: 25px 0;
  }
}

@keyframes plyr-progress {
  to {
    background-position: 25px 0;
  }
}

.plyr {
  position: relative;
  max-width: 100%;
  min-width: 200px;
  font-family: "Open Sans", "Helvetica Neue", Arial, sans-serif;
  direction: ltr;
}

.plyr,
.plyr *,
.plyr *::after,
.plyr *::before {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

.plyr a,
.plyr button,
.plyr input,
.plyr label {
  -ms-touch-action: manipulation;
      touch-action: manipulation;
}

.plyr:focus {
  outline: 0;
}

.plyr video,
.plyr audio {
  width: 100%;
  height: auto;
  vertical-align: middle;
  border-radius: inherit;
}

.plyr input[type="range"] {
  display: block;
  height: 20px;
  width: 100%;
  margin: 0;
  padding: 0;
  vertical-align: middle;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  cursor: pointer;
  border: none;
  background: transparent;
}

.plyr input[type="range"]::-webkit-slider-runnable-track {
  height: 8px;
  background: transparent;
  border: 0;
  border-radius: 4px;
  -webkit-user-select: none;
          user-select: none;
}

.plyr input[type="range"]::-webkit-slider-thumb {
  -webkit-appearance: none;
  margin-top: -4px;
  position: relative;
  height: 16px;
  width: 16px;
  background: #fff;
  border: 2px solid transparent;
  border-radius: 100%;
  -webkit-transition: background .2s ease, border .2s ease, -webkit-transform .2s ease;
  transition: background .2s ease, border .2s ease, -webkit-transform .2s ease;
  transition: background .2s ease, border .2s ease, transform .2s ease;
  transition: background .2s ease, border .2s ease, transform .2s ease, -webkit-transform .2s ease;
  -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15), 0 0 0 1px rgba(0, 0, 0, 0.15);
          box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15), 0 0 0 1px rgba(0, 0, 0, 0.15);
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

.plyr input[type="range"]::-moz-range-track {
  height: 8px;
  background: transparent;
  border: 0;
  border-radius: 4px;
  -moz-user-select: none;
       user-select: none;
}

.plyr input[type="range"]::-moz-range-thumb {
  position: relative;
  height: 16px;
  width: 16px;
  background: #fff;
  border: 2px solid transparent;
  border-radius: 100%;
  -webkit-transition: background .2s ease, border .2s ease, -webkit-transform .2s ease;
  transition: background .2s ease, border .2s ease, -webkit-transform .2s ease;
  transition: background .2s ease, border .2s ease, transform .2s ease;
  transition: background .2s ease, border .2s ease, transform .2s ease, -webkit-transform .2s ease;
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15), 0 0 0 1px rgba(0, 0, 0, 0.15);
  box-sizing: border-box;
}

.plyr input[type="range"]::-ms-track {
  height: 8px;
  background: transparent;
  border: 0;
  color: transparent;
}

.plyr input[type="range"]::-ms-fill-upper {
  height: 8px;
  background: transparent;
  border: 0;
  border-radius: 4px;
  -ms-user-select: none;
      user-select: none;
}

.plyr input[type="range"]::-ms-fill-lower {
  height: 8px;
  background: transparent;
  border: 0;
  border-radius: 4px;
  -ms-user-select: none;
      user-select: none;
  background: #d31c23;
}

.plyr input[type="range"]::-ms-thumb {
  position: relative;
  height: 16px;
  width: 16px;
  background: #fff;
  border: 2px solid transparent;
  border-radius: 100%;
  -webkit-transition: background .2s ease, border .2s ease, -webkit-transform .2s ease;
  transition: background .2s ease, border .2s ease, -webkit-transform .2s ease;
  transition: background .2s ease, border .2s ease, transform .2s ease;
  transition: background .2s ease, border .2s ease, transform .2s ease, -webkit-transform .2s ease;
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15), 0 0 0 1px rgba(0, 0, 0, 0.15);
  box-sizing: border-box;
  margin-top: 0;
}

.plyr input[type="range"]::-ms-tooltip {
  display: none;
}

.plyr input[type="range"]:focus {
  outline: 0;
}

.plyr input[type="range"]::-moz-focus-outer {
  border: 0;
}

.plyr input[type="range"].tab-focus:focus {
  outline-offset: 3px;
}

.plyr input[type="range"]:active::-webkit-slider-thumb {
  background: #1f5376;
  border-color: #fff;
  -webkit-transform: scale(1.25);
          transform: scale(1.25);
}

.plyr input[type="range"]:active::-moz-range-thumb {
  background: #1f5376;
  border-color: #fff;
  transform: scale(1.25);
}

.plyr input[type="range"]:active::-ms-thumb {
  background: #1f5376;
  border-color: #fff;
  transform: scale(1.25);
}

.plyr--video input[type="range"].tab-focus:focus {
  outline: 1px dotted rgba(255, 255, 255, 0.5);
}

.plyr--audio input[type="range"].tab-focus:focus {
  outline: 1px dotted rgba(255, 255, 255, 0.5);
}

.plyr__sr-only {
  clip: rect(1px, 1px, 1px, 1px);
  overflow: hidden;
  position: absolute !important;
  padding: 0 !important;
  border: 0 !important;
  height: 1px !important;
  width: 1px !important;
}

.plyr__video-wrapper {
  position: relative;
  background: #000;
  border-radius: inherit;
}

.plyr__video-embed {
  padding-bottom: 56.25%;
  /* 16:9 */
  height: 0;
  border-radius: inherit;
  overflow: hidden;
  z-index: 0;
}

.plyr__video-embed iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 0;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}

.plyr__video-embed > div {
  position: relative;
  padding-bottom: 200%;
  -webkit-transform: translateY(-35.95%);
          transform: translateY(-35.95%);
}

.plyr .plyr__video-embed iframe {
  pointer-events: none;
}

.plyr video::-webkit-media-text-track-container {
  display: none;
}

.plyr__captions {
  display: none;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  padding: 20px;
  -webkit-transform: translateY(-60px);
          transform: translateY(-60px);
  -webkit-transition: -webkit-transform 0.3s ease;
  transition: -webkit-transform 0.3s ease;
  transition: transform 0.3s ease;
  transition: transform 0.3s ease, -webkit-transform 0.3s ease;
  color: #fff;
  font-size: 16px;
  text-align: center;
  font-weight: 400;
}

.plyr__captions span {
  border-radius: 2px;
  padding: 3px 10px;
  background: rgba(0, 0, 0, 0.7);
  -webkit-box-decoration-break: clone;
          box-decoration-break: clone;
  line-height: 150%;
}

.plyr__captions span:empty {
  display: none;
}

@media (min-width: 768px) {
  .plyr__captions {
    font-size: 24px;
  }
}

.plyr--captions-active .plyr__captions {
  display: block;
}

.plyr--hide-controls .plyr__captions {
  -webkit-transform: translateY(-20px);
          transform: translateY(-20px);
}

@media (min-width: 1024px) {
  .plyr--fullscreen-active .plyr__captions {
    font-size: 32px;
  }
}

.plyr ::-webkit-media-controls {
  display: none;
}

.plyr__controls {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  line-height: 1;
  text-align: center;
  pointer-events: none;
}

.plyr__controls > * {
  pointer-events: all;
}

.plyr__controls > button,
.plyr__controls .plyr__progress,
.plyr__controls .plyr__time {
  margin-left: 5px;
}

.plyr__controls > button:first-child,
.plyr__controls .plyr__progress:first-child,
.plyr__controls .plyr__time:first-child {
  margin-left: 0;
}

.plyr__controls .plyr__volume {
  margin-left: 5px;
}

.plyr__controls [data-plyr="pause"] {
  margin-left: 0;
}

.plyr__controls button {
  position: relative;
  display: inline-block;
  -ms-flex-negative: 0;
      flex-shrink: 0;
  overflow: visible;
  vertical-align: middle;
  padding: 7px;
  border: 0;
  background: transparent;
  border-radius: 3px;
  cursor: pointer;
  -webkit-transition: background 0.3s ease, color 0.3s ease, opacity 0.3s ease;
  transition: background 0.3s ease, color 0.3s ease, opacity 0.3s ease;
  color: inherit;
}

.plyr__controls button svg {
  width: 18px;
  height: 18px;
  display: block;
  fill: currentColor;
}

.plyr__controls button:focus {
  outline: 0;
}

.plyr__controls .icon--exit-fullscreen,
.plyr__controls .icon--muted,
.plyr__controls .icon--captions-on {
  display: none;
}

@media (min-width: 480px) {
  .plyr__controls > button,
  .plyr__controls .plyr__progress,
  .plyr__controls .plyr__time {
    margin-left: 10px;
  }
}

.plyr--hide-controls .plyr__controls {
  opacity: 0;
  pointer-events: none;
}

.plyr--video .plyr__controls {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  padding: 50px 10px 10px;
  background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0)), to(rgba(0, 0, 0, 0.5)));
  background: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.5));
  border-bottom-left-radius: inherit;
  border-bottom-right-radius: inherit;
  color: #fff;
  -webkit-transition: opacity 0.3s ease;
  transition: opacity 0.3s ease;
}

.plyr--video .plyr__controls button.tab-focus:focus, .plyr--video .plyr__controls button:hover {
  background: #1f5376;
  color: #fff;
}

.plyr--audio .plyr__controls {
  padding: 10px;
  border-radius: inherit;
  background: #262626;
  border: none;
  color: white;
}

.plyr--audio .plyr__controls button.tab-focus:focus, .plyr--audio .plyr__controls button:hover {
  background: #1f5376;
  color: #fff;
}

.plyr__play-large {
  display: none;
  position: absolute;
  z-index: 1;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  padding: 10px;
  background: #1f5376;
  border: 4px solid currentColor;
  border-radius: 100%;
  -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15);
          box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15);
  color: #fff;
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
}

.plyr__play-large svg {
  position: relative;
  left: 2px;
  width: 20px;
  height: 20px;
  display: block;
  fill: currentColor;
}

.plyr__play-large:focus {
  outline: 1px dotted rgba(255, 255, 255, 0.5);
}

.plyr .plyr__play-large {
  display: inline-block;
}

.plyr--audio .plyr__play-large {
  display: none;
}

.plyr--playing .plyr__play-large {
  opacity: 0;
  visibility: hidden;
}

.plyr__controls [data-plyr="pause"],
.plyr--playing .plyr__controls [data-plyr="play"] {
  display: none;
}

.plyr--playing .plyr__controls [data-plyr="pause"] {
  display: inline-block;
}

.plyr--fullscreen-active .icon--exit-fullscreen,
.plyr--muted .plyr__controls .icon--muted,
.plyr--captions-active .plyr__controls .icon--captions-on {
  display: block;
}

.plyr--fullscreen-active .icon--exit-fullscreen + svg,
.plyr--muted .plyr__controls .icon--muted + svg,
.plyr--captions-active .plyr__controls .icon--captions-on + svg {
  display: none;
}

.plyr [data-plyr="captions"],
.plyr [data-plyr="fullscreen"] {
  display: none;
}

.plyr--captions-enabled [data-plyr="captions"],
.plyr--fullscreen-enabled [data-plyr="fullscreen"] {
  display: inline-block;
}

.plyr__tooltip {
  position: absolute;
  z-index: 2;
  bottom: 100%;
  margin-bottom: 10px;
  padding: 5px 7.5px;
  pointer-events: none;
  opacity: 0;
  background: rgba(255, 255, 255, 0.7);
  border-radius: 3px;
  color: #262626;
  font-size: 14px;
  line-height: 1.3;
  -webkit-transform: translate(-50%, 10px) scale(0.8);
          transform: translate(-50%, 10px) scale(0.8);
  -webkit-transform-origin: 50% 100%;
          transform-origin: 50% 100%;
  -webkit-transition: opacity 0.2s 0.1s ease, -webkit-transform 0.2s 0.1s ease;
  transition: opacity 0.2s 0.1s ease, -webkit-transform 0.2s 0.1s ease;
  transition: transform 0.2s 0.1s ease, opacity 0.2s 0.1s ease;
  transition: transform 0.2s 0.1s ease, opacity 0.2s 0.1s ease, -webkit-transform 0.2s 0.1s ease;
}

.plyr__tooltip::before {
  content: "";
  position: absolute;
  width: 0;
  height: 0;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  bottom: -4px;
  border-right: 4px solid transparent;
  border-top: 4px solid rgba(255, 255, 255, 0.7);
  border-left: 4px solid transparent;
  z-index: 2;
}

.plyr button:hover .plyr__tooltip,
.plyr button.tab-focus:focus .plyr__tooltip,
.plyr__tooltip--visible {
  opacity: 1;
  -webkit-transform: translate(-50%, 0) scale(1);
          transform: translate(-50%, 0) scale(1);
}

.plyr button:hover .plyr__tooltip {
  z-index: 3;
}

.plyr__controls button:first-child .plyr__tooltip {
  left: 0;
  -webkit-transform: translate(0, 10px) scale(0.8);
          transform: translate(0, 10px) scale(0.8);
  -webkit-transform-origin: 0 100%;
          transform-origin: 0 100%;
}

.plyr__controls button:first-child .plyr__tooltip::before {
  left: 16px;
}

.plyr__controls button:last-child .plyr__tooltip {
  right: 0;
  -webkit-transform: translate(0, 10px) scale(0.8);
          transform: translate(0, 10px) scale(0.8);
  -webkit-transform-origin: 100% 100%;
          transform-origin: 100% 100%;
}

.plyr__controls button:last-child .plyr__tooltip::before {
  left: auto;
  right: 16px;
  -webkit-transform: translateX(50%);
          transform: translateX(50%);
}

.plyr__controls button:first-child:hover .plyr__tooltip,
.plyr__controls button:first-child.tab-focus:focus .plyr__tooltip,
.plyr__controls button:first-child .plyr__tooltip--visible,
.plyr__controls button:last-child:hover .plyr__tooltip,
.plyr__controls button:last-child.tab-focus:focus .plyr__tooltip,
.plyr__controls button:last-child .plyr__tooltip--visible {
  -webkit-transform: translate(0, 0) scale(1);
          transform: translate(0, 0) scale(1);
}

.plyr__progress {
  display: none;
  position: relative;
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
}

.plyr__progress input[type="range"] {
  position: relative;
  z-index: 2;
}

.plyr__progress input[type="range"]::-webkit-slider-runnable-track {
  background: transparent;
}

.plyr__progress input[type="range"]::-moz-range-track {
  background: transparent;
}

.plyr__progress input[type="range"]::-ms-fill-upper {
  background: transparent;
}

.plyr__progress .plyr__tooltip {
  left: 0;
}

.plyr .plyr__progress {
  display: inline-block;
}

.plyr__progress--buffer,
.plyr__progress--played,
.plyr__volume--display {
  position: absolute;
  left: 0;
  top: 50%;
  width: 100%;
  height: 8px;
  margin: -4px 0 0;
  padding: 0;
  vertical-align: top;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  border: none;
  border-radius: 100px;
}

.plyr__progress--buffer::-webkit-progress-bar,
.plyr__progress--played::-webkit-progress-bar,
.plyr__volume--display::-webkit-progress-bar {
  background: transparent;
}

.plyr__progress--buffer::-webkit-progress-value,
.plyr__progress--played::-webkit-progress-value,
.plyr__volume--display::-webkit-progress-value {
  background: currentColor;
  border-radius: 100px;
  min-width: 8px;
}

.plyr__progress--buffer::-moz-progress-bar,
.plyr__progress--played::-moz-progress-bar,
.plyr__volume--display::-moz-progress-bar {
  background: currentColor;
  border-radius: 100px;
  min-width: 8px;
}

.plyr__progress--buffer::-ms-fill,
.plyr__progress--played::-ms-fill,
.plyr__volume--display::-ms-fill {
  border-radius: 100px;
}

.plyr__progress--played,
.plyr__volume--display {
  z-index: 1;
  color: #d31c23;
  background: transparent;
  -webkit-transition: none;
  transition: none;
}

.plyr__progress--played::-webkit-progress-value,
.plyr__volume--display::-webkit-progress-value {
  min-width: 8px;
  max-width: 99%;
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
  -webkit-transition: none;
  transition: none;
}

.plyr__progress--played::-moz-progress-bar,
.plyr__volume--display::-moz-progress-bar {
  min-width: 8px;
  max-width: 99%;
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
  -webkit-transition: none;
  transition: none;
}

.plyr__progress--played::-ms-fill,
.plyr__volume--display::-ms-fill {
  display: none;
}

.plyr__progress--buffer::-webkit-progress-value {
  -webkit-transition: width 0.2s ease;
  transition: width 0.2s ease;
}

.plyr__progress--buffer::-moz-progress-bar {
  -webkit-transition: width 0.2s ease;
  transition: width 0.2s ease;
}

.plyr__progress--buffer::-ms-fill {
  -webkit-transition: width 0.2s ease;
  transition: width 0.2s ease;
}

.plyr--video .plyr__progress--buffer,
.plyr--video .plyr__volume--display {
  background: rgba(255, 255, 255, 0.25);
}

.plyr--video .plyr__progress--buffer {
  color: rgba(255, 255, 255, 0.25);
}

.plyr--audio .plyr__progress--buffer,
.plyr--audio .plyr__volume--display {
  background: rgba(198, 214, 219, 0.67);
}

.plyr--audio .plyr__progress--buffer {
  color: rgba(198, 214, 219, 0.67);
}

.plyr--loading .plyr__progress--buffer {
  -webkit-animation: plyr-progress 1s linear infinite;
          animation: plyr-progress 1s linear infinite;
  background-size: 25px 25px;
  background-repeat: repeat-x;
  background-image: linear-gradient(-45deg, rgba(0, 0, 0, 0.15) 25%, transparent 25%, transparent 50%, rgba(0, 0, 0, 0.15) 50%, rgba(0, 0, 0, 0.15) 75%, transparent 75%, transparent);
  color: transparent;
}

.plyr--video.plyr--loading .plyr__progress--buffer {
  background-color: rgba(255, 255, 255, 0.25);
}

.plyr--audio.plyr--loading .plyr__progress--buffer {
  background-color: rgba(198, 214, 219, 0.67);
}

.plyr__time {
  display: inline-block;
  vertical-align: middle;
  font-size: 14px;
}

.plyr__time + .plyr__time {
  display: none;
}

@media (min-width: 768px) {
  .plyr__time + .plyr__time {
    display: inline-block;
  }
}

.plyr__time + .plyr__time::before {
  content: "\2044";
  margin-right: 10px;
}

.plyr__volume {
  display: none;
}

.plyr .plyr__volume {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  position: relative;
}

.plyr .plyr__volume input[type="range"] {
  position: relative;
  z-index: 2;
}

@media (min-width: 480px) {
  .plyr .plyr__volume {
    display: block;
    max-width: 60px;
  }
}

@media (min-width: 768px) {
  .plyr .plyr__volume {
    max-width: 100px;
  }
}

.plyr--is-ios .plyr__volume,
.plyr--is-ios [data-plyr="mute"] {
  display: none !important;
}

.plyr--fullscreen-active {
  height: 100%;
  width: 100%;
  background: #000;
  border-radius: 0 !important;
}

.plyr--fullscreen-active video {
  height: 100%;
}

.plyr--fullscreen-active .plyr__video-wrapper {
  height: 100%;
  width: 100%;
}

.plyr--fullscreen-active .plyr__video-embed {
  overflow: visible;
}

.plyr--fullscreen-active.plyr--vimeo .plyr__video-wrapper {
  height: 0;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}

.plyr--fullscreen-fallback.plyr--fullscreen-active {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 10000000;
}

/*
================================================================================
SPINNERS
================================================================================
A Sass mixin to generate a pure CSS3 loading/busy indicator.
https://github.com/franzheidl/spinners
Franz Heidl 2014
MIT License
--------------------------------------------------------------------------------
USAGE

Default:

.my-spinner {
 @include spinner();
}


Custom:

.my-spinner {
 @include spinner(1.25em, 3px solid #555, .7s, background rgba(0, 0, 0, .2);
}

All arguments are optional.

Acceppts any valid CSS dimensional declaration, e.g px, em, rem as an argument for size.

Use either shorthand border declarations or individual 'border-[property] [value]' (no colon!) pairs for the style.

Pass any number of seconds referring to the duration of one full rotation for animation speed.

--------------------------------------------------------------------------------
*/
@-webkit-keyframes spinner-animation {
  0% {
    -webkit-transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
  }
}

@keyframes spinner-animation {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}

html {
  height: 100%;
  font-size: 16px;
  font-family: "Open Sans", "Helvetica Neue", Arial, sans-serif;
}

body {
  height: 100%;
}

[v-cloak] {
  display: none;
}

.page-wrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  min-height: 100%;
  position: relative;
}

* {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

input[type=text] {
  line-height: 1.4em;
  font-size: 1.125rem;
  padding: 10px;
  border: 1px solid #1f5376;
  color: #1f5376;
  border-radius: 10px;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
}

button.simple {
  width: 150px;
  font-weight: 600;
  color: white;
  border-radius: 10px;
  font-size: 1rem;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  border: none;
  background: #1f5376;
  height: 28px;
  cursor: pointer;
}

button.simple.green {
  color: #1f5376;
  background: #98d9ab;
}

button.simple.orange {
  background: #ffad00;
}

button.simple.free {
  width: auto;
}

.shadow-hover {
  -webkit-transition: -webkit-filter 0.3s;
  transition: -webkit-filter 0.3s;
  transition: filter 0.3s;
  transition: filter 0.3s, -webkit-filter 0.3s;
}

.shadow-hover:hover {
  -webkit-filter: drop-shadow(0px 0px 3px rgba(0, 0, 0, 0.7));
          filter: drop-shadow(0px 0px 3px rgba(0, 0, 0, 0.7));
}

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

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

.loading {
  overflow: hidden;
  position: absolute;
  background: rgba(255, 255, 255, 0.7);
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
}

.loading:after {
  content: "";
  background-color: transparent;
  border: 2px solid #1f5376;
  border-radius: 50%;
  border-top-color: transparent;
  border-right-color: transparent;
  width: 1em;
  height: 1em;
  display: inline-block;
  vertical-align: middle;
  -webkit-box-sizing: border-box;
  -o-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-animation: spinner-animation 0.65s infinite linear;
  animation: spinner-animation 0.65s infinite linear;
  position: absolute;
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}

.container {
  margin-right: auto;
  margin-left: auto;
}

.flex-height {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-flex: 1;
      -ms-flex: 1 1 auto;
          flex: 1 1 auto;
}

.center-both {
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.align-bottom {
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
}

.stretch {
  -webkit-box-flex: 1;
      -ms-flex: 1 1 auto;
          flex: 1 1 auto;
  position: relative;
}

.content-wrap {
  -webkit-box-flex: 1;
      -ms-flex: 1 0 auto;
          flex: 1 0 auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-flow: wrap;
      flex-flow: wrap;
  margin-top: 2.8125rem;
}

.content-wrap > * {
  -webkit-box-flex: 1;
      -ms-flex: 1 1 100%;
          flex: 1 1 100%;
}

.errors {
  color: #d31c23;
  list-style: none;
  padding: 0;
}

.heading {
  height: 150px;
  background: -webkit-gradient(linear, left top, left bottom, from(#1f5376), to(#98d9ab));
  background: linear-gradient(to bottom, #1f5376 0%, #98d9ab 100%);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.underline {
  text-decoration: underline;
}

.cursor {
  cursor: pointer;
}

.uppercase {
  text-transform: uppercase;
}

.liame::before {
  content: attr(data-website) "@" attr(data-user);
  direction: rtl;
  unicode-bidi: bidi-override;
}

.liame {
  unicode-bidi: bidi-override;
  display: inline-block;
  white-space: nowrap;
}

.body-container {
  padding: 2.8125rem;
}

.body-container a {
  color: inherit;
}

.container > h1 {
  margin: 0;
  font-size: 2rem;
  color: white;
  font-weight: 400;
}

.container > h2 {
  font-size: 1.125rem;
  font-weight: 600;
  margin-bottom: 0.625rem;
  margin-top: 2.8125rem;
}

.container > p {
  margin: 0;
  font-size: 1rem;
  line-height: 1.4;
  font-weight: 400;
}

.container > p .title {
  font-size: 1.125rem;
  font-weight: 600;
}

.container > p.space-after {
  margin-bottom: 1em;
}

.container .inline-table {
  display: table;
}

.container .inline-table .cell {
  display: table-cell;
}

.container table {
  border-collapse: collapse;
  width: 100%;
}

.container table td, .container table th {
  border: 1px solid #e5e5e5;
  font-weight: 400;
  padding: 15px;
  text-align: left;
}

.container table th {
  font-weight: 600;
}

.container table th, .container table tr:nth-child(2) td, .container table tr:nth-child(4) td {
  background: #f5f5f5;
}

.space-before {
  margin-top: 10px;
}

.space-before li {
  line-height: 1.4em;
}

.cookies-wrap {
  position: fixed;
  z-index: 100;
  background: rgba(0, 0, 0, 0.8);
  font-size: 13px;
  color: white;
  left: 0;
  right: 0;
  text-align: left;
  bottom: 0;
}

.cookies-wrap .container {
  position: relative;
  padding: 10px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.cookies-wrap .container > *:not(:first-child) {
  margin-left: 20px;
}

@media (max-width: 768px) {
  .cookies-wrap .container {
    display: block;
  }
}

.cookies-wrap p {
  color: white;
  max-width: 700px;
  font-size: 14px;
  margin-bottom: 0;
}

@media (max-width: 768px) {
  .cookies-wrap p {
    text-align: center;
    margin: 10px auto;
  }
}

.cookies-wrap a {
  color: inherit;
}

@media (max-width: 768px) {
  .cookies-wrap img {
    margin: auto;
    display: block;
  }
}

.cookies-wrap span {
  text-decoration: underline;
  cursor: pointer;
}

.cookies-wrap .no-wrap {
  white-space: nowrap;
}

.cookies-wrap .cookie-checkboxes {
  height: 90px;
  -webkit-animation: grow 0.3s ease-out;
          animation: grow 0.3s ease-out;
  display: block;
}

.cookies-wrap .cookie-checkboxes div {
  font-size: 13px;
  margin-left: 20px;
  padding: 5px;
}

.cookies-wrap .cookie-checkboxes div .grayed-out {
  color: #b5b5b5 !important;
}

@media (max-width: 768px) {
  .cookies-wrap .cookie-checkboxes {
    -webkit-animation: growHigher 0.3s ease-out;
            animation: growHigher 0.3s ease-out;
    height: 130px;
  }
}

@-webkit-keyframes grow {
  0% {
    height: 0px;
  }
  100% {
    height: 90px;
  }
}

@keyframes grow {
  0% {
    height: 0px;
  }
  100% {
    height: 90px;
  }
}

@-webkit-keyframes growHigher {
  0% {
    height: 0px;
  }
  100% {
    height: 130px;
  }
}

@keyframes growHigher {
  0% {
    height: 0px;
  }
  100% {
    height: 130px;
  }
}

.index-improve, .index-presentation, .index-practice {
  padding: 5.3125rem 0;
}

.index-improve h2, .index-presentation h2, .index-practice h2 {
  text-align: center;
  font-size: 2.125rem;
  margin: 0;
  font-weight: 400;
}

.zzv-banner {
  position: relative;
  padding-bottom: 60px;
}

.zzv-banner .xl-banner {
  width: 100%;
}

@media (max-width: 1279px) {
  .zzv-banner .xl-banner {
    display: none;
  }
}

@media (max-width: 1023px) {
  .zzv-banner .xl-banner {
    display: none;
  }
}

@media (max-width: 768px) {
  .zzv-banner .xl-banner {
    display: none;
  }
}

.zzv-banner .lg-banner {
  display: none;
}

@media (max-width: 1279px) {
  .zzv-banner .lg-banner {
    display: block;
    width: 100%;
  }
}

@media (max-width: 1023px) {
  .zzv-banner .lg-banner {
    display: block;
  }
}

@media (max-width: 768px) {
  .zzv-banner .lg-banner {
    display: none;
  }
}

.zzv-banner .sm-banner {
  display: none;
}

@media (max-width: 768px) {
  .zzv-banner .sm-banner {
    display: block;
    width: 100%;
  }
}

.zzv-banner .buy {
  position: absolute;
  color: white;
  bottom: 0;
  left: 50%;
  -webkit-transform: translate(-50%, 50%);
          transform: translate(-50%, 50%);
  background: #1f5376;
  border-radius: 43px;
  font-weight: 700;
  font-size: 1.5em;
  padding: 1em 1.3em;
  -webkit-transition: background 0.3s;
  transition: background 0.3s;
}

@media (max-width: 768px) {
  .zzv-banner .buy {
    font-size: 1.2em;
  }
}

.zzv-banner .buy:hover {
  background: #14374e;
}

.index-improve h2 {
  text-align: center;
  font-size: 2.125rem;
  margin: 0;
  font-weight: 400;
}

.index-improve .figure-wrap .improve-item {
  text-align: center;
  margin: 0;
  margin-top: 5.3125rem;
}

.index-improve .figure-wrap .improve-item a {
  text-decoration: none;
}

.index-improve .figure-wrap .improve-item .figure-icon {
  margin-bottom: 1.125rem;
}

.index-improve .figure-wrap .improve-item figcaption {
  text-align: center;
  font-size: 1rem;
  line-height: 1.3em;
  color: #333333;
}

.index-improve .figure-wrap .improve-item.first .figure-icon {
  height: 2.25rem;
  width: 2.3125rem;
  display: inline-block;
  background: url(/images/icons.svg) no-repeat -150px -0px;
}

.index-improve .figure-wrap .improve-item.second .figure-icon {
  height: 2.3125rem;
  width: 1.9375rem;
  display: inline-block;
  background: url(/images/icons.svg) no-repeat -196px -0px;
}

.index-improve .figure-wrap .improve-item.third .figure-icon {
  height: 2.1875rem;
  width: 2.1875rem;
  display: inline-block;
  background: url(/images/icons.svg) no-repeat -240px -0px;
}

.index-improve .figure-wrap .improve-item.fourth .figure-icon {
  height: 2.3125rem;
  width: 2.375rem;
  display: inline-block;
  background: url(/images/icons.svg) no-repeat -284px -0px;
}

.index-improve .figure-wrap .improve-item.fifth .figure-icon {
  height: 2.125rem;
  width: 2.3125rem;
  display: inline-block;
  background: url(/images/icons.svg) no-repeat -330px -0px;
}

.index-improve .figure-wrap .improve-item.sixth .figure-icon {
  height: 2.3125rem;
  width: 2.25rem;
  display: inline-block;
  background: url(/images/icons.svg) no-repeat -375px -0px;
}

.index-presentation {
  background: linear-gradient(45deg, #1f5376 0%, #98d9ab 100%);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding-top: 4.0625rem;
  padding-bottom: 8.4375rem;
}

.index-presentation h2 {
  color: white;
  margin-bottom: 4.0625rem;
}

.index-presentation .presentation-group {
  width: 780px;
  position: relative;
  margin: 0 auto;
  z-index: 1;
}

.index-presentation .presentation-group img {
  width: 100%;
  position: relative;
  z-index: 1;
  pointer-events: none;
}

.index-presentation .presentation-group p {
  margin: 0;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  font-size: 34px;
  color: #b5b5b5;
  text-align: center;
  width: 100%;
}

.index-presentation .presentation-group .presentation-iframe {
  position: absolute;
  top: 26px;
  left: 26px;
  bottom: 26px;
  right: 26px;
  background: white;
  z-index: 0;
  overflow: hidden;
}

.index-presentation .presentation-group .presentation-iframe iframe {
  -webkit-transform: scale(0.7, 0.7);
          transform: scale(0.7, 0.7);
  -webkit-transform-origin: 0 0;
          transform-origin: 0 0;
  width: 1040px;
  height: 658px;
  position: absolute;
  overflow-y: scroll;
  overflow-x: hidden;
}

.index-practice {
  min-height: 540px;
  background: url("/images/practice-back.jpg") no-repeat;
  background-position: center bottom;
  background-size: cover;
  padding-top: 6.875rem;
}

.index-practice h2 {
  color: #474747;
}

.index-practice .circle-wrap {
  margin-top: 3.75rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.index-practice .blue-circle {
  margin: 0;
  text-align: center;
  color: #333333;
  font-size: 1.125rem;
  line-height: 1.33em;
  padding: 8px;
  border-radius: 50%;
  width: 13.375rem;
  height: 13.375rem;
  position: relative;
  background: #7683ff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.index-practice .blue-circle:after {
  content: "";
  border: 4px solid #7683ff;
  position: absolute;
  top: -12px;
  left: -12px;
  bottom: -12px;
  right: -12px;
  border-radius: 50%;
}

.index-practice .pink-circle {
  margin: 0;
  text-align: center;
  color: #333333;
  font-size: 1.125rem;
  line-height: 1.33em;
  padding: 8px;
  border-radius: 50%;
  width: 13.375rem;
  height: 13.375rem;
  position: relative;
  background: #e877b9;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.index-practice .pink-circle:after {
  content: "";
  border: 4px solid #e877b9;
  position: absolute;
  top: -12px;
  left: -12px;
  bottom: -12px;
  right: -12px;
  border-radius: 50%;
}

.index-practice .orange-circle {
  margin: 0;
  text-align: center;
  color: #333333;
  font-size: 1.125rem;
  line-height: 1.33em;
  padding: 8px;
  border-radius: 50%;
  width: 13.375rem;
  height: 13.375rem;
  position: relative;
  background: #ffc076;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.index-practice .orange-circle:after {
  content: "";
  border: 4px solid #ffc076;
  position: absolute;
  top: -12px;
  left: -12px;
  bottom: -12px;
  right: -12px;
  border-radius: 50%;
}

.index-practice .green-circle {
  margin: 0;
  text-align: center;
  color: #333333;
  font-size: 1.125rem;
  line-height: 1.33em;
  padding: 8px;
  border-radius: 50%;
  width: 13.375rem;
  height: 13.375rem;
  position: relative;
  background: #d6e877;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.index-practice .green-circle:after {
  content: "";
  border: 4px solid #d6e877;
  position: absolute;
  top: -12px;
  left: -12px;
  bottom: -12px;
  right: -12px;
  border-radius: 50%;
}

.header {
  background: #1f5376;
  width: 100%;
  color: white;
  position: fixed;
  z-index: 100;
}

.header a {
  text-decoration: none;
}

.header .nav-group {
  padding: 0 2.8125rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.header .nav-left, .header .nav-right {
  height: 2.8125rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.header .nav-left {
  -webkit-box-flex: 1;
      -ms-flex: 1 1 100%;
          flex: 1 1 100%;
}

@media (max-width: 768px) {
  .header .nav-left .nav-md-up {
    display: none;
  }
}

.header .nav-left .nav-sm-only.icon-menu-container {
  display: none;
}

@media (max-width: 768px) {
  .header .nav-left .nav-sm-only.icon-menu-container {
    display: block;
    position: static;
    margin-right: 20px;
  }
}

.header .nav-left .nav-sm-only.icon-menu-container .dropdown-main {
  outline: none;
}

.header .nav-left .nav-sm-only.icon-menu-container .dropdown-main.active .dropdown-list {
  display: block;
}

.header .nav-left .nav-sm-only.icon-menu-container .dropdown-main .dropdown-list {
  display: none;
  top: 40px;
  position: absolute;
  background-color: rgba(255, 255, 255, 0.9);
  left: 0px;
  padding-top: 18px;
  padding-bottom: 18px;
  border-radius: 18px;
  -webkit-box-shadow: 5px 5px 10px 0px rgba(0, 0, 0, 0.3);
          box-shadow: 5px 5px 10px 0px rgba(0, 0, 0, 0.3);
}

.header .nav-left .nav-sm-only.icon-menu-container .dropdown-main .dropdown-list .dropdown-item {
  padding: 6px 20px;
  display: block;
}

.header .nav-left .nav-sm-only.icon-menu-container .dropdown-main .dropdown-list a {
  color: #225475;
  line-height: 20px;
}

.header .nav-left .nav-sm-only.icon-menu-container .dropdown-main .dropdown-list a:hover {
  background: #225475;
  color: white;
}

.header .nav-right {
  -webkit-box-flex: 1;
      -ms-flex: 1 1 auto;
          flex: 1 1 auto;
  white-space: nowrap;
}

.header .nav-right .nav-item {
  padding: 0.375rem;
}

.header .nav-right .dropdown {
  position: relative;
  outline: none;
}

.header .nav-right .dropdown.active .dropdown-list {
  display: block;
}

.header .nav-right .dropdown .dropdown-arrow {
  display: inline-block;
  width: 0;
  height: 0;
  margin-left: 5px;
  border-left: 7px solid transparent;
  border-right: 7px solid transparent;
  border-top: 10px solid #fff;
  cursor: default;
}

.header .nav-right .dropdown .upwardsArrow {
  border-top: none;
  border-bottom: 10px solid #fff;
}

.header .nav-right .dropdown .dropdown-button {
  color: white;
  position: relative;
  z-index: 1;
  border: none;
  background: none;
  cursor: pointer;
}

.header .nav-right .dropdown .dropdown-list {
  display: none;
  top: 40px;
  position: absolute;
  background-color: rgba(255, 255, 255, 0.9);
  right: 0px;
  padding-top: 18px;
  padding-bottom: 18px;
  border-radius: 18px;
  -webkit-box-shadow: 5px 5px 10px 0px rgba(0, 0, 0, 0.3);
          box-shadow: 5px 5px 10px 0px rgba(0, 0, 0, 0.3);
}

.header .nav-right .dropdown .dropdown-list .dropdown-item {
  padding: 6px 20px;
  display: block;
}

.header .nav-right .dropdown .dropdown-list a {
  color: #225475;
  line-height: 20px;
}

.header .nav-right .dropdown .dropdown-list a:hover {
  background: #225475;
  color: white;
}

.header .nav-right .dropdown .dropdown-list a:hover .q-mark {
  border-color: white;
}

.header .nav-right .dropdown .q-mark {
  display: inline-block;
  width: 23px;
  height: 23px;
  border-radius: 50%;
  border: 2px solid #225475;
  line-height: 19px;
  vertical-align: middle;
  text-align: center;
  margin-left: 10px;
  cursor: pointer;
  position: relative;
  overflow: initial;
}

.header .nav-right .dropdown .q-mark.active .q-mark-popup {
  display: block;
}

.header .nav-right .dropdown .q-mark .q-mark-popup {
  color: #225475 !important;
  display: none;
  position: absolute;
  background: white;
  border: 1px solid #225475;
  border-radius: 9px;
  right: -10px;
  z-index: 10;
  -webkit-box-shadow: 5px 5px 10px 0px rgba(0, 0, 0, 0.3);
          box-shadow: 5px 5px 10px 0px rgba(0, 0, 0, 0.3);
  width: 180px;
  white-space: normal;
  line-height: 25px;
  top: 30px;
  text-align: left;
  padding: 10px;
}

.header .nav-right .dropdown .q-mark .q-mark-popup:after, .header .nav-right .dropdown .q-mark .q-mark-popup:before {
  bottom: 100%;
  right: 12px;
  border: solid transparent;
  content: "";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
}

.header .nav-right .dropdown .q-mark .q-mark-popup:after {
  border-bottom-color: white;
  border-width: 6px;
}

.header .nav-right .dropdown .q-mark .q-mark-popup:before {
  border-bottom-color: #225475;
  border-width: 8px;
  right: 10px;
}

.header .nav-item {
  color: white;
  font-size: 1rem;
  padding: 1.125rem;
  padding-bottom: 0;
  padding-top: 0;
  color: white;
  white-space: nowrap;
  position: relative;
}

.header .nav-item.nav-collection {
  color: #1f5376;
  z-index: 1;
}

.header .nav-item.nav-collection:before {
  content: "";
  position: absolute;
  left: 0px;
  top: -6px;
  right: 0px;
  bottom: -6px;
  background: #ffdd00;
  border-radius: 18px;
  z-index: -1;
}

.header .nav-item.active {
  color: #1f5376;
  z-index: 1;
}

.header .nav-item.active:before {
  content: "";
  position: absolute;
  left: 0px;
  top: -6px;
  right: 0px;
  bottom: -6px;
  background: white;
  border-radius: 18px;
  z-index: -1;
}

.header .nav-item.active .home-icon {
  height: 1.125rem;
  width: 1.125rem;
  display: inline-block;
  background: url(/images/icons.svg) no-repeat -0px -20px;
}

.header .nav-item .home-icon {
  height: 1.125rem;
  width: 1.125rem;
  display: inline-block;
  background: url(/images/icons.svg) no-repeat -0px -0px;
}

.footer {
  background: #262626;
  color: #666666;
}

@media (max-width: 768px) {
  .footer {
    height: 350px;
  }
}

.footer a {
  text-decoration: none;
  color: inherit;
}

.footer .nav-group {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding: 0 2.8125rem;
}

.footer .nav-left, .footer .nav-right {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  height: 122px;
}

@media (max-width: 768px) {
  .footer .nav-left, .footer .nav-right {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
}

.footer .nav-left {
  -webkit-box-flex: 1;
      -ms-flex: 1 1 100%;
          flex: 1 1 100%;
}

.footer .nav-right {
  -webkit-box-flex: 1;
      -ms-flex: 1 1 auto;
          flex: 1 1 auto;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 5.375rem;
          flex: 0 0 5.375rem;
}

.footer .nav-item {
  font-size: 0.875rem;
  padding: 0.8125rem;
}

.footer .nav-item .bulb-icon {
  height: 1.25rem;
  width: 0.875rem;
  display: inline-block;
  background: url(/images/icons.svg) no-repeat -26px -0px;
}

.footer .nav-item .logo-icon {
  height: 2.6875rem;
  width: 5.375rem;
  display: inline-block;
  background: url(/images/icons.svg) no-repeat -50px -0px;
}

@media (max-width: 768px) {
  .footer .hide-sm {
    display: none;
  }
}

.footer .hide-md-up {
  display: none;
}

@media (max-width: 768px) {
  .footer .hide-md-up {
    display: block;
  }
}

.presentation {
  background: linear-gradient(45deg, #c8e5cd 0%, #90a9b2 50%, #7f96a9 100%);
  min-height: 100%;
  overflow: hidden;
}

.presentation .intro {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: relative;
  margin-bottom: 4.0625rem;
}

@media (max-width: 768px) {
  .presentation .intro {
    display: block;
  }
}

.presentation .intro .text-block {
  padding-left: 85px;
  width: 70%;
}

@media (max-width: 768px) {
  .presentation .intro .text-block {
    padding-left: 30px;
    padding-right: 30px;
    width: 100%;
  }
}

.presentation .intro .text-block .bulb-wrap {
  position: relative;
  margin-top: 2.8125rem;
  display: inline-block;
}

.presentation .intro .text-block .bulb-wrap h2 {
  margin: 0;
  margin-top: 2.1875rem;
  margin-left: 9.375rem;
  margin-bottom: 2.1875rem;
  font-size: 2rem;
  line-height: 1.3em;
  font-weight: 400;
  z-index: 10;
  position: relative;
}

@media (max-width: 768px) {
  .presentation .intro .text-block .bulb-wrap h2 {
    margin-top: 200px;
    margin-left: 0;
  }
}

.presentation .intro .text-block .bulb-wrap img {
  position: absolute;
  top: -550px;
  left: -1040px;
  pointer-events: none;
}

.presentation .intro .text-block .text-wrap {
  font-size: 1rem;
  line-height: 1.5em;
  z-index: 10;
  position: relative;
}

.presentation .intro .text-block .text-wrap p {
  margin-bottom: 25px;
}

.presentation .intro .text-block .text-wrap p .novo {
  color: #fedc32;
}

.presentation .intro .image-block {
  width: 30%;
}

@media (max-width: 768px) {
  .presentation .intro .image-block {
    width: 100%;
    margin-top: 100px;
  }
}

.presentation .intro .image-block .image-wrap {
  border-radius: 50%;
  overflow: hidden;
  position: relative;
  top: -60px;
  width: 575px;
}

.presentation .intro .image-block .image-wrap:after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  border: 13px solid #98d9ab;
  border-radius: 50%;
}

@media (max-width: 768px) {
  .presentation .intro .image-block .image-wrap {
    width: 80%;
    max-width: 500px;
    margin: auto;
  }
}

.presentation .intro .image-block .image {
  padding-bottom: 100%;
  position: relative;
  height: 0;
}

.presentation .intro .image-block img {
  width: 100%;
  position: absolute;
  left: 0;
  top: 58px;
}

@media (max-width: 768px) {
  .presentation .intro .image-block img {
    top: 0px;
    width: 111%;
  }
}

.presentation .browser-wrap {
  margin-bottom: 4.0625rem;
}

.presentation .browser .grouping {
  width: 816px;
  margin: 0 auto;
  padding: 0 56px;
  height: 58px;
  margin-bottom: 30px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: relative;
}

@media (max-width: 1023px) {
  .presentation .browser .grouping {
    width: auto;
  }
}

.presentation .browser .grouping .text {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 auto;
          flex: 0 0 auto;
  padding: 0 22px;
  font-size: 1.4375rem;
  text-transform: uppercase;
  color: white;
  position: relative;
  top: -12px;
}

.presentation .browser .grouping .left-line {
  -webkit-box-flex: 1;
      -ms-flex: 1 1 100%;
          flex: 1 1 100%;
  border-top: 2px solid white;
  position: relative;
  border-left: 2px solid white;
  border-top-left-radius: 16px;
}

.presentation .browser .grouping .left-line:after {
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: white;
  position: absolute;
  bottom: -4px;
  left: -5px;
}

.presentation .browser .grouping .right-line {
  -webkit-box-flex: 1;
      -ms-flex: 1 1 100%;
          flex: 1 1 100%;
  border-top: 2px solid white;
  position: relative;
  border-right: 2px solid white;
  border-top-right-radius: 16px;
}

.presentation .browser .grouping .right-line:after {
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: white;
  position: absolute;
  bottom: -4px;
  right: -5px;
}

.presentation .browser .button-group {
  width: 816px;
  margin: 0 auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  margin-bottom: 4.0625rem;
}

@media (max-width: 1023px) {
  .presentation .browser .button-group {
    width: auto;
  }
}

@media (max-width: 768px) {
  .presentation .browser .button-group {
    display: block;
    text-align: center;
    margin-bottom: 20px;
  }
}

.presentation .browser .button-group .dark-green-button {
  background: #007741;
  width: 116px;
  height: 116px;
  border: 4px solid white;
  border-radius: 50%;
  font-size: 1.125rem;
  color: white;
  text-align: center;
  cursor: pointer;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-transition: border-color 0.3s;
  transition: border-color 0.3s;
  position: relative;
}

@media (max-width: 1023px) {
  .presentation .browser .button-group .dark-green-button {
    width: 100px;
    height: 100px;
  }
}

@media (max-width: 768px) {
  .presentation .browser .button-group .dark-green-button {
    display: inline-block;
    margin-bottom: 50px;
    padding-top: 16px;
  }
}

.presentation .browser .button-group .dark-green-button strong {
  font-size: 2rem;
}

.presentation .browser .button-group .dark-green-button:after {
  content: "";
  background: tranparent;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  position: absolute;
  -webkit-transition: background 0.3s;
  transition: background 0.3s;
  bottom: -44px;
  left: 42px;
}

.presentation .browser .button-group .dark-green-button.active {
  border: 4px solid #007741;
}

.presentation .browser .button-group .dark-green-button.active:after {
  background: #007741;
}

.presentation .browser .button-group .red-button {
  background: #d92452;
  width: 116px;
  height: 116px;
  border: 4px solid white;
  border-radius: 50%;
  font-size: 1.125rem;
  color: white;
  text-align: center;
  cursor: pointer;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-transition: border-color 0.3s;
  transition: border-color 0.3s;
  position: relative;
}

@media (max-width: 1023px) {
  .presentation .browser .button-group .red-button {
    width: 100px;
    height: 100px;
  }
}

@media (max-width: 768px) {
  .presentation .browser .button-group .red-button {
    display: inline-block;
    margin-bottom: 50px;
    padding-top: 16px;
  }
}

.presentation .browser .button-group .red-button strong {
  font-size: 2rem;
}

.presentation .browser .button-group .red-button:after {
  content: "";
  background: tranparent;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  position: absolute;
  -webkit-transition: background 0.3s;
  transition: background 0.3s;
  bottom: -44px;
  left: 42px;
}

.presentation .browser .button-group .red-button.active {
  border: 4px solid #d92452;
}

.presentation .browser .button-group .red-button.active:after {
  background: #d92452;
}

.presentation .browser .button-group .blue-button {
  background: #324481;
  width: 116px;
  height: 116px;
  border: 4px solid white;
  border-radius: 50%;
  font-size: 1.125rem;
  color: white;
  text-align: center;
  cursor: pointer;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-transition: border-color 0.3s;
  transition: border-color 0.3s;
  position: relative;
}

@media (max-width: 1023px) {
  .presentation .browser .button-group .blue-button {
    width: 100px;
    height: 100px;
  }
}

@media (max-width: 768px) {
  .presentation .browser .button-group .blue-button {
    display: inline-block;
    margin-bottom: 50px;
    padding-top: 16px;
  }
}

.presentation .browser .button-group .blue-button strong {
  font-size: 2rem;
}

.presentation .browser .button-group .blue-button:after {
  content: "";
  background: tranparent;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  position: absolute;
  -webkit-transition: background 0.3s;
  transition: background 0.3s;
  bottom: -44px;
  left: 42px;
}

.presentation .browser .button-group .blue-button.active {
  border: 4px solid #324481;
}

.presentation .browser .button-group .blue-button.active:after {
  background: #324481;
}

.presentation .browser .button-group .light-green-button {
  background: #7ab74b;
  width: 116px;
  height: 116px;
  border: 4px solid white;
  border-radius: 50%;
  font-size: 1.125rem;
  color: white;
  text-align: center;
  cursor: pointer;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-transition: border-color 0.3s;
  transition: border-color 0.3s;
  position: relative;
}

@media (max-width: 1023px) {
  .presentation .browser .button-group .light-green-button {
    width: 100px;
    height: 100px;
  }
}

@media (max-width: 768px) {
  .presentation .browser .button-group .light-green-button {
    display: inline-block;
    margin-bottom: 50px;
    padding-top: 16px;
  }
}

.presentation .browser .button-group .light-green-button strong {
  font-size: 2rem;
}

.presentation .browser .button-group .light-green-button:after {
  content: "";
  background: tranparent;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  position: absolute;
  -webkit-transition: background 0.3s;
  transition: background 0.3s;
  bottom: -44px;
  left: 42px;
}

.presentation .browser .button-group .light-green-button.active {
  border: 4px solid #7ab74b;
}

.presentation .browser .button-group .light-green-button.active:after {
  background: #7ab74b;
}

.presentation .browser .button-group .orange-green-button {
  background: #f08030;
  width: 116px;
  height: 116px;
  border: 4px solid white;
  border-radius: 50%;
  font-size: 1.125rem;
  color: white;
  text-align: center;
  cursor: pointer;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-transition: border-color 0.3s;
  transition: border-color 0.3s;
  position: relative;
}

@media (max-width: 1023px) {
  .presentation .browser .button-group .orange-green-button {
    width: 100px;
    height: 100px;
  }
}

@media (max-width: 768px) {
  .presentation .browser .button-group .orange-green-button {
    display: inline-block;
    margin-bottom: 50px;
    padding-top: 16px;
  }
}

.presentation .browser .button-group .orange-green-button strong {
  font-size: 2rem;
}

.presentation .browser .button-group .orange-green-button:after {
  content: "";
  background: tranparent;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  position: absolute;
  -webkit-transition: background 0.3s;
  transition: background 0.3s;
  bottom: -44px;
  left: 42px;
}

.presentation .browser .button-group .orange-green-button.active {
  border: 4px solid #f08030;
}

.presentation .browser .button-group .orange-green-button.active:after {
  background: #f08030;
}

.presentation .browser .button-group .cyan-green-button {
  background: #29b4b6;
  width: 116px;
  height: 116px;
  border: 4px solid white;
  border-radius: 50%;
  font-size: 1.125rem;
  color: white;
  text-align: center;
  cursor: pointer;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-transition: border-color 0.3s;
  transition: border-color 0.3s;
  position: relative;
}

@media (max-width: 1023px) {
  .presentation .browser .button-group .cyan-green-button {
    width: 100px;
    height: 100px;
  }
}

@media (max-width: 768px) {
  .presentation .browser .button-group .cyan-green-button {
    display: inline-block;
    margin-bottom: 50px;
    padding-top: 16px;
  }
}

.presentation .browser .button-group .cyan-green-button strong {
  font-size: 2rem;
}

.presentation .browser .button-group .cyan-green-button:after {
  content: "";
  background: tranparent;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  position: absolute;
  -webkit-transition: background 0.3s;
  transition: background 0.3s;
  bottom: -44px;
  left: 42px;
}

.presentation .browser .button-group .cyan-green-button.active {
  border: 4px solid #29b4b6;
}

.presentation .browser .button-group .cyan-green-button.active:after {
  background: #29b4b6;
}

.presentation .browser .display-group {
  background: rgba(255, 255, 255, 0.65);
  min-height: 390px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding: 40px;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.presentation .browser .display-group .display-item-wrap {
  width: 175px;
  margin: 0 17px 65px;
}

.presentation .browser .display-group .display-item {
  text-align: center;
  line-height: 1.2;
  margin: 0;
}

.presentation .browser .display-group .display-item .cover {
  -webkit-box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.3);
          box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.3);
}

.presentation .browser .display-group .display-item .cover img {
  display: block;
  width: 100%;
  height: auto;
}

.presentation .browser .display-group .display-item figcaption {
  height: 4em;
}

.presentation .browser .display-group .display-item h1 {
  font-weight: 600;
  font-size: 0.875rem;
  margin: 0;
  margin-top: 10px;
  margin-bottom: 5px;
}

.presentation .browser .display-group .display-item p {
  font-size: 0.875rem;
  margin: 0;
  margin-bottom: 10px;
}

.presentation .browser .display-group .display-item .simple:not(:last-child) {
  margin-bottom: 10px;
}

.presentation .browser .display-group .display-item .cart {
  width: 14px;
  margin-left: 5px;
}

.presentation .browser .display-group .display-item button {
  font-size: 15px;
  width: 191px;
  margin-left: -8px;
  line-height: 18px;
}

.audio {
  background: linear-gradient(45deg, #c8e5cd 0%, #90a9b2 50%, #7f96a9 100%);
  min-height: 100%;
  overflow: hidden;
}

.audio .container {
  position: relative;
}

.audio .intro {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: relative;
  margin-bottom: 4.0625rem;
}

@media (max-width: 768px) {
  .audio .intro {
    display: block;
  }
}

.audio .intro .text-block {
  padding-left: 85px;
  width: 70%;
}

@media (max-width: 768px) {
  .audio .intro .text-block {
    padding-left: 10%;
  }
}

.audio .intro .text-block .bulb-wrap {
  position: relative;
  margin-top: 2.8125rem;
  display: inline-block;
}

.audio .intro .text-block .bulb-wrap h2 {
  margin: 0;
  margin-top: 2.1875rem;
  margin-left: 9.375rem;
  margin-bottom: 2.1875rem;
  font-size: 2rem;
  line-height: 1.3em;
  font-weight: 400;
  color: white;
}

@media (max-width: 768px) {
  .audio .intro .text-block .bulb-wrap h2 {
    margin-top: 200px;
    margin-left: 0;
  }
}

.audio .intro .text-block .bulb-wrap img {
  position: absolute;
  top: -550px;
  left: -1040px;
  pointer-events: none;
}

.audio .intro .image-block {
  width: 30%;
}

@media (max-width: 768px) {
  .audio .intro .image-block {
    width: 100%;
    margin-top: 100px;
  }
}

.audio .intro .image-block .image-wrap {
  border-radius: 50%;
  overflow: hidden;
  position: relative;
  top: -60px;
  width: 575px;
}

.audio .intro .image-block .image-wrap:after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  border: 13px solid #1f5376;
  border-radius: 50%;
}

@media (max-width: 768px) {
  .audio .intro .image-block .image-wrap {
    width: 80%;
    max-width: 500px;
    margin: auto;
  }
}

.audio .intro .image-block .image {
  padding-bottom: 100%;
  position: relative;
  height: 0;
}

.audio .intro .image-block img {
  width: 100%;
  position: absolute;
  left: 0;
  top: 58px;
}

@media (max-width: 768px) {
  .audio .intro .image-block img {
    top: 0px;
    width: 111%;
  }
}

.audio .intro .audio-library {
  margin-left: 9.375rem;
}

@media (max-width: 1279px) {
  .audio .intro .audio-library {
    margin-left: 7.8125rem;
  }
}

@media (max-width: 768px) {
  .audio .intro .audio-library {
    margin-left: 0;
  }
}

.audio .intro .audio-library .library-item {
  margin: 0;
  width: 285px;
  height: 62px;
  border-radius: 30px;
  border: 1px solid #1f5376;
  color: #1f5376;
  font-size: 1.125rem;
  background: #98d9ab;
  padding: 0 25px;
  margin-bottom: 18px;
  cursor: pointer;
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-transition: color 0.3s, background 0.3s, width 0.3s;
  transition: color 0.3s, background 0.3s, width 0.3s;
}

.audio .intro .audio-library .library-item .library-item-icon {
  height: 1.5625rem;
  width: 1.5625rem;
  display: inline-block;
  background: url(/images/icons.svg) no-repeat -0px -40px;
  position: absolute;
  top: 50%;
  left: 235px;
  -webkit-transform: translate(0, -50%);
          transform: translate(0, -50%);
}

@media (max-width: 1279px) {
  .audio .intro .audio-library .library-item .library-item-icon {
    left: 205px;
  }
}

.audio .intro .audio-library .library-item:hover, .audio .intro .audio-library .library-item.active {
  background: #1f5376;
  color: white;
}

.audio .intro .audio-library .library-item.active {
  width: 355px;
}

@media (max-width: 1279px) {
  .audio .intro .audio-library .library-item {
    width: 255px;
  }
}

.audio .audio-items-block {
  width: 100%;
  position: relative;
  -webkit-box-flex: 1;
      -ms-flex: 1 1 100%;
          flex: 1 1 100%;
}

.audio .audio-items-block .audio-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  margin: 0 -0.75rem;
  height: 100%;
  -ms-flex-line-pack: start;
      align-content: flex-start;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  padding-bottom: 2.5rem;
}

.audio .audio-items-block .audio-list .audio-item {
  width: 58px;
  height: 58px;
  border-radius: 50%;
  background: #98d9ab;
  -webkit-transition: background 0.3s, color 0.3s;
  transition: background 0.3s, color 0.3s;
  color: #1f5376;
  margin: 0 0.75rem 1.875rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  font-size: 1.125rem;
  font-weight: 600;
  border: 1px solid #1f5376;
  cursor: pointer;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 auto;
          flex: 0 0 auto;
}

.audio .audio-items-block .audio-list .audio-item.active, .audio .audio-items-block .audio-list .audio-item:hover {
  background: white;
}

@media (max-width: 1279px) {
  .audio .audio-items-block .audio-list .audio-item {
    margin: 0.9375rem 0.4375rem;
  }
}

.audio .audio-player-block {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin: 0 1.25rem;
  min-height: 52px;
}

.audio .audio-player-block .audio-player-wrap {
  width: 520px;
}

.audio .audio-player-block .plyr {
  border-radius: 5px;
}

.audio .audio-block {
  position: absolute;
  top: 170px;
  left: 560px;
  background: #1f5376;
  border-radius: 30px;
  height: 435px;
  width: 525px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  padding: 2.5rem 1.25rem;
}

@media (max-width: 1279px) {
  .audio .audio-block {
    left: 485px;
    width: 495px;
  }
}

.modal-wrap {
  position: fixed;
  z-index: 100;
  background: rgba(255, 255, 255, 0.75);
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}

.modal-wrap .modal {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  width: 500px;
  border-radius: 17px;
  border: 9px solid #98d9ab;
  min-height: 200px;
  -webkit-box-shadow: 5px 5px 20px rgba(0, 0, 0, 0.3);
          box-shadow: 5px 5px 20px rgba(0, 0, 0, 0.3);
  padding: 40px 60px;
  color: #1f5376;
  line-height: 1.3em;
  background: white;
}

.modal-wrap .modal .modal-close {
  height: 2.375rem;
  width: 2.375rem;
  display: inline-block;
  background: url(/images/icons.svg) no-repeat -0px -65px;
  position: absolute;
  top: -23px;
  right: -23px;
  cursor: pointer;
  z-index: 100;
}

.modal-wrap .modal h1 {
  font-size: 1.25rem;
  font-weight: 400;
}

.modal-wrap .modal p {
  font-size: 1rem;
  margin: 30px 0 0;
}

.modal-wrap .modal input[type=text] {
  margin: 0 -10px;
  width: 100%;
  -webkit-box-sizing: content-box;
          box-sizing: content-box;
}

.modal-wrap .modal .button-wrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin-top: 50px;
}

.modal-wrap .modal .button-wrap button:not(:last-child) {
  margin-right: 1.5625rem;
}

.fade-enter-active, .fade-leave-active {
  -webkit-transition: opacity 0.3s;
  transition: opacity 0.3s;
}

.fade-enter, .fade-leave-to {
  opacity: 0;
}

.slide-enter-active, .slide-leave-active {
  -webkit-transition: opacity 0.5s;
  transition: opacity 0.5s;
}

.slide-enter-active .cookies, .slide-leave-active .cookies {
  -webkit-transition: -webkit-transform 0.5s;
  transition: -webkit-transform 0.5s;
  transition: transform 0.5s;
  transition: transform 0.5s, -webkit-transform 0.5s;
  -webkit-transform: translate(0, 0);
          transform: translate(0, 0);
}

.slide-enter, .slide-leave-to {
  opacity: 0;
}

.slide-enter .cookies, .slide-leave-to .cookies {
  -webkit-transform: translate(0, 100%);
          transform: translate(0, 100%);
}

.collection {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}

.collection .collection-header {
  height: 150px;
  background: #98D9AB;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.collection .collection-header .container {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding: 0 165px;
  margin-top: auto;
  margin-bottom: auto;
}

.collection .collection-header .title {
  font-size: 32px;
  color: white;
  margin-left: 35px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.collection .collection-header .title h1 {
  font-size: 32px;
  margin: 0;
}

.collection .collection-header .title p {
  margin: 0;
}

.collection .collection-item-group {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin-left: -15px;
  margin-right: -15px;
}

.collection .collection-item {
  width: 25%;
  padding: 0 15px 30px;
}

@media screen and (max-width: 600px) {
  .collection .collection-item {
    width: 33%;
  }
}

@media screen and (max-width: 450px) {
  .collection .collection-item {
    width: 50%;
  }
}

@media screen and (max-width: 320px) {
  .collection .collection-item {
    width: 100%;
  }
}

.collection .collection-item.block {
  pointer-events: none;
}

.collection .collection-item a {
  text-decoration: none;
}

.collection .collection-item a[href="#"] {
  pointer-events: none;
}

.collection .collection-item figure {
  position: relative;
  border: 1px solid #1f5376;
  border-radius: 17px;
  margin: 0;
  overflow: hidden;
  cursor: pointer;
}

.collection .collection-item figure .cover {
  -webkit-box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.3);
          box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.3);
  margin: 40px 50px;
}

@media screen and (max-width: 1280px) {
  .collection .collection-item figure .cover {
    margin: 20px 20px;
    border-radius: 10px;
  }
}

@media screen and (max-width: 768px) {
  .collection .collection-item figure .cover {
    margin: 10% 10%;
    border-radius: 15px;
  }
}

.collection .collection-item figure .cover img {
  display: block;
  width: 100%;
  height: auto;
}

@media screen and (max-width: 1280px) {
  .collection .collection-item figure .cover img {
    border-radius: 10px;
  }
}

@media screen and (max-width: 768px) {
  .collection .collection-item figure .cover img {
    border-radius: 15px;
  }
}

.collection .collection-item figure figcaption {
  min-height: 75px;
  background: #e5f6ea;
  text-align: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  padding: 15px;
}

.collection .collection-item figure figcaption h1 {
  font-weight: 600;
  font-size: 0.875rem;
  margin: 0;
  margin-bottom: 5px;
}

.collection .collection-item figure figcaption p {
  font-size: 0.875rem;
  margin: 0;
}

.collection .collection-item figure .overlay {
  font-weight: bold;
  color: white;
  background: #98D9AB;
  padding: 10px;
  text-align: center;
  position: absolute;
  top: 50%;
  left: 0;
  width: 140%;
  -webkit-transform-origin: 25% 265%;
          transform-origin: 25% 265%;
  -webkit-transform: translate(0, -50%) rotate(-30deg);
          transform: translate(0, -50%) rotate(-30deg);
  -webkit-box-shadow: 5px 5px 5px 0px rgba(0, 0, 0, 0.5);
          box-shadow: 5px 5px 5px 0px rgba(0, 0, 0, 0.5);
  opacity: 1;
}

.icon-menu {
  width: 44px;
  height: 44px;
  background-color: none;
  border-radius: 50%;
  overflow: hidden;
  position: absolute;
  margin-left: 0px;
  top: 0px;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  z-index: 12;
  cursor: pointer;
  -webkit-transition: all 0.1s ease;
  transition: all 0.1s ease;
}

.icon-menu .icon-menu-line {
  position: absolute;
  top: 21px;
  left: 12px;
  right: 12px;
  height: 2px;
  background: white;
}

.icon-menu .icon-menu-line::before,
.icon-menu .icon-menu-line::after {
  content: '';
  position: absolute;
  display: block;
  height: 2px;
  background-color: white;
  left: 0;
  width: 100%;
}

.icon-menu .icon-menu-line::before {
  top: -7px;
}

.icon-menu .icon-menu-line::after {
  bottom: -7px;
}

/* Toggle X */
.icon-menu .icon-menu-line {
  -webkit-transition: background 0s linear 0.1s;
  transition: background 0s linear 0.1s;
}

.icon-menu .icon-menu-line::before {
  -webkit-transition-property: top, -webkit-transform;
  transition-property: top, -webkit-transform;
  transition-property: top, transform;
  transition-property: top, transform, -webkit-transform;
}

.icon-menu .icon-menu-line::after {
  -webkit-transition-property: bottom, -webkit-transform;
  transition-property: bottom, -webkit-transform;
  transition-property: bottom, transform;
  transition-property: bottom, transform, -webkit-transform;
}

.icon-menu .icon-menu-line::before,
.icon-menu .icon-menu-line::after {
  -webkit-transition-duration: 0.1s, 0.1s;
          transition-duration: 0.1s, 0.1s;
  -webkit-transition-delay: 0.1s, 0s;
          transition-delay: 0.1s, 0s;
}

/* Toggle X ACTIVE */
.icon-menu.active .icon-menu-line {
  background: none;
}

.icon-menu.active .icon-menu-line::before {
  top: 0;
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
}

.icon-menu.active .icon-menu-line::after {
  bottom: 0;
  -webkit-transform: rotate(-45deg);
          transform: rotate(-45deg);
}

.icon-menu.active .icon-menu-line::before,
.icon-menu.active .icon-menu-line::after {
  -webkit-transition-delay: 0s, 0.1s;
          transition-delay: 0s, 0.1s;
}

#session-expire-modal {
  top: 0;
  border: 1px solid #ddd;
  background: #fff;
  padding: 26px;
  position: absolute;
  left: 0;
  z-index: 1050;
  margin: 5rem auto;
  right: 0;
  max-width: 420px;
  border-radius: 4px;
  -webkit-box-shadow: 0 10px 25px 0 rgba(0, 0, 0, 0.1);
          box-shadow: 0 10px 25px 0 rgba(0, 0, 0, 0.1);
}

#session-expire-modal button {
  float: right;
  background-color: #4295c7;
  border: none;
  color: #fff;
  padding: 10px 14px;
  border-radius: 4px;
}

#session-expire-modal a {
  text-decoration: underline;
  color: #4295c7;
}

/* Colors: */
/*#app.page-wrap {
	flex-wrap: wrap;
}*/
#nagradna-igra {
  font-size: 16px;
}

@media only screen and (max-width: 1650px) {
  #nagradna-igra {
    font-size: 14px;
  }
}

@media only screen and (max-width: 768px) {
  #nagradna-igra {
    font-size: 12px;
  }
}

#nagradna-igra .page-wrap {
  overflow-x: hidden;
}

.nagradna-igra-site {
  font-family: "Montserrat";
  max-width: 120rem;
  margin: auto;
  overflow: hidden;
  padding: 0 5rem;
}

@media only screen and (max-width: 1500px) {
  .nagradna-igra-site {
    padding: 0 2rem;
  }
}

@media only screen and (max-width: 768px) {
  .nagradna-igra-site {
    padding: 0;
  }
}

.nagradna-igra-site .hero .hero__blob {
  position: absolute;
  background: transparent url("/images/nagradna_igra/blob_hero.png") 0% 0% no-repeat padding-box;
  top: -46rem;
  width: 90rem;
  height: 99rem;
  opacity: 1;
  background-size: 86rem;
  left: 6rem;
}

@media only screen and (max-width: 1500px) {
  .nagradna-igra-site .hero .hero__blob {
    top: -47rem;
    left: -6rem;
  }
}

@media only screen and (max-width: 1220px) {
  .nagradna-igra-site .hero .hero__blob {
    left: -16rem;
    top: -46rem;
  }
}

@media only screen and (max-width: 992px) {
  .nagradna-igra-site .hero .hero__blob {
    left: -13rem;
    top: -35rem;
    background-size: 70rem;
  }
}

@media only screen and (max-width: 800px) {
  .nagradna-igra-site .hero .hero__blob {
    left: -19rem;
    top: -33rem;
    background-size: 64rem;
  }
}

@media only screen and (max-width: 768px) {
  .nagradna-igra-site .hero .hero__blob {
    left: -20rem;
    padding: 0;
  }
}

@media only screen and (max-width: 586px) {
  .nagradna-igra-site .hero .hero__blob {
    left: -50%;
    top: -25rem;
    background-size: 53rem;
  }
}

@media only screen and (max-width: 500px) {
  .nagradna-igra-site .hero .hero__blob {
    left: -32%;
    top: -19rem;
    background-size: 41rem;
  }
}

@media only screen and (max-width: 450px) {
  .nagradna-igra-site .hero .hero__blob {
    left: -40%;
    top: -19rem;
    background-size: 41rem;
  }
}

@media only screen and (max-width: 320px) {
  .nagradna-igra-site .hero .hero__blob {
    left: -70%;
  }
}

.nagradna-igra-site .hero .girl-container {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin-top: 9rem;
}

@media only screen and (max-width: 1220px) {
  .nagradna-igra-site .hero .girl-container {
    -webkit-box-orient: vertical;
    -webkit-box-direction: reverse;
        -ms-flex-direction: column-reverse;
            flex-direction: column-reverse;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    margin-top: 8.625rem;
  }
}

@media only screen and (max-width: 768px) {
  .nagradna-igra-site .hero .girl-container {
    margin-left: auto;
    margin-right: auto;
    width: 100%;
  }
}

@media only screen and (max-width: 400px) {
  .nagradna-igra-site .hero .girl-container {
    margin-top: 4rem;
  }
}

.nagradna-igra-site .hero .girl-container .hero-text {
  position: relative;
  display: inline-block;
  z-index: 1;
  left: 0px;
  width: 48%;
  height: auto;
  text-align: left;
  opacity: 1;
  font: normal normal normal 1rem/1.875rem Montserrat;
  letter-spacing: 0;
  color: #454545;
  margin-bottom: 9rem;
}

@media only screen and (max-width: 1220px) {
  .nagradna-igra-site .hero .girl-container .hero-text {
    width: auto;
  }
}

@media only screen and (max-width: 768px) {
  .nagradna-igra-site .hero .girl-container .hero-text {
    margin-left: 5rem;
  }
}

@media only screen and (max-width: 660px) {
  .nagradna-igra-site .hero .girl-container .hero-text {
    margin-left: 1rem;
  }
}

.nagradna-igra-site .hero .girl-container .hero-girl {
  position: relative;
  display: inline-block;
  width: 33%;
  background: transparent url("/images/nagradna_igra/hero_girl1.png") 0% 0% no-repeat padding-box;
  opacity: 1;
  background-size: 35rem;
  margin-top: -6rem;
  height: 43.45rem;
  background-position: center;
}

@media only screen and (max-width: 1700px) {
  .nagradna-igra-site .hero .girl-container .hero-girl {
    width: 50%;
  }
}

@media only screen and (max-width: 1220px) {
  .nagradna-igra-site .hero .girl-container .hero-girl {
    width: 100%;
    height: 40rem;
    margin-top: 1rem;
  }
}

@media only screen and (max-width: 1220px) {
  .nagradna-igra-site .hero .girl-container .hero-girl {
    width: 100%;
    height: 40rem;
    margin-top: 1rem;
  }
}

@media only screen and (max-width: 660px) {
  .nagradna-igra-site .hero .girl-container .hero-girl {
    background-size: 100%;
  }
}

@media only screen and (max-width: 420px) {
  .nagradna-igra-site .hero .girl-container .hero-girl {
    height: 28rem;
    margin-top: 3rem;
  }
}

.nagradna-igra-site .hero .guy-container {
  position: relative;
  height: 76.625rem;
  right: 1rem;
}

@media only screen and (max-width: 1220px) {
  .nagradna-igra-site .hero .guy-container {
    top: 8rem;
  }
}

@media only screen and (max-width: 768px) {
  .nagradna-igra-site .hero .guy-container {
    top: 8rem;
    right: 0;
  }
}

.nagradna-igra-site .hero .guy-container .hero-guy {
  position: absolute;
  top: -14rem;
  right: -7rem;
  width: 45rem;
  height: 45rem;
  opacity: 1;
}

@media only screen and (max-width: 1220px) {
  .nagradna-igra-site .hero .guy-container .hero-guy {
    width: 42rem;
    right: -17rem;
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
  }
}

@media only screen and (max-width: 886px) {
  .nagradna-igra-site .hero .guy-container .hero-guy {
    left: 50%;
  }
}

@media only screen and (max-width: 660px) {
  .nagradna-igra-site .hero .guy-container .hero-guy {
    width: 100%;
  }
}

@media only screen and (max-width: 500px) {
  .nagradna-igra-site .hero .guy-container .hero-guy {
    width: 150%;
    height: 50%;
  }
}

.nagradna-igra-site .hero .guy-container .hero-author {
  position: absolute;
  top: 35%;
  right: 3rem;
  white-space: nowrap;
}

@media only screen and (max-width: 1550px) {
  .nagradna-igra-site .hero .guy-container .hero-author {
    top: 28%;
    right: 0;
  }
}

@media only screen and (max-width: 1220px) {
  .nagradna-igra-site .hero .guy-container .hero-author {
    top: 35%;
    right: 14rem;
    width: 100%;
    text-align: center;
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
    left: 50%;
  }
}

@media only screen and (max-width: 500px) {
  .nagradna-igra-site .hero .guy-container .hero-author {
    top: 27%;
  }
}

.nagradna-igra-site .hero .guy-container .hero-guy-ellipse {
  position: absolute;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  right: 24rem;
  width: 24rem;
  height: 11rem;
  top: -8rem;
  -webkit-transform: matrix(0.99, -0.16, 0.16, 0.99, 0, 0);
          transform: matrix(0.99, -0.16, 0.16, 0.99, 0, 0);
  background: #001EFF 0% 0% no-repeat padding-box;
  opacity: 1;
  border-radius: 50%;
}

@media only screen and (max-width: 1600px) {
  .nagradna-igra-site .hero .guy-container .hero-guy-ellipse {
    right: 27rem;
  }
}

@media only screen and (max-width: 1500px) {
  .nagradna-igra-site .hero .guy-container .hero-guy-ellipse {
    top: -12rem;
    right: 18rem;
  }
}

@media only screen and (max-width: 1220px) {
  .nagradna-igra-site .hero .guy-container .hero-guy-ellipse {
    right: 36rem;
  }
}

@media only screen and (max-width: 1100px) {
  .nagradna-igra-site .hero .guy-container .hero-guy-ellipse {
    right: 27rem;
    top: -11rem;
  }
}

@media only screen and (max-width: 886px) {
  .nagradna-igra-site .hero .guy-container .hero-guy-ellipse {
    left: 4rem;
    top: -16rem;
  }
}

@media only screen and (max-width: 660px) {
  .nagradna-igra-site .hero .guy-container .hero-guy-ellipse {
    width: 20rem;
    height: 7rem;
    top: -13rem;
    left: 50%;
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
  }
}

.nagradna-igra-site .hero .guy-container .hero-guy-ellipse .ellipse-container {
  position: absolute;
  letter-spacing: 0;
  color: #FFFFFF;
  text-align: left;
  opacity: 1;
  font-size: 1.3rem;
  line-height: 1.3rem;
  font-weight: 100;
  -webkit-transform: matrix(1, 0, 0, 1, 0, 0);
          transform: matrix(1, 0, 0, 1, 0, 0);
}

@media only screen and (max-width: 660px) {
  .nagradna-igra-site .hero .guy-container .hero-guy-ellipse .ellipse-container {
    font-size: 1rem;
    line-height: 1rem;
  }
}

.nagradna-igra-site .hero .guy-container .hero-guy-ellipse .ellipse-container .tiktok {
  font: normal normal bold 2rem/2.75rem "Montserrat";
  font-weight: 400;
  font-size: 1.5rem;
  line-height: 1.7rem;
}

@media only screen and (max-width: 660px) {
  .nagradna-igra-site .hero .guy-container .hero-guy-ellipse .ellipse-container .tiktok {
    font-size: 1.2rem;
    line-height: 1.5rem;
  }
}

.nagradna-igra-site .nagrade {
  position: relative;
  height: 61rem;
  margin-top: -82rem;
  margin-left: 2rem;
}

@media only screen and (max-width: 1600px) {
  .nagradna-igra-site .nagrade {
    height: 58rem;
  }
}

@media only screen and (max-width: 1220px) {
  .nagradna-igra-site .nagrade {
    margin-top: -38rem;
    margin-bottom: 30rem;
    height: 55rem;
  }
}

@media only screen and (max-width: 1100px) {
  .nagradna-igra-site .nagrade {
    margin-top: -35rem;
  }
}

@media only screen and (max-width: 820px) {
  .nagradna-igra-site .nagrade {
    height: 62rem;
  }
}

@media only screen and (max-width: 768px) {
  .nagradna-igra-site .nagrade {
    width: 100%;
    margin-left: 0;
    margin-top: -40rem;
  }
}

@media only screen and (max-width: 600px) {
  .nagradna-igra-site .nagrade {
    height: 51rem;
  }
}

@media only screen and (max-width: 500px) {
  .nagradna-igra-site .nagrade {
    height: 45rem;
    margin-top: -45rem;
  }
}

@media only screen and (max-width: 400px) {
  .nagradna-igra-site .nagrade {
    height: 31rem;
  }
}

.nagradna-igra-site .nagrade .sodeluj-header {
  position: relative;
  margin-left: 8%;
  width: 56rem;
  height: 16.125rem;
  letter-spacing: 0;
  color: #C50A75;
  text-align: left;
  font: normal normal bold 3.375rem/3.375rem "Montserrat";
  letter-spacing: 0px;
  color: #C50A75;
  opacity: 1;
  font-weight: 800;
  white-space: nowrap;
}

@media only screen and (max-width: 1700px) {
  .nagradna-igra-site .nagrade .sodeluj-header {
    margin-left: -2%;
  }
}

@media only screen and (max-width: 1220px) {
  .nagradna-igra-site .nagrade .sodeluj-header {
    margin: auto;
    width: 36rem;
    margin-bottom: 5rem;
  }
}

@media only screen and (max-width: 660px) {
  .nagradna-igra-site .nagrade .sodeluj-header {
    width: 80%;
    margin: auto;
    font: normal normal bold 2.5rem/2.5rem "Montserrat";
  }
}

@media only screen and (max-width: 400px) {
  .nagradna-igra-site .nagrade .sodeluj-header {
    width: 90%;
    margin: auto;
    font: normal normal bold 2rem/2rem "Montserrat";
  }
}

.nagradna-igra-site .nagrade .nagrade-container {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
  margin-top: -13rem;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

@media only screen and (max-width: 1220px) {
  .nagradna-igra-site .nagrade .nagrade-container {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
}

.nagradna-igra-site .nagrade .nagrade-container .left-container {
  position: relative;
  width: 35%;
}

@media only screen and (max-width: 1600px) {
  .nagradna-igra-site .nagrade .nagrade-container .left-container {
    width: 30%;
  }
}

@media only screen and (max-width: 1220px) {
  .nagradna-igra-site .nagrade .nagrade-container .left-container {
    width: 100%;
  }
}

.nagradna-igra-site .nagrade .nagrade-container .left-container img {
  position: relative;
  width: 40.5rem;
  top: 6rem;
  left: -3.5rem;
  height: auto;
  padding-top: 10rem;
}

@media only screen and (max-width: 1600px) {
  .nagradna-igra-site .nagrade .nagrade-container .left-container img {
    width: 35.5rem;
  }
}

@media only screen and (max-width: 1220px) {
  .nagradna-igra-site .nagrade .nagrade-container .left-container img {
    top: -3rem;
    left: 50%;
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
  }
}

@media only screen and (max-width: 768px) {
  .nagradna-igra-site .nagrade .nagrade-container .left-container img {
    left: 52%;
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
  }
}

@media only screen and (max-width: 660px) {
  .nagradna-igra-site .nagrade .nagrade-container .left-container img {
    top: 0;
    left: 50%;
    width: 85%;
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
  }
}

.nagradna-igra-site .nagrade .nagrade-container .right-container {
  position: relative;
  width: 60%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -ms-flex-line-pack: center;
      align-content: center;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
}

@media only screen and (max-width: 1820px) {
  .nagradna-igra-site .nagrade .nagrade-container .right-container {
    margin-top: 10rem;
  }
}

@media only screen and (max-width: 1500px) {
  .nagradna-igra-site .nagrade .nagrade-container .right-container {
    width: 75%;
    margin-top: 0;
  }
}

@media only screen and (max-width: 1220px) {
  .nagradna-igra-site .nagrade .nagrade-container .right-container {
    margin-top: -9rem;
    width: 80%;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
  }
}

@media only screen and (max-width: 660px) {
  .nagradna-igra-site .nagrade .nagrade-container .right-container {
    margin-top: -5rem;
  }
}

@media only screen and (max-width: 500px) {
  .nagradna-igra-site .nagrade .nagrade-container .right-container {
    margin-top: -5rem;
    width: 90%;
  }
}

.nagradna-igra-site .nagrade .nagrade-container .right-container .iphone-container {
  position: relative;
  display: block;
}

.nagradna-igra-site .nagrade .nagrade-container .right-container .iphone-container .image-container {
  position: absolute;
  z-index: 1;
  color: #FFFFFF;
  top: 4rem;
}

@media only screen and (max-width: 560px) {
  .nagradna-igra-site .nagrade .nagrade-container .right-container .iphone-container .image-container {
    top: 2rem;
  }
}

.nagradna-igra-site .nagrade .nagrade-container .right-container .iphone-container .image-container .x1 {
  position: relative;
  display: inline-block;
  margin-right: 1rem;
  width: 6rem;
}

@media only screen and (max-width: 660px) {
  .nagradna-igra-site .nagrade .nagrade-container .right-container .iphone-container .image-container .x1 {
    width: 6rem;
  }
}

@media only screen and (max-width: 400px) {
  .nagradna-igra-site .nagrade .nagrade-container .right-container .iphone-container .image-container .x1 {
    width: 4rem;
  }
}

.nagradna-igra-site .nagrade .nagrade-container .right-container .iphone-container .image-container .iphone-caption {
  position: relative;
  display: inline-block;
  font-size: 2rem;
  top: -1rem;
}

@media only screen and (max-width: 660px) {
  .nagradna-igra-site .nagrade .nagrade-container .right-container .iphone-container .image-container .iphone-caption {
    font-size: 1.5rem;
  }
}

.nagradna-igra-site .nagrade .nagrade-container .right-container .iphone-container .image-container .iphone-caption .iphone-strong {
  font-weight: 800;
}

.nagradna-igra-site .nagrade .nagrade-container .right-container .iphone-container .iphone-hero {
  position: relative;
  z-index: 0;
  left: 3rem;
  width: 32rem;
}

@media only screen and (max-width: 660px) {
  .nagradna-igra-site .nagrade .nagrade-container .right-container .iphone-container .iphone-hero {
    width: 80%;
  }
}

.nagradna-igra-site .nagrade .nagrade-container .right-container .vredn-kartica, .nagradna-igra-site .nagrade .nagrade-container .right-container .trampolin {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  font-size: 2rem;
  width: 100%;
  color: #454545;
  letter-spacing: -1px;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

@media only screen and (max-width: 1820px) {
  .nagradna-igra-site .nagrade .nagrade-container .right-container .vredn-kartica, .nagradna-igra-site .nagrade .nagrade-container .right-container .trampolin {
    font-size: 1.5rem;
  }
}

@media only screen and (max-width: 820px) {
  .nagradna-igra-site .nagrade .nagrade-container .right-container .vredn-kartica, .nagradna-igra-site .nagrade .nagrade-container .right-container .trampolin {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
  }
}

.nagradna-igra-site .nagrade .nagrade-container .right-container .vredn-kartica .text-container, .nagradna-igra-site .nagrade .nagrade-container .right-container .trampolin .text-container {
  position: relative;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-right: 8rem;
}

@media only screen and (max-width: 1820px) {
  .nagradna-igra-site .nagrade .nagrade-container .right-container .vredn-kartica .text-container, .nagradna-igra-site .nagrade .nagrade-container .right-container .trampolin .text-container {
    margin-right: 4rem;
  }
}

.nagradna-igra-site .nagrade .nagrade-container .right-container .vredn-kartica .text-container img, .nagradna-igra-site .nagrade .nagrade-container .right-container .trampolin .text-container img {
  position: relative;
  display: inline-block;
  padding-right: 1rem;
  width: 7rem;
}

@media only screen and (max-width: 660px) {
  .nagradna-igra-site .nagrade .nagrade-container .right-container .vredn-kartica .text-container img, .nagradna-igra-site .nagrade .nagrade-container .right-container .trampolin .text-container img {
    width: 30%;
  }
}

.nagradna-igra-site .nagrade .nagrade-container .right-container .vredn-kartica .text-container .description, .nagradna-igra-site .nagrade .nagrade-container .right-container .trampolin .text-container .description {
  position: relative;
  display: inline-block;
  font-size: 1.5rem;
  white-space: nowrap;
}

@media only screen and (max-width: 660px) {
  .nagradna-igra-site .nagrade .nagrade-container .right-container .vredn-kartica .text-container .description, .nagradna-igra-site .nagrade .nagrade-container .right-container .trampolin .text-container .description {
    font-size: 1rem;
  }
}

.nagradna-igra-site .nagrade .nagrade-container .right-container .vredn-kartica .image-logo, .nagradna-igra-site .nagrade .nagrade-container .right-container .trampolin .image-logo {
  position: relative;
  display: inline-block;
  height: 5rem;
}

@media only screen and (max-width: 1500px) {
  .nagradna-igra-site .nagrade .nagrade-container .right-container .vredn-kartica .image-logo, .nagradna-igra-site .nagrade .nagrade-container .right-container .trampolin .image-logo {
    width: 20%;
  }
}

@media only screen and (max-width: 820px) {
  .nagradna-igra-site .nagrade .nagrade-container .right-container .vredn-kartica .image-logo, .nagradna-igra-site .nagrade .nagrade-container .right-container .trampolin .image-logo {
    width: 50%;
    left: 40%;
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
    margin-top: -1rem;
  }
}

@media only screen and (max-width: 768px) {
  .nagradna-igra-site .nagrade .nagrade-container .right-container .vredn-kartica .image-logo, .nagradna-igra-site .nagrade .nagrade-container .right-container .trampolin .image-logo {
    width: 25%;
  }
}

@media only screen and (max-width: 660px) {
  .nagradna-igra-site .nagrade .nagrade-container .right-container .vredn-kartica .image-logo, .nagradna-igra-site .nagrade .nagrade-container .right-container .trampolin .image-logo {
    width: 33%;
  }
}

@media only screen and (max-width: 560px) {
  .nagradna-igra-site .nagrade .nagrade-container .right-container .vredn-kartica .image-logo, .nagradna-igra-site .nagrade .nagrade-container .right-container .trampolin .image-logo {
    width: 50%;
    height: 4rem;
    left: 50%;
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
  }
}

@media only screen and (max-width: 340px) {
  .nagradna-igra-site .nagrade .nagrade-container .right-container .vredn-kartica .image-logo, .nagradna-igra-site .nagrade .nagrade-container .right-container .trampolin .image-logo {
    width: 70%;
    left: 65%;
    height: 3rem;
  }
}

.nagradna-igra-site .nagrade .nagrade-container .right-container .trampolin {
  margin-top: 1rem;
}

.nagradna-igra-site .nagrade .nagrade-container .right-container .trampolin .image-logo {
  height: 6rem;
}

.nagradna-igra-site .koraki-do-nagrade {
  position: relative;
  background-color: #fffad9;
  padding: 10rem 1rem 0 1rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

@media only screen and (max-width: 660px) {
  .nagradna-igra-site .koraki-do-nagrade {
    padding: 5rem 0 0 0;
  }
}

.nagradna-igra-site .koraki-do-nagrade .blue-grid {
  position: absolute;
  z-index: 0;
  top: 0;
  left: -1rem;
  width: 40rem;
  height: auto;
}

.nagradna-igra-site .koraki-do-nagrade .koraki-container {
  position: relative;
  z-index: 1;
  width: 95%;
  background-color: #FFFFFF;
  padding: 4rem;
  -webkit-box-shadow: 1.25rem 1.25rem 2.5rem #00000029;
          box-shadow: 1.25rem 1.25rem 2.5rem #00000029;
  border-radius: 4.5rem;
  opacity: 1;
  margin: auto;
}

@media only screen and (max-width: 1050px) {
  .nagradna-igra-site .koraki-do-nagrade .koraki-container {
    border-radius: 2.5rem;
  }
}

@media only screen and (max-width: 660px) {
  .nagradna-igra-site .koraki-do-nagrade .koraki-container {
    width: 100%;
    padding: 4rem 2rem 4rem 2rem;
  }
}

.nagradna-igra-site .koraki-do-nagrade .koraki-container .caption {
  color: #C50A75;
  font-weight: 600;
  margin-bottom: 4rem;
  font: normal normal bold 3.375rem/3.375rem "Montserrat";
}

@media only screen and (max-width: 660px) {
  .nagradna-igra-site .koraki-do-nagrade .koraki-container .caption {
    font: normal normal bold 2.5rem/2.5rem "Montserrat";
    text-align: center;
  }
}

.nagradna-igra-site .koraki-do-nagrade .koraki-container .list {
  position: relative;
  font-size: 1.875rem;
  color: #454545;
  font-weight: 100;
  font: normal normal normal 30px/56px Montserrat;
  font: normal normal normal 1.2rem/1.2rem Montserrat;
}

.nagradna-igra-site .koraki-do-nagrade .koraki-container .list .list__item {
  position: relative;
  margin-bottom: 1rem;
  margin-left: 1.5rem;
  list-style: none;
  line-height: 2rem;
}

.nagradna-igra-site .koraki-do-nagrade .koraki-container .list .list__item:before {
  content: '';
  position: absolute;
  top: -6px;
  left: -4rem;
  width: 44px;
  height: 44px;
}

.nagradna-igra-site .koraki-do-nagrade .koraki-container .list .list__item.ena:before {
  background-image: url("/images/nagradna_igra/1.png");
}

.nagradna-igra-site .koraki-do-nagrade .koraki-container .list .list__item.dva:before {
  background-image: url("/images/nagradna_igra/2.png");
}

.nagradna-igra-site .koraki-do-nagrade .koraki-container .list .list__item.tri:before {
  background-image: url("/images/nagradna_igra/3.png");
}

.nagradna-igra-site .koraki-do-nagrade .koraki-container .list .list__item.štiri:before {
  background-image: url("/images/nagradna_igra/4.png");
}

.nagradna-igra-site .koraki-do-nagrade .koraki-container .list .list__item.pet:before {
  background-image: url("/images/nagradna_igra/5.png");
}

.nagradna-igra-site .koraki-do-nagrade .koraki-container .list .list__item .blue {
  color: #001EFF;
}

.nagradna-igra-site .koraki-do-nagrade .koraki-container .list .list__item .pink {
  color: #C50A75;
  font-weight: 800;
}

.nagradna-igra-site .koraki-do-nagrade .koraki-container .list .list__item .grey {
  color: #454545;
  font-weight: 400;
}

.nagradna-igra-site .koraki-do-nagrade .koraki-container .list .list-item-deep {
  position: relative;
  list-style: none;
}

.nagradna-igra-site .koraki-do-nagrade .koraki-container .list .list-item-deep:before {
  content: '';
  background-image: url("/images/nagradna_igra/bullet2.png");
  background-repeat: no-repeat;
  background-size: auto;
  position: absolute;
  top: 0.8rem;
  left: -1.2rem;
  width: 5px;
  height: 6px;
}

.nagradna-igra-site .primer-objave {
  position: relative;
  padding: 1rem;
  padding-top: 5rem;
  background-color: #fffad9;
}

.nagradna-igra-site .primer-objave .container-objave {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 95%;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  margin: auto;
}

@media only screen and (max-width: 1050px) {
  .nagradna-igra-site .primer-objave .container-objave {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
}

.nagradna-igra-site .primer-objave .container-objave .caption {
  font-size: 3rem;
  color: #001EFF;
  width: 25%;
  font-weight: 600;
  white-space: nowrap;
}

@media only screen and (max-width: 1660px) {
  .nagradna-igra-site .primer-objave .container-objave .caption {
    width: 35%;
  }
}

@media only screen and (max-width: 1400px) {
  .nagradna-igra-site .primer-objave .container-objave .caption {
    width: 35%;
    position: absolute;
    top: -4rem;
    left: 50%;
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
  }
}

@media only screen and (max-width: 1050px) {
  .nagradna-igra-site .primer-objave .container-objave .caption {
    width: auto;
    white-space: nowrap;
    margin-bottom: 1rem;
  }
}

.nagradna-igra-site .primer-objave .container-objave .image-example {
  width: 25%;
  position: relative;
}

@media only screen and (max-width: 1660px) {
  .nagradna-igra-site .primer-objave .container-objave .image-example {
    width: 35%;
  }
}

@media only screen and (max-width: 1400px) {
  .nagradna-igra-site .primer-objave .container-objave .image-example {
    width: 40%;
    margin-left: 1rem;
  }
}

@media only screen and (max-width: 1220px) {
  .nagradna-igra-site .primer-objave .container-objave .image-example {
    width: 35%;
  }
}

@media only screen and (max-width: 1050px) {
  .nagradna-igra-site .primer-objave .container-objave .image-example {
    margin-bottom: 1rem;
    width: auto;
  }
}

.nagradna-igra-site .primer-objave .container-objave .info-container {
  position: relative;
  z-index: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 45%;
  color: #454545;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  font-size: 1.875rem;
  font: normal normal normal 1.2rem/1.2rem Montserrat;
}

@media only screen and (max-width: 1660px) {
  .nagradna-igra-site .primer-objave .container-objave .info-container {
    width: 45%;
  }
}

@media only screen and (max-width: 1400px) {
  .nagradna-igra-site .primer-objave .container-objave .info-container {
    width: 60%;
  }
}

@media only screen and (max-width: 1150px) {
  .nagradna-igra-site .primer-objave .container-objave .info-container {
    width: 55%;
  }
}

@media only screen and (max-width: 1050px) {
  .nagradna-igra-site .primer-objave .container-objave .info-container {
    width: 95%;
  }
}

.nagradna-igra-site .primer-objave .container-objave .info-container .info {
  position: relative;
  background-color: #FFFFFF;
  padding: 1.5rem;
  margin-bottom: 1rem;
  -webkit-box-shadow: 1.25rem 1.25rem 2.5rem #00000029;
          box-shadow: 1.25rem 1.25rem 2.5rem #00000029;
  border-radius: 4.5rem;
}

@media only screen and (max-width: 1050px) {
  .nagradna-igra-site .primer-objave .container-objave .info-container .info {
    border-radius: 2.5rem;
  }
}

.nagradna-igra-site .primer-objave .container-objave .info-container .info .list-item {
  position: relative;
  list-style: none;
  line-height: 2rem;
}

.nagradna-igra-site .primer-objave .container-objave .info-container .info .list-item:before {
  content: '';
  background-image: url("/images/nagradna_igra/bullet2.png");
  background-repeat: no-repeat;
  background-size: auto;
  position: absolute;
  top: 0.95rem;
  left: -1.2rem;
  width: 5px;
  height: 6px;
}

.nagradna-igra-site .primer-objave .container-pravila {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 95%;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  margin: auto;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-top: -5rem;
}

@media only screen and (max-width: 1600px) {
  .nagradna-igra-site .primer-objave .container-pravila {
    margin-top: -2rem;
  }
}

@media only screen and (max-width: 992px) {
  .nagradna-igra-site .primer-objave .container-pravila {
    margin-top: 0;
  }
}

.nagradna-igra-site .primer-objave .container-pravila .caption {
  font-size: 2.5rem;
  color: #001EFF;
  width: 50%;
  font-weight: 600;
  white-space: nowrap;
  text-decoration: none;
}

@media only screen and (max-width: 992px) {
  .nagradna-igra-site .primer-objave .container-pravila .caption {
    white-space: normal;
    width: 100%;
  }
}

.nagradna-igra-site .primer-objave .container-pravila .caption:visited, .nagradna-igra-site .primer-objave .container-pravila .caption a:hover {
  color: #001EFF;
}

.nagradna-igra-site .primer-objave .container-pravila .caption:hover {
  text-decoration: underline;
}

.nagradna-igra-site .primer-objave .container-pravila img {
  position: relative;
  width: 33%;
  margin-top: -4rem;
  margin-right: -2.5rem;
  z-index: 0;
}

.nagradna-igra-site .rezultati .container-rezultati:first-of-type {
  padding-top: 3rem;
  text-align: left;
}

@media only screen and (max-width: 1300px) {
  .nagradna-igra-site .rezultati .container-rezultati:first-of-type {
    padding: 2rem 2rem;
  }
}

@media only screen and (max-width: 992px) {
  .nagradna-igra-site .rezultati .container-rezultati:first-of-type {
    padding: 2rem 2rem;
  }
}

.nagradna-igra-site .rezultati .container-rezultati:first-of-type .cestitamo {
  text-align: center;
  margin: 0;
  padding-bottom: 1rem;
  font-size: 1.8rem;
}

.nagradna-igra-site .rezultati .container-rezultati:first-of-type .rezultat-items {
  padding: 0 10%;
}

@media only screen and (max-width: 992px) {
  .nagradna-igra-site .rezultati .container-rezultati:first-of-type .rezultat-items {
    padding: 0;
  }
}

.nagradna-igra-site .rezultati .container-rezultati:first-of-type .rezultat-items h2 {
  padding: 2rem 1rem 1rem 0;
  margin: 0;
  font-size: 1.3rem;
}

.nagradna-igra-site .rezultati .container-rezultati:first-of-type .rezultat-items .rezultati-glavni {
  font-size: 1.6rem;
}

.nagradna-igra-site .rezultati .container-rezultati:first-of-type .rezultat-items .rezultati-glavni__container {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: start;
  padding: 0.2rem 0;
}

.nagradna-igra-site .rezultati .container-rezultati:first-of-type .rezultat-items .rezultati-glavni__container .caption {
  white-space: nowrap;
  margin-right: 0.5rem;
}

.nagradna-igra-site .rezultati .container-rezultati:first-of-type .rezultat-items .rezultati-glavni__container .nagrada {
  margin-left: 1rem;
}

.nagradna-igra-site .rezultati .container-rezultati:first-of-type .rezultat-items .rezultati-glavni__container .nagrada:before {
  content: " - ";
  position: absolute;
  margin-left: -1rem;
}

.nagradna-igra-site .rezultati .container-rezultati:first-of-type .rezultat-items .final-thought {
  font-size: 1.3rem;
  text-align: center;
  font-weight: 600;
}

.nagradna-igra-site .rezultati .container-rezultati {
  padding-bottom: 3rem;
  text-align: center;
  background-color: #faff04;
}

@media only screen and (max-width: 992px) {
  .nagradna-igra-site .rezultati .container-rezultati {
    padding: 3rem 2rem;
    padding-top: 0;
    text-align: left;
  }
}

.nagradna-igra-site .rezultati .container-rezultati .rezultat-items .item {
  font-size: 1.5rem;
}

@media only screen and (max-width: 992px) {
  .nagradna-igra-site .rezultati .container-rezultati .rezultat-items .item:first-child {
    margin-bottom: 0.5rem;
  }
}

/***********************************************  COOKIE FOOTER ***********************************************/
.cookie-consent {
  background: rgba(0, 0, 0, 0.8);
  min-height: 60px;
  font-size: 13px;
  color: white;
  position: fixed;
  left: 0;
  right: 0;
  left: 0;
  text-align: left;
  bottom: 2rem;
  z-index: 100;
  width: 50vw;
  padding: 1rem;
  margin: auto;
}

@media only screen and (max-width: 992px) {
  .cookie-consent {
    min-height: 85px;
    width: 60vw;
  }
}

@media only screen and (max-width: 800px) {
  .cookie-consent {
    width: 80vw;
    padding-bottom: 3rem;
  }
}

@media only screen and (max-width: 500px) {
  .cookie-consent {
    width: 100vw;
  }
}

.cookie-consent .text-center {
  text-align: center;
  font-weight: 600;
}

.cookie-consent .text-center strong {
  font-weight: 600;
  font-size: 0.85rem;
}

.cookie-consent .d-flex {
  display: -webkit-box !important;
  display: -ms-flexbox !important;
  display: flex !important;
}

.cookie-consent .align-items-center {
  -webkit-box-align: center !important;
      -ms-flex-align: center !important;
          align-items: center !important;
}

.cookie-consent .content {
  height: 100%;
  width: 100%;
  margin-top: 10px;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  background: revert;
  padding: 0 15px;
}

@media only screen and (max-width: 576px) {
  .cookie-consent .content {
    max-width: 95%;
  }
}

@media only screen and (max-width: 400px) {
  .cookie-consent .content {
    max-width: 100%;
    padding-left: 0;
    padding-right: 0;
  }
}

@media only screen and (max-width: 350px) {
  .cookie-consent .content {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    padding-top: 1rem;
  }
}

.cookie-consent .content > *:not(:first-child) {
  margin-left: 20px;
  margin-bottom: 0;
}

@media only screen and (max-width: 768px) {
  .cookie-consent .content > *:not(:first-child) {
    margin-left: 50px;
    margin-bottom: 10px;
  }
}

@media only screen and (max-width: 768px) {
  .cookie-consent .content img {
    position: absolute;
    top: 20%;
  }
}

.cookie-consent .content p {
  color: white;
  max-width: 700px;
  font-size: 14px;
}

@media only screen and (max-width: 768px) {
  .cookie-consent .content p {
    margin-bottom: 15px !important;
  }
}

.cookie-consent .content p span {
  cursor: pointer;
}

.cookie-consent .content p span:hover {
  text-decoration: underline;
}

@media only screen and (max-width: 800px) {
  .cookie-consent .content a {
    position: absolute;
    font-weight: 600;
    left: 0;
    right: 0;
    bottom: 1rem;
    margin: 0 !important;
    padding: 0 !important;
    text-align: center;
  }
}

@media only screen and (max-width: 350px) {
  .cookie-consent .content a {
    bottom: 1.5rem;
  }
}

.cookie-consent .content .consent-button {
  cursor: pointer;
  display: inline-block;
  background-color: #fff;
  border: 2px solid transparent;
  color: #000;
  padding: 1.1em;
  min-width: 80px;
  border-radius: 3px;
  text-decoration: none;
  -webkit-transition: all 0.3s ease-in;
  transition: all 0.3s ease-in;
  line-height: 1;
  margin: 0 0 0 6px;
}

@media only screen and (max-width: 350px) {
  .cookie-consent .content .consent-button {
    margin-bottom: 1rem;
  }
}

.cookie-consent .content .consent-button.red {
  color: red;
}

.cookie-consent .content .consent-button.settings {
  color: #fff;
  background-color: transparent;
  border-color: #fff;
}

.cookie-consent .cookie-checkboxes {
  margin: 20px auto 30px auto;
  font-size: 14px;
  height: 75px;
  -webkit-animation: grow 0.3s ease-out;
          animation: grow 0.3s ease-out;
}

@media only screen and (max-width: 576px) {
  .cookie-consent .cookie-checkboxes {
    height: 95px;
  }
}

.cookie-consent .cookie-checkboxes div {
  margin-left: 20px;
}

.cookie-consent .cookie-checkboxes div .grayed-out {
  color: #b5b5b5 !important;
}

@keyframes grow {
  0% {
    height: 0px;
  }
  100% {
    height: 75px;
  }
}

@media only screen and (max-width: 576px) {
  @-webkit-keyframes grow {
    0% {
      height: 0px;
    }
    100% {
      height: 95px;
    }
  }
  @keyframes grow {
    0% {
      height: 0px;
    }
    100% {
      height: 95px;
    }
  }
}

/*********************************************** COOKIE POPUP ***********************************************/
.cookiedetails-overlay {
  position: fixed;
  z-index: 100;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  margin: auto;
  width: 100%;
  height: 100%;
  opacity: 0.75;
  background: black;
}

.cookiedetails-popup {
  position: fixed;
  z-index: 111;
  top: 0%;
  left: 0;
  min-width: 500px;
  max-width: 1000px;
  margin: auto;
  width: 75%;
  font-size: 17px;
  color: #333;
  font-family: 'montserrat','HelveticaNeue','Helvetica Neue','Helvetica-Neue',Helvetica,Arial,sans-serif;
  padding: 1.65em;
  line-height: 1.65em;
  text-align: center;
  overflow: auto;
  background: #f9f9f9;
  border-radius: 5px;
  border: 2px solid #6E6E6E;
  -webkit-box-shadow: 5px 5px 10px #666666;
          box-shadow: 5px 5px 10px #666666;
  -webkit-transition: height 0.3s;
  transition: height 0.3s;
}

@media only screen and (max-width: 992px) {
  .cookiedetails-popup {
    width: 100%;
  }
}

@media only screen and (min-width: 600px) {
  .cookiedetails-popup {
    bottom: 0;
    right: 0;
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
  }
}

@media only screen and (min-width: 400px) {
  .cookiedetails-popup {
    min-width: 400px;
  }
}

@media only screen and (max-width: 300px) {
  .cookiedetails-popup {
    min-width: 300px;
  }
}

@media only screen and (max-width: 250px) {
  .cookiedetails-popup {
    min-width: 250px;
  }
}

.cookiedetails-popup p {
  line-height: 1.428em;
}

.cookiedetails-popup .cookiedetails-content {
  overflow: auto;
}

.cookiedetails-popup .cookiedetails-header {
  font-size: 1.25em;
  display: block;
  text-align: left;
  color: black;
  text-align: left;
  padding-bottom: 1.5em;
  font-weight: 600;
}

.cookiedetails-popup hr {
  margin: 1.5em 0 2.25em;
  border-top: 1px solid #000;
}

.cookiedetails-popup .interaction {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  line-height: 1.65em;
  padding-bottom: 2em;
  min-width: 500px;
}

.cookiedetails-popup .interaction .interaction-links {
  min-width: 18em;
  text-align: left;
}

@media only screen and (max-width: 768px) {
  .cookiedetails-popup .interaction .interaction-links {
    min-width: 13em;
  }
}

@media only screen and (max-width: 500px) {
  .cookiedetails-popup .interaction .interaction-links {
    min-width: 10em;
  }
}

.cookiedetails-popup .interaction .interaction-links .link-item {
  padding: 1.5em 1em;
  cursor: pointer;
  color: #888;
  font-weight: 600;
}

.cookiedetails-popup .interaction .interaction-links .link-item:not(:last-of-type) {
  border-bottom: 1px solid #ddd;
}

.cookiedetails-popup .interaction .interaction-links .link-item:hover {
  color: black;
}

.cookiedetails-popup .interaction .interaction-links .link-item.active {
  position: relative;
  z-index: 11;
  color: black;
  background: #f9f9f9;
}

.cookiedetails-popup .interaction .interaction-content {
  position: relative;
  z-index: 10;
  padding: 1em;
  text-align: left;
  font-size: 1em;
  letter-spacing: 0.75px;
  -webkit-box-shadow: -20px 0px 20px -19px #ddd;
          box-shadow: -20px 0px 20px -19px #ddd;
  -webkit-box-shadow: -20px 0px 20px -19px rgba(0, 0, 0, 0.2);
          box-shadow: -20px 0px 20px -19px rgba(0, 0, 0, 0.2);
  border: none;
  overflow: hidden;
  padding: 1em 0 0 1.5em;
}

.cookiedetails-popup .interaction .interaction-content a {
  color: revert;
  text-decoration: underline;
}

.cookiedetails-popup .interaction .interaction-content .track-options input {
  display: none;
}

.cookiedetails-popup .interaction .interaction-content .track-options.freeze {
  opacity: 0.6;
  pointer-events: none;
}

.cookiedetails-popup .interaction .interaction-content .track-options.freeze .toggle-track {
  opacity: 0.6;
  pointer-events: none;
}

.cookiedetails-popup .interaction .interaction-content .track-options .toggle-track {
  display: block;
  z-index: 1;
  height: 27px;
  width: 54px;
  background: #ddd;
  border-radius: 100px;
  position: relative;
  margin-right: 15px;
  border: 1px solid #ccc;
  clear: both;
  float: left;
  -webkit-transition: all .1s ease-in;
  transition: all .1s ease-in;
  cursor: pointer;
}

.cookiedetails-popup .interaction .interaction-content .track-options .toggle-track:before {
  content: '';
  float: right;
  display: inline;
  height: 25px;
  width: 25px;
  background: #fff;
  border-radius: 100px;
  top: 0;
  -webkit-transition: right .1s ease-in;
  transition: right .1s ease-in;
  -webkit-box-shadow: rgba(0, 0, 0, 0.2) 0px 1px 1px 1px;
          box-shadow: rgba(0, 0, 0, 0.2) 0px 1px 1px 1px;
}

.cookiedetails-popup .interaction .interaction-content .track-options .toggle-track.disabled {
  cursor: not-allowed;
}

.cookiedetails-popup .interaction .interaction-content .track-options .track-text {
  position: relative;
}

.cookiedetails-popup .interaction .interaction-content .track-options .track-text .enabled {
  font-weight: bold;
}

.cookiedetails-popup .interaction .interaction-content .track-options .track-text.d-inline {
  display: inline !important;
}

.cookiedetails-popup .interaction .interaction-content .track-options .nujni-text {
  font-size: 0.9em;
  font-weight: 400;
  color: #333;
  margin-bottom: 0.5em;
}

.cookiedetails-popup .interaction .interaction-content .track-options input[type="checkbox"]:checked + .toggle-track:before {
  float: left;
}

.cookiedetails-popup .interaction .interaction-content .track-options input[type="checkbox"]:checked + .toggle-track {
  background: #5dceba;
}

.cookiedetails-popup .btn-container {
  position: relative;
  display: block;
  text-align: left;
  padding-left: 18em;
  padding-bottom: 1em;
}

@media only screen and (max-width: 768px) {
  .cookiedetails-popup .btn-container {
    padding-left: 13em;
  }
}

@media only screen and (max-width: 500px) {
  .cookiedetails-popup .btn-container {
    padding-left: 10em;
  }
}

.cookiedetails-popup .btn-container button {
  cursor: pointer;
  display: inline-block;
  margin: 0 0 0 6px;
  padding: 1.1em;
  margin-bottom: 0.5em;
  min-width: 80px;
  border-radius: 3px;
  text-decoration: none;
  line-height: 1;
  font-size: 0.95em;
  color: #ffffff;
  background-color: #969696;
  white-space: nowrap;
  border-color: #969696;
  -webkit-transition: all 0.3s ease-in;
  transition: all 0.3s ease-in;
}

.cookiedetails-popup .btn-container button:hover {
  opacity: 0.9;
}

/*********************************************** BOOTSTRAP 4.5.0 ***********************************************/
.app-wrap.piskotki .container {
  width: 100%;
  padding-right: 15px;
  padding-left: 15px;
  margin-right: auto;
  margin-left: auto;
}

@media (min-width: 576px) {
  .app-wrap.piskotki .container {
    max-width: 540px;
  }
}

@media (min-width: 768px) {
  .app-wrap.piskotki .container {
    max-width: 720px;
  }
}

@media (min-width: 992px) {
  .app-wrap.piskotki .container {
    max-width: 960px;
  }
}

@media (min-width: 1200px) {
  .app-wrap.piskotki .container {
    max-width: 1140px;
  }
}

.app-wrap.piskotki .container-fluid, .app-wrap.piskotki .container-xl, .app-wrap.piskotki .container-lg, .app-wrap.piskotki .container-md, .app-wrap.piskotki .container-sm {
  width: 100%;
  padding-right: 15px;
  padding-left: 15px;
  margin-right: auto;
  margin-left: auto;
}

@media (min-width: 576px) {
  .app-wrap.piskotki .container-sm, .app-wrap.piskotki .container {
    max-width: 540px;
  }
}

@media (min-width: 768px) {
  .app-wrap.piskotki .container-md, .app-wrap.piskotki .container-sm, .app-wrap.piskotki .container {
    max-width: 720px;
  }
}

@media (min-width: 992px) {
  .app-wrap.piskotki .container-lg, .app-wrap.piskotki .container-md, .app-wrap.piskotki .container-sm, .app-wrap.piskotki .container {
    max-width: 960px;
  }
}

@media (min-width: 1200px) {
  .app-wrap.piskotki .container-xl, .app-wrap.piskotki .container-lg, .app-wrap.piskotki .container-md, .app-wrap.piskotki .container-sm, .app-wrap.piskotki .container {
    max-width: 1140px;
  }
}