/*
 * Modular Scale Ratios
 */
@font-face {
  font-style: normal;
  font-weight: normal;
  font-family: "Interstate";
  src: url("../fonts/interstate-regular.eot?iefix") format("embedded-opentype"), url("../fonts/interstate-regular.woff") format("woff"), url("../fonts/interstate-regular.ttf") format("truetype");
}

@font-face {
  font-style: normal;
  font-weight: normal;
  font-family: "Interstate Italic";
  src: url("../fonts/interstate-italic.eot?iefix") format("embedded-opentype"), url("../fonts/interstate-italic.woff") format("woff"), url("../fonts/interstate-italic.ttf") format("truetype");
}

@font-face {
  font-style: normal;
  font-weight: normal;
  font-family: "Interstate Bold";
  src: url("../fonts/interstate-bold.eot?iefix") format("embedded-opentype"), url("../fonts/interstate-bold.woff") format("woff"), url("../fonts/interstate-bold.ttf") format("truetype");
}

@font-face {
  font-style: normal;
  font-weight: normal;
  font-family: "Interstate Bold Italic";
  src: url("../fonts/interstate-bold-italic.eot?iefix") format("embedded-opentype"), url("../fonts/interstate-bold-italic.woff") format("woff"), url("../fonts/interstate-bold-italic.ttf") format("truetype");
}

@font-face {
  font-style: normal;
  font-weight: normal;
  font-family: "Interstate Bold Compressed";
  src: url("../fonts/interstate-bold-compressed.eot?iefix") format("embedded-opentype"), url("../fonts/interstate-bold-compressed.woff") format("woff"), url("../fonts/interstate-bold-compressed.ttf") format("truetype");
}

@font-face {
  font-style: normal;
  font-weight: normal;
  font-family: "Interstate Bold Condensed";
  src: url("../fonts/interstate-bold-condensed.eot?iefix") format("embedded-opentype"), url("../fonts/interstate-bold-condensed.woff") format("woff"), url("../fonts/interstate-bold-condensed.ttf") format("truetype");
}

@font-face {
  font-style: normal;
  font-weight: normal;
  font-family: "Interstate Black Italic";
  src: url("../fonts/interstate-black-italic.eot?iefix") format("embedded-opentype"), url("../fonts/interstate-black-italic.woff") format("woff"), url("../fonts/interstate-black-italic.ttf") format("truetype");
}

@font-face {
  font-style: normal;
  font-weight: normal;
  font-family: "Interstate Black Condensed";
  src: url("../fonts/interstate-black-condensed.eot?iefix") format("embedded-opentype"), url("../fonts/interstate-black-condensed.woff") format("woff"), url("../fonts/interstate-black-condensed.ttf") format("truetype");
}

@font-face {
  font-style: normal;
  font-weight: normal;
  font-family: "Interstate Light";
  src: url("../fonts/interstate-light.eot?iefix") format("embedded-opentype"), url("../fonts/interstate-light.woff") format("woff"), url("../fonts/interstate-light.ttf") format("truetype");
}

@font-face {
  font-style: normal;
  font-weight: normal;
  font-family: "Interstate Light Italic";
  src: url("../fonts/interstate-light-italic.eot?iefix") format("embedded-opentype"), url("../fonts/interstate-light-italic.woff") format("woff"), url("../fonts/interstate-light-italic.ttf") format("truetype");
}

@font-face {
  font-style: normal;
  font-weight: normal;
  font-family: "Interstate Light Compressed";
  src: url("../fonts/interstate-light-compressed.eot?iefix") format("embedded-opentype"), url("../fonts/interstate-light-compressed.woff") format("woff"), url("../fonts/interstate-light-compressed.ttf") format("truetype");
}

@font-face {
  font-style: normal;
  font-weight: normal;
  font-family: "Interstate Light Condensed";
  src: url("../fonts/interstate-light-condensed.eot?iefix") format("embedded-opentype"), url("../fonts/interstate-light-condensed.woff") format("woff"), url("../fonts/interstate-light-condensed.ttf") format("truetype");
}

@font-face {
  font-style: normal;
  font-weight: normal;
  font-family: "Chisel Extended Bold";
  src: url("../fonts/chisel-expanded-bold.eot?iefix") format("embedded-opentype"), url("../fonts/chisel-expanded-bold.woff") format("woff"), url("../fonts/chisel-expanded-bold.ttf") format("truetype");
}

@font-face {
  font-style: normal;
  font-weight: normal;
  font-family: "Open Sans";
  src: url("../fonts/open-sans-regular.eot?iefix") format("embedded-opentype"), url("../fonts/open-sans-regular.woff") format("woff"), url("../fonts/open-sans-regular.ttf") format("truetype");
}

@font-face {
  font-style: normal;
  font-weight: normal;
  font-family: "Open Sans Italic";
  src: url("../fonts/open-sans-italic.eot?iefix") format("embedded-opentype"), url("../fonts/open-sans-italic.woff") format("woff"), url("../fonts/open-sans-italic.ttf") format("truetype");
}

@font-face {
  font-style: normal;
  font-weight: normal;
  font-family: "Open Sans Bold";
  src: url("../fonts/open-sans-bold.eot?iefix") format("embedded-opentype"), url("../fonts/open-sans-bold.woff") format("woff"), url("../fonts/open-sans-bold.ttf") format("truetype");
}

@font-face {
  font-style: normal;
  font-weight: normal;
  font-family: "Open Sans Bold Italic";
  src: url("../fonts/open-sans-bold-italic.eot?iefix") format("embedded-opentype"), url("../fonts/open-sans-bold-italic.woff") format("woff"), url("../fonts/open-sans-bold-italic.ttf") format("truetype");
}

@font-face {
  font-style: normal;
  font-weight: normal;
  font-family: "Open Sans Extra Bold";
  src: url("../fonts/open-sans-extra-bold.eot?iefix") format("embedded-opentype"), url("../fonts/open-sans-extra-bold.woff") format("woff"), url("../fonts/open-sans-extra-bold.ttf") format("truetype");
}

@font-face {
  font-style: normal;
  font-weight: normal;
  font-family: "Open Sans Extra Bold Italic";
  src: url("../fonts/open-sans-extra-bold-italic.eot?iefix") format("embedded-opentype"), url("../fonts/open-sans-extra-bold-italic.woff") format("woff"), url("../fonts/open-sans-extra-bold-italic.ttf") format("truetype");
}

@font-face {
  font-style: normal;
  font-weight: normal;
  font-family: "Open Sans Semi Bold";
  src: url("../fonts/open-sans-semi-bold.eot?iefix") format("embedded-opentype"), url("../fonts/open-sans-semi-bold.woff") format("woff"), url("../fonts/open-sans-semi-bold.ttf") format("truetype");
}

@font-face {
  font-style: normal;
  font-weight: normal;
  font-family: "Open Sans Semi Bold Italic";
  src: url("../fonts/open-sans-semi-bold-italic.eot?iefix") format("embedded-opentype"), url("../fonts/open-sans-semi-bold-italic.woff") format("woff"), url("../fonts/open-sans-semi-bold-italic.ttf") format("truetype");
}

@font-face {
  font-style: normal;
  font-weight: normal;
  font-family: "Open Sans Light";
  src: url("../fonts/open-sans-light.eot?iefix") format("embedded-opentype"), url("../fonts/open-sans-light.woff") format("woff"), url("../fonts/open-sans-light.ttf") format("truetype");
}

@font-face {
  font-style: normal;
  font-weight: normal;
  font-family: "Open Sans Light Italic";
  src: url("../fonts/open-sans-light-italic.eot?iefix") format("embedded-opentype"), url("../fonts/open-sans-light-italic.woff") format("woff"), url("../fonts/open-sans-light-italic.ttf") format("truetype");
}

.main-nav a:not([class*="button"]), .sidebar__nav a:first-child, .select-section .select-section__item .select-section__item-name, .slider-controller .slide-number__active,
.slider-controller .slide-number__total {
  font-family: "Chisel Extended Bold";
}

.message__text,
.message__meta {
  font-family: "Open Sans Semi Bold";
}

@font-face {
  font-style: normal;
  font-weight: normal;
  font-family: "FontIcon";
  src: url("../fonts/font-icon.eot?iefix") format("embedded-opentype"), url("../fonts/font-icon.woff") format("woff"), url("../fonts/font-icon.ttf") format("truetype");
}

[class^="icon"],
[class*="icon"] {
  font-style: normal;
  font-variant: normal;
  font-weight: normal;
  font-family: "FontIcon";
  vertical-align: middle;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-exit-full-screen:before {
  content: "\F101";
}

.icon-full-screen:before {
  content: "\F102";
}

.icon-social-facebook:before {
  content: "\F103";
}

.icon-social-instagram:before {
  content: "\F104";
}

.icon-social-twitter:before {
  content: "\F105";
}

.icon-speech-bubble:before {
  content: "\F106";
}

/*! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css */
/**
 * 1. Set default font family to sans-serif.
 * 2. Prevent iOS and IE text size adjust after device orientation change,
 *    without disabling user zoom.
 */
html {
  font-family: sans-serif;
  /* 1 */
  -ms-text-size-adjust: 100%;
  /* 2 */
  -webkit-text-size-adjust: 100%;
  /* 2 */
}

/**
 * Remove default margin.
 */
body {
  margin: 0;
}

/* HTML5 display definitions
   ========================================================================== */
/**
 * Correct `block` display not defined for any HTML5 element in IE 8/9.
 * Correct `block` display not defined for `details` or `summary` in IE 10/11
 * and Firefox.
 * Correct `block` display not defined for `main` in IE 11.
 */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
menu,
nav,
section,
summary {
  display: block;
}

/**
 * 1. Correct `inline-block` display not defined in IE 8/9.
 * 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera.
 */
audio,
canvas,
progress,
video {
  display: inline-block;
  /* 1 */
  vertical-align: baseline;
  /* 2 */
}

/**
 * Prevent modern browsers from displaying `audio` without controls.
 * Remove excess height in iOS 5 devices.
 */
audio:not([controls]) {
  display: none;
  height: 0;
}

/**
 * Address `[hidden]` styling not present in IE 8/9/10.
 * Hide the `template` element in IE 8/9/10/11, Safari, and Firefox < 22.
 */
[hidden],
template {
  display: none;
}

/* Links
   ========================================================================== */
/**
 * Remove the gray background color from active links in IE 10.
 */
a {
  background-color: transparent;
}

/**
 * Improve readability of focused elements when they are also in an
 * active/hover state.
 */
a:active,
a:hover {
  outline: 0;
}

/* Text-level semantics
   ========================================================================== */
/**
 * Address styling not present in IE 8/9/10/11, Safari, and Chrome.
 */
abbr[title] {
  border-bottom: 1px dotted;
}

/**
 * Address style set to `bolder` in Firefox 4+, Safari, and Chrome.
 */
b,
strong {
  font-weight: bold;
}

/**
 * Address styling not present in Safari and Chrome.
 */
dfn {
  font-style: italic;
}

/**
 * Address variable `h1` font-size and margin within `section` and `article`
 * contexts in Firefox 4+, Safari, and Chrome.
 */
h1 {
  font-size: 2em;
  margin: 0.67em 0;
}

/**
 * Address styling not present in IE 8/9.
 */
mark {
  background: #ff0;
  color: #000;
}

/**
 * Address inconsistent and variable font size in all browsers.
 */
small {
  font-size: 80%;
}

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

sup {
  top: -0.5em;
}

sub {
  bottom: -0.25em;
}

/* Embedded content
   ========================================================================== */
/**
 * Remove border when inside `a` element in IE 8/9/10.
 */
img {
  border: 0;
}

/**
 * Correct overflow not hidden in IE 9/10/11.
 */
svg:not(:root) {
  overflow: hidden;
}

/* Grouping content
   ========================================================================== */
/**
 * Address margin not present in IE 8/9 and Safari.
 */
figure {
  margin: 1em 40px;
}

/**
 * Address differences between Firefox and other browsers.
 */
hr {
  box-sizing: content-box;
  height: 0;
}

/**
 * Contain overflow in all browsers.
 */
pre {
  overflow: auto;
}

/**
 * Address odd `em`-unit font size rendering in all browsers.
 */
code,
kbd,
pre,
samp {
  font-family: monospace, monospace;
  font-size: 1em;
}

/* Forms
   ========================================================================== */
/**
 * Known limitation: by default, Chrome and Safari on OS X allow very limited
 * styling of `select`, unless a `border` property is set.
 */
/**
 * 1. Correct color not being inherited.
 *    Known issue: affects color of disabled elements.
 * 2. Correct font properties not being inherited.
 * 3. Address margins set differently in Firefox 4+, Safari, and Chrome.
 */
button,
input,
optgroup,
select,
textarea {
  color: inherit;
  /* 1 */
  font: inherit;
  /* 2 */
  margin: 0;
  /* 3 */
}

/**
 * Address `overflow` set to `hidden` in IE 8/9/10/11.
 */
button {
  overflow: visible;
}

/**
 * Address inconsistent `text-transform` inheritance for `button` and `select`.
 * All other form control elements do not inherit `text-transform` values.
 * Correct `button` style inheritance in Firefox, IE 8/9/10/11, and Opera.
 * Correct `select` style inheritance in Firefox.
 */
button,
select {
  text-transform: none;
}

/**
 * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`
 *    and `video` controls.
 * 2. Correct inability to style clickable `input` types in iOS.
 * 3. Improve usability and consistency of cursor style between image-type
 *    `input` and others.
 */
button,
html input[type="button"], input[type="reset"],
input[type="submit"] {
  -webkit-appearance: button;
  /* 2 */
  cursor: pointer;
  /* 3 */
}

/**
 * Re-set default cursor for disabled elements.
 */
button[disabled],
html input[disabled] {
  cursor: default;
}

/**
 * Remove inner padding and border in Firefox 4+.
 */
button::-moz-focus-inner,
input::-moz-focus-inner {
  border: 0;
  padding: 0;
}

/**
 * Address Firefox 4+ setting `line-height` on `input` using `!important` in
 * the UA stylesheet.
 */
input {
  line-height: normal;
}

/**
 * It's recommended that you don't attempt to style these elements.
 * Firefox's implementation doesn't respect box-sizing, padding, or width.
 *
 * 1. Address box sizing set to `content-box` in IE 8/9/10.
 * 2. Remove excess padding in IE 8/9/10.
 */
input[type="checkbox"],
input[type="radio"] {
  box-sizing: border-box;
  /* 1 */
  padding: 0;
  /* 2 */
}

/**
 * Fix the cursor style for Chrome's increment/decrement buttons. For certain
 * `font-size` values of the `input`, it causes the cursor style of the
 * decrement button to change from `default` to `text`.
 */
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
  height: auto;
}

