/*! normalize.css v7.0.0 | MIT License | github.com/necolas/normalize.css */

/* Document
   ========================================================================== */

/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in
 *    IE on Windows Phone and in iOS.
 */

html {
  line-height: 1.15; /* 1 */
  -ms-text-size-adjust: 100%; /* 2 */
  -webkit-text-size-adjust: 100%; /* 2 */
}

/* Sections
   ========================================================================== */

/**
 * Remove the margin in all browsers (opinionated).
 */

body {
  margin: 0;
}

/**
 * Add the correct display in IE 9-.
 */

article,
aside,
footer,
header,
nav,
section {
  display: block;
}

/**
 * Correct the font size and margin on `h1` elements within `section` and
 * `article` contexts in Chrome, Firefox, and Safari.
 */

h1 {
  font-size: 2em;
  margin: 0.67em 0;
}

/* Grouping content
   ========================================================================== */

/**
 * Add the correct display in IE 9-.
 * 1. Add the correct display in IE.
 */

figcaption,
figure,
main { /* 1 */
  display: block;
}

/**
 * Add the correct margin in IE 8.
 */

figure {
  margin: 1em 40px;
}

/**
 * 1. Add the correct box sizing in Firefox.
 * 2. Show the overflow in Edge and IE.
 */

hr {
  box-sizing: content-box; /* 1 */
  height: 0; /* 1 */
  overflow: visible; /* 2 */
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */

pre {
  font-family: monospace, monospace; /* 1 */
  font-size: 1em; /* 2 */
}

/* Text-level semantics
   ========================================================================== */

/**
 * 1. Remove the gray background on active links in IE 10.
 * 2. Remove gaps in links underline in iOS 8+ and Safari 8+.
 */

a {
  background-color: transparent; /* 1 */
  -webkit-text-decoration-skip: objects; /* 2 */
}

/**
 * 1. Remove the bottom border in Chrome 57- and Firefox 39-.
 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
 */

abbr[title] {
  border-bottom: none; /* 1 */
  text-decoration: underline; /* 2 */
  text-decoration: underline dotted; /* 2 */
}

/**
 * Prevent the duplicate application of `bolder` by the next rule in Safari 6.
 */

b,
strong {
  font-weight: inherit;
}

/**
 * Add the correct font weight in Chrome, Edge, and Safari.
 */

b,
strong {
  font-weight: bolder;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */

code,
kbd,
samp {
  font-family: monospace, monospace; /* 1 */
  font-size: 1em; /* 2 */
}

/**
 * Add the correct font style in Android 4.3-.
 */

dfn {
  font-style: italic;
}

/**
 * Add the correct background and color in IE 9-.
 */

mark {
  background-color: #ff0;
  color: #000;
}

/**
 * Add the correct font size in all browsers.
 */

small {
  font-size: 80%;
}

/**
 * Prevent `sub` and `sup` elements from affecting the line height in
 * all browsers.
 */

sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

/* Embedded content
   ========================================================================== */

/**
 * Add the correct display in IE 9-.
 */

audio,
video {
  display: inline-block;
}

/**
 * Add the correct display in iOS 4-7.
 */

audio:not([controls]) {
  display: none;
  height: 0;
}

/**
 * Remove the border on images inside links in IE 10-.
 */

img {
  border-style: none;
}

/**
 * Hide the overflow in IE.
 */

svg:not(:root) {
  overflow: hidden;
}

/* Forms
   ========================================================================== */

/**
 * 1. Change the font styles in all browsers (opinionated).
 * 2. Remove the margin in Firefox and Safari.
 */

button,
input,
optgroup,
select,
textarea {
  font-family: sans-serif; /* 1 */
  font-size: 100%; /* 1 */
  line-height: 1.15; /* 1 */
  margin: 0; /* 2 */
}

/**
 * Show the overflow in IE.
 * 1. Show the overflow in Edge.
 */

button,
input { /* 1 */
  overflow: visible;
}

/**
 * Remove the inheritance of text transform in Edge, Firefox, and IE.
 * 1. Remove the inheritance of text transform in Firefox.
 */

button,
select { /* 1 */
  text-transform: none;
}

/**
 * 1. Prevent a WebKit bug where (2) destroys native `audio` and `video`
 *    controls in Android 4.
 * 2. Correct the inability to style clickable types in iOS and Safari.
 */

button,
html [type="button"], /* 1 */
[type="reset"],
[type="submit"] {
  -webkit-appearance: button; /* 2 */
}

/**
 * Remove the inner border and padding in Firefox.
 */

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

/**
 * Restore the focus styles unset by the previous rule.
 */

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

/**
 * Correct the padding in Firefox.
 */

fieldset {
  padding: 0.35em 0.75em 0.625em;
}

/**
 * 1. Correct the text wrapping in Edge and IE.
 * 2. Correct the color inheritance from `fieldset` elements in IE.
 * 3. Remove the padding so developers are not caught out when they zero out
 *    `fieldset` elements in all browsers.
 */

legend {
  box-sizing: border-box; /* 1 */
  color: inherit; /* 2 */
  display: table; /* 1 */
  max-width: 100%; /* 1 */
  padding: 0; /* 3 */
  white-space: normal; /* 1 */
}

/**
 * 1. Add the correct display in IE 9-.
 * 2. Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */

progress {
  display: inline-block; /* 1 */
  vertical-align: baseline; /* 2 */
}

/**
 * Remove the default vertical scrollbar in IE.
 */

textarea {
  overflow: auto;
}

/**
 * 1. Add the correct box sizing in IE 10-.
 * 2. Remove the padding in IE 10-.
 */

[type="checkbox"],
[type="radio"] {
  box-sizing: border-box; /* 1 */
  padding: 0; /* 2 */
}

/**
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */

[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
  height: auto;
}

/**
 * 1. Correct the odd appearance in Chrome and Safari.
 * 2. Correct the outline style in Safari.
 */

[type="search"] {
  -webkit-appearance: textfield; /* 1 */
  outline-offset: -2px; /* 2 */
}

/**
 * Remove the inner padding and cancel buttons in Chrome and Safari on macOS.
 */

[type="search"]::-webkit-search-cancel-button,
[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}

/**
 * 1. Correct the inability to style clickable types in iOS and Safari.
 * 2. Change font properties to `inherit` in Safari.
 */

::-webkit-file-upload-button {
  -webkit-appearance: button; /* 1 */
  font: inherit; /* 2 */
}

/* Interactive
   ========================================================================== */

/*
 * Add the correct display in IE 9-.
 * 1. Add the correct display in Edge, IE, and Firefox.
 */

details, /* 1 */
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;
}
.croppie-container {
    width: 100%;
    height: 100%;
}

.croppie-container .cr-image {
    z-index: -1;
    position: absolute;
    top: 0;
    left: 0;
    transform-origin: 0 0;
    max-height: none;
    max-width: none;
}

.croppie-container .cr-boundary {
    position: relative;
    overflow: hidden;
    margin: 0 auto;
    z-index: 1;
    width: 100%;
    height: 100%;
}

.croppie-container .cr-viewport,
.croppie-container .cr-resizer {
    position: absolute;
    border: 2px solid #fff;
    margin: auto;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    box-shadow: 0 0 2000px 2000px rgba(0, 0, 0, 0.5);
    z-index: 0;
}

.croppie-container .cr-resizer {
  z-index: 2;
  box-shadow: none;
  pointer-events: none;
}

.croppie-container .cr-resizer-vertical,
.croppie-container .cr-resizer-horisontal {
  position: absolute;
  pointer-events: all;
}

.croppie-container .cr-resizer-vertical::after,
.croppie-container .cr-resizer-horisontal::after {
    display: block;
    position: absolute;
    box-sizing: border-box;
    border: 1px solid black;
    background: #fff;
    width: 10px;
    height: 10px;
    content: '';
}

.croppie-container .cr-resizer-vertical {
  bottom: -5px;
  cursor: row-resize;
  width: 100%;
  height: 10px;
}

.croppie-container .cr-resizer-vertical::after {
    left: 50%;
    margin-left: -5px;
}

.croppie-container .cr-resizer-horisontal {
  right: -5px;
  cursor: col-resize;
  width: 10px;
  height: 100%;
}

.croppie-container .cr-resizer-horisontal::after {
    top: 50%;
    margin-top: -5px;
}

.croppie-container .cr-original-image {
    display: none;
}

.croppie-container .cr-vp-circle {
    border-radius: 50%;
}

.croppie-container .cr-overlay {
    z-index: 1;
    position: absolute;
    cursor: move;
    touch-action: none;
}

.croppie-container .cr-slider-wrap {
    width: 75%;
    margin: 15px auto;
    text-align: center;
}

.croppie-result {
    position: relative;
    overflow: hidden;
}

.croppie-result img {
    position: absolute;
}

.croppie-container .cr-image,
.croppie-container .cr-overlay,
.croppie-container .cr-viewport {
    -webkit-transform: translateZ(0);
    -moz-transform: translateZ(0);
    -ms-transform: translateZ(0);
    transform: translateZ(0);
}

/*************************************/
/***** STYLING RANGE INPUT ***********/
/*************************************/
/*http://brennaobrien.com/blog/2014/05/style-input-type-range-in-every-browser.html */
/*************************************/

.cr-slider {
    -webkit-appearance: none;
/*removes default webkit styles*/
	/*border: 1px solid white; *//*fix for FF unable to apply focus style bug */
    width: 300px;
/*required for proper track sizing in FF*/
    max-width: 100%;
    padding-top: 8px;
    padding-bottom: 8px;
    background-color: transparent;
}

.cr-slider::-webkit-slider-runnable-track {
    width: 100%;
    height: 3px;
    background: rgba(0, 0, 0, 0.5);
    border: 0;
    border-radius: 3px;
}

.cr-slider::-webkit-slider-thumb {
    -webkit-appearance: none;
    border: none;
    height: 16px;
    width: 16px;
    border-radius: 50%;
    background: #ddd;
    margin-top: -6px;
}

.cr-slider:focus {
    outline: none;
}
/*
.cr-slider:focus::-webkit-slider-runnable-track {
background: #ccc;
}
*/

.cr-slider::-moz-range-track {
    width: 100%;
    height: 3px;
    background: rgba(0, 0, 0, 0.5);
    border: 0;
    border-radius: 3px;
}

.cr-slider::-moz-range-thumb {
    border: none;
    height: 16px;
    width: 16px;
    border-radius: 50%;
    background: #ddd;
    margin-top: -6px;
}

/*hide the outline behind the border*/
.cr-slider:-moz-focusring {
    outline: 1px solid white;
    outline-offset: -1px;
}

.cr-slider::-ms-track {
    width: 100%;
    height: 5px;
    background: transparent;
/*remove bg colour from the track, we'll use ms-fill-lower and ms-fill-upper instead */
	border-color: transparent;/*leave room for the larger thumb to overflow with a transparent border */
	border-width: 6px 0;
	color: transparent;/*remove default tick marks*/
}
.cr-slider::-ms-fill-lower {
	background: rgba(0, 0, 0, 0.5);
	border-radius: 10px;
}
.cr-slider::-ms-fill-upper {
	background: rgba(0, 0, 0, 0.5);
	border-radius: 10px;
}
.cr-slider::-ms-thumb {
	border: none;
	height: 16px;
	width: 16px;
	border-radius: 50%;
	background: #ddd;
	margin-top:1px;
}
.cr-slider:focus::-ms-fill-lower {
	background: rgba(0, 0, 0, 0.5);
}
.cr-slider:focus::-ms-fill-upper {
	background: rgba(0, 0, 0, 0.5);
}
/*******************************************/

/***********************************/
/* Rotation Tools */
/***********************************/
.cr-rotate-controls {
	position: absolute;
	bottom: 5px;
	left: 5px;
	z-index: 1;
}
.cr-rotate-controls button {
	border: 0;
	background: none;
}
.cr-rotate-controls i:before {
	display: inline-block;
	font-style: normal;
	font-weight: 900;
	font-size: 22px;
}
.cr-rotate-l i:before {
	content: '\21BA';
}
.cr-rotate-r i:before {
	content: '\21BB';
}
.dev {
  display: none; }

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

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

.row {
  box-sizing: border-box;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-flex: 0;
  -webkit-flex: 0 1 auto;
  -moz-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;
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-flex-wrap: wrap;
  -moz-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  margin-right: -7.5px;
  margin-left: -7.5px; }

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

.first-xs {
  order: -1; }

.last-xs {
  order: 1; }

@media only screen and (min-width: 0px) {
  .container {
    width: 959px; }
  .col-wee {
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 7.5px;
    padding-left: 7.5px;
    -webkit-flex-basis: auto;
    -moz-flex-basis: auto;
    -ms-flex-preferred-size: auto;
    flex-basis: auto; }
  .col-wee-1 {
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 7.5px;
    padding-left: 7.5px;
    -webkit-flex-basis: 8.33333%;
    -moz-flex-basis: 8.33333%;
    -ms-flex-preferred-size: 8.33333%;
    flex-basis: 8.33333%;
    max-width: 8.33333%; }
  .col-wee-2 {
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 7.5px;
    padding-left: 7.5px;
    -webkit-flex-basis: 16.66667%;
    -moz-flex-basis: 16.66667%;
    -ms-flex-preferred-size: 16.66667%;
    flex-basis: 16.66667%;
    max-width: 16.66667%; }
  .col-wee-3 {
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 7.5px;
    padding-left: 7.5px;
    -webkit-flex-basis: 25%;
    -moz-flex-basis: 25%;
    -ms-flex-preferred-size: 25%;
    flex-basis: 25%;
    max-width: 25%; }
  .col-wee-4 {
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 7.5px;
    padding-left: 7.5px;
    -webkit-flex-basis: 33.33333%;
    -moz-flex-basis: 33.33333%;
    -ms-flex-preferred-size: 33.33333%;
    flex-basis: 33.33333%;
    max-width: 33.33333%; }
  .col-wee-5 {
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 7.5px;
    padding-left: 7.5px;
    -webkit-flex-basis: 41.66667%;
    -moz-flex-basis: 41.66667%;
    -ms-flex-preferred-size: 41.66667%;
    flex-basis: 41.66667%;
    max-width: 41.66667%; }
  .col-wee-6 {
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 7.5px;
    padding-left: 7.5px;
    -webkit-flex-basis: 50%;
    -moz-flex-basis: 50%;
    -ms-flex-preferred-size: 50%;
    flex-basis: 50%;
    max-width: 50%; }
  .col-wee-7 {
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 7.5px;
    padding-left: 7.5px;
    -webkit-flex-basis: 58.33333%;
    -moz-flex-basis: 58.33333%;
    -ms-flex-preferred-size: 58.33333%;
    flex-basis: 58.33333%;
    max-width: 58.33333%; }
  .col-wee-8 {
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 7.5px;
    padding-left: 7.5px;
    -webkit-flex-basis: 66.66667%;
    -moz-flex-basis: 66.66667%;
    -ms-flex-preferred-size: 66.66667%;
    flex-basis: 66.66667%;
    max-width: 66.66667%; }
  .col-wee-9 {
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 7.5px;
    padding-left: 7.5px;
    -webkit-flex-basis: 75%;
    -moz-flex-basis: 75%;
    -ms-flex-preferred-size: 75%;
    flex-basis: 75%;
    max-width: 75%; }
  .col-wee-10 {
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 7.5px;
    padding-left: 7.5px;
    -webkit-flex-basis: 83.33333%;
    -moz-flex-basis: 83.33333%;
    -ms-flex-preferred-size: 83.33333%;
    flex-basis: 83.33333%;
    max-width: 83.33333%; }
  .col-wee-11 {
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 7.5px;
    padding-left: 7.5px;
    -webkit-flex-basis: 91.66667%;
    -moz-flex-basis: 91.66667%;
    -ms-flex-preferred-size: 91.66667%;
    flex-basis: 91.66667%;
    max-width: 91.66667%; }
  .col-wee-12 {
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 7.5px;
    padding-left: 7.5px;
    -webkit-flex-basis: 100%;
    -moz-flex-basis: 100%;
    -ms-flex-preferred-size: 100%;
    flex-basis: 100%;
    max-width: 100%; }
  .col-wee-offset-1 {
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 7.5px;
    padding-left: 7.5px;
    margin-left: 8.33333%; }
  .col-wee-offset-2 {
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 7.5px;
    padding-left: 7.5px;
    margin-left: 16.66667%; }
  .col-wee-offset-3 {
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 7.5px;
    padding-left: 7.5px;
    margin-left: 25%; }
  .col-wee-offset-4 {
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 7.5px;
    padding-left: 7.5px;
    margin-left: 33.33333%; }
  .col-wee-offset-5 {
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 7.5px;
    padding-left: 7.5px;
    margin-left: 41.66667%; }
  .col-wee-offset-6 {
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 7.5px;
    padding-left: 7.5px;
    margin-left: 50%; }
  .col-wee-offset-7 {
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 7.5px;
    padding-left: 7.5px;
    margin-left: 58.33333%; }
  .col-wee-offset-8 {
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 7.5px;
    padding-left: 7.5px;
    margin-left: 66.66667%; }
  .col-wee-offset-9 {
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 7.5px;
    padding-left: 7.5px;
    margin-left: 75%; }
  .col-wee-offset-10 {
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 7.5px;
    padding-left: 7.5px;
    margin-left: 83.33333%; }
  .col-wee-offset-11 {
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 7.5px;
    padding-left: 7.5px;
    margin-left: 91.66667%; }
  .col-wee-offset-12 {
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 7.5px;
    padding-left: 7.5px;
    margin-left: 100%; }
  .col-wee {
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-flex-grow: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    -webkit-flex-basis: 0;
    -moz-flex-basis: 0;
    -ms-flex-preferred-size: 0;
    flex-basis: 0;
    max-width: 100%; }
  .start-wee {
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    -webkit-justify-content: flex-start;
    -moz-justify-content: flex-start;
    justify-content: flex-start;
    text-align: start; }
  .center-wee {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    -moz-justify-content: center;
    justify-content: center;
    text-align: center; }
  .end-wee {
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    -webkit-justify-content: flex-end;
    -moz-justify-content: flex-end;
    justify-content: flex-end;
    text-align: end; }
  .top-wee {
    -webkit-box-align: start;
    -ms-flex-align: start;
    -webkit-align-items: flex-start;
    -moz-align-items: flex-start;
    align-items: flex-start; }
  .middle-wee {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    -moz-align-items: center;
    align-items: center; }
  .bottom-wee {
    -webkit-box-align: end;
    -ms-flex-align: end;
    -webkit-align-items: flex-end;
    -moz-align-items: flex-end;
    align-items: flex-end; }
  .around-wee {
    -ms-flex-pack: distribute;
    -webkit-justify-content: space-around;
    -moz-justify-content: space-around;
    justify-content: space-around; }
  .between-wee {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-justify-content: space-between;
    -moz-justify-content: space-between;
    justify-content: space-between; }
  .first-wee {
    order: -1; }
  .last-wee {
    order: 1; } }

@media only screen and (min-width: 960px) {
  .container {
    width: 1279px; }
  .col-big {
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 7.5px;
    padding-left: 7.5px;
    -webkit-flex-basis: auto;
    -moz-flex-basis: auto;
    -ms-flex-preferred-size: auto;
    flex-basis: auto; }
  .col-big-1 {
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 7.5px;
    padding-left: 7.5px;
    -webkit-flex-basis: 8.33333%;
    -moz-flex-basis: 8.33333%;
    -ms-flex-preferred-size: 8.33333%;
    flex-basis: 8.33333%;
    max-width: 8.33333%; }
  .col-big-2 {
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 7.5px;
    padding-left: 7.5px;
    -webkit-flex-basis: 16.66667%;
    -moz-flex-basis: 16.66667%;
    -ms-flex-preferred-size: 16.66667%;
    flex-basis: 16.66667%;
    max-width: 16.66667%; }
  .col-big-3 {
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 7.5px;
    padding-left: 7.5px;
    -webkit-flex-basis: 25%;
    -moz-flex-basis: 25%;
    -ms-flex-preferred-size: 25%;
    flex-basis: 25%;
    max-width: 25%; }
  .col-big-4 {
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 7.5px;
    padding-left: 7.5px;
    -webkit-flex-basis: 33.33333%;
    -moz-flex-basis: 33.33333%;
    -ms-flex-preferred-size: 33.33333%;
    flex-basis: 33.33333%;
    max-width: 33.33333%; }
  .col-big-5 {
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 7.5px;
    padding-left: 7.5px;
    -webkit-flex-basis: 41.66667%;
    -moz-flex-basis: 41.66667%;
    -ms-flex-preferred-size: 41.66667%;
    flex-basis: 41.66667%;
    max-width: 41.66667%; }
  .col-big-6 {
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 7.5px;
    padding-left: 7.5px;
    -webkit-flex-basis: 50%;
    -moz-flex-basis: 50%;
    -ms-flex-preferred-size: 50%;
    flex-basis: 50%;
    max-width: 50%; }
  .col-big-7 {
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 7.5px;
    padding-left: 7.5px;
    -webkit-flex-basis: 58.33333%;
    -moz-flex-basis: 58.33333%;
    -ms-flex-preferred-size: 58.33333%;
    flex-basis: 58.33333%;
    max-width: 58.33333%; }
  .col-big-8 {
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 7.5px;
    padding-left: 7.5px;
    -webkit-flex-basis: 66.66667%;
    -moz-flex-basis: 66.66667%;
    -ms-flex-preferred-size: 66.66667%;
    flex-basis: 66.66667%;
    max-width: 66.66667%; }
  .col-big-9 {
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 7.5px;
    padding-left: 7.5px;
    -webkit-flex-basis: 75%;
    -moz-flex-basis: 75%;
    -ms-flex-preferred-size: 75%;
    flex-basis: 75%;
    max-width: 75%; }
  .col-big-10 {
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 7.5px;
    padding-left: 7.5px;
    -webkit-flex-basis: 83.33333%;
    -moz-flex-basis: 83.33333%;
    -ms-flex-preferred-size: 83.33333%;
    flex-basis: 83.33333%;
    max-width: 83.33333%; }
  .col-big-11 {
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 7.5px;
    padding-left: 7.5px;
    -webkit-flex-basis: 91.66667%;
    -moz-flex-basis: 91.66667%;
    -ms-flex-preferred-size: 91.66667%;
    flex-basis: 91.66667%;
    max-width: 91.66667%; }
  .col-big-12 {
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 7.5px;
    padding-left: 7.5px;
    -webkit-flex-basis: 100%;
    -moz-flex-basis: 100%;
    -ms-flex-preferred-size: 100%;
    flex-basis: 100%;
    max-width: 100%; }
  .col-big-offset-1 {
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 7.5px;
    padding-left: 7.5px;
    margin-left: 8.33333%; }
  .col-big-offset-2 {
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 7.5px;
    padding-left: 7.5px;
    margin-left: 16.66667%; }
  .col-big-offset-3 {
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 7.5px;
    padding-left: 7.5px;
    margin-left: 25%; }
  .col-big-offset-4 {
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 7.5px;
    padding-left: 7.5px;
    margin-left: 33.33333%; }
  .col-big-offset-5 {
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 7.5px;
    padding-left: 7.5px;
    margin-left: 41.66667%; }
  .col-big-offset-6 {
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 7.5px;
    padding-left: 7.5px;
    margin-left: 50%; }
  .col-big-offset-7 {
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 7.5px;
    padding-left: 7.5px;
    margin-left: 58.33333%; }
  .col-big-offset-8 {
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 7.5px;
    padding-left: 7.5px;
    margin-left: 66.66667%; }
  .col-big-offset-9 {
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 7.5px;
    padding-left: 7.5px;
    margin-left: 75%; }
  .col-big-offset-10 {
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 7.5px;
    padding-left: 7.5px;
    margin-left: 83.33333%; }
  .col-big-offset-11 {
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 7.5px;
    padding-left: 7.5px;
    margin-left: 91.66667%; }
  .col-big-offset-12 {
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 7.5px;
    padding-left: 7.5px;
    margin-left: 100%; }
  .col-big {
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-flex-grow: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    -webkit-flex-basis: 0;
    -moz-flex-basis: 0;
    -ms-flex-preferred-size: 0;
    flex-basis: 0;
    max-width: 100%; }
  .start-big {
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    -webkit-justify-content: flex-start;
    -moz-justify-content: flex-start;
    justify-content: flex-start;
    text-align: start; }
  .center-big {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    -moz-justify-content: center;
    justify-content: center;
    text-align: center; }
  .end-big {
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    -webkit-justify-content: flex-end;
    -moz-justify-content: flex-end;
    justify-content: flex-end;
    text-align: end; }
  .top-big {
    -webkit-box-align: start;
    -ms-flex-align: start;
    -webkit-align-items: flex-start;
    -moz-align-items: flex-start;
    align-items: flex-start; }
  .middle-big {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    -moz-align-items: center;
    align-items: center; }
  .bottom-big {
    -webkit-box-align: end;
    -ms-flex-align: end;
    -webkit-align-items: flex-end;
    -moz-align-items: flex-end;
    align-items: flex-end; }
  .around-big {
    -ms-flex-pack: distribute;
    -webkit-justify-content: space-around;
    -moz-justify-content: space-around;
    justify-content: space-around; }
  .between-big {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-justify-content: space-between;
    -moz-justify-content: space-between;
    justify-content: space-between; }
  .first-big {
    order: -1; }
  .last-big {
    order: 1; } }

@media only screen and (min-width: 1280px) {
  .container {
    width: 10000px; }
  .col-uge {
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 7.5px;
    padding-left: 7.5px;
    -webkit-flex-basis: auto;
    -moz-flex-basis: auto;
    -ms-flex-preferred-size: auto;
    flex-basis: auto; }
  .col-uge-1 {
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 7.5px;
    padding-left: 7.5px;
    -webkit-flex-basis: 8.33333%;
    -moz-flex-basis: 8.33333%;
    -ms-flex-preferred-size: 8.33333%;
    flex-basis: 8.33333%;
    max-width: 8.33333%; }
  .col-uge-2 {
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 7.5px;
    padding-left: 7.5px;
    -webkit-flex-basis: 16.66667%;
    -moz-flex-basis: 16.66667%;
    -ms-flex-preferred-size: 16.66667%;
    flex-basis: 16.66667%;
    max-width: 16.66667%; }
  .col-uge-3 {
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 7.5px;
    padding-left: 7.5px;
    -webkit-flex-basis: 25%;
    -moz-flex-basis: 25%;
    -ms-flex-preferred-size: 25%;
    flex-basis: 25%;
    max-width: 25%; }
  .col-uge-4 {
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 7.5px;
    padding-left: 7.5px;
    -webkit-flex-basis: 33.33333%;
    -moz-flex-basis: 33.33333%;
    -ms-flex-preferred-size: 33.33333%;
    flex-basis: 33.33333%;
    max-width: 33.33333%; }
  .col-uge-5 {
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 7.5px;
    padding-left: 7.5px;
    -webkit-flex-basis: 41.66667%;
    -moz-flex-basis: 41.66667%;
    -ms-flex-preferred-size: 41.66667%;
    flex-basis: 41.66667%;
    max-width: 41.66667%; }
  .col-uge-6 {
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 7.5px;
    padding-left: 7.5px;
    -webkit-flex-basis: 50%;
    -moz-flex-basis: 50%;
    -ms-flex-preferred-size: 50%;
    flex-basis: 50%;
    max-width: 50%; }
  .col-uge-7 {
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 7.5px;
    padding-left: 7.5px;
    -webkit-flex-basis: 58.33333%;
    -moz-flex-basis: 58.33333%;
    -ms-flex-preferred-size: 58.33333%;
    flex-basis: 58.33333%;
    max-width: 58.33333%; }
  .col-uge-8 {
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 7.5px;
    padding-left: 7.5px;
    -webkit-flex-basis: 66.66667%;
    -moz-flex-basis: 66.66667%;
    -ms-flex-preferred-size: 66.66667%;
    flex-basis: 66.66667%;
    max-width: 66.66667%; }
  .col-uge-9 {
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 7.5px;
    padding-left: 7.5px;
    -webkit-flex-basis: 75%;
    -moz-flex-basis: 75%;
    -ms-flex-preferred-size: 75%;
    flex-basis: 75%;
    max-width: 75%; }
  .col-uge-10 {
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 7.5px;
    padding-left: 7.5px;
    -webkit-flex-basis: 83.33333%;
    -moz-flex-basis: 83.33333%;
    -ms-flex-preferred-size: 83.33333%;
    flex-basis: 83.33333%;
    max-width: 83.33333%; }
  .col-uge-11 {
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 7.5px;
    padding-left: 7.5px;
    -webkit-flex-basis: 91.66667%;
    -moz-flex-basis: 91.66667%;
    -ms-flex-preferred-size: 91.66667%;
    flex-basis: 91.66667%;
    max-width: 91.66667%; }
  .col-uge-12 {
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 7.5px;
    padding-left: 7.5px;
    -webkit-flex-basis: 100%;
    -moz-flex-basis: 100%;
    -ms-flex-preferred-size: 100%;
    flex-basis: 100%;
    max-width: 100%; }
  .col-uge-offset-1 {
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 7.5px;
    padding-left: 7.5px;
    margin-left: 8.33333%; }
  .col-uge-offset-2 {
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 7.5px;
    padding-left: 7.5px;
    margin-left: 16.66667%; }
  .col-uge-offset-3 {
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 7.5px;
    padding-left: 7.5px;
    margin-left: 25%; }
  .col-uge-offset-4 {
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 7.5px;
    padding-left: 7.5px;
    margin-left: 33.33333%; }
  .col-uge-offset-5 {
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 7.5px;
    padding-left: 7.5px;
    margin-left: 41.66667%; }
  .col-uge-offset-6 {
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 7.5px;
    padding-left: 7.5px;
    margin-left: 50%; }
  .col-uge-offset-7 {
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 7.5px;
    padding-left: 7.5px;
    margin-left: 58.33333%; }
  .col-uge-offset-8 {
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 7.5px;
    padding-left: 7.5px;
    margin-left: 66.66667%; }
  .col-uge-offset-9 {
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 7.5px;
    padding-left: 7.5px;
    margin-left: 75%; }
  .col-uge-offset-10 {
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 7.5px;
    padding-left: 7.5px;
    margin-left: 83.33333%; }
  .col-uge-offset-11 {
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 7.5px;
    padding-left: 7.5px;
    margin-left: 91.66667%; }
  .col-uge-offset-12 {
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 7.5px;
    padding-left: 7.5px;
    margin-left: 100%; }
  .col-uge {
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-flex-grow: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    -webkit-flex-basis: 0;
    -moz-flex-basis: 0;
    -ms-flex-preferred-size: 0;
    flex-basis: 0;
    max-width: 100%; }
  .start-uge {
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    -webkit-justify-content: flex-start;
    -moz-justify-content: flex-start;
    justify-content: flex-start;
    text-align: start; }
  .center-uge {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    -moz-justify-content: center;
    justify-content: center;
    text-align: center; }
  .end-uge {
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    -webkit-justify-content: flex-end;
    -moz-justify-content: flex-end;
    justify-content: flex-end;
    text-align: end; }
  .top-uge {
    -webkit-box-align: start;
    -ms-flex-align: start;
    -webkit-align-items: flex-start;
    -moz-align-items: flex-start;
    align-items: flex-start; }
  .middle-uge {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    -moz-align-items: center;
    align-items: center; }
  .bottom-uge {
    -webkit-box-align: end;
    -ms-flex-align: end;
    -webkit-align-items: flex-end;
    -moz-align-items: flex-end;
    align-items: flex-end; }
  .around-uge {
    -ms-flex-pack: distribute;
    -webkit-justify-content: space-around;
    -moz-justify-content: space-around;
    justify-content: space-around; }
  .between-uge {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-justify-content: space-between;
    -moz-justify-content: space-between;
    justify-content: space-between; }
  .first-uge {
    order: -1; }
  .last-uge {
    order: 1; } }

@media only screen and (min-width: 0px) {
  .hidden-wee-up {
    display: none; }
  .col-wee-offset-0 {
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 7.5px;
    padding-left: 7.5px;
    margin-left: 0; } }

@media only screen and (max-width: 0px) {
  .hidden-wee {
    display: none; } }

@media only screen and (min-width: 960px) {
  .hidden-big-up {
    display: none; }
  .col-big-offset-0 {
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 7.5px;
    padding-left: 7.5px;
    margin-left: 0; } }

@media only screen and (max-width: 960px) {
  .hidden-big {
    display: none; } }

@media only screen and (min-width: 1280px) {
  .hidden-uge-up {
    display: none; }
  .col-uge-offset-0 {
    box-sizing: border-box;
    -webkit-box-flex: 0;
    -webkit-flex-grow: 0;
    -moz-flex-grow: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-right: 7.5px;
    padding-left: 7.5px;
    margin-left: 0; } }

@media only screen and (max-width: 1280px) {
  .hidden-uge {
    display: none; } }

@media only screen and (max-width: 959px) {
  .hidden-wee {
    display: none; } }

@media (min-width: 0px) and (max-width: 959px) {
  .col-wee-1 {
    padding-left: 0;
    padding-right: 0; } }

@media (min-width: 0px) and (max-width: 959px) {
  .col-wee-2 {
    padding-left: 0;
    padding-right: 0; } }

@media (min-width: 0px) and (max-width: 959px) {
  .col-wee-3 {
    padding-left: 0;
    padding-right: 0; } }

@media (min-width: 0px) and (max-width: 959px) {
  .col-wee-4 {
    padding-left: 0;
    padding-right: 0; } }

@media (min-width: 0px) and (max-width: 959px) {
  .col-wee-5 {
    padding-left: 0;
    padding-right: 0; } }

@media (min-width: 0px) and (max-width: 959px) {
  .col-wee-6 {
    padding-left: 0;
    padding-right: 0; } }

@media (min-width: 0px) and (max-width: 959px) {
  .col-wee-7 {
    padding-left: 0;
    padding-right: 0; } }

@media (min-width: 0px) and (max-width: 959px) {
  .col-wee-8 {
    padding-left: 0;
    padding-right: 0; } }

@media (min-width: 0px) and (max-width: 959px) {
  .col-wee-9 {
    padding-left: 0;
    padding-right: 0; } }

@media (min-width: 0px) and (max-width: 959px) {
  .col-wee-10 {
    padding-left: 0;
    padding-right: 0; } }

@media (min-width: 0px) and (max-width: 959px) {
  .col-wee-11 {
    padding-left: 0;
    padding-right: 0; } }

@media (min-width: 0px) and (max-width: 959px) {
  .col-wee-12 {
    padding-left: 0;
    padding-right: 0; } }

/*
@if ($dev) { // Color indicator for current breakpoint
    body:after {
        position: fixed;
        top: 0; left: 0;
        width: 30px; height: 30px;
        content: "";
        @include breakpoint($uge) { background: red; }
        @include breakpoint($big) { background: orange; }
        //@include breakpoint($lil) { background: yellow; }
        @include breakpoint($wee) { background: green; }
    }
}
*/
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
  .photobooth .overlay h3, .box h3 {
    max-width: 100%; }
  .home .panel#s4 .button-round {
    max-width: 1000px !important; }
  #nav .panel#s4 h3 {
    max-width: 1000px !important; }
  footer {
    left: 0; } }

