@charset "UTF-8";
/*------------------------------------*    #Project styles
\*------------------------------------*/
/*------------------------------------*    #DEFAULT SETTINGS
\*------------------------------------*/
/*------------------------------------*    #INUIT SETTINGS
\*------------------------------------*/
/*------------------------------------*    #STARTERIZED SETTINGS
\*------------------------------------*/
/*!
 * inuitcss, by @csswizardry
 *
 * github.com/inuitcss | inuitcss.com
 */
/* --------------------------------------------------------------------------------------
+
+ STARTERIZED DEFAULT SETTINGS
+
-------------------------------------------------------------------------------------- */
/* turns on gradient support for IE9 */
/* turns off support for Mozilla prior to version 3.6 http://tiny.cc/42k3mw */
/* --------------------------------------------------------------------------------------
+
+ FUNCTIONS
+
-------------------------------------------------------------------------------------- */
/* --------------------------------------------------------------------------------------
+
+ EASING FUNCTIONS
+
-------------------------------------------------------------------------------------- */
/* --------------------------------------------------------------------------------------
+
+ MIXINS
+
-------------------------------------------------------------------------------------- */
/* --------------------------------------------------------------------------------------
+
+ ALIASES
+
-------------------------------------------------------------------------------------- */
/*------------------------------------*    #ALIASES
\*------------------------------------*/
/* -------------------------------------------------------------
  Sass CSS3 Mixins! The Cross-Browser CSS3 Sass Library
  By: Matthieu Aussaguel, http://www.mynameismatthieu.com, @matthieu_tweets
  List of CSS3 Sass Mixins File to be @imported and @included as you need
  The purpose of this library is to facilitate the use of CSS3 on different browsers avoiding HARD TO READ and NEVER
  ENDING css files
  note: All CSS3 Properties are being supported by Safari 5
  more info: http://www.findmebyip.com/litmus/#css3-properties
------------------------------------------------------------- */
/* --------------------------------------------------------------------------------------
+
+ VIEWPORT
+
-------------------------------------------------------------------------------------- */
@-webkit-viewport {
  width: device-width;
}

@-moz-viewport {
  width: device-width;
}

@-ms-viewport {
  width: device-width;
}

@viewport {
  width: device-width;
}

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

/*------------------------------------*    #RESET
\*------------------------------------*/
/**
 * As well as using normalize.css, it is often advantageous to remove all
 * margins from certain elements.
 */
body,
h1, h2, h3, h4, h5, h6,
p, blockquote, pre,
dl, dd, ol, ul,
form, fieldset, legend,
figure,
table, th, td, caption,
hr {
  margin: 0;
  padding: 0;
}

/**
 * Give a help cursor to elements that give extra info on `:hover`.
 */
abbr[title],
dfn[title] {
  cursor: help;
}

/**
 * Remove underlines from potentially troublesome elements.
 */
u,
ins {
  text-decoration: none;
}

/**
 * Apply faux underlines to inserted text via `border-bottom`.
 */
ins {
  border-bottom: 1px solid;
}

/* --------------------------------------------------------------------------------------
+
+ RESET - BUILDS ON TOP OF INUIT NORMALIZE AND RESET
+
-------------------------------------------------------------------------------------- */
audio,
canvas,
img,
svg,
video {
  vertical-align: middle;
  /* Remove the gap between images and the bottom of their containers: h5bp.com/i/440 */
}

table {
  width: 100%;
}

[contenteditable] {
  outline: none;
}

input,
textarea {
  border-radius: 0;
  /* remove input border radius on mobile safari and mobile firefox */
}

select,
input,
textarea,
button {
  font-size: 15px;
  font-size: 1rem;
  /* font size for html element MUST be set to 10px for this to work */
  margin: 0;
  /* Address margins set differently in IE 6/7, Firefox 3+, Safari 5, and Chrome */
}

select:focus,
input:focus,
textarea:focus,
button:focus {
  outline: none;
}

textarea {
  resize: vertical;
  /* Allow only vertical resizing of textareas */
  vertical-align: top;
  /* Improve readability and alignment in all browsers */
}

input[type="radio"] {
  vertical-align: text-bottom;
}

input[type="checkbox"] {
  vertical-align: bottom;
}

/*------------------------------------*    #BOX-SIZING
\*------------------------------------*/
/**
 * Set the global `box-sizing` state to `border-box`.
 *
 * css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice
 * paulirish.com/2012/box-sizing-border-box-ftw
 */
html {
  box-sizing: border-box;
}

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

/*------------------------------------*    #SHARED
\*------------------------------------*/
/**
 * Where `margin-bottom` is concerned,this value will be the same as the
 * base line-height. This allows us to keep a consistent vertical rhythm.
 * As per: csswizardry.com/2012/06/single-direction-margin-declarations
 */
h1, h2, h3, h4, h5, h6,
ul, ol, dl,
blockquote, p, address,
hr,
table,
fieldset, figure,
pre {
  margin-bottom: 25px;
  margin-bottom: 1.66667rem;
}

/**
 * Where `margin-left` is concerned we want to try and indent certain elements
 * by a consistent amount. Define that amount once,here.
 */
ul, ol, dd {
  margin-left: 50px;
  margin-left: 3.33333rem;
}

/* --------------------------------------------------------------------------------------
+
+ SELECTION
+
-------------------------------------------------------------------------------------- */
::-moz-selection {
  background: rgba(50, 155, 221, 0.7);
  color: #fff;
  text-shadow: none;
}

::selection {
  background: rgba(50, 155, 221, 0.7);
  color: #fff;
  text-shadow: none;
}

/*------------------------------------*    #PAGE
\*------------------------------------*/
/**
 * High-, page-level styling.
 *
 * 1. Set the default `font-size` and `line-height` for the entire project,
 *    sourced from our default variables. The `font-size` is calculated to exist
 *    in ems, the `line-height` is calculated to exist unitlessly.
 * 2. Force scrollbars to always be visible to prevent awkward ‘jumps’ when
 *    navigating between pages that do/do not have enough content to produce
 *    scrollbars naturally.
 * 3. Ensure the page always fills at least the entire height of the viewport.
 * 4. Prevent certain mobile browsers from automatically zooming fonts.
 * 5. Fonts on OSX will look more consistent with other systems that do not
 *    render text using sub-pixel anti-aliasing.
 */
html {
  font-size: 0.9375em;
  /* [1] */
  line-height: 1.66667;
  /* [1] */
  background-color: #fff;
  color: #82919d;
  overflow-y: scroll;
  /* [2] */
  min-height: 100%;
  /* [3] */
  -webkit-text-size-adjust: 100%;
  /* [4] */
  -ms-text-size-adjust: 100%;
  /* [4] */
  -moz-osx-font-smoothing: grayscale;
  /* [5] */
  -webkit-font-smoothing: antialiased;
  /* [5] */
}

/*------------------------------------*    #PAGE
\*------------------------------------*/
html {
  font-family: "Droid Arabic Naskh", serif;
  color: #171d28;
  background-color: #f1f3f5;
}

body {
  background-color: #f1f3f5;
  position: relative;
}

.page {
  padding-top: 70px;
  padding-bottom: 90px;
}

/**
 * LTR styles
 */
html[dir=ltr] {
  font-family: "Open Sans", sans-serif;
}

/*------------------------------------*    #HEADINGS
\*------------------------------------*/
/**
 * Headings 1–6, with corresponding Greek-alphabet abstract classes for double-
 * stranded heading hierarchy: csswizardry.com/2012/02/pragmatic-practical-font-sizing-in-css
 */
h1,
.alpha {
  font-size: 36px;
  font-size: 2.4rem;
  line-height: 1.38889;
}

h2,
.beta {
  font-size: 30px;
  font-size: 2rem;
  line-height: 1.66667;
}

h3,
.gamma {
  font-size: 24px;
  font-size: 1.6rem;
  line-height: 1.04167;
}

h4,
.delta {
  font-size: 20px;
  font-size: 1.33333rem;
  line-height: 1.25;
}

h5,
.epsilon {
  font-size: 16px;
  font-size: 1.06667rem;
  line-height: 1.5625;
}

h6,
.zeta {
  font-size: 14px;
  font-size: 0.93333rem;
  line-height: 1.78571;
}

/*------------------------------------*    #HEADINGS
\*------------------------------------*/
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: "Droid Arabic Naskh", serif;
  font-weight: bold;
  color: #171d28;
  margin-bottom: 0;
  padding-bottom: 20px;
  line-height: 27px;
}

h1 > a,
h2 > a,
h3 > a,
h4 > a,
h5 > a,
h6 > a {
  color: inherit;
}

h1 > a:hover,
h2 > a:hover,
h3 > a:hover,
h4 > a:hover,
h5 > a:hover,
h6 > a:hover {
  color: #4f6389;
}

h1,
.h1 {
  font-size: 25px;
}

h2,
.h2 {
  font-size: 21px;
}

h3,
.h3 {
  font-size: 19px;
}

h4,
.h4 {
  font-size: 17px;
}

h5,
.h5 {
  font-size: 15px;
}

h6,
.h6 {
  font-size: 13px;
}

/**
 * LTR styles.
 */
html[dir=ltr] h1,
html[dir=ltr] h2,
html[dir=ltr] h3,
html[dir=ltr] h4,
html[dir=ltr] h5,
html[dir=ltr] h6 {
  font-family: "Open Sans", sans-serif;
}

/*------------------------------------*    #TYPOGRAPHY
\*------------------------------------*/
/**
 * Typographical base selectors.
 */
/**
 * Horizontal rules.
 */
hr {
  background-color: none;
  border: none;
  border-bottom: 1px solid #d0d5db;
  height: 1px;
  margin-bottom: 35px;
}

/**
 * Typography.
 */
.entry-content h1,
.entry-content h2,
.entry-content h3,
.entry-content h4,
.entry-content h5,
.entry-content h6 {
  font-family: "Droid Arabic Naskh", serif;
  font-weight: bold;
  color: #171d28;
  margin-bottom: 0;
  padding-bottom: 20px;
  line-height: 27px;
}

.entry-content h1 > a,
.entry-content h2 > a,
.entry-content h3 > a,
.entry-content h4 > a,
.entry-content h5 > a,
.entry-content h6 > a {
  color: inherit;
}

.entry-content h1 > a:hover,
.entry-content h2 > a:hover,
.entry-content h3 > a:hover,
.entry-content h4 > a:hover,
.entry-content h5 > a:hover,
.entry-content h6 > a:hover {
  color: #4f6389;
}

.entry-content h1,
.entry-content .h1 {
  font-size: 25px;
}

.entry-content h2,
.entry-content .h2 {
  font-size: 21px;
}

.entry-content h3,
.entry-content .h3 {
  font-size: 19px;
}

.entry-content h4,
.entry-content .h4 {
  font-size: 17px;
}

.entry-content h5,
.entry-content .h5 {
  font-size: 15px;
}

.entry-content h6,
.entry-content .h6 {
  font-size: 13px;
}

.entry-content img:not(:last-child),
.entry-content p:not(:last-child),
.entry-content ul:not(:last-child),
.entry-content ol:not(:last-child),
.entry-content pre:not(:last-child),
.entry-content blockquote:not(:last-child),
.entry-content .embedded:not(:last-child) {
  margin-bottom: 35px;
}

.entry-content i,
.entry-content em {
  font-style: italic;
}

.entry-content b,
.entry-content strong {
  font-weight: 700;
}

.entry-content ul {
  list-style-type: none;
}

.entry-content ul li {
  padding-right: 20px;
  padding-bottom: 15px;
  position: relative;
  color: #171d28;
}

.entry-content ul li:before {
  content: "";
  display: inline-block;
  position: absolute;
  right: 0;
  top: 7px;
  height: 10px;
  width: 10px;
  background-color: transparent;
  border: 2px solid #3f91eb;
  border-radius: 50%;
}

.entry-content ul li ul li {
  color: #82919d;
}

.entry-content ul li ul li:before {
  content: "";
  background-color: #ced6e0;
  border-color: transparent;
}

.entry-content ul li ul li:last-child {
  padding-bottom: 18px;
}

.entry-content ul li ul li:first-child {
  margin-top: 30px;
}

.entry-content ol {
  list-style: none;
  counter-reset: list_item;
}

.entry-content ol li {
  counter-increment: list_item;
  position: relative;
  padding-right: 47px;
  color: #171d28;
}

.entry-content ol li:not(:last-child) {
  padding-bottom: 20px;
}

.entry-content ol li:before {
  content: counter(list_item);
  position: absolute;
  font-family: "Montserrat", sans-serif;
  top: -4px;
  right: 0;
  display: inline-block;
  line-height: 30px;
  height: 30px;
  width: 30px;
  background-color: #3f91eb;
  color: #fff;
  text-align: center;
  border-radius: 50%;
}

.entry-content ul,
.entry-content ol {
  margin-left: 0;
  margin-right: 0;
  margin-top: 15px;
}

html[dir=ltr] .entry-content h1,
html[dir=ltr] .entry-content h2,
html[dir=ltr] .entry-content h3,
html[dir=ltr] .entry-content h4,
html[dir=ltr] .entry-content h5,
html[dir=ltr] .entry-content h6 {
  font-family: "Open Sans", sans-serif;
}

html[dir=ltr] .entry-content ul li {
  padding-right: 0;
  padding-left: 20px;
}

html[dir=ltr] .entry-content ul li:before {
  right: auto;
  left: 0;
}

html[dir=ltr] .entry-content ol li {
  padding-right: 0;
  padding-left: 47px;
}

html[dir=ltr] .entry-content ol li:before {
  right: auto;
  left: 0;
}

/*------------------------------------*    #LINKS
\*------------------------------------*/
a {
  transition: color .2s ease;
}

/* --------------------------------------------------------------------------------------
+
+ LINK
+
-------------------------------------------------------------------------------------- */
a {
  color: #3282d9;
  text-decoration: none;
}

a:hover {
  color: #84b9f2;
  text-decoration: none;
}

/*------------------------------------*    #PARAGRAPHS
\*------------------------------------*/
/**
 * The `.lede` class is used to make the introductory text (usually a paragraph)
 * of a document slightly larger: en.wikipedia.org/wiki/Lede_(news)
 */
.lede {
  font-size: 19.5px;
  font-size: 1.3rem;
  line-height: 1.28205;
}

/*------------------------------------*    #IMAGES
\*------------------------------------*/
/**
 * 1. Fluid images for responsive purposes.
 * 2. Offset `alt` text from surrounding copy.
 * 3. Setting `vertical-align` removes the whitespace that appears under `img`
 *    elements when they are dropped into a page as-is. Safer alternative to
 *    using `display: block;`.
 */
img {
  max-width: 100%;
  /* [1] */
  font-style: italic;
  /* [2] */
  vertical-align: middle;
  /* [3] */
}

/**
 * If a `width` and/or `height` attribute have been explicitly defined, let’s
 * not make the image fluid.
 */
img[width],
img[height] {
  max-width: none;
}

/*------------------------------------*    #LISTS
\*------------------------------------*/
/**
 * Remove extra vertical spacing when nesting lists.
 */
li > ul,
li > ol {
  margin-bottom: 0;
}

/* --------------------------------------------------------------------------------------
+
+ BUTTONS
+
-------------------------------------------------------------------------------------- */
.btn {
  transition: all .2s ease;
  -moz-user-select: -moz-none;
  -webkit-user-select: none;
  -o-user-select: none;
  -ms-user-select: none;
      user-select: none;
  background: none;
  border: none;
  display: inline-block;
  line-height: normal;
  margin: 0;
  /* remove margin for some browsers */
  padding: 0;
  /* remove padding in Firefox */
  text-decoration: none;
  text-shadow: none;
  vertical-align: middle;
  white-space: nowrap;
}

.btn:hover {
  cursor: pointer;
  text-decoration: none;
}

.btn--full {
  box-sizing: border-box;
  display: block;
  width: 100% !important;
  /* force 100% width for <button> */
}

/*------------------------------------*    #TABLEIZE
\*------------------------------------*/
/**
 * The `.tableize__content` serves as container for cell content. If you need
 * width or padding set on a cell, make sure you set it to `.tableize__content`
 * instead since that is what makes the whole thing work. That being said
 * `.tableize__content` is optional.

   <div class="tableize">
     <div class="tableize__cell">
       <div class="tableize__content">
         cell content
       </div>
     </div>
     <div class="tableize__cell">
       <div class="tableize__content">
         cell content
       </div>
     </div>
   </div>
 */
.tableize {
  display: table;
  width: 100%;
}

/**
     * Tableize cell.
     */
.tableize__cell {
  display: table-cell;
  vertical-align: top;
}

/**
     * Filler cell. There is no need for using this class if parent `.tableize`
     * has `.tableize--fixed` modifier.
     *
     * 1. Fills the rest of the row when one or more cells have fixed width.
     */
.tableize__cell--fill {
  width: 100%;
  /* [1] */
}

/**
     * Middle tableize aligns tableize cell to their middles.
     */
.tableize--middle > .tableize__cell {
  vertical-align: middle;
}

/**
     * Bottom tableize aligns tableize cell to their bottom.
     */
.tableize--bottom > .tableize__cell {
  vertical-align: bottom;
}

/**
     * Fixed tableize makes:
     * - all cells occupy equal width or
     * - if one (or more) cells are fixed (or percentage base) width
     *   the remaining columns will occupy rest of the available space.
     *
     * More info about `table-layout: fixed;` at
     * http://css-tricks.com/fixing-tables-long-strings/
     */
.tableize--fixed {
  table-layout: fixed;
}

/**
     * Full height tableize.
     */
.tableize--full {
  height: 100%;
}

.tableize--full > .tableize__cell,
.tableize--full > .tableize__cell > .tableize__content {
  height: inherit;
}

/* --------------------------------------------------------------------------------------
+
+ JUSTIFIZE
+
-------------------------------------------------------------------------------------- */
/*
    http://www.css-101.org/articles/responsive-boxes/magic-boxes.php

    <div class="justifize">
      <div class="justifize__box">
        justifize box content
      </div>
      <div class="justifize__box">
        justifize box content
      </div>
      <div class="justifize__box">
        justifize box content
      </div>
    </div>
*/
.justifize {
  font-size: 0px;
  /* IE 9, 10, 11 FIX */
  text-align: justify;
}

.justifize:after {
  content: "";
  display: inline-block;
  width: 100%;
}

.justifize__box {
  font-size: 15px;
  font-size: 1rem;
  /* font size for html element MUST be set to 10px for this to work */
  display: inline-block;
  text-align: left;
  vertical-align: middle;
}

.justifize--top .justifize__box {
  vertical-align: top;
}

.justifize--bottom .justifize__box {
  vertical-align: bottom;
}

/*------------------------------------*    #FLAG
\*------------------------------------*/
/**
 * The flag object is a design pattern similar to the media object, however it
 * utilises `display: table[-cell];` to give us control over the vertical
 * alignments of the text and image. csswizardry.com/2013/05/the-flag-object
 */
/**
 * 1. Allows us to control vertical alignments
 * 2. Force the object to be the full width of its parent. Combined with [1],
 *    this makes the object behave in a quasi-`display: block;` manner.
 */
.flag {
  display: table;
  /* [1] */
  width: 100%;
  /* [2] */
}

/**
     * Items within a flag object. There should only ever be one of each.
     *
     * 1. Default to aligning content to their middles.
     */
.flag__img,
.flag__body {
  display: table-cell;
  vertical-align: middle;
  /* [1] */
}

/**
     * Flag images have a space between them and the body of the object.
     */
.flag__img {
  padding-right: 25px;
}

.flag__img > img {
  display: block;
  max-width: none;
}

/**
     * The container for the main content of the flag object.
     *
     * 1. Forces the `.flag__body` to take up all remaining space.
     */
.flag__body {
  width: 100%;
  /* [1] */
}

.flag__body,
.flag__body > :last-child {
  margin-bottom: 0;
}

/**
     * Tiny flags.
     */
.flag--tiny {
  /**
             * Tiny reversed flags.
             */
}

.flag--tiny > .flag__img {
  padding-right: 6px;
}

.flag--tiny.flag--rev > .flag__img {
  padding-right: 0;
  padding-left: 6px;
}

/**
     * Small flags.
     */
.flag--small {
  /**
             * Small reversed flags.
             */
}

.flag--small > .flag__img {
  padding-right: 13px;
}

.flag--small.flag--rev > .flag__img {
  padding-right: 0;
  padding-left: 13px;
}

/**
     * Large flags.
     */
.flag--large {
  /**
             * Large reversed flags.
             */
}

.flag--large > .flag__img {
  padding-right: 50px;
}

.flag--large.flag--rev > .flag__img {
  padding-right: 0;
  padding-left: 50px;
}

/**
     * Huge flags.
     */
.flag--huge {
  /**
             * Huge reversed flags.
             */
}

.flag--huge > .flag__img {
  padding-right: 100px;
}

.flag--huge.flag--rev > .flag__img {
  padding-right: 0;
  padding-left: 100px;
}

/**
     * Reversed flag objects have their image-content to the right, and text-content
     * to the left.
     *
     * 1. Swap the rendered direction of the object…
     * 2. …and reset it.
     * 3. Reassign margins to the correct sides.
     */
.flag--rev {
  direction: rtl;
  /* [1] */
}

.flag--rev > .flag__img,
.flag--rev > .flag__body {
  direction: ltr;
  /* [2] */
}

.flag--rev > .flag__img {
  padding-right: 0;
  /* [3] */
  padding-left: 25px;
  /* [3] */
}

/**
     * Flush flag objects have no space between the image- and text-content.
     */
.flag--flush > .flag__img {
  padding-right: 0;
  padding-left: 0;
}

/**
     * Vertically top aligned flag objects.
     */
.flag--top > .flag__img,
.flag--top > .flag__body {
  vertical-align: top;
}

/**
     * Vertically bottom aligned flag objects.
     */
.flag--bottom > .flag__img,
.flag--bottom > .flag__body {
  vertical-align: bottom;
}

/**
     * Responsive flag objects.
     *
     * There is a very pragmatic, simple implementation of a responsive flag
     * object, which simply places the text-content beneath the image-content.
     *
     * We use a `max-width` media query because:
     *
     * a) it is the least verbose method in terms of amount of code required.
     * b) the flag object’s default state is image-next-to-text, so its stacked
     *    state is the exception, rather than the rule.
     */
@media screen and (max-width: 720px) {
  .flag--responsive {
    /**
                 * Disable reversal of content because there is no concept of
                 * ‘reversed’ in a stacked layout.
                 */
    direction: ltr;
    /**
             * Rework the spacings on regular flag objects.
             */
    /**
                 * Tiny responsive flags.
                 *
                 * Take a little more heavy-handed approach to reworking
                 * spacings on flags that are also tiny flags in their regular
                 * state.
                 */
    /**
                 * Small responsive flags.
                 *
                 * Take a little more heavy-handed approach to reworking
                 * spacings on flags that are also small flags in their regular
                 * state.
                 */
    /**
                 * Large responsive flags.
                 *
                 * Take a little more heavy-handed approach to reworking
                 * spacings on flags that are also large flags in their regular
                 * state.
                 */
    /**
                 * Huge responsive flags.
                 *
                 * Take a little more heavy-handed approach to reworking
                 * spacings on flags that are also huge flags in their regular
                 * state.
                 */
  }
  .flag--responsive,
  .flag--responsive > .flag__img,
  .flag--responsive > .flag__body {
    display: block;
  }
  .flag--responsive > .flag__img {
    padding-right: 0;
    padding-left: 0;
    margin-bottom: 25px;
  }
  .flag--responsive.flag--tiny > .flag__img {
    padding-right: 0;
    padding-left: 0;
    margin-bottom: 6px;
  }
  .flag--responsive.flag--small > .flag__img {
    padding-right: 0;
    padding-left: 0;
    margin-bottom: 13px;
  }
  .flag--responsive.flag--large > .flag__img {
    padding-right: 0;
    padding-left: 0;
    margin-bottom: 50px;
  }
  .flag--responsive.flag--huge > .flag__img {
    padding-right: 0;
    padding-left: 0;
    margin-bottom: 100px;
  }
}

/*------------------------------------*    #MEDIA
\*------------------------------------*/
/**
 * Place any image- and text-like content side-by-side, as per:
 * stubbornella.org/content/2010/06/25/the-media-object-saves-hundreds-of-lines-of-code
 */
.media {
  display: block;
}

.media__img {
  float: left;
  margin-right: 25px;
}

.media__img > img {
  display: block;
}

.media__body {
  overflow: hidden;
  display: block;
}

.media__body,
.media__body > :last-child {
  margin-bottom: 0;
}

/**
     * Tiny media objects.
     */
.media--tiny {
  /**
             * Tiny reversed media objects.
             */
}

.media--tiny > .media__img {
  margin-right: 6px;
}

.media--tiny.media--rev > .media__img {
  margin-right: 0;
  margin-left: 6px;
}

/**
     * Small media objects.
     */
.media--small {
  /**
             * Small reversed media objects.
             */
}

.media--small > .media__img {
  margin-right: 13px;
}

.media--small.media--rev > .media__img {
  margin-right: 0;
  margin-left: 13px;
}

/**
     * Large media objects.
     */
.media--large {
  /**
             * Large reversed media objects.
             */
}

.media--large > .media__img {
  margin-right: 50px;
}

.media--large.media--rev > .media__img {
  margin-right: 0;
  margin-left: 50px;
}

/**
     * Huge media objects.
     */
.media--huge {
  /**
             * Huge reversed media objects.
             */
}

.media--huge > .media__img {
  margin-right: 100px;
}

.media--huge.media--rev > .media__img {
  margin-right: 0;
  margin-left: 100px;
}

/**
     * Reversed image location (right instead of left). Extends `.media`.
     */
.media--rev > .media__img {
  float: right;
  margin-right: 0;
  margin-left: 25px;
}

/**
     * Flush media objects have no space between the image- and text-content.
     */
.media--flush > .media__img {
  margin-right: 0;
  margin-left: 0;
}

/**
     * Responsive media objects.
     *
     * There is a very pragmatic, simple implementation of a responsive media
     * object, which simply places the text-content beneath the image-content.
     *
     * We use a `max-width` media query because:
     *
     * a) it is the least verbose method in terms of amount of code required.
     * b) the media object’s default state is image-next-to-text, so its stacked
     *    state is the exception, rather than the rule.
     */
@media screen and (max-width: 570px) {
  .media--responsive {
    /**
             * Rework the spacings on regular media objects.
             */
    /**
                 * Tiny responsive media objects.
                 *
                 * Take a little more heavy-handed approach to reworking
                 * spacings on media objects that are also tiny media objects
                 * in their regular state.
                 */
    /**
                 * Small responsive media objects.
                 *
                 * Take a little more heavy-handed approach to reworking
                 * spacings on media objects that are also small media objects
                 * in their regular state.
                 */
    /**
                 * Large responsive media objects.
                 *
                 * Take a little more heavy-handed approach to reworking
                 * spacings on media objects that are also large media objects
                 * in their regular state.
                 */
    /**
                 * Huge responsive media objects.
                 *
                 * Take a little more heavy-handed approach to reworking
                 * spacings on media objects that are also huge media objects
                 * in their regular state.
                 */
  }
  .media--responsive > .media__img {
    float: none;
    margin-right: 0;
    margin-bottom: 25px;
    margin-left: 0;
  }
  .media--responsive.media--tiny > .media__img {
    margin-right: 0;
    margin-left: 0;
    margin-bottom: 6px;
  }
  .media--responsive.media--small > .media__img {
    margin-right: 0;
    margin-left: 0;
    margin-bottom: 13px;
  }
  .media--responsive.media--large > .media__img {
    margin-right: 0;
    margin-left: 0;
    margin-bottom: 50px;
  }
  .media--responsive.media--huge > .media__img {
    margin-right: 0;
    margin-left: 0;
    margin-bottom: 100px;
  }
}

/*------------------------------------*    #CONTAINER
\*------------------------------------*/
.container {
  margin: 0 auto;
  max-width: 1240px;
  padding-left: 35px;
  padding-right: 35px;
}

.container.container--indented {
  padding: 0 118px;
}

.container.container--large {
  max-width: 1510px;
}

.container--indented {
  padding: 0 118px;
}

/*------------------------------------*    #MAGNIFIC POPUP
\*------------------------------------*/
.mfp-bg {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1042;
  overflow: hidden;
  position: fixed;
  background: #0b0b0b;
  opacity: 0.8;
  filter: alpha(opacity=80);
}

.mfp-wrap {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1043;
  position: fixed;
  outline: none !important;
  -webkit-backface-visibility: hidden;
}

.mfp-container {
  text-align: center;
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  padding: 0 8px;
  box-sizing: border-box;
}

.mfp-container:before {
  content: '';
  display: inline-block;
  height: 100%;
  vertical-align: middle;
}

.mfp-align-top .mfp-container:before {
  display: none;
}

.mfp-content {
  position: relative;
  display: inline-block;
  vertical-align: middle;
  margin: 0 auto;
  text-align: left;
  z-index: 1045;
}

.mfp-inline-holder .mfp-content,
.mfp-ajax-holder .mfp-content {
  width: 100%;
  cursor: auto;
}

.mfp-ajax-cur {
  cursor: progress;
}

.mfp-zoom-out-cur, .mfp-zoom-out-cur .mfp-image-holder .mfp-close {
  cursor: zoom-out;
}

.mfp-zoom {
  cursor: pointer;
  cursor: zoom-in;
}

.mfp-auto-cursor .mfp-content {
  cursor: auto;
}

.mfp-close,
.mfp-arrow,
.mfp-preloader,
.mfp-counter {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
      user-select: none;
}

.mfp-loading.mfp-figure {
  display: none;
}

.mfp-hide {
  display: none !important;
}

.mfp-preloader {
  color: #CCC;
  position: absolute;
  top: 50%;
  width: auto;
  text-align: center;
  margin-top: -0.8em;
  left: 8px;
  right: 8px;
  z-index: 1044;
}

.mfp-preloader a {
  color: #CCC;
}

.mfp-preloader a:hover {
  color: #FFF;
}

.mfp-s-ready .mfp-preloader {
  display: none;
}

.mfp-s-error .mfp-content {
  display: none;
}

button.mfp-close,
button.mfp-arrow {
  overflow: visible;
  cursor: pointer;
  background: transparent;
  border: 0;
  -webkit-appearance: none;
  display: block;
  outline: none;
  padding: 0;
  z-index: 1046;
  box-shadow: none;
}

button::-moz-focus-inner {
  padding: 0;
  border: 0;
}

.mfp-close {
  width: 44px;
  height: 44px;
  line-height: 44px;
  position: absolute;
  right: 0;
  top: 0;
  text-decoration: none;
  text-align: center;
  opacity: 0.65;
  filter: alpha(opacity=65);
  padding: 0 0 18px 10px;
  color: #FFF;
  font-style: normal;
  font-size: 28px;
  font-family: Arial, Baskerville, monospace;
}

.mfp-close:hover,
.mfp-close:focus {
  opacity: 1;
  filter: alpha(opacity=100);
}

.mfp-close:active {
  top: 1px;
}

.mfp-close-btn-in .mfp-close {
  color: #333;
}

.mfp-image-holder .mfp-close,
.mfp-iframe-holder .mfp-close {
  color: #FFF;
  right: -6px;
  text-align: right;
  padding-right: 6px;
  width: 100%;
}

.mfp-counter {
  position: absolute;
  top: 0;
  right: 0;
  color: #CCC;
  font-size: 12px;
  line-height: 18px;
  white-space: nowrap;
}

.mfp-arrow {
  position: absolute;
  opacity: 0.65;
  filter: alpha(opacity=65);
  margin: 0;
  top: 50%;
  margin-top: -55px;
  padding: 0;
  width: 90px;
  height: 110px;
  -webkit-tap-highlight-color: transparent;
}

.mfp-arrow:active {
  margin-top: -54px;
}

.mfp-arrow:hover,
.mfp-arrow:focus {
  opacity: 1;
  filter: alpha(opacity=100);
}

.mfp-arrow:before,
.mfp-arrow:after,
.mfp-arrow .mfp-b,
.mfp-arrow .mfp-a {
  content: '';
  display: block;
  width: 0;
  height: 0;
  position: absolute;
  left: 0;
  top: 0;
  margin-top: 35px;
  margin-left: 35px;
  border: medium inset transparent;
}

.mfp-arrow:after,
.mfp-arrow .mfp-a {
  border-top-width: 13px;
  border-bottom-width: 13px;
  top: 8px;
}

.mfp-arrow:before,
.mfp-arrow .mfp-b {
  border-top-width: 21px;
  border-bottom-width: 21px;
  opacity: 0.7;
}

.mfp-arrow-left {
  left: 0;
}

.mfp-arrow-left:after,
.mfp-arrow-left .mfp-a {
  border-right: 17px solid #FFF;
  margin-left: 31px;
}

.mfp-arrow-left:before,
.mfp-arrow-left .mfp-b {
  margin-left: 25px;
  border-right: 27px solid #3F3F3F;
}

.mfp-arrow-right {
  right: 0;
}

.mfp-arrow-right:after,
.mfp-arrow-right .mfp-a {
  border-left: 17px solid #FFF;
  margin-left: 39px;
}

.mfp-arrow-right:before,
.mfp-arrow-right .mfp-b {
  border-left: 27px solid #3F3F3F;
}

.mfp-iframe-holder {
  padding-top: 40px;
  padding-bottom: 40px;
}

.mfp-iframe-holder .mfp-content {
  line-height: 0;
  width: 100%;
  max-width: 900px;
}

.mfp-iframe-holder .mfp-close {
  top: -40px;
}

.mfp-iframe-scaler {
  width: 100%;
  height: 0;
  overflow: hidden;
  padding-top: 56.25%;
}

.mfp-iframe-scaler iframe {
  position: absolute;
  display: block;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
  background: #000;
}

/* Main image in popup */
img.mfp-img {
  width: auto;
  max-width: 100%;
  height: auto;
  display: block;
  line-height: 0;
  box-sizing: border-box;
  padding: 40px 0 40px;
  margin: 0 auto;
}

/* The shadow behind the image */
.mfp-figure {
  line-height: 0;
}

.mfp-figure:after {
  content: '';
  position: absolute;
  left: 0;
  top: 40px;
  bottom: 40px;
  display: block;
  right: 0;
  width: auto;
  height: auto;
  z-index: -1;
  box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
  background: #444;
}

.mfp-figure small {
  color: #BDBDBD;
  display: block;
  font-size: 12px;
  line-height: 14px;
}

.mfp-figure figure {
  margin: 0;
}

.mfp-bottom-bar {
  margin-top: -36px;
  position: absolute;
  top: 100%;
  left: 0;
  width: 100%;
  cursor: auto;
}

.mfp-title {
  text-align: left;
  line-height: 18px;
  color: #F3F3F3;
  word-wrap: break-word;
  padding-right: 36px;
}

.mfp-image-holder .mfp-content {
  max-width: 100%;
}

.mfp-gallery .mfp-image-holder .mfp-figure {
  cursor: pointer;
}

@media screen and (max-width: 800px) and (orientation: landscape), screen and (max-height: 300px) {
  /**
       * Remove all paddings around the image on small screen
       */
  .mfp-img-mobile .mfp-image-holder {
    padding-left: 0;
    padding-right: 0;
  }
  .mfp-img-mobile img.mfp-img {
    padding: 0;
  }
  .mfp-img-mobile .mfp-figure:after {
    top: 0;
    bottom: 0;
  }
  .mfp-img-mobile .mfp-figure small {
    display: inline;
    margin-left: 5px;
  }
  .mfp-img-mobile .mfp-bottom-bar {
    background: rgba(0, 0, 0, 0.6);
    bottom: 0;
    margin: 0;
    top: auto;
    padding: 3px 5px;
    position: fixed;
    box-sizing: border-box;
  }
  .mfp-img-mobile .mfp-bottom-bar:empty {
    padding: 0;
  }
  .mfp-img-mobile .mfp-counter {
    right: 5px;
    top: 3px;
  }
  .mfp-img-mobile .mfp-close {
    top: 0;
    right: 0;
    width: 35px;
    height: 35px;
    line-height: 35px;
    background: rgba(0, 0, 0, 0.6);
    position: fixed;
    text-align: center;
    padding: 0;
  }
}

@media all and (max-width: 900px) {
  .mfp-arrow {
    -ms-transform: scale(0.75);
        transform: scale(0.75);
  }
  .mfp-arrow-left {
    -ms-transform-origin: 0;
        transform-origin: 0;
  }
  .mfp-arrow-right {
    -ms-transform-origin: 100%;
        transform-origin: 100%;
  }
  .mfp-container {
    padding-left: 6px;
    padding-right: 6px;
  }
}

.mfp-ie7 .mfp-img {
  padding: 0;
}

.mfp-ie7 .mfp-bottom-bar {
  width: 600px;
  left: 50%;
  margin-left: -300px;
  margin-top: 5px;
  padding-bottom: 5px;
}

.mfp-ie7 .mfp-container {
  padding: 0;
}