/**
 * 1. Address `appearance` set to `searchfield` in Safari and Chrome.
 * 2. Address `box-sizing` set to `border-box` in Safari and Chrome.
 */
input[type="search"] {
  -webkit-appearance: textfield;
  /* 1 */
  box-sizing: content-box;
  /* 2 */
}

/**
 * Remove inner padding and search cancel button in Safari and Chrome on OS X.
 * Safari (but not Chrome) clips the cancel button when the search input has
 * padding (and `textfield` appearance).
 */
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}

/**
 * Define consistent border, margin, and padding.
 */
fieldset {
  border: 1px solid #c0c0c0;
  margin: 0 2px;
  padding: 0.35em 0.625em 0.75em;
}

/**
 * 1. Correct `color` not being inherited in IE 8/9/10/11.
 * 2. Remove padding so people aren't caught out if they zero out fieldsets.
 */
legend {
  border: 0;
  /* 1 */
  padding: 0;
  /* 2 */
}

/**
 * Remove default vertical scrollbar in IE 8/9/10/11.
 */
textarea {
  overflow: auto;
}

/**
 * Don't inherit the `font-weight` (applied by a rule above).
 * NOTE: the default cannot safely be changed in Chrome and Safari on OS X.
 */
optgroup {
  font-weight: bold;
}

/* Tables
   ========================================================================== */
/**
 * Remove most spacing between table cells.
 */
table {
  border-collapse: collapse;
  border-spacing: 0;
}

td,
th {
  padding: 0;
}

.responsive-nav .button-open-nav, .button-full-screen,
.button-exit-full-screen,
.button-go-to-facebook,
.button-go-to-instagram,
.button-go-to-twitter, .slider-controller button {
  padding: 0;
  border: none;
  margin: 0;
  outline: 0;
  list-style: none;
  background: none;
}

.center-vertical, [data-tooltip][data-placement="right"]:before,
[data-tooltip][data-placement="right"]:after, [data-tooltip][data-placement="left"]:before,
[data-tooltip][data-placement="left"]:after {
  position: absolute !important;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}

.center-horizontal, [data-tooltip][data-placement="top"]:before,
[data-tooltip][data-placement="top"]:after, [data-tooltip][data-placement="bottom"]:before,
[data-tooltip][data-placement="bottom"]:after {
  position: absolute !important;
  left: 50%;
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translateX(-50%);
}

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

.center-both {
  position: absolute !important;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}

.group:after, .g:after, .g__col:after, .container:after, .message-group:after {
  content: "";
  display: table;
  clear: both;
}

.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip: rect(0, 0, 0, 0);
}

.hide,
.is-hide {
  display: none;
}

.show,
.is-show {
  display: none;
}

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

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

.no-padding-right {
  padding-right: 0 !important;
}

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

.no-padding-left {
  padding-left: 0 !important;
}

.no-border {
  border: 0 !important;
}

.no-border-top {
  border-top: 0 !important;
}

.no-border-right {
  border-right: 0 !important;
}

.no-border-bottom {
  border-bottom: 0 !important;
}

.no-border-left {
  border-left: 0 !important;
}

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

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

.no-margin-right {
  margin-right: 0 !important;
}

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

.no-margin-left {
  margin-left: 0 !important;
}

.no-outline {
  outline: none;
}

html, body {
  width: 100%;
  height: 100%;
  padding: 0;
  margin: 0;
}

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

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

body {
  overflow-x: hidden;
  overflow-y: scroll;
  font-size: 16px;
  font-size: 1rem;
  font-family: "Interstate";
  line-height: 1.618;
  color: #403B33;
  -webkit-overflow-scrolling: touch;
}

.g {
  margin-right: -16px;
  margin-left: -16px;
}

.g .g__col {
  padding-right: 16px;
  padding-left: 16px;
}

.g--clear {
  margin-right: 0;
  margin-left: 0;
}

.g--clear .g__col {
  padding-right: 0;
  padding-left: 0;
}

.g--separate {
  margin-bottom: 16px;
}

.g--separate2x {
  margin-bottom: 32px;
}

.g--separate3x {
  margin-bottom: 48px;
}

.g--separate4x {
  margin-bottom: 64px;
}

.g--separate5x {
  margin-bottom: 80px;
}

.g--separate6x {
  margin-bottom: 96px;
}

.g__col {
  float: left;
  position: relative;
  display: block;
  width: 100%;
  min-height: 1px;
}

.g__col--iblock {
  float: none;
  display: inline-block;
}

.g__col--top {
  vertical-align: top;
}

.g__col--middle {
  vertical-align: middle;
}

.g__col--bottom {
  vertical-align: bottom;
}

.g__col--separate {
  margin-bottom: 16px;
}

.g__col--separate2x {
  margin-bottom: 32px;
}

.g__col--separate3x {
  margin-bottom: 48px;
}

.g__col--separate4x {
  margin-bottom: 64px;
}

.g__col--separate5x {
  margin-bottom: 80px;
}

.g__col--separate6x {
  margin-bottom: 96px;
}

[class~="1/12"] {
  width: 8.3333333333%;
}

[class~="push-1/12"] {
  left: 8.3333333333%;
}

[class~="pull-1/12"] {
  right: 8.3333333333%;
}

[class~="2/12"] {
  width: 16.6666666667%;
}

[class~="push-2/12"] {
  left: 16.6666666667%;
}

[class~="pull-2/12"] {
  right: 16.6666666667%;
}

[class~="3/12"] {
  width: 25%;
}

[class~="push-3/12"] {
  left: 25%;
}

[class~="pull-3/12"] {
  right: 25%;
}

[class~="4/12"] {
  width: 33.3333333333%;
}

[class~="push-4/12"] {
  left: 33.3333333333%;
}

[class~="pull-4/12"] {
  right: 33.3333333333%;
}

[class~="5/12"] {
  width: 41.6666666667%;
}

[class~="push-5/12"] {
  left: 41.6666666667%;
}

[class~="pull-5/12"] {
  right: 41.6666666667%;
}

[class~="6/12"] {
  width: 50%;
}

[class~="push-6/12"] {
  left: 50%;
}

[class~="pull-6/12"] {
  right: 50%;
}

[class~="7/12"] {
  width: 58.3333333333%;
}

[class~="push-7/12"] {
  left: 58.3333333333%;
}

[class~="pull-7/12"] {
  right: 58.3333333333%;
}

[class~="8/12"] {
  width: 66.6666666667%;
}

[class~="push-8/12"] {
  left: 66.6666666667%;
}

[class~="pull-8/12"] {
  right: 66.6666666667%;
}

[class~="9/12"] {
  width: 75%;
}

[class~="push-9/12"] {
  left: 75%;
}

[class~="pull-9/12"] {
  right: 75%;
}

[class~="10/12"] {
  width: 83.3333333333%;
}

[class~="push-10/12"] {
  left: 83.3333333333%;
}

[class~="pull-10/12"] {
  right: 83.3333333333%;
}

[class~="11/12"] {
  width: 91.6666666667%;
}

[class~="push-11/12"] {
  left: 91.6666666667%;
}

[class~="pull-11/12"] {
  right: 91.6666666667%;
}

.show-phone {
  display: none;
}

.hide-phone {
  display: block;
}

.show-tablet {
  display: none;
}

.hide-tablet {
  display: block;
}

.show-laptop {
  display: none;
}

.hide-laptop {
  display: block;
}

.show-desktop {
  display: none;
}

.hide-desktop {
  display: block;
}

.center-vertical-phone {
  position: static !important;
  top: 0;
  -webkit-transform: translateY(0);
  -ms-transform: translateY(0);
  transform: translateY(0);
}

.center-horizontal-phone {
  position: static !important;
  left: 0;
  -webkit-transform: translateX(0);
  -ms-transform: translateX(0);
  transform: translateX(0);
}

.center-both-phone {
  position: static !important;
  top: 0;
  left: 0;
  -webkit-transform: translate(0, 0);
  -ms-transform: translate(0, 0);
  transform: translate(0, 0);
}

.no-center-vertical-phone {
  position: absolute !important;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}

.no-center-horizontal-phone {
  position: absolute !important;
  left: 50%;
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translateX(-50%);
}

.no-center-both-phone {
  position: absolute !important;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}

.center-vertical-tablet {
  position: static !important;
  top: 0;
  -webkit-transform: translateY(0);
  -ms-transform: translateY(0);
  transform: translateY(0);
}

.center-horizontal-tablet {
  position: static !important;
  left: 0;
  -webkit-transform: translateX(0);
  -ms-transform: translateX(0);
  transform: translateX(0);
}

.center-both-tablet {
  position: static !important;
  top: 0;
  left: 0;
  -webkit-transform: translate(0, 0);
  -ms-transform: translate(0, 0);
  transform: translate(0, 0);
}

.no-center-vertical-tablet {
  position: absolute !important;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}

.no-center-horizontal-tablet {
  position: absolute !important;
  left: 50%;
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translateX(-50%);
}

.no-center-both-tablet {
  position: absolute !important;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}

.center-vertical-laptop {
  position: static !important;
  top: 0;
  -webkit-transform: translateY(0);
  -ms-transform: translateY(0);
  transform: translateY(0);
}

.center-horizontal-laptop {
  position: static !important;
  left: 0;
  -webkit-transform: translateX(0);
  -ms-transform: translateX(0);
  transform: translateX(0);
}

.center-both-laptop {
  position: static !important;
  top: 0;
  left: 0;
  -webkit-transform: translate(0, 0);
  -ms-transform: translate(0, 0);
  transform: translate(0, 0);
}

.no-center-vertical-laptop {
  position: absolute !important;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}

.no-center-horizontal-laptop {
  position: absolute !important;
  left: 50%;
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translateX(-50%);
}