@font-face {
  font-family: Calibre;
  font-weight: 400;
  font-style: normal;
  src: url(assets/fonts/Calibre-Regular.f2045940fc4d7ff2a897c69c46af04b0.otf); }

@font-face {
  font-family: Calibre;
  font-weight: 500;
  font-style: normal;
  src: url(assets/fonts/Calibre-Medium.0269d8cb277a023da5f709ede610905f.otf); }

@font-face {
  font-family: Calibre;
  font-weight: 600;
  font-style: normal;
  src: url(assets/fonts/Calibre-Semibold.d0eddc5abbdc94909c6c6125c0b9feee.otf); }

@font-face {
  font-family: Calibre;
  font-weight: 700;
  font-style: normal;
  src: url(assets/fonts/Calibre-Bold.3ebe9c9ecdfb0fda9ef6805fac605ef5.otf); }

@font-face {
  font-family: Calibre;
  font-weight: 900;
  font-style: normal;
  src: url(assets/fonts/Calibre-Black.595fedd909c414b79d7f3fb7f496cda0.otf); }

@font-face {
  font-family: SpaceMono;
  font-weight: 400;
  font-style: normal;
  src: url(assets/fonts/SpaceMono-Regular.49a79d66bdea2debf1832bf4d7aca127.ttf); }