.mfp-ie7 .mfp-content {
  padding-top: 44px;
}

.mfp-ie7 .mfp-close {
  top: 0;
  right: 0;
  padding-top: 0;
}

/**
 * Magnific custom styles
*/
button.mfp-arrow {
  border-right: 1px solid #d0d5db;
}

.mfp-arrow {
  top: auto;
  bottom: 4px;
  width: 74px;
  height: 73px;
  margin-top: -74px;
}

@media screen and (max-width: 900px) {
  .mfp-arrow {
    -ms-transform-origin: initial;
        transform-origin: initial;
  }
}

.mfp-arrow:before {
  content: '';
  border: none;
  margin-top: 33px;
}

.mfp-arrow.mfp-arrow-left:before, .mfp-arrow.mfp-arrow-right:before {
  content: '';
  display: inline-block;
  width: 7px;
  height: 12px;
  background-image: url("../images/popup-arrow.png");
  background-repeat: no-repeat;
  opacity: 1;
}

.mfp-arrow.mfp-arrow-left:before:hover, .mfp-arrow.mfp-arrow-left:before:focus, .mfp-arrow.mfp-arrow-right:before:hover, .mfp-arrow.mfp-arrow-right:before:focus {
  opacity: 0.6;
}

.mfp-arrow.mfp-arrow-left:before {
  margin-left: 30px;
  border-right: none;
}

.mfp-arrow.mfp-arrow-right:before {
  border-left: none;
  -khtml-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  transform: rotate(180deg);
}

.mfp-arrow-right {
  right: auto;
  left: 74px;
}

@media screen and (max-width: 900px) {
  .mfp-arrow-right {
    -ms-transform: none;
        transform: none;
  }
}

.mfp-arrow-left {
  left: 0px;
}

@media screen and (max-width: 900px) {
  .mfp-arrow-left {
    -ms-transform: none;
        transform: none;
  }
}

.mfp-title {
  text-align: right;
  line-height: 73px;
  height: 73px;
  color: #171d28;
}

.mfp-bottom-bar {
  margin-top: -77px;
  background-color: #fff;
}

.mfp-counter {
  display: none;
}

.mfp-arrow:before,
.mfp-arrow:after,
.mfp-arrow .mfp-b,
.mfp-arrow .mfp-a {
  content: '';
  display: none;
}

.mfp-image-holder .mfp-close {
  top: 52px;
  left: 10px;
  right: auto;
  width: 42px;
  height: 42px;
  text-align: center;
  padding-right: 0;
  color: #171d28;
  background-color: #fff;
  cursor: pointer !important;
  opacity: 1;
}

.mfp-image-holder .mfp-close:hover {
  opacity: 0.8;
}

/* Main image in popup */
img.mfp-img {
  padding: 40px 0 76px;
}

/**
 * LTR tyles
 */
html[dir=ltr] button.mfp-arrow {
  border-right: none;
  border-left: 1px solid #d0d5db;
}

html[dir=ltr] .mfp-arrow.mfp-arrow-left:before {
  margin-right: 30px;
  border-left: none;
  -khtml-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  transform: rotate(180deg);
}

html[dir=ltr] .mfp-arrow.mfp-arrow-right:before {
  border-right: none;
  -khtml-transform: rotate(0deg);
  -ms-transform: rotate(0deg);
  transform: rotate(0deg);
}

html[dir=ltr] .mfp-arrow-right {
  left: auto;
  right: 74px;
}

html[dir=ltr] .mfp-arrow-left {
  left: auto;
  right: 0;
}

html[dir=ltr] .mfp-title {
  text-align: left;
  padding-right: 0;
  padding-left: 36px;
}

html[dir=ltr] .mfp-image-holder .mfp-close {
  left: auto;
  right: 10px;
  padding-right: 0;
  padding-left: 0;
}

/*------------------------------------*    #EMBEDDED
\*------------------------------------*/
/*
    BASED ON https://github.com/suitcss/components-flex-embed/blob/master/flex-embed.css, mashed up with http://www.mademyday.de/css-height-equals-width-with-pure-css.html

    <div class="embedded">
      [iframe|object|embed]
    </div>
*/
.embedded {
  display: block;
  overflow: hidden;
  position: relative;
  /**
     * Descendant: media element
     *
     * Utility of the component is improved by provide an explicit descendant
     * class. However, it will work automatically for iframes, embeds, and objects
     * to account for times when you cannot modify the attributes for 3rd party
     * widget code.
     */
  /**
     * A pseudo-element shunt is used to provide support for `max-height`. The
     * `max-height` property has no affect when using a percentage-padding to set
     * the aspect ratio.
     */
}

.embedded .embedded__item,
.embedded video,
.embedded iframe,
.embedded embed,
.embedded object {
  height: 100%;
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
}

.embedded:before {
  content: "";
  display: block;
  padding-bottom: 100%;
  /* initial ratio of 1:1*/
  width: 100%;
}

/**
 * Modifier: 3:1 aspect ratio
 */
.embedded--3by1:before {
  padding-bottom: 33%;
}

/**
 * Modifier: 2:1 aspect ratio
 */
.embedded--2by1:before {
  padding-bottom: 50%;
}

/**
 * Modifier: 16:9 aspect ratio
 */
.embedded--16by9:before {
  padding-bottom: 56.25%;
}

/**
 * Modifier: 4:3 aspect ratio
 */
.embedded--4by3:before {
  padding-bottom: 75%;
}

.embedded--center .embedded__item,
.embedded--center video,
.embedded--center iframe,
.embedded--center embed,
.embedded--center object {
  -ms-transform: translate(-50%, -50%);
      transform: translate(-50%, -50%);
  top: 50%;
  left: 50%;
}

/*------------------------------------*    #ICONS
\*------------------------------------*/
.icon {
  display: inline-block;
  fill: currentColor;
  height: 16px;
  vertical-align: middle;
  width: 16px;
}

.icon--top-menu {
  margin-left: 5px;
}

html[dir=ltr] .icon--top-menu {
  margin-left: 0;
  margin-right: 5px;
}

.icon--more {
  position: relative;
  left: -10px;
  top: 1px;
}

html[dir=ltr] .icon--more {
  left: auto;
  right: -10px;
  -khtml-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  transform: rotate(180deg);
}

.icon--8-16 {
  width: 8px;
  height: 16px;
}

.icon--8-11 {
  width: 8px;
  height: 16px;
}

.icon--7-12 {
  width: 7px;
  height: 12px;
}

.icon--9-13 {
  width: 9px;
  height: 13px;
}

.icon--10-13 {
  width: 10px;
  height: 13px;
}

.icon--12-14 {
  width: 12px;
  height: 14px;
}

.icon--12-13 {
  width: 12px;
  height: 13px;
}

.icon--13-14 {
  width: 13px;
  height: 14px;
}

.icon--13-13 {
  width: 13px;
  height: 13px;
}

.icon--14-14 {
  width: 14px;
  height: 14px;
}

.icon--15-10 {
  width: 15px;
  height: 10px;
}

.icon--16-14 {
  width: 16px;
  height: 14px;
}

.icon--16-16 {
  width: 16px;
  height: 16px;
}

.icon--16-12 {
  width: 16px;
  height: 12px;
}

.icon--17-14 {
  width: 17px;
  height: 14px;
}

.icon--17-16 {
  width: 17px;
  height: 16px;
}

.icon--19-11 {
  width: 19px;
  height: 11px;
}

.icon--19-14 {
  width: 19px;
  height: 11px;
}

.icon--20-20 {
  width: 20px;
  height: 20px;
}

.icon--22-9 {
  width: 22px;
  height: 9px;
}

.icon--27-16 {
  width: 27px;
  height: 16px;
}

.icon--64-64 {
  width: 64px;
  height: 64px;
}

.icon--157-55 {
  width: 157px;
  height: 55px;
}

/*------------------------------------*    #ICONS
\*------------------------------------*/
.round--icon {
  display: inline-block;
  vertical-align: middle;
  text-align: center;
  border-radius: 50%;
}

.round--icon-blue {
  background-color: #3282d9;
  color: #fff;
}

.round--icon-small {
  height: 40px;
  width: 40px;
  line-height: 45px;
}

/*! lightslider - v1.1.3 - 2015-04-14
* https://github.com/sachinchoolur/lightslider
* Copyright (c) 2015 Sachin N; Licensed MIT */
.lSSlideWrapper, .lSSlideWrapper .lSFade {
  position: relative;
}

.lSSlideWrapper .lSSlide, .lSSlideWrapper.usingCss .lSFade > * {
  transition-timing-function: inherit !important;
  transition-duration: inherit !important;
}

.lSSlideOuter, .lSSlideOuter .lSPager.lSGallery {
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
}

.lSSlideOuter .lSPager.lSGallery:after, .lSSlideWrapper > .lightSlider:after {
  clear: both;
}

.lSSlideOuter {
  overflow: hidden;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}

.lightSlider:after, .lightSlider:before {
  content: " ";
  display: table;
}

.lightSlider {
  overflow: hidden;
  margin: 0;
}

.lSSlideWrapper {
  max-width: 100%;
  overflow: hidden;
}

.lSSlideWrapper .lSSlide {
  -ms-transform: translate(0, 0);
  transform: translate(0, 0);
  -webkit-transition: all 1s;
  transition-property: transform,height;
}

.lSSlideWrapper .lSFade > * {
  position: absolute !important;
  top: 0;
  left: 0;
  z-index: 9;
  margin-right: 0;
  width: 100%;
}

.lSSlideWrapper.usingCss .lSFade > * {
  opacity: 0;
  transition-delay: 0s;
  transition-property: opacity;
}

.lSSlideWrapper .lSFade > .active {
  z-index: 10;
}

.lSSlideWrapper.usingCss .lSFade > .active {
  opacity: 1;
}

.lSSlideOuter .lSPager.lSpg {
  margin: 10px 0 0;
  padding: 0;
  text-align: center;
}

.lSSlideOuter .lSPager.lSpg > li {
  cursor: pointer;
  display: inline-block;
  padding: 0 5px;
}

.lSSlideOuter .lSPager.lSpg > li a {
  background-color: #222;
  border-radius: 30px;
  display: inline-block;
  height: 8px;
  overflow: hidden;
  text-indent: -999em;
  width: 8px;
  position: relative;
  z-index: 99;
  transition: all .5s linear 0s;
}

.lSSlideOuter .lSPager.lSpg > li.active a, .lSSlideOuter .lSPager.lSpg > li:hover a {
  background-color: #428bca;
}

.lSSlideOuter .media {
  opacity: .8;
}

.lSSlideOuter .media.active {
  opacity: 1;
}

.lSSlideOuter .lSPager.lSGallery {
  list-style: none;
  padding-left: 0;
  margin: 0;
  overflow: hidden;
  transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
  -webkit-transform: translate3d(0, 0, 0);
  -o-transform: translate3d(0, 0, 0);
  -webkit-transition-property: -webkit-transform;
  -moz-transition-property: -moz-transform;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}

.lSSlideOuter .lSPager.lSGallery li {
  overflow: hidden;
  transition: border-radius .12s linear 0s .35s linear 0s;
}

.lSSlideOuter .lSPager.lSGallery li.active, .lSSlideOuter .lSPager.lSGallery li:hover {
  border-radius: 5px;
}

.lSSlideOuter .lSPager.lSGallery img {
  display: block;
  height: auto;
  max-width: 100%;
}

.lSSlideOuter .lSPager.lSGallery:after, .lSSlideOuter .lSPager.lSGallery:before {
  content: " ";
  display: table;
}

.lSAction > a {
  width: 32px;
  display: block;
  top: 50%;
  height: 32px;
  background-image: url("../bower_components/lightslider/src/img/controls.png");
  cursor: pointer;
  position: absolute;
  z-index: 99;
  margin-top: -16px;
  opacity: .5;
  transition: opacity .35s linear 0s;
}

.lSAction > a:hover {
  opacity: 1;
}

.lSAction > .lSPrev {
  background-position: 0 0;
  left: 10px;
}

.lSAction > .lSNext {
  background-position: -32px 0;
  right: 10px;
}

.lSAction > a.disabled {
  pointer-events: none;
}

.cS-hidden {
  height: 1px;
  opacity: 0;
  filter: alpha(opacity=0);
  overflow: hidden;
}

.lSSlideOuter.vertical {
  position: relative;
}

.lSSlideOuter.vertical.noPager {
  padding-right: 0 !important;
}

.lSSlideOuter.vertical .lSGallery {
  position: absolute !important;
  right: 0;
  top: 0;
}

.lSSlideOuter.vertical .lightSlider > * {
  width: 100% !important;
  max-width: none !important;
}

.lSSlideOuter.vertical .lSAction > a {
  left: 50%;
  margin-left: -14px;
  margin-top: 0;
}

.lSSlideOuter.vertical .lSAction > .lSNext {
  background-position: 31px -31px;
  bottom: 10px;
  top: auto;
}

.lSSlideOuter.vertical .lSAction > .lSPrev {
  background-position: 0 -31px;
  bottom: auto;
  top: 10px;
}

.lSSlideOuter.lSrtl {
  direction: rtl;
}

.lSSlideOuter .lSPager, .lSSlideOuter .lightSlider {
  padding-left: 0;
  list-style: none;
}

.lSSlideOuter.lSrtl .lSPager, .lSSlideOuter.lSrtl .lightSlider {
  padding-right: 0;
}

.lSSlideOuter .lSGallery li, .lSSlideOuter .lightSlider > * {
  float: left;
}

.lSSlideOuter.lSrtl .lSGallery li, .lSSlideOuter.lSrtl .lightSlider > * {
  float: right !important;
}

@keyframes rightEnd {
  0%, 100% {
    left: 0;
  }
  50% {
    left: -15px;
  }
}

@keyframes topEnd {
  0%, 100% {
    top: 0;
  }
  50% {
    top: -15px;
  }
}

@keyframes leftEnd {
  0%, 100% {
    left: 0;
  }
  50% {
    left: 15px;
  }
}

@keyframes bottomEnd {
  0%, 100% {
    bottom: 0;
  }
  50% {
    bottom: -15px;
  }
}

.lSSlideOuter .rightEnd {
  animation: rightEnd .3s;
  position: relative;
}

.lSSlideOuter .leftEnd {
  animation: leftEnd .3s;
  position: relative;
}

.lSSlideOuter.vertical .rightEnd {
  animation: topEnd .3s;
  position: relative;
}

.lSSlideOuter.vertical .leftEnd {
  animation: bottomEnd .3s;
  position: relative;
}

.lSSlideOuter.lSrtl .rightEnd {
  animation: leftEnd .3s;
  position: relative;
}

.lSSlideOuter.lSrtl .leftEnd {
  animation: rightEnd .3s;
  position: relative;
}

.lightSlider.lsGrab > * {
  cursor: -webkit-grab;
  cursor: -o-grab;
  cursor: -ms-grab;
  cursor: grab;
}

.lightSlider.lsGrabbing > * {
  cursor: move;
  cursor: -webkit-grabbing;
  cursor: -o-grabbing;
  cursor: -ms-grabbing;
  cursor: grabbing;
}

/*------------------------------------*    #ICONS
\*------------------------------------*/
.share-wrap {
  border-top: 2px solid #e8eaeb;
  border-bottom: 2px solid #e8eaeb;
  padding-top: 25px;
  padding-bottom: 27px;
}

@media screen and (max-width: 768px) {
  .share-wrap {
    padding-left: 10px;
    padding-right: 10px;
  }
}

.share {
  position: relative;
  display: inline-block;
}

.js-share {
  position: relative;
  z-index: 5;
}

.js-share:hover {
  color: #fff;
}

.share__icon {
  position: absolute;
  left: 0;
  top: 0;
  z-index: 1;
  opacity: 0;
}

.is-active .share__icon {
  opacity: 1;
}

.is-active .share__icon--face {
  transition: transform 0.12s cubic-bezier(0.215, 0.61, 0.355, 1), opacity 0.2s cubic-bezier(0.215, 0.61, 0.355, 1);
  -khtml-transform: translateX(50px);
  -ms-transform: translateX(50px);
  transform: translateX(50px);
}

.is-active .share__icon--tw {
  transition: transform 0.16s cubic-bezier(0.215, 0.61, 0.355, 1) 0.07s, opacity 0.2s cubic-bezier(0.215, 0.61, 0.355, 1) 0.1s;
  -khtml-transform: translateX(100px);
  -ms-transform: translateX(100px);
  transform: translateX(100px);
}

.is-active .share__icon--google {
  transition: transform 0.2s cubic-bezier(0.215, 0.61, 0.355, 1) 0.15s, opacity 0.2s cubic-bezier(0.215, 0.61, 0.355, 1) 0.2s;
  -khtml-transform: translateX(150px);
  -ms-transform: translateX(150px);
  transform: translateX(150px);
}

/**
 * LTR tyles
 */
html[dir=ltr] .share.is-active .share__icon--face {
  -khtml-transform: translateX(-50px);
  -ms-transform: translateX(-50px);
  transform: translateX(-50px);
}

html[dir=ltr] .share.is-active .share__icon--tw {
  -khtml-transform: translateX(-100px);
  -ms-transform: translateX(-100px);
  transform: translateX(-100px);
}

html[dir=ltr] .share.is-active .share__icon--google {
  -khtml-transform: translateX(-150px);
  -ms-transform: translateX(-150px);
  transform: translateX(-150px);
}

html[dir=ltr] .js-share {
  -khtml-transform: rotate(270deg);
  -ms-transform: rotate(270deg);
  transform: rotate(270deg);
}

html[dir=ltr] .is-active.share__icon {
  left: auto;
  right: 0;
}

/*------------------------------------* 
   #COVERIZE
\*------------------------------------*/
.coverize {
  position: relative;
  z-index: 1;
}

.coverize:hover .coverize__mask {
  opacity: 1;
}

.coverize__mask {
  position: absolute;
  background: rgba(0, 0, 0, 0.7);
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  z-index: 5;
  text-align: center;
  opacity: 0;
  transition: opacity 0.2s ease-out;
}

.coverize__icon {
  position: relative;
  top: 50%;
  -khtml-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  z-index: 10;
  color: white;
  font-size: 13px;
  vertical-align: middle;
}

/**
 * Owl Carousel v2.2.1
 * Copyright 2013-2017 David Deutsch
 * Licensed under  ()
 */
/*
 *  Owl Carousel - Core
 */
.owl-carousel {
  display: none;
  width: 100%;
  -webkit-tap-highlight-color: transparent;
  /* position relative and z-index fix webkit rendering fonts issue */
  position: relative;
  z-index: 1;
}

.owl-carousel .owl-stage {
  position: relative;
  -ms-touch-action: pan-Y;
  -moz-backface-visibility: hidden;
  /* fix firefox animation glitch */
}

.owl-carousel .owl-stage:after {
  content: ".";
  display: block;
  clear: both;
  visibility: hidden;
  line-height: 0;
  height: 0;
}

.owl-carousel .owl-stage-outer {
  position: relative;
  overflow: hidden;
  /* fix for flashing background */
  -webkit-transform: translate3d(0px, 0px, 0px);
}

.owl-carousel .owl-wrapper,
.owl-carousel .owl-item {
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  -ms-backface-visibility: hidden;
  -webkit-transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
}

.owl-carousel .owl-item {
  position: relative;
  min-height: 1px;
  float: left;
  -webkit-backface-visibility: hidden;
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
}

.owl-carousel .owl-item img {
  display: block;
  width: 100%;
}

.owl-carousel .owl-nav.disabled,
.owl-carousel .owl-dots.disabled {
  display: none;
}