.no-center-both-laptop {
  position: absolute !important;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}

.center-vertical-desktop {
  position: static !important;
  top: 0;
  -webkit-transform: translateY(0);
  -ms-transform: translateY(0);
  transform: translateY(0);
}

.center-horizontal-desktop {
  position: static !important;
  left: 0;
  -webkit-transform: translateX(0);
  -ms-transform: translateX(0);
  transform: translateX(0);
}

.center-both-desktop {
  position: static !important;
  top: 0;
  left: 0;
  -webkit-transform: translate(0, 0);
  -ms-transform: translate(0, 0);
  transform: translate(0, 0);
}

.no-center-vertical-desktop {
  position: absolute !important;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}

.no-center-horizontal-desktop {
  position: absolute !important;
  left: 50%;
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translateX(-50%);
}

.no-center-both-desktop {
  position: absolute !important;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}

@media (min-width: 320px) {
  [class~="phone-1/12"] {
    width: 8.3333333333%;
  }
  [class~="phone-push-1/12"] {
    left: 8.3333333333%;
  }
  [class~="phone-pull-1/12"] {
    right: 8.3333333333%;
  }
  [class~="phone-2/12"] {
    width: 16.6666666667%;
  }
  [class~="phone-push-2/12"] {
    left: 16.6666666667%;
  }
  [class~="phone-pull-2/12"] {
    right: 16.6666666667%;
  }
  [class~="phone-3/12"] {
    width: 25%;
  }
  [class~="phone-push-3/12"] {
    left: 25%;
  }
  [class~="phone-pull-3/12"] {
    right: 25%;
  }
  [class~="phone-4/12"] {
    width: 33.3333333333%;
  }
  [class~="phone-push-4/12"] {
    left: 33.3333333333%;
  }
  [class~="phone-pull-4/12"] {
    right: 33.3333333333%;
  }
  [class~="phone-5/12"] {
    width: 41.6666666667%;
  }
  [class~="phone-push-5/12"] {
    left: 41.6666666667%;
  }
  [class~="phone-pull-5/12"] {
    right: 41.6666666667%;
  }
  [class~="phone-6/12"] {
    width: 50%;
  }
  [class~="phone-push-6/12"] {
    left: 50%;
  }
  [class~="phone-pull-6/12"] {
    right: 50%;
  }
  [class~="phone-7/12"] {
    width: 58.3333333333%;
  }
  [class~="phone-push-7/12"] {
    left: 58.3333333333%;
  }
  [class~="phone-pull-7/12"] {
    right: 58.3333333333%;
  }
  [class~="phone-8/12"] {
    width: 66.6666666667%;
  }
  [class~="phone-push-8/12"] {
    left: 66.6666666667%;
  }
  [class~="phone-pull-8/12"] {
    right: 66.6666666667%;
  }
  [class~="phone-9/12"] {
    width: 75%;
  }
  [class~="phone-push-9/12"] {
    left: 75%;
  }
  [class~="phone-pull-9/12"] {
    right: 75%;
  }
  [class~="phone-10/12"] {
    width: 83.3333333333%;
  }
  [class~="phone-push-10/12"] {
    left: 83.3333333333%;
  }
  [class~="phone-pull-10/12"] {
    right: 83.3333333333%;
  }
  [class~="phone-11/12"] {
    width: 91.6666666667%;
  }
  [class~="phone-push-11/12"] {
    left: 91.6666666667%;
  }
  [class~="phone-pull-11/12"] {
    right: 91.6666666667%;
  }
  .show-phone {
    display: block;
  }
  .hide-phone {
    display: none;
  }
  .show-tablet {
    display: none;
  }
  .hide-tablet {
    display: block;
  }
  .show-laptop {
    display: none;
  }
  .hide-laptop {
    display: block;
  }
  .show-desktop {
    display: none;
  }
  .hide-desktop {
    display: block;
  }
  .center-vertical-phone {
    position: absolute !important;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
  }
  .center-horizontal-phone {
    position: absolute !important;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
  }
  .center-both-phone {
    position: absolute !important;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
  }
  .no-center-vertical-phone {
    position: static !important;
    top: 0;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
  .no-center-horizontal-phone {
    position: static !important;
    left: 0;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
  .no-center-both-phone {
    position: static !important;
    top: 0;
    left: 0;
    -webkit-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    transform: translate(0, 0);
  }
  .center-vertical-tablet {
    position: static !important;
    top: 0;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
  .center-horizontal-tablet {
    position: static !important;
    left: 0;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
  .center-both-tablet {
    position: static !important;
    top: 0;
    left: 0;
    -webkit-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    transform: translate(0, 0);
  }
  .no-center-vertical-tablet {
    position: absolute !important;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
  }
  .no-center-horizontal-tablet {
    position: absolute !important;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
  }
  .no-center-both-tablet {
    position: absolute !important;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
  }
  .center-vertical-laptop {
    position: static !important;
    top: 0;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
  .center-horizontal-laptop {
    position: static !important;
    left: 0;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
  .center-both-laptop {
    position: static !important;
    top: 0;
    left: 0;
    -webkit-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    transform: translate(0, 0);
  }
  .no-center-vertical-laptop {
    position: absolute !important;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
  }
  .no-center-horizontal-laptop {
    position: absolute !important;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
  }
  .no-center-both-laptop {
    position: absolute !important;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
  }
  .center-vertical-desktop {
    position: static !important;
    top: 0;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
  .center-horizontal-desktop {
    position: static !important;
    left: 0;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
  .center-both-desktop {
    position: static !important;
    top: 0;
    left: 0;
    -webkit-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    transform: translate(0, 0);
  }
  .no-center-vertical-desktop {
    position: absolute !important;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
  }
  .no-center-horizontal-desktop {
    position: absolute !important;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
  }
  .no-center-both-desktop {
    position: absolute !important;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
  }
}

@media (min-width: 768px) {
  [class~="tablet-1/12"] {
    width: 8.3333333333%;
  }
  [class~="tablet-push-1/12"] {
    left: 8.3333333333%;
  }
  [class~="tablet-pull-1/12"] {
    right: 8.3333333333%;
  }
  [class~="tablet-2/12"] {
    width: 16.6666666667%;
  }
  [class~="tablet-push-2/12"] {
    left: 16.6666666667%;
  }
  [class~="tablet-pull-2/12"] {
    right: 16.6666666667%;
  }
  [class~="tablet-3/12"] {
    width: 25%;
  }
  [class~="tablet-push-3/12"] {
    left: 25%;
  }
  [class~="tablet-pull-3/12"] {
    right: 25%;
  }
  [class~="tablet-4/12"] {
    width: 33.3333333333%;
  }
  [class~="tablet-push-4/12"] {
    left: 33.3333333333%;
  }
  [class~="tablet-pull-4/12"] {
    right: 33.3333333333%;
  }
  [class~="tablet-5/12"] {
    width: 41.6666666667%;
  }
  [class~="tablet-push-5/12"] {
    left: 41.6666666667%;
  }
  [class~="tablet-pull-5/12"] {
    right: 41.6666666667%;
  }
  [class~="tablet-6/12"] {
    width: 50%;
  }
  [class~="tablet-push-6/12"] {
    left: 50%;
  }
  [class~="tablet-pull-6/12"] {
    right: 50%;
  }
  [class~="tablet-7/12"] {
    width: 58.3333333333%;
  }
  [class~="tablet-push-7/12"] {
    left: 58.3333333333%;
  }
  [class~="tablet-pull-7/12"] {
    right: 58.3333333333%;
  }
  [class~="tablet-8/12"] {
    width: 66.6666666667%;
  }
  [class~="tablet-push-8/12"] {
    left: 66.6666666667%;
  }
  [class~="tablet-pull-8/12"] {
    right: 66.6666666667%;
  }
  [class~="tablet-9/12"] {
    width: 75%;
  }
  [class~="tablet-push-9/12"] {
    left: 75%;
  }
  [class~="tablet-pull-9/12"] {
    right: 75%;
  }
  [class~="tablet-10/12"] {
    width: 83.3333333333%;
  }
  [class~="tablet-push-10/12"] {
    left: 83.3333333333%;
  }
  [class~="tablet-pull-10/12"] {
    right: 83.3333333333%;
  }
  [class~="tablet-11/12"] {
    width: 91.6666666667%;
  }
  [class~="tablet-push-11/12"] {
    left: 91.6666666667%;
  }
  [class~="tablet-pull-11/12"] {
    right: 91.6666666667%;
  }
  .show-tablet {
    display: block;
  }
  .hide-tablet {
    display: none;
  }
  .show-phone {
    display: none;
  }
  .hide-phone {
    display: block;
  }
  .show-laptop {
    display: none;
  }
  .hide-laptop {
    display: block;
  }
  .show-desktop {
    display: none;
  }
  .hide-desktop {
    display: block;
  }
  .center-vertical-tablet {
    position: absolute !important;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
  }
  .center-horizontal-tablet {
    position: absolute !important;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
  }
  .center-both-tablet {
    position: absolute !important;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
  }
  .no-center-vertical-tablet {
    position: static !important;
    top: 0;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
  .no-center-horizontal-tablet {
    position: static !important;
    left: 0;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
  .no-center-both-tablet {
    position: static !important;
    top: 0;
    left: 0;
    -webkit-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    transform: translate(0, 0);
  }
  .center-vertical-phone {
    position: static !important;
    top: 0;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
  .center-horizontal-phone {
    position: static !important;
    left: 0;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
  .center-both-phone {
    position: static !important;
    top: 0;
    left: 0;
    -webkit-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    transform: translate(0, 0);
  }
  .no-center-vertical-phone {
    position: absolute !important;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
  }
  .no-center-horizontal-phone {
    position: absolute !important;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
  }
  .no-center-both-phone {
    position: absolute !important;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
  }
  .center-vertical-laptop {
    position: static !important;
    top: 0;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
  .center-horizontal-laptop {
    position: static !important;
    left: 0;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
  .center-both-laptop {
    position: static !important;
    top: 0;
    left: 0;
    -webkit-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    transform: translate(0, 0);
  }
  .no-center-vertical-laptop {
    position: absolute !important;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
  }
  .no-center-horizontal-laptop {
    position: absolute !important;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
  }
  .no-center-both-laptop {
    position: absolute !important;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
  }
  .center-vertical-desktop {
    position: static !important;
    top: 0;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
  .center-horizontal-desktop {
    position: static !important;
    left: 0;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
  .center-both-desktop {
    position: static !important;
    top: 0;
    left: 0;
    -webkit-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    transform: translate(0, 0);
  }
  .no-center-vertical-desktop {
    position: absolute !important;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
  }
  .no-center-horizontal-desktop {
    position: absolute !important;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
  }
  .no-center-both-desktop {
    position: absolute !important;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
  }
}

@media (min-width: 992px) {
  [class~="laptop-1/12"] {
    width: 8.3333333333%;
  }
  [class~="laptop-push-1/12"] {
    left: 8.3333333333%;
  }
  [class~="laptop-pull-1/12"] {
    right: 8.3333333333%;
  }
  [class~="laptop-2/12"] {
    width: 16.6666666667%;
  }
  [class~="laptop-push-2/12"] {
    left: 16.6666666667%;
  }
  [class~="laptop-pull-2/12"] {
    right: 16.6666666667%;
  }
  [class~="laptop-3/12"] {
    width: 25%;
  }
  [class~="laptop-push-3/12"] {
    left: 25%;
  }
  [class~="laptop-pull-3/12"] {
    right: 25%;
  }
  [class~="laptop-4/12"] {
    width: 33.3333333333%;
  }
  [class~="laptop-push-4/12"] {
    left: 33.3333333333%;
  }
  [class~="laptop-pull-4/12"] {
    right: 33.3333333333%;
  }
  [class~="laptop-5/12"] {
    width: 41.6666666667%;
  }
  [class~="laptop-push-5/12"] {
    left: 41.6666666667%;
  }
  [class~="laptop-pull-5/12"] {
    right: 41.6666666667%;
  }
  [class~="laptop-6/12"] {
    width: 50%;
  }
  [class~="laptop-push-6/12"] {
    left: 50%;
  }
  [class~="laptop-pull-6/12"] {
    right: 50%;
  }
  [class~="laptop-7/12"] {
    width: 58.3333333333%;
  }
  [class~="laptop-push-7/12"] {
    left: 58.3333333333%;
  }
  [class~="laptop-pull-7/12"] {
    right: 58.3333333333%;
  }
  [class~="laptop-8/12"] {
    width: 66.6666666667%;
  }
  [class~="laptop-push-8/12"] {
    left: 66.6666666667%;
  }
  [class~="laptop-pull-8/12"] {
    right: 66.6666666667%;
  }
  [class~="laptop-9/12"] {
    width: 75%;
  }
  [class~="laptop-push-9/12"] {
    left: 75%;
  }
  [class~="laptop-pull-9/12"] {
    right: 75%;
  }
  [class~="laptop-10/12"] {
    width: 83.3333333333%;
  }
  [class~="laptop-push-10/12"] {
    left: 83.3333333333%;
  }
  [class~="laptop-pull-10/12"] {
    right: 83.3333333333%;
  }
  [class~="laptop-11/12"] {
    width: 91.6666666667%;
  }
  [class~="laptop-push-11/12"] {
    left: 91.6666666667%;
  }
  [class~="laptop-pull-11/12"] {
    right: 91.6666666667%;
  }
  .show-laptop {
    display: block;
  }
  .hide-laptop {
    display: none;
  }
  .show-phone {
    display: none;
  }
  .hide-phone {
    display: block;
  }
  .show-tablet {
    display: none;
  }
  .hide-tablet {
    display: block;
  }
  .show-desktop {
    display: none;
  }
  .hide-desktop {
    display: block;
  }
  .center-vertical-laptop {
    position: absolute !important;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
  }
  .center-horizontal-laptop {
    position: absolute !important;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
  }
  .center-both-laptop {
    position: absolute !important;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
  }
  .no-center-vertical-laptop {
    position: static !important;
    top: 0;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
  .no-center-horizontal-laptop {
    position: static !important;
    left: 0;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
  .no-center-both-laptop {
    position: static !important;
    top: 0;
    left: 0;
    -webkit-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    transform: translate(0, 0);
  }
  .center-vertical-phone {
    position: static !important;
    top: 0;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
  .center-horizontal-phone {
    position: static !important;
    left: 0;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
  .center-both-phone {
    position: static !important;
    top: 0;
    left: 0;
    -webkit-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    transform: translate(0, 0);
  }
  .no-center-vertical-phone {
    position: absolute !important;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
  }
  .no-center-horizontal-phone {
    position: absolute !important;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
  }
  .no-center-both-phone {
    position: absolute !important;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
  }
  .center-vertical-tablet {
    position: static !important;
    top: 0;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
  .center-horizontal-tablet {
    position: static !important;
    left: 0;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
  .center-both-tablet {
    position: static !important;
    top: 0;
    left: 0;
    -webkit-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    transform: translate(0, 0);
  }
  .no-center-vertical-tablet {
    position: absolute !important;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
  }
  .no-center-horizontal-tablet {
    position: absolute !important;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
  }
  .no-center-both-tablet {
    position: absolute !important;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
  }
  .center-vertical-desktop {
    position: static !important;
    top: 0;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
  .center-horizontal-desktop {
    position: static !important;
    left: 0;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
  .center-both-desktop {
    position: static !important;
    top: 0;
    left: 0;
    -webkit-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    transform: translate(0, 0);
  }
  .no-center-vertical-desktop {
    position: absolute !important;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
  }
  .no-center-horizontal-desktop {
    position: absolute !important;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
  }
  .no-center-both-desktop {
    position: absolute !important;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
  }
}

@media (min-width: 1200px) {
  [class~="desktop-1/12"] {
    width: 8.3333333333%;
  }
  [class~="desktop-push-1/12"] {
    left: 8.3333333333%;
  }
  [class~="desktop-pull-1/12"] {
    right: 8.3333333333%;
  }
  [class~="desktop-2/12"] {
    width: 16.6666666667%;
  }
  [class~="desktop-push-2/12"] {
    left: 16.6666666667%;
  }
  [class~="desktop-pull-2/12"] {
    right: 16.6666666667%;
  }
  [class~="desktop-3/12"] {
    width: 25%;
  }
  [class~="desktop-push-3/12"] {
    left: 25%;
  }
  [class~="desktop-pull-3/12"] {
    right: 25%;
  }
  [class~="desktop-4/12"] {
    width: 33.3333333333%;
  }
  [class~="desktop-push-4/12"] {
    left: 33.3333333333%;
  }
  [class~="desktop-pull-4/12"] {
    right: 33.3333333333%;
  }
  [class~="desktop-5/12"] {
    width: 41.6666666667%;
  }
  [class~="desktop-push-5/12"] {
    left: 41.6666666667%;
  }
  [class~="desktop-pull-5/12"] {
    right: 41.6666666667%;
  }
  [class~="desktop-6/12"] {
    width: 50%;
  }
  [class~="desktop-push-6/12"] {
    left: 50%;
  }
  [class~="desktop-pull-6/12"] {
    right: 50%;
  }
  [class~="desktop-7/12"] {
    width: 58.3333333333%;
  }
  [class~="desktop-push-7/12"] {
    left: 58.3333333333%;
  }
  [class~="desktop-pull-7/12"] {
    right: 58.3333333333%;
  }
  [class~="desktop-8/12"] {
    width: 66.6666666667%;
  }
  [class~="desktop-push-8/12"] {
    left: 66.6666666667%;
  }
  [class~="desktop-pull-8/12"] {
    right: 66.6666666667%;
  }
  [class~="desktop-9/12"] {
    width: 75%;
  }
  [class~="desktop-push-9/12"] {
    left: 75%;
  }
  [class~="desktop-pull-9/12"] {
    right: 75%;
  }
  [class~="desktop-10/12"] {
    width: 83.3333333333%;
  }
  [class~="desktop-push-10/12"] {
    left: 83.3333333333%;
  }
  [class~="desktop-pull-10/12"] {
    right: 83.3333333333%;
  }
  [class~="desktop-11/12"] {
    width: 91.6666666667%;
  }
  [class~="desktop-push-11/12"] {
    left: 91.6666666667%;
  }
  [class~="desktop-pull-11/12"] {
    right: 91.6666666667%;
  }
  .show-desktop {
    display: block;
  }
  .hide-desktop {
    display: none;
  }
  .show-phone {
    display: none;
  }
  .hide-phone {
    display: block;
  }
  .show-tablet {
    display: none;
  }
  .hide-tablet {
    display: block;
  }
  .show-laptop {
    display: none;
  }
  .hide-laptop {
    display: block;
  }
  .center-vertical-desktop {
    position: absolute !important;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
  }
  .center-horizontal-desktop {
    position: absolute !important;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
  }
  .center-both-desktop {
    position: absolute !important;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
  }
  .no-center-vertical-desktop {
    position: static !important;
    top: 0;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
  .no-center-horizontal-desktop {
    position: static !important;
    left: 0;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
  .no-center-both-desktop {
    position: static !important;
    top: 0;
    left: 0;
    -webkit-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    transform: translate(0, 0);
  }
  .center-vertical-phone {
    position: static !important;
    top: 0;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
  .center-horizontal-phone {
    position: static !important;
    left: 0;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
  .center-both-phone {
    position: static !important;
    top: 0;
    left: 0;
    -webkit-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    transform: translate(0, 0);
  }
  .no-center-vertical-phone {
    position: absolute !important;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
  }
  .no-center-horizontal-phone {
    position: absolute !important;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
  }
  .no-center-both-phone {
    position: absolute !important;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
  }
  .center-vertical-tablet {
    position: static !important;
    top: 0;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
  .center-horizontal-tablet {
    position: static !important;
    left: 0;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
  .center-both-tablet {
    position: static !important;
    top: 0;
    left: 0;
    -webkit-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    transform: translate(0, 0);
  }
  .no-center-vertical-tablet {
    position: absolute !important;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
  }
  .no-center-horizontal-tablet {
    position: absolute !important;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
  }
  .no-center-both-tablet {
    position: absolute !important;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
  }
  .center-vertical-laptop {
    position: static !important;
    top: 0;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
  .center-horizontal-laptop {
    position: static !important;
    left: 0;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
  .center-both-laptop {
    position: static !important;
    top: 0;
    left: 0;
    -webkit-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    transform: translate(0, 0);
  }
  .no-center-vertical-laptop {
    position: absolute !important;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
  }
  .no-center-horizontal-laptop {
    position: absolute !important;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
  }
  .no-center-both-laptop {
    position: absolute !important;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
  }
}

.page {
  position: relative;
  display: none;
}

.page__name {
  float: left;
  max-width: 226px;
  height: 32px;
  padding-right: 8px;
  padding-left: 4px;
  margin-bottom: 0;
  background-color: #000000;
  font-size: 14px;
  font-size: 0.875rem;
  line-height: 32px;
  color: #FFFFFF;
}

.page,
.page__content {
  width: 100%;
  min-height: 100%;
}

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

@media (min-width: 400px) {
  .page__name {
    max-width: 320px;
  }
}

@media (min-width: 768px) {
  .page__name {
    display: none;
  }
}

.container {
  position: relative;
  width: 100%;
  max-width: 1232px;
  padding-right: 16px;
  padding-left: 16px;
  margin-right: auto;
  margin-left: auto;
}

.container--wide {
  max-width: 100%;
}

header {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 2;
  line-height: 1;
}

.responsive-nav {
  position: relative;
  display: inline-block;
  padding: 4px;
  background-color: #000000;
}

.responsive-nav .button-open-nav {
  position: relative;
  display: block;
  width: 20px;
  height: 24px;
  z-index: 1;
}

.responsive-nav .button-open-nav i {
  position: relative;
  -webkit-transition: background-color 0.25s ease;
  transition: background-color 0.25s ease;
}

.responsive-nav .button-open-nav i,
.responsive-nav .button-open-nav i:before,
.responsive-nav .button-open-nav i:after {
  display: block;
  width: 100%;
  height: 4px;
  background-color: #FFFFFF;
}

.responsive-nav .button-open-nav i:before,
.responsive-nav .button-open-nav i:after,
.responsive-nav .button-open-nav i:before:before,
.responsive-nav .button-open-nav i:before:after,
.responsive-nav .button-open-nav i:after:before,
.responsive-nav .button-open-nav i:after:after {
  position: absolute;
  content: '';
}

.responsive-nav .button-open-nav i:before,
.responsive-nav .button-open-nav i:before:before,
.responsive-nav .button-open-nav i:after:before {
  top: -200%;
}

.responsive-nav .button-open-nav i:after,
.responsive-nav .button-open-nav i:before:after,
.responsive-nav .button-open-nav i:after:after {
  bottom: -200%;
}

.responsive-nav .button-open-nav i:before {
  -webkit-transition: top 0.25s ease, transform 0.25s ease, background-color 0.25s ease;
  transition: top 0.25s ease, transform 0.25s ease, background-color 0.25s ease;
}

.responsive-nav .button-open-nav i:after {
  -webkit-transition: bottom 0.25s ease, transform 0.25s ease, background-color 0.25s ease;
  transition: bottom 0.25s ease, transform 0.25s ease, background-color 0.25s ease;
}

.responsive-nav .button-open-nav.is-open i:before,
.responsive-nav .button-open-nav.is-open i:after {
  background-color: #FFFFFF;
}

.responsive-nav .button-open-nav.is-open i {
  background-color: transparent;
}

.responsive-nav .button-open-nav.is-open i:before {
  top: 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}

.responsive-nav .button-open-nav.is-open i:after {
  bottom: 0;
  -webkit-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

.responsive-nav--left {
  float: left;
}

.responsive-nav--left nav {
  left: 0;
}

.responsive-nav--right {
  float: right;
}

.responsive-nav--right nav {
  right: 0;
}

.responsive-nav nav {
  position: absolute;
  top: 0;
  display: none;
  width: 208px;
  z-index: 0;
  padding-top: 32px;
  padding-bottom: 16px;
  background-color: #000000;
}

.responsive-nav nav button, .responsive-nav nav .button,
.responsive-nav nav a {
  display: block;
  width: 100%;
}

.responsive-nav .dropdown {
  padding: 0;
}

.responsive-nav .dropdown__toggle {
  width: 100%;
  color: #FFFFFF;
  text-decoration: none;
  text-align: left;
  outline: 0;
  -webkit-transition: all 0.5s ease;
  transition: all 0.5s ease;
}

.responsive-nav .dropdown__list {
  display: none;
}

.responsive-nav .dropdown__list a {
  display: block;
  padding-left: 25.888px;
  padding-right: 25.888px;
}

.main-nav {
  display: none;
}

.button-full-screen,
.button-exit-full-screen,
.button-go-to-facebook,
.button-go-to-instagram,
.button-go-to-twitter {
  display: inline-block;
  background-color: #000000;
}

.button-full-screen svg,
.button-exit-full-screen svg,
.button-go-to-facebook svg,
.button-go-to-instagram svg,
.button-go-to-twitter svg {
  display: block;
  fill: #FFFFFF;
}

.button-full-screen:hover,
.button-exit-full-screen:hover,
.button-go-to-facebook:hover,
.button-go-to-instagram:hover,
.button-go-to-twitter:hover {
  background-color: #FFFFFF;
}

.button-full-screen:hover svg,
.button-exit-full-screen:hover svg,
.button-go-to-facebook:hover svg,
.button-go-to-instagram:hover svg,
.button-go-to-twitter:hover svg {
  fill: #000000;
}

@media (min-width: 768px) {
  header {
    padding-top: 16px;
  }
  .responsive-nav {
    display: none;
  }
  .main-nav {
    display: inline-block;
  }
  .main-nav a:not([class*="button"]),
  .main-nav button:not([class*="button"]),
  .main-nav [class*="button"] {
    vertical-align: middle;
  }
  .main-nav button:not([class*="button"]) + button:not([class*="button"]),
  .main-nav [class*="button"] + [class*="button"] {
    margin-left: 8px;
  }
  .main-nav button:not([class*="button"]):first-child,
  .main-nav [class*="button"]:first-child {
    margin-left: 0;
  }
  .main-nav button:not([class*="button"]):last-child,
  .main-nav [class*="button"]:last-child {
    margin-right: 0;
  }
  .main-nav a:not([class*="button"]) {
    padding-right: 16px;
    padding-left: 16px;
    font-size: 14px;
    font-size: 0.875rem;
  }
  .main-nav a:not([class*="button"]) + a {
    position: relative;
  }
  .main-nav a:not([class*="button"]) + a:before {
    position: absolute;
    top: 0;
    left: -0.5px;
    content: "";
    display: block;
    width: 1px;
    height: 100%;
    background-color: #000000;
  }
  .main-nav a:not([class*="button"]):first-child {
    padding-left: 0;
  }
  .main-nav a:not([class*="button"]):last-child {
    padding-right: 0;
  }
  .button-full-screen,
  .button-exit-full-screen,
  .button-go-to-facebook,
  .button-go-to-instagram,
  .button-go-to-twitter {
    padding: 4px;
  }
  .button-full-screen svg,
  .button-exit-full-screen svg,
  .button-go-to-facebook svg,
  .button-go-to-instagram svg,
  .button-go-to-twitter svg {
    width: 16px;
    height: 16px;
  }
}

footer {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
  width: 100%;
}

.sidebar {
  display: none;
}

.sidebar {
  position: absolute;
  top: 0;
  z-index: 1;
  display: block;
  min-width: 1px;
  min-height: 100%;
}

.sidebar__nav {
  position: absolute;
  top: 50%;
  width: 320px;
}

.sidebar__nav--rotate-counter-clockwise {
  -webkit-transform: rotate(-90deg) translateX(-50%);
  -ms-transform: rotate(-90deg) translateX(-50%);
  transform: rotate(-90deg) translateX(-50%);
  -webkit-transform-origin: left top;
  -ms-transform-origin: left top;
  transform-origin: left top;
}

.sidebar__nav a {
  position: relative;
  display: block;
  padding: 4px 8px;
}

.sidebar__nav a:first-child {
  z-index: 1;
  background-color: #000000;
  font-size: 21px;
  font-size: 1.3125rem;
  letter-spacing: 6px;
  letter-spacing: 0.375rem;
  text-align: center;
  color: #A29386;
}

.sidebar__nav a.box-primary:first-child {
  background-color: #009BA2;
  color: #FFFFFF;
}

.sidebar__nav a.box-secondary:first-child {
  background-color: #4F8B0D;
  color: #FFFFFF;
}

.sidebar__nav a.box-tertiary:first-child {
  background-color: #A29386;
  color: #FFFFFF;
}

.sidebar__nav a.is-active {
  text-align: center;
}

.sidebar__nav a:not(:first-child):not(.is-active) {
  text-align: left;
}

.sidebar__nav a:not(:first-child) {
  z-index: 0;
  border-right-width: 1px;
  border-right-style: solid;
  border-bottom-width: 1px;
  border-bottom-style: solid;
  border-left-width: 1px;
  border-left-style: solid;
  border-color: #000000;
  background-color: #FFFFFF;
  color: #000000;
}

.sidebar__nav a:not(:first-child):hover {
  border-color: #000000;
  background-color: #000000;
  color: #FFFFFF;
}

.sidebar__nav a.box-primary:not(:first-child) {
  border-color: #009BA2;
  color: #009BA2;
}

.sidebar__nav a.box-primary:not(:first-child):hover {
  border-color: #009BA2;
  background-color: #009BA2;
  color: #FFFFFF;
}

.sidebar__nav a.box-secondary:not(:first-child) {
  border-color: #4F8B0D;
  color: #4F8B0D;
}

.sidebar__nav a.box-secondary:not(:first-child):hover {
  border-color: #4F8B0D;
  background-color: #4F8B0D;
  color: #FFFFFF;
}

.sidebar__nav a.box-tertiary:not(:first-child) {
  border-color: #A29386;
  color: #A29386;
}

.sidebar__nav a.box-tertiary:not(:first-child):hover {
  border-color: #A29386;
  background-color: #A29386;
  color: #FFFFFF;
}

.sidebar--left {
  left: 0;
}

.sidebar--right {
  right: 0;
}

.select-section {
  width: 100%;
  overflow: hidden;
}

.select-section .select-section__item {
  position: relative;
  float: left;
  overflow: hidden;
  cursor: pointer;
}

.select-section .select-section__item .select-section__item-name {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  margin: 0;
  letter-spacing: 4px;
  letter-spacing: 0.25rem;
}

.select-section .select-section__item:nth-child(1) {
  background-color: #006600;
}

.select-section .select-section__item:nth-child(1) .select-section__item-name {
  color: #ECE7DF;
}

.select-section .select-section__item:nth-child(2) {
  background-color: #0000FF;
}

.select-section .select-section__item:nth-child(2) .select-section__item-name {
  color: #A29386;
}

.select-section .select-section__item:nth-child(3) {
  background-color: #003366;
}

.select-section .select-section__item:nth-child(3) .select-section__item-name {
  color: #A29386;
}

.emoji-1 {
  display: inline-block;
  width: 20px;
  height: 20px;
  background-position: -130px -20px;
  background-image: url("../img/sprite.png");
  background-repeat: no-repeat;
  vertical-align: text-top;
}

@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
  .emoji-1 {
    background-size: 170px 150px;
    background-image: url("../img/sprite-2x.png");
  }
}

.emoji-2 {
  display: inline-block;
  width: 20px;
  height: 20px;
  background-position: -20px -110px;
  background-image: url("../img/sprite.png");
  background-repeat: no-repeat;
  vertical-align: text-top;
}

@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
  .emoji-2 {
    background-size: 170px 150px;
    background-image: url("../img/sprite-2x.png");
  }
}

.emoji-3 {
  display: inline-block;
  width: 20px;
  height: 20px;
  background-position: 0px -130px;
  background-image: url("../img/sprite.png");
  background-repeat: no-repeat;
  vertical-align: text-top;
}

@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
  .emoji-3 {
    background-size: 170px 150px;
    background-image: url("../img/sprite-2x.png");
  }
}

.emoji-4 {
  display: inline-block;
  width: 20px;
  height: 20px;
  background-position: -150px -20px;
  background-image: url("../img/sprite.png");
  background-repeat: no-repeat;
  vertical-align: text-top;
}

@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
  .emoji-4 {
    background-size: 170px 150px;
    background-image: url("../img/sprite-2x.png");
  }
}

.emoji-5 {
  display: inline-block;
  width: 20px;
  height: 20px;
  background-position: -150px -40px;
  background-image: url("../img/sprite.png");
  background-repeat: no-repeat;
  vertical-align: text-top;
}

@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
  .emoji-5 {
    background-size: 170px 150px;
    background-image: url("../img/sprite-2x.png");
  }
}

.emoji-6 {
  display: inline-block;
  width: 20px;
  height: 20px;
  background-position: -150px -60px;
  background-image: url("../img/sprite.png");
  background-repeat: no-repeat;
  vertical-align: text-top;
}

@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
  .emoji-6 {
    background-size: 170px 150px;
    background-image: url("../img/sprite-2x.png");
  }
}

.emoji-7 {
  display: inline-block;
  width: 20px;
  height: 20px;
  background-position: -150px -80px;
  background-image: url("../img/sprite.png");
  background-repeat: no-repeat;
  vertical-align: text-top;
}

@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
  .emoji-7 {
    background-size: 170px 150px;
    background-image: url("../img/sprite-2x.png");
  }
}

.emoji-8 {
  display: inline-block;
  width: 20px;
  height: 20px;
  background-position: -150px -100px;
  background-image: url("../img/sprite.png");
  background-repeat: no-repeat;
  vertical-align: text-top;
}

@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
  .emoji-8 {
    background-size: 170px 150px;
    background-image: url("../img/sprite-2x.png");
  }
}

.emoji-9 {
  display: inline-block;
  width: 20px;
  height: 20px;
  background-position: 0px -90px;
  background-image: url("../img/sprite.png");
  background-repeat: no-repeat;
  vertical-align: text-top;
}

@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
  .emoji-9 {
    background-size: 170px 150px;
    background-image: url("../img/sprite-2x.png");
  }
}

.emoji-10 {
  display: inline-block;
  width: 20px;
  height: 20px;
  background-position: -20px -90px;
  background-image: url("../img/sprite.png");
  background-repeat: no-repeat;
  vertical-align: text-top;
}

@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
  .emoji-10 {
    background-size: 170px 150px;
    background-image: url("../img/sprite-2x.png");
  }
}

.emoji-11 {
  display: inline-block;
  width: 20px;
  height: 20px;
  background-position: -40px -90px;
  background-image: url("../img/sprite.png");
  background-repeat: no-repeat;
  vertical-align: text-top;
}

@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
  .emoji-11 {
    background-size: 170px 150px;
    background-image: url("../img/sprite-2x.png");
  }
}

.emoji-12 {
  display: inline-block;
  width: 20px;
  height: 20px;
  background-position: -60px -90px;
  background-image: url("../img/sprite.png");
  background-repeat: no-repeat;
  vertical-align: text-top;
}

@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
  .emoji-12 {
    background-size: 170px 150px;
    background-image: url("../img/sprite-2x.png");
  }
}

.emoji-13 {
  display: inline-block;
  width: 20px;
  height: 20px;
  background-position: -80px -90px;
  background-image: url("../img/sprite.png");
  background-repeat: no-repeat;
  vertical-align: text-top;
}

@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
  .emoji-13 {
    background-size: 170px 150px;
    background-image: url("../img/sprite-2x.png");
  }
}

.emoji-14 {
  display: inline-block;
  width: 20px;
  height: 20px;
  background-position: -110px 0px;
  background-image: url("../img/sprite.png");
  background-repeat: no-repeat;
  vertical-align: text-top;
}

@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
  .emoji-14 {
    background-size: 170px 150px;
    background-image: url("../img/sprite-2x.png");
  }
}

.emoji-15 {
  display: inline-block;
  width: 20px;
  height: 20px;
  background-position: -110px -20px;
  background-image: url("../img/sprite.png");
  background-repeat: no-repeat;
  vertical-align: text-top;
}

@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
  .emoji-15 {
    background-size: 170px 150px;
    background-image: url("../img/sprite-2x.png");
  }
}

.emoji-16 {
  display: inline-block;
  width: 20px;
  height: 20px;
  background-position: -110px -40px;
  background-image: url("../img/sprite.png");
  background-repeat: no-repeat;
  vertical-align: text-top;
}

@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
  .emoji-16 {
    background-size: 170px 150px;
    background-image: url("../img/sprite-2x.png");
  }
}

.emoji-17 {
  display: inline-block;
  width: 20px;
  height: 20px;
  background-position: -110px -60px;
  background-image: url("../img/sprite.png");
  background-repeat: no-repeat;
  vertical-align: text-top;
}

@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
  .emoji-17 {
    background-size: 170px 150px;
    background-image: url("../img/sprite-2x.png");
  }
}

.emoji-18 {
  display: inline-block;
  width: 20px;
  height: 20px;
  background-position: -110px -80px;
  background-image: url("../img/sprite.png");
  background-repeat: no-repeat;
  vertical-align: text-top;
}

@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
  .emoji-18 {
    background-size: 170px 150px;
    background-image: url("../img/sprite-2x.png");
  }
}

.emoji-19 {
  display: inline-block;
  width: 20px;
  height: 20px;
  background-position: 0px -110px;
  background-image: url("../img/sprite.png");
  background-repeat: no-repeat;
  vertical-align: text-top;
}

@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
  .emoji-19 {
    background-size: 170px 150px;
    background-image: url("../img/sprite-2x.png");
  }
}

.emoji-20 {
  display: inline-block;
  width: 20px;
  height: 20px;
  background-position: -40px -110px;
  background-image: url("../img/sprite.png");
  background-repeat: no-repeat;
  vertical-align: text-top;
}

@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
  .emoji-20 {
    background-size: 170px 150px;
    background-image: url("../img/sprite-2x.png");
  }
}

.emoji-21 {
  display: inline-block;
  width: 20px;
  height: 20px;
  background-position: -60px -110px;
  background-image: url("../img/sprite.png");
  background-repeat: no-repeat;
  vertical-align: text-top;
}

@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
  .emoji-21 {
    background-size: 170px 150px;
    background-image: url("../img/sprite-2x.png");
  }
}

.emoji-22 {
  display: inline-block;
  width: 20px;
  height: 20px;
  background-position: -80px -110px;
  background-image: url("../img/sprite.png");
  background-repeat: no-repeat;
  vertical-align: text-top;
}

@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
  .emoji-22 {
    background-size: 170px 150px;
    background-image: url("../img/sprite-2x.png");
  }
}

.emoji-23 {
  display: inline-block;
  width: 20px;
  height: 20px;
  background-position: -100px -110px;
  background-image: url("../img/sprite.png");
  background-repeat: no-repeat;
  vertical-align: text-top;
}

@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
  .emoji-23 {
    background-size: 170px 150px;
    background-image: url("../img/sprite-2x.png");
  }
}

.emoji-24 {
  display: inline-block;
  width: 20px;
  height: 20px;
  background-position: -130px 0px;
  background-image: url("../img/sprite.png");
  background-repeat: no-repeat;
  vertical-align: text-top;
}

@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
  .emoji-24 {
    background-size: 170px 150px;
    background-image: url("../img/sprite-2x.png");
  }
}

.emoji-25 {
  display: inline-block;
  width: 20px;
  height: 20px;
  background-position: -150px -120px;
  background-image: url("../img/sprite.png");
  background-repeat: no-repeat;
  vertical-align: text-top;
}

@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
  .emoji-25 {
    background-size: 170px 150px;
    background-image: url("../img/sprite-2x.png");
  }
}

.emoji-26 {
  display: inline-block;
  width: 20px;
  height: 20px;
  background-position: -130px -40px;
  background-image: url("../img/sprite.png");
  background-repeat: no-repeat;
  vertical-align: text-top;
}

@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
  .emoji-26 {
    background-size: 170px 150px;
    background-image: url("../img/sprite-2x.png");
  }
}

.emoji-27 {
  display: inline-block;
  width: 20px;
  height: 20px;
  background-position: -130px -60px;
  background-image: url("../img/sprite.png");
  background-repeat: no-repeat;
  vertical-align: text-top;
}

@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
  .emoji-27 {
    background-size: 170px 150px;
    background-image: url("../img/sprite-2x.png");
  }
}

.emoji-28 {
  display: inline-block;
  width: 20px;
  height: 20px;
  background-position: -130px -80px;
  background-image: url("../img/sprite.png");
  background-repeat: no-repeat;
  vertical-align: text-top;
}

@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
  .emoji-28 {
    background-size: 170px 150px;
    background-image: url("../img/sprite-2x.png");
  }
}

.emoji-29 {
  display: inline-block;
  width: 20px;
  height: 20px;
  background-position: -130px -100px;
  background-image: url("../img/sprite.png");
  background-repeat: no-repeat;
  vertical-align: text-top;
}

@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
  .emoji-29 {
    background-size: 170px 150px;
    background-image: url("../img/sprite-2x.png");
  }
}

.emoji-30 {
  display: inline-block;
  width: 20px;
  height: 20px;
  background-position: -20px -130px;
  background-image: url("../img/sprite.png");
  background-repeat: no-repeat;
  vertical-align: text-top;
}

@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
  .emoji-30 {
    background-size: 170px 150px;
    background-image: url("../img/sprite-2x.png");
  }
}

.emoji-31 {
  display: inline-block;
  width: 20px;
  height: 20px;
  background-position: -40px -130px;
  background-image: url("../img/sprite.png");
  background-repeat: no-repeat;
  vertical-align: text-top;
}

@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
  .emoji-31 {
    background-size: 170px 150px;
    background-image: url("../img/sprite-2x.png");
  }
}

.emoji-32 {
  display: inline-block;
  width: 20px;
  height: 20px;
  background-position: -60px -130px;
  background-image: url("../img/sprite.png");
  background-repeat: no-repeat;
  vertical-align: text-top;
}

@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
  .emoji-32 {
    background-size: 170px 150px;
    background-image: url("../img/sprite-2x.png");
  }
}

.emoji-33 {
  display: inline-block;
  width: 20px;
  height: 20px;
  background-position: -80px -130px;
  background-image: url("../img/sprite.png");
  background-repeat: no-repeat;
  vertical-align: text-top;
}

@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
  .emoji-33 {
    background-size: 170px 150px;
    background-image: url("../img/sprite-2x.png");
  }
}