@font-face {
  font-family: SpaceMono;
  font-weight: 700;
  font-style: normal;
  src: url(assets/fonts/SpaceMono-Bold.6202525e930e9cd86a3b6d6d17c8b914.ttf); }

@font-face {
  font-family: Badaboom;
  font-weight: 400;
  font-style: normal;
  src: url(assets/fonts/badaboom.71e7d88c6fb7a9a273994f8456eed758.ttf); }

h1, h3, h2 {
  position: relative; }
  h1.underline:after, h3.underline:after, h2.underline:after {
    content: "";
    height: 2px;
    width: 65px;
    background: #56caf4;
    position: absolute;
    bottom: -9px;
    left: 0; }
    @media (min-width: 0px) and (max-width: 959px) {
      h1.underline:after, h3.underline:after, h2.underline:after {
        bottom: -20px; } }

h1, h2, h3, h4, h5, h6 {
  line-height: 1;
  font-weight: 900;
  margin: 0; }

h1 {
  font-size: 59px; }
  h1.comic {
    font-family: Badaboom;
    text-transform: uppercase;
    font-size: 82px;
    font-weight: 400;
    letter-spacing: 5px;
    color: #56caf4;
    text-shadow: 3px 5px black;
    transform: rotateZ(-8deg); }
  h1.semibold {
    font-size: 62px;
    font-weight: 600;
    letter-spacing: .5px;
    color: #56caf4; }
  h1.semibold.underline:after {
    bottom: -3px;
    height: 1px;
    width: 40px;
    background: white; }
  @media (min-width: 0px) and (max-width: 959px) {
    h1 {
      font-size: 42px;
      font-weight: 900; } }

h2 {
  font-size: 44px; }

h3 {
  font-size: 32px; }
  @media (min-width: 960px) and (max-width: 1279px) {
    h3 {
      font-size: 25px; } }
  @media (min-width: 0px) and (max-width: 959px) {
    h3 {
      font-size: 38px; } }
  h3.underline:after {
    width: 30px; }
  h3.bold {
    font-weight: 700;
    font-size: 30px;
    letter-spacing: .5px; }
    @media (min-width: 960px) and (max-width: 1279px) {
      h3.bold {
        font-size: 25px; } }
  h3.semibold {
    font-weight: 600;
    font-size: 29px;
    letter-spacing: .5px; }
    @media (min-width: 960px) and (max-width: 1279px) {
      h3.semibold {
        font-size: 25px; } }

h4 {
  font-size: 24px; }
  h4.bold {
    font-weight: 700;
    font-size: 21px; }

h5 {
  font-size: 15px; }

h6 {
  font-size: 13px; }

.mono, .popup.more .starbox .popper {
  font-family: SpaceMono;
  font-weight: normal; }

.clickable, .link, .panel, .button-comic, header .logo, header .language, header .downloads, section#quiz .answer.text, section#quiz .answer.image, section#step-1 .tab, #upload img, section#step-2 .box p {
  cursor: pointer;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none; }