.owl-carousel .owl-nav .owl-prev,
.owl-carousel .owl-nav .owl-next,
.owl-carousel .owl-dot {
  cursor: pointer;
  cursor: hand;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.owl-carousel.owl-loaded {
  display: block;
}

.owl-carousel.owl-loading {
  opacity: 0;
  display: block;
}

.owl-carousel.owl-hidden {
  opacity: 0;
}

.owl-carousel.owl-refresh .owl-item {
  visibility: hidden;
}

.owl-carousel.owl-drag .owl-item {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.owl-carousel.owl-grab {
  cursor: move;
  cursor: -webkit-grab;
  cursor: grab;
}

.owl-carousel.owl-rtl {
  direction: rtl;
}

.owl-carousel.owl-rtl .owl-item {
  float: right;
}

/* No Js */
.no-js .owl-carousel {
  display: block;
}

/*
 *  Owl Carousel - Animate Plugin
 */
.owl-carousel .animated {
  animation-duration: 1000ms;
  animation-fill-mode: both;
}

.owl-carousel .owl-animated-in {
  z-index: 0;
}

.owl-carousel .owl-animated-out {
  z-index: 1;
}

.owl-carousel .fadeOut {
  animation-name: fadeOut;
}

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

/*
 *  Owl Carousel - Auto Height Plugin
 */
.owl-height {
  transition: height 500ms ease-in-out;
}

/*
 *  Owl Carousel - Lazy Load Plugin
 */
.owl-carousel .owl-item .owl-lazy {
  opacity: 0;
  transition: opacity 400ms ease;
}

.owl-carousel .owl-item img.owl-lazy {
  transform-style: preserve-3d;
}

/*
 *  Owl Carousel - Video Plugin
 */
.owl-carousel .owl-video-wrapper {
  position: relative;
  height: 100%;
  background: #000;
}

.owl-carousel .owl-video-play-icon {
  position: absolute;
  height: 80px;
  width: 80px;
  left: 50%;
  top: 50%;
  margin-left: -40px;
  margin-top: -40px;
  background: url("owl.video.play.png") no-repeat;
  cursor: pointer;
  z-index: 1;
  -webkit-backface-visibility: hidden;
  transition: transform 100ms ease;
}

.owl-carousel .owl-video-play-icon:hover {
  -ms-transform: scale(1.3, 1.3);
  transform: scale(1.3, 1.3);
}

.owl-carousel .owl-video-playing .owl-video-tn,
.owl-carousel .owl-video-playing .owl-video-play-icon {
  display: none;
}

.owl-carousel .owl-video-tn {
  opacity: 0;
  height: 100%;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  transition: opacity 400ms ease;
}

.owl-carousel .owl-video-frame {
  position: relative;
  z-index: 1;
  height: 100%;
  width: 100%;
}

/*!
Animate.css - http://daneden.me/animate
Licensed under the MIT license

Copyright (c) 2013 Daniel Eden

Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
*/
.animated {
  animation-duration: 1s;
  animation-fill-mode: both;
}

.animated.infinite {
  animation-iteration-count: infinite;
}

.animated.hinge {
  animation-duration: 2s;
}

@keyframes bounce {
  0%, 20%, 50%, 80%, 100% {
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
  40% {
    -ms-transform: translateY(-30px);
    transform: translateY(-30px);
  }
  60% {
    -ms-transform: translateY(-15px);
    transform: translateY(-15px);
  }
}

.bounce {
  animation-name: bounce;
}

@keyframes flash {
  0%, 50%, 100% {
    opacity: 1;
  }
  25%, 75% {
    opacity: 0;
  }
}

.flash {
  animation-name: flash;
}

/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */

@keyframes pulse {
  0% {
    -ms-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -ms-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -ms-transform: scale(1);
    transform: scale(1);
  }
}

.pulse {
  animation-name: pulse;
}

@keyframes rubberBand {
  0% {
    -ms-transform: scale(1);
    transform: scale(1);
  }
  30% {
    -ms-transform: scaleX(1.25) scaleY(0.75);
    transform: scaleX(1.25) scaleY(0.75);
  }
  40% {
    -ms-transform: scaleX(0.75) scaleY(1.25);
    transform: scaleX(0.75) scaleY(1.25);
  }
  60% {
    -ms-transform: scaleX(1.15) scaleY(0.85);
    transform: scaleX(1.15) scaleY(0.85);
  }
  100% {
    -ms-transform: scale(1);
    transform: scale(1);
  }
}

.rubberBand {
  animation-name: rubberBand;
}

@keyframes shake {
  0%, 100% {
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
  10%, 30%, 50%, 70%, 90% {
    -ms-transform: translateX(-10px);
    transform: translateX(-10px);
  }
  20%, 40%, 60%, 80% {
    -ms-transform: translateX(10px);
    transform: translateX(10px);
  }
}

.shake {
  animation-name: shake;
}

@keyframes swing {
  20% {
    -ms-transform: rotate(15deg);
    transform: rotate(15deg);
  }
  40% {
    -ms-transform: rotate(-10deg);
    transform: rotate(-10deg);
  }
  60% {
    -ms-transform: rotate(5deg);
    transform: rotate(5deg);
  }
  80% {
    -ms-transform: rotate(-5deg);
    transform: rotate(-5deg);
  }
  100% {
    -ms-transform: rotate(0deg);
    transform: rotate(0deg);
  }
}

.swing {
  -ms-transform-origin: top center;
  transform-origin: top center;
  animation-name: swing;
}

@keyframes tada {
  0% {
    -ms-transform: scale(1);
    transform: scale(1);
  }
  10%, 20% {
    -ms-transform: scale(0.9) rotate(-3deg);
    transform: scale(0.9) rotate(-3deg);
  }
  30%, 50%, 70%, 90% {
    -ms-transform: scale(1.1) rotate(3deg);
    transform: scale(1.1) rotate(3deg);
  }
  40%, 60%, 80% {
    -ms-transform: scale(1.1) rotate(-3deg);
    transform: scale(1.1) rotate(-3deg);
  }
  100% {
    -ms-transform: scale(1) rotate(0);
    transform: scale(1) rotate(0);
  }
}

.tada {
  animation-name: tada;
}

/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */

@keyframes wobble {
  0% {
    -ms-transform: translateX(0%);
    transform: translateX(0%);
  }
  15% {
    -ms-transform: translateX(-25%) rotate(-5deg);
    transform: translateX(-25%) rotate(-5deg);
  }
  30% {
    -ms-transform: translateX(20%) rotate(3deg);
    transform: translateX(20%) rotate(3deg);
  }
  45% {
    -ms-transform: translateX(-15%) rotate(-3deg);
    transform: translateX(-15%) rotate(-3deg);
  }
  60% {
    -ms-transform: translateX(10%) rotate(2deg);
    transform: translateX(10%) rotate(2deg);
  }
  75% {
    -ms-transform: translateX(-5%) rotate(-1deg);
    transform: translateX(-5%) rotate(-1deg);
  }
  100% {
    -ms-transform: translateX(0%);
    transform: translateX(0%);
  }
}

.wobble {
  animation-name: wobble;
}

@keyframes bounceIn {
  0% {
    opacity: 0;
    -ms-transform: scale(0.3);
    transform: scale(0.3);
  }
  50% {
    opacity: 1;
    -ms-transform: scale(1.05);
    transform: scale(1.05);
  }
  70% {
    -ms-transform: scale(0.9);
    transform: scale(0.9);
  }
  100% {
    opacity: 1;
    -ms-transform: scale(1);
    transform: scale(1);
  }
}

.bounceIn {
  animation-name: bounceIn;
}

@keyframes bounceInDown {
  0% {
    opacity: 0;
    -ms-transform: translateY(-2000px);
    transform: translateY(-2000px);
  }
  60% {
    opacity: 1;
    -ms-transform: translateY(30px);
    transform: translateY(30px);
  }
  80% {
    -ms-transform: translateY(-10px);
    transform: translateY(-10px);
  }
  100% {
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
}

.bounceInDown {
  animation-name: bounceInDown;
}

@keyframes bounceInLeft {
  0% {
    opacity: 0;
    -ms-transform: translateX(-2000px);
    transform: translateX(-2000px);
  }
  60% {
    opacity: 1;
    -ms-transform: translateX(30px);
    transform: translateX(30px);
  }
  80% {
    -ms-transform: translateX(-10px);
    transform: translateX(-10px);
  }
  100% {
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
}

.bounceInLeft {
  animation-name: bounceInLeft;
}

@keyframes bounceInRight {
  0% {
    opacity: 0;
    -ms-transform: translateX(2000px);
    transform: translateX(2000px);
  }
  60% {
    opacity: 1;
    -ms-transform: translateX(-30px);
    transform: translateX(-30px);
  }
  80% {
    -ms-transform: translateX(10px);
    transform: translateX(10px);
  }
  100% {
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
}

.bounceInRight {
  animation-name: bounceInRight;
}

@keyframes bounceInUp {
  0% {
    opacity: 0;
    -ms-transform: translateY(2000px);
    transform: translateY(2000px);
  }
  60% {
    opacity: 1;
    -ms-transform: translateY(-30px);
    transform: translateY(-30px);
  }
  80% {
    -ms-transform: translateY(10px);
    transform: translateY(10px);
  }
  100% {
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
}

.bounceInUp {
  animation-name: bounceInUp;
}

@keyframes bounceOut {
  0% {
    -ms-transform: scale(1);
    transform: scale(1);
  }
  25% {
    -ms-transform: scale(0.95);
    transform: scale(0.95);
  }
  50% {
    opacity: 1;
    -ms-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    opacity: 0;
    -ms-transform: scale(0.3);
    transform: scale(0.3);
  }
}

.bounceOut {
  animation-name: bounceOut;
}

@keyframes bounceOutDown {
  0% {
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
  20% {
    opacity: 1;
    -ms-transform: translateY(-20px);
    transform: translateY(-20px);
  }
  100% {
    opacity: 0;
    -ms-transform: translateY(2000px);
    transform: translateY(2000px);
  }
}

.bounceOutDown {
  animation-name: bounceOutDown;
}

@keyframes bounceOutLeft {
  0% {
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
  20% {
    opacity: 1;
    -ms-transform: translateX(20px);
    transform: translateX(20px);
  }
  100% {
    opacity: 0;
    -ms-transform: translateX(-2000px);
    transform: translateX(-2000px);
  }
}

.bounceOutLeft {
  animation-name: bounceOutLeft;
}

@keyframes bounceOutRight {
  0% {
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
  20% {
    opacity: 1;
    -ms-transform: translateX(-20px);
    transform: translateX(-20px);
  }
  100% {
    opacity: 0;
    -ms-transform: translateX(2000px);
    transform: translateX(2000px);
  }
}

.bounceOutRight {
  animation-name: bounceOutRight;
}

@keyframes bounceOutUp {
  0% {
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
  20% {
    opacity: 1;
    -ms-transform: translateY(20px);
    transform: translateY(20px);
  }
  100% {
    opacity: 0;
    -ms-transform: translateY(-2000px);
    transform: translateY(-2000px);
  }
}

.bounceOutUp {
  animation-name: bounceOutUp;
}

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

.fadeIn {
  animation-name: fadeIn;
}

@keyframes fadeInDown {
  0% {
    opacity: 0;
    -ms-transform: translateY(-20px);
    transform: translateY(-20px);
  }
  100% {
    opacity: 1;
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
}

.fadeInDown {
  animation-name: fadeInDown;
}

@keyframes fadeInDownBig {
  0% {
    opacity: 0;
    -ms-transform: translateY(-2000px);
    transform: translateY(-2000px);
  }
  100% {
    opacity: 1;
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
}

.fadeInDownBig {
  animation-name: fadeInDownBig;
}

@keyframes fadeInLeft {
  0% {
    opacity: 0;
    -ms-transform: translateX(-20px);
    transform: translateX(-20px);
  }
  100% {
    opacity: 1;
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
}

.fadeInLeft {
  animation-name: fadeInLeft;
}

@keyframes fadeInLeftBig {
  0% {
    opacity: 0;
    -ms-transform: translateX(-2000px);
    transform: translateX(-2000px);
  }
  100% {
    opacity: 1;
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
}

.fadeInLeftBig {
  animation-name: fadeInLeftBig;
}

@keyframes fadeInRight {
  0% {
    opacity: 0;
    -ms-transform: translateX(20px);
    transform: translateX(20px);
  }
  100% {
    opacity: 1;
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
}

.fadeInRight {
  animation-name: fadeInRight;
}

@keyframes fadeInRightBig {
  0% {
    opacity: 0;
    -ms-transform: translateX(2000px);
    transform: translateX(2000px);
  }
  100% {
    opacity: 1;
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
}

.fadeInRightBig {
  animation-name: fadeInRightBig;
}

@keyframes fadeInUp {
  0% {
    opacity: 0;
    -ms-transform: translateY(20px);
    transform: translateY(20px);
  }
  100% {
    opacity: 1;
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
}

.fadeInUp {
  animation-name: fadeInUp;
}

@keyframes fadeInUpBig {
  0% {
    opacity: 0;
    -ms-transform: translateY(2000px);
    transform: translateY(2000px);
  }
  100% {
    opacity: 1;
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
}

.fadeInUpBig {
  animation-name: fadeInUpBig;
}

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

.fadeOut {
  animation-name: fadeOut;
}

@keyframes fadeOutDown {
  0% {
    opacity: 1;
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
  100% {
    opacity: 0;
    -ms-transform: translateY(20px);
    transform: translateY(20px);
  }
}

.fadeOutDown {
  animation-name: fadeOutDown;
}

@keyframes fadeOutDownBig {
  0% {
    opacity: 1;
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
  100% {
    opacity: 0;
    -ms-transform: translateY(2000px);
    transform: translateY(2000px);
  }
}

.fadeOutDownBig {
  animation-name: fadeOutDownBig;
}

@keyframes fadeOutLeft {
  0% {
    opacity: 1;
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
  100% {
    opacity: 0;
    -ms-transform: translateX(-20px);
    transform: translateX(-20px);
  }
}

.fadeOutLeft {
  animation-name: fadeOutLeft;
}

@keyframes fadeOutLeftBig {
  0% {
    opacity: 1;
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
  100% {
    opacity: 0;
    -ms-transform: translateX(-2000px);
    transform: translateX(-2000px);
  }
}

.fadeOutLeftBig {
  animation-name: fadeOutLeftBig;
}

@keyframes fadeOutRight {
  0% {
    opacity: 1;
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
  100% {
    opacity: 0;
    -ms-transform: translateX(20px);
    transform: translateX(20px);
  }
}

.fadeOutRight {
  animation-name: fadeOutRight;
}

@keyframes fadeOutRightBig {
  0% {
    opacity: 1;
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
  100% {
    opacity: 0;
    -ms-transform: translateX(2000px);
    transform: translateX(2000px);
  }
}

.fadeOutRightBig {
  animation-name: fadeOutRightBig;
}

@keyframes fadeOutUp {
  0% {
    opacity: 1;
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
  100% {
    opacity: 0;
    -ms-transform: translateY(-20px);
    transform: translateY(-20px);
  }
}

.fadeOutUp {
  animation-name: fadeOutUp;
}

@keyframes fadeOutUpBig {
  0% {
    opacity: 1;
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
  100% {
    opacity: 0;
    -ms-transform: translateY(-2000px);
    transform: translateY(-2000px);
  }
}

.fadeOutUpBig {
  animation-name: fadeOutUpBig;
}

@keyframes flip {
  0% {
    -ms-transform: perspective(400px) translateZ(0) rotateY(0) scale(1);
    transform: perspective(400px) translateZ(0) rotateY(0) scale(1);
    animation-timing-function: ease-out;
  }
  40% {
    -ms-transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1);
    transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1);
    animation-timing-function: ease-out;
  }
  50% {
    -ms-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);
    transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);
    animation-timing-function: ease-in;
  }
  80% {
    -ms-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(0.95);
    transform: perspective(400px) translateZ(0) rotateY(360deg) scale(0.95);
    animation-timing-function: ease-in;
  }
  100% {
    -ms-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1);
    transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1);
    animation-timing-function: ease-in;
  }
}

.animated.flip {
  -webkit-backface-visibility: visible;
  backface-visibility: visible;
  animation-name: flip;
}

@keyframes flipInX {
  0% {
    -ms-transform: perspective(400px) rotateX(90deg);
    transform: perspective(400px) rotateX(90deg);
    opacity: 0;
  }
  40% {
    -ms-transform: perspective(400px) rotateX(-10deg);
    transform: perspective(400px) rotateX(-10deg);
  }
  70% {
    -ms-transform: perspective(400px) rotateX(10deg);
    transform: perspective(400px) rotateX(10deg);
  }
  100% {
    -ms-transform: perspective(400px) rotateX(0deg);
    transform: perspective(400px) rotateX(0deg);
    opacity: 1;
  }
}

.flipInX {
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
  animation-name: flipInX;
}

@keyframes flipInY {
  0% {
    -ms-transform: perspective(400px) rotateY(90deg);
    transform: perspective(400px) rotateY(90deg);
    opacity: 0;
  }
  40% {
    -ms-transform: perspective(400px) rotateY(-10deg);
    transform: perspective(400px) rotateY(-10deg);
  }
  70% {
    -ms-transform: perspective(400px) rotateY(10deg);
    transform: perspective(400px) rotateY(10deg);
  }
  100% {
    -ms-transform: perspective(400px) rotateY(0deg);
    transform: perspective(400px) rotateY(0deg);
    opacity: 1;
  }
}

.flipInY {
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
  animation-name: flipInY;
}

@keyframes flipOutX {
  0% {
    -ms-transform: perspective(400px) rotateX(0deg);
    transform: perspective(400px) rotateX(0deg);
    opacity: 1;
  }
  100% {
    -ms-transform: perspective(400px) rotateX(90deg);
    transform: perspective(400px) rotateX(90deg);
    opacity: 0;
  }
}

.flipOutX {
  animation-name: flipOutX;
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
}

@keyframes flipOutY {
  0% {
    -ms-transform: perspective(400px) rotateY(0deg);
    transform: perspective(400px) rotateY(0deg);
    opacity: 1;
  }
  100% {
    -ms-transform: perspective(400px) rotateY(90deg);
    transform: perspective(400px) rotateY(90deg);
    opacity: 0;
  }
}

.flipOutY {
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
  animation-name: flipOutY;
}

@keyframes lightSpeedIn {
  0% {
    -ms-transform: translateX(100%) skewX(-30deg);
    transform: translateX(100%) skewX(-30deg);
    opacity: 0;
  }
  60% {
    -ms-transform: translateX(-20%) skewX(30deg);
    transform: translateX(-20%) skewX(30deg);
    opacity: 1;
  }
  80% {
    -ms-transform: translateX(0%) skewX(-15deg);
    transform: translateX(0%) skewX(-15deg);
    opacity: 1;
  }
  100% {
    -ms-transform: translateX(0%) skewX(0deg);
    transform: translateX(0%) skewX(0deg);
    opacity: 1;
  }
}

.lightSpeedIn {
  animation-name: lightSpeedIn;
  animation-timing-function: ease-out;
}

@keyframes lightSpeedOut {
  0% {
    -ms-transform: translateX(0%) skewX(0deg);
    transform: translateX(0%) skewX(0deg);
    opacity: 1;
  }
  100% {
    -ms-transform: translateX(100%) skewX(-30deg);
    transform: translateX(100%) skewX(-30deg);
    opacity: 0;
  }
}

.lightSpeedOut {
  animation-name: lightSpeedOut;
  animation-timing-function: ease-in;
}

@keyframes rotateIn {
  0% {
    -ms-transform-origin: center center;
    transform-origin: center center;
    -ms-transform: rotate(-200deg);
    transform: rotate(-200deg);
    opacity: 0;
  }
  100% {
    -ms-transform-origin: center center;
    transform-origin: center center;
    -ms-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }
}

.rotateIn {
  animation-name: rotateIn;
}

@keyframes rotateInDownLeft {
  0% {
    -ms-transform-origin: left bottom;
    transform-origin: left bottom;
    -ms-transform: rotate(-90deg);
    transform: rotate(-90deg);
    opacity: 0;
  }
  100% {
    -ms-transform-origin: left bottom;
    transform-origin: left bottom;
    -ms-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }
}

.rotateInDownLeft {
  animation-name: rotateInDownLeft;
}

@keyframes rotateInDownRight {
  0% {
    -ms-transform-origin: right bottom;
    transform-origin: right bottom;
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
    opacity: 0;
  }
  100% {
    -ms-transform-origin: right bottom;
    transform-origin: right bottom;
    -ms-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }
}

.rotateInDownRight {
  animation-name: rotateInDownRight;
}

@keyframes rotateInUpLeft {
  0% {
    -ms-transform-origin: left bottom;
    transform-origin: left bottom;
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
    opacity: 0;
  }
  100% {
    -ms-transform-origin: left bottom;
    transform-origin: left bottom;
    -ms-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }
}

.rotateInUpLeft {
  animation-name: rotateInUpLeft;
}

@keyframes rotateInUpRight {
  0% {
    -ms-transform-origin: right bottom;
    transform-origin: right bottom;
    -ms-transform: rotate(-90deg);
    transform: rotate(-90deg);
    opacity: 0;
  }
  100% {
    -ms-transform-origin: right bottom;
    transform-origin: right bottom;
    -ms-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }
}

.rotateInUpRight {
  animation-name: rotateInUpRight;
}

@keyframes rotateOut {
  0% {
    -ms-transform-origin: center center;
    transform-origin: center center;
    -ms-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }
  100% {
    -ms-transform-origin: center center;
    transform-origin: center center;
    -ms-transform: rotate(200deg);
    transform: rotate(200deg);
    opacity: 0;
  }
}

.rotateOut {
  animation-name: rotateOut;
}

@keyframes rotateOutDownLeft {
  0% {
    -ms-transform-origin: left bottom;
    transform-origin: left bottom;
    -ms-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }
  100% {
    -ms-transform-origin: left bottom;
    transform-origin: left bottom;
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
    opacity: 0;
  }
}

.rotateOutDownLeft {
  animation-name: rotateOutDownLeft;
}

@keyframes rotateOutDownRight {
  0% {
    -ms-transform-origin: right bottom;
    transform-origin: right bottom;
    -ms-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }
  100% {
    -ms-transform-origin: right bottom;
    transform-origin: right bottom;
    -ms-transform: rotate(-90deg);
    transform: rotate(-90deg);
    opacity: 0;
  }
}

.rotateOutDownRight {
  animation-name: rotateOutDownRight;
}

@keyframes rotateOutUpLeft {
  0% {
    -ms-transform-origin: left bottom;
    transform-origin: left bottom;
    -ms-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }
  100% {
    -ms-transform-origin: left bottom;
    transform-origin: left bottom;
    -ms-transform: rotate(-90deg);
    transform: rotate(-90deg);
    opacity: 0;
  }
}

.rotateOutUpLeft {
  animation-name: rotateOutUpLeft;
}

@keyframes rotateOutUpRight {
  0% {
    -ms-transform-origin: right bottom;
    transform-origin: right bottom;
    -ms-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }
  100% {
    -ms-transform-origin: right bottom;
    transform-origin: right bottom;
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
    opacity: 0;
  }
}

.rotateOutUpRight {
  animation-name: rotateOutUpRight;
}

@keyframes slideInDown {
  0% {
    opacity: 0;
    -ms-transform: translateY(-2000px);
    transform: translateY(-2000px);
  }
  100% {
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
}

.slideInDown {
  animation-name: slideInDown;
}

@keyframes slideInLeft {
  0% {
    opacity: 0;
    -ms-transform: translateX(-2000px);
    transform: translateX(-2000px);
  }
  100% {
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
}

.slideInLeft {
  animation-name: slideInLeft;
}

@keyframes slideInRight {
  0% {
    opacity: 0;
    -ms-transform: translateX(2000px);
    transform: translateX(2000px);
  }
  100% {
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
}

.slideInRight {
  animation-name: slideInRight;
}

@keyframes slideOutLeft {
  0% {
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
  100% {
    opacity: 0;
    -ms-transform: translateX(-2000px);
    transform: translateX(-2000px);
  }
}

.slideOutLeft {
  animation-name: slideOutLeft;
}

@keyframes slideOutRight {
  0% {
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
  100% {
    opacity: 0;
    -ms-transform: translateX(2000px);
    transform: translateX(2000px);
  }
}

.slideOutRight {
  animation-name: slideOutRight;
}

@keyframes slideOutUp {
  0% {
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
  100% {
    opacity: 0;
    -ms-transform: translateY(-2000px);
    transform: translateY(-2000px);
  }
}

.slideOutUp {
  animation-name: slideOutUp;
}

@keyframes slideInUp {
  0% {
    opacity: 0;
    -ms-transform: translateY(2000px);
    transform: translateY(2000px);
  }
  100% {
    opacity: 1;
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
}

.slideInUp {
  animation-name: slideInUp;
}

@keyframes slideOutDown {
  0% {
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
  100% {
    opacity: 0;
    -ms-transform: translateY(2000px);
    transform: translateY(2000px);
  }
}

.slideOutDown {
  animation-name: slideOutDown;
}

@keyframes hinge {
  0% {
    -ms-transform: rotate(0);
    transform: rotate(0);
    -ms-transform-origin: top left;
    transform-origin: top left;
    animation-timing-function: ease-in-out;
  }
  20%, 60% {
    -ms-transform: rotate(80deg);
    transform: rotate(80deg);
    -ms-transform-origin: top left;
    transform-origin: top left;
    animation-timing-function: ease-in-out;
  }
  40% {
    -ms-transform: rotate(60deg);
    transform: rotate(60deg);
    -ms-transform-origin: top left;
    transform-origin: top left;
    animation-timing-function: ease-in-out;
  }
  80% {
    -ms-transform: rotate(60deg) translateY(0);
    transform: rotate(60deg) translateY(0);
    -ms-transform-origin: top left;
    transform-origin: top left;
    animation-timing-function: ease-in-out;
    opacity: 1;
  }
  100% {
    -ms-transform: translateY(700px);
    transform: translateY(700px);
    opacity: 0;
  }
}

.hinge {
  animation-name: hinge;
}

/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */

@keyframes rollIn {
  0% {
    opacity: 0;
    -ms-transform: translateX(-100%) rotate(-120deg);
    transform: translateX(-100%) rotate(-120deg);
  }
  100% {
    opacity: 1;
    -ms-transform: translateX(0px) rotate(0deg);
    transform: translateX(0px) rotate(0deg);
  }
}

.rollIn {
  animation-name: rollIn;
}

/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */

@keyframes rollOut {
  0% {
    opacity: 1;
    -ms-transform: translateX(0px) rotate(0deg);
    transform: translateX(0px) rotate(0deg);
  }
  100% {
    opacity: 0;
    -ms-transform: translateX(100%) rotate(120deg);
    transform: translateX(100%) rotate(120deg);
  }
}

.rollOut {
  animation-name: rollOut;
}

@keyframes zoomIn {
  0% {
    opacity: 0;
    -ms-transform: scale(0.3);
    transform: scale(0.3);
  }
  50% {
    opacity: 1;
  }
}

.zoomIn {
  animation-name: zoomIn;
}

@keyframes zoomInDown {
  0% {
    opacity: 0;
    -ms-transform: scale(0.1) translateY(-2000px);
    transform: scale(0.1) translateY(-2000px);
    animation-timing-function: ease-in-out;
  }
  60% {
    opacity: 1;
    -ms-transform: scale(0.475) translateY(60px);
    transform: scale(0.475) translateY(60px);
    animation-timing-function: ease-out;
  }
}

.zoomInDown {
  animation-name: zoomInDown;
}

@keyframes zoomInLeft {
  0% {
    opacity: 0;
    -ms-transform: scale(0.1) translateX(-2000px);
    transform: scale(0.1) translateX(-2000px);
    animation-timing-function: ease-in-out;
  }
  60% {
    opacity: 1;
    -ms-transform: scale(0.475) translateX(48px);
    transform: scale(0.475) translateX(48px);
    animation-timing-function: ease-out;
  }
}

.zoomInLeft {
  animation-name: zoomInLeft;
}

@keyframes zoomInRight {
  0% {
    opacity: 0;
    -ms-transform: scale(0.1) translateX(2000px);
    transform: scale(0.1) translateX(2000px);
    animation-timing-function: ease-in-out;
  }
  60% {
    opacity: 1;
    -ms-transform: scale(0.475) translateX(-48px);
    transform: scale(0.475) translateX(-48px);
    animation-timing-function: ease-out;
  }
}

.zoomInRight {
  animation-name: zoomInRight;
}

@keyframes zoomInUp {
  0% {
    opacity: 0;
    -ms-transform: scale(0.1) translateY(2000px);
    transform: scale(0.1) translateY(2000px);
    animation-timing-function: ease-in-out;
  }
  60% {
    opacity: 1;
    -ms-transform: scale(0.475) translateY(-60px);
    transform: scale(0.475) translateY(-60px);
    animation-timing-function: ease-out;
  }
}

.zoomInUp {
  animation-name: zoomInUp;
}

@keyframes zoomOut {
  0% {
    opacity: 1;
    -ms-transform: scale(1);
    transform: scale(1);
  }
  50% {
    opacity: 0;
    -ms-transform: scale(0.3);
    transform: scale(0.3);
  }
  100% {
    opacity: 0;
  }
}

.zoomOut {
  animation-name: zoomOut;
}

@keyframes zoomOutDown {
  40% {
    opacity: 1;
    -ms-transform: scale(0.475) translateY(-60px);
    transform: scale(0.475) translateY(-60px);
    animation-timing-function: linear;
  }
  100% {
    opacity: 0;
    -ms-transform: scale(0.1) translateY(2000px);
    transform: scale(0.1) translateY(2000px);
    -ms-transform-origin: center bottom;
    transform-origin: center bottom;
  }
}

.zoomOutDown {
  animation-name: zoomOutDown;
}

@keyframes zoomOutLeft {
  40% {
    opacity: 1;
    -ms-transform: scale(0.475) translateX(42px);
    transform: scale(0.475) translateX(42px);
    animation-timing-function: linear;
  }
  100% {
    opacity: 0;
    -ms-transform: scale(0.1) translateX(-2000px);
    transform: scale(0.1) translateX(-2000px);
    -ms-transform-origin: left center;
    transform-origin: left center;
  }
}

.zoomOutLeft {
  animation-name: zoomOutLeft;
}

@keyframes zoomOutRight {
  40% {
    opacity: 1;
    -ms-transform: scale(0.475) translateX(-42px);
    transform: scale(0.475) translateX(-42px);
    animation-timing-function: linear;
  }
  100% {
    opacity: 0;
    -ms-transform: scale(0.1) translateX(2000px);
    transform: scale(0.1) translateX(2000px);
    -ms-transform-origin: right center;
    transform-origin: right center;
  }
}

.zoomOutRight {
  animation-name: zoomOutRight;
}

@keyframes zoomOutUp {
  40% {
    opacity: 1;
    -ms-transform: scale(0.475) translateY(60px);
    transform: scale(0.475) translateY(60px);
    animation-timing-function: linear;
  }
  100% {
    opacity: 0;
    -ms-transform: scale(0.1) translateY(-2000px);
    transform: scale(0.1) translateY(-2000px);
    -ms-transform-origin: center top;
    transform-origin: center top;
  }
}

.zoomOutUp {
  animation-name: zoomOutUp;
}

/*------------------------------------*    #CALENDAR HOME AND CURRENCY RATE
\*------------------------------------*/
#ui-datepicker-div {
  min-width: 495px;
  background-color: #171d29;
  padding-top: 20px;
}

@media screen and (min-width: 320px) and (max-width: 430px) {
  #ui-datepicker-div {
    min-width: 264px;
    padding-top: 0px;
    font-size: 13px;
  }
}

@media screen and (min-width: 430px) and (max-width: 580px) {
  #ui-datepicker-div {
    min-width: 350px;
    padding-top: 0px;
    font-size: 13px;
  }
}

.ui-datepicker-inline {
  position: relative;
  z-index: 1;
}

span.ui-state-default {
  color: #fff;
}

a.ui-state-default {
  color: white !important;
  position: relative;
  z-index: 10;
  display: inline-block;
}

a.ui-state-default:before {
  content: '';
  display: inline-block;
  position: absolute;
  left: 50%;
  top: 50%;
  -ms-transform: translate(-50%, -50%);
      transform: translate(-50%, -50%);
  height: 40px;
  width: 40px;
  border-radius: 50%;
  z-index: -5;
}

.event-1 a.ui-state-default:before {
  background-color: #3d91eb;
}

.event-2 a.ui-state-default:before {
  background-color: #ed3082;
}

.event-3 a.ui-state-default:before {
  background-color: #f8c303;
}

.event-4 a.ui-state-default:before {
  background-color: #3bb17d;
}

.ui-datepicker-other-month.ui-datepicker-unselectable.ui-state-disabled span {
  color: #636c76;
}

.ui-datepicker-other-month a {
  color: #636c76;
}

.ui-datepicker-calendar {
  font-family: "Montserrat", sans-serif;
}

.ui-datepicker-calendar thead th {
  padding-bottom: 30px;
  color: #fff;
}

@media screen and (max-width: 550px) {
  .ui-datepicker-calendar thead th {
    padding-bottom: 15px;
  }
}

.ui-datepicker-calendar tbody tr {
  text-align: center;
  height: 48px;
}

@media screen and (max-width: 550px) {
  .ui-datepicker-calendar tbody tr {
    height: 35px;
  }
}

.ui-datepicker-title {
  border-top: 1px solid rgba(209, 239, 255, 0.1);
  border-bottom: 1px solid rgba(209, 239, 255, 0.1);
  text-align: center;
  padding: 20px 0;
  margin-bottom: 40px;
  color: #fff;
  font-family: "Montserrat", sans-serif;
}

@media screen and (max-width: 550px) {
  .ui-datepicker-title {
    margin-bottom: 15px;
  }
}

.ui-datepicker-header {
  position: relative;
}

.ui-datepicker .ui-datepicker-prev span,
.ui-datepicker .ui-datepicker-next span {
  display: block;
  position: absolute;
  margin-left: -8px;
  top: 50%;
  margin-top: -8px;
  cursor: pointer;
}

.ui-datepicker .ui-datepicker-next span {
  right: 30px;
  text-indent: -99999px;
  background-image: url("../images/calendar-arrow-next.png");
  width: 8px;
  height: 14px;
}

.ui-datepicker .ui-datepicker-prev span {
  left: 30px;
  text-indent: -99999px;
  background-image: url("../images/calendar-arrow-prev.png");
  width: 8px;
  height: 14px;
}

.calendar {
  margin-bottom: -17px;
}

/**
 * LTR tyles
 */
html[dir=ltr] .ui-datepicker .ui-datepicker-prev span,
html[dir=ltr] .ui-datepicker .ui-datepicker-next span {
  margin-left: 0;
  margin-right: -8px;
}

/* ===========================================================
 *
 *  Name:          selectordie_dev.css
 *  Updated:       2014-10-10
 *  Created by:    Per V @ Vst.mn
 *  What?:         Base CSS for Select or Die
 *
 *  Copyright (c) 2014 Per Vestman
 *  Dual licensed under the MIT and GPL licenses.
 *
 *  No, I don't usually comment my CSS, but in this
 *  case it might "help" someone.
 *
 *  Oddny | Cogs 'n Kegs
 * =========================================================== */
/* Remove, change to fit your needs */
.sod_select,
.sod_select * {
  box-sizing: border-box;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/* The SoD - Please keep this first three lines intact, otherwise all hell will break looooooose */
.sod_select {
  display: inline-block;
  position: relative;
  line-height: 1;
  width: 200px;
  padding: 15px 10px;
  border: 3px solid #5e5e5e;
  background: #ffffff;
  color: #444444;
  font-size: 11px;
  font-weight: 700;
  text-align: left;
  text-transform: uppercase;
  outline: 0;
  outline-offset: -2px;
  /* Opera */
  cursor: default;
}

/* Up/Down arrows */
/* Down arrow */
/* Change the border color on hover, focus and when open */
.sod_select:hover,
.sod_select.open,
.sod_select.focus {
  border-color: #000000;
}

.sod_select.open {
  color: #919191;
}

/* When the entire SoD is disabled, go crazy! */
.sod_select.disabled {
  border-color: #828282;
  color: #b2b2b2;
  cursor: not-allowed;
}

/* The "label", or whatever we should call it. Keep the first three lines for truncating. */
.sod_select .sod_label {
  display: block;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  padding-right: 15px;
}

.sod_select .sod_prefix {
  /* Use this if you're using a prefix and want to style it */
}

.sod_select .sod_placeholder {
  /* Use this if you're using a placeholder and want to style it */
}

/* Options list wrapper */
.sod_select .sod_list_wrapper {
  position: absolute;
  top: 100%;
  left: 0;
  display: none;
  height: auto;
  width: 200px;
  margin: 0 0 0 -3px;
  background: #ffffff;
  border: 3px solid #000000;
  border-top: none;
  color: #444444;
  font-weight: 300;
  z-index: 1;
}

/* Shows the option list (don't edit) */
.sod_select.open .sod_list_wrapper {
  display: block;
}

/* Don't display the options when  */
.sod_select.disabled.open .sod_list_wrapper {
  display: none;
}

/* When the option list is displayed above the SoD */
.sod_select.above .sod_list_wrapper {
  top: auto;
  bottom: 100%;
  border-top: 3px solid #000000;
  border-bottom: none;
}

/* Options list container */
.sod_select .sod_list {
  display: block;
  overflow-y: auto;
  padding: 0;
  margin: 0;
}

/* All the options. Keep the first three lines for truncating... */
.sod_select .sod_option {
  display: block;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  position: relative;
  padding: 10px 10px;
  list-style-type: none;
}

/* Optgroups */
.sod_select .sod_option.optgroup,
.sod_select .sod_option.optgroup.disabled {
  background: inherit;
  color: #939393;
  font-size: 10px;
  font-style: italic;
}

/* Children of an optgroup */
.sod_select .sod_option.groupchild {
  padding-left: 20px;
}

/* Used together with placeholderOption / data-placeholder-option */
.sod_select .sod_option.is-placeholder {
  display: none;
}

/* Disabled option */
.sod_select .sod_option.disabled {
  background: inherit;
  color: #cccccc;
}

/* Hover state for options, also used when a user uses his/hers up/down keys */
.sod_select .sod_option.active {
  background: #f7f7f7;
  color: #333333;
}

/*Make room for the check mark */
.sod_select .sod_option.selected {
  font-weight: 700;
  padding-right: 25px;
}

/* Displays a check mark for the selected option */
/* Add a .no_highlight class to you SoD to hide the check mark and don't bold the option */
.sod_select.no_highlight .sod_option.selected {
  font-weight: 300;
}

.sod_select.no_highlight .sod_option.selected:before {
  display: none;
}

.sod_select .sod_option.link {
  /* If data-link is set on a specific option */
}

.sod_select .sod_option.linkexternal {
  /* If data-link-external is set on a specific option */
}

/* Hide native select */
.sod_select select {
  display: none !important;
}

/* The native select in touch mode. Keep this first line. Sorry, keep everything. */
.sod_select.touch select {
  -webkit-appearance: menulist-button;
  position: absolute;
  top: 0;
  left: 0;
  display: block !important;
  height: 100%;
  width: 100%;
  opacity: 0;
  z-index: 1;
}

.sod_select {
  width: 100%;
  border: none;
  height: 62px;
  line-height: 62px;
  padding: 0;
  box-shadow: 0 1px 2px rgba(1, 1, 1, 0.15);
}

.sod_select .sod_list_wrapper {
  width: 100%;
  border: none;
  left: 3px;
  box-shadow: 0 1px 2px rgba(1, 1, 1, 0.15);
}

.sod_select .sod_option {
  padding-top: 0;
  padding-bottom: 0;
  padding-left: 30px;
  padding-right: 30px;
  text-align: right;
}

.sod_select .sod_label {
  text-align: right;
  padding-left: 30px;
  padding-right: 30px;
}

.sod_select .sod_label:before {
  content: '';
  width: 12px;
  height: 7px;
  background-image: url("../images/arrow-down.png");
  display: inline-block;
  position: absolute;
  left: 30px;
  top: 50%;
  -ms-transform: translateY(-50%);
      transform: translateY(-50%);
}

/**
 * Layout LTR styles.
 */
html[dir=ltr] .sod_select .sod_list_wrapper {
  left: auto;
  right: 0px;
}

html[dir=ltr] .sod_select .sod_option {
  text-align: left;
}

html[dir=ltr] .sod_select .sod_label {
  text-align: left;
}

html[dir=ltr] .sod_select .sod_label:before {
  left: auto;
  right: 30px;
}

/*------------------------------------*    #LIST-BARE
\*------------------------------------*/
/**
 * The list-bare object simply removes any indents and bullet points from lists.
 */
.list-bare {
  margin: 0;
  padding: 0;
  list-style: none;
}

/*------------------------------------*    #LIST-INLINE
\*------------------------------------*/
/**
 * The list-inline object simply displays a list of items in one line.
 */
.list-inline {
  margin: 0;
  padding: 0;
  list-style: none;
}

.list-inline > li {
  display: inline-block;
}

/**
     * Comma delimited list to semantically mark up lists of tags, etc.
     *
     * N.B. This component requires that you remove the whitespace between LIs.
     *      The simplest (and valid) way to achieve this is by omitting the
     *      closing `</li>` tag.
     */
.list-inline--delimited > li + li:before {
  content: ", ";
}

/*------------------------------------*    #BOX
\*------------------------------------*/
/**
 * The box object simply boxes off content.
 */
/**
 * 1. So we can apply the `.box` class to naturally-inline elements.
 */
.box {
  display: block;
  /* [1] */
  padding: 25px;
}

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

/*------------------------------------*    #LAYOUT
\*------------------------------------*/
/**
 * The inuitcss layout system uses `box-sizing: border-box;` and
 * `display: inline-block;` to create an extremely powerful, flexible
 * alternative to the traditional grid system. Combine the layout items with
 * the widths found in `trumps.widths`.
 */
/**
 * Begin a layout group.
 */
.layout {
  list-style: none;
  margin: 0;
  padding: 0;
  margin-left: -35px;
}

/**
     * 1. Cause columns to stack side-by-side.
     * 2. Space columns apart.
     * 3. Align columns to the tops of each other.
     * 4. Full-width unless told to behave otherwise.
     * 5. Required to combine fluid widths and fixed gutters.
     */
.layout__item {
  display: inline-block;
  /* [1] */
  padding-left: 35px;
  /* [2] */
  vertical-align: top;
  /* [3] */
  width: 100%;
  /* [4] */
}

/**
     * Layouts with tiny gutters.
     */
.layout--tiny {
  margin-left: -9px;
}

.layout--tiny > .layout__item {
  padding-left: 9px;
}

/**
     * Layouts with small gutters.
     */
.layout--small {
  margin-left: -18px;
}

.layout--small > .layout__item {
  padding-left: 18px;
}

/**
     * Layouts with large gutters.
     */
.layout--large {
  margin-left: -70px;
}

.layout--large > .layout__item {
  padding-left: 70px;
}

/**
     * Layouts with huge gutters.
     */
.layout--huge {
  margin-left: -140px;
}

.layout--huge > .layout__item {
  padding-left: 140px;
}

/**
     * Layouts with no gutters.
     */
.layout--flush {
  margin-left: 0;
}

.layout--flush > .layout__item {
  padding-left: 0;
}

/**
     * Reversed rendered order of layout items, e.g. items 1, 2, 3, 4 in your
     * markup will display in order 4, 3, 2, 1 on your page.
     */
.layout--rev {
  direction: rtl;
  text-align: left;
}

.layout--rev > .layout__item {
  direction: ltr;
  text-align: left;
}

/**
     * Align layout items to the vertical centers of each other.
     */
.layout--middle > .layout__item {
  vertical-align: middle;
}

/**
     * Align layout items to the vertical bottoms of each other.
     */
.layout--bottom > .layout__item {
  vertical-align: bottom;
}

/**
     * Make the layout items fill up from the right hand side.
     */
.layout--right {
  text-align: right;
}

.layout--right > .layout__item {
  text-align: left;
}

/**
     * Make the layout items fill up from the center outward.
     */
.layout--center {
  text-align: center;
}

.layout--center > .layout__item {
  text-align: left;
}

/**
     * Cause layout items to take up a non-explicit amount of width.
     */
.layout--auto > .layout__item {
  width: auto;
}

/*------------------------------------*    #LAYOUT-WHITESPACE-FIX
\*------------------------------------*/
/**
 * The inuitcss layout system uses `display: inline-block;` means that
 * the layout items need their whitespace removing in order for them
 * to work correctly.
 *
 * This extension is based on the font size zero method.
 * Use it only if you can't remove whitespace directly in your HTML.
 *
 * 1. Remove whitespace between child element.
 * 2. Restore font-size to `$inuit-base-font-size` using `font-size` mixin.
 */
.layout {
  font-size: 0;
  /* [1] */
}

.layout__item {
  font-size: 15px;
  font-size: 1rem;
  /* [2] */
}

/*------------------------------------*    #PACK
\*------------------------------------*/
/**
 * The pack object simply causes any number of elements pack up horizontally to
 * automatically fill an equal, fluid width of their parent.
 */
/**
 * 1. Fill all available space.
 * 2. Cause children to be automatically equally sized.
 */
.pack {
  width: 100%;
  /* [1] */
  display: table;
  table-layout: fixed;
  /* [2] */
}

/**
     * Cause children to adopt table-like structure.
     */
.pack__item {
  display: table-cell;
  /**
             * All items are aligned to the middles of each other.
             */
}

.pack--middle > .pack__item {
  vertical-align: middle;
}

/**
     * Reversed order packs.
     */
.pack--rev {
  direction: rtl;
}

.pack--rev > .pack__item {
  direction: ltr;
}

/*------------------------------------*	#LAYOUT-BOTTOM-GUTTERS
\*------------------------------------*/
/**
 * This extension uses an `:after` pseudo element with negative top margin
 * applied to `.layout` object to negate layout items bottom margin.
 */
/**
 * Default layout.
 *
 * 1. Make sure `:after` pseudo element takes the whole width of its parent.
 * 2. Negate layout item's bottom margin.
 */
.layout:after {
  content: "";
  display: block;
  /* [1] */
  margin-top: -35px;
  /* [2] */
}

.layout__item {
  margin-bottom: 35px;
}

/**
     * Layouts with tiny gutters.
     */
.layout--tiny:after {
  margin-top: -9px;
}

.layout--tiny > .layout__item {
  margin-bottom: 9px;
}

/**
     * Layouts with small gutters.
     */
.layout--small:after {
  margin-top: -18px;
}

.layout--small > .layout__item {
  margin-bottom: 18px;
}

/**
     * Layouts with large gutters.
     */
.layout--large:after {
  margin-top: -70px;
}

.layout--large > .layout__item {
  margin-bottom: 70px;
}

/**
     * Layouts with huge gutters.
     */
.layout--huge:after {
  margin-top: -140px;
}

.layout--huge > .layout__item {
  margin-bottom: 140px;
}

/**
     * Layouts with no gutters.
     */
.layout--flush:after {
  margin-top: 0;
}

.layout--flush > .layout__item {
  margin-bottom: 0;
}

/*------------------------------------*    #FOOTER MAIN
\*------------------------------------*/
.footer-main {
  background-image: url("../images/bg-footer.jpg");
  width: 100%;
  padding-top: 90px;
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
}

@media screen and (max-width: 1025px) {
  .footer-main {
    padding-top: 30px;
    background-image: none;
    background-color: #171d28;
  }
  .footer-main .layout__item {
    margin-bottom: 20px;
    padding-left: 20px;
  }
  .footer-main .container {
    padding-left: 20px;
    padding-right: 20px;
  }
  .footer-main .layout {
    margin-left: -20px;
  }
}

.footer-main ul {
  list-style: none;
  margin: 0;
  margin-bottom: 10px;
}

.footer-main .footer-main__link {
  color: #626b75;
  padding-right: 15px;
  position: relative;
  transition: all ease 0.3s;
  display: inline-block;
}

.footer-main .footer-main__link:hover {
  text-decoration: none;
  color: #fff;
}

.footer-main .footer-main__link:before {
  content: "";
  position: absolute;
  background: url("../images/arrow-footer.png");
  width: 6px;
  height: 10px;
  right: 0;
  top: 8px;
  margin-left: 15px;
}

@media screen and (max-width: 1025px) {
  .footer-main .social {
    font-size: 0;
  }
}

.footer-main .social li {
  font-family: "Montserrat", sans-serif;
  font-size: 13px;
}

@media screen and (max-width: 1025px) {
  .footer-main .social li {
    display: inline-block;
    width: 50%;
  }
}

.footer-main .social li a {
  display: inline-block;
  position: relative;
  width: 36px;
  height: 36px;
  border: 2px solid #636c76;
  border-radius: 50%;
  margin-bottom: 13px;
  margin-left: 11px;
  text-align: center;
  padding: 0;
  color: #626b75;
  transition: all ease 0.3s;
}

.footer-main .social li a:hover {
  border-color: #fff;
  text-decoration: none;
  color: #fff;
}

.footer-main .social li a span {
  position: absolute;
  right: 50px;
  top: 4px;
}

.footer-main .social .icon {
  margin-top: 8px;
}

.footer-main .social .icon:hover {
  color: #fff;
}

@media screen and (max-width: 1025px) {
  .footer-main .social-title {
    border-bottom: none;
  }
}

@media screen and (min-width: 1025px) {
  .footer-main .js-menu-dropdown {
    display: none;
  }
}

.footer-main__heading,
.social-title {
  font-size: 15px;
  font-weight: 500;
  color: #fff;
  border-bottom: 1px solid #232a35;
  padding-bottom: 25px;
  margin-bottom: 25px;
}

@media screen and (max-width: 1025px) {
  .footer-main__heading,
  .social-title {
    margin-bottom: 0;
  }
}

@media screen and (max-width: 1025px) {
  .footer-main__menu {
    display: none;
    padding-bottom: 20px;
  }
  .js-menu-dropdown {
    position: absolute;
    top: 0px;
    height: 20px;
    left: 0;
    right: 0;
    z-index: 10;
    cursor: pointer;
  }
  .js-menu-dropdown:before {
    content: '';
    position: relative;
    top: 6px;
    float: left;
    background-image: url("../images/sidebar-arrow-down.png");
    width: 12px;
    height: 7px;
    transition: all 0.3s linear;
  }
  .js-menu-dropdown.is-active:before {
    -khtml-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg);
    background-image: url("../images/arrow-down.png");
  }
  .js-menu-dropdown.is-active + .footer-main__heading {
    border-bottom: none;
  }
  .js-menu-dropdown.is-active ~ .footer-main__menu {
    border-bottom: 1px solid #232a35;
  }
  .js-menu-dropdown:hover:before {
    background-image: url("../images/arrow-down.png");
  }
}

.footer-main__copy {
  border-top: 1px solid #232a35;
  padding: 30px 0;
}

@media screen and (max-width: 1025px) {
  .footer-main__copy {
    border-top: none;
  }
}

.footer-main__copy p {
  font-family: "Montserrat", sans-serif;
  font-size: 12px;
  color: #fff;
  float: left;
  margin-top: 10px;
  margin-bottom: 0;
}

@media screen and (max-width: 1025px) {
  .footer-main__copy p {
    text-align: center;
    float: none;
  }
}

.footer-main__copy a {
  transition: all ease 0.3s;
}

.footer-main__copy a:hover {
  text-decoration: none;
}

.footer-main__copy a.logo {
  color: #636c76;
  float: right;
}

@media screen and (max-width: 1025px) {
  .footer-main__copy a.logo {
    float: none;
    text-align: center;
    display: block;
  }
}

.footer-main__copy a.logo:hover {
  color: #fff;
}

/**
 * LTR tyles
 */
@media screen and (max-width: 1025px) {
  html[dir=ltr] .footer-main .layout__item {
    padding-left: 0;
    padding-right: 20px;
  }
  html[dir=ltr] .footer-main .layout {
    margin-left: 0;
    margin-right: -20px;
  }
}

html[dir=ltr] .footer-main .footer-main__link {
  padding-right: 0;
  padding-left: 15px;
}

html[dir=ltr] .footer-main .footer-main__link:before {
  right: auto;
  left: 0;
  margin-left: 0;
  margin-right: 15px;
  -khtml-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  transform: rotate(180deg);
}

html[dir=ltr] .footer-main .social li a {
  margin-left: 0;
  margin-right: 11px;
}

html[dir=ltr] .footer-main .social li a span {
  right: auto;
  left: 50px;
}

@media screen and (max-width: 1025px) {
  html[dir=ltr] .js-menu-dropdown:before {
    float: right;
  }
}

html[dir=ltr] .footer-main__copy p {
  float: right;
}

@media screen and (max-width: 1025px) {
  html[dir=ltr] .footer-main__copy p {
    float: none;
  }
}

html[dir=ltr] .footer-main__copy a {
  transition: all ease 0.3s;
}

html[dir=ltr] .footer-main__copy a.logo {
  float: left;
}

@media screen and (max-width: 1025px) {
  html[dir=ltr] .footer-main__copy a.logo {
    float: none;
  }
}

/*------------------------------------*    #HEADER MAIN
\*------------------------------------*/
.header-main {
  z-index: 10;
  position: relative;
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
}

@media screen and (max-width: 1365px) {
  .header-desktop {
    display: none;
  }
}

.newsletter {
  background-color: #fbcd45;
  padding: 30px 50px;
  display: block;
}

.newsletter__read-more {
  position: relative;
  float: left;
}

.newsletter__read-more .js-close {
  position: absolute;
  left: 0;
  top: 15px;
}

@media screen and (max-width: 1320px) {
  .newsletter__read-more {
    float: right;
    width: 100%;
  }
}

.newsletter__form {
  float: left;
  padding-left: 43px;
  position: relative;
  color: #171d28;
}

.newsletter__form .js-close {
  position: absolute;
  left: 0;
  top: 15px;
  cursor: pointer;
}

@media screen and (max-width: 1320px) {
  .newsletter__form {
    float: right;
    width: 100%;
  }
}

.form-wrap {
  position: relative;
  border: 1px solid #d9b024;
  background-color: transparent;
  width: 372px;
}

@media screen and (max-width: 769px) {
  .form-wrap {
    width: auto;
  }
}

.newsletter__button {
  position: absolute;
  top: 12px;
  left: 20px;
  color: #171d28;
}

.input.newsletter__input {
  padding: 0 20px 0 52px;
  height: 48px;
  line-height: 48px;
  font-family: "Montserrat", sans-serif;
  font-size: 13px;
  color: #171D28;
}

.input.newsletter__input::-webkit-input-placeholder {
  color: #171d28;
}

.input.newsletter__input:-moz-placeholder {
  /* Firefox 18- */
  color: #171d28;
}

.input.newsletter__input::-moz-placeholder {
  /* Firefox 19+ */
  color: #171d28;
}

.input.newsletter__input:-ms-input-placeholder {
  color: #171d28;
}

.newsletter__text {
  float: right;
}

@media screen and (max-width: 1320px) {
  .newsletter__text {
    margin-top: 40px;
  }
}

.newsletter__text dl {
  margin: 0;
}

.newsletter__text dt {
  color: #171d28;
  font-size: 17px;
  font-weight: bold;
  line-height: 27px;
  padding-bottom: 5px;
}

.newsletter__text dd {
  color: #171d28;
  white-space: nowrap;
  overflow: hidden;
  max-width: 960px;
  text-overflow: ellipsis;
}

@media screen and (max-width: 1525px) {
  .newsletter__text dd {
    max-width: 750px;
  }
}

@media screen and (max-width: 1320px) {
  .newsletter__text dd {
    white-space: normal;
    max-width: none;
  }
}

.menu-top {
  background-color: #171d28;
  padding-right: 50px;
}

.menu-top__left {
  font-size: 0;
  float: left;
}

.menu-top__search {
  position: relative;
  display: inline-block;
}

.lang-wrap {
  float: left;
  position: relative;
  overflow: hidden;
}

.menu-top__lang {
  position: absolute;
  left: 0;
  top: 0;
  font-size: 13px;
  background-color: #3f91eb;
  color: #fff;
  vertical-align: middle;
  cursor: pointer;
  height: 48px;
  line-height: 52px;
  padding-left: 15px;
  padding-right: 15px;
}

.lang-name {
  font-family: "Montserrat", sans-serif;
  display: inline-block;
  padding-right: 13px;
  width: 110px;
  line-height: 47px;
  height: 48px;
  background-color: #3f91eb;
  color: #fff;
  font-size: 13px;
}

.lang-name:hover {
  color: #fff;
}

.menu-top__right {
  float: right;
  height: 48px;
  line-height: 48px;
}

.menu-top__right li:not(:last-child) {
  margin-left: 50px;
}

.menu-top__right li a {
  color: #636c76;
}

.menu-top__right li a:hover {
  color: #fff;
  text-decoration: none;
}

.main-menu {
  padding: 25px 50px;
  box-shadow: 0 1px 2px rgba(1, 1, 1, 0.15);
  background-color: #fff;
  transition: all .3s ease;
}

.main-menu.fixed {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  padding: 15px 50px;
}

.main-menu.fixed .main-menu__submenu.is-active:before {
  content: '';
  top: 68px;
}

.main-menu.fixed .main-menu__submenu > div {
  top: 90%;
}

.main-menu__nav {
  float: left;
  height: 55px;
  line-height: 55px;
}

.main-menu__nav > ul > li:not(:last-child) {
  margin-left: 40px;
}

.main-menu__nav > ul > li:last-child > div {
  left: -40px;
}

.main-menu__nav > ul > li a {
  color: #82919d;
}

.main-menu__nav > ul > li a:hover {
  color: #171d28;
}

.main-menu__submenu {
  position: relative;
}

.main-menu__submenu.is-active > a {
  color: #171d28;
}

.main-menu__submenu.is-active:after {
  content: url("../images/arrow-down-black.png");
  display: inline-block;
  margin-right: 5px;
  transition: all 0.4s ease;
}

.main-menu__submenu.is-active:before {
  content: '';
  position: absolute;
  display: inline-block;
  top: 79px;
  left: 0;
  height: 2px;
  width: 100%;
  background-color: #3f91eb;
}

.main-menu__submenu:before {
  content: url("../images/arrow-down.png");
  position: absolute;
  left: 0;
}

.main-menu__submenu > div {
  display: none;
  position: absolute;
  top: 100%;
  z-index: 5;
}

.main-menu__submenu > div > ul {
  width: 240px;
  margin-top: 36px;
  padding: 20px 30px;
  background-color: #fff;
  box-shadow: 0 1px 2px rgba(1, 1, 1, 0.15);
}

.main-menu__submenu > div > ul li {
  line-height: normal;
  padding-right: 15px;
}

.main-menu__submenu > div > ul li:not(:last-child) {
  padding-bottom: 10px;
}

.main-menu__submenu > div > ul a {
  position: relative;
}

.main-menu__submenu > div > ul a:before {
  content: " ";
  position: absolute;
  top: 10px;
  right: -15px;
  background-color: #ced6e0;
  height: 6px;
  width: 6px;
  display: inline-block;
  border-radius: 50%;
}

.main-menu__submenu > div > ul a:hover, .main-menu__submenu > div > ul a.is-active {
  color: #171d28;
}

.main-menu__submenu > div > ul a:hover:before, .main-menu__submenu > div > ul a.is-active:before {
  background-color: #3f91eb;
}

.main-menu__submenu__submenu {
  position: relative;
}

.main-menu__submenu__submenu:before {
  content: '';
  width: 12px;
  height: 7px;
  background-image: url("../images/arrow-down.png");
  position: absolute;
  left: 0;
  top: 11px;
  transition: all 0.4s ease;
}

.main-menu__submenu__submenu.hovered:before {
  -khtml-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  transform: rotate(180deg);
}

.main-menu__submenu__submenu > ul {
  list-style-type: none;
  position: relative;
  left: 45px;
  width: calc(100% + 75px);
  background: #f1f3f5;
  padding-right: 30px;
  padding-top: 8px;
  padding-bottom: 8px;
  margin-top: 6px;
  display: none;
}

@media screen and (min-width: 1364px) {
  .header-mobile {
    display: none;
  }
}

.header-mobile .input--search {
  width: 98px;
}

.header-mobile .search-lang {
  background-color: #232A35;
}

.header-mobile .menu-top__search {
  float: left;
  display: block;
}

.header-mobile .lang {
  position: relative;
  float: right;
  width: 130px;
}

.header-mobile .lang .icon {
  position: absolute;
  top: 13px;
  right: 15px;
}

.header-mobile .lang input[type=checkbox] {
  display: none;
}

.header-mobile .lang input[type=checkbox]:checked ~ a {
  width: 115px;
}

.header-mobile .lang label[for=lang-sel] {
  position: absolute;
  top: 0;
  height: 48px;
  width: 50px;
  background-color: #3f91eb;
  color: #fff;
  cursor: pointer;
}

.header-mobile .lang .lang__item {
  display: block;
  width: 0;
  text-align: left;
  padding-left: 13px;
  height: 48px;
  line-height: 48px;
  color: #fff;
  background-color: #3f91eb;
  font-family: "Montserrat", sans-serif;
  font-size: 14px;
  transition: all 0.4s linear;
}

.header-mobile .site-logo {
  float: right;
  padding-right: 20px;
}

.menu-mob-wrap {
  position: relative;
}

.menu-mob {
  position: relative;
  background-color: #fff;
  padding: 20px 0;
}

.menu-mob__icon {
  position: absolute;
  left: 20px;
  top: 39px;
  color: #2e3033;
}

.menu-mob__links {
  position: absolute;
  top: 0;
  width: 100%;
  z-index: 20;
  visibility: hidden;
  opacity: 0;
  transition: all 0.3s linear;
}

.menu-is-active .menu-mob__links {
  visibility: visible;
  opacity: 1;
}

.menu-mob__top li {
  display: block;
  background-color: #171d28;
  padding: 15px 20px;
}

.menu-mob__top li:not(:last-child) {
  border-bottom: 1px solid #232a35;
}

.menu-mob__top li a {
  color: #626b75;
}

.menu-mob__top li a:hover {
  color: #fff;
}

.menu-mob__bottom {
  background-color: #fff;
  box-shadow: 0 1px 2px rgba(1, 1, 1, 0.15);
}

.menu-mob__bottom ul {
  margin-left: 0;
}

.menu-mob__bottom li {
  display: block;
  padding: 15px 20px;
}

.menu-mob__bottom li a {
  color: #82919d;
}

.menu-mob__bottom li a:hover {
  color: #171d28;
}

.menu-mob__bottom li:not(:last-child) {
  border-bottom: 1px solid #e3eaf4;
}

.menu-mob__bottom li > ul {
  display: none;
}

.menu-mob__bottom li > ul li {
  position: relative;
}

.menu-mob__bottom li > ul li.has-dropdown.is-active {
  background-color: #f1f3f5;
}

.menu-mob__bottom li > ul li:not(:last-child) {
  border-bottom: none;
}

.menu-mob__bottom li > ul li:before {
  content: '';
  display: inline-block;
  position: absolute;
  right: 0;
  top: 22px;
  background-color: #ced6e0;
  height: 6px;
  width: 6px;
  border-radius: 50%;
}

.menu-mob__bottom li > ul li:hover:before {
  background-color: #3f91eb;
}

.menu-mob__bottom li > ul li a {
  color: #82919d;
}

.menu-mob__bottom li > ul li a:hover {
  color: #171d28;
}

.has-dropdown > ul li ul {
  margin-top: 10px;
  margin-bottom: -15px;
}

.has-dropdown > a {
  color: #82919d;
  position: relative;
  display: inline-block;
}

.has-dropdown > a:hover {
  color: #171d28;
}

.has-dropdown > a:before, .has-dropdown > a:after {
  content: '';
  display: inline-block;
  position: absolute;
  top: 10px;
  width: 2px;
  height: 9px;
  background-color: #ced6e0;
  transition: all 0.25s ease-in-out;
}

.has-dropdown > a:before {
  left: -30px;
  -khtml-transform: translate(13px, 0) rotate(45deg);
  -ms-transform: translate(13px, 0) rotate(45deg);
  transform: translate(13px, 0) rotate(45deg);
}

.has-dropdown > a:after {
  left: -25px;
  -khtml-transform: translate(2px, 0) rotate(-45deg);
  -ms-transform: translate(2px, 0) rotate(-45deg);
  transform: translate(2px, 0) rotate(-45deg);
}

.has-dropdown.is-active {
  background-color: #f1f3f5;
}

.has-dropdown.is-active > a {
  color: #171d28;
}

.has-dropdown.is-active > a:before {
  -khtml-transform: translate(8px, 0) rotate(45deg);
  -ms-transform: translate(8px, 0) rotate(45deg);
  transform: translate(8px, 0) rotate(45deg);
}

.has-dropdown.is-active > a:after {
  -khtml-transform: translate(8px, 0) rotate(-45deg);
  -ms-transform: translate(8px, 0) rotate(-45deg);
  transform: translate(8px, 0) rotate(-45deg);
}

.has-dropdown.is-active li.is-active a {
  color: #171d28;
}

.has-dropdown.is-active li.is-active:before {
  background-color: #3f91eb;
}

/**
 * LTR styles
 */
html[dir=ltr] .newsletter__read-more {
  float: right;
}

html[dir=ltr] .newsletter__read-more .js-close {
  left: auto;
  right: 0;
}

@media screen and (max-width: 1320px) {
  html[dir=ltr] .newsletter__read-more {
    float: right;
    width: 100%;
  }
}

html[dir=ltr] .newsletter__form {
  float: right;
  padding-left: 0;
  padding-right: 43px;
}

html[dir=ltr] .newsletter__form .js-close {
  left: auto;
  right: 0;
}

@media screen and (max-width: 1320px) {
  html[dir=ltr] .newsletter__form {
    float: left;
  }
}

html[dir=ltr] .newsletter__button {
  left: auto;
  right: 20px;
}

html[dir=ltr] .newsletter__button .icon {
  -khtml-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  transform: rotate(180deg);
}

html[dir=ltr] .input.newsletter__input {
  padding: 0 52px 0 20px;
}

html[dir=ltr] .newsletter__text {
  float: left;
}

html[dir=ltr] .newsletter__text dd {
  margin-left: 0;
}

html[dir=ltr] .menu-top {
  padding-right: 0;
  padding-left: 50px;
}

html[dir=ltr] .menu-top__left {
  float: right;
}

html[dir=ltr] .lang-wrap {
  float: right;
}

html[dir=ltr] .menu-top__lang {
  left: auto;
  right: 0;
  line-height: 46px;
}

html[dir=ltr] .lang-name {
  padding-right: 0;
  padding-left: 13px;
}

html[dir=ltr] .menu-top__right {
  float: left;
}

html[dir=ltr] .menu-top__right li:not(:last-child) {
  margin-left: 0;
  margin-right: 50px;
}

html[dir=ltr] .main-menu__nav {
  float: right;
}

html[dir=ltr] .main-menu__nav > ul > li {
  padding-left: 0;
  padding-right: 22px;
}

html[dir=ltr] .main-menu__nav > ul > li:not(:last-child) {
  margin-left: 0;
  margin-right: 60px;
}

@media screen and (min-width: 1365px) and (max-width: 1450px) {
  html[dir=ltr] .main-menu__nav > ul > li:not(:last-child) {
    margin-left: 0;
    margin-right: 5px;
  }
}

@media screen and (min-width: 1450px) and (max-width: 1600px) {
  html[dir=ltr] .main-menu__nav > ul > li:not(:last-child) {
    margin-left: 0;
    margin-right: 20px;
  }
}

@media screen and (min-width: 1600px) and (max-width: 1750px) {
  html[dir=ltr] .main-menu__nav > ul > li:not(:last-child) {
    margin-left: 0;
    margin-right: 0;
  }
}

html[dir=ltr] .main-menu__nav > ul > li:last-child > div {
  left: auto;
  right: -40px;
}

html[dir=ltr] .main-menu__submenu {
  position: relative;
}

html[dir=ltr] .main-menu__submenu.is-active:before {
  left: auto;
  right: 0;
}

html[dir=ltr] .main-menu__submenu.is-active:after {
  left: auto;
  right: 0;
}

html[dir=ltr] .main-menu__submenu:before {
  left: auto;
  right: 0;
}

html[dir=ltr] .main-menu__submenu > div ul li {
  padding-right: 0;
  padding-left: 15px;
}

html[dir=ltr] .main-menu__submenu > div ul a:before {
  right: auto;
  left: -15px;
}

html[dir=ltr] .main-menu__submenu__submenu:before {
  left: auto;
  right: 0;
}

html[dir=ltr] .main-menu__submenu__submenu > ul {
  left: auto;
  right: 95px;
  width: calc(100% + 75px);
  padding-right: 0;
  padding-left: 30px;
}

html[dir=ltr] .header-mobile .menu-top__search {
  float: right;
}

html[dir=ltr] .header-mobile .lang {
  float: left;
}

html[dir=ltr] .header-mobile .lang .icon {
  right: auto;
  left: 15px;
}

html[dir=ltr] .header-mobile .lang .lang__item {
  text-align: right;
  padding-left: 0;
  padding-right: 13px;
  font-size: 13px;
}

html[dir=ltr] .header-mobile .site-logo {
  float: left;
  padding-right: 0;
  padding-left: 20px;
}

html[dir=ltr] .menu-mob__icon {
  left: auto;
  right: 20px;
}

html[dir=ltr] .menu-mob__bottom li > ul li:before {
  right: auto;
  left: 0;
}

html[dir=ltr] .menu-mob__bottom li > ul li:before {
  right: auto;
  left: 0;
}

html[dir=ltr] .has-dropdown > a:before {
  left: auto;
  right: -30px;
  -khtml-transform: translate(13px, 0) rotate(45deg);
  -ms-transform: translate(13px, 0) rotate(45deg);
  transform: translate(13px, 0) rotate(45deg);
}

html[dir=ltr] .has-dropdown > a:after {
  left: auto;
  right: -25px;
  -khtml-transform: translate(12px, 0) rotate(-45deg);
  -ms-transform: translate(12px, 0) rotate(-45deg);
  transform: translate(12px, 0) rotate(-45deg);
}

html[dir=ltr] .has-dropdown.is-active {
  background-color: #f1f3f5;
}

html[dir=ltr] .has-dropdown.is-active > a {
  color: #171d28;
}

html[dir=ltr] .has-dropdown.is-active > a:before {
  -khtml-transform: translate(5px, 0) rotate(45deg);
  -ms-transform: translate(5px, 0) rotate(45deg);
  transform: translate(5px, 0) rotate(45deg);
}

html[dir=ltr] .has-dropdown.is-active > a:after {
  -khtml-transform: translate(15px, 0) rotate(-45deg);
  -ms-transform: translate(15px, 0) rotate(-45deg);
  transform: translate(15px, 0) rotate(-45deg);
}

/*------------------------------------*    #INPUTS
\*------------------------------------*/
/**
 * Base input styles.
 */
.input {
  -webkit-appearance: none;
  /* removing inner shadow on iOS inputs */
  -webkit-font-smoothing: inherit;
  box-sizing: border-box;
  transition: all .2s ease;
  background: none;
  border: none;
  color: #82919d;
  display: inline-block;
  font-family: "Droid Arabic Naskh", serif;
  font-size: 15px;
  padding: 0;
  /* remove browser defaults */
  vertical-align: middle;
  width: 100%;
  transition: all 0.3s ease;
}

.input:invalid {
  box-shadow: none;
  /* fixes mozilla red outline (shadow) */
}

.input[readonly] {
  cursor: text;
}

.input::-ms-clear {
  display: none;
  /* remove IE clear icon */
}

.input::-webkit-input-placeholder {
  color: #82919d;
}

.input:-moz-placeholder {
  /* Firefox 18- */
  color: #82919d;
}

.input::-moz-placeholder {
  /* Firefox 19+ */
  color: #82919d;
}

.input:-ms-input-placeholder {
  color: #82919d;
}

/**
 * Primary input.
 */
.input--primary {
  background-color: #fff;
  border: 1px solid transparent;
  box-shadow: 0 1px 2px rgba(1, 1, 1, 0.15);
  height: 62px;
  line-height: 62px;
  padding: 0 20px;
  /**
     * @hover and focus
     */
  /**
     * @focus
     */
  /**
     * Error state.
     */
}

.input--primary:hover, .input--primary:focus {
  border-color: rgba(50, 130, 217, 0.5);
  color: #171d28;
}

.input--primary:focus::-webkit-input-placeholder {
  transition: opacity 0.5s 0.5s ease;
  opacity: 0;
}

.input--primary:focus:-moz-placeholder {
  /* Firefox 18- */
  transition: opacity 0.5s 0.5s ease;
  opacity: 0;
}

.input--primary:focus::-moz-placeholder {
  /* Firefox 19+ */
  transition: opacity 0.5s 0.5s ease;
  opacity: 0;
}

.input--primary:focus:-ms-input-placeholder {
  transition: opacity 0.5s 0.5s ease;
  opacity: 0;
}

.is-error .input--primary, .input--primary.is-error {
  border-color: #ff8688;
}

.input--search {
  background-color: #232a35;
  width: 436px;
  height: 48px;
  line-height: 48px;
  padding-left: 55px;
  padding-right: 20px;
  /**
     * @hover
     */
  /**
     * @focus
     */
}

html[dir=ltr] .input--search {
  padding-left: 20px;
  padding-right: 55px;
}

/**
 * Textarea input.
 */
.input--textarea {
  resize: none;
  min-height: 154px;
  padding: 20px 15px;
  background: #fff;
  box-shadow: 0 1px 2px rgba(1, 1, 1, 0.15);
  border: 1px solid transparent;
}

.input--textarea:hover, .input--textarea:focus {
  border-color: rgba(50, 130, 217, 0.5);
  color: #171d28;
}

.input--textarea:focus::-webkit-input-placeholder {
  transition: opacity 0.5s 0.5s ease;
  opacity: 0;
}

.input--textarea:focus:-moz-placeholder {
  /* Firefox 18- */
  transition: opacity 0.5s 0.5s ease;
  opacity: 0;
}

.input--textarea:focus::-moz-placeholder {
  /* Firefox 19+ */
  transition: opacity 0.5s 0.5s ease;
  opacity: 0;
}

.input--textarea:focus:-ms-input-placeholder {
  transition: opacity 0.5s 0.5s ease;
  opacity: 0;
}

.contact-form .input--textarea {
  min-height: 245px;
}

.input--datepicker {
  background-image: url("../images/calculator.png");
  background-repeat: no-repeat;
  background-position: right 10px center;
  text-align: left;
  font-weight: bold;
  font-family: "Montserrat", sans-serif;
}

/*------------------------------------*    #PRIMARY BUTTON
\*------------------------------------*/
/**
 * Primary button.
 */
.btn--primary {
  -webkit-font-smoothing: inherit;
  transition: all .2s ease;
  border-radius: 0;
  font-weight: 700;
  width: auto;
  text-align: center;
  font-family: "Droid Arabic Naskh", serif;
  box-sizing: border-box;
  height: 62px;
  line-height: 62px;
  background-color: #3f91eb;
  color: #fff;
  padding: 0 35px;
  /**
     * @hover
     */
  /**
     * @active
     */
  /**
     * @disabled
     */
}

.btn--primary:hover {
  background-color: #2575CC;
}

.btn--primary:disabled {
  opacity: 0.5;
  cursor: default !important;
}

.btn--print {
  padding: 0 15px;
  background-color: #ced6e0;
  color: #82919d;
  margin-right: 15px;
}

html[dir=ltr] .btn--print {
  margin-right: 0;
  margin-left: 15px;
}

@media screen and (max-width: 1025px) {
  html[dir=ltr] .btn--print {
    margin-left: 0;
  }
}

.btn--print:hover {
  background-color: #d7dee6;
  color: #82919d;
}

@media screen and (max-width: 1025px) {
  .btn--print {
    width: 39%;
    margin-right: 0;
    padding: 0;
  }
}

@media screen and (max-width: 1025px) {
  .btn--submit {
    width: 60%;
    padding: 0;
  }
}

.currency-buttons {
  white-space: nowrap;
}

.btn--search {
  position: absolute;
  top: 12px;
  left: 20px;
  color: #636c76;
}

html[dir=ltr] .btn--search {
  left: auto;
  right: 20px;
}

.btn--newstetter {
  background: transparent;
  border: 1px solid #d9b024;
  color: #171d28;
  height: 48px;
  line-height: 48px;
  margin-left: 40px;
}

.btn--newstetter:focus, .btn--newstetter:hover {
  background: transparent;
  color: #171d28;
}

.btn--newstetter .icon {
  position: relative;
  right: 15px;
  top: 1px;
}

/**
 * LTR styles
 */
html[dir=ltr] .btn--newstetter {
  margin-left: 0;
  margin-right: 40px;
  font-family: "Open Sans", sans-serif;
  line-height: 44px;
}

html[dir=ltr] .btn--newstetter .icon {
  position: relative;
  -ms-transform: rotate(180deg);
      transform: rotate(180deg);
  right: auto;
  left: 15px;
  top: 0;
}

/*------------------------------------*    #SITE LOGO
\*------------------------------------*/
.site-logo {
  display: inline-block;
  vertical-align: middle;
}

.site-logo > img {
  height: auto;
  vertical-align: middle;
  width: 157px;
}

.site-logo:hover {
  text-decoration: none;
}

/*------------------------------------*    #HOME FEATURED IMAGE
\*------------------------------------*/
.home-featured-img {
  width: 100%;
  text-align: center;
  padding: 0 50px;
  position: relative;
  margin: 50px 0;
}

.home-featured-img .img-mobile {
  display: none;
}

@media screen and (max-width: 769px) {
  .home-featured-img .img-mobile {
    display: block;
    width: 100%;
  }
  .home-featured-img .img-desktop {
    display: none;
  }
}

@media screen and (max-width: 1380px) {
  .home-featured-img {
    padding: 0;
    margin-top: 0;
    margin-bottom: 50px;
  }
}

.home-featured-img h3 {
  position: absolute;
  left: 50%;
  top: 50%;
  -khtml-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  color: #fff;
  font-size: 39px;
  font-weight: normal;
  line-height: 60px;
}

@media screen and (max-width: 1380px) {
  .home-featured-img h3 {
    font-size: 22px;
    line-height: normal;
  }
}

/*------------------------------------*    #VERTICAL TITLES
\*------------------------------------*/
.video-slider {
  background-color: #fff;
  padding-bottom: 52px;
  position: relative;
  min-height: 517px;
}

@media screen and (max-width: 481px) {
  .video-slider {
    min-height: auto;
  }
}

.video-slider .read-more {
  position: absolute;
  bottom: 15px;
  right: 20px;
}

.slider-bottom-wrap {
  margin: 10px 50px;
  position: relative;
}

.slider-bottom-wrap .slider__item {
  position: relative;
  cursor: pointer;
}

.slider-bottom-wrap .slider__item:before {
  content: url("../images/video-play.png");
  height: 25px;
  width: 26px;
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 10;
  -khtml-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}

.slider-bottom-wrap .owl-nav {
  position: absolute;
  top: 50%;
  -khtml-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  left: -30px;
  right: -30px;
}

.slider-bottom-wrap .owl-nav .owl-prev,
.slider-bottom-wrap .owl-nav .owl-next {
  background-image: url("../images/arrow-slider.png");
  background-repeat: no-repeat;
  width: 8px;
  height: 14px;
}

.slider-bottom-wrap .owl-nav .owl-prev {
  float: left;
}

.slider-bottom-wrap .owl-nav .owl-next {
  -khtml-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  transform: rotate(180deg);
}

.video-player {
  width: 100%;
  position: relative;
}

.video-player .featured-img img {
  position: absolute;
  width: 100%;
  height: 350px;
  cursor: pointer;
}

@media screen and (max-width: 481px) {
  .video-player .featured-img img {
    height: 280px;
  }
}

@media screen and (min-width: 769px) and (max-width: 1025px) {
  .video-player .featured-img img {
    height: 430px;
  }
}

.video-player h3 {
  position: absolute;
  top: 50%;
  width: 100%;
  text-align: center;
  color: #fff;
  font-size: 19px;
  font-weight: 700;
  cursor: pointer;
  font-family: "Droid Arabic Naskh", serif;
  -khtml-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}

.video-player iframe {
  width: 100%;
  min-height: 350px;
}

@media screen and (max-width: 481px) {
  .video-player iframe {
    min-height: 280px;
  }
}

@media screen and (min-width: 769px) and (max-width: 1025px) {
  .video-player iframe {
    height: 430px;
  }
}

/**
 * LTR tyles
 */
html[dir=ltr] .slider-bottom-wrap .owl-nav {
  left: -30px;
  right: -30px;
}

html[dir=ltr] .slider-bottom-wrap .owl-nav .owl-prev,
html[dir=ltr] .slider-bottom-wrap .owl-nav .owl-next {
  background-image: url("../images/arrow-slider.png");
  background-repeat: no-repeat;
  width: 10px;
  height: 14px;
}

html[dir=ltr] .slider-bottom-wrap .owl-nav .owl-prev {
  float: left;
}

html[dir=ltr] .slider-bottom-wrap .owl-nav .owl-next {
  -khtml-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  transform: rotate(180deg);
  background-position: 2px center;
}

/*------------------------------------*    #SLIDERS
\*------------------------------------*/
.slider {
  margin-bottom: 35px;
}

.slider .owl-dots {
  position: absolute;
  bottom: 40px;
  left: 50%;
  -khtml-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translateX(-50%);
}

.slider .owl-dot {
  height: 12px;
  width: 12px;
  background-color: transparent;
  border-radius: 50%;
  border: 2px solid #fff;
  display: inline-block;
}

.slider .owl-dot:not(:last-child) {
  margin-left: 20px;
}

.slider .owl-dot.active {
  background-color: #fff;
}

.page-slider .page-slider__content {
  background-color: #fff;
  padding: 50px;
}

.page-slider .page-slider__content h4 {
  text-align: center;
  padding: 20px 0;
}

.page-slider .page-slider__content p {
  text-align: center;
  color: #82919d;
}

.page-slider .slide-num {
  text-align: center;
  position: relative;
  color: #fff;
  background-color: #3f91eb;
  height: 73px;
  width: 73px;
  line-height: 73px;
  border-radius: 50%;
  margin: 0 auto;
  font-family: "Montserrat", sans-serif;
  font-size: 34px;
}

.page-slider .owl-dots {
  counter-reset: slide-numbering;
  position: absolute;
  bottom: 0;
  left: 50%;
  margin-bottom: 30px;
  -ms-transform: translateX(-50%);
      transform: translateX(-50%);
  direction: ltr;
  font-family: "Montserrat", sans-serif;
  color: #82919d;
}

.page-slider .owl-dots .owl-dot {
  counter-increment: slide-numbering;
  position: relative;
  display: inline-block;
}

.page-slider .owl-dots .owl-dot.active {
  display: inline-block;
}

.page-slider .owl-dots .owl-dot.active:before {
  content: counter(slide-numbering);
  display: inline-block;
}

.page-slider .owl-dots:after {
  content: " /" counter(slide-numbering);
  display: inline-block;
}

.page-slider .owl-nav {
  position: absolute;
  top: 80px;
  left: 0;
  right: 0;
}

.page-slider .owl-prev,
.page-slider .owl-next {
  position: absolute;
  width: 7px;
  height: 12px;
  background-repeat: no-repeat;
  display: inline-block;
  background-image: url("../images/arrows.png");
}

.page-slider .owl-prev {
  background-position: -7px center;
  right: 50%;
  margin-right: -70px;
}

.page-slider .owl-next {
  background-position: 0 center;
  left: 50%;
  margin-left: -70px;
}

.slider-news .owl-nav {
  position: absolute;
  top: 30%;
  left: 45px;
  right: 45px;
}

.slider-news .owl-prev,
.slider-news .owl-next {
  width: 7px;
  height: 12px;
  background-image: url("../images/slider-arrow.png");
  background-repeat: no-repeat;
  display: inline-block;
  position: relative;
}

.slider-news .owl-prev:before,
.slider-news .owl-next:before {
  content: "";
  height: 38px;
  width: 39px;
  position: absolute;
  top: 50%;
  left: 50%;
  -ms-transform: translate(-50%, -50%);
      transform: translate(-50%, -50%);
  background-color: rgba(0, 0, 0, 0.25);
  display: inline-block;
  border-radius: 50%;
}

.slider-news .owl-prev {
  float: left;
  background-position: 0 center;
}

.slider-news .owl-next {
  float: right;
  background-position: -7px center;
}

.slider-news .slider-news__item .post__data {
  min-height: 203px;
}

.slider-news .slider-news__item .read-more {
  bottom: -10px;
}

/**
 * LTR tyles
 */
html[dir=ltr] .page-slider .owl-prev {
  background-position: 0 center;
  right: auto;
  left: 50%;
  margin-left: -70px;
}

html[dir=ltr] .page-slider .owl-next {
  background-position: -7px center;
  left: auto;
  right: 50%;
  margin-right: -70px;
}

/*------------------------------------*    #BLOG
\*------------------------------------*/
.page-wrap {
  display: table;
  width: 100%;
  table-layout: fixed;
  min-height: 1000px;
}

.page-row {
  display: table-row;
}

.content,
.sidebar {
  display: table-cell;
}

.content {
  background: #f1f3f5;
  vertical-align: top;
  padding-bottom: 50px;
}

.content.page, .content.posts {
  padding-top: 70px;
  padding-bottom: 90px;
}

.sidebar {
  width: 330px;
  background-color: #232a35;
}

.breadcrumbs {
  background: #e4e7eb;
  margin-bottom: 60px;
}

.page .breadcrumbs {
  margin-top: -70px;
}

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

.breadcrumbs__content {
  margin: 0;
  padding: 13px 0;
}

.breadcrumbs__content li {
  display: inline-block;
  padding-left: 5px;
}

.breadcrumbs__content a {
  color: #82919d;
}

.breadcrumbs__content a.is-active {
  color: #171d28;
}

.post__date {
  font-family: "Montserrat", sans-serif;
  border-bottom: 1px solid #d0d5db;
  padding-bottom: 15px;
  margin-bottom: 30px;
}

@media screen and (max-width: 1024px) {
  .page-wrap {
    display: block;
  }
  .page-row {
    display: block;
  }
  .content,
  .sidebar {
    display: block;
  }
  .content {
    margin-top: 20px;
  }
  .sidebar {
    width: 100%;
  }
}

.mixitup .mix,
.news-mix .mix {
  display: none;
}

.home-posts,
.home-posts-1 {
  margin-bottom: 50px;
}

.home-posts .small-post h4,
.home-posts-1 .small-post h4 {
  overflow: hidden;
  position: relative;
  line-height: 1.6em;
  max-height: 1.6em;
  text-align: justify;
  padding-left: 1em;
  margin-bottom: 10px;
}

html[dir=ltr] .home-posts .small-post h4, html[dir=ltr]
.home-posts-1 .small-post h4 {
  padding-left: 0;
  padding-right: 1em;
}

.home-posts .small-post h4:before,
.home-posts-1 .small-post h4:before {
  content: '...';
  position: absolute;
  left: 0;
  bottom: 0;
}

html[dir=ltr] .home-posts .small-post h4:before, html[dir=ltr]
.home-posts-1 .small-post h4:before {
  left: auto;
  right: 0;
}

.home-posts .small-post h4:after,
.home-posts-1 .small-post h4:after {
  content: '';
  position: absolute;
  left: 0;
  width: 1em;
  height: 1em;
  margin-top: 0.2em;
  background: #f1f3f5;
}

html[dir=ltr] .home-posts .small-post h4:after, html[dir=ltr]
.home-posts-1 .small-post h4:after {
  left: auto;
  right: 0;
}

.home-posts .small-post p,
.home-posts-1 .small-post p {
  overflow: hidden;
  position: relative;
  line-height: 1.6em;
  max-height: 1.6em;
  text-align: justify;
  padding-left: 1em;
}

html[dir=ltr] .home-posts .small-post p, html[dir=ltr]
.home-posts-1 .small-post p {
  padding-left: 0;
  padding-right: 1em;
}

.home-posts .small-post p:before,
.home-posts-1 .small-post p:before {
  content: '...';
  position: absolute;
  left: 0;
  bottom: 0;
}

html[dir=ltr] .home-posts .small-post p:before, html[dir=ltr]
.home-posts-1 .small-post p:before {
  left: auto;
  right: 0;
}

.home-posts .small-post p:after,
.home-posts-1 .small-post p:after {
  content: '';
  position: absolute;
  left: 0;
  width: 1em;
  height: 1em;
  margin-top: 0.2em;
  background: #f1f3f5;
}

html[dir=ltr] .home-posts .small-post p:after, html[dir=ltr]
.home-posts-1 .small-post p:after {
  left: auto;
  right: 0;
}

@media screen and (max-width: 481px) {
  .home-posts .container,
  .home-posts-1 .container {
    padding-left: 0;
    padding-right: 0;
  }
}

@media screen and (min-width: 481px) and (max-width: 1025px) {
  .home-posts .container,
  .home-posts-1 .container {
    padding-right: 20px;
    padding-left: 20px;
  }
}

@media screen and (max-width: 481px) {
  .home-posts .layout,
  .home-posts-1 .layout {
    margin-left: 0;
  }
}

@media screen and (min-width: 481px) and (max-width: 1025px) {
  .home-posts .layout,
  .home-posts-1 .layout {
    margin-left: -20px;
  }
}

@media screen and (max-width: 481px) {
  .home-posts .layout__item,
  .home-posts-1 .layout__item {
    padding-left: 0;
  }
}

@media screen and (min-width: 481px) and (max-width: 1025px) {
  .home-posts .layout__item,
  .home-posts-1 .layout__item {
    padding-left: 20px;
  }
}

.home-posts .post__img-wrap,
.home-posts-1 .post__img-wrap {
  position: relative;
}

.home-posts .post__item,
.home-posts-1 .post__item {
  min-height: 435px;
  background-color: #fff;
  position: relative;
}

.home-posts .post__item.post__item--large,
.home-posts-1 .post__item.post__item--large {
  min-height: 520px;
}

.home-posts .post__item--large .post__label,
.home-posts .small-post .post__label,
.home-posts-1 .post__item--large .post__label,
.home-posts-1 .small-post .post__label {
  position: absolute;
  color: #fff;
  display: inline-block;
  padding: 5px 10px;
}

.home-posts .post__item--large .post__label.red,
.home-posts .small-post .post__label.red,
.home-posts-1 .post__item--large .post__label.red,
.home-posts-1 .small-post .post__label.red {
  background-color: #d21d30;
}

.home-posts .post__item--large .post__label.blue,
.home-posts .small-post .post__label.blue,
.home-posts-1 .post__item--large .post__label.blue,
.home-posts-1 .small-post .post__label.blue {
  background-color: #3282d9;
}

.home-posts .post__item--large .post__label.black,
.home-posts .small-post .post__label.black,
.home-posts-1 .post__item--large .post__label.black,
.home-posts-1 .small-post .post__label.black {
  background-color: #171d28;
}

.home-posts .post__item--large .post__label,
.home-posts-1 .post__item--large .post__label {
  top: 15px;
  right: 15px;
}

.home-posts .small-post,
.home-posts-1 .small-post {
  position: relative;
}

.home-posts .small-post .post__label,
.home-posts-1 .small-post .post__label {
  top: 10px;
  right: 10px;
}

.home-posts .post__cat,
.home-posts-1 .post__cat {
  position: absolute;
  right: 20px;
  bottom: 20px;
  display: block;
  color: #fff;
}

.home-posts .post__cat:hover,
.home-posts-1 .post__cat:hover {
  color: #d9d9d9;
}

.home-posts .post__data h4,
.home-posts-1 .post__data h4 {
  overflow: hidden;
  position: relative;
  line-height: 1.6em;
  max-height: 1.6em;
  text-align: justify;
  padding-left: 1em;
}

html[dir=ltr] .home-posts .post__data h4, html[dir=ltr]
.home-posts-1 .post__data h4 {
  padding-left: 0;
  padding-right: 1em;
}

.home-posts .post__data h4:before,
.home-posts-1 .post__data h4:before {
  content: '...';
  position: absolute;
  left: 0;
  bottom: 0;
}

html[dir=ltr] .home-posts .post__data h4:before, html[dir=ltr]
.home-posts-1 .post__data h4:before {
  left: auto;
  right: 0;
}

.home-posts .post__data h4:after,
.home-posts-1 .post__data h4:after {
  content: '';
  position: absolute;
  left: 0;
  width: 1em;
  height: 1em;
  margin-top: 0.2em;
  background: white;
}

html[dir=ltr] .home-posts .post__data h4:after, html[dir=ltr]
.home-posts-1 .post__data h4:after {
  left: auto;
  right: 0;
}

.home-posts .post__data h4 a:hover,
.home-posts-1 .post__data h4 a:hover {
  color: #3f91eb;
}

.home-posts .post__data p,
.home-posts-1 .post__data p {
  margin-bottom: 0;
  overflow: hidden;
  position: relative;
  line-height: 1.6em;
  max-height: 3.2em;
  text-align: justify;
  padding-left: 1em;
}

html[dir=ltr] .home-posts .post__data p, html[dir=ltr]
.home-posts-1 .post__data p {
  padding-left: 0;
  padding-right: 1em;
}

.home-posts .post__data p:before,
.home-posts-1 .post__data p:before {
  content: '...';
  position: absolute;
  left: 0;
  bottom: 0;
}

html[dir=ltr] .home-posts .post__data p:before, html[dir=ltr]
.home-posts-1 .post__data p:before {
  left: auto;
  right: 0;
}

.home-posts .post__data p:after,
.home-posts-1 .post__data p:after {
  content: '';
  position: absolute;
  left: 0;
  width: 1em;
  height: 1em;
  margin-top: 0.2em;
  background: white;
}

html[dir=ltr] .home-posts .post__data p:after, html[dir=ltr]
.home-posts-1 .post__data p:after {
  left: auto;
  right: 0;
}

.home-posts .post__date,
.home-posts-1 .post__date {
  padding-bottom: 0;
  margin-bottom: 15px;
}

.home-posts .read-more,
.home-posts-1 .read-more {
  display: inline-block;
  margin-bottom: 20px;
  position: absolute;
  bottom: 0;
}

@media screen and (max-width: 416px) {
  .home-posts .read-more,
  .home-posts-1 .read-more {
    margin-bottom: 7px;
  }
}

.home-posts .post__related,
.home-posts-1 .post__related {
  margin-top: 20px;
}

.home-posts .related__link,
.home-posts-1 .related__link {
  display: block;
  color: #171d28;
  border-bottom: 1px solid #e3eaf4;
  position: relative;
  padding: 10px 0 10px 50px;
  font-size: 13px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.home-posts .related__link:first-child,
.home-posts-1 .related__link:first-child {
  border-top: 1px solid #e3eaf4;
}

.home-posts .related__link:hover,
.home-posts-1 .related__link:hover {
  color: #3f91eb;
}

.home-posts .related__link:hover:before,
.home-posts-1 .related__link:hover:before {
  width: 10px;
}

.home-posts .related__link .icon--more,
.home-posts-1 .related__link .icon--more {
  position: absolute;
  left: 0;
  top: 50%;
  -khtml-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}

.home-posts .related__link:before,
.home-posts-1 .related__link:before {
  content: '';
  position: absolute;
  top: 50%;
  -khtml-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  left: 13px;
  height: 2px;
  width: 0;
  background-color: #ced6e0;
  transition: width 0.3s ease;
}

@media screen and (max-width: 481px) {
  .home-posts-1 .media__body {
    padding: 0 20px;
  }
  .home-posts-1 h2 {
    padding-right: 20px;
  }
}

.post__img.post__img--normal {
  min-height: 190px;
}

.post__img.post__img--normal:after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  background-image: linear-gradient(to top, rgba(2, 4, 5, 0.7), rgba(1, 1, 2, 0) 67%, transparent);
}

.post__img.post__img--large {
  min-height: 300px;
}

.post__img.post__img--medium {
  min-height: 240px;
}

.post__img.post__img--small {
  width: 165px;
  min-height: 140px;
}

.post__img.post__img--smallest {
  width: 105px;
  min-height: 80px;
}

.small-post {
  padding-bottom: 15px;
  border-bottom: 1px solid #d0d5db;
  margin-bottom: 21px;
}

.small-post .post__date {
  border-bottom: none;
  margin-top: -7px;
  margin-bottom: 5px;
}

.small-post h4 {
  padding-bottom: 10px;
}

.small-post h4 a:hover {
  color: #3f91eb;
}

.small-post .read-more {
  position: static;
  margin-top: 10px;
  margin-bottom: 0;
}

.small-post p {
  margin-bottom: 0 !important;
  overflow: hidden;
  position: relative;
  line-height: 1.6em;
  max-height: 3.2em;
  text-align: justify;
  padding-left: 1em;
}

html[dir=ltr] .small-post p {
  padding-left: 0;
  padding-right: 1em;
}

.small-post p:before {
  content: '...';
  position: absolute;
  left: 0;
  bottom: 0;
}

html[dir=ltr] .small-post p:before {
  left: auto;
  right: 0;
}

.small-post p:after {
  content: '';
  position: absolute;
  left: 0;
  width: 1em;
  height: 1em;
  margin-top: 0.2em;
  background: white;
}

html[dir=ltr] .small-post p:after {
  left: auto;
  right: 0;
}

@media screen and (min-width: 481px) and (max-width: 570px) {
  .small-post .post__img.post__img--small {
    width: 100%;
    min-height: 250px;
  }
}

@media screen and (max-width: 481px) {
  .small-post .post__img.post__img--small {
    width: 100%;
    min-height: 155px;
  }
}

.news-calendar {
  background: url("../images/news-calendar-bg.jpg") no-repeat center center;
  background-size: cover;
  padding-top: 70px;
  margin-bottom: 86px;
}

@media screen and (max-width: 481px) {
  .news-calendar {
    padding-top: 0;
  }
}

@media screen and (max-width: 481px) {
  .news-calendar .container {
    padding-left: 0;
    padding-right: 0;
  }
}

@media screen and (max-width: 481px) {
  .news-calendar .layout {
    margin-left: 0;
  }
}

@media screen and (max-width: 481px) {
  .news-calendar .layout__item {
    padding-left: 0;
  }
}

.events-section {
  background-color: #fff;
  min-height: 493px;
  position: relative;
  margin-bottom: -35px;
}

.events-section .small-post h4 {
  overflow: hidden;
  position: relative;
  line-height: 1.6em;
  max-height: 1.6em;
  text-align: justify;
  padding-left: 1em;
}

html[dir=ltr] .events-section .small-post h4 {
  padding-left: 0;
  padding-right: 1em;
}

.events-section .small-post h4:before {
  content: '...';
  position: absolute;
  left: 0;
  bottom: 0;
}

html[dir=ltr] .events-section .small-post h4:before {
  left: auto;
  right: 0;
}

.events-section .small-post h4:after {
  content: '';
  position: absolute;
  left: 0;
  width: 1em;
  height: 1em;
  margin-top: 0.2em;
  background: #fff;
}

html[dir=ltr] .events-section .small-post h4:after {
  left: auto;
  right: 0;
}

.events-section .post__date {
  padding-bottom: 0;
}

.event-item {
  padding: 25px;
}

@media screen and (max-width: 769px) {
  .event-item {
    padding-bottom: 65px;
  }
}

.event-item .small-post {
  margin-bottom: 5px;
  padding-bottom: 20px;
}

@media screen and (max-width: 481px) {
  .event-item .small-post .post__img.post__img--smallest {
    width: 100%;
    height: 180px;
  }
}

.event-item .read-more {
  position: absolute;
  bottom: 0;
  margin-bottom: 15px;
}

.event-item .layout__item {
  margin-bottom: 20px;
}

.charts,
.video-and-posts {
  margin-bottom: 50px;
}

@media screen and (max-width: 481px) {
  .charts .container,
  .video-and-posts .container {
    padding-left: 0;
    padding-right: 0;
  }
}

@media screen and (min-width: 481px) and (max-width: 1025px) {
  .charts .container,
  .video-and-posts .container {
    padding-right: 20px;
    padding-left: 20px;
  }
}

@media screen and (max-width: 481px) {
  .charts .layout,
  .video-and-posts .layout {
    margin-left: 0;
  }
}

@media screen and (min-width: 481px) and (max-width: 1025px) {
  .charts .layout,
  .video-and-posts .layout {
    margin-left: -20px;
  }
}

@media screen and (max-width: 481px) {
  .charts .layout__item,
  .video-and-posts .layout__item {
    padding-left: 0;
  }
}

@media screen and (min-width: 481px) and (max-width: 1025px) {
  .charts .layout__item,
  .video-and-posts .layout__item {
    padding-left: 20px;
  }
}

@media screen and (max-width: 481px) {
  .charts h3,
  .charts .read-more {
    padding-left: 20px;
    padding-right: 20px;
  }
}

/**
 * Layout responsive styles.
 */
@media screen and (max-width: 1025px) {
  .content.posts {
    padding-top: 30px;
    padding-bottom: 70px;
  }
}

@media screen and (max-width: 1025px) {
  .content.page, .content.posts {
    padding-top: 30px;
    padding-bottom: 70px;
  }
}

@media screen and (max-width: 1025px) {
  .content.page .container, .content.posts .container {
    padding-left: 20px;
    padding-right: 20px;
  }
}

@media screen and (max-width: 1025px) {
  .content.page .container.container--indented, .content.posts .container.container--indented {
    padding: 0 20px;
  }
}

@media screen and (max-width: 1025px) {
  .content.page .layout, .content.posts .layout {
    margin-left: -20px;
  }
}

@media screen and (max-width: 1025px) {
  .content.page .layout__item, .content.posts .layout__item {
    padding-left: 20px;
  }
}

@media screen and (max-width: 1025px) {
  .content.post .container {
    padding-left: 0px;
    padding-right: 0px;
  }
}

@media screen and (max-width: 1025px) {
  .content.post .container.container--indented {
    padding: 0 20px;
  }
}

@media screen and (max-width: 1025px) {
  .content.post .container .layout {
    margin-left: 0;
  }
}

@media screen and (max-width: 1025px) {
  .content.post .container .layout__item {
    padding-left: 0;
  }
}

/**
 * Layout LTR styles.
 */
@media screen and (max-width: 481px) {
  html[dir=ltr] .home-posts .layout {
    margin-left: 0;
    margin-right: 0;
  }
}

@media screen and (min-width: 481px) and (max-width: 1025px) {
  html[dir=ltr] .home-posts .layout {
    margin-left: 0;
    margin-right: -20px;
  }
}

@media screen and (max-width: 481px) {
  html[dir=ltr] .home-posts .layout__item {
    padding-left: 0;
    padding-right: 0;
  }
}

@media screen and (min-width: 481px) and (max-width: 1025px) {
  html[dir=ltr] .home-posts .layout__item {
    padding-left: 0;
    padding-right: 20px;
  }
}

html[dir=ltr] .home-posts .post__cat {
  right: auto;
  left: 20px;
}

html[dir=ltr] .home-posts .related__link {
  padding: 10px 50px 10px 0;
}

html[dir=ltr] .home-posts .related__link .icon--more {
  left: auto;
  right: 0;
  -khtml-transform: rotate(180deg) translateY(50%);
  -ms-transform: rotate(180deg) translateY(50%);
  transform: rotate(180deg) translateY(50%);
}

html[dir=ltr] .home-posts .related__link:before {
  left: auto;
  right: 13px;
}

html[dir=ltr] .home-posts .post__item--large .post__label {
  right: auto;
  left: 15px;
  font-size: 15px;
}

html[dir=ltr] .home-posts .small-post {
  position: relative;
}

html[dir=ltr] .home-posts .small-post .post__label {
  right: auto;
  left: 10px;
  font-size: 13px;
}

html[dir=ltr] .breadcrumbs__content li {
  padding-left: 0;
  padding-right: 5px;
}

@media screen and (max-width: 481px) {
  html[dir=ltr] .news-calendar .layout {
    margin-left: 0;
    margin-right: 0;
  }
}

@media screen and (max-width: 481px) {
  html[dir=ltr] .news-calendar .layout__item {
    padding-left: 0;
    padding-right: 0;
  }
}

@media screen and (max-width: 481px) {
  html[dir=ltr] .charts .layout,
  html[dir=ltr] .video-and-posts .layout {
    margin-left: 0;
    margin-right: 0;
  }
}

@media screen and (min-width: 481px) and (max-width: 1025px) {
  html[dir=ltr] .charts .layout,
  html[dir=ltr] .video-and-posts .layout {
    margin-left: 0;
    margin-right: -20px;
  }
}

@media screen and (max-width: 481px) {
  html[dir=ltr] .charts .layout__item,
  html[dir=ltr] .video-and-posts .layout__item {
    padding-left: 0;
    padding-right: 0;
  }
}

@media screen and (min-width: 481px) and (max-width: 1025px) {
  html[dir=ltr] .charts .layout__item,
  html[dir=ltr] .video-and-posts .layout__item {
    padding-left: 0;
    padding-right: 0;
  }
}

@media screen and (max-width: 1025px) {
  html[dir=ltr] .content.page .layout, html[dir=ltr] .content.posts .layout {
    margin-left: 0;
    margin-right: -20px;
  }
}

@media screen and (max-width: 1025px) {
  html[dir=ltr] .content.page .layout__item, html[dir=ltr] .content.posts .layout__item {
    padding-left: 0;
    padding-right: 20px;
  }
}

@media screen and (max-width: 1025px) {
  html[dir=ltr] .content.post .container .layout {
    margin-left: 0;
    margin-right: 0;
  }
}

@media screen and (max-width: 1025px) {
  html[dir=ltr] .content.post .container .layout__item {
    padding-left: 0;
    padding-right: 0;
  }
}

/*------------------------------------*    #Home events and blog filter
\*------------------------------------*/
.cat-filter,
.event-tab {
  border-bottom: 1px solid #d0d5db;
}

.cat-filter {
  padding-bottom: 15px;
  margin-bottom: 50px;
}

@media screen and (max-width: 769px) {
  .cat-filter {
    border-bottom: none;
    margin-bottom: 30px;
  }
  .cat-filter li {
    display: block;
    padding: 15px 0;
    border-bottom: 1px solid #d0d5db;
  }
}

.event-tab {
  padding: 15px 25px;
  margin: 0px !important;
}

@media screen and (max-width: 790px) {
  .event-tab {
    border-bottom: none;
  }
}

.event-tab li {
  margin: 0;
  padding: 0 !important;
}

@media screen and (max-width: 790px) {
  .event-tab li {
    display: block;
    padding: 15px 0 !important;
    border-bottom: 1px solid #d0d5db;
  }
}

.event-tab li:before {
  display: none !important;
}

.event-tab li:first-child a {
  font-weight: bold;
}

.cat-filter__link,
.event-tab__link {
  display: inline-block;
  color: #82919d;
  position: relative;
}

.cat-filter__link:after,
.event-tab__link:after {
  content: "";
  position: absolute;
  left: 50%;
  right: 50%;
  bottom: -16px;
  height: 2px;
  background-color: #3f91eb;
  transition: all 0.3s ease;
}

.cat-filter__link:hover:after, .cat-filter__link.active:after,
.event-tab__link:hover:after,
.event-tab__link.active:after {
  left: 0;
  right: 0;
}

.cat-filter__link {
  margin-left: 70px;
}

.event-tab__link {
  padding-right: 20px;
  margin-left: 50px;
}

.event-tab__link.events-1:before, .event-tab__link.events-2:before, .event-tab__link.events-3:before, .event-tab__link.events-4:before {
  content: "";
  position: absolute;
  top: 7px;
  right: 0px;
  height: 10px;
  width: 10px;
  border-radius: 50%;
}

.event-tab__link.events-1:before {
  background-color: #3d91eb;
}

.event-tab__link.events-2:before {
  background-color: #ed3082;
}

.event-tab__link.events-3:before {
  background-color: #f8c303;
}

.event-tab__link.events-4:before {
  background-color: #3bb17d;
}

.event-tab__link.all {
  padding-right: 0;
}

/**
 * Layout LTR styles.
 */
html[dir=ltr] .event-tab__link {
  padding-right: 0;
  padding-left: 20px;
  margin-left: 0;
  margin-right: 50px;
}

html[dir=ltr] .event-tab__link.events-1:before, html[dir=ltr] .event-tab__link.events-2:before, html[dir=ltr] .event-tab__link.events-3:before, html[dir=ltr] .event-tab__link.events-4:before {
  right: auto;
  left: 0;
}

html[dir=ltr] .cat-filter__link {
  margin-left: 0;
  margin-right: 70px;
}

/*------------------------------------*    #BLOG MAIN PAGE
\*------------------------------------*/
.blog {
  margin-bottom: 50px;
}

.blog .post.no-image .post__cat {
  position: static;
  color: #82919d;
}

.blog .post.no-image p {
  overflow: hidden;
  position: relative;
  line-height: 1.6em;
  max-height: 14.4em;
  text-align: justify;
  padding-left: 1em;
}

html[dir=ltr] .blog .post.no-image p {
  padding-left: 0;
  padding-right: 1em;
}

.blog .post.no-image p:before {
  content: '...';
  position: absolute;
  left: 0;
  bottom: 0;
}

html[dir=ltr] .blog .post.no-image p:before {
  left: auto;
  right: 0;
}

.blog .post.no-image p:after {
  content: '';
  position: absolute;
  left: 0;
  width: 1em;
  height: 1em;
  margin-top: 0.2em;
  background: white;
}

html[dir=ltr] .blog .post.no-image p:after {
  left: auto;
  right: 0;
}

.blog .read-more {
  display: inline-block;
  margin-bottom: 20px;
  position: absolute;
  bottom: 0;
}

.blog .post__item {
  min-height: 410px;
  background-color: #fff;
  position: relative;
}

.blog .post__img-wrap {
  position: relative;
}

.blog .post__img {
  min-height: 190px;
}

.blog .post__cat {
  position: absolute;
  right: 20px;
  bottom: 20px;
  display: block;
  color: #fff;
}

.blog .post__cat:hover {
  color: #3f91eb;
}

.blog .post__data h4 {
  overflow: hidden;
  position: relative;
  line-height: 1.6em;
  max-height: 3.2em;
  text-align: justify;
  padding-left: 1em;
}

html[dir=ltr] .blog .post__data h4 {
  padding-left: 0;
  padding-right: 1em;
}

.blog .post__data h4:before {
  content: '...';
  position: absolute;
  left: 0;
  bottom: 0;
}

html[dir=ltr] .blog .post__data h4:before {
  left: auto;
  right: 0;
}

.blog .post__data h4:after {
  content: '';
  position: absolute;
  left: 0;
  width: 1em;
  height: 1em;
  margin-top: 0.2em;
  background: white;
}

html[dir=ltr] .blog .post__data h4:after {
  left: auto;
  right: 0;
}

.blog .post__data h4 a:hover {
  color: #3f91eb;
}

.blog .post__data p {
  margin-bottom: 0;
  overflow: hidden;
  position: relative;
  line-height: 1.6em;
  max-height: 3.2em;
  text-align: justify;
  padding-left: 1em;
}

html[dir=ltr] .blog .post__data p {
  padding-left: 0;
  padding-right: 1em;
}

.blog .post__data p:before {
  content: '...';
  position: absolute;
  left: 0;
  bottom: 0;
}

html[dir=ltr] .blog .post__data p:before {
  left: auto;
  right: 0;
}

.blog .post__data p:after {
  content: '';
  position: absolute;
  left: 0;
  width: 1em;
  height: 1em;
  margin-top: 0.2em;
  background: white;
}

html[dir=ltr] .blog .post__data p:after {
  left: auto;
  right: 0;
}

/**
 * LTR styles.
 */
html[dir=ltr] .blog .post__cat {
  right: auto;
  left: 20px;
}

/*------------------------------------*    #VERTICAL TITLES
\*------------------------------------*/
.v-titles {
  background-color: #fff;
}

.v-titles ul {
  list-style-type: none;
  margin: 0;
}

.v-titles .media__body {
  height: 240px;
}

.v-titles .media__img {
  width: 230px;
}

@media screen and (max-width: 570px) {
  .v-titles .media__img {
    width: 100%;
  }
}

@media screen and (max-width: 570px) {
  .v-titles .media__img .post__img--medium {
    min-height: 280px;
  }
}

li:not(:last-child) .v-titles__link,
li:not(:last-child) .v-titles__link-bottom {
  border-bottom: 1px solid #e3eaf4;
}

.v-titles__link,
.v-titles__link-bottom {
  display: block;
  margin-left: 30px;
  margin-right: 12px;
  padding: 11px 0px 11px 40px;
  color: #171d28;
  position: relative;
  transition: all 0.4s ease;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

@media screen and (max-width: 570px) {
  .v-titles__link,
  .v-titles__link-bottom {
    margin-left: 20px;
  }
}

.v-titles__link:hover,
.v-titles__link-bottom:hover {
  color: #3f91eb;
}

.v-titles__link:hover:before,
.v-titles__link-bottom:hover:before {
  width: 12px;
}

.v-titles__link .icon--more,
.v-titles__link-bottom .icon--more {
  position: absolute;
  top: 50%;
  left: 0;
  -khtml-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}

.v-titles__link:before,
.v-titles__link-bottom:before {
  content: '';
  position: absolute;
  top: 50%;
  -khtml-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  left: 13px;
  height: 2px;
  width: 0;
  background-color: #ced6e0;
  transition: width 0.3s ease;
}

/**
 * LTR tyles
 */
html[dir=ltr] .v-titles__link,
html[dir=ltr] .v-titles__link-bottom {
  margin-left: 12px;
  margin-right: 30px;
  position: relative;
  padding: 11px 40px 11px 0px;
  transition: all 0.4s ease;
}

@media screen and (max-width: 570px) {
  html[dir=ltr] .v-titles__link,
  html[dir=ltr] .v-titles__link-bottom {
    margin-left: 0;
    margin-right: 20px;
  }
}

html[dir=ltr] .v-titles__link .icon--more,
html[dir=ltr] .v-titles__link-bottom .icon--more {
  left: auto;
  right: 0;
  -khtml-transform: rotate(180deg) translateY(50%);
  -ms-transform: rotate(180deg) translateY(50%);
  transform: rotate(180deg) translateY(50%);
}

html[dir=ltr] .v-titles__link:before,
html[dir=ltr] .v-titles__link-bottom:before {
  left: auto;
  right: 13px;
}

/*------------------------------------*    #Tables
\*------------------------------------*/
.table {
  table-layout: fixed;
  box-shadow: 0 1px 2px rgba(1, 1, 1, 0.15);
  margin-bottom: 50px;
}

.table.table--primary thead tr {
  height: 70px;
  color: #fff;
  background-color: #3f91eb;
}

.table.table--primary thead th {
  padding-right: 30px;
  padding-left: 30px;
  font-size: 17px;
  text-align: right;
}

.table.table--primary thead th:first-child {
  border-left: 1px solid #3282d9;
}

.table.table--primary tbody {
  background-color: #fff;
}

.table.table--primary tbody tr {
  height: 70px;
}

.table.table--primary tbody tr:not(:last-child) {
  border-bottom: 1px solid #e3eaf4;
}

.table.table--primary tbody td {
  padding-right: 30px;
  padding-top: 10px;
  padding-bottom: 10px;
}

.table.table--primary tbody td:not(:last-child) {
  border-left: 1px solid #e3eaf4;
}

.table.table--primary.auto {
  table-layout: auto;
}

.table.table--primary.auto tbody td:first-child + td {
  text-align: center;
  padding-right: 0;
}

.table.table--primary.no-head td:first-child {
  color: #171d28;
}

.table.table--primary.no-head td:first-child + td {
  text-align: center;
  padding-right: 0;
  font-family: "Montserrat", sans-serif;
}

@media screen and (max-width: 769px) {
  .table.table--primary.no-head {
    font-size: 13px;
  }
}

.table.table--primary.monetary td:first-child + td {
  font-size: 12px;
}

.table.table--secondary {
  position: relative;
}

.table.table--secondary thead tr {
  height: 70px;
  color: #fff;
  background-color: #3f91eb;
}

@media screen and (max-width: 769px) {
  .table.table--secondary thead tr {
    display: table;
    height: auto;
    padding: 20px 0;
    width: 100%;
  }
}

@media screen and (max-width: 769px) {
  .table.table--secondary thead th {
    display: table-cell;
  }
  .table.table--secondary thead th:not(:last-child) {
    padding-left: 10px;
    padding-right: 10px;
    font-size: 13px;
  }
}

.table.table--secondary thead th:first-child {
  text-align: right;
  padding-right: 30px;
}

@media screen and (max-width: 769px) {
  .table.table--secondary thead th:first-child {
    padding-left: 10px;
    font-size: 13px;
    display: inline-block;
  }
}

@media screen and (max-width: 769px) {
  .table.table--secondary .table__title {
    position: absolute;
    top: -35px;
    right: -30px;
    color: #171d28;
  }
}

.table.table--secondary .call-to-action {
  display: inline-block;
  background-color: #2d86e9;
  width: 100%;
  height: 70px;
  line-height: 70px;
  color: #fff;
  transition: all .2s linear;
  white-space: nowrap;
}

.table.table--secondary .call-to-action:hover {
  background-color: #2381e8;
}

.table.table--secondary tbody {
  background-color: #fff;
}

.table.table--secondary tbody tr {
  height: 70px;
}

@media screen and (max-width: 769px) {
  .table.table--secondary tbody tr {
    float: left;
    height: auto;
    width: 25%;
  }
}

.table.table--secondary tbody tr:not(:last-child) {
  border-bottom: 1px solid #e3eaf4;
}

@media screen and (max-width: 769px) {
  .table.table--secondary tbody tr:not(:last-child) {
    border-bottom: none;
  }
}

.table.table--secondary tbody td {
  vertical-align: middle;
  text-align: center;
}

@media screen and (max-width: 769px) {
  .table.table--secondary tbody td {
    display: table;
    width: 100%;
    height: 70px;
    line-height: 67px;
  }
}

.table.table--secondary tbody td:not(:last-child) {
  border-left: 1px solid #e3eaf4;
}

@media screen and (max-width: 769px) {
  .table.table--secondary tbody td:not(:last-child) {
    border-left: none;
    border-bottom: 1px solid #e3eaf4;
  }
}

.table.table--secondary tbody td img {
  margin: 0;
  width: 55px;
}

.table.table--secondary tbody td span + strong {
  display: inline-block;
}

.table.table--secondary .table__currency {
  background-color: #fafcfd;
}

.table.table--secondary .table__currency span {
  text-transform: uppercase;
  font-family: "Montserrat", sans-serif;
  font-weight: bold;
  padding-left: 7px;
}

.table.table--secondary .table__currency span:after {
  content: "";
  position: relative;
  display: inline-block;
  height: 13px;
  width: 1px;
  background-color: #ced6e0;
  left: -4px;
  top: 1px;
}

@media screen and (max-width: 481px) {
  .table.table--tertiary {
    font-size: 12px;
    word-break: break-word;
  }
}

.table.table--tertiary thead tr {
  height: 70px;
  color: #fff;
  background-color: #3f91eb;
}

@media print {
  .table.table--tertiary thead tr {
    border-bottom: 1px solid #e3eaf4;
  }
}

.table.table--tertiary thead th:not(:last-child) {
  border-left: 1px solid #3282d9;
}

@media print {
  .table.table--tertiary thead th:not(:last-child) {
    border-left: 1px solid #e3eaf4;
  }
}

.table.table--tertiary tbody {
  font-family: "Montserrat", sans-serif;
  color: #171d28;
  background-color: #fff;
}

.table.table--tertiary tbody tr {
  height: 70px;
}

.table.table--tertiary tbody tr:not(:last-child) {
  border-bottom: 1px solid #e3eaf4;
}

@media screen and (max-width: 769px) {
  .table.table--tertiary tbody tr:not(:last-child) {
    border-bottom: none;
  }
}

.table.table--tertiary tbody td {
  vertical-align: middle;
  text-align: center;
}

@media screen and (max-width: 481px) {
  .table.table--tertiary tbody td {
    padding: 0 4px;
  }
}

.table.table--tertiary tbody td:not(:last-child) {
  border-left: 1px solid #e3eaf4;
}

.table.table--tertiary .row-highlighted {
  background-color: #fafcfd;
  color: #82919d;
  font-weight: bold;
}

.table.table--currency {
  table-layout: auto;
  background-color: #fff;
  color: #171d28;
  font-weight: bold;
}

@media screen and (max-width: 481px) {
  .table.table--currency {
    font-size: 12px;
  }
}

.table.table--currency tr {
  height: 98px;
}

.table.table--currency tr:not(:last-child) {
  border-bottom: 1px solid #e3eaf4;
}

.table.table--currency tr:first-child {
  border-top: 1px solid #e3eaf4;
}

.table.table--currency th {
  text-align: right;
  padding-right: 30px;
}

.table.table--currency tbody td:first-child {
  padding-right: 30px;
}

.table.table--currency tbody td:first-child + td {
  text-align: center;
  padding: 0 30px;
  width: 100px;
  border-right: 1px solid #e3eaf4;
}

.table--contact {
  table-layout: fixed;
  margin-bottom: 0;
}

.table--contact tr {
  border-bottom: 1px solid #e3eaf4;
}

@media screen and (max-width: 769px) {
  .table--contact tr {
    display: block;
    padding: 10px 0;
  }
}

.table--contact td {
  padding: 15px 0;
  vertical-align: top;
}

.table--contact td:first-child + td {
  color: #171d28;
}

@media screen and (max-width: 769px) {
  .table--contact td {
    display: block;
    padding-top: 0;
    padding-bottom: 0;
  }
  .table--contact td:first-child {
    padding-bottom: 10px;
  }
}

.col-15 {
  width: 15%;
}

.col-85 {
  width: 85%;
}

.col-10 {
  width: 85px;
}

.col-90 {
  width: 90%;
}

.currency__up,
.currency__down {
  position: relative;
  font-family: "Montserrat", sans-serif;
}

.currency__up:after,
.currency__down:after {
  content: " ";
  display: inline-block;
  width: 0;
  height: 0;
  border-style: solid;
  position: relative;
  right: 6px;
  bottom: 4px;
}

.currency__up:after {
  border-color: transparent transparent #5b97f8 transparent;
  border-width: 0 3.5px 5px 3.5px;
}

.currency__down:after {
  border-width: 5px 3.5px 0 3.5px;
  border-color: #ee2539 transparent transparent transparent;
}

@media screen and (max-width: 481px) {
  .home-table .container {
    padding-left: 0;
    padding-right: 0;
  }
}

@media screen and (min-width: 481px) and (max-width: 1025px) {
  .home-table .container {
    padding-right: 20px;
    padding-left: 20px;
  }
}

/**
 * LTR tyles
 */
html[dir=ltr] .table.table--primary thead th {
  text-align: left;
}

html[dir=ltr] .table.table--primary thead th:first-child {
  border-left: none;
  border-right: 1px solid #3282d9;
}

html[dir=ltr] .table.table--primary tbody td {
  padding-right: 0;
  padding-left: 30px;
}

html[dir=ltr] .table.table--primary tbody td:not(:last-child) {
  border-left: none;
  border-right: 1px solid #e3eaf4;
}

html[dir=ltr] .table.table--primary.auto tbody td:first-child + td {
  padding-right: 0;
  padding-left: 0;
}

html[dir=ltr] .table.table--primary.no-head td:first-child + td {
  padding-left: 0;
}

html[dir=ltr] .table.table--secondary thead th:first-child {
  text-align: left;
  padding-right: 0;
  padding-left: 30px;
}

@media screen and (max-width: 769px) {
  html[dir=ltr] .table.table--secondary thead th:first-child {
    padding-left: 0;
    padding-right: 10px;
  }
}

@media screen and (max-width: 769px) {
  html[dir=ltr] .table.table--secondary tbody tr {
    float: right;
  }
}

html[dir=ltr] .table.table--secondary tbody td:not(:last-child) {
  border-left: none;
  border-right: 1px solid #e3eaf4;
}

@media screen and (max-width: 769px) {
  html[dir=ltr] .table.table--secondary tbody td:not(:last-child) {
    border-right: none;
  }
}

html[dir=ltr] .table.table--secondary .table__currency span {
  padding-left: 0;
  padding-right: 7px;
}

html[dir=ltr] .table.table--secondary .table__currency span:after {
  left: auto;
  right: -4px;
}

@media screen and (max-width: 769px) {
  html[dir=ltr] .table.table--secondary .table__title {
    right: auto;
    left: -30px;
  }
}

html[dir=ltr] .table.table--tertiary thead th:not(:last-child) {
  border-left: none;
  border-right: 1px solid #3282d9;
}

html[dir=ltr] .table.table--tertiary tbody td:not(:last-child) {
  border-left: none;
  border-right: 1px solid #e3eaf4;
}

html[dir=ltr] .table.table--currency th {
  text-align: left;
  padding-right: 0px;
  padding-left: 30px;
}

html[dir=ltr] .table.table--currency tbody td:first-child {
  padding-right: 0px;
  padding-left: 30px;
}

html[dir=ltr] .table.table--currency tbody td:first-child + td {
  border-right: none;
  border-left: 1px solid #e3eaf4;
}

html[dir=ltr] .currency__up:after,
html[dir=ltr] .currency__down:after {
  right: auto;
  left: 6px;
}

/*------------------------------------*    #SIDEBAR FOR INNER PAGES
\*------------------------------------*/
.sidebar__menu {
  margin: 0;
  width: 330px;
}

@media screen and (max-width: 1024px) {
  .sidebar__menu {
    width: 100%;
    position: static !important;
  }
}

.sidebar__menu.fixed {
  position: fixed;
  top: 87px;
  width: 330px;
  margin: 0;
}

@media screen and (max-width: 1024px) {
  .sidebar__menu.fixed {
    width: 100%;
  }
}

.sidebar__menu.bottom {
  position: absolute;
  top: auto;
  bottom: 180px;
}

.sidebar__item {
  display: block;
  height: 74px;
  line-height: 74px;
  padding-right: 50px;
  color: #626b75;
  border-bottom: 1px solid #2d3541;
}

@media screen and (max-width: 1024px) {
  .sidebar__item {
    padding-right: 20px;
  }
}

.sidebar__item:hover {
  background-color: #2d3541;
  color: #fff;
}

.is-active .sidebar__item {
  background-color: #2d3541;
  color: #fff;
}

.sidebar__submenu {
  position: relative;
  line-height: 0;
}

.sidebar__submenu.is-active:before {
  -khtml-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  transform: rotate(180deg);
  background-image: url("../images/arrow-down.png");
}

.sidebar__submenu:before {
  content: "";
  background-image: url("../images/sidebar-arrow-down.png");
  width: 12px;
  height: 7px;
  position: absolute;
  left: 30px;
  top: 32px;
  transition: all ease .3s;
}

@media screen and (max-width: 1025px) {
  .sidebar__submenu:before {
    left: 20px;
  }
}

.sidebar__submenu:hover:before {
  background-image: url("../images/arrow-down.png");
}

.sidebar__submenu ul {
  display: none;
  margin: 0;
  background-color: #2d3541;
  line-height: normal;
}

.sidebar__submenu ul li a {
  display: block;
  padding-right: 50px;
  padding-bottom: 30px;
  color: #626b75;
}

@media screen and (max-width: 1025px) {
  .sidebar__submenu ul li a {
    padding-right: 20px;
  }
}

/**
 * LTR tyles
 */
html[dir=ltr] .sidebar__item {
  padding-right: 0;
  padding-left: 50px;
}

@media screen and (max-width: 1024px) {
  html[dir=ltr] .sidebar__item {
    padding-right: 0;
    padding-left: 20px;
  }
}

html[dir=ltr] .sidebar__submenu:before {
  left: auto;
  right: 30px;
}

@media screen and (max-width: 1025px) {
  html[dir=ltr] .sidebar__submenu:before {
    left: auto;
    right: 20px;
  }
}

html[dir=ltr] .sidebar__submenu ul li a {
  padding-right: 0;
  padding-left: 50px;
}

@media screen and (max-width: 1025px) {
  html[dir=ltr] .sidebar__submenu ul li a {
    padding-right: 0;
    padding-left: 20px;
  }
}

/*------------------------------------*    #Comments
\*------------------------------------*/
.comment-form .input--primary:not(:last-child),
.contact-form .input--primary:not(:last-child) {
  margin-bottom: 30px;
}

.comment-form .input,
.comment-form textarea,
.contact-form .input,
.contact-form textarea {
  -webkit-appearance: none;
  -moz-appearance: none;
}

.comment-form .input::-webkit-input-placeholder:after,
.comment-form textarea::-webkit-input-placeholder:after,
.contact-form .input::-webkit-input-placeholder:after,
.contact-form textarea::-webkit-input-placeholder:after {
  color: #3282d9;
  font-size: 18px;
}

.comment-form {
  border-bottom: 1px solid #d0d5db;
  padding-bottom: 85px;
}

.contact-form {
  padding-bottom: 35px;
}

.comment-wrap {
  margin-top: 70px;
}

.comment-wrap h4 {
  font-size: 17px;
  color: #171d28;
}

.comment {
  padding: 20px 30px;
  margin-bottom: 30px;
  background-color: #fff;
  box-shadow: 0 1px 2px rgba(1, 1, 1, 0.15);
}

.comment p {
  margin-bottom: 5px;
}

.comment__title {
  margin-bottom: 0;
  padding-bottom: 10px;
  color: #171d28;
  font-weight: bold;
}

.comment__meta {
  padding-bottom: 20px;
  margin-bottom: 25px;
  border-bottom: 1px solid #d0d5db;
  font-family: "Montserrat", sans-serif;
}

.comment__links {
  list-style: none;
  margin-top: 20px;
  margin-left: 0;
}

.comment__links li {
  display: inline-block;
  position: relative;
}

.comment__links li:first-child {
  padding-left: 67px;
}

@media screen and (max-width: 481px) {
  .comment__links li:first-child {
    padding-left: 45px;
  }
}

.comment__links li:first-child:after {
  content: "";
  display: inline-block;
  background-color: #ced6e0;
  height: 22px;
  width: 1px;
  position: absolute;
  left: 25px;
  top: 1px;
}

@media screen and (max-width: 481px) {
  .comment__links li:first-child:after {
    left: 15px;
  }
}

html[dir=ltr] .comment__links {
  margin-left: 0;
}

html[dir=ltr] .comment__links li:first-child {
  padding-left: 0;
  padding-right: 67px;
}

@media screen and (max-width: 481px) {
  html[dir=ltr] .comment__links li:first-child {
    padding-left: 0;
    padding-right: 45px;
  }
}

html[dir=ltr] .comment__links li:first-child:after {
  left: auto;
  right: 25px;
}

@media screen and (max-width: 481px) {
  html[dir=ltr] .comment__links li:first-child:after {
    right: 15px;
  }
}

/*------------------------------------*    
#Gallery pages
\*------------------------------------*/
.gallery h1 {
  border-bottom: 1px solid #d0d5db;
  margin-bottom: 50px;
}

.gallery h5 {
  color: #82919d;
  font-family: "Montserrat", sans-serif;
  border-bottom: 1px solid #d0d5db;
  font-size: 15px;
  font-weight: normal;
  margin-bottom: 50px;
  padding-bottom: 20px;
}

.gallery h5:not(:first-child) {
  margin-top: 70px;
}

.gallery.gallery--inner {
  border-bottom: 1px solid #d0d5db;
  margin-bottom: 50px;
}

.gallery.gallery--legislation {
  margin-bottom: 40px;
}

.gallery.gallery--legislation h1 {
  border-bottom: none;
  margin-bottom: 40px;
}

.gallery.gallery--legislation .gallery__img {
  min-height: 260px;
}

.gallery__img,
.post__img {
  min-height: 280px;
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
}

.gallery__img img,
.post__img img {
  display: none;
}

.gallery__title {
  background-color: #fff;
  padding: 25px 30px;
}

.gallery__title h4 {
  font-size: 17px;
  color: #171d28;
  margin: 0;
}

.gallery__data,
.post__data {
  background-color: #fff;
  padding: 25px 20px;
}

.gallery__data time,
.post__data time {
  font-family: "Montserrat", sans-serif;
  padding-bottom: 10px;
  display: inline-block;
}

.gallery__data h4,
.post__data h4 {
  padding-bottom: 0;
  margin-bottom: 10px;
}

/*------------------------------------*    #PAGINATION
\*------------------------------------*/
.pagination {
  margin: 0 auto;
  text-align: center;
  font-family: "Montserrat", sans-serif;
  font-size: 15px;
  padding-bottom: 15px;
}

.pagination__item,
.pagination__current {
  display: inline-block;
  margin-right: 40px;
}

@media screen and (max-width: 481px) {
  .pagination__item,
  .pagination__current {
    margin-right: 20px;
  }
}

.pagination__item {
  color: #82919d;
}

.pagination__item:hover {
  text-decoration: none;
  color: #3282d9;
}

.pagination__current {
  background-color: #3282d9;
  height: 31px;
  width: 31px;
  line-height: 31px;
  border-radius: 50%;
  color: #fff;
  vertical-align: middle;
}

.prev__item,
.next__item {
  display: inline-block;
  margin-right: 40px;
  color: #82919d;
}

@media screen and (max-width: 481px) {
  .prev__item,
  .next__item {
    margin-right: 20px;
  }
}

.prev__item.disabled,
.next__item.disabled {
  color: #bbc3ca;
}

.prev__item:hover:not(.disabled),
.next__item:hover:not(.disabled) {
  color: #3282d9;
}

/**
 * LTR tyles
 */
html[dir=ltr] .pagination__item,
html[dir=ltr] .pagination__current {
  margin-right: 0;
  margin-left: 40px;
}

@media screen and (max-width: 481px) {
  html[dir=ltr] .pagination__item,
  html[dir=ltr] .pagination__current {
    margin-right: 0;
    margin-left: 20px;
  }
}

html[dir=ltr] .prev__item,
html[dir=ltr] .next__item {
  margin-right: 0;
  margin-left: 40px;
}

@media screen and (max-width: 481px) {
  html[dir=ltr] .prev__item,
  html[dir=ltr] .next__item {
    margin-right: 0;
    margin-left: 20px;
  }
}

html[dir=ltr] .prev__item .icon,
html[dir=ltr] .next__item .icon {
  -khtml-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  transform: rotate(180deg);
}

/*------------------------------------*    #GOVERNER PAGE
\*------------------------------------*/
.governor {
  position: relative;
  margin-bottom: 150px;
}

@media screen and (max-width: 1025px) {
  .governor {
    margin-bottom: 80px;
  }
}

.governor:after {
  content: '';
  display: inline-block;
  background-image: url("../images/governor-cbl.png");
  height: 173px;
  width: 173px;
  position: absolute;
  top: 100%;
  right: 65px;
  margin-top: -87px;
}

@media screen and (max-width: 1025px) {
  .governor:after {
    height: 100px;
    width: 100px;
    background-position: center center;
    background-size: cover;
    margin-top: -53px;
  }
}

@media screen and (max-width: 481px) {
  .governor:after {
    right: 50%;
    -khtml-transform: translateX(50%);
    -ms-transform: translateX(50%);
    transform: translateX(50%);
    height: 80px;
    width: 80px;
    margin-top: -43px;
  }
}

html[dir=ltr] .governor:after {
  right: auto;
  left: 65px;
}

/*------------------------------------*    #OUR MESSAGE PAGE
\*------------------------------------*/
.our-message > img {
  margin-bottom: 60px !important;
}

.our-message .media {
  margin-bottom: 40px;
}

/*------------------------------------*    
#CURRENCY NOTES
\*------------------------------------*/
.currency-notes h5 {
  color: #82919d;
  font-family: "Montserrat", sans-serif;
  border-bottom: 1px solid #d0d5db;
  font-size: 15px;
  font-weight: normal;
  margin-top: 70px;
  margin-bottom: 50px;
  padding-bottom: 17px;
}

.currency-notes h5:first-of-type {
  margin-top: 15px;
}

.currency-notes__item {
  padding: 60px;
  background-color: #fff;
}

@media screen and (max-width: 769px) {
  .currency-notes__item {
    padding: 30px;
  }
}

.currency-notes__img {
  min-height: 214px;
  background-size: cover;
  background-position: center center;
}

.currency-notes__img img {
  display: none;
}

/*------------------------------------*    #MAP WITH TABS
\*------------------------------------*/
.contact {
  padding-top: 70px;
  padding-bottom: 90px;
}

@media screen and (max-width: 769px) {
  .contact {
    padding-top: 50px;
    padding-bottom: 50px;
  }
  .contact .container {
    padding-left: 20px;
    padding-right: 20px;
  }
  .contact .layout {
    margin-left: -20px;
  }
  .contact .layout__item {
    padding-left: 20px;
  }
  .contact input,
  .contact textarea {
    margin-bottom: 30px;
  }
}

.contact h1,
.contact h2,
.contact h4 {
  font-family: "Droid Arabic Naskh", serif;
  font-weight: bold;
  color: #171d28;
  margin-bottom: 0;
}

.contact h1 {
  font-size: 25px;
  padding-bottom: 60px;
}

@media screen and (max-width: 769px) {
  .contact h1 {
    padding-bottom: 40px;
  }
}

.contact h2 {
  font-size: 21px;
  padding-bottom: 20px;
  padding-right: 20px;
}

.contact h4 {
  padding-bottom: 20px;
}

@media screen and (max-width: 769px) {
  .contact h4 {
    padding-top: 50px;
    padding-bottom: 40px;
  }
}

#map1 {
  height: 0;
  overflow: hidden;
  padding-bottom: 33.25%;
  padding-top: 30px;
  position: relative;
  margin-bottom: 70px;
}

.contact__right {
  padding: 35px 50px 54px 50px;
  margin-bottom: 50px;
  background-color: #fff;
  min-height: 531px;
}

.contact-select {
  margin-bottom: 30px;
}

@media screen and (max-width: 769px) {
  .map-location .container {
    padding-right: 0;
    padding-left: 0;
  }
  .map-location .layout {
    margin-left: 0;
  }
  .map-location .layout:after {
    margin-top: 0;
  }
  .map-location .layout__item {
    padding-left: 0;
    margin-bottom: 0;
  }
  .contact__right {
    padding: 20px 20px 30px 20px;
    margin-bottom: 30px;
  }
  #map {
    margin-bottom: 30px;
  }
}

@media screen and (max-width: 769px) {
  html[dir=ltr] .contact .layout {
    margin-left: 0;
    margin-right: -20px;
  }
  html[dir=ltr] .contact .layout__item {
    padding-left: 0;
    padding-right: 20px;
  }
}

html[dir=ltr] .contact h2 {
  padding-left: 20px;
}

html[dir=ltr] .controls-tabs .wrap_controls li {
  margin-left: 0;
  margin-right: 60px;
}

@media screen and (max-width: 430px) {
  html[dir=ltr] .controls-tabs .wrap_controls li {
    margin-left: 0;
    margin-right: 20px;
  }
}

@media screen and (min-width: 430px) and (max-width: 510px) {
  html[dir=ltr] .controls-tabs .wrap_controls li {
    margin-left: 0;
    margin-right: 30px;
  }
}

@media screen and (max-width: 769px) {
  html[dir=ltr] .map-location .container {
    padding-right: 0;
    padding-left: 0;
  }
  html[dir=ltr] .map-location .layout {
    margin-left: 0;
    margin-right: 0;
  }
  html[dir=ltr] .map-location .layout:after {
    margin-top: 0;
  }
  html[dir=ltr] .map-location .layout__item {
    padding-left: 0;
    padding-right: 0;
    margin-bottom: 0;
  }
}

/*------------------------------------*    #Charts
\*------------------------------------*/
#candle-chart,
#bar-chart,
#bar-chart-float {
  width: 100%;
  height: 246px;
  background-color: #fff;
}

/*------------------------------------*    #Legislation page
\*------------------------------------*/
.flex-container {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -ms-flex-direction: row;
      flex-direction: row;
  margin-right: -35px;
  -ms-flex-negative: 0;
      flex-shrink: 0;
  -ms-flex-preferred-size: 100%;
      flex-basis: 100%;
}

.flex-item {
  width: 25%;
  display: -ms-flexbox;
  display: flex;
  padding-bottom: 3em;
  padding-right: 35px;
}

@media screen and (max-width: 1430px) {
  .flex-item {
    width: 33.3%;
  }
}

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

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

.flex-item .gallery__item {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
      flex-direction: column;
  background-color: #fff;
}

@media screen and (max-width: 640px) {
  .flex-item .gallery__item {
    width: 100%;
  }
}

.flex-item .gallery__data {
  max-width: 268px;
}

@media screen and (max-width: 1430px) {
  .flex-item .gallery__data {
    max-width: 300px;
  }
}

@media screen and (max-width: 1190px) {
  .flex-item .gallery__data {
    max-width: 370px;
  }
}

/*------------------------------------*    #Print styles
\*------------------------------------*/
@media print {
  .menu-top,
  .main-menu__nav,
  .header-mobile,
  .footer-main,
  .table--currency,
  .btn {
    display: none;
  }
  * {
    margin: 0 !important;
    padding: 0 !important;
  }
  .table.table--tertiary thead tr,
  .table.table--tertiary tbody tr {
    height: 30px;
    font-size: 9px;
  }
  .page {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }
  html, body {
    height: auto;
  }
  a:link:after,
  a:visited:after {
    content: "(" attr(href) ") ";
    display: none;
  }
  .input--datepicker {
    font-weight: normal;
  }
  html[dir='ltr'] .input--datepicker {
    text-align: right;
  }
}

/*------------------------------------*    #SHAME
\*------------------------------------*/
.is-invisible {
  transition: all .1s ease;
  opacity: 0 !important;
  visibility: hidden !important;
}

/**
 * Completely remove from the flow but leave available to screen readers and
 * keyboard users (if input is visually hidden).
 * http://snook.ca/archives/html_and_css/hiding-content-for-accessibility
 */
.is-visually-hidden {
  border: 0 !important;
  clip: rect(1px, 1px, 1px, 1px) !important;
  height: 1px !important;
  overflow: hidden !important;
  padding: 0 !important;
  width: 1px !important;
  position: absolute !important;
}

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

.inline-block {
  display: inline-block !important;
}

.is-not-scroll {
  overflow: hidden !important;
}

.is-scrollable {
  overflow: auto !important;
}

.is-scrollable-visible {
  overflow: visible !important;
}

.is-scrollable-y {
  overflow-x: hidden !important;
  overflow-y: auto !important;
}

.is-scrollable-x {
  overflow-x: auto !important;
  overflow-y: hidden !important;
}

/**
 * Flag fix.
 */
.flag--fix .flag__img {
  width: 1px;
}

.flag--fix .flag__body {
  width: auto;
}

/*------------------------------------*    #SPACING
\*------------------------------------*/
/**
 * Margin and padding helper classes. Use these to tweak layout on a micro
 * level.
 *
 * `.(m|p)(t|r|b|l|h|v)(-|+|0) {}` = margin/padding top/right/bottom/left/horizontal/vertical less/more/none
 */
/**
     * Margin helper classes.
     *
     * Add margins.
     */
.m {
  margin: 25px !important;
}

.mt {
  margin-top: 25px !important;
}

.mr {
  margin-right: 25px !important;
}

.mb {
  margin-bottom: 25px !important;
}

.ml {
  margin-left: 25px !important;
}

.mh {
  margin-right: 25px !important;
  margin-left: 25px !important;
}

.mv {
  margin-top: 25px !important;
  margin-bottom: 25px !important;
}

/**
     * Add tiny margins.
     */
.m-- {
  margin: 6px !important;
}

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

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

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

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

.mh-- {
  margin-right: 6px !important;
  margin-left: 6px !important;
}

.mv-- {
  margin-top: 6px !important;
  margin-bottom: 6px !important;
}

/**
     * Add small margins.
     */
.m- {
  margin: 13px !important;
}

.mt- {
  margin-top: 13px !important;
}

.mr- {
  margin-right: 13px !important;
}

.mb- {
  margin-bottom: 13px !important;
}

.ml- {
  margin-left: 13px !important;
}

.mh- {
  margin-right: 13px !important;
  margin-left: 13px !important;
}

.mv- {
  margin-top: 13px !important;
  margin-bottom: 13px !important;
}

/**
     * Add large margins.
     */
.m\+ {
  margin: 50px !important;
}

.mt\+ {
  margin-top: 50px !important;
}

.mr\+ {
  margin-right: 50px !important;
}

.mb\+ {
  margin-bottom: 50px !important;
}

.ml\+ {
  margin-left: 50px !important;
}

.mh\+ {
  margin-right: 50px !important;
  margin-left: 50px !important;
}

.mv\+ {
  margin-top: 50px !important;
  margin-bottom: 50px !important;
}

/**
     * Add huge margins.
     */
.m\+\+ {
  margin: 100px !important;
}

.mt\+\+ {
  margin-top: 100px !important;
}

.mr\+\+ {
  margin-right: 100px !important;
}

.mb\+\+ {
  margin-bottom: 100px !important;
}

.ml\+\+ {
  margin-left: 100px !important;
}

.mh\+\+ {
  margin-right: 100px !important;
  margin-left: 100px !important;
}

.mv\+\+ {
  margin-top: 100px !important;
  margin-bottom: 100px !important;
}

/**
     * Remove margins.
     */
.m0 {
  margin: 0 !important;
}

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

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

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

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

.mh0 {
  margin-right: 0 !important;
  margin-left: 0 !important;
}

.mv0 {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

/**
     * Negative margins.
     */
.-m {
  margin: -25px !important;
}

.-mt {
  margin-top: -25px !important;
}

.-mr {
  margin-right: -25px !important;
}

.-mb {
  margin-bottom: -25px !important;
}

.-ml {
  margin-left: -25px !important;
}

.-mh {
  margin-right: -25px !important;
  margin-left: -25px !important;
}

.-mv {
  margin-top: -25px !important;
  margin-bottom: -25px !important;
}

/**
     * Large negative margins.
     */
.-m\+ {
  margin: -50px !important;
}

.-mt\+ {
  margin-top: -50px !important;
}

.-mr\+ {
  margin-right: -50px !important;
}

.-mb\+ {
  margin-bottom: -50px !important;
}

.-ml\+ {
  margin-left: -50px !important;
}

.-mh\+ {
  margin-right: -50px !important;
  margin-left: -50px !important;
}

.-mv\+ {
  margin-top: -50px !important;
  margin-bottom: -50px !important;
}

/**
     * Padding helper classes.
     *
     * Add paddings.
     */
.p {
  padding: 25px !important;
}

.pt {
  padding-top: 25px !important;
}

.pr {
  padding-right: 25px !important;
}

.pb {
  padding-bottom: 25px !important;
}

.pl {
  padding-left: 25px !important;
}

.ph {
  padding-right: 25px !important;
  padding-left: 25px !important;
}

.pv {
  padding-top: 25px !important;
  padding-bottom: 25px !important;
}

/**
     * Add tiny paddings.
     */
.p-- {
  padding: 6px !important;
}

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

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

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

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

.ph-- {
  padding-right: 6px !important;
  padding-left: 6px !important;
}

.pv-- {
  padding-top: 6px !important;
  padding-bottom: 6px !important;
}

/**
     * Add small paddings.
     */
.p- {
  padding: 13px !important;
}

.pt- {
  padding-top: 13px !important;
}

.pr- {
  padding-right: 13px !important;
}

.pb- {
  padding-bottom: 13px !important;
}

.pl- {
  padding-left: 13px !important;
}

.ph- {
  padding-right: 13px !important;
  padding-left: 13px !important;
}

.pv- {
  padding-top: 13px !important;
  padding-bottom: 13px !important;
}

/**
     * Add large paddings.
     */
.p\+ {
  padding: 50px !important;
}

.pt\+ {
  padding-top: 50px !important;
}

.pr\+ {
  padding-right: 50px !important;
}

.pb\+ {
  padding-bottom: 50px !important;
}

.pl\+ {
  padding-left: 50px !important;
}

.ph\+ {
  padding-right: 50px !important;
  padding-left: 50px !important;
}

.pv\+ {
  padding-top: 50px !important;
  padding-bottom: 50px !important;
}

/**
     * Add huge paddings.
     */
.p\+\+ {
  padding: 100px !important;
}

.pt\+\+ {
  padding-top: 100px !important;
}

.pr\+\+ {
  padding-right: 100px !important;
}

.pb\+\+ {
  padding-bottom: 100px !important;
}

.pl\+\+ {
  padding-left: 100px !important;
}

.ph\+\+ {
  padding-right: 100px !important;
  padding-left: 100px !important;
}

.pv\+\+ {
  padding-top: 100px !important;
  padding-bottom: 100px !important;
}

/**
     * Remove paddings.
     */
.p0 {
  padding: 0 !important;
}

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

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

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

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

.ph0 {
  padding-right: 0 !important;
  padding-left: 0 !important;
}

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

/*------------------------------------*    #SPACING-RESPONSIVE
\*------------------------------------*/
/**
 * Margin and padding helper classes. Use these to tweak layout on a micro
 * level.
 *
 * `.(m|p)(t|r|b|l|h|v)(-|+|0) {}` = margin/padding top/right/bottom/left/horizontal/vertical less/more/none
 */
/**
     * Margin helper classes.
     *
     * Add margins.
     */
@media screen and (min-width: 481px) and (max-width: 768px) {
  .medium-m {
    margin: 25px !important;
  }
  .medium-mt {
    margin-top: 25px !important;
  }
  .medium-mr {
    margin-right: 25px !important;
  }
  .medium-mb {
    margin-bottom: 25px !important;
  }
  .medium-ml {
    margin-left: 25px !important;
  }
  .medium-mh {
    margin-right: 25px !important;
    margin-left: 25px !important;
  }
  .medium-mv {
    margin-top: 25px !important;
    margin-bottom: 25px !important;
  }
}

@media screen and (min-width: 481px) {
  .medium-and-up-m {
    margin: 25px !important;
  }
  .medium-and-up-mt {
    margin-top: 25px !important;
  }
  .medium-and-up-mr {
    margin-right: 25px !important;
  }
  .medium-and-up-mb {
    margin-bottom: 25px !important;
  }
  .medium-and-up-ml {
    margin-left: 25px !important;
  }
  .medium-and-up-mh {
    margin-right: 25px !important;
    margin-left: 25px !important;
  }
  .medium-and-up-mv {
    margin-top: 25px !important;
    margin-bottom: 25px !important;
  }
}

@media screen and (min-width: 769px) and (max-width: 1024px) {
  .large-m {
    margin: 25px !important;
  }
  .large-mt {
    margin-top: 25px !important;
  }
  .large-mr {
    margin-right: 25px !important;
  }
  .large-mb {
    margin-bottom: 25px !important;
  }
  .large-ml {
    margin-left: 25px !important;
  }
  .large-mh {
    margin-right: 25px !important;
    margin-left: 25px !important;
  }
  .large-mv {
    margin-top: 25px !important;
    margin-bottom: 25px !important;
  }
}

@media screen and (min-width: 769px) {
  .large-and-up-m {
    margin: 25px !important;
  }
  .large-and-up-mt {
    margin-top: 25px !important;
  }
  .large-and-up-mr {
    margin-right: 25px !important;
  }
  .large-and-up-mb {
    margin-bottom: 25px !important;
  }
  .large-and-up-ml {
    margin-left: 25px !important;
  }
  .large-and-up-mh {
    margin-right: 25px !important;
    margin-left: 25px !important;
  }
  .large-and-up-mv {
    margin-top: 25px !important;
    margin-bottom: 25px !important;
  }
}

@media screen and (min-width: 1025px) and (max-width: 1499px) {
  .extralarge-m {
    margin: 25px !important;
  }
  .extralarge-mt {
    margin-top: 25px !important;
  }
  .extralarge-mr {
    margin-right: 25px !important;
  }
  .extralarge-mb {
    margin-bottom: 25px !important;
  }
  .extralarge-ml {
    margin-left: 25px !important;
  }
  .extralarge-mh {
    margin-right: 25px !important;
    margin-left: 25px !important;
  }
  .extralarge-mv {
    margin-top: 25px !important;
    margin-bottom: 25px !important;
  }
}

@media screen and (min-width: 1025px) {
  .extralarge-and-up-m {
    margin: 25px !important;
  }
  .extralarge-and-up-mt {
    margin-top: 25px !important;
  }
  .extralarge-and-up-mr {
    margin-right: 25px !important;
  }
  .extralarge-and-up-mb {
    margin-bottom: 25px !important;
  }
  .extralarge-and-up-ml {
    margin-left: 25px !important;
  }
  .extralarge-and-up-mh {
    margin-right: 25px !important;
    margin-left: 25px !important;
  }
  .extralarge-and-up-mv {
    margin-top: 25px !important;
    margin-bottom: 25px !important;
  }
}

@media screen and (min-width: 1500px) {
  .superlarge-and-up-m {
    margin: 25px !important;
  }
  .superlarge-and-up-mt {
    margin-top: 25px !important;
  }
  .superlarge-and-up-mr {
    margin-right: 25px !important;
  }
  .superlarge-and-up-mb {
    margin-bottom: 25px !important;
  }
  .superlarge-and-up-ml {
    margin-left: 25px !important;
  }
  .superlarge-and-up-mh {
    margin-right: 25px !important;
    margin-left: 25px !important;
  }
  .superlarge-and-up-mv {
    margin-top: 25px !important;
    margin-bottom: 25px !important;
  }
}

/**
     * Add tiny margins.
     */
@media screen and (min-width: 481px) and (max-width: 768px) {
  .medium-m-- {
    margin: 6px !important;
  }
  .medium-mt-- {
    margin-top: 6px !important;
  }
  .medium-mr-- {
    margin-right: 6px !important;
  }
  .medium-mb-- {
    margin-bottom: 6px !important;
  }
  .medium-ml-- {
    margin-left: 6px !important;
  }
  .medium-mh-- {
    margin-right: 6px !important;
    margin-left: 6px !important;
  }
  .medium-mv-- {
    margin-top: 6px !important;
    margin-bottom: 6px !important;
  }
}

@media screen and (min-width: 481px) {
  .medium-and-up-m-- {
    margin: 6px !important;
  }
  .medium-and-up-mt-- {
    margin-top: 6px !important;
  }
  .medium-and-up-mr-- {
    margin-right: 6px !important;
  }
  .medium-and-up-mb-- {
    margin-bottom: 6px !important;
  }
  .medium-and-up-ml-- {
    margin-left: 6px !important;
  }
  .medium-and-up-mh-- {
    margin-right: 6px !important;
    margin-left: 6px !important;
  }
  .medium-and-up-mv-- {
    margin-top: 6px !important;
    margin-bottom: 6px !important;
  }
}

@media screen and (min-width: 769px) and (max-width: 1024px) {
  .large-m-- {
    margin: 6px !important;
  }
  .large-mt-- {
    margin-top: 6px !important;
  }
  .large-mr-- {
    margin-right: 6px !important;
  }
  .large-mb-- {
    margin-bottom: 6px !important;
  }
  .large-ml-- {
    margin-left: 6px !important;
  }
  .large-mh-- {
    margin-right: 6px !important;
    margin-left: 6px !important;
  }
  .large-mv-- {
    margin-top: 6px !important;
    margin-bottom: 6px !important;
  }
}

@media screen and (min-width: 769px) {
  .large-and-up-m-- {
    margin: 6px !important;
  }
  .large-and-up-mt-- {
    margin-top: 6px !important;
  }
  .large-and-up-mr-- {
    margin-right: 6px !important;
  }
  .large-and-up-mb-- {
    margin-bottom: 6px !important;
  }
  .large-and-up-ml-- {
    margin-left: 6px !important;
  }
  .large-and-up-mh-- {
    margin-right: 6px !important;
    margin-left: 6px !important;
  }
  .large-and-up-mv-- {
    margin-top: 6px !important;
    margin-bottom: 6px !important;
  }
}

@media screen and (min-width: 1025px) and (max-width: 1499px) {
  .extralarge-m-- {
    margin: 6px !important;
  }
  .extralarge-mt-- {
    margin-top: 6px !important;
  }
  .extralarge-mr-- {
    margin-right: 6px !important;
  }
  .extralarge-mb-- {
    margin-bottom: 6px !important;
  }
  .extralarge-ml-- {
    margin-left: 6px !important;
  }
  .extralarge-mh-- {
    margin-right: 6px !important;
    margin-left: 6px !important;
  }
  .extralarge-mv-- {
    margin-top: 6px !important;
    margin-bottom: 6px !important;
  }
}

@media screen and (min-width: 1025px) {
  .extralarge-and-up-m-- {
    margin: 6px !important;
  }
  .extralarge-and-up-mt-- {
    margin-top: 6px !important;
  }
  .extralarge-and-up-mr-- {
    margin-right: 6px !important;
  }
  .extralarge-and-up-mb-- {
    margin-bottom: 6px !important;
  }
  .extralarge-and-up-ml-- {
    margin-left: 6px !important;
  }
  .extralarge-and-up-mh-- {
    margin-right: 6px !important;
    margin-left: 6px !important;
  }
  .extralarge-and-up-mv-- {
    margin-top: 6px !important;
    margin-bottom: 6px !important;
  }
}

@media screen and (min-width: 1500px) {
  .superlarge-and-up-m-- {
    margin: 6px !important;
  }
  .superlarge-and-up-mt-- {
    margin-top: 6px !important;
  }
  .superlarge-and-up-mr-- {
    margin-right: 6px !important;
  }
  .superlarge-and-up-mb-- {
    margin-bottom: 6px !important;
  }
  .superlarge-and-up-ml-- {
    margin-left: 6px !important;
  }
  .superlarge-and-up-mh-- {
    margin-right: 6px !important;
    margin-left: 6px !important;
  }
  .superlarge-and-up-mv-- {
    margin-top: 6px !important;
    margin-bottom: 6px !important;
  }
}

/**
     * Add small margins.
     */
@media screen and (min-width: 481px) and (max-width: 768px) {
  .medium-m- {
    margin: 13px !important;
  }
  .medium-mt- {
    margin-top: 13px !important;
  }
  .medium-mr- {
    margin-right: 13px !important;
  }
  .medium-mb- {
    margin-bottom: 13px !important;
  }
  .medium-ml- {
    margin-left: 13px !important;
  }
  .medium-mh- {
    margin-right: 13px !important;
    margin-left: 13px !important;
  }
  .medium-mv- {
    margin-top: 13px !important;
    margin-bottom: 13px !important;
  }
}

@media screen and (min-width: 481px) {
  .medium-and-up-m- {
    margin: 13px !important;
  }
  .medium-and-up-mt- {
    margin-top: 13px !important;
  }
  .medium-and-up-mr- {
    margin-right: 13px !important;
  }
  .medium-and-up-mb- {
    margin-bottom: 13px !important;
  }
  .medium-and-up-ml- {
    margin-left: 13px !important;
  }
  .medium-and-up-mh- {
    margin-right: 13px !important;
    margin-left: 13px !important;
  }
  .medium-and-up-mv- {
    margin-top: 13px !important;
    margin-bottom: 13px !important;
  }
}

@media screen and (min-width: 769px) and (max-width: 1024px) {
  .large-m- {
    margin: 13px !important;
  }
  .large-mt- {
    margin-top: 13px !important;
  }
  .large-mr- {
    margin-right: 13px !important;
  }
  .large-mb- {
    margin-bottom: 13px !important;
  }
  .large-ml- {
    margin-left: 13px !important;
  }
  .large-mh- {
    margin-right: 13px !important;
    margin-left: 13px !important;
  }
  .large-mv- {
    margin-top: 13px !important;
    margin-bottom: 13px !important;
  }
}

@media screen and (min-width: 769px) {
  .large-and-up-m- {
    margin: 13px !important;
  }
  .large-and-up-mt- {
    margin-top: 13px !important;
  }
  .large-and-up-mr- {
    margin-right: 13px !important;
  }
  .large-and-up-mb- {
    margin-bottom: 13px !important;
  }
  .large-and-up-ml- {
    margin-left: 13px !important;
  }
  .large-and-up-mh- {
    margin-right: 13px !important;
    margin-left: 13px !important;
  }
  .large-and-up-mv- {
    margin-top: 13px !important;
    margin-bottom: 13px !important;
  }
}

@media screen and (min-width: 1025px) and (max-width: 1499px) {
  .extralarge-m- {
    margin: 13px !important;
  }
  .extralarge-mt- {
    margin-top: 13px !important;
  }
  .extralarge-mr- {
    margin-right: 13px !important;
  }
  .extralarge-mb- {
    margin-bottom: 13px !important;
  }
  .extralarge-ml- {
    margin-left: 13px !important;
  }
  .extralarge-mh- {
    margin-right: 13px !important;
    margin-left: 13px !important;
  }
  .extralarge-mv- {
    margin-top: 13px !important;
    margin-bottom: 13px !important;
  }
}

@media screen and (min-width: 1025px) {
  .extralarge-and-up-m- {
    margin: 13px !important;
  }
  .extralarge-and-up-mt- {
    margin-top: 13px !important;
  }
  .extralarge-and-up-mr- {
    margin-right: 13px !important;
  }
  .extralarge-and-up-mb- {
    margin-bottom: 13px !important;
  }
  .extralarge-and-up-ml- {
    margin-left: 13px !important;
  }
  .extralarge-and-up-mh- {
    margin-right: 13px !important;
    margin-left: 13px !important;
  }
  .extralarge-and-up-mv- {
    margin-top: 13px !important;
    margin-bottom: 13px !important;
  }
}

@media screen and (min-width: 1500px) {
  .superlarge-and-up-m- {
    margin: 13px !important;
  }
  .superlarge-and-up-mt- {
    margin-top: 13px !important;
  }
  .superlarge-and-up-mr- {
    margin-right: 13px !important;
  }
  .superlarge-and-up-mb- {
    margin-bottom: 13px !important;
  }
  .superlarge-and-up-ml- {
    margin-left: 13px !important;
  }
  .superlarge-and-up-mh- {
    margin-right: 13px !important;
    margin-left: 13px !important;
  }
  .superlarge-and-up-mv- {
    margin-top: 13px !important;
    margin-bottom: 13px !important;
  }
}

/**
     * Add large margins.
     */
@media screen and (min-width: 481px) and (max-width: 768px) {
  .medium-m\+ {
    margin: 50px !important;
  }
  .medium-mt\+ {
    margin-top: 50px !important;
  }
  .medium-mr\+ {
    margin-right: 50px !important;
  }
  .medium-mb\+ {
    margin-bottom: 50px !important;
  }
  .medium-ml\+ {
    margin-left: 50px !important;
  }
  .medium-mh\+ {
    margin-right: 50px !important;
    margin-left: 50px !important;
  }
  .medium-mv\+ {
    margin-top: 50px !important;
    margin-bottom: 50px !important;
  }
}

@media screen and (min-width: 481px) {
  .medium-and-up-m\+ {
    margin: 50px !important;
  }
  .medium-and-up-mt\+ {
    margin-top: 50px !important;
  }
  .medium-and-up-mr\+ {
    margin-right: 50px !important;
  }
  .medium-and-up-mb\+ {
    margin-bottom: 50px !important;
  }
  .medium-and-up-ml\+ {
    margin-left: 50px !important;
  }
  .medium-and-up-mh\+ {
    margin-right: 50px !important;
    margin-left: 50px !important;
  }
  .medium-and-up-mv\+ {
    margin-top: 50px !important;
    margin-bottom: 50px !important;
  }
}

@media screen and (min-width: 769px) and (max-width: 1024px) {
  .large-m\+ {
    margin: 50px !important;
  }
  .large-mt\+ {
    margin-top: 50px !important;
  }
  .large-mr\+ {
    margin-right: 50px !important;
  }
  .large-mb\+ {
    margin-bottom: 50px !important;
  }
  .large-ml\+ {
    margin-left: 50px !important;
  }
  .large-mh\+ {
    margin-right: 50px !important;
    margin-left: 50px !important;
  }
  .large-mv\+ {
    margin-top: 50px !important;
    margin-bottom: 50px !important;
  }
}

@media screen and (min-width: 769px) {
  .large-and-up-m\+ {
    margin: 50px !important;
  }
  .large-and-up-mt\+ {
    margin-top: 50px !important;
  }
  .large-and-up-mr\+ {
    margin-right: 50px !important;
  }
  .large-and-up-mb\+ {
    margin-bottom: 50px !important;
  }
  .large-and-up-ml\+ {
    margin-left: 50px !important;
  }
  .large-and-up-mh\+ {
    margin-right: 50px !important;
    margin-left: 50px !important;
  }
  .large-and-up-mv\+ {
    margin-top: 50px !important;
    margin-bottom: 50px !important;
  }
}

@media screen and (min-width: 1025px) and (max-width: 1499px) {
  .extralarge-m\+ {
    margin: 50px !important;
  }
  .extralarge-mt\+ {
    margin-top: 50px !important;
  }
  .extralarge-mr\+ {
    margin-right: 50px !important;
  }
  .extralarge-mb\+ {
    margin-bottom: 50px !important;
  }
  .extralarge-ml\+ {
    margin-left: 50px !important;
  }
  .extralarge-mh\+ {
    margin-right: 50px !important;
    margin-left: 50px !important;
  }
  .extralarge-mv\+ {
    margin-top: 50px !important;
    margin-bottom: 50px !important;
  }
}

@media screen and (min-width: 1025px) {
  .extralarge-and-up-m\+ {
    margin: 50px !important;
  }
  .extralarge-and-up-mt\+ {
    margin-top: 50px !important;
  }
  .extralarge-and-up-mr\+ {
    margin-right: 50px !important;
  }
  .extralarge-and-up-mb\+ {
    margin-bottom: 50px !important;
  }
  .extralarge-and-up-ml\+ {
    margin-left: 50px !important;
  }
  .extralarge-and-up-mh\+ {
    margin-right: 50px !important;
    margin-left: 50px !important;
  }
  .extralarge-and-up-mv\+ {
    margin-top: 50px !important;
    margin-bottom: 50px !important;
  }
}

@media screen and (min-width: 1500px) {
  .superlarge-and-up-m\+ {
    margin: 50px !important;
  }
  .superlarge-and-up-mt\+ {
    margin-top: 50px !important;
  }
  .superlarge-and-up-mr\+ {
    margin-right: 50px !important;
  }
  .superlarge-and-up-mb\+ {
    margin-bottom: 50px !important;
  }
  .superlarge-and-up-ml\+ {
    margin-left: 50px !important;
  }
  .superlarge-and-up-mh\+ {
    margin-right: 50px !important;
    margin-left: 50px !important;
  }
  .superlarge-and-up-mv\+ {
    margin-top: 50px !important;
    margin-bottom: 50px !important;
  }
}

/**
     * Add huge margins.
     */
@media screen and (min-width: 481px) and (max-width: 768px) {
  .medium-m\+\+ {
    margin: 100px !important;
  }
  .medium-mt\+\+ {
    margin-top: 100px !important;
  }
  .medium-mr\+\+ {
    margin-right: 100px !important;
  }
  .medium-mb\+\+ {
    margin-bottom: 100px !important;
  }
  .medium-ml\+\+ {
    margin-left: 100px !important;
  }
  .medium-mh\+\+ {
    margin-right: 100px !important;
    margin-left: 100px !important;
  }
  .medium-mv\+\+ {
    margin-top: 100px !important;
    margin-bottom: 100px !important;
  }
}

@media screen and (min-width: 481px) {
  .medium-and-up-m\+\+ {
    margin: 100px !important;
  }
  .medium-and-up-mt\+\+ {
    margin-top: 100px !important;
  }
  .medium-and-up-mr\+\+ {
    margin-right: 100px !important;
  }
  .medium-and-up-mb\+\+ {
    margin-bottom: 100px !important;
  }
  .medium-and-up-ml\+\+ {
    margin-left: 100px !important;
  }
  .medium-and-up-mh\+\+ {
    margin-right: 100px !important;
    margin-left: 100px !important;
  }
  .medium-and-up-mv\+\+ {
    margin-top: 100px !important;
    margin-bottom: 100px !important;
  }
}

@media screen and (min-width: 769px) and (max-width: 1024px) {
  .large-m\+\+ {
    margin: 100px !important;
  }
  .large-mt\+\+ {
    margin-top: 100px !important;
  }
  .large-mr\+\+ {
    margin-right: 100px !important;
  }
  .large-mb\+\+ {
    margin-bottom: 100px !important;
  }
  .large-ml\+\+ {
    margin-left: 100px !important;
  }
  .large-mh\+\+ {
    margin-right: 100px !important;
    margin-left: 100px !important;
  }
  .large-mv\+\+ {
    margin-top: 100px !important;
    margin-bottom: 100px !important;
  }
}

@media screen and (min-width: 769px) {
  .large-and-up-m\+\+ {
    margin: 100px !important;
  }
  .large-and-up-mt\+\+ {
    margin-top: 100px !important;
  }
  .large-and-up-mr\+\+ {
    margin-right: 100px !important;
  }
  .large-and-up-mb\+\+ {
    margin-bottom: 100px !important;
  }
  .large-and-up-ml\+\+ {
    margin-left: 100px !important;
  }
  .large-and-up-mh\+\+ {
    margin-right: 100px !important;
    margin-left: 100px !important;
  }
  .large-and-up-mv\+\+ {
    margin-top: 100px !important;
    margin-bottom: 100px !important;
  }
}

@media screen and (min-width: 1025px) and (max-width: 1499px) {
  .extralarge-m\+\+ {
    margin: 100px !important;
  }
  .extralarge-mt\+\+ {
    margin-top: 100px !important;
  }
  .extralarge-mr\+\+ {
    margin-right: 100px !important;
  }
  .extralarge-mb\+\+ {
    margin-bottom: 100px !important;
  }
  .extralarge-ml\+\+ {
    margin-left: 100px !important;
  }
  .extralarge-mh\+\+ {
    margin-right: 100px !important;
    margin-left: 100px !important;
  }
  .extralarge-mv\+\+ {
    margin-top: 100px !important;
    margin-bottom: 100px !important;
  }
}

@media screen and (min-width: 1025px) {
  .extralarge-and-up-m\+\+ {
    margin: 100px !important;
  }
  .extralarge-and-up-mt\+\+ {
    margin-top: 100px !important;
  }
  .extralarge-and-up-mr\+\+ {
    margin-right: 100px !important;
  }
  .extralarge-and-up-mb\+\+ {
    margin-bottom: 100px !important;
  }
  .extralarge-and-up-ml\+\+ {
    margin-left: 100px !important;
  }
  .extralarge-and-up-mh\+\+ {
    margin-right: 100px !important;
    margin-left: 100px !important;
  }
  .extralarge-and-up-mv\+\+ {
    margin-top: 100px !important;
    margin-bottom: 100px !important;
  }
}

@media screen and (min-width: 1500px) {
  .superlarge-and-up-m\+\+ {
    margin: 100px !important;
  }
  .superlarge-and-up-mt\+\+ {
    margin-top: 100px !important;
  }
  .superlarge-and-up-mr\+\+ {
    margin-right: 100px !important;
  }
  .superlarge-and-up-mb\+\+ {
    margin-bottom: 100px !important;
  }
  .superlarge-and-up-ml\+\+ {
    margin-left: 100px !important;
  }
  .superlarge-and-up-mh\+\+ {
    margin-right: 100px !important;
    margin-left: 100px !important;
  }
  .superlarge-and-up-mv\+\+ {
    margin-top: 100px !important;
    margin-bottom: 100px !important;
  }
}

/**
     * Remove margins.
     */
@media screen and (min-width: 481px) and (max-width: 768px) {
  .medium-m0 {
    margin: 0 !important;
  }
  .medium-mt0 {
    margin-top: 0 !important;
  }
  .medium-mr0 {
    margin-right: 0 !important;
  }
  .medium-mb0 {
    margin-bottom: 0 !important;
  }
  .medium-ml0 {
    margin-left: 0 !important;
  }
  .medium-mh0 {
    margin-right: 0 !important;
    margin-left: 0 !important;
  }
  .medium-mv0 {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }
}

@media screen and (min-width: 481px) {
  .medium-and-up-m0 {
    margin: 0 !important;
  }
  .medium-and-up-mt0 {
    margin-top: 0 !important;
  }
  .medium-and-up-mr0 {
    margin-right: 0 !important;
  }
  .medium-and-up-mb0 {
    margin-bottom: 0 !important;
  }
  .medium-and-up-ml0 {
    margin-left: 0 !important;
  }
  .medium-and-up-mh0 {
    margin-right: 0 !important;
    margin-left: 0 !important;
  }
  .medium-and-up-mv0 {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }
}

@media screen and (min-width: 769px) and (max-width: 1024px) {
  .large-m0 {
    margin: 0 !important;
  }
  .large-mt0 {
    margin-top: 0 !important;
  }
  .large-mr0 {
    margin-right: 0 !important;
  }
  .large-mb0 {
    margin-bottom: 0 !important;
  }
  .large-ml0 {
    margin-left: 0 !important;
  }
  .large-mh0 {
    margin-right: 0 !important;
    margin-left: 0 !important;
  }
  .large-mv0 {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }
}

@media screen and (min-width: 769px) {
  .large-and-up-m0 {
    margin: 0 !important;
  }
  .large-and-up-mt0 {
    margin-top: 0 !important;
  }
  .large-and-up-mr0 {
    margin-right: 0 !important;
  }
  .large-and-up-mb0 {
    margin-bottom: 0 !important;
  }
  .large-and-up-ml0 {
    margin-left: 0 !important;
  }
  .large-and-up-mh0 {
    margin-right: 0 !important;
    margin-left: 0 !important;
  }
  .large-and-up-mv0 {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }
}

@media screen and (min-width: 1025px) and (max-width: 1499px) {
  .extralarge-m0 {
    margin: 0 !important;
  }
  .extralarge-mt0 {
    margin-top: 0 !important;
  }
  .extralarge-mr0 {
    margin-right: 0 !important;
  }
  .extralarge-mb0 {
    margin-bottom: 0 !important;
  }
  .extralarge-ml0 {
    margin-left: 0 !important;
  }
  .extralarge-mh0 {
    margin-right: 0 !important;
    margin-left: 0 !important;
  }
  .extralarge-mv0 {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }
}

@media screen and (min-width: 1025px) {
  .extralarge-and-up-m0 {
    margin: 0 !important;
  }
  .extralarge-and-up-mt0 {
    margin-top: 0 !important;
  }
  .extralarge-and-up-mr0 {
    margin-right: 0 !important;
  }
  .extralarge-and-up-mb0 {
    margin-bottom: 0 !important;
  }
  .extralarge-and-up-ml0 {
    margin-left: 0 !important;
  }
  .extralarge-and-up-mh0 {
    margin-right: 0 !important;
    margin-left: 0 !important;
  }
  .extralarge-and-up-mv0 {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }
}

@media screen and (min-width: 1500px) {
  .superlarge-and-up-m0 {
    margin: 0 !important;
  }
  .superlarge-and-up-mt0 {
    margin-top: 0 !important;
  }
  .superlarge-and-up-mr0 {
    margin-right: 0 !important;
  }
  .superlarge-and-up-mb0 {
    margin-bottom: 0 !important;
  }
  .superlarge-and-up-ml0 {
    margin-left: 0 !important;
  }
  .superlarge-and-up-mh0 {
    margin-right: 0 !important;
    margin-left: 0 !important;
  }
  .superlarge-and-up-mv0 {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }
}

/**
     * Padding helper classes.
     *
     * Add paddings.
     */
@media screen and (min-width: 481px) and (max-width: 768px) {
  .medium-p {
    padding: 25px !important;
  }
  .medium-pt {
    padding-top: 25px !important;
  }
  .medium-pr {
    padding-right: 25px !important;
  }
  .medium-pb {
    padding-bottom: 25px !important;
  }
  .medium-pl {
    padding-left: 25px !important;
  }
  .medium-ph {
    padding-right: 25px !important;
    padding-left: 25px !important;
  }
  .medium-pv {
    padding-top: 25px !important;
    padding-bottom: 25px !important;
  }
}

@media screen and (min-width: 481px) {
  .medium-and-up-p {
    padding: 25px !important;
  }
  .medium-and-up-pt {
    padding-top: 25px !important;
  }
  .medium-and-up-pr {
    padding-right: 25px !important;
  }
  .medium-and-up-pb {
    padding-bottom: 25px !important;
  }
  .medium-and-up-pl {
    padding-left: 25px !important;
  }
  .medium-and-up-ph {
    padding-right: 25px !important;
    padding-left: 25px !important;
  }
  .medium-and-up-pv {
    padding-top: 25px !important;
    padding-bottom: 25px !important;
  }
}

@media screen and (min-width: 769px) and (max-width: 1024px) {
  .large-p {
    padding: 25px !important;
  }
  .large-pt {
    padding-top: 25px !important;
  }
  .large-pr {
    padding-right: 25px !important;
  }
  .large-pb {
    padding-bottom: 25px !important;
  }
  .large-pl {
    padding-left: 25px !important;
  }
  .large-ph {
    padding-right: 25px !important;
    padding-left: 25px !important;
  }
  .large-pv {
    padding-top: 25px !important;
    padding-bottom: 25px !important;
  }
}

@media screen and (min-width: 769px) {
  .large-and-up-p {
    padding: 25px !important;
  }
  .large-and-up-pt {
    padding-top: 25px !important;
  }
  .large-and-up-pr {
    padding-right: 25px !important;
  }
  .large-and-up-pb {
    padding-bottom: 25px !important;
  }
  .large-and-up-pl {
    padding-left: 25px !important;
  }
  .large-and-up-ph {
    padding-right: 25px !important;
    padding-left: 25px !important;
  }
  .large-and-up-pv {
    padding-top: 25px !important;
    padding-bottom: 25px !important;
  }
}

@media screen and (min-width: 1025px) and (max-width: 1499px) {
  .extralarge-p {
    padding: 25px !important;
  }
  .extralarge-pt {
    padding-top: 25px !important;
  }
  .extralarge-pr {
    padding-right: 25px !important;
  }
  .extralarge-pb {
    padding-bottom: 25px !important;
  }
  .extralarge-pl {
    padding-left: 25px !important;
  }
  .extralarge-ph {
    padding-right: 25px !important;
    padding-left: 25px !important;
  }
  .extralarge-pv {
    padding-top: 25px !important;
    padding-bottom: 25px !important;
  }
}

@media screen and (min-width: 1025px) {
  .extralarge-and-up-p {
    padding: 25px !important;
  }
  .extralarge-and-up-pt {
    padding-top: 25px !important;
  }
  .extralarge-and-up-pr {
    padding-right: 25px !important;
  }
  .extralarge-and-up-pb {
    padding-bottom: 25px !important;
  }
  .extralarge-and-up-pl {
    padding-left: 25px !important;
  }
  .extralarge-and-up-ph {
    padding-right: 25px !important;
    padding-left: 25px !important;
  }
  .extralarge-and-up-pv {
    padding-top: 25px !important;
    padding-bottom: 25px !important;
  }
}

@media screen and (min-width: 1500px) {
  .superlarge-and-up-p {
    padding: 25px !important;
  }
  .superlarge-and-up-pt {
    padding-top: 25px !important;
  }
  .superlarge-and-up-pr {
    padding-right: 25px !important;
  }
  .superlarge-and-up-pb {
    padding-bottom: 25px !important;
  }
  .superlarge-and-up-pl {
    padding-left: 25px !important;
  }
  .superlarge-and-up-ph {
    padding-right: 25px !important;
    padding-left: 25px !important;
  }
  .superlarge-and-up-pv {
    padding-top: 25px !important;
    padding-bottom: 25px !important;
  }
}

/**
     * Add tiny paddings.
     */
@media screen and (min-width: 481px) and (max-width: 768px) {
  .medium-p-- {
    padding: 6px !important;
  }
  .medium-pt-- {
    padding-top: 6px !important;
  }
  .medium-pr-- {
    padding-right: 6px !important;
  }
  .medium-pb-- {
    padding-bottom: 6px !important;
  }
  .medium-pl-- {
    padding-left: 6px !important;
  }
  .medium-ph-- {
    padding-right: 6px !important;
    padding-left: 6px !important;
  }
  .medium-pv-- {
    padding-top: 6px !important;
    padding-bottom: 6px !important;
  }
}

@media screen and (min-width: 481px) {
  .medium-and-up-p-- {
    padding: 6px !important;
  }
  .medium-and-up-pt-- {
    padding-top: 6px !important;
  }
  .medium-and-up-pr-- {
    padding-right: 6px !important;
  }
  .medium-and-up-pb-- {
    padding-bottom: 6px !important;
  }
  .medium-and-up-pl-- {
    padding-left: 6px !important;
  }
  .medium-and-up-ph-- {
    padding-right: 6px !important;
    padding-left: 6px !important;
  }
  .medium-and-up-pv-- {
    padding-top: 6px !important;
    padding-bottom: 6px !important;
  }
}

@media screen and (min-width: 769px) and (max-width: 1024px) {
  .large-p-- {
    padding: 6px !important;
  }
  .large-pt-- {
    padding-top: 6px !important;
  }
  .large-pr-- {
    padding-right: 6px !important;
  }
  .large-pb-- {
    padding-bottom: 6px !important;
  }
  .large-pl-- {
    padding-left: 6px !important;
  }
  .large-ph-- {
    padding-right: 6px !important;
    padding-left: 6px !important;
  }
  .large-pv-- {
    padding-top: 6px !important;
    padding-bottom: 6px !important;
  }
}

@media screen and (min-width: 769px) {
  .large-and-up-p-- {
    padding: 6px !important;
  }
  .large-and-up-pt-- {
    padding-top: 6px !important;
  }
  .large-and-up-pr-- {
    padding-right: 6px !important;
  }
  .large-and-up-pb-- {
    padding-bottom: 6px !important;
  }
  .large-and-up-pl-- {
    padding-left: 6px !important;
  }
  .large-and-up-ph-- {
    padding-right: 6px !important;
    padding-left: 6px !important;
  }
  .large-and-up-pv-- {
    padding-top: 6px !important;
    padding-bottom: 6px !important;
  }
}

@media screen and (min-width: 1025px) and (max-width: 1499px) {
  .extralarge-p-- {
    padding: 6px !important;
  }
  .extralarge-pt-- {
    padding-top: 6px !important;
  }
  .extralarge-pr-- {
    padding-right: 6px !important;
  }
  .extralarge-pb-- {
    padding-bottom: 6px !important;
  }
  .extralarge-pl-- {
    padding-left: 6px !important;
  }
  .extralarge-ph-- {
    padding-right: 6px !important;
    padding-left: 6px !important;
  }
  .extralarge-pv-- {
    padding-top: 6px !important;
    padding-bottom: 6px !important;
  }
}

@media screen and (min-width: 1025px) {
  .extralarge-and-up-p-- {
    padding: 6px !important;
  }
  .extralarge-and-up-pt-- {
    padding-top: 6px !important;
  }
  .extralarge-and-up-pr-- {
    padding-right: 6px !important;
  }
  .extralarge-and-up-pb-- {
    padding-bottom: 6px !important;
  }
  .extralarge-and-up-pl-- {
    padding-left: 6px !important;
  }
  .extralarge-and-up-ph-- {
    padding-right: 6px !important;
    padding-left: 6px !important;
  }
  .extralarge-and-up-pv-- {
    padding-top: 6px !important;
    padding-bottom: 6px !important;
  }
}

@media screen and (min-width: 1500px) {
  .superlarge-and-up-p-- {
    padding: 6px !important;
  }
  .superlarge-and-up-pt-- {
    padding-top: 6px !important;
  }
  .superlarge-and-up-pr-- {
    padding-right: 6px !important;
  }
  .superlarge-and-up-pb-- {
    padding-bottom: 6px !important;
  }
  .superlarge-and-up-pl-- {
    padding-left: 6px !important;
  }
  .superlarge-and-up-ph-- {
    padding-right: 6px !important;
    padding-left: 6px !important;
  }
  .superlarge-and-up-pv-- {
    padding-top: 6px !important;
    padding-bottom: 6px !important;
  }
}

/**
     * Add small paddings.
     */
@media screen and (min-width: 481px) and (max-width: 768px) {
  .medium-p- {
    padding: 13px !important;
  }
  .medium-pt- {
    padding-top: 13px !important;
  }
  .medium-pr- {
    padding-right: 13px !important;
  }
  .medium-pb- {
    padding-bottom: 13px !important;
  }
  .medium-pl- {
    padding-left: 13px !important;
  }
  .medium-ph- {
    padding-right: 13px !important;
    padding-left: 13px !important;
  }
  .medium-pv- {
    padding-top: 13px !important;
    padding-bottom: 13px !important;
  }
}

@media screen and (min-width: 481px) {
  .medium-and-up-p- {
    padding: 13px !important;
  }
  .medium-and-up-pt- {
    padding-top: 13px !important;
  }
  .medium-and-up-pr- {
    padding-right: 13px !important;
  }
  .medium-and-up-pb- {
    padding-bottom: 13px !important;
  }
  .medium-and-up-pl- {
    padding-left: 13px !important;
  }
  .medium-and-up-ph- {
    padding-right: 13px !important;
    padding-left: 13px !important;
  }
  .medium-and-up-pv- {
    padding-top: 13px !important;
    padding-bottom: 13px !important;
  }
}

@media screen and (min-width: 769px) and (max-width: 1024px) {
  .large-p- {
    padding: 13px !important;
  }
  .large-pt- {
    padding-top: 13px !important;
  }
  .large-pr- {
    padding-right: 13px !important;
  }
  .large-pb- {
    padding-bottom: 13px !important;
  }
  .large-pl- {
    padding-left: 13px !important;
  }
  .large-ph- {
    padding-right: 13px !important;
    padding-left: 13px !important;
  }
  .large-pv- {
    padding-top: 13px !important;
    padding-bottom: 13px !important;
  }
}

@media screen and (min-width: 769px) {
  .large-and-up-p- {
    padding: 13px !important;
  }
  .large-and-up-pt- {
    padding-top: 13px !important;
  }
  .large-and-up-pr- {
    padding-right: 13px !important;
  }
  .large-and-up-pb- {
    padding-bottom: 13px !important;
  }
  .large-and-up-pl- {
    padding-left: 13px !important;
  }
  .large-and-up-ph- {
    padding-right: 13px !important;
    padding-left: 13px !important;
  }
  .large-and-up-pv- {
    padding-top: 13px !important;
    padding-bottom: 13px !important;
  }
}

@media screen and (min-width: 1025px) and (max-width: 1499px) {
  .extralarge-p- {
    padding: 13px !important;
  }
  .extralarge-pt- {
    padding-top: 13px !important;
  }
  .extralarge-pr- {
    padding-right: 13px !important;
  }
  .extralarge-pb- {
    padding-bottom: 13px !important;
  }
  .extralarge-pl- {
    padding-left: 13px !important;
  }
  .extralarge-ph- {
    padding-right: 13px !important;
    padding-left: 13px !important;
  }
  .extralarge-pv- {
    padding-top: 13px !important;
    padding-bottom: 13px !important;
  }
}

@media screen and (min-width: 1025px) {
  .extralarge-and-up-p- {
    padding: 13px !important;
  }
  .extralarge-and-up-pt- {
    padding-top: 13px !important;
  }
  .extralarge-and-up-pr- {
    padding-right: 13px !important;
  }
  .extralarge-and-up-pb- {
    padding-bottom: 13px !important;
  }
  .extralarge-and-up-pl- {
    padding-left: 13px !important;
  }
  .extralarge-and-up-ph- {
    padding-right: 13px !important;
    padding-left: 13px !important;
  }
  .extralarge-and-up-pv- {
    padding-top: 13px !important;
    padding-bottom: 13px !important;
  }
}

@media screen and (min-width: 1500px) {
  .superlarge-and-up-p- {
    padding: 13px !important;
  }
  .superlarge-and-up-pt- {
    padding-top: 13px !important;
  }
  .superlarge-and-up-pr- {
    padding-right: 13px !important;
  }
  .superlarge-and-up-pb- {
    padding-bottom: 13px !important;
  }
  .superlarge-and-up-pl- {
    padding-left: 13px !important;
  }
  .superlarge-and-up-ph- {
    padding-right: 13px !important;
    padding-left: 13px !important;
  }
  .superlarge-and-up-pv- {
    padding-top: 13px !important;
    padding-bottom: 13px !important;
  }
}

/**
     * Add large paddings.
     */
@media screen and (min-width: 481px) and (max-width: 768px) {
  .medium-p\+ {
    padding: 50px !important;
  }
  .medium-pt\+ {
    padding-top: 50px !important;
  }
  .medium-pr\+ {
    padding-right: 50px !important;
  }
  .medium-pb\+ {
    padding-bottom: 50px !important;
  }
  .medium-pl\+ {
    padding-left: 50px !important;
  }
  .medium-ph\+ {
    padding-right: 50px !important;
    padding-left: 50px !important;
  }
  .medium-pv\+ {
    padding-top: 50px !important;
    padding-bottom: 50px !important;
  }
}

@media screen and (min-width: 481px) {
  .medium-and-up-p\+ {
    padding: 50px !important;
  }
  .medium-and-up-pt\+ {
    padding-top: 50px !important;
  }
  .medium-and-up-pr\+ {
    padding-right: 50px !important;
  }
  .medium-and-up-pb\+ {
    padding-bottom: 50px !important;
  }
  .medium-and-up-pl\+ {
    padding-left: 50px !important;
  }
  .medium-and-up-ph\+ {
    padding-right: 50px !important;
    padding-left: 50px !important;
  }
  .medium-and-up-pv\+ {
    padding-top: 50px !important;
    padding-bottom: 50px !important;
  }
}

@media screen and (min-width: 769px) and (max-width: 1024px) {
  .large-p\+ {
    padding: 50px !important;
  }
  .large-pt\+ {
    padding-top: 50px !important;
  }
  .large-pr\+ {
    padding-right: 50px !important;
  }
  .large-pb\+ {
    padding-bottom: 50px !important;
  }
  .large-pl\+ {
    padding-left: 50px !important;
  }
  .large-ph\+ {
    padding-right: 50px !important;
    padding-left: 50px !important;
  }
  .large-pv\+ {
    padding-top: 50px !important;
    padding-bottom: 50px !important;
  }
}

@media screen and (min-width: 769px) {
  .large-and-up-p\+ {
    padding: 50px !important;
  }
  .large-and-up-pt\+ {
    padding-top: 50px !important;
  }
  .large-and-up-pr\+ {
    padding-right: 50px !important;
  }
  .large-and-up-pb\+ {
    padding-bottom: 50px !important;
  }
  .large-and-up-pl\+ {
    padding-left: 50px !important;
  }
  .large-and-up-ph\+ {
    padding-right: 50px !important;
    padding-left: 50px !important;
  }
  .large-and-up-pv\+ {
    padding-top: 50px !important;
    padding-bottom: 50px !important;
  }
}

@media screen and (min-width: 1025px) and (max-width: 1499px) {
  .extralarge-p\+ {
    padding: 50px !important;
  }
  .extralarge-pt\+ {
    padding-top: 50px !important;
  }
  .extralarge-pr\+ {
    padding-right: 50px !important;
  }
  .extralarge-pb\+ {
    padding-bottom: 50px !important;
  }
  .extralarge-pl\+ {
    padding-left: 50px !important;
  }
  .extralarge-ph\+ {
    padding-right: 50px !important;
    padding-left: 50px !important;
  }
  .extralarge-pv\+ {
    padding-top: 50px !important;
    padding-bottom: 50px !important;
  }
}

@media screen and (min-width: 1025px) {
  .extralarge-and-up-p\+ {
    padding: 50px !important;
  }
  .extralarge-and-up-pt\+ {
    padding-top: 50px !important;
  }
  .extralarge-and-up-pr\+ {
    padding-right: 50px !important;
  }
  .extralarge-and-up-pb\+ {
    padding-bottom: 50px !important;
  }
  .extralarge-and-up-pl\+ {
    padding-left: 50px !important;
  }
  .extralarge-and-up-ph\+ {
    padding-right: 50px !important;
    padding-left: 50px !important;
  }
  .extralarge-and-up-pv\+ {
    padding-top: 50px !important;
    padding-bottom: 50px !important;
  }
}

@media screen and (min-width: 1500px) {
  .superlarge-and-up-p\+ {
    padding: 50px !important;
  }
  .superlarge-and-up-pt\+ {
    padding-top: 50px !important;
  }
  .superlarge-and-up-pr\+ {
    padding-right: 50px !important;
  }
  .superlarge-and-up-pb\+ {
    padding-bottom: 50px !important;
  }
  .superlarge-and-up-pl\+ {
    padding-left: 50px !important;
  }
  .superlarge-and-up-ph\+ {
    padding-right: 50px !important;
    padding-left: 50px !important;
  }
  .superlarge-and-up-pv\+ {
    padding-top: 50px !important;
    padding-bottom: 50px !important;
  }
}

/**
     * Add huge paddings.
     */
@media screen and (min-width: 481px) and (max-width: 768px) {
  .medium-p\+\+ {
    padding: 100px !important;
  }
  .medium-pt\+\+ {
    padding-top: 100px !important;
  }
  .medium-pr\+\+ {
    padding-right: 100px !important;
  }
  .medium-pb\+\+ {
    padding-bottom: 100px !important;
  }
  .medium-pl\+\+ {
    padding-left: 100px !important;
  }
  .medium-ph\+\+ {
    padding-right: 100px !important;
    padding-left: 100px !important;
  }
  .medium-pv\+\+ {
    padding-top: 100px !important;
    padding-bottom: 100px !important;
  }
}

@media screen and (min-width: 481px) {
  .medium-and-up-p\+\+ {
    padding: 100px !important;
  }
  .medium-and-up-pt\+\+ {
    padding-top: 100px !important;
  }
  .medium-and-up-pr\+\+ {
    padding-right: 100px !important;
  }
  .medium-and-up-pb\+\+ {
    padding-bottom: 100px !important;
  }
  .medium-and-up-pl\+\+ {
    padding-left: 100px !important;
  }
  .medium-and-up-ph\+\+ {
    padding-right: 100px !important;
    padding-left: 100px !important;
  }
  .medium-and-up-pv\+\+ {
    padding-top: 100px !important;
    padding-bottom: 100px !important;
  }
}

@media screen and (min-width: 769px) and (max-width: 1024px) {
  .large-p\+\+ {
    padding: 100px !important;
  }
  .large-pt\+\+ {
    padding-top: 100px !important;
  }
  .large-pr\+\+ {
    padding-right: 100px !important;
  }
  .large-pb\+\+ {
    padding-bottom: 100px !important;
  }
  .large-pl\+\+ {
    padding-left: 100px !important;
  }
  .large-ph\+\+ {
    padding-right: 100px !important;
    padding-left: 100px !important;
  }
  .large-pv\+\+ {
    padding-top: 100px !important;
    padding-bottom: 100px !important;
  }
}

@media screen and (min-width: 769px) {
  .large-and-up-p\+\+ {
    padding: 100px !important;
  }
  .large-and-up-pt\+\+ {
    padding-top: 100px !important;
  }
  .large-and-up-pr\+\+ {
    padding-right: 100px !important;
  }
  .large-and-up-pb\+\+ {
    padding-bottom: 100px !important;
  }
  .large-and-up-pl\+\+ {
    padding-left: 100px !important;
  }
  .large-and-up-ph\+\+ {
    padding-right: 100px !important;
    padding-left: 100px !important;
  }
  .large-and-up-pv\+\+ {
    padding-top: 100px !important;
    padding-bottom: 100px !important;
  }
}

@media screen and (min-width: 1025px) and (max-width: 1499px) {
  .extralarge-p\+\+ {
    padding: 100px !important;
  }
  .extralarge-pt\+\+ {
    padding-top: 100px !important;
  }
  .extralarge-pr\+\+ {
    padding-right: 100px !important;
  }
  .extralarge-pb\+\+ {
    padding-bottom: 100px !important;
  }
  .extralarge-pl\+\+ {
    padding-left: 100px !important;
  }
  .extralarge-ph\+\+ {
    padding-right: 100px !important;
    padding-left: 100px !important;
  }
  .extralarge-pv\+\+ {
    padding-top: 100px !important;
    padding-bottom: 100px !important;
  }
}

@media screen and (min-width: 1025px) {
  .extralarge-and-up-p\+\+ {
    padding: 100px !important;
  }
  .extralarge-and-up-pt\+\+ {
    padding-top: 100px !important;
  }
  .extralarge-and-up-pr\+\+ {
    padding-right: 100px !important;
  }
  .extralarge-and-up-pb\+\+ {
    padding-bottom: 100px !important;
  }
  .extralarge-and-up-pl\+\+ {
    padding-left: 100px !important;
  }
  .extralarge-and-up-ph\+\+ {
    padding-right: 100px !important;
    padding-left: 100px !important;
  }
  .extralarge-and-up-pv\+\+ {
    padding-top: 100px !important;
    padding-bottom: 100px !important;
  }
}

@media screen and (min-width: 1500px) {
  .superlarge-and-up-p\+\+ {
    padding: 100px !important;
  }
  .superlarge-and-up-pt\+\+ {
    padding-top: 100px !important;
  }
  .superlarge-and-up-pr\+\+ {
    padding-right: 100px !important;
  }
  .superlarge-and-up-pb\+\+ {
    padding-bottom: 100px !important;
  }
  .superlarge-and-up-pl\+\+ {
    padding-left: 100px !important;
  }
  .superlarge-and-up-ph\+\+ {
    padding-right: 100px !important;
    padding-left: 100px !important;
  }
  .superlarge-and-up-pv\+\+ {
    padding-top: 100px !important;
    padding-bottom: 100px !important;
  }
}

/**
     * Remove paddings.
     */
@media screen and (min-width: 481px) and (max-width: 768px) {
  .medium-p0 {
    padding: 0 !important;
  }
  .medium-pt0 {
    padding-top: 0 !important;
  }
  .medium-pr0 {
    padding-right: 0 !important;
  }
  .medium-pb0 {
    padding-bottom: 0 !important;
  }
  .medium-pl0 {
    padding-left: 0 !important;
  }
  .medium-ph0 {
    padding-right: 0 !important;
    padding-left: 0 !important;
  }
  .medium-pv0 {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }
}

@media screen and (min-width: 481px) {
  .medium-and-up-p0 {
    padding: 0 !important;
  }
  .medium-and-up-pt0 {
    padding-top: 0 !important;
  }
  .medium-and-up-pr0 {
    padding-right: 0 !important;
  }
  .medium-and-up-pb0 {
    padding-bottom: 0 !important;
  }
  .medium-and-up-pl0 {
    padding-left: 0 !important;
  }
  .medium-and-up-ph0 {
    padding-right: 0 !important;
    padding-left: 0 !important;
  }
  .medium-and-up-pv0 {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }
}

@media screen and (min-width: 769px) and (max-width: 1024px) {
  .large-p0 {
    padding: 0 !important;
  }
  .large-pt0 {
    padding-top: 0 !important;
  }
  .large-pr0 {
    padding-right: 0 !important;
  }
  .large-pb0 {
    padding-bottom: 0 !important;
  }
  .large-pl0 {
    padding-left: 0 !important;
  }
  .large-ph0 {
    padding-right: 0 !important;
    padding-left: 0 !important;
  }
  .large-pv0 {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }
}

@media screen and (min-width: 769px) {
  .large-and-up-p0 {
    padding: 0 !important;
  }
  .large-and-up-pt0 {
    padding-top: 0 !important;
  }
  .large-and-up-pr0 {
    padding-right: 0 !important;
  }
  .large-and-up-pb0 {
    padding-bottom: 0 !important;
  }
  .large-and-up-pl0 {
    padding-left: 0 !important;
  }
  .large-and-up-ph0 {
    padding-right: 0 !important;
    padding-left: 0 !important;
  }
  .large-and-up-pv0 {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }
}

@media screen and (min-width: 1025px) and (max-width: 1499px) {
  .extralarge-p0 {
    padding: 0 !important;
  }
  .extralarge-pt0 {
    padding-top: 0 !important;
  }
  .extralarge-pr0 {
    padding-right: 0 !important;
  }
  .extralarge-pb0 {
    padding-bottom: 0 !important;
  }
  .extralarge-pl0 {
    padding-left: 0 !important;
  }
  .extralarge-ph0 {
    padding-right: 0 !important;
    padding-left: 0 !important;
  }
  .extralarge-pv0 {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }
}

@media screen and (min-width: 1025px) {
  .extralarge-and-up-p0 {
    padding: 0 !important;
  }
  .extralarge-and-up-pt0 {
    padding-top: 0 !important;
  }
  .extralarge-and-up-pr0 {
    padding-right: 0 !important;
  }
  .extralarge-and-up-pb0 {
    padding-bottom: 0 !important;
  }
  .extralarge-and-up-pl0 {
    padding-left: 0 !important;
  }
  .extralarge-and-up-ph0 {
    padding-right: 0 !important;
    padding-left: 0 !important;
  }
  .extralarge-and-up-pv0 {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }
}

@media screen and (min-width: 1500px) {
  .superlarge-and-up-p0 {
    padding: 0 !important;
  }
  .superlarge-and-up-pt0 {
    padding-top: 0 !important;
  }
  .superlarge-and-up-pr0 {
    padding-right: 0 !important;
  }
  .superlarge-and-up-pb0 {
    padding-bottom: 0 !important;
  }
  .superlarge-and-up-pl0 {
    padding-left: 0 !important;
  }
  .superlarge-and-up-ph0 {
    padding-right: 0 !important;
    padding-left: 0 !important;
  }
  .superlarge-and-up-pv0 {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }
}

/*------------------------------------*    #WIDTHS
\*------------------------------------*/
/**
 * A series of width helper classes that you can use to size things like grid
 * systems. Classes can take a fraction-like format (e.g. `.2/3`) or a spoken-
 * word format (e.g. `two-thirds`). Toggle formats by overriding the
 * `$inuit-use-fractions` variable defined below.
 */
/**
     * Whole.
     */
[class~="1/1"] {
  width: 100% !important;
}

/**
     * Halves.
     */
[class~="1/2"],
[class~="2/4"],
[class~="3/6"],
[class~="4/8"],
[class~="5/10"],
[class~="6/12"] {
  width: 50% !important;
}

/**
     * Thirds.
     */
[class~="1/3"],
[class~="2/6"],
[class~="3/9"],
[class~="4/12"] {
  width: 33.3333333% !important;
}

[class~="2/3"],
[class~="4/6"],
[class~="6/9"],
[class~="8/12"] {
  width: 66.6666666% !important;
}

/**
     * Quarters.
     */
[class~="1/4"],
[class~="2/8"],
[class~="3/12"] {
  width: 25% !important;
}

[class~="3/4"],
[class~="6/8"],
[class~="9/12"] {
  width: 75% !important;
}

/**
     * Fifths.
     */
[class~="1/5"],
[class~="2/10"] {
  width: 20% !important;
}

[class~="2/5"],
[class~="4/10"] {
  width: 40% !important;
}

[class~="3/5"],
[class~="6/10"] {
  width: 60% !important;
}

[class~="4/5"],
[class~="8/10"] {
  width: 80% !important;
}

/**
     * Sixths.
     */
[class~="1/6"],
[class~="2/12"] {
  width: 16.6666666% !important;
}

[class~="5/6"],
[class~="10/12"] {
  width: 83.3333333% !important;
}

/**
     * Eighths.
     */
[class~="1/8"] {
  width: 12.5% !important;
}

[class~="3/8"] {
  width: 37.5% !important;
}

[class~="5/8"] {
  width: 62.5% !important;
}

[class~="7/8"] {
  width: 87.5% !important;
}

/**
     * Ninths.
     */
[class~="1/9"] {
  width: 11.1111111% !important;
}

[class~="2/9"] {
  width: 22.2222222% !important;
}

[class~="4/9"] {
  width: 44.4444444% !important;
}

[class~="5/9"] {
  width: 55.5555555% !important;
}

[class~="7/9"] {
  width: 77.7777777% !important;
}

[class~="8/9"] {
  width: 88.8888888% !important;
}

/**
     * Tenths.
     */
[class~="1/10"] {
  width: 10% !important;
}

[class~="3/10"] {
  width: 30% !important;
}

[class~="7/10"] {
  width: 70% !important;
}

[class~="9/10"] {
  width: 90% !important;
}

/**
     * Twelfths.
     */
[class~="1/12"] {
  width: 8.3333333% !important;
}

[class~="5/12"] {
  width: 41.6666666% !important;
}

[class~="7/12"] {
  width: 58.3333333% !important;
}

[class~="11/12"] {
  width: 91.6666666% !important;
}

/*------------------------------------*    #WIDTHS-RESPONSIVE
\*------------------------------------*/
/**
 * Responsive width classes based on your responsive settings.
 */
@media screen and (min-width: 481px) and (max-width: 768px) {
  /**
                 * Whole.
                 */
  [class~="medium-1/1"] {
    width: 100% !important;
  }
  /**
                 * Halves.
                 */
  [class~="medium-1/2"],
  [class~="medium-2/4"],
  [class~="medium-3/6"],
  [class~="medium-4/8"],
  [class~="medium-5/10"],
  [class~="medium-6/12"] {
    width: 50% !important;
  }
  /**
                 * Thirds.
                 */
  [class~="medium-1/3"],
  [class~="medium-2/6"],
  [class~="medium-3/9"],
  [class~="medium-4/12"] {
    width: 33.3333333% !important;
  }
  [class~="medium-2/3"],
  [class~="medium-4/6"],
  [class~="medium-6/9"],
  [class~="medium-8/12"] {
    width: 66.6666666% !important;
  }
  /**
                 * Quarters.
                 */
  [class~="medium-1/4"],
  [class~="medium-2/8"],
  [class~="medium-3/12"] {
    width: 25% !important;
  }
  [class~="medium-3/4"],
  [class~="medium-6/8"],
  [class~="medium-9/12"] {
    width: 75% !important;
  }
  /**
                 * Fifths.
                 */
  [class~="medium-1/5"],
  [class~="medium-2/10"] {
    width: 20% !important;
  }
  [class~="medium-2/5"],
  [class~="medium-4/10"] {
    width: 40% !important;
  }
  [class~="medium-3/5"],
  [class~="medium-6/10"] {
    width: 60% !important;
  }
  [class~="medium-4/5"],
  [class~="medium-8/10"] {
    width: 80% !important;
  }
  /**
                 * Sixths.
                 */
  [class~="medium-1/6"],
  [class~="medium-2/12"] {
    width: 16.6666666% !important;
  }
  [class~="medium-5/6"],
  [class~="medium-10/12"] {
    width: 83.3333333% !important;
  }
  /**
                 * Eighths.
                 */
  [class~="medium-1/8"] {
    width: 12.5% !important;
  }
  [class~="medium-3/8"] {
    width: 37.5% !important;
  }
  [class~="medium-5/8"] {
    width: 62.5% !important;
  }
  [class~="medium-7/8"] {
    width: 87.5% !important;
  }
  /**
                 * Ninths.
                 */
  [class~="medium-1/9"] {
    width: 11.1111111% !important;
  }
  [class~="medium-2/9"] {
    width: 22.2222222% !important;
  }
  [class~="medium-4/9"] {
    width: 44.4444444% !important;
  }
  [class~="medium-5/9"] {
    width: 55.5555555% !important;
  }
  [class~="medium-7/9"] {
    width: 77.7777777% !important;
  }
  [class~="medium-8/9"] {
    width: 88.8888888% !important;
  }
  /**
                 * Tenths.
                 */
  [class~="medium-1/10"] {
    width: 10% !important;
  }
  [class~="medium-3/10"] {
    width: 30% !important;
  }
  [class~="medium-7/10"] {
    width: 70% !important;
  }
  [class~="medium-9/10"] {
    width: 90% !important;
  }
  /**
                 * Twelfths.
                 */
  [class~="medium-1/12"] {
    width: 8.3333333% !important;
  }
  [class~="medium-5/12"] {
    width: 41.6666666% !important;
  }
  [class~="medium-7/12"] {
    width: 58.3333333% !important;
  }
  [class~="medium-11/12"] {
    width: 91.6666666% !important;
  }
}

@media screen and (min-width: 481px) {
  /**
                 * Whole.
                 */
  [class~="medium-and-up-1/1"] {
    width: 100% !important;
  }
  /**
                 * Halves.
                 */
  [class~="medium-and-up-1/2"],
  [class~="medium-and-up-2/4"],
  [class~="medium-and-up-3/6"],
  [class~="medium-and-up-4/8"],
  [class~="medium-and-up-5/10"],
  [class~="medium-and-up-6/12"] {
    width: 50% !important;
  }
  /**
                 * Thirds.
                 */
  [class~="medium-and-up-1/3"],
  [class~="medium-and-up-2/6"],
  [class~="medium-and-up-3/9"],
  [class~="medium-and-up-4/12"] {
    width: 33.3333333% !important;
  }
  [class~="medium-and-up-2/3"],
  [class~="medium-and-up-4/6"],
  [class~="medium-and-up-6/9"],
  [class~="medium-and-up-8/12"] {
    width: 66.6666666% !important;
  }
  /**
                 * Quarters.
                 */
  [class~="medium-and-up-1/4"],
  [class~="medium-and-up-2/8"],
  [class~="medium-and-up-3/12"] {
    width: 25% !important;
  }
  [class~="medium-and-up-3/4"],
  [class~="medium-and-up-6/8"],
  [class~="medium-and-up-9/12"] {
    width: 75% !important;
  }
  /**
                 * Fifths.
                 */
  [class~="medium-and-up-1/5"],
  [class~="medium-and-up-2/10"] {
    width: 20% !important;
  }
  [class~="medium-and-up-2/5"],
  [class~="medium-and-up-4/10"] {
    width: 40% !important;
  }
  [class~="medium-and-up-3/5"],
  [class~="medium-and-up-6/10"] {
    width: 60% !important;
  }
  [class~="medium-and-up-4/5"],
  [class~="medium-and-up-8/10"] {
    width: 80% !important;
  }
  /**
                 * Sixths.
                 */
  [class~="medium-and-up-1/6"],
  [class~="medium-and-up-2/12"] {
    width: 16.6666666% !important;
  }
  [class~="medium-and-up-5/6"],
  [class~="medium-and-up-10/12"] {
    width: 83.3333333% !important;
  }
  /**
                 * Eighths.
                 */
  [class~="medium-and-up-1/8"] {
    width: 12.5% !important;
  }
  [class~="medium-and-up-3/8"] {
    width: 37.5% !important;
  }
  [class~="medium-and-up-5/8"] {
    width: 62.5% !important;
  }
  [class~="medium-and-up-7/8"] {
    width: 87.5% !important;
  }
  /**
                 * Ninths.
                 */
  [class~="medium-and-up-1/9"] {
    width: 11.1111111% !important;
  }
  [class~="medium-and-up-2/9"] {
    width: 22.2222222% !important;
  }
  [class~="medium-and-up-4/9"] {
    width: 44.4444444% !important;
  }
  [class~="medium-and-up-5/9"] {
    width: 55.5555555% !important;
  }
  [class~="medium-and-up-7/9"] {
    width: 77.7777777% !important;
  }
  [class~="medium-and-up-8/9"] {
    width: 88.8888888% !important;
  }
  /**
                 * Tenths.
                 */
  [class~="medium-and-up-1/10"] {
    width: 10% !important;
  }
  [class~="medium-and-up-3/10"] {
    width: 30% !important;
  }
  [class~="medium-and-up-7/10"] {
    width: 70% !important;
  }
  [class~="medium-and-up-9/10"] {
    width: 90% !important;
  }
  /**
                 * Twelfths.
                 */
  [class~="medium-and-up-1/12"] {
    width: 8.3333333% !important;
  }
  [class~="medium-and-up-5/12"] {
    width: 41.6666666% !important;
  }
  [class~="medium-and-up-7/12"] {
    width: 58.3333333% !important;
  }
  [class~="medium-and-up-11/12"] {
    width: 91.6666666% !important;
  }
}

@media screen and (min-width: 769px) and (max-width: 1024px) {
  /**
                 * Whole.
                 */
  [class~="large-1/1"] {
    width: 100% !important;
  }
  /**
                 * Halves.
                 */
  [class~="large-1/2"],
  [class~="large-2/4"],
  [class~="large-3/6"],
  [class~="large-4/8"],
  [class~="large-5/10"],
  [class~="large-6/12"] {
    width: 50% !important;
  }
  /**
                 * Thirds.
                 */
  [class~="large-1/3"],
  [class~="large-2/6"],
  [class~="large-3/9"],
  [class~="large-4/12"] {
    width: 33.3333333% !important;
  }
  [class~="large-2/3"],
  [class~="large-4/6"],
  [class~="large-6/9"],
  [class~="large-8/12"] {
    width: 66.6666666% !important;
  }
  /**
                 * Quarters.
                 */
  [class~="large-1/4"],
  [class~="large-2/8"],
  [class~="large-3/12"] {
    width: 25% !important;
  }
  [class~="large-3/4"],
  [class~="large-6/8"],
  [class~="large-9/12"] {
    width: 75% !important;
  }
  /**
                 * Fifths.
                 */
  [class~="large-1/5"],
  [class~="large-2/10"] {
    width: 20% !important;
  }
  [class~="large-2/5"],
  [class~="large-4/10"] {
    width: 40% !important;
  }
  [class~="large-3/5"],
  [class~="large-6/10"] {
    width: 60% !important;
  }
  [class~="large-4/5"],
  [class~="large-8/10"] {
    width: 80% !important;
  }
  /**
                 * Sixths.
                 */
  [class~="large-1/6"],
  [class~="large-2/12"] {
    width: 16.6666666% !important;
  }
  [class~="large-5/6"],
  [class~="large-10/12"] {
    width: 83.3333333% !important;
  }
  /**
                 * Eighths.
                 */
  [class~="large-1/8"] {
    width: 12.5% !important;
  }
  [class~="large-3/8"] {
    width: 37.5% !important;
  }
  [class~="large-5/8"] {
    width: 62.5% !important;
  }
  [class~="large-7/8"] {
    width: 87.5% !important;
  }
  /**
                 * Ninths.
                 */
  [class~="large-1/9"] {
    width: 11.1111111% !important;
  }
  [class~="large-2/9"] {
    width: 22.2222222% !important;
  }
  [class~="large-4/9"] {
    width: 44.4444444% !important;
  }
  [class~="large-5/9"] {
    width: 55.5555555% !important;
  }
  [class~="large-7/9"] {
    width: 77.7777777% !important;
  }
  [class~="large-8/9"] {
    width: 88.8888888% !important;
  }
  /**
                 * Tenths.
                 */
  [class~="large-1/10"] {
    width: 10% !important;
  }
  [class~="large-3/10"] {
    width: 30% !important;
  }
  [class~="large-7/10"] {
    width: 70% !important;
  }
  [class~="large-9/10"] {
    width: 90% !important;
  }
  /**
                 * Twelfths.
                 */
  [class~="large-1/12"] {
    width: 8.3333333% !important;
  }
  [class~="large-5/12"] {
    width: 41.6666666% !important;
  }
  [class~="large-7/12"] {
    width: 58.3333333% !important;
  }
  [class~="large-11/12"] {
    width: 91.6666666% !important;
  }
}

@media screen and (min-width: 769px) {
  /**
                 * Whole.
                 */
  [class~="large-and-up-1/1"] {
    width: 100% !important;
  }
  /**
                 * Halves.
                 */
  [class~="large-and-up-1/2"],
  [class~="large-and-up-2/4"],
  [class~="large-and-up-3/6"],
  [class~="large-and-up-4/8"],
  [class~="large-and-up-5/10"],
  [class~="large-and-up-6/12"] {
    width: 50% !important;
  }
  /**
                 * Thirds.
                 */
  [class~="large-and-up-1/3"],
  [class~="large-and-up-2/6"],
  [class~="large-and-up-3/9"],
  [class~="large-and-up-4/12"] {
    width: 33.3333333% !important;
  }
  [class~="large-and-up-2/3"],
  [class~="large-and-up-4/6"],
  [class~="large-and-up-6/9"],
  [class~="large-and-up-8/12"] {
    width: 66.6666666% !important;
  }
  /**
                 * Quarters.
                 */
  [class~="large-and-up-1/4"],
  [class~="large-and-up-2/8"],
  [class~="large-and-up-3/12"] {
    width: 25% !important;
  }
  [class~="large-and-up-3/4"],
  [class~="large-and-up-6/8"],
  [class~="large-and-up-9/12"] {
    width: 75% !important;
  }
  /**
                 * Fifths.
                 */
  [class~="large-and-up-1/5"],
  [class~="large-and-up-2/10"] {
    width: 20% !important;
  }
  [class~="large-and-up-2/5"],
  [class~="large-and-up-4/10"] {
    width: 40% !important;
  }
  [class~="large-and-up-3/5"],
  [class~="large-and-up-6/10"] {
    width: 60% !important;
  }
  [class~="large-and-up-4/5"],
  [class~="large-and-up-8/10"] {
    width: 80% !important;
  }
  /**
                 * Sixths.
                 */
  [class~="large-and-up-1/6"],
  [class~="large-and-up-2/12"] {
    width: 16.6666666% !important;
  }
  [class~="large-and-up-5/6"],
  [class~="large-and-up-10/12"] {
    width: 83.3333333% !important;
  }
  /**
                 * Eighths.
                 */
  [class~="large-and-up-1/8"] {
    width: 12.5% !important;
  }
  [class~="large-and-up-3/8"] {
    width: 37.5% !important;
  }
  [class~="large-and-up-5/8"] {
    width: 62.5% !important;
  }
  [class~="large-and-up-7/8"] {
    width: 87.5% !important;
  }
  /**
                 * Ninths.
                 */
  [class~="large-and-up-1/9"] {
    width: 11.1111111% !important;
  }
  [class~="large-and-up-2/9"] {
    width: 22.2222222% !important;
  }
  [class~="large-and-up-4/9"] {
    width: 44.4444444% !important;
  }
  [class~="large-and-up-5/9"] {
    width: 55.5555555% !important;
  }
  [class~="large-and-up-7/9"] {
    width: 77.7777777% !important;
  }
  [class~="large-and-up-8/9"] {
    width: 88.8888888% !important;
  }
  /**
                 * Tenths.
                 */
  [class~="large-and-up-1/10"] {
    width: 10% !important;
  }
  [class~="large-and-up-3/10"] {
    width: 30% !important;
  }
  [class~="large-and-up-7/10"] {
    width: 70% !important;
  }
  [class~="large-and-up-9/10"] {
    width: 90% !important;
  }
  /**
                 * Twelfths.
                 */
  [class~="large-and-up-1/12"] {
    width: 8.3333333% !important;
  }
  [class~="large-and-up-5/12"] {
    width: 41.6666666% !important;
  }
  [class~="large-and-up-7/12"] {
    width: 58.3333333% !important;
  }
  [class~="large-and-up-11/12"] {
    width: 91.6666666% !important;
  }
}

@media screen and (min-width: 1025px) and (max-width: 1499px) {
  /**
                 * Whole.
                 */
  [class~="extralarge-1/1"] {
    width: 100% !important;
  }
  /**
                 * Halves.
                 */
  [class~="extralarge-1/2"],
  [class~="extralarge-2/4"],
  [class~="extralarge-3/6"],
  [class~="extralarge-4/8"],
  [class~="extralarge-5/10"],
  [class~="extralarge-6/12"] {
    width: 50% !important;
  }
  /**
                 * Thirds.
                 */
  [class~="extralarge-1/3"],
  [class~="extralarge-2/6"],
  [class~="extralarge-3/9"],
  [class~="extralarge-4/12"] {
    width: 33.3333333% !important;
  }
  [class~="extralarge-2/3"],
  [class~="extralarge-4/6"],
  [class~="extralarge-6/9"],
  [class~="extralarge-8/12"] {
    width: 66.6666666% !important;
  }
  /**
                 * Quarters.
                 */
  [class~="extralarge-1/4"],
  [class~="extralarge-2/8"],
  [class~="extralarge-3/12"] {
    width: 25% !important;
  }
  [class~="extralarge-3/4"],
  [class~="extralarge-6/8"],
  [class~="extralarge-9/12"] {
    width: 75% !important;
  }
  /**
                 * Fifths.
                 */
  [class~="extralarge-1/5"],
  [class~="extralarge-2/10"] {
    width: 20% !important;
  }
  [class~="extralarge-2/5"],
  [class~="extralarge-4/10"] {
    width: 40% !important;
  }
  [class~="extralarge-3/5"],
  [class~="extralarge-6/10"] {
    width: 60% !important;
  }
  [class~="extralarge-4/5"],
  [class~="extralarge-8/10"] {
    width: 80% !important;
  }
  /**
                 * Sixths.
                 */
  [class~="extralarge-1/6"],
  [class~="extralarge-2/12"] {
    width: 16.6666666% !important;
  }
  [class~="extralarge-5/6"],
  [class~="extralarge-10/12"] {
    width: 83.3333333% !important;
  }
  /**
                 * Eighths.
                 */
  [class~="extralarge-1/8"] {
    width: 12.5% !important;
  }
  [class~="extralarge-3/8"] {
    width: 37.5% !important;
  }
  [class~="extralarge-5/8"] {
    width: 62.5% !important;
  }
  [class~="extralarge-7/8"] {
    width: 87.5% !important;
  }
  /**
                 * Ninths.
                 */
  [class~="extralarge-1/9"] {
    width: 11.1111111% !important;
  }
  [class~="extralarge-2/9"] {
    width: 22.2222222% !important;
  }
  [class~="extralarge-4/9"] {
    width: 44.4444444% !important;
  }
  [class~="extralarge-5/9"] {
    width: 55.5555555% !important;
  }
  [class~="extralarge-7/9"] {
    width: 77.7777777% !important;
  }
  [class~="extralarge-8/9"] {
    width: 88.8888888% !important;
  }
  /**
                 * Tenths.
                 */
  [class~="extralarge-1/10"] {
    width: 10% !important;
  }
  [class~="extralarge-3/10"] {
    width: 30% !important;
  }
  [class~="extralarge-7/10"] {
    width: 70% !important;
  }
  [class~="extralarge-9/10"] {
    width: 90% !important;
  }
  /**
                 * Twelfths.
                 */
  [class~="extralarge-1/12"] {
    width: 8.3333333% !important;
  }
  [class~="extralarge-5/12"] {
    width: 41.6666666% !important;
  }
  [class~="extralarge-7/12"] {
    width: 58.3333333% !important;
  }
  [class~="extralarge-11/12"] {
    width: 91.6666666% !important;
  }
}

@media screen and (min-width: 1025px) {
  /**
                 * Whole.
                 */
  [class~="extralarge-and-up-1/1"] {
    width: 100% !important;
  }
  /**
                 * Halves.
                 */
  [class~="extralarge-and-up-1/2"],
  [class~="extralarge-and-up-2/4"],
  [class~="extralarge-and-up-3/6"],
  [class~="extralarge-and-up-4/8"],
  [class~="extralarge-and-up-5/10"],
  [class~="extralarge-and-up-6/12"] {
    width: 50% !important;
  }
  /**
                 * Thirds.
                 */
  [class~="extralarge-and-up-1/3"],
  [class~="extralarge-and-up-2/6"],
  [class~="extralarge-and-up-3/9"],
  [class~="extralarge-and-up-4/12"] {
    width: 33.3333333% !important;
  }
  [class~="extralarge-and-up-2/3"],
  [class~="extralarge-and-up-4/6"],
  [class~="extralarge-and-up-6/9"],
  [class~="extralarge-and-up-8/12"] {
    width: 66.6666666% !important;
  }
  /**
                 * Quarters.
                 */
  [class~="extralarge-and-up-1/4"],
  [class~="extralarge-and-up-2/8"],
  [class~="extralarge-and-up-3/12"] {
    width: 25% !important;
  }
  [class~="extralarge-and-up-3/4"],
  [class~="extralarge-and-up-6/8"],
  [class~="extralarge-and-up-9/12"] {
    width: 75% !important;
  }
  /**
                 * Fifths.
                 */
  [class~="extralarge-and-up-1/5"],
  [class~="extralarge-and-up-2/10"] {
    width: 20% !important;
  }
  [class~="extralarge-and-up-2/5"],
  [class~="extralarge-and-up-4/10"] {
    width: 40% !important;
  }
  [class~="extralarge-and-up-3/5"],
  [class~="extralarge-and-up-6/10"] {
    width: 60% !important;
  }
  [class~="extralarge-and-up-4/5"],
  [class~="extralarge-and-up-8/10"] {
    width: 80% !important;
  }
  /**
                 * Sixths.
                 */
  [class~="extralarge-and-up-1/6"],
  [class~="extralarge-and-up-2/12"] {
    width: 16.6666666% !important;
  }
  [class~="extralarge-and-up-5/6"],
  [class~="extralarge-and-up-10/12"] {
    width: 83.3333333% !important;
  }
  /**
                 * Eighths.
                 */
  [class~="extralarge-and-up-1/8"] {
    width: 12.5% !important;
  }
  [class~="extralarge-and-up-3/8"] {
    width: 37.5% !important;
  }
  [class~="extralarge-and-up-5/8"] {
    width: 62.5% !important;
  }
  [class~="extralarge-and-up-7/8"] {
    width: 87.5% !important;
  }
  /**
                 * Ninths.
                 */
  [class~="extralarge-and-up-1/9"] {
    width: 11.1111111% !important;
  }
  [class~="extralarge-and-up-2/9"] {
    width: 22.2222222% !important;
  }
  [class~="extralarge-and-up-4/9"] {
    width: 44.4444444% !important;
  }
  [class~="extralarge-and-up-5/9"] {
    width: 55.5555555% !important;
  }
  [class~="extralarge-and-up-7/9"] {
    width: 77.7777777% !important;
  }
  [class~="extralarge-and-up-8/9"] {
    width: 88.8888888% !important;
  }
  /**
                 * Tenths.
                 */
  [class~="extralarge-and-up-1/10"] {
    width: 10% !important;
  }
  [class~="extralarge-and-up-3/10"] {
    width: 30% !important;
  }
  [class~="extralarge-and-up-7/10"] {
    width: 70% !important;
  }
  [class~="extralarge-and-up-9/10"] {
    width: 90% !important;
  }
  /**
                 * Twelfths.
                 */
  [class~="extralarge-and-up-1/12"] {
    width: 8.3333333% !important;
  }
  [class~="extralarge-and-up-5/12"] {
    width: 41.6666666% !important;
  }
  [class~="extralarge-and-up-7/12"] {
    width: 58.3333333% !important;
  }
  [class~="extralarge-and-up-11/12"] {
    width: 91.6666666% !important;
  }
}

@media screen and (min-width: 1500px) {
  /**
                 * Whole.
                 */
  [class~="superlarge-and-up-1/1"] {
    width: 100% !important;
  }
  /**
                 * Halves.
                 */
  [class~="superlarge-and-up-1/2"],
  [class~="superlarge-and-up-2/4"],
  [class~="superlarge-and-up-3/6"],
  [class~="superlarge-and-up-4/8"],
  [class~="superlarge-and-up-5/10"],
  [class~="superlarge-and-up-6/12"] {
    width: 50% !important;
  }
  /**
                 * Thirds.
                 */
  [class~="superlarge-and-up-1/3"],
  [class~="superlarge-and-up-2/6"],
  [class~="superlarge-and-up-3/9"],
  [class~="superlarge-and-up-4/12"] {
    width: 33.3333333% !important;
  }
  [class~="superlarge-and-up-2/3"],
  [class~="superlarge-and-up-4/6"],
  [class~="superlarge-and-up-6/9"],
  [class~="superlarge-and-up-8/12"] {
    width: 66.6666666% !important;
  }
  /**
                 * Quarters.
                 */
  [class~="superlarge-and-up-1/4"],
  [class~="superlarge-and-up-2/8"],
  [class~="superlarge-and-up-3/12"] {
    width: 25% !important;
  }
  [class~="superlarge-and-up-3/4"],
  [class~="superlarge-and-up-6/8"],
  [class~="superlarge-and-up-9/12"] {
    width: 75% !important;
  }
  /**
                 * Fifths.
                 */
  [class~="superlarge-and-up-1/5"],
  [class~="superlarge-and-up-2/10"] {
    width: 20% !important;
  }
  [class~="superlarge-and-up-2/5"],
  [class~="superlarge-and-up-4/10"] {
    width: 40% !important;
  }
  [class~="superlarge-and-up-3/5"],
  [class~="superlarge-and-up-6/10"] {
    width: 60% !important;
  }
  [class~="superlarge-and-up-4/5"],
  [class~="superlarge-and-up-8/10"] {
    width: 80% !important;
  }
  /**
                 * Sixths.
                 */
  [class~="superlarge-and-up-1/6"],
  [class~="superlarge-and-up-2/12"] {
    width: 16.6666666% !important;
  }
  [class~="superlarge-and-up-5/6"],
  [class~="superlarge-and-up-10/12"] {
    width: 83.3333333% !important;
  }
  /**
                 * Eighths.
                 */
  [class~="superlarge-and-up-1/8"] {
    width: 12.5% !important;
  }
  [class~="superlarge-and-up-3/8"] {
    width: 37.5% !important;
  }
  [class~="superlarge-and-up-5/8"] {
    width: 62.5% !important;
  }
  [class~="superlarge-and-up-7/8"] {
    width: 87.5% !important;
  }
  /**
                 * Ninths.
                 */
  [class~="superlarge-and-up-1/9"] {
    width: 11.1111111% !important;
  }
  [class~="superlarge-and-up-2/9"] {
    width: 22.2222222% !important;
  }
  [class~="superlarge-and-up-4/9"] {
    width: 44.4444444% !important;
  }
  [class~="superlarge-and-up-5/9"] {
    width: 55.5555555% !important;
  }
  [class~="superlarge-and-up-7/9"] {
    width: 77.7777777% !important;
  }
  [class~="superlarge-and-up-8/9"] {
    width: 88.8888888% !important;
  }
  /**
                 * Tenths.
                 */
  [class~="superlarge-and-up-1/10"] {
    width: 10% !important;
  }
  [class~="superlarge-and-up-3/10"] {
    width: 30% !important;
  }
  [class~="superlarge-and-up-7/10"] {
    width: 70% !important;
  }
  [class~="superlarge-and-up-9/10"] {
    width: 90% !important;
  }
  /**
                 * Twelfths.
                 */
  [class~="superlarge-and-up-1/12"] {
    width: 8.3333333% !important;
  }
  [class~="superlarge-and-up-5/12"] {
    width: 41.6666666% !important;
  }
  [class~="superlarge-and-up-7/12"] {
    width: 58.3333333% !important;
  }
  [class~="superlarge-and-up-11/12"] {
    width: 91.6666666% !important;
  }
}

/*------------------------------------*    #CLEARFIX
\*------------------------------------*/
/**
 * Micro clearfix, as per: css-101.org/articles/clearfix/latest-new-clearfix-so-far.php
 * Extend the clearfix class with Sass to avoid the `.clearfix` class appearing
 * over and over in your markup.
 */
.clearfix:after,
.media:after,
.box:after {
  content: "";
  display: table;
  clear: both;
}

/* --------------------------------------------------------------------------------------
+
+ HELPER CLASSES
+
-------------------------------------------------------------------------------------- */
.hidden {
  display: none !important;
}

.visuallyhidden {
  position: absolute;
  left: -999em;
}

.invisible {
  visibility: hidden !important;
}

.no-transition,
.no-transition * {
  transition: none !important;
}

.amp {
  font-family: Baskerville, Palatino, "Palatino Linotype", "Book Antiqua", serif;
  font-size: 1.4em;
  font-style: italic;
  font-weight: normal;
}

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

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

.align-top {
  vertical-align: top !important;
}

.align-middle {
  vertical-align: middle !important;
}

.align-bottom {
  vertical-align: bottom !important;
}

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

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

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

/* --------------------------------------------------------------------------------------
+
+ TYPE
+
-------------------------------------------------------------------------------------- */
.type-light {
  font-weight: 300 !important;
}

.type-normal {
  font-weight: 400 !important;
}

.type-semibold {
  font-weight: 600 !important;
}

.type-bold {
  font-weight: 700 !important;
}

.type-extrabold {
  font-weight: 800 !important;
}

.type-uppercase {
  text-transform: uppercase !important;
}

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

.type-capitalize {
  text-transform: capitalize !important;
}

.type-no-transfrom {
  text-transform: none !important;
}

/*------------------------------------*    #TYPE
\*------------------------------------*/
/**
 * TYPE SIZES
 */
.type-extra-tiny {
  font-size: 8px !important;
}

.type-extra-small {
  font-size: 10px !important;
}

.type-tiny {
  font-size: 12px !important;
}

.type-small {
  font-size: 14px !important;
}

.type-default {
  font-size: 16px !important;
}

.type-large {
  font-size: 20px !important;
}

.type-huge {
  font-size: 22px !important;
}

.type-extrahuge {
  font-size: 24px !important;
}

.type-x-huge {
  font-size: 32px !important;
}

.type-super-huge {
  font-size: 212px !important;
}

/*------------------------------------*    #GENERIC
\*------------------------------------*/
.shadow {
  box-shadow: 0 1px 2px rgba(1, 1, 1, 0.15);
}

.color-gray {
  color: #ced6e0;
}

.color-black {
  color: #171d28;
}

.montserrat {
  font-family: "Montserrat", sans-serif;
}

.relative {
  position: relative;
}

.list-reset {
  margin: 0 !important;
  list-style-type: none !important;
}

.list-reset li {
  margin: 0 !important;
  padding: 0 !important;
}

.list-reset li:before {
  content: '';
  display: none !important;
}

/*------------------------------------*    #GENERIC-RESPONSIVE
\*------------------------------------*/
/**
 * Generate custom classes for diferent screen sizes
 */
@media screen and (min-width: 481px) and (max-width: 768px) {
  /*
         * Generic responsive classes for text alignment
         */
  .text-left-medium {
    text-align: left !important;
  }
  .text-center-medium {
    text-align: center !important;
  }
  .text-right-medium {
    text-align: right !important;
  }
  .none-medium {
    display: none !important;
  }
  .float-none-medium {
    float: none !important;
  }
  .float-left-medium {
    float: left !important;
  }
  .float-right-medium {
    float: right !important;
  }
}

@media screen and (min-width: 481px) {
  /*
         * Generic responsive classes for text alignment
         */
  .text-left-medium-and-up {
    text-align: left !important;
  }
  .text-center-medium-and-up {
    text-align: center !important;
  }
  .text-right-medium-and-up {
    text-align: right !important;
  }
  .none-medium-and-up {
    display: none !important;
  }
  .float-none-medium-and-up {
    float: none !important;
  }
  .float-left-medium-and-up {
    float: left !important;
  }
  .float-right-medium-and-up {
    float: right !important;
  }
}

@media screen and (min-width: 769px) and (max-width: 1024px) {
  /*
         * Generic responsive classes for text alignment
         */
  .text-left-large {
    text-align: left !important;
  }
  .text-center-large {
    text-align: center !important;
  }
  .text-right-large {
    text-align: right !important;
  }
  .none-large {
    display: none !important;
  }
  .float-none-large {
    float: none !important;
  }
  .float-left-large {
    float: left !important;
  }
  .float-right-large {
    float: right !important;
  }
}

@media screen and (min-width: 769px) {
  /*
         * Generic responsive classes for text alignment
         */
  .text-left-large-and-up {
    text-align: left !important;
  }
  .text-center-large-and-up {
    text-align: center !important;
  }
  .text-right-large-and-up {
    text-align: right !important;
  }
  .none-large-and-up {
    display: none !important;
  }
  .float-none-large-and-up {
    float: none !important;
  }
  .float-left-large-and-up {
    float: left !important;
  }
  .float-right-large-and-up {
    float: right !important;
  }
}

@media screen and (min-width: 1025px) and (max-width: 1499px) {
  /*
         * Generic responsive classes for text alignment
         */
  .text-left-extralarge {
    text-align: left !important;
  }
  .text-center-extralarge {
    text-align: center !important;
  }
  .text-right-extralarge {
    text-align: right !important;
  }
  .none-extralarge {
    display: none !important;
  }
  .float-none-extralarge {
    float: none !important;
  }
  .float-left-extralarge {
    float: left !important;
  }
  .float-right-extralarge {
    float: right !important;
  }
}

@media screen and (min-width: 1025px) {
  /*
         * Generic responsive classes for text alignment
         */
  .text-left-extralarge-and-up {
    text-align: left !important;
  }
  .text-center-extralarge-and-up {
    text-align: center !important;
  }
  .text-right-extralarge-and-up {
    text-align: right !important;
  }
  .none-extralarge-and-up {
    display: none !important;
  }
  .float-none-extralarge-and-up {
    float: none !important;
  }
  .float-left-extralarge-and-up {
    float: left !important;
  }
  .float-right-extralarge-and-up {
    float: right !important;
  }
}

@media screen and (min-width: 1500px) {
  /*
         * Generic responsive classes for text alignment
         */
  .text-left-superlarge-and-up {
    text-align: left !important;
  }
  .text-center-superlarge-and-up {
    text-align: center !important;
  }
  .text-right-superlarge-and-up {
    text-align: right !important;
  }
  .none-superlarge-and-up {
    display: none !important;
  }
  .float-none-superlarge-and-up {
    float: none !important;
  }
  .float-left-superlarge-and-up {
    float: left !important;
  }
  .float-right-superlarge-and-up {
    float: right !important;
  }
}

/*------------------------------------*    #PRINT
\*------------------------------------*/
/**
 * Very crude, reset-like styles taken from the HTML5 Boilerplate:
 * https://github.com/h5bp/html5-boilerplate/blob/3c3c5e64604209a4d63e1e4c48dd245d45fadfd9/css/main.css#L200-L234
 */
@media print {
  *,
  *:before,
  *:after {
    background: transparent !important;
    color: #000 !important;
    /* Black prints faster: h5bp.com/s */
    box-shadow: none !important;
    text-shadow: none !important;
  }
  a,
  a:visited {
    text-decoration: underline;
  }
  a[href]:after {
    content: " (" attr(href) ")";
  }
  abbr[title]:after {
    content: " (" attr(title) ")";
  }
  /**
     * Don’t show links that are fragment identifiers, or use the `javascript:`
     * pseudo protocol.
     */
  a[href^="#"]:after,
  a[href^="javascript:"]:after {
    content: "";
  }
}