.emoji-34 {
  display: inline-block;
  width: 20px;
  height: 20px;
  background-position: -100px -130px;
  background-image: url("../img/sprite.png");
  background-repeat: no-repeat;
  vertical-align: text-top;
}

@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
  .emoji-34 {
    background-size: 170px 150px;
    background-image: url("../img/sprite-2x.png");
  }
}

.emoji-35 {
  display: inline-block;
  width: 20px;
  height: 20px;
  background-position: -120px -130px;
  background-image: url("../img/sprite.png");
  background-repeat: no-repeat;
  vertical-align: text-top;
}

@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
  .emoji-35 {
    background-size: 170px 150px;
    background-image: url("../img/sprite-2x.png");
  }
}

.emoji-36 {
  display: inline-block;
  width: 20px;
  height: 20px;
  background-position: -150px 0px;
  background-image: url("../img/sprite.png");
  background-repeat: no-repeat;
  vertical-align: text-top;
}

@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
  .emoji-36 {
    background-size: 170px 150px;
    background-image: url("../img/sprite-2x.png");
  }
}

@media (min-width: 768px) {
  .select-section__item-name {
    display: none;
  }
}

#map-canvas {
  position: absolute;
  width: 100%;
  height: 50%;
}

.contact-options {
  position: absolute;
  top: 50%;
  width: 100%;
  height: auto;
  padding-top: 64px;
}