.link {
  color: #56caf4;
  font-weight: 600; }

.background {
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: 50% 0%; }
  .background.overlay:after {
    content: "";
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background: rgba(0, 0, 0, 0.6); }

.wrapper {
  position: relative; }
  @media (min-width: 1280px) {
    .wrapper {
      width: 1280px; } }
  @media (min-width: 960px) and (max-width: 1279px) {
    .wrapper {
      width: 960px; } }
  @media (min-width: 0px) and (max-width: 959px) {
    .wrapper {
      width: 100%; } }

.caption * {
  position: relative;
  bottom: 30px; }

.panel {
  color: #1240c6;
  background: white; }
  .home .panel {
    padding: 20px;
    height: 180px;
    margin-bottom: 26px;
    position: relative; }
    .home .panel h1, .home .panel h3 {
      line-height: .85; }
    .home .panel h5 {
      margin-bottom: 8px; }
    .home .panel .button-round {
      position: absolute;
      bottom: 20px; }
      .fr .home .panel .button-round {
        max-width: 90px; }
    @media (min-width: 0px) and (max-width: 959px) {
      .home .panel {
        padding: 30px;
        height: initial; }
        .home .panel h3 {
          max-width: 175px; }
        .home .panel .button-round {
          max-width: initial;
          position: initial;
          margin-top: 10px; }
          .fr .home .panel .button-round {
            max-width: initial; } }
    .home .panel#s2 {
      background-image: url(assets/img/globe.cd5de009f2d781187574635531bba70f.png);
      background-repeat: no-repeat;
      background-position: 100% 0; }
    .home .panel#s4 {
      margin-left: 12px;
      background: rgba(86, 202, 244, 0.6);
      border: 12px solid white;
      color: white;
      height: 592px; }
      .home .panel#s4 h1 {
        font-size: 48px;
        line-height: .9;
        max-width: 275px;
        margin-bottom: 22px;
        position: relative;
        z-index: 1;
        font-weight: 700; }
        .home .panel#s4 h1.underline:after {
          background: black; }
      .home .panel#s4 h4 {
        margin-bottom: 22px; }
      .home .panel#s4 p {
        font-size: 14px;
        line-height: 1.8;
        margin-bottom: 24px;
        max-width: 224px;
        letter-spacing: .75px; }
      .home .panel#s4 .button-round {
        position: relative;
        z-index: 1;
        bottom: 0;
        max-width: initial; }
      .home .panel#s4 .ironman {
        position: absolute;
        bottom: 0;
        right: -40px; }
        @media (min-width: 960px) and (max-width: 1279px) {
          .home .panel#s4 .ironman {
            right: -87px; } }
      @media (min-width: 0px) and (max-width: 959px) {
        .home .panel#s4 {
          margin-left: 0;
          padding: 20px;
          height: 420px;
          overflow: hidden; }
          .home .panel#s4 .ironman {
            -moz-transform: scale(0.6, 0.6);
            -o-transform: scale(0.6, 0.6);
            -ms-transform: scale(0.6, 0.6);
            -webkit-transform: scale(0.6, 0.6);
            transform: scale(0.6, 0.6);
            moz-transform-origin: 100% 100%;
            -o-transform-origin: 100% 100%;
            -ms-transform-origin: 100% 100%;
            -webkit-transform-origin: 100% 100%;
            transform-origin: 100% 100%;
            right: -50px;
            top: -200px; }
          .home .panel#s4 p {
            font-size: 12px;
            line-height: 1.5;
            max-width: 65%;
            margin-bottom: 15px; }
          .home .panel#s4 h1 {
            font-size: 30px;
            font-weight: 900;
            line-height: .9;
            margin-bottom: 16px;
            max-width: 175px;
            position: relative;
            z-index: 1; }
            .home .panel#s4 h1:after {
              bottom: -7px;
              width: 30px; }
            .fr .home .panel#s4 h1 {
              max-width: 190px; }
          .home .panel#s4 h4 {
            font-size: 15px;
            margin-bottom: 10px; }
          .home .panel#s4 .button-round {
            padding: 12px;
            font-size: 11px;
            margin-top: 5px; } }
  #nav .panel {
    padding: 12px;
    margin-bottom: 10px;
    width: 195px;
    position: relative; }
    #nav .panel h6 {
      margin-bottom: 4px; }
    #nav .panel h3, #nav .panel h4, #nav .panel h6 {
      max-width: 65%; }
    #nav .panel h3 {
      font-size: 28px;
      line-height: .9;
      margin-top: 10px; }
    #nav .panel.active {
      color: white;
      background: #56caf4; }
      #nav .panel.active:before, #nav .panel.active:after {
        width: 18px;
        height: 50%;
        position: absolute;
        left: 100%;
        content: ""; }
      #nav .panel.active:before {
        top: 0px;
        background: linear-gradient(to right top, #56caf4 50%, transparent 52%); }
      #nav .panel.active:after {
        top: 50%;
        background: linear-gradient(to right bottom, #56caf4 50%, transparent 52%); }
    #nav .panel#s4 {
      height: 160px; }
      #nav .panel#s4.active:before, #nav .panel#s4.active:after {
        width: 52px; }
      #nav .panel#s4 h3 {
        max-width: 96%; }