.address-box address {
  font-style: normal;
  font-size: 14px;
  font-size: 0.875rem;
  text-align: center;
}

.type-2 .absolute-img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.type-2 .container {
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(255, 255, 255, 0.9);
}

@media (min-width: 768px) {
  .swipe-help-left,
  .swipe-help-right {
    display: none;
  }
  .type-2 .absolute-img {
    width: 50%;
    min-height: 100%;
    height: 100%;
  }
  .type-2 .container {
    width: 50%;
    height: 100%;
    background-color: #FFFFFF;
  }
  .type-2 p {
    padding-right: 42px;
  }
}

.button-floor-plans {
  position: absolute;
  bottom: 20px;
  right: 20px;
  display: none;
  width: 110px;
  height: 90px;
  background-position: 0px 0px;
  background-image: url("../img/sprite.png");
  background-repeat: no-repeat;
}

@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
  .button-floor-plans {
    background-size: 170px 150px;
    background-image: url("../img/sprite-2x.png");
  }
}

.swipe-help-left,
.swipe-help-right {
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  z-index: 100;
  width: 50px;
  height: 50px;
  fill: #b3a695;
  opacity: 0.8;
}

.swipe-help-left {
  left: 10px;
}

.swipe-help-right {
  right: 10px;
}

.input-group {
  margin-bottom: 25.888px;
}

.input-group--inline > * {
  display: inline-block !important;
  vertical-align: middle;
}

label,
.label {
  display: block;
}

input[type="text"],
input[type="password"],
input[type="datetime"],
input[type="datetime-local"],
input[type="date"],
input[type="month"],
input[type="time"],
input[type="week"],
input[type="number"],
input[type="email"],
input[type="url"],
input[type="search"],
input[type="tel"],
input[type="color"],
textarea,
select,
.text-field {
  display: block;
  width: 100%;
  padding: 6.472px 12.944px;
  border: 2px solid #b8ada3;
  outline: 0;
  font-size: 16px;
  font-size: 1rem;
  color: inherit;
}

input[type="text"]:focus,
input[type="password"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="time"]:focus,
input[type="week"]:focus,
input[type="number"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="search"]:focus,
input[type="tel"]:focus,
input[type="color"]:focus,
textarea:focus,
select:focus,
.text-field:focus,
input[type="text"]:active,
input[type="password"]:active,
input[type="datetime"]:active,
input[type="datetime-local"]:active,
input[type="date"]:active,
input[type="month"]:active,
input[type="time"]:active,
input[type="week"]:active,
input[type="number"]:active,
input[type="email"]:active,
input[type="url"]:active,
input[type="search"]:active,
input[type="tel"]:active,
input[type="color"]:active,
textarea:active,
select:active,
.text-field:active {
  border-color: #000000;
  background-color: #FFFFFF;
}

input[readonly][type="text"],
input[readonly][type="password"],
input[readonly][type="datetime"],
input[readonly][type="datetime-local"],
input[readonly][type="date"],
input[readonly][type="month"],
input[readonly][type="time"],
input[readonly][type="week"],
input[readonly][type="number"],
input[readonly][type="email"],
input[readonly][type="url"],
input[readonly][type="search"],
input[readonly][type="tel"],
input[readonly][type="color"],
textarea[readonly],
select[readonly],
[readonly].text-field, input.readonly[type="text"],
input.readonly[type="password"],
input.readonly[type="datetime"],
input.readonly[type="datetime-local"],
input.readonly[type="date"],
input.readonly[type="month"],
input.readonly[type="time"],
input.readonly[type="week"],
input.readonly[type="number"],
input.readonly[type="email"],
input.readonly[type="url"],
input.readonly[type="search"],
input.readonly[type="tel"],
input.readonly[type="color"],
textarea.readonly,
select.readonly,
.readonly.text-field, input.is-readonly[type="text"],
input.is-readonly[type="password"],
input.is-readonly[type="datetime"],
input.is-readonly[type="datetime-local"],
input.is-readonly[type="date"],
input.is-readonly[type="month"],
input.is-readonly[type="time"],
input.is-readonly[type="week"],
input.is-readonly[type="number"],
input.is-readonly[type="email"],
input.is-readonly[type="url"],
input.is-readonly[type="search"],
input.is-readonly[type="tel"],
input.is-readonly[type="color"],
textarea.is-readonly,
select.is-readonly,
.is-readonly.text-field {
  border-color: #BDBDBD;
  background-color: #E0E0E0;
  cursor: default;
}