.button-round {
  border-radius: 14px;
  padding: 12px;
  background: #56caf4;
  color: white;
  text-transform: uppercase;
  font-weight: 600;
  font-size: 10px;
  letter-spacing: 1.5px;
  display: inline-block; }
  .button-round span {
    margin-bottom: -5px;
    display: block; }
  .button-round.large {
    font-size: 12px;
    letter-spacing: 2.5px;
    background: black;
    color: white;
    padding: 20px 35px;
    border-radius: 25px; }
  @media (min-width: 0px) and (max-width: 959px) {
    .button-round {
      font-size: 11px; } }
  @media (min-width: 960px) {
    .button-round:hover {
      background: black; }
    .button-round.large:hover {
      background: #56caf4; } }

.button-comic {
  font-family: badaboom;
  text-transform: uppercase;
  background: #56caf4;
  -moz-transform: rotate(-3deg);
  -o-transform: rotate(-3deg);
  -ms-transform: rotate(-3deg);
  -webkit-transform: rotate(-3deg);
  transform: rotate(-3deg);
  display: inline-block;
  padding: 5px 5px 5px 12px;
  box-shadow: 5px 6px black;
  color: white;
  text-shadow: 2px 3px black;
  font-size: 25px;
  letter-spacing: 1px; }
  .button-comic span:after {
    content: url(assets/img/arrow.e4b33fd71a4101e628fb4fc1994ccda0.png);
    position: relative;
    display: inline-block;
    top: 2px;
    left: 7px; }
  .button-comic:after {
    content: "";
    width: 25px;
    -moz-transform: skew(5deg);
    -o-transform: skew(5deg);
    -ms-transform: skew(5deg);
    -webkit-transform: skew(5deg);
    transform: skew(5deg);
    height: 100%;
    display: block;
    position: absolute;
    right: -10px;
    top: 0;
    box-shadow: 5px 6px black;
    z-index: -1;
    background: #56caf4; }
  .button-comic.facebook span:after {
    content: url("assets/img/facebookblack.png"); }
  .button-comic.twitter span:after {
    content: url("assets/img/twitterblack.png"); }
  .button-comic.download span:after {
    content: url("assets/img/downloadblack.png"); }
  @media (min-width: 960px) {
    .button-comic:active {
      box-shadow: 2px 3px black;
      position: relative;
      top: 4px;
      left: 4px; }
      .button-comic:active:after {
        box-shadow: 2px 3px black; } }

.menu-button {
  position: relative;
  z-index: 11; }

.menu {
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  background: rgba(86, 202, 244, 0.9);
  z-index: 10;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  -moz-align-items: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  -moz-justify-content: center;
  justify-content: center;
  -webkit-box-direction: normal;
  -webkit-box-orient: vertical;
  -webkit-flex-direction: column;
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  text-align: center; }
  .menu h5 {
    margin-top: 10px;
    text-transform: uppercase; }
    .menu h5.mono, .menu .popup.more .starbox h5.popper, .popup.more .starbox .menu h5.popper {
      text-transform: initial;
      color: black;
      margin: 20px 0 5px 0; }
  .menu h3 {
    max-width: 195px;
    line-height: .85; }
    .es .menu h3, .fr .menu h3 {
      font-size: 30px; }
  .menu img {
    margin: 10px; }

html {
  box-sizing: border-box;
  overflow-y: scroll;
  overflow-x: hidden; }

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

a {
  text-decoration: none;
  color: white; }

:focus {
  outline: none; }

body {
  font-family: Calibre;
  font-size: 13px;
  background-color: black;
  background-attachment: fixed;
  background-size: cover;
  background-position: 50% 0%;
  color: white; }
  body p {
    letter-spacing: 1px;
    line-height: 1.3; }
  @media (min-width: 0px) and (max-width: 959px) {
    body {
      height: 100vh;
      overflow-x: hidden;
      font-weight: 500; }
      body p {
        letter-spacing: initial; } }

main {
  height: 800px;
  position: relative; }
  @media (min-width: 0px) and (max-width: 959px) {
    main {
      height: initial; } }

article, nav {
  position: relative; }

.comic-book, .language, .downloads {
  position: absolute;
  font-weight: 700;
  font-size: 15px; }
  .comic-book *, .language *, .downloads * {
    display: inline-block;
    color: black;
    vertical-align: top; }
  .comic-book img, .language img, .downloads img {
    position: relative;
    z-index: 1; }
  .comic-book .highlight, .language .highlight, .downloads .highlight {
    color: white; }

.comic-book {
  z-index: 2;
  top: 13px;
  right: 10px; }
  .comic-book a {
    height: 0; }
    .comic-book a > span {
      background: #56caf4;
      padding: 3px 8px 0px 8px;
      position: relative;
      top: 20px;
      left: 25px; }
  @media (min-width: 0px) and (max-width: 959px) {
    .comic-book {
      z-index: 0; }
      .comic-book a > span {
        max-width: 75px; } }

header {
  position: absolute;
  width: 100%; }
  header .logo {
    opacity: .4;
    position: relative;
    top: -16px;
    left: -38px;
    transition: all .05s ease;
    -moz-transform: scale(0.85);
    -o-transform: scale(0.85);
    -ms-transform: scale(0.85);
    -webkit-transform: scale(0.85);
    transform: scale(0.85);
    moz-transform-origin: calc(100% - 7px) 0%;
    -o-transform-origin: calc(100% - 7px) 0%;
    -ms-transform-origin: calc(100% - 7px) 0%;
    -webkit-transform-origin: calc(100% - 7px) 0%;
    transform-origin: calc(100% - 7px) 0%; }
    header .logo.home {
      opacity: 1;
      top: -22px;
      left: -32px;
      transform: initial; }
  header .logo-mobile {
    position: relative;
    z-index: 10; }
  header .language, header .downloads {
    z-index: 2;
    top: 0;
    right: 59px; }
    header .language span, header .downloads span {
      margin-right: 10px;
      background: #56caf4;
      padding: 3px 8px 0px 8px; }
  header .downloads {
    right: 196px; }
  @media (min-width: 0px) and (max-width: 959px) {
    header {
      margin-top: 10px;
      margin-bottom: 22px;
      position: relative; }
      header img {
        width: 125%; }
      header .language {
        position: relative;
        top: 0;
        right: 0;
        text-align: center; }
      header .downloads {
        top: 11px; } }

#nav section, figure, footer .inner {
  margin-left: 0; }
  @media (min-width: 1280px) {
    #nav section, figure, footer .inner {
      margin-left: 60px; } }
  @media (min-width: 960px) and (max-width: 1279px) {
    #nav section, figure, footer .inner {
      margin-left: 40px; } }

#nav {
  margin-top: 208px; }
  @media (min-width: 0px) and (max-width: 959px) {
    #nav {
      display: none; } }

#home-nav {
  margin-top: 140px; }
  @media (min-width: 960px) and (max-width: 1279px) {
    #home-nav {
      margin-left: -38px; } }
  @media (min-width: 0px) and (max-width: 959px) {
    #home-nav {
      margin-top: 15px; } }

figure.home {
  margin-right: 0;
  margin-top: 312px; }
  figure.home p {
    font-size: 11px;
    margin-top: 32px;
    line-height: 1.8; }
    @media (min-width: 1280px) {
      .es figure.home p {
        line-height: 1.7; } }
    @media (min-width: 960px) and (max-width: 1279px) {
      .es figure.home p, .fr figure.home p {
        line-height: 1.3; } }
    @media (min-width: 0px) and (max-width: 959px) {
      figure.home p {
        margin-top: 45px;
        font-size: 12px;
        line-height: 1.5; } }
  figure.home h3 {
    max-width: 190px; }
    @media (min-width: 0px) and (max-width: 959px) {
      figure.home h3 {
        max-width: 260px; } }
    .es figure.home h3, .fr figure.home h3 {
      max-width: initial; }
  @media (min-width: 0px) and (max-width: 959px) {
    figure.home {
      margin-top: 0; } }

footer {
  position: absolute;
  top: 660px; }
  footer p {
    max-width: 96px;
    margin-bottom: 2px; }
    .es footer p, .fr footer p {
      max-width: 140px; }
  footer img {
    margin-right: 10px; }
  @media (min-width: 0px) and (max-width: 959px) {
    footer {
      position: relative;
      top: 0;
      padding-bottom: 65px; } }

section#quiz {
  margin-top: 146px;
  position: relative; }
  @media (min-width: 1280px) {
    section#quiz {
      right: 74px; } }
  @media (min-width: 0px) and (max-width: 959px) {
    section#quiz {
      margin-top: 0; } }

section#page-p1, section#page-p2, section#page-p3, section#page-p5 {
  padding-right: 35px;
  margin-top: 96px; }
  section#page-p1.extra-page, section#page-p2.extra-page, section#page-p3.extra-page, section#page-p5.extra-page {
    margin-top: 139px; }
  section#page-p1 img, section#page-p2 img, section#page-p3 img, section#page-p5 img {
    display: block;
    margin: 40px auto;
    max-width: 100%; }
  section#page-p1 h2, section#page-p2 h2, section#page-p3 h2, section#page-p5 h2 {
    margin-bottom: 38px; }
  section#page-p1 h4.mono, section#page-p1 .popup.more .starbox h4.popper, .popup.more .starbox section#page-p1 h4.popper, section#page-p2 h4.mono, section#page-p2 .popup.more .starbox h4.popper, .popup.more .starbox section#page-p2 h4.popper, section#page-p3 h4.mono, section#page-p3 .popup.more .starbox h4.popper, .popup.more .starbox section#page-p3 h4.popper, section#page-p5 h4.mono, section#page-p5 .popup.more .starbox h4.popper, .popup.more .starbox section#page-p5 h4.popper {
    margin-top: 0;
    margin-bottom: 10px; }
  section#page-p1 h4, section#page-p1 h5, section#page-p1 p, section#page-p2 h4, section#page-p2 h5, section#page-p2 p, section#page-p3 h4, section#page-p3 h5, section#page-p3 p, section#page-p5 h4, section#page-p5 h5, section#page-p5 p {
    line-height: 1.4; }
  section#page-p1 p, section#page-p2 p, section#page-p3 p, section#page-p5 p {
    letter-spacing: .5px; }
  section#page-p1::-webkit-scrollbar, section#page-p2::-webkit-scrollbar, section#page-p3::-webkit-scrollbar, section#page-p5::-webkit-scrollbar {
    width: 8px; }
  section#page-p1::-webkit-scrollbar-track, section#page-p2::-webkit-scrollbar-track, section#page-p3::-webkit-scrollbar-track, section#page-p5::-webkit-scrollbar-track {
    background: white;
    background-clip: content-box;
    border: 3px solid transparent; }
  section#page-p1::-webkit-scrollbar-thumb, section#page-p2::-webkit-scrollbar-thumb, section#page-p3::-webkit-scrollbar-thumb, section#page-p5::-webkit-scrollbar-thumb {
    background: #56caf4;
    border-radius: 4px; }
  @media (min-width: 0px) and (max-width: 959px) {
    section#page-p1, section#page-p2, section#page-p3, section#page-p5 {
      padding-right: 0;
      margin-top: 0; }
      section#page-p1.extra-page, section#page-p2.extra-page, section#page-p3.extra-page, section#page-p5.extra-page {
        margin-top: 0; } }

section#page-p1 h4 {
  margin: 36px 0 14px 0; }

section#page-p1 h5 {
  color: #56caf4;
  text-transform: uppercase;
  font-size: 13.75px;
  font-weight: 700; }

section#page-p1 p {
  font-size: 13px;
  margin-top: 4px;
  margin-bottom: 20px; }

section#page-p1 a img {
  border: 1px solid white; }

section#page-p2 p, section#page-p3 p {
  font-size: 17.5px;
  line-height: 1.3; }

section#page-p2 h3, section#page-p3 h3 {
  margin-top: 45px; }

section#page-p3 markdown > div {
  display: inline-block; }
  section#page-p3 markdown > div img {
    border: 3px solid white;
    margin: 0 30px 15px 0; }
  section#page-p3 markdown > div h5 {
    font-weight: 600;
    font-size: 17px;
    margin-bottom: 30px; }

section#page-p5 {
  font-size: 18px;
  font-weight: 600; }
  section#page-p5 a {
    display: block;
    color: #56caf4; }
    section#page-p5 a.inline {
      display: inline; }
  section#page-p5 p {
    margin: 0;
    color: white; }

@media (min-width: 0px) and (max-width: 959px) {
  initiator:after {
    content: "";
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background: linear-gradient(transparent 30%, black 70%);
    z-index: -2; }
  initiator section {
    margin-bottom: 30px; } }

section#quiz h3 {
  margin: 18px 0 38px 0;
  font-weight: 600; }

section#quiz h6 {
  font-weight: bold;
  color: #56caf4;
  margin: 20px 0 0 0; }

section#quiz p {
  margin: 0; }

section#quiz .dot {
  display: inline-block;
  border-radius: 50%;
  background: white;
  width: 18px;
  height: 18px;
  border: 1px solid blue;
  margin-right: 8px; }
  section#quiz .dot.active {
    border: 2px solid #1240c6;
    background: #56caf4; }

section#quiz .extramargin {
  margin-right: -80px; }

section#quiz .answer.text {
  background: white;
  padding: 16px;
  margin: 0 0 6px 0; }
  section#quiz .answer.text h6 {
    color: #1240c6;
    margin: 0;
    margin-right: 24px;
    text-indent: -24px;
    position: relative;
    left: 24px; }
  @media (min-width: 960px) {
    section#quiz .answer.text:hover {
      background: #56caf4; }
      section#quiz .answer.text:hover h6 {
        color: white; } }

section#quiz .answer.image {
  height: 143px;
  width: 203px;
  background-size: cover;
  background-position: 50% 50%;
  position: relative;
  display: inline-block;
  margin: 0 24px 20px 0; }
  section#quiz .answer.image h6 {
    color: white;
    text-shadow: 2px 2px 4px black;
    font-weight: 400;
    font-size: 10px;
    position: absolute;
    bottom: 10px;
    left: 12px;
    z-index: 1; }
  section#quiz .answer.image:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background: linear-gradient(transparent, transparent, rgba(0, 0, 0, 0.3)); }
  @media (min-width: 960px) {
    section#quiz .answer.image:hover:after {
      border: 6px solid #56caf4; } }

@media (min-width: 0px) and (max-width: 959px) {
  section#quiz h3 {
    margin: 10px 0 20px 0;
    font-size: 22px; }
  section#quiz h6 {
    margin: 0; }
  section#quiz .extramargin {
    margin-right: 0; }
    section#quiz .extramargin .answer.text:nth-child(even) {
      margin: 0 15px 0 0; }
    section#quiz .extramargin .answer.text:nth-child(odd) {
      margin: 0 0 0 15px; }
  section#quiz .answer.text {
    margin-bottom: 15px; }
  section#quiz .answer.image {
    height: initial;
    padding-bottom: 36%;
    margin: 0;
    margin-bottom: 20px;
    width: calc(50% - 15px); }
    section#quiz .answer.image:nth-child(even) {
      margin-left: 15px; }
    section#quiz .answer.image:nth-child(odd) {
      margin-right: 15px; } }

section#result p, section#step-0 p {
  margin: 20px 30px 30px 0;
  font-size: 20px;
  font-weight: 500;
  letter-spacing: .5px;
  line-height: 1.4; }
  .es section#result p, .fr section#result p, .es section#step-0 p, .fr section#step-0 p {
    font-size: 18px; }

@media (min-width: 0px) and (max-width: 959px) {
  section#result h3.semibold, section#step-0 h3.semibold {
    font-size: 22px; }
  section#result h1.semibold, section#step-0 h1.semibold {
    font-size: 30px;
    margin-bottom: 42px; }
    section#result h1.semibold:after, section#step-0 h1.semibold:after {
      bottom: -16px; }
  section#result p, section#step-0 p {
    font-size: 13px !important;
    margin-right: 0;
    margin-bottom: 10px; }
  section#result .button-bar, section#step-0 .button-bar {
    width: 100%;
    text-align: center; } }

section#result {
  position: relative;
  left: 12px; }
  section#result h3 {
    margin-top: 172px; }
  section#result h1 {
    margin-top: 8px; }
  section#result img {
    position: absolute;
    z-index: -1; }
    section#result img.gamora, section#result img.groot, section#result img.starlord {
      right: 68%;
      top: 40px; }
    section#result img.mantis {
      right: 57.5%;
      top: 24px; }
    section#result img.rocket {
      right: 76.5%;
      top: 182px; }
  section#result .button-comic {
    margin-top: 8px; }
    section#result .button-comic.retake {
      margin-right: 20px; }
  @media (min-width: 960px) and (max-width: 1279px) {
    section#result img.gamora, section#result img.groot, section#result img.starlord {
      right: 60%;
      top: 40px; }
    section#result img.mantis {
      right: 46%;
      top: 24px; }
    section#result img.rocket {
      right: 62%;
      top: 182px; } }
  @media (min-width: 0px) and (max-width: 959px) {
    section#result {
      left: 0; }
      section#result h3 {
        max-width: 50%;
        margin-top: 0; }
      section#result img {
        -moz-transform: scale(0.5, 0.5);
        -o-transform: scale(0.5, 0.5);
        -ms-transform: scale(0.5, 0.5);
        -webkit-transform: scale(0.5, 0.5);
        transform: scale(0.5, 0.5);
        position: absolute;
        z-index: -1; }
        section#result img.gamora, section#result img.starlord {
          right: -170px;
          top: -280px; }
        section#result img.groot {
          right: -170px;
          top: -390px; }
        section#result img.mantis {
          right: -256px;
          top: -333px; }
        section#result img.rocket {
          right: -175px;
          top: -200px; } }

section .steps {
  position: relative; }
  @media (min-width: 1280px) {
    section .steps {
      right: 25px; } }
  section .steps h3.bold span {
    color: #56caf4;
    line-height: 1.25; }
  section .steps .box {
    position: relative;
    border: 3px solid white;
    height: 433px;
    margin-top: 15px; }
    section .steps .box.ios {
      height: 383px; }

section#step-0 {
  margin-top: 208px; }
  .en section#step-0 h1 {
    margin-right: 90px; }
    @media (min-width: 960px) and (max-width: 1279px) {
      .en section#step-0 h1 {
        margin-right: 100px; } }
    @media (min-width: 0px) and (max-width: 959px) {
      .en section#step-0 h1 {
        margin-right: 0; } }
  section#step-0 h3.semibold {
    margin-bottom: 8px; }
  section#step-0 p {
    margin-bottom: 20px;
    margin-right: 140px; }
  section#step-0 .button-comic {
    margin-top: 40px; }
  .es section#step-0 h1.semibold, .fr section#step-0 h1.semibold {
    font-size: 59px; }
  .es section#step-0 h3.bold, .fr section#step-0 h3.bold {
    font-size: 25px; }
  @media (min-width: 0px) and (max-width: 959px) {
    section#step-0 {
      margin-top: 0; }
      section#step-0 p {
        margin-right: 0; }
      section#step-0 h3.bold {
        font-size: 18px;
        margin-bottom: 10px;
        max-width: 185px; }
        .es section#step-0 h3.bold, .fr section#step-0 h3.bold {
          font-size: 18px;
          margin-bottom: 10px; }
      .es section#step-0 h1.semibold, .fr section#step-0 h1.semibold {
        font-size: 30px; }
      section#step-0 .button-comic {
        margin-top: 10px; } }

section#step-1, section#step-2, section#step-3 {
  margin-top: 121px; }
  @media (min-width: 960px) and (max-width: 1279px) {
    section#step-1, section#step-2, section#step-3 {
      margin-top: 132px; } }
  section#step-1 h3.bold, section#step-2 h3.bold, section#step-3 h3.bold {
    margin-bottom: 5px; }
  @media (min-width: 0px) and (max-width: 959px) {
    section#step-1, section#step-2, section#step-3 {
      margin-top: 0; }
      section#step-1 h3.bold, section#step-2 h3.bold, section#step-3 h3.bold {
        font-size: 22px; } }

section#step-2 .box, section#step-3 .box {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  -moz-align-items: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  -moz-justify-content: center;
  justify-content: center;
  -webkit-box-direction: normal;
  -webkit-box-orient: vertical;
  -webkit-flex-direction: column;
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  background: rgba(0, 0, 0, 0.6); }
  @media (min-width: 0px) and (max-width: 959px) {
    section#step-2 .box, section#step-3 .box {
      -webkit-box-pack: start;
      -ms-flex-pack: start;
      -webkit-justify-content: flex-start;
      -moz-justify-content: flex-start;
      justify-content: flex-start;
      background: none;
      border: none; } }