input.is-error[type="text"],
input.is-error[type="password"],
input.is-error[type="datetime"],
input.is-error[type="datetime-local"],
input.is-error[type="date"],
input.is-error[type="month"],
input.is-error[type="time"],
input.is-error[type="week"],
input.is-error[type="number"],
input.is-error[type="email"],
input.is-error[type="url"],
input.is-error[type="search"],
input.is-error[type="tel"],
input.is-error[type="color"],
textarea.is-error,
select.is-error,
.is-error.text-field {
  border-color: #E53935;
}

.custom-checkbox,
.custom-radio {
  margin-bottom: 6.472px;
}

.custom-checkbox label span:first-child,
.custom-radio label span:first-child {
  margin-right: 6.472px;
}

.custom-checkbox input[type="checkbox"] {
  display: none;
}

.custom-checkbox label {
  cursor: pointer;
}

.custom-checkbox label span:first-child,
.custom-checkbox label span:last-child {
  display: inline-block;
  vertical-align: middle;
}

.custom-radio input[type="radio"] {
  display: none;
}

.custom-radio label {
  cursor: pointer;
}

.custom-radio label span:first-child,
.custom-radio label span:last-child {
  display: inline-block;
  vertical-align: middle;
}

.button-default, .button-success, .button-danger, .button-warning, .button-info, .button-primary, .button-secondary, .button-tertiary {
  padding: 6.472px 12.944px;
  border: none;
  outline: none;
  font-size: 16px;
  font-size: 1rem;
  text-align: center;
  line-height: normal;
  cursor: pointer;
  apperance: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.button-default,
.button-success,
.button-danger,
.button-warning,
.button-info,
.button-primary,
.button-secondary,
.button-tertiary,
.button-default:hover,
.button-success:hover,
.button-danger:hover,
.button-warning:hover,
.button-info:hover,
.button-primary:hover,
.button-secondary:hover,
.button-tertiary:hover,
.is-active.button-default, .is-active.button-success, .is-active.button-danger, .is-active.button-warning, .is-active.button-info, .is-active.button-primary, .is-active.button-secondary, .is-active.button-tertiary {
  text-decoration: none;
}

.button-default:disabled, .button-success:disabled, .button-danger:disabled, .button-warning:disabled, .button-info:disabled, .button-primary:disabled, .button-secondary:disabled, .button-tertiary:disabled, .is-disable.button-default, .is-disable.button-success, .is-disable.button-danger, .is-disable.button-warning, .is-disable.button-info, .is-disable.button-primary, .is-disable.button-secondary, .is-disable.button-tertiary {
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
  opacity: 0.5;
  cursor: default;
}

input[type="submit"],
input[type="reset"],
input[type="button"],
button,
[class*="button"] {
  cursor: pointer;
}

.button-default {
  background-color: #000000;
  color: #FFFFFF;
}

.button-default:hover,
.button-default.is-active {
  background-color: #FFFFFF;
  color: #000000;
}

.button-default:disabled:hover,
.button-default:disabled.is-active, .button-default.is-disable:hover,
.button-default.is-disable.is-active {
  background-color: #000000;
  color: #FFFFFF;
}

.button-default--reverse {
  background-color: #FFFFFF;
  color: #000000;
}

.button-default--reverse:hover,
.button-default--reverse.is-active {
  background-color: #000000;
  color: #FFFFFF;
}

.button-default--reverse:disabled:hover,
.button-default--reverse:disabled:focus,
.button-default--reverse:disabled:active, .button-default--reverse:disabled.active, .button-default--reverse:disabled.is-active, .button-default--reverse.is-disable:hover,
.button-default--reverse.is-disable:focus,
.button-default--reverse.is-disable:active, .button-default--reverse.is-disable.active, .button-default--reverse.is-disable.is-active {
  background-color: #FFFFFF;
  color: #000000;
}

.button-success {
  background-color: #7CB342;
  color: #FFFFFF;
}

.button-success:hover,
.button-success.is-active {
  background-color: #FFFFFF;
  color: #7CB342;
}

.button-success:disabled:hover,
.button-success:disabled.is-active, .button-success.is-disable:hover,
.button-success.is-disable.is-active {
  background-color: #7CB342;
  color: #FFFFFF;
}

.button-success--reverse {
  background-color: #FFFFFF;
  color: #7CB342;
}

.button-success--reverse:hover,
.button-success--reverse.is-active {
  background-color: #7CB342;
  color: #FFFFFF;
}

.button-success--reverse:disabled:hover,
.button-success--reverse:disabled:focus,
.button-success--reverse:disabled:active, .button-success--reverse:disabled.active, .button-success--reverse:disabled.is-active, .button-success--reverse.is-disable:hover,
.button-success--reverse.is-disable:focus,
.button-success--reverse.is-disable:active, .button-success--reverse.is-disable.active, .button-success--reverse.is-disable.is-active {
  background-color: #FFFFFF;
  color: #7CB342;
}

.button-danger {
  background-color: #E53935;
  color: #FFFFFF;
}

.button-danger:hover,
.button-danger.is-active {
  background-color: #FFFFFF;
  color: #E53935;
}

.button-danger:disabled:hover,
.button-danger:disabled.is-active, .button-danger.is-disable:hover,
.button-danger.is-disable.is-active {
  background-color: #E53935;
  color: #FFFFFF;
}

.button-danger--reverse {
  background-color: #FFFFFF;
  color: #E53935;
}

.button-danger--reverse:hover,
.button-danger--reverse.is-active {
  background-color: #E53935;
  color: #FFFFFF;
}

.button-danger--reverse:disabled:hover,
.button-danger--reverse:disabled:focus,
.button-danger--reverse:disabled:active, .button-danger--reverse:disabled.active, .button-danger--reverse:disabled.is-active, .button-danger--reverse.is-disable:hover,
.button-danger--reverse.is-disable:focus,
.button-danger--reverse.is-disable:active, .button-danger--reverse.is-disable.active, .button-danger--reverse.is-disable.is-active {
  background-color: #FFFFFF;
  color: #E53935;
}

.button-warning {
  background-color: #FDD835;
  color: #FFFFFF;
}

.button-warning:hover,
.button-warning.is-active {
  background-color: #FFFFFF;
  color: #FDD835;
}

.button-warning:disabled:hover,
.button-warning:disabled.is-active, .button-warning.is-disable:hover,
.button-warning.is-disable.is-active {
  background-color: #FDD835;
  color: #FFFFFF;
}

.button-warning--reverse {
  background-color: #FFFFFF;
  color: #FDD835;
}

.button-warning--reverse:hover,
.button-warning--reverse.is-active {
  background-color: #FDD835;
  color: #FFFFFF;
}

.button-warning--reverse:disabled:hover,
.button-warning--reverse:disabled:focus,
.button-warning--reverse:disabled:active, .button-warning--reverse:disabled.active, .button-warning--reverse:disabled.is-active, .button-warning--reverse.is-disable:hover,
.button-warning--reverse.is-disable:focus,
.button-warning--reverse.is-disable:active, .button-warning--reverse.is-disable.active, .button-warning--reverse.is-disable.is-active {
  background-color: #FFFFFF;
  color: #FDD835;
}

.button-info {
  background-color: #1E88E5;
  color: #FFFFFF;
}

.button-info:hover,
.button-info.is-active {
  background-color: #FFFFFF;
  color: #1E88E5;
}

.button-info:disabled:hover,
.button-info:disabled.is-active, .button-info.is-disable:hover,
.button-info.is-disable.is-active {
  background-color: #1E88E5;
  color: #FFFFFF;
}

.button-info--reverse {
  background-color: #FFFFFF;
  color: #1E88E5;
}

.button-info--reverse:hover,
.button-info--reverse.is-active {
  background-color: #1E88E5;
  color: #FFFFFF;
}

.button-info--reverse:disabled:hover,
.button-info--reverse:disabled:focus,
.button-info--reverse:disabled:active, .button-info--reverse:disabled.active, .button-info--reverse:disabled.is-active, .button-info--reverse.is-disable:hover,
.button-info--reverse.is-disable:focus,
.button-info--reverse.is-disable:active, .button-info--reverse.is-disable.active, .button-info--reverse.is-disable.is-active {
  background-color: #FFFFFF;
  color: #1E88E5;
}

.button-primary {
  background-color: #009BA2;
  color: #FFFFFF;
}

.button-primary:hover,
.button-primary.is-active {
  background-color: #FFFFFF;
  color: #009BA2;
}

.button-primary:disabled:hover,
.button-primary:disabled.is-active, .button-primary.is-disable:hover,
.button-primary.is-disable.is-active {
  background-color: #009BA2;
  color: #FFFFFF;
}

.button-primary--reverse {
  background-color: #FFFFFF;
  color: #009BA2;
}

.button-primary--reverse:hover,
.button-primary--reverse.is-active {
  background-color: #009BA2;
  color: #FFFFFF;
}

.button-primary--reverse:disabled:hover,
.button-primary--reverse:disabled:focus,
.button-primary--reverse:disabled:active, .button-primary--reverse:disabled.active, .button-primary--reverse:disabled.is-active, .button-primary--reverse.is-disable:hover,
.button-primary--reverse.is-disable:focus,
.button-primary--reverse.is-disable:active, .button-primary--reverse.is-disable.active, .button-primary--reverse.is-disable.is-active {
  background-color: #FFFFFF;
  color: #009BA2;
}

.button-secondary {
  background-color: #4F8B0D;
  color: #FFFFFF;
}

.button-secondary:hover,
.button-secondary.is-active {
  background-color: #FFFFFF;
  color: #4F8B0D;
}

.button-secondary:disabled:hover,
.button-secondary:disabled.is-active, .button-secondary.is-disable:hover,
.button-secondary.is-disable.is-active {
  background-color: #4F8B0D;
  color: #FFFFFF;
}

.button-secondary--reverse {
  background-color: #FFFFFF;
  color: #4F8B0D;
}

.button-secondary--reverse:hover,
.button-secondary--reverse.is-active {
  background-color: #4F8B0D;
  color: #FFFFFF;
}

.button-secondary--reverse:disabled:hover,
.button-secondary--reverse:disabled:focus,
.button-secondary--reverse:disabled:active, .button-secondary--reverse:disabled.active, .button-secondary--reverse:disabled.is-active, .button-secondary--reverse.is-disable:hover,
.button-secondary--reverse.is-disable:focus,
.button-secondary--reverse.is-disable:active, .button-secondary--reverse.is-disable.active, .button-secondary--reverse.is-disable.is-active {
  background-color: #FFFFFF;
  color: #4F8B0D;
}

.button-tertiary {
  background-color: #A29386;
  color: #403B33;
}

.button-tertiary:hover,
.button-tertiary.is-active {
  background-color: #403B33;
  color: #A29386;
}

.button-tertiary:disabled:hover,
.button-tertiary:disabled.is-active, .button-tertiary.is-disable:hover,
.button-tertiary.is-disable.is-active {
  background-color: #A29386;
  color: #403B33;
}

.button-tertiary--reverse {
  background-color: #403B33;
  color: #A29386;
}

.button-tertiary--reverse:hover,
.button-tertiary--reverse.is-active {
  background-color: #A29386;
  color: #403B33;
}

.button-tertiary--reverse:disabled:hover,
.button-tertiary--reverse:disabled:focus,
.button-tertiary--reverse:disabled:active, .button-tertiary--reverse:disabled.active, .button-tertiary--reverse:disabled.is-active, .button-tertiary--reverse.is-disable:hover,
.button-tertiary--reverse.is-disable:focus,
.button-tertiary--reverse.is-disable:active, .button-tertiary--reverse.is-disable.active, .button-tertiary--reverse.is-disable.is-active {
  background-color: #403B33;
  color: #A29386;
}

.button--block {
  display: block;
  width: 100%;
}

.button--large {
  font-size: 20px;
  font-size: 1.25rem;
}

.button--medium {
  font-size: 18px;
  font-size: 1.125rem;
}

.button--small {
  font-size: 14px;
  font-size: 0.875rem;
}

a {
  display: inline-block;
  padding: 2px;
  cursor: pointer;
  color: #403B33;
}

nav a {
  text-decoration: none;
}

p a {
  color: #000000;
  text-decoration: none;
}

p a:hover {
  text-decoration: underline;
}

a.link-primary {
  color: #009BA2;
}

a.link-secondary {
  color: #4F8B0D;
}

a.link-tertiary {
  color: #A29386;
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
  margin-top: 0;
  margin-bottom: 12.944px;
  font-weight: 700;
  line-height: 1.2;
}

h6, .h6 {
  font-size: 19.2px;
  font-size: 1.2rem;
}

h5, .h5 {
  font-size: 23.04px;
  font-size: 1.44rem;
}

h4, .h4 {
  font-size: 27.648px;
  font-size: 1.728rem;
}

h3, .h3 {
  font-size: 33.1776px;
  font-size: 2.0736rem;
}

h2, .h2 {
  font-size: 39.81312px;
  font-size: 2.48832rem;
}

h1, .h1 {
  font-size: 47.775744px;
  font-size: 2.985984rem;
}

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

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

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

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

.text-break {
  word-break: break-all;
}

.text-nowrap, [data-tooltip]:before {
  white-space: nowrap;
}

.text-lowercase {
  text-transform: lowercase;
}

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

.text-capitalize {
  text-transform: capitalize;
}

.page__name, .responsive-nav nav button, .responsive-nav nav .button,
.responsive-nav nav a, .sidebar__nav a {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.hide-text {
  font: 0/0 a;
  color: transparent;
  text-shadow: none;
}

.text-white {
  color: #FFFFFF;
}

.text-black {
  color: #403B33;
}

.text-gray {
  color: #BDBDBD;
}

.text-success {
  color: #7CB342;
}

.text-danger {
  color: #E53935;
}

.text-warning {
  color: #FDD835;
}

.text-info {
  color: #1E88E5;
}

.text-primary {
  color: #009BA2;
}

.text-secondary {
  color: #4F8B0D;
}

.text-tertiary {
  color: #A29386;
}

p,
.p {
  margin-top: 0;
  margin-bottom: 12.944px;
}

ol,
ul {
  list-style-position: outside;
  padding-left: 25.888px;
}

dl {
  padding-left: 25.888px;
}

dl dt {
  font-weight: 700;
}

.img-responsive,
.img-map-responsive {
  display: block;
  max-width: 100%;
  height: auto;
}

.img-wide-responsive {
  display: block;
  width: 100%;
  height: auto;
}

#loader {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 32px;
  height: 32px;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  background-image: url("../img/loader.gif");
  background-position: 50% 50%;
  background-repeat: no-repeat;
}

[data-tooltip] {
  position: relative;
}

[data-tooltip]:before,
[data-tooltip]:after {
  position: absolute;
  z-index: 9999;
  display: none;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
  opacity: 0.8;
}

[data-tooltip]:before {
  content: attr(data-tooltip);
  padding: 6.472px 12.944px;
  border-radius: 4px;
  background: #403B33;
  color: #FFFFFF;
}

[data-tooltip]:after {
  content: '';
  width: 0;
  height: 0;
}

[data-tooltip]:hover:before,
[data-tooltip]:hover:after {
  display: block;
}

[data-tooltip][data-placement="top"]:before,
[data-tooltip][data-placement="top"]:after {
  bottom: 100%;
}

[data-tooltip][data-placement="top"]:before {
  margin-bottom: 10px;
}

[data-tooltip][data-placement="top"]:after {
  border-top: 8px solid #403B33;
  border-right: 8px solid transparent;
  border-left: 8px solid transparent;
  margin-bottom: 2px;
}

[data-tooltip][data-placement="right"]:before,
[data-tooltip][data-placement="right"]:after {
  left: 100%;
}

[data-tooltip][data-placement="right"]:before {
  margin-left: 10px;
}

[data-tooltip][data-placement="right"]:after {
  border-top: 8px solid transparent;
  border-right: 8px solid #403B33;
  border-bottom: 8px solid transparent;
  margin-left: 2px;
}

[data-tooltip][data-placement="bottom"]:before,
[data-tooltip][data-placement="bottom"]:after {
  top: 100%;
}

[data-tooltip][data-placement="bottom"]:before {
  margin-top: 10px;
}

[data-tooltip][data-placement="bottom"]:after {
  border-bottom: 8px solid #403B33;
  border-right: 8px solid transparent;
  border-left: 8px solid transparent;
  margin-top: 2px;
}

[data-tooltip][data-placement="left"]:before,
[data-tooltip][data-placement="left"]:after {
  right: 100%;
}

[data-tooltip][data-placement="left"]:before {
  margin-right: 10px;
}

[data-tooltip][data-placement="left"]:after {
  border-top: 8px solid transparent;
  border-bottom: 8px solid transparent;
  border-left: 8px solid #403B33;
  margin-right: 2px;
}

.slider,
.slider__item {
  position: absolute;
  width: 100%;
  min-height: 100%;
}

.slider-controller {
  position: absolute;
  top: 50%;
  right: 0;
  display: none;
  height: 320px;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}

.slider-controller button {
  display: block;
  height: 50%;
}

.slider-controller button svg {
  width: 32px;
  height: 32px;
  fill: #FFFFFF;
}

.slider-controller .slide-number {
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  text-align: center;
}

.slider-controller .slide-number,
.slider-controller .slide-number__active,
.slider-controller .slide-number__total {
  width: 100%;
}

.slider-controller .slide-number__active,
.slider-controller .slide-number__total {
  display: block;
  font-size: 18px;
  font-size: 1.125rem;
  color: #FFFFFF;
}

.slider-controller .slide-number__total {
  position: relative;
}

.slider-controller .slide-number__total:before {
  position: absolute;
  top: 0;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  content: "";
  display: block;
  width: 100%;
  height: 2px;
  background-color: #FFFFFF;
}

.slider-controller--primary {
  background-color: #009BA2;
}

.slider-controller--secondary {
  background-color: #4F8B0D;
}

.slider-controller--tertiary {
  background-color: #A29386;
}

@media (min-width: 768px) {
  .slider-controller {
    display: block;
  }
}

.conversation {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  display: none !important;
  width: 288px;
  padding-left: 8px;
  padding-right: 8px;
}

@media (min-width: 768px) {
  .conversation {
    left: 100%;
    -webkit-transform: translate(calc(-100% + (-96px)), -50%);
    -ms-transform: translate(calc(-100% + (-96px)), -50%);
    transform: translate(calc(-100% + (-96px)), -50%);
  }
}

.message-group {
  display: none;
}

.message-group + .message-group {
  margin-top: 8px;
}

.message {
  position: relative;
  padding: 8px;
}

.message + .message {
  margin-top: 4px;
}

.message__image {
  display: block;
}

.message__text {
  padding-right: 56px;
  margin: 0;
  font-size: 14px;
  font-size: 0.875rem;
}

.message__meta {
  position: absolute;
  right: 0;
  bottom: 0;
  display: inline-block;
  font-size: 12px;
  font-size: 0.75rem;
  line-height: 1;
}

.message__meta-datetime,
.message__meta-check,
.message__meta-double-check {
  display: inline-block;
  vertical-align: middle;
}

.message__meta-datetime + *,
.message__meta-check + *,
.message__meta-double-check + * {
  margin-left: 4px;
}

.message__meta-check svg,
.message__meta-double-check svg {
  display: block;
  width: 16px;
  height: 16px;
}

.message__meta-check.is-seen svg,
.message__meta-double-check.is-seen svg {
  fill: #66CCFF !important;
}

.message__image + .message__meta {
  -webkit-transform: translate(-24%, -48%);
  -ms-transform: translate(-24%, -48%);
  transform: translate(-24%, -48%);
}

.message__image + .message__meta .message__meta-datetime {
  color: #FFFFFF;
}

.message__image + .message__meta .message__meta-check svg,
.message__image + .message__meta .message__meta-double-check svg {
  fill: #FFFFFF;
}

.message__text + .message__meta {
  -webkit-transform: translate(-16%, -24%);
  -ms-transform: translate(-16%, -24%);
  transform: translate(-16%, -24%);
}

.message__text + .message__meta .message__meta-datetime {
  color: rgba(0, 0, 0, 0.46);
}

.message__text + .message__meta .message__meta-check svg,
.message__text + .message__meta .message__meta-double-check svg {
  fill: rgba(0, 0, 0, 0.46);
}

.message--in,
.message--out {
  color: #262626;
}

.message--in:not(:first-child),
.message--out:not(:first-child) {
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  -ms-border-radius: 6px;
  border-radius: 6px;
}

.message--in {
  clear: both;
  float: left;
  background-color: #FFFFFF;
  -webkit-box-shadow: 2px 2px 0 0 rgba(0, 0, 0, 0.32);
  -moz-box-shadow: 2px 2px 0 0 rgba(0, 0, 0, 0.32);
  box-shadow: 2px 2px 0 0 rgba(0, 0, 0, 0.32);
}

.message--in:first-child {
  -webkit-border-radius: 0 6px 6px 6px;
  -moz-border-radius: 0 6px 6px 6px;
  -ms-border-radius: 0 6px 6px 6px;
  border-radius: 0 6px 6px 6px;
}

.message--in:first-child:before {
  position: absolute;
  top: 0;
  left: 0;
  -webkit-transform: translateX(-100%);
  -ms-transform: translateX(-100%);
  transform: translateX(-100%);
  content: "";
  border-style: solid;
  border-width: 0 12px 12px 0;
  border-color: transparent #FFFFFF transparent transparent;
}

.message--out {
  clear: both;
  float: right;
  background-color: #CCFFCC;
  -webkit-box-shadow: -2px 2px 0 0 rgba(0, 0, 0, 0.32);
  -moz-box-shadow: -2px 2px 0 0 rgba(0, 0, 0, 0.32);
  box-shadow: -2px 2px 0 0 rgba(0, 0, 0, 0.32);
}

.message--out:first-child {
  -webkit-border-radius: 6px 0 6px 6px;
  -moz-border-radius: 6px 0 6px 6px;
  -ms-border-radius: 6px 0 6px 6px;
  border-radius: 6px 0 6px 6px;
}

.message--out:first-child:after {
  position: absolute;
  top: 0;
  right: 0;
  -webkit-transform: translateX(100%);
  -ms-transform: translateX(100%);
  transform: translateX(100%);
  content: "";
  border-style: solid;
  border-width: 12px 12px 0 0;
  border-color: #CCFFCC transparent transparent transparent;
}

header .responsive-nav a, header .responsive-nav button {
  text-transform: lowercase;
}

header .responsive-nav a:first-letter, header .responsive-nav button:first-letter {
  text-transform: uppercase;
}

.responsive-nav nav button, .responsive-nav nav .button,
.responsive-nav nav a {
  padding-top: 2px;
  padding-bottom: 2px;
  font-size: 14px;
  font-size: 0.875rem;
}

.message--in.color1,
.message--out.color1 {
  background-color: #99cccc !important;
}

.message--in.color2,
.message--out.color2 {
  background-color: #cccc99 !important;
}

.message--in.color3,
.message--out.color3 {
  background-color: #99ccff !important;
}

.message--in.color4,
.message--out.color4 {
  background-color: #ffcc99 !important;
}

.message--in.color5,
.message--out.color5 {
  background-color: #999999 !important;
}

.message--in.color6,
.message--out.color6 {
  background-color: #99cc66 !important;
}

.message--in.color1:first-child:before {
  border-color: transparent #99cccc transparent transparent !important;
}

.message--in.color2:first-child:before {
  border-color: transparent #cccc99 transparent transparent !important;
}

.message--in.color3:first-child:before {
  border-color: transparent #99ccff transparent transparent !important;
}

.message--in.color4:first-child:before {
  border-color: transparent #ffcc99 transparent transparent !important;
}

.message--in.color5:first-child:before {
  border-color: transparent #999999 transparent transparent !important;
}

.message--in.color6:first-child:before {
  border-color: transparent #99cc66 transparent transparent !important;
}

.message--out.color1:first-child:after {
  border-color: #99cccc transparent transparent transparent !important;
}

.message--out.color2:first-child:after {
  border-color: #cccc99 transparent transparent transparent !important;
}

.message--out.color3:first-child:after {
  border-color: #99ccff transparent transparent transparent !important;
}

.message--out.color4:first-child:after {
  border-color: #ffcc99 transparent transparent transparent !important;
}

.message--out.color5:first-child:after {
  border-color: #999999 transparent transparent transparent !important;
}

.message--out.color6:first-child:after {
  border-color: #99cc66 transparent transparent transparent !important;
}