section#step-1 .tab-column {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-direction: normal;
  -webkit-box-orient: vertical;
  -webkit-flex-direction: column;
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  height: 100%;
  width: 135px; }
  @media (min-width: 0px) and (max-width: 959px) {
    section#step-1 .tab-column {
      -webkit-box-direction: normal;
      -webkit-box-orient: horizontal;
      -webkit-flex-direction: row;
      -moz-flex-direction: row;
      -ms-flex-direction: row;
      flex-direction: row;
      height: 50px;
      width: 100%; }
      section#step-1 .tab-column p {
        display: none; } }

section#step-1 p {
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -moz-box-flex: 1;
  -moz-flex: 1;
  -ms-flex: 1;
  flex: 1;
  margin: 0;
  border-right: 3px solid white;
  font-size: 11px;
  letter-spacing: .5px;
  line-height: 1.8;
  padding: 12px;
  font-weight: 500; }
  .fr section#step-1 p {
    line-height: 1.3; }

section#step-1 .photobooth {
  position: absolute;
  top: 0;
  left: 135px;
  bottom: 0;
  right: 0; }
  section#step-1 .photobooth .overlay {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    -moz-align-items: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    -moz-justify-content: center;
    justify-content: center;
    -webkit-box-direction: normal;
    -webkit-box-orient: vertical;
    -webkit-flex-direction: column;
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    z-index: 1;
    text-align: center;
    padding: 35px; }
    section#step-1 .photobooth .overlay .button-comic {
      margin-top: 18px; }
    section#step-1 .photobooth .overlay.face-guide {
      z-index: 2;
      -moz-pointer-events: none;
      -webkit-pointer-events: none;
      -o-pointer-events: none;
      -ms-pointer-events: none;
      pointer-events: none;
      background-image: url(assets/img/eyesoverlay.a8bcacef2eddf192c5c66d368b721de2.png);
      background-repeat: no-repeat;
      background-position-y: 44%;
      background-position-x: 50%; }
    section#step-1 .photobooth .overlay.bottom {
      -webkit-box-pack: end;
      -ms-flex-pack: end;
      -webkit-justify-content: flex-end;
      -moz-justify-content: flex-end;
      justify-content: flex-end; }
      section#step-1 .photobooth .overlay.bottom .button-comic {
        margin-right: 40px; }
  section#step-1 .photobooth.ios .overlay.face-guide {
    zoom: .7; }
  section#step-1 .photobooth input#file-upload {
    display: none; }
  @media (min-width: 0px) and (max-width: 959px) {
    section#step-1 .photobooth {
      left: 0;
      top: 50px; }
      section#step-1 .photobooth.ios {
        top: 0; }
      section#step-1 .photobooth .overlay.bottom .button-comic {
        margin-right: 10px; }
      section#step-1 .photobooth .button-bar.upload .spacer {
        width: 10px; }
        .fr section#step-1 .photobooth .button-bar.upload .spacer {
          width: 4px; }
      section#step-1 .photobooth .button-comic {
        padding: 5px 12px; }
        section#step-1 .photobooth .button-comic:after {
          content: none; }
        .es section#step-1 .photobooth .button-comic, .fr section#step-1 .photobooth .button-comic {
          max-width: 135px; } }

section#step-1 .tab {
  border-right: 4px solid white;
  border-bottom: 3px solid white;
  padding: 17px 12px 15px 12px;
  background: white;
  color: #333;
  position: relative; }
  section#step-1 .tab.active {
    background: #56caf4;
    color: white; }
    section#step-1 .tab.active:before, section#step-1 .tab.active:after {
      width: 35px;
      height: 50%;
      position: absolute;
      left: 100%;
      content: "";
      z-index: 4; }
    section#step-1 .tab.active:before {
      top: 0px;
      background: linear-gradient(to right top, #56caf4 50%, transparent 52%); }
    section#step-1 .tab.active:after {
      top: 50%;
      background: linear-gradient(to right bottom, #56caf4 50%, transparent 52%); }
    section#step-1 .tab.active .tab-magic {
      z-index: 3;
      position: absolute;
      top: 0;
      left: 100%;
      bottom: 0;
      right: -4px; }
      section#step-1 .tab.active .tab-magic:before, section#step-1 .tab.active .tab-magic:after {
        width: 35px;
        height: 50%;
        position: absolute;
        left: 100%;
        content: ""; }
      section#step-1 .tab.active .tab-magic:before {
        top: 0px;
        background: linear-gradient(to right top, white 50%, transparent 52%); }
      section#step-1 .tab.active .tab-magic:after {
        top: 50%;
        background: linear-gradient(to right bottom, white 50%, transparent 52%); }
  @media (min-width: 0px) and (max-width: 959px) {
    section#step-1 .tab {
      width: 50%;
      padding: 7px 12px;
      border-right: none;
      text-align: center; }
      section#step-1 .tab h4.bold {
        font-size: 18px; }
      section#step-1 .tab.active:before, section#step-1 .tab.active:after {
        width: 50%;
        height: 18px;
        position: absolute;
        left: 100%;
        content: "";
        z-index: 4; }
      section#step-1 .tab.active:before {
        top: initial;
        bottom: -18px;
        left: 0;
        background: linear-gradient(to left bottom, #56caf4 50%, transparent 52%); }
      section#step-1 .tab.active:after {
        top: initial;
        bottom: -18px;
        left: 50%;
        background: linear-gradient(to right bottom, #56caf4 50%, transparent 52%); }
      section#step-1 .tab.active .tab-magic {
        top: 0;
        left: 0;
        bottom: -3px;
        right: 0; }
        section#step-1 .tab.active .tab-magic:before, section#step-1 .tab.active .tab-magic:after {
          width: 50%;
          height: 18px;
          position: absolute;
          left: 100%;
          content: "";
          z-index: 4; }
        section#step-1 .tab.active .tab-magic:before {
          top: initial;
          bottom: -18px;
          left: 0;
          background: linear-gradient(to left bottom, white 50%, transparent 52%); }
        section#step-1 .tab.active .tab-magic:after {
          top: initial;
          bottom: -18px;
          left: 50%;
          background: linear-gradient(to right bottom, white 50%, transparent 52%); } }

#webcam {
  z-index: -1;
  position: absolute;
  overflow: hidden;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  -moz-align-items: center;
  align-items: center;
  -webkit-box-direction: normal;
  -webkit-box-orient: vertical;
  -webkit-flex-direction: column;
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  -moz-justify-content: center;
  justify-content: center; }

#video {
  -moz-transform: scale(-1, 1);
  -o-transform: scale(-1, 1);
  -ms-transform: scale(-1, 1);
  -webkit-transform: scale(-1, 1);
  transform: scale(-1, 1);
  position: relative;
  top: 3px; }

#upload {
  background-color: rgba(0, 0, 0, 0.6);
  z-index: 2;
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0; }
  #upload .button-bar {
    z-index: 2;
    position: absolute;
    width: 100%;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    -moz-justify-content: center;
    justify-content: center;
    -webkit-box-direction: normal;
    -webkit-box-orient: horizontal;
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row; }
    #upload .button-bar .spacer {
      width: 25px; }
    #upload .button-bar.tools {
      top: 20px; }
    #upload .button-bar.upload {
      bottom: 30px; }
  #upload #ngx-croppie {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    overflow: hidden; }
    #upload #ngx-croppie .cr-viewport {
      border: none; }

section#step-2 .box {
  color: #56caf4;
  text-align: center; }
  section#step-2 .box p {
    color: white;
    text-transform: uppercase;
    letter-spacing: .5px;
    font-weight: 500;
    max-width: 200px; }
  section#step-2 .box h4 {
    font-weight: 700;
    margin-top: 5px; }
  .en section#step-2 .box h3 {
    padding: 0 120px; }
  .fr section#step-2 .box h3 {
    padding: 0 80px; }
  section#step-2 .box input {
    border: none;
    background: transparent;
    text-align: center;
    color: white;
    text-transform: none;
    font-size: 59px;
    font-weight: 900;
    width: 80%;
    margin-top: 40px;
    border-bottom: 3px solid #56caf4; }
    .es section#step-2 .box input {
      font-size: 35px; }
    section#step-2 .box input::-webkit-input-placeholder {
      font-weight: 400;
      color: white;
      font-family: badaboom;
      letter-spacing: 2px;
      text-shadow: 2px 3px black;
      text-transform: uppercase; }
    section#step-2 .box input:-moz-placeholder {
      font-weight: 400;
      color: white;
      font-family: badaboom;
      letter-spacing: 2px;
      text-shadow: 2px 3px black;
      text-transform: uppercase; }
    section#step-2 .box input::-moz-placeholder {
      font-weight: 400;
      color: white;
      font-family: badaboom;
      letter-spacing: 2px;
      text-shadow: 2px 3px black;
      text-transform: uppercase; }
    section#step-2 .box input:-ms-input-placeholder {
      font-weight: 400;
      color: white;
      font-family: badaboom;
      letter-spacing: 2px;
      text-shadow: 2px 3px black;
      text-transform: uppercase; }
  section#step-2 .box .button-comic {
    margin-top: 30px;
    margin-bottom: 20px; }
  section#step-2 .box .disclaimer {
    margin-top: 5px; }
  @media (min-width: 0px) and (max-width: 959px) {
    section#step-2 .box {
      text-align: left;
      height: initial; }
      .en section#step-2 .box h3 {
        padding: 0; }
      .es section#step-2 .box h3 {
        padding: 0; }
      .fr section#step-2 .box h3 {
        padding: 0; }
      section#step-2 .box input {
        font-size: 42px;
        width: 100%; }
      section#step-2 .box h3.bold, section#step-2 .box h3.bold span {
        line-height: 1; }
      section#step-2 .box h4 {
        font-size: 20px;
        width: 100%; } }

section#step-3 .box {
  color: #56caf4;
  padding: 30px; }
  section#step-3 .box h3.bold {
    line-height: 1.2; }
    .fr section#step-3 .box h3.bold {
      margin-right: 10px; }
  section#step-3 .box .row {
    height: 100%;
    width: 100%; }
  section#step-3 .box p {
    color: white;
    line-height: 1.8;
    font-weight: 500;
    max-width: 200px;
    font-size: 11px;
    font-size: 11px;
    letter-spacing: .3px;
    text-align: justify;
    text-justify: inter-word; }
  section#step-3 .box .button-comic {
    margin: 20px; }
  section#step-3 .box .button-bar {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    -moz-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    -moz-align-items: center;
    align-items: center;
    margin-top: 5px; }
  section#step-3 .box .wrapper {
    height: 300px;
    width: 300px;
    position: relative;
    box-sizing: content-box;
    border: 2px solid white; }
    @media (min-width: 960px) and (max-width: 1279px) {
      section#step-3 .box .wrapper {
        right: 30px; } }
  section#step-3 .box .hero-preview {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0; }
    section#step-3 .box .hero-preview .user, section#step-3 .box .hero-preview .overlay {
      position: absolute;
      top: 0;
      right: 0;
      width: 100%;
      padding-top: 75%;
      background-size: cover;
      background-position: 50% 50%; }
    section#step-3 .box .hero-preview .text {
      position: absolute;
      top: 0;
      left: 0;
      bottom: 0;
      right: 0;
      margin-top: 225px;
      margin-right: 75px;
      background: black;
      padding: 15px 10px;
      font-size: 14px;
      font-weight: 700;
      line-height: 1;
      display: -webkit-box;
      display: -webkit-flex;
      display: -moz-flex;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      -webkit-justify-content: center;
      -moz-justify-content: center;
      justify-content: center;
      -webkit-box-direction: normal;
      -webkit-box-orient: vertical;
      -webkit-flex-direction: column;
      -moz-flex-direction: column;
      -ms-flex-direction: column;
      flex-direction: column; }
      section#step-3 .box .hero-preview .text .white {
        color: white; }
      section#step-3 .box .hero-preview .text.mantis {
        color: #c452e9; }
      section#step-3 .box .hero-preview .text.rocket {
        color: #0fb2ef; }
      section#step-3 .box .hero-preview .text.starlord {
        color: #f9c718; }
      section#step-3 .box .hero-preview .text.gamora {
        color: #39b54a; }
      section#step-3 .box .hero-preview .text.groot {
        color: #6f4ddb; }
    section#step-3 .box .hero-preview .logo {
      position: absolute;
      bottom: 0;
      right: 0; }
  @media (min-width: 0px) and (max-width: 959px) {
    section#step-3 .box {
      height: initial;
      padding: 0; }
      section#step-3 .box p {
        font-size: 14px;
        line-height: 1.5;
        max-width: initial; }
      section#step-3 .box .button-bar {
        -webkit-box-direction: normal;
        -webkit-box-orient: vertical;
        -webkit-flex-direction: column;
        -moz-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        margin-top: 30px; }
        section#step-3 .box .button-bar .button-comic {
          margin: 10px;
          -moz-transform: skew(-2deg) rotate(-3deg);
          -o-transform: skew(-2deg) rotate(-3deg);
          -ms-transform: skew(-2deg) rotate(-3deg);
          -webkit-transform: skew(-2deg) rotate(-3deg);
          transform: skew(-2deg) rotate(-3deg); } }

.popup {
  z-index: 11;
  position: absolute;
  top: 0;
  left: -7.5px;
  bottom: 0;
  right: -7.5px;
  color: black; }
  .popup .inner {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    -moz-align-items: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    -moz-justify-content: center;
    justify-content: center; }
    .popup .inner.overlay {
      background: rgba(0, 0, 0, 0.6); }
  .popup .circle, .popup .comic, .popup p {
    display: inline-block; }
  .popup .circle {
    position: relative;
    bottom: 90px;
    border-radius: 50%;
    overflow: hidden;
    width: 130px;
    height: 130px; }
    .popup .circle img {
      width: 100%;
      height: 100%; }
  .popup .comic {
    margin: 0;
    position: relative; }
  .popup .starbox {
    text-align: center; }
    .popup .starbox h4 {
      margin: 0 0 55px 0; }
    .popup .starbox p {
      font-size: 22px;
      letter-spacing: .5px;
      max-width: 480px;
      margin-top: 40px;
      margin-bottom: 10px;
      line-height: 1.1;
      position: relative; }
      .es .popup .starbox p, .fr .popup .starbox p {
        font-size: 20px; }
    .popup .starbox .button-comic {
      margin: 15px 0 25px 0; }
  .popup .starbox-6 h4 {
    margin-bottom: 15px; }
  .popup .ironman, .popup .starburst, .popup .starbox {
    position: relative; }
  .popup .ironman.bg {
    display: none; }
  .popup .ironman-1 {
    right: 25%;
    bottom: 106px; }
    @media (min-width: 960px) and (max-width: 1279px) {
      .popup .ironman-1 {
        right: 31%; } }
  .popup .ironman-2 {
    left: 30%; }
    @media (min-width: 960px) and (max-width: 1279px) {
      .popup .ironman-2 {
        left: 39%; } }
  .popup .ironman-3 {
    -moz-transform: scale(-0.82, 0.82);
    -o-transform: scale(-0.82, 0.82);
    -ms-transform: scale(-0.82, 0.82);
    -webkit-transform: scale(-0.82, 0.82);
    transform: scale(-0.82, 0.82);
    right: 25%;
    top: 112px; }
    @media (min-width: 960px) and (max-width: 1279px) {
      .popup .ironman-3 {
        right: 30%; } }
  .popup .ironman-4 {
    -moz-transform: scale(-0.875, 0.875);
    -o-transform: scale(-0.875, 0.875);
    -ms-transform: scale(-0.875, 0.875);
    -webkit-transform: scale(-0.875, 0.875);
    transform: scale(-0.875, 0.875);
    left: 30%; }
    @media (min-width: 960px) and (max-width: 1279px) {
      .popup .ironman-4 {
        left: 40%; } }
  .popup .ironman-5 {
    left: 24%;
    top: 168px; }
    @media (min-width: 960px) and (max-width: 1279px) {
      .popup .ironman-5 {
        left: 32%; } }
  .popup .ironman-6 {
    left: 32%;
    bottom: 80px; }
    @media (min-width: 960px) and (max-width: 1279px) {
      .popup .ironman-6 {
        left: 41%; } }
  .popup .ironman-7 {
    right: 27%;
    bottom: 15px; }
    .popup .ironman-7.fg {
      display: none; }
    .popup .ironman-7.bg {
      display: block; }
    @media (min-width: 960px) and (max-width: 1279px) {
      .popup .ironman-7 {
        right: 35%; } }
  .popup .starburst-3 {
    bottom: 20px; }
  .popup .starburst-5 {
    left: 40px; }
  .popup .starburst-6 {
    bottom: 20px; }
  @media (min-width: 0px) and (max-width: 959px) {
    .popup .inner {
      position: fixed;
      top: 0;
      left: 0;
      bottom: 0;
      right: 0; }
    .popup .ironman {
      -moz-transform: scale(0.75, 0.75);
      -o-transform: scale(0.75, 0.75);
      -ms-transform: scale(0.75, 0.75);
      -webkit-transform: scale(0.75, 0.75);
      transform: scale(0.75, 0.75); }
    .popup .starbox {
      -moz-transform: scale(0.75, 0.75);
      -o-transform: scale(0.75, 0.75);
      -ms-transform: scale(0.75, 0.75);
      -webkit-transform: scale(0.75, 0.75);
      transform: scale(0.75, 0.75); }
      .popup .starbox h1.comic {
        font-size: 75px;
        letter-spacing: 3px; }
      .popup .starbox h4 {
        margin-top: 55px;
        margin-bottom: 25px; }
        .es .popup .starbox h4, .fr .popup .starbox h4 {
          margin-bottom: 0; }
      .popup .starbox p {
        font-size: 19px;
        line-height: 1.3;
        font-weight: 400;
        margin-top: 30px; }
        .es .popup .starbox p, .fr .popup .starbox p {
          font-size: 18px; }
      .popup .starbox .button-comic {
        -moz-transform: rotate(-3deg) scale(1.4, 1.4);
        -o-transform: rotate(-3deg) scale(1.4, 1.4);
        -ms-transform: rotate(-3deg) scale(1.4, 1.4);
        -webkit-transform: rotate(-3deg) scale(1.4, 1.4);
        transform: rotate(-3deg) scale(1.4, 1.4);
        position: relative;
        top: 50px; }
        .fr .popup .starbox .button-comic.last {
          max-width: 195px; }
    .popup .starbox-1 h4, .popup .starbox-2 h4 {
      margin-top: 20px; }
    .popup .circle {
      -moz-transform: scale(0.65, 0.65);
      -o-transform: scale(0.65, 0.65);
      -ms-transform: scale(0.65, 0.65);
      -webkit-transform: scale(0.65, 0.65);
      transform: scale(0.65, 0.65);
      bottom: 55px; }
    .popup .starburst {
      -moz-transform: none;
      -o-transform: none;
      -ms-transform: none;
      -webkit-transform: none;
      transform: none;
      object-fit: none;
      zoom: .7; }
    .popup .starburst-3 {
      left: 10px; }
    .popup .starburst-5 {
      left: 0;
      zoom: .75; }
    .popup .ironman.bg {
      display: block; }
    .popup .ironman.fg {
      display: none; }
    .popup .ironman-1 {
      -moz-transform: scale(0.6, 0.6);
      -o-transform: scale(0.6, 0.6);
      -ms-transform: scale(0.6, 0.6);
      -webkit-transform: scale(0.6, 0.6);
      transform: scale(0.6, 0.6);
      right: 1%;
      bottom: 170px; }
    .popup .ironman-2 {
      left: -3%;
      bottom: 20px;
      -moz-transform: scale(0.85, 0.85);
      -o-transform: scale(0.85, 0.85);
      -ms-transform: scale(0.85, 0.85);
      -webkit-transform: scale(0.85, 0.85);
      transform: scale(0.85, 0.85); }
    .popup .ironman-3 {
      right: 0%;
      top: 42px; }
    .popup .ironman-4 {
      left: -6%;
      bottom: 60px; }
    .popup .ironman-5 {
      left: -10%;
      top: 35px; }
    .popup .ironman-6 {
      left: -16%;
      bottom: 150px; }
    .popup .ironman-7 {
      right: -3%;
      bottom: 80px; } }

.popup.more .starburst {
  -moz-transform: scale(1.1);
  -o-transform: scale(1.1);
  -ms-transform: scale(1.1);
  -webkit-transform: scale(1.1);
  transform: scale(1.1); }
  .es .popup.more .starburst, .fr .popup.more .starburst {
    left: 35px; }

.popup.more .ironman {
  display: block;
  left: 23%; }

.popup.more .starbox h1.comic {
  max-width: 520px;
  transform: none;
  margin-bottom: 25px; }
  .es .popup.more .starbox h1.comic, .fr .popup.more .starbox h1.comic {
    max-width: 700px; }

.popup.more .starbox .popper {
  border: 2px solid black;
  width: 480px;
  padding: 8px 15px;
  margin-bottom: 8px;
  text-align: left;
  background: white;
  font-weight: bold;
  display: inline-block;
  color: black; }
  .popup.more .starbox .popper.active {
    color: white;
    background: #56caf4; }

.popup.more .starbox .button-comic {
  margin: 5px 20px 20px 10px; }

.popup.more .close {
  position: relative;
  bottom: 250px;
  left: 400px;
  width: 40px; }
  .es .popup.more .close, .fr .popup.more .close {
    left: 520px;
    left: 570px; }

/*# sourceMappingURL=vendor.49df84e0f9e15aef0140.css.map*/