@charset "UTF-8";
/*------------------------------------*\
    #Project styles
\*------------------------------------*/
/*------------------------------------*\
    #BASE COLORS
\*------------------------------------*/
/*------------------------------------*\
    #NAVIGATION MENU COLORS
\*------------------------------------*/
/*------------------------------------*\
    #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
\*------------------------------------*/
/* --------------------------------------------------------------------------------------
+
+ VIEWPORT
+
-------------------------------------------------------------------------------------- */
@import url(http://fonts.googleapis.com/css?family=Lato:300,700);
@-webkit-viewport {
  width: device-width;
}
@-moz-viewport {
  width: device-width;
}
@-o-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: 14px;
  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 {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

*, *:before, *:after {
  -webkit-box-sizing: inherit;
  -moz-box-sizing: inherit;
  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: 20px;
  margin-bottom: 1.42857rem;
}

/**
 * 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: 40px;
  margin-left: 2.85714rem;
}

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

/*------------------------------------*\
    #FONTS
\*------------------------------------*/
/*
@font-face {
  font-family: 'itcavantgardestd-bold';
  src: url('fonts/itcavantgardestd-bold.eot?#iefix') format('embedded-opentype'),  url('fonts/itcavantgardestd-bold.otf')  format('opentype'),
	     url('fonts/itcavantgardestd-bold.woff') format('woff'), url('fonts/itcavantgardestd-bold.ttf')  format('truetype'), url('fonts/itcavantgardestd-bold.svg#itcavantgardestd-bold') format('svg');
  font-weight: normal;
  font-style: normal;
}*/
@font-face {
  font-family: Arial;
}
/*------------------------------------*\
    #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.875em;
  /* [1] */
  line-height: 1.42857;
  /* [1] */
  background-color: #fff;
  color: #333742;
  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: Arial, sans-serif;
  color: #333742;
  font-size: 12px;
  background: #F3F3F3 url("./images/colour-confetti_BG.jpg") no-repeat 50% 0;
  /*background-repeat: repeat;
  background-position: 0 0;*/
  line-height: 1.6;
}

body {
  padding-top: 38px;
}

main {
  display: block;
}

.main-content > .container {
  background-color: white;
}

#wpadminbar {
  position: fixed !important;
}

/*------------------------------------*\
    #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,
.typography h1,
.typography .alpha {
  font-size: 36px;
  font-size: 2.57143rem;
  line-height: 1.11111;
}

h2,
.beta,
.typography h2,
.typography .beta {
  font-size: 30px;
  font-size: 2.14286rem;
  line-height: 1.33333;
}

h3,
.gamma,
.typography h3,
.typography .gamma {
  font-size: 24px;
  font-size: 1.71429rem;
  line-height: 1.66667;
}

h4,
.delta,
.typography h4,
.typography .delta {
  font-size: 20px;
  font-size: 1.42857rem;
  line-height: 1;
}

h5,
.epsilon,
.typography h5,
.typography .epsilon {
  font-size: 16px;
  font-size: 1.14286rem;
  line-height: 1.25;
}

h6,
.zeta,
.typography h6,
.typography .zeta {
  font-size: 14px;
  font-size: 1rem;
  line-height: 1.42857;
}

/*------------------------------------*\
    #HEADINGS
\*------------------------------------*/
h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6 {
  font-family: Arial, sans-serif;
  color: #075384;
}
h1 > a,
h2 > a,
h3 > a,
h4 > a,
h5 > a,
h6 > a,
.h1 > a,
.h2 > a,
.h3 > a,
.h4 > a,
.h5 > a,
.h6 > a {
  color: inherit;
}

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

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

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

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

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

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

/**
 * Typography.
 */
.typography h1,
.typography .alpha {
  line-height: 1.1;
  margin-bottom: .25em;
}
.typography h2,
.typography .beta {
  line-height: 1.2;
  margin-bottom: .25em;
}
.typography img:not(:last-child),
.typography p:not(:last-child),
.typography ul:not(:last-child),
.typography ol:not(:last-child),
.typography pre:not(:last-child),
.typography blockquote:not(:last-child),
.typography .embedded:not(:last-child) {
  margin-bottom: 20px;
}
.typography i,
.typography em {
  font-style: italic;
}
.typography b,
.typography strong {
  font-weight: 700;
}
.typography ol {
  list-style: decimal;
}
.typography ul {
  list-style-type: none;
}
.typography ul li {
  position: relative;
  padding-left: 54px;
}
.typography ul li:before {
  content: '';
  position: absolute;
  left: 40px;
  top: 5px;
  display: block;
  border-radius: 50%;
  width: 6px;
  height: 6px;
  background-color: #7f3f98;
}
.typography ul ul {
  padding-top: 10px;
  padding-bottom: 10px;
}
.typography ul li {
  padding-left: 14px;
}
.typography ul li:before {
  left: 0;
}

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

/* --------------------------------------------------------------------------------------
+
+ LINK
+
-------------------------------------------------------------------------------------- */
a {
  color: blue;
  text-decoration: none;
}
a:hover {
  text-decoration: underline;
}

/*------------------------------------*\
    #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: 18.2px;
  font-size: 1.3rem;
  line-height: 1.0989;
}

/*------------------------------------*\
    #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 {
  -moz-transition: all 0.2s ease;
  -o-transition: all 0.2s ease;
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease;
  -moz-user-select: -moz-none;
  -ms-user-select: none;
  -webkit-user-select: none;
  user-select: none;
  /* http://compass-style.org/reference/compass/css3/user_interface/ */
  background: none !important;
  border: none !important;
  display: inline-block !important;
  line-height: normal !important;
  margin: 0 !important;
  /* remove margin for some browsers */
  padding: 0 !important;
  /* remove padding in Firefox */
  text-decoration: none !important;
  text-shadow: none !important;
  vertical-align: middle !important;
  white-space: nowrap !important;
}
.btn:hover {
  cursor: pointer !important;
  text-decoration: none !important;
}

.btn--full {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  display: block !important;
  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: 1px;
  /* IE 9, 10, 11 FIX */
  text-align: justify;
}
.justifize:after {
  content: "";
  display: inline-block;
  width: 100%;
}

.justifize__box {
  font-size: 14px;
  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: 20px;
}
.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: 5px;
}
.flag--tiny.flag--rev > .flag__img {
  padding-right: 0;
  padding-left: 5px;
}

/**
 * Small flags.
 */
.flag--small {
  /**
   * Small reversed flags.
   */
}
.flag--small > .flag__img {
  padding-right: 10px;
}
.flag--small.flag--rev > .flag__img {
  padding-right: 0;
  padding-left: 10px;
}

/**
 * Large flags.
 */
.flag--large {
  /**
   * Large reversed flags.
   */
}
.flag--large > .flag__img {
  padding-right: 40px;
}
.flag--large.flag--rev > .flag__img {
  padding-right: 0;
  padding-left: 40px;
}

/**
 * Huge flags.
 */
.flag--huge {
  /**
   * Huge reversed flags.
   */
}
.flag--huge > .flag__img {
  padding-right: 80px;
}
.flag--huge.flag--rev > .flag__img {
  padding-right: 0;
  padding-left: 80px;
}

/**
 * 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: 20px;
  /* [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: 20px;
  }
  .flag--responsive.flag--tiny > .flag__img {
    padding-right: 0;
    padding-left: 0;
    margin-bottom: 5px;
  }
  .flag--responsive.flag--small > .flag__img {
    padding-right: 0;
    padding-left: 0;
    margin-bottom: 10px;
  }
  .flag--responsive.flag--large > .flag__img {
    padding-right: 0;
    padding-left: 0;
    margin-bottom: 40px;
  }
  .flag--responsive.flag--huge > .flag__img {
    padding-right: 0;
    padding-left: 0;
    margin-bottom: 80px;
  }
}
/*------------------------------------*\
    #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: 20px;
}
.media__img > img {
  display: block;
}

.media__body {
  overflow: hidden;
  display: block;
}
.media__body,
.media__body > :last-child {
  margin-bottom: 0;
}

/*------------------------------------*\
    #CONTAINER
\*------------------------------------*/
.container {
  margin: 0 auto;
  max-width: 1120px;
  padding-left: 40px;
  padding-right: 40px;
}
@media screen and (max-width: 480px) {
  .container {
    max-width: 1070px;
    padding-left: 15px;
    padding-right: 15px;
  }
}

/*------------------------------------*\
    #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 {
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -webkit-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-13x13 {
  width: 13px;
  height: 13px;
}

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

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

.icon-19x18 {
  width: 19px;
  height: 18px;
}

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

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

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

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

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

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

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

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

.icon-12x18 {
  width: 12px;
  height: 18px;
}

.icon-18x12 {
  width: 18px;
  height: 12px;
}

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

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

.icon-9x18 {
  width: 9px;
  height: 18px;
}

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

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

.icon-25x25 {
  width: 25px;
  height: 25px;
}

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

/*------------------------------------*\
    #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: 20px;
}
.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: -20px;
}

/**
 * 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: 20px;
  /* [2] */
  vertical-align: top;
  /* [3] */
  width: 100%;
  /* [4] */
}

/**
 * Layouts with tiny gutters.
 */
.layout--tiny {
  margin-left: -5px;
}
.layout--tiny > .layout__item {
  padding-left: 5px;
}

/**
 * Layouts with small gutters.
 */
.layout--small {
  margin-left: -10px;
}
.layout--small > .layout__item {
  padding-left: 10px;
}

/**
 * Layouts with large gutters.
 */
.layout--large {
  margin-left: -40px;
}
.layout--large > .layout__item {
  padding-left: 40px;
}

/**
 * Layouts with huge gutters.
 */
.layout--huge {
  margin-left: -80px;
}
.layout--huge > .layout__item {
  padding-left: 80px;
}

/**
 * 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: 14px;
  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: -20px;
  /* [2] */
}

.layout__item {
  margin-bottom: 20px;
}

/**
 * Layouts with tiny gutters.
 */
.layout--tiny:after {
  margin-top: -5px;
}
.layout--tiny > .layout__item {
  margin-bottom: 5px;
}

/**
 * Layouts with small gutters.
 */
.layout--small:after {
  margin-top: -10px;
}
.layout--small > .layout__item {
  margin-bottom: 10px;
}

/**
 * Layouts with large gutters.
 */
.layout--large:after {
  margin-top: -40px;
}
.layout--large > .layout__item {
  margin-bottom: 40px;
}

/**
 * Layouts with huge gutters.
 */
.layout--huge:after {
  margin-top: -80px;
}
.layout--huge > .layout__item {
  margin-bottom: 80px;
}

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

/* ===========================================================
 *
 *  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 * {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  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 */
.sod_select:before,
.sod_select:after {
  content: "\25B2";
  position: absolute;
  right: 10px;
  top: 12px;
  font-size: 7px;
}

/* Down arrow */
.sod_select:after {
  content: "\25BC";
  top: auto;
  bottom: 12px;
}

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

.sod_select.focus {
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
}

/* 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 */
.sod_select .sod_option.selected:before {
  content: "";
  position: absolute;
  right: 10px;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  display: inline-block;
  color: #808080;
  height: 9px;
  width: 10px;
  background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAxNy4xLjAsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+DQo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMTAgOSIgZW5hYmxlLWJhY2tncm91bmQ9Im5ldyAwIDAgMTAgOSIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+DQo8Zz4NCgk8cGF0aCBmaWxsPSIjRDlEOUQ4IiBkPSJNNCw2LjdDMy42LDYuMywzLjUsNi4xLDMuMSw1LjdDMi42LDUuMiwyLDQuNiwxLjUsNC4xYy0wLjgtMC44LTIsMC40LTEuMiwxLjJjMC45LDAuOSwxLjksMS45LDIuOCwyLjgNCgkJYzAuNywwLjcsMS4zLDEsMiwwQzYuNyw2LDguMywzLjcsOS44LDEuNUMxMC41LDAuNSw5LTAuMyw4LjMsMC42bDAsMEM2LjcsMi45LDUuNyw0LjQsNCw2LjciLz4NCjwvZz4NCjwvc3ZnPg0K);
}

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

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

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

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

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

@-webkit-keyframes fadeOut {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
@keyframes fadeOut {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
/* 
 * 	Owl Carousel - Auto Height Plugin
 */
.owl-height {
  -webkit-transition: height 500ms ease-in-out;
  -moz-transition: height 500ms ease-in-out;
  -ms-transition: height 500ms ease-in-out;
  -o-transition: height 500ms ease-in-out;
  transition: height 500ms ease-in-out;
}

/* 
 *  Core Owl Carousel CSS File
 */
.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;
}

.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-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%;
  -webkit-transform-style: preserve-3d;
}

.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;
  -khtml-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 {
  display: none;
}

.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: -o-grab;
  cursor: -ms-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 - Lazy Load Plugin
 */
.owl-carousel .owl-item .owl-lazy {
  opacity: 0;
  -webkit-transition: opacity 400ms ease;
  -moz-transition: opacity 400ms ease;
  -ms-transition: opacity 400ms ease;
  -o-transition: opacity 400ms ease;
  transition: opacity 400ms ease;
}

.owl-carousel .owl-item img {
  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;
  -webkit-transition: scale 100ms ease;
  -moz-transition: scale 100ms ease;
  -ms-transition: scale 100ms ease;
  -o-transition: scale 100ms ease;
  transition: scale 100ms ease;
}

.owl-carousel .owl-video-play-icon:hover {
  -webkit-transition: scale(1.3, 1.3);
  -moz-transition: scale(1.3, 1.3);
  -ms-transition: scale(1.3, 1.3);
  -o-transition: scale(1.3, 1.3);
  transition: 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;
  -webkit-background-size: contain;
  -moz-background-size: contain;
  -o-background-size: contain;
  background-size: contain;
  -webkit-transition: opacity 400ms ease;
  -moz-transition: opacity 400ms ease;
  -ms-transition: opacity 400ms ease;
  -o-transition: opacity 400ms ease;
  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 - http://opensource.org/licenses/MIT

Copyright (c) 2015 Daniel Eden
*/
.animated {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}

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

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

.animated.bounceIn, .animated.bounceOut, .animated.flipOutX, .animated.flipOutY {
  -webkit-animation-duration: .75s;
  animation-duration: .75s;
}

@-webkit-keyframes bounce {
  100%,20%,53%,80%,from {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  40%,43% {
    -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    -webkit-transform: translate3d(0, -30px, 0);
    transform: translate3d(0, -30px, 0);
  }
  70% {
    -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    -webkit-transform: translate3d(0, -15px, 0);
    transform: translate3d(0, -15px, 0);
  }
  90% {
    -webkit-transform: translate3d(0, -4px, 0);
    transform: translate3d(0, -4px, 0);
  }
}
@keyframes bounce {
  100%,20%,53%,80%,from {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  40%,43% {
    -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    -webkit-transform: translate3d(0, -30px, 0);
    transform: translate3d(0, -30px, 0);
  }
  70% {
    -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    -webkit-transform: translate3d(0, -15px, 0);
    transform: translate3d(0, -15px, 0);
  }
  90% {
    -webkit-transform: translate3d(0, -4px, 0);
    transform: translate3d(0, -4px, 0);
  }
}
.bounce {
  -webkit-animation-name: bounce;
  animation-name: bounce;
  -webkit-transform-origin: center bottom;
  transform-origin: center bottom;
}

@-webkit-keyframes flash {
  100%,50%,from {
    opacity: 1;
  }
  25%,75% {
    opacity: 0;
  }
}
@keyframes flash {
  100%,50%,from {
    opacity: 1;
  }
  25%,75% {
    opacity: 0;
  }
}
.flash {
  -webkit-animation-name: flash;
  animation-name: flash;
}

@-webkit-keyframes pulse {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
  50% {
    -webkit-transform: scale3d(1.05, 1.05, 1.05);
    transform: scale3d(1.05, 1.05, 1.05);
  }
  100% {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}
@keyframes pulse {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
  50% {
    -webkit-transform: scale3d(1.05, 1.05, 1.05);
    transform: scale3d(1.05, 1.05, 1.05);
  }
  100% {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}
.pulse {
  -webkit-animation-name: pulse;
  animation-name: pulse;
}

@-webkit-keyframes rubberBand {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
  30% {
    -webkit-transform: scale3d(1.25, 0.75, 1);
    transform: scale3d(1.25, 0.75, 1);
  }
  40% {
    -webkit-transform: scale3d(0.75, 1.25, 1);
    transform: scale3d(0.75, 1.25, 1);
  }
  50% {
    -webkit-transform: scale3d(1.15, 0.85, 1);
    transform: scale3d(1.15, 0.85, 1);
  }
  65% {
    -webkit-transform: scale3d(0.95, 1.05, 1);
    transform: scale3d(0.95, 1.05, 1);
  }
  75% {
    -webkit-transform: scale3d(1.05, 0.95, 1);
    transform: scale3d(1.05, 0.95, 1);
  }
  100% {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}
@keyframes rubberBand {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
  30% {
    -webkit-transform: scale3d(1.25, 0.75, 1);
    transform: scale3d(1.25, 0.75, 1);
  }
  40% {
    -webkit-transform: scale3d(0.75, 1.25, 1);
    transform: scale3d(0.75, 1.25, 1);
  }
  50% {
    -webkit-transform: scale3d(1.15, 0.85, 1);
    transform: scale3d(1.15, 0.85, 1);
  }
  65% {
    -webkit-transform: scale3d(0.95, 1.05, 1);
    transform: scale3d(0.95, 1.05, 1);
  }
  75% {
    -webkit-transform: scale3d(1.05, 0.95, 1);
    transform: scale3d(1.05, 0.95, 1);
  }
  100% {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}
.rubberBand {
  -webkit-animation-name: rubberBand;
  animation-name: rubberBand;
}

@-webkit-keyframes shake {
  100%,from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  10%,30%,50%,70%,90% {
    -webkit-transform: translate3d(-10px, 0, 0);
    transform: translate3d(-10px, 0, 0);
  }
  20%,40%,60%,80% {
    -webkit-transform: translate3d(10px, 0, 0);
    transform: translate3d(10px, 0, 0);
  }
}
@keyframes shake {
  100%,from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  10%,30%,50%,70%,90% {
    -webkit-transform: translate3d(-10px, 0, 0);
    transform: translate3d(-10px, 0, 0);
  }
  20%,40%,60%,80% {
    -webkit-transform: translate3d(10px, 0, 0);
    transform: translate3d(10px, 0, 0);
  }
}
.shake {
  -webkit-animation-name: shake;
  animation-name: shake;
}

@-webkit-keyframes swing {
  20% {
    -webkit-transform: rotate3d(0, 0, 1, 15deg);
    transform: rotate3d(0, 0, 1, 15deg);
  }
  40% {
    -webkit-transform: rotate3d(0, 0, 1, -10deg);
    transform: rotate3d(0, 0, 1, -10deg);
  }
  60% {
    -webkit-transform: rotate3d(0, 0, 1, 5deg);
    transform: rotate3d(0, 0, 1, 5deg);
  }
  80% {
    -webkit-transform: rotate3d(0, 0, 1, -5deg);
    transform: rotate3d(0, 0, 1, -5deg);
  }
  100% {
    -webkit-transform: rotate3d(0, 0, 1, 0deg);
    transform: rotate3d(0, 0, 1, 0deg);
  }
}
@keyframes swing {
  20% {
    -webkit-transform: rotate3d(0, 0, 1, 15deg);
    transform: rotate3d(0, 0, 1, 15deg);
  }
  40% {
    -webkit-transform: rotate3d(0, 0, 1, -10deg);
    transform: rotate3d(0, 0, 1, -10deg);
  }
  60% {
    -webkit-transform: rotate3d(0, 0, 1, 5deg);
    transform: rotate3d(0, 0, 1, 5deg);
  }
  80% {
    -webkit-transform: rotate3d(0, 0, 1, -5deg);
    transform: rotate3d(0, 0, 1, -5deg);
  }
  100% {
    -webkit-transform: rotate3d(0, 0, 1, 0deg);
    transform: rotate3d(0, 0, 1, 0deg);
  }
}
.swing {
  -webkit-transform-origin: top center;
  transform-origin: top center;
  -webkit-animation-name: swing;
  animation-name: swing;
}

@-webkit-keyframes tada {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
  10%,20% {
    -webkit-transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
    transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
  }
  30%,50%,70%,90% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
    transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
  }
  40%,60%,80% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
    transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
  }
  100% {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}
@keyframes tada {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
  10%,20% {
    -webkit-transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
    transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
  }
  30%,50%,70%,90% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
    transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
  }
  40%,60%,80% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
    transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
  }
  100% {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}
.tada {
  -webkit-animation-name: tada;
  animation-name: tada;
}

@-webkit-keyframes wobble {
  from {
    -webkit-transform: none;
    transform: none;
  }
  15% {
    -webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
    transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
  }
  30% {
    -webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
    transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
  }
  45% {
    -webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
    transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
  }
  60% {
    -webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
    transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
  }
  75% {
    -webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
    transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
  }
  100% {
    -webkit-transform: none;
    transform: none;
  }
}
@keyframes wobble {
  from {
    -webkit-transform: none;
    transform: none;
  }
  15% {
    -webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
    transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
  }
  30% {
    -webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
    transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
  }
  45% {
    -webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
    transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
  }
  60% {
    -webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
    transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
  }
  75% {
    -webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
    transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
  }
  100% {
    -webkit-transform: none;
    transform: none;
  }
}
.wobble {
  -webkit-animation-name: wobble;
  animation-name: wobble;
}

@-webkit-keyframes jello {
  100%,11.1%,from {
    -webkit-transform: none;
    transform: none;
  }
  22.2% {
    -webkit-transform: skewX(-12.5deg) skewY(-12.5deg);
    transform: skewX(-12.5deg) skewY(-12.5deg);
  }
  33.3% {
    -webkit-transform: skewX(6.25deg) skewY(6.25deg);
    transform: skewX(6.25deg) skewY(6.25deg);
  }
  44.4% {
    -webkit-transform: skewX(-3.125deg) skewY(-3.125deg);
    transform: skewX(-3.125deg) skewY(-3.125deg);
  }
  55.5% {
    -webkit-transform: skewX(1.5625deg) skewY(1.5625deg);
    transform: skewX(1.5625deg) skewY(1.5625deg);
  }
  66.6% {
    -webkit-transform: skewX(-0.78125deg) skewY(-0.78125deg);
    transform: skewX(-0.78125deg) skewY(-0.78125deg);
  }
  77.7% {
    -webkit-transform: skewX(0.39063deg) skewY(0.39063deg);
    transform: skewX(0.39063deg) skewY(0.39063deg);
  }
  88.8% {
    -webkit-transform: skewX(-0.19531deg) skewY(-0.19531deg);
    transform: skewX(-0.19531deg) skewY(-0.19531deg);
  }
}
@keyframes jello {
  100%,11.1%,from {
    -webkit-transform: none;
    transform: none;
  }
  22.2% {
    -webkit-transform: skewX(-12.5deg) skewY(-12.5deg);
    transform: skewX(-12.5deg) skewY(-12.5deg);
  }
  33.3% {
    -webkit-transform: skewX(6.25deg) skewY(6.25deg);
    transform: skewX(6.25deg) skewY(6.25deg);
  }
  44.4% {
    -webkit-transform: skewX(-3.125deg) skewY(-3.125deg);
    transform: skewX(-3.125deg) skewY(-3.125deg);
  }
  55.5% {
    -webkit-transform: skewX(1.5625deg) skewY(1.5625deg);
    transform: skewX(1.5625deg) skewY(1.5625deg);
  }
  66.6% {
    -webkit-transform: skewX(-0.78125deg) skewY(-0.78125deg);
    transform: skewX(-0.78125deg) skewY(-0.78125deg);
  }
  77.7% {
    -webkit-transform: skewX(0.39063deg) skewY(0.39063deg);
    transform: skewX(0.39063deg) skewY(0.39063deg);
  }
  88.8% {
    -webkit-transform: skewX(-0.19531deg) skewY(-0.19531deg);
    transform: skewX(-0.19531deg) skewY(-0.19531deg);
  }
}
.jello {
  -webkit-animation-name: jello;
  animation-name: jello;
  -webkit-transform-origin: center;
  transform-origin: center;
}

@-webkit-keyframes bounceIn {
  100%,20%,40%,60%,80%,from {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  0% {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }
  20% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
    transform: scale3d(1.1, 1.1, 1.1);
  }
  40% {
    -webkit-transform: scale3d(0.9, 0.9, 0.9);
    transform: scale3d(0.9, 0.9, 0.9);
  }
  60% {
    opacity: 1;
    -webkit-transform: scale3d(1.03, 1.03, 1.03);
    transform: scale3d(1.03, 1.03, 1.03);
  }
  80% {
    -webkit-transform: scale3d(0.97, 0.97, 0.97);
    transform: scale3d(0.97, 0.97, 0.97);
  }
  100% {
    opacity: 1;
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}
@keyframes bounceIn {
  100%,20%,40%,60%,80%,from {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  0% {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }
  20% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
    transform: scale3d(1.1, 1.1, 1.1);
  }
  40% {
    -webkit-transform: scale3d(0.9, 0.9, 0.9);
    transform: scale3d(0.9, 0.9, 0.9);
  }
  60% {
    opacity: 1;
    -webkit-transform: scale3d(1.03, 1.03, 1.03);
    transform: scale3d(1.03, 1.03, 1.03);
  }
  80% {
    -webkit-transform: scale3d(0.97, 0.97, 0.97);
    transform: scale3d(0.97, 0.97, 0.97);
  }
  100% {
    opacity: 1;
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}
.bounceIn {
  -webkit-animation-name: bounceIn;
  animation-name: bounceIn;
}

@-webkit-keyframes bounceInDown {
  100%,60%,75%,90%,from {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, -3000px, 0);
    transform: translate3d(0, -3000px, 0);
  }
  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, 25px, 0);
    transform: translate3d(0, 25px, 0);
  }
  75% {
    -webkit-transform: translate3d(0, -10px, 0);
    transform: translate3d(0, -10px, 0);
  }
  90% {
    -webkit-transform: translate3d(0, 5px, 0);
    transform: translate3d(0, 5px, 0);
  }
  100% {
    -webkit-transform: none;
    transform: none;
  }
}
@keyframes bounceInDown {
  100%,60%,75%,90%,from {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, -3000px, 0);
    transform: translate3d(0, -3000px, 0);
  }
  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, 25px, 0);
    transform: translate3d(0, 25px, 0);
  }
  75% {
    -webkit-transform: translate3d(0, -10px, 0);
    transform: translate3d(0, -10px, 0);
  }
  90% {
    -webkit-transform: translate3d(0, 5px, 0);
    transform: translate3d(0, 5px, 0);
  }
  100% {
    -webkit-transform: none;
    transform: none;
  }
}
.bounceInDown {
  -webkit-animation-name: bounceInDown;
  animation-name: bounceInDown;
}

@-webkit-keyframes bounceInLeft {
  100%,60%,75%,90%,from {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  0% {
    opacity: 0;
    -webkit-transform: translate3d(-3000px, 0, 0);
    transform: translate3d(-3000px, 0, 0);
  }
  60% {
    opacity: 1;
    -webkit-transform: translate3d(25px, 0, 0);
    transform: translate3d(25px, 0, 0);
  }
  75% {
    -webkit-transform: translate3d(-10px, 0, 0);
    transform: translate3d(-10px, 0, 0);
  }
  90% {
    -webkit-transform: translate3d(5px, 0, 0);
    transform: translate3d(5px, 0, 0);
  }
  100% {
    -webkit-transform: none;
    transform: none;
  }
}
@keyframes bounceInLeft {
  100%,60%,75%,90%,from {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  0% {
    opacity: 0;
    -webkit-transform: translate3d(-3000px, 0, 0);
    transform: translate3d(-3000px, 0, 0);
  }
  60% {
    opacity: 1;
    -webkit-transform: translate3d(25px, 0, 0);
    transform: translate3d(25px, 0, 0);
  }
  75% {
    -webkit-transform: translate3d(-10px, 0, 0);
    transform: translate3d(-10px, 0, 0);
  }
  90% {
    -webkit-transform: translate3d(5px, 0, 0);
    transform: translate3d(5px, 0, 0);
  }
  100% {
    -webkit-transform: none;
    transform: none;
  }
}
.bounceInLeft {
  -webkit-animation-name: bounceInLeft;
  animation-name: bounceInLeft;
}

@-webkit-keyframes bounceInRight {
  100%,60%,75%,90%,from {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  from {
    opacity: 0;
    -webkit-transform: translate3d(3000px, 0, 0);
    transform: translate3d(3000px, 0, 0);
  }
  60% {
    opacity: 1;
    -webkit-transform: translate3d(-25px, 0, 0);
    transform: translate3d(-25px, 0, 0);
  }
  75% {
    -webkit-transform: translate3d(10px, 0, 0);
    transform: translate3d(10px, 0, 0);
  }
  90% {
    -webkit-transform: translate3d(-5px, 0, 0);
    transform: translate3d(-5px, 0, 0);
  }
  100% {
    -webkit-transform: none;
    transform: none;
  }
}
@keyframes bounceInRight {
  100%,60%,75%,90%,from {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  from {
    opacity: 0;
    -webkit-transform: translate3d(3000px, 0, 0);
    transform: translate3d(3000px, 0, 0);
  }
  60% {
    opacity: 1;
    -webkit-transform: translate3d(-25px, 0, 0);
    transform: translate3d(-25px, 0, 0);
  }
  75% {
    -webkit-transform: translate3d(10px, 0, 0);
    transform: translate3d(10px, 0, 0);
  }
  90% {
    -webkit-transform: translate3d(-5px, 0, 0);
    transform: translate3d(-5px, 0, 0);
  }
  100% {
    -webkit-transform: none;
    transform: none;
  }
}
.bounceInRight {
  -webkit-animation-name: bounceInRight;
  animation-name: bounceInRight;
}

@-webkit-keyframes bounceInUp {
  100%,60%,75%,90%,from {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 3000px, 0);
    transform: translate3d(0, 3000px, 0);
  }
  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, -20px, 0);
    transform: translate3d(0, -20px, 0);
  }
  75% {
    -webkit-transform: translate3d(0, 10px, 0);
    transform: translate3d(0, 10px, 0);
  }
  90% {
    -webkit-transform: translate3d(0, -5px, 0);
    transform: translate3d(0, -5px, 0);
  }
  100% {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes bounceInUp {
  100%,60%,75%,90%,from {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 3000px, 0);
    transform: translate3d(0, 3000px, 0);
  }
  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, -20px, 0);
    transform: translate3d(0, -20px, 0);
  }
  75% {
    -webkit-transform: translate3d(0, 10px, 0);
    transform: translate3d(0, 10px, 0);
  }
  90% {
    -webkit-transform: translate3d(0, -5px, 0);
    transform: translate3d(0, -5px, 0);
  }
  100% {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
.bounceInUp {
  -webkit-animation-name: bounceInUp;
  animation-name: bounceInUp;
}

@-webkit-keyframes bounceOut {
  20% {
    -webkit-transform: scale3d(0.9, 0.9, 0.9);
    transform: scale3d(0.9, 0.9, 0.9);
  }
  50%,55% {
    opacity: 1;
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
    transform: scale3d(1.1, 1.1, 1.1);
  }
  100% {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }
}
@keyframes bounceOut {
  20% {
    -webkit-transform: scale3d(0.9, 0.9, 0.9);
    transform: scale3d(0.9, 0.9, 0.9);
  }
  50%,55% {
    opacity: 1;
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
    transform: scale3d(1.1, 1.1, 1.1);
  }
  100% {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }
}
.bounceOut {
  -webkit-animation-name: bounceOut;
  animation-name: bounceOut;
}

@-webkit-keyframes bounceOutDown {
  20% {
    -webkit-transform: translate3d(0, 10px, 0);
    transform: translate3d(0, 10px, 0);
  }
  40%,45% {
    opacity: 1;
    -webkit-transform: translate3d(0, -20px, 0);
    transform: translate3d(0, -20px, 0);
  }
  100% {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
    transform: translate3d(0, 2000px, 0);
  }
}
@keyframes bounceOutDown {
  20% {
    -webkit-transform: translate3d(0, 10px, 0);
    transform: translate3d(0, 10px, 0);
  }
  40%,45% {
    opacity: 1;
    -webkit-transform: translate3d(0, -20px, 0);
    transform: translate3d(0, -20px, 0);
  }
  100% {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
    transform: translate3d(0, 2000px, 0);
  }
}
.bounceOutDown {
  -webkit-animation-name: bounceOutDown;
  animation-name: bounceOutDown;
}

@-webkit-keyframes bounceOutLeft {
  20% {
    opacity: 1;
    -webkit-transform: translate3d(20px, 0, 0);
    transform: translate3d(20px, 0, 0);
  }
  100% {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
    transform: translate3d(-2000px, 0, 0);
  }
}
@keyframes bounceOutLeft {
  20% {
    opacity: 1;
    -webkit-transform: translate3d(20px, 0, 0);
    transform: translate3d(20px, 0, 0);
  }
  100% {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
    transform: translate3d(-2000px, 0, 0);
  }
}
.bounceOutLeft {
  -webkit-animation-name: bounceOutLeft;
  animation-name: bounceOutLeft;
}

@-webkit-keyframes bounceOutRight {
  20% {
    opacity: 1;
    -webkit-transform: translate3d(-20px, 0, 0);
    transform: translate3d(-20px, 0, 0);
  }
  100% {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
    transform: translate3d(2000px, 0, 0);
  }
}
@keyframes bounceOutRight {
  20% {
    opacity: 1;
    -webkit-transform: translate3d(-20px, 0, 0);
    transform: translate3d(-20px, 0, 0);
  }
  100% {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
    transform: translate3d(2000px, 0, 0);
  }
}
.bounceOutRight {
  -webkit-animation-name: bounceOutRight;
  animation-name: bounceOutRight;
}

@-webkit-keyframes bounceOutUp {
  20% {
    -webkit-transform: translate3d(0, -10px, 0);
    transform: translate3d(0, -10px, 0);
  }
  40%,45% {
    opacity: 1;
    -webkit-transform: translate3d(0, 20px, 0);
    transform: translate3d(0, 20px, 0);
  }
  100% {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
    transform: translate3d(0, -2000px, 0);
  }
}
@keyframes bounceOutUp {
  20% {
    -webkit-transform: translate3d(0, -10px, 0);
    transform: translate3d(0, -10px, 0);
  }
  40%,45% {
    opacity: 1;
    -webkit-transform: translate3d(0, 20px, 0);
    transform: translate3d(0, 20px, 0);
  }
  100% {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
    transform: translate3d(0, -2000px, 0);
  }
}
.bounceOutUp {
  -webkit-animation-name: bounceOutUp;
  animation-name: bounceOutUp;
}

@-webkit-keyframes fadeIn {
  from {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes fadeIn {
  from {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
.fadeIn {
  -webkit-animation-name: fadeIn;
  animation-name: fadeIn;
}

@-webkit-keyframes fadeInDown {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }
  100% {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}
@keyframes fadeInDown {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }
  100% {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}
.fadeInDown {
  -webkit-animation-name: fadeInDown;
  animation-name: fadeInDown;
}

@-webkit-keyframes fadeInDownBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
    transform: translate3d(0, -2000px, 0);
  }
  100% {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}
@keyframes fadeInDownBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
    transform: translate3d(0, -2000px, 0);
  }
  100% {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}
.fadeInDownBig {
  -webkit-animation-name: fadeInDownBig;
  animation-name: fadeInDownBig;
}

@-webkit-keyframes fadeInLeft {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }
  100% {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}
@keyframes fadeInLeft {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }
  100% {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}
.fadeInLeft {
  -webkit-animation-name: fadeInLeft;
  animation-name: fadeInLeft;
}

@-webkit-keyframes fadeInLeftBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
    transform: translate3d(-2000px, 0, 0);
  }
  100% {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}
@keyframes fadeInLeftBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
    transform: translate3d(-2000px, 0, 0);
  }
  100% {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}
.fadeInLeftBig {
  -webkit-animation-name: fadeInLeftBig;
  animation-name: fadeInLeftBig;
}

@-webkit-keyframes fadeInRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }
  100% {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}
@keyframes fadeInRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }
  100% {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}
.fadeInRight {
  -webkit-animation-name: fadeInRight;
  animation-name: fadeInRight;
}

@-webkit-keyframes fadeInRightBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
    transform: translate3d(2000px, 0, 0);
  }
  100% {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}
@keyframes fadeInRightBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
    transform: translate3d(2000px, 0, 0);
  }
  100% {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}
.fadeInRightBig {
  -webkit-animation-name: fadeInRightBig;
  animation-name: fadeInRightBig;
}

@-webkit-keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }
  100% {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}
@keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }
  100% {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}
.fadeInUp {
  -webkit-animation-name: fadeInUp;
  animation-name: fadeInUp;
}

@-webkit-keyframes fadeInUpBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
    transform: translate3d(0, 2000px, 0);
  }
  100% {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}
@keyframes fadeInUpBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
    transform: translate3d(0, 2000px, 0);
  }
  100% {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}
.fadeInUpBig {
  -webkit-animation-name: fadeInUpBig;
  animation-name: fadeInUpBig;
}

@-webkit-keyframes fadeOut {
  from {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
@keyframes fadeOut {
  from {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
.fadeOut {
  -webkit-animation-name: fadeOut;
  animation-name: fadeOut;
}

@-webkit-keyframes fadeOutDown {
  from {
    opacity: 1;
  }
  100% {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }
}
@keyframes fadeOutDown {
  from {
    opacity: 1;
  }
  100% {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }
}
.fadeOutDown {
  -webkit-animation-name: fadeOutDown;
  animation-name: fadeOutDown;
}

@-webkit-keyframes fadeOutDownBig {
  from {
    opacity: 1;
  }
  100% {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
    transform: translate3d(0, 2000px, 0);
  }
}
@keyframes fadeOutDownBig {
  from {
    opacity: 1;
  }
  100% {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
    transform: translate3d(0, 2000px, 0);
  }
}
.fadeOutDownBig {
  -webkit-animation-name: fadeOutDownBig;
  animation-name: fadeOutDownBig;
}

@-webkit-keyframes fadeOutLeft {
  from {
    opacity: 1;
  }
  100% {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }
}
@keyframes fadeOutLeft {
  from {
    opacity: 1;
  }
  100% {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }
}
.fadeOutLeft {
  -webkit-animation-name: fadeOutLeft;
  animation-name: fadeOutLeft;
}

@-webkit-keyframes fadeOutLeftBig {
  from {
    opacity: 1;
  }
  100% {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
    transform: translate3d(-2000px, 0, 0);
  }
}
@keyframes fadeOutLeftBig {
  from {
    opacity: 1;
  }
  100% {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
    transform: translate3d(-2000px, 0, 0);
  }
}
.fadeOutLeftBig {
  -webkit-animation-name: fadeOutLeftBig;
  animation-name: fadeOutLeftBig;
}

@-webkit-keyframes fadeOutRight {
  from {
    opacity: 1;
  }
  100% {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }
}
@keyframes fadeOutRight {
  from {
    opacity: 1;
  }
  100% {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }
}
.fadeOutRight {
  -webkit-animation-name: fadeOutRight;
  animation-name: fadeOutRight;
}

@-webkit-keyframes fadeOutRightBig {
  from {
    opacity: 1;
  }
  100% {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
    transform: translate3d(2000px, 0, 0);
  }
}
@keyframes fadeOutRightBig {
  from {
    opacity: 1;
  }
  100% {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
    transform: translate3d(2000px, 0, 0);
  }
}
.fadeOutRightBig {
  -webkit-animation-name: fadeOutRightBig;
  animation-name: fadeOutRightBig;
}

@-webkit-keyframes fadeOutUp {
  from {
    opacity: 1;
  }
  100% {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }
}
@keyframes fadeOutUp {
  from {
    opacity: 1;
  }
  100% {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }
}
.fadeOutUp {
  -webkit-animation-name: fadeOutUp;
  animation-name: fadeOutUp;
}

@-webkit-keyframes fadeOutUpBig {
  from {
    opacity: 1;
  }
  100% {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
    transform: translate3d(0, -2000px, 0);
  }
}
@keyframes fadeOutUpBig {
  from {
    opacity: 1;
  }
  100% {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
    transform: translate3d(0, -2000px, 0);
  }
}
.fadeOutUpBig {
  -webkit-animation-name: fadeOutUpBig;
  animation-name: fadeOutUpBig;
}

@-webkit-keyframes flip {
  from {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }
  40% {
    -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
    transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }
  50% {
    -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
    transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }
  80% {
    -webkit-transform: perspective(400px) scale3d(0.95, 0.95, 0.95);
    transform: perspective(400px) scale3d(0.95, 0.95, 0.95);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }
  100% {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }
}
@keyframes flip {
  from {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }
  40% {
    -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
    transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }
  50% {
    -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
    transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }
  80% {
    -webkit-transform: perspective(400px) scale3d(0.95, 0.95, 0.95);
    transform: perspective(400px) scale3d(0.95, 0.95, 0.95);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }
  100% {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }
}
.animated.flip {
  -webkit-backface-visibility: visible;
  backface-visibility: visible;
  -webkit-animation-name: flip;
  animation-name: flip;
}

@-webkit-keyframes flipInX {
  from {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0;
  }
  40% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }
  60% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    opacity: 1;
  }
  80% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
  }
  100% {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }
}
@keyframes flipInX {
  from {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0;
  }
  40% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }
  60% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    opacity: 1;
  }
  80% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
  }
  100% {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }
}
.flipInX {
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
  -webkit-animation-name: flipInX;
  animation-name: flipInX;
}

@-webkit-keyframes flipInY {
  from {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0;
  }
  40% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }
  60% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
    opacity: 1;
  }
  80% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
  }
  100% {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }
}
@keyframes flipInY {
  from {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0;
  }
  40% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }
  60% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
    opacity: 1;
  }
  80% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
  }
  100% {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }
}
.flipInY {
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
  -webkit-animation-name: flipInY;
  animation-name: flipInY;
}

@-webkit-keyframes flipOutX {
  from {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }
  30% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    opacity: 1;
  }
  100% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    opacity: 0;
  }
}
@keyframes flipOutX {
  from {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }
  30% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    opacity: 1;
  }
  100% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    opacity: 0;
  }
}
.flipOutX {
  -webkit-animation-name: flipOutX;
  animation-name: flipOutX;
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
}

@-webkit-keyframes flipOutY {
  from {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }
  30% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
    opacity: 1;
  }
  100% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    opacity: 0;
  }
}
@keyframes flipOutY {
  from {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }
  30% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
    opacity: 1;
  }
  100% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    opacity: 0;
  }
}
.flipOutY {
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
  -webkit-animation-name: flipOutY;
  animation-name: flipOutY;
}

@-webkit-keyframes lightSpeedIn {
  from {
    -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg);
    transform: translate3d(100%, 0, 0) skewX(-30deg);
    opacity: 0;
  }
  60% {
    -webkit-transform: skewX(20deg);
    transform: skewX(20deg);
    opacity: 1;
  }
  80% {
    -webkit-transform: skewX(-5deg);
    transform: skewX(-5deg);
    opacity: 1;
  }
  100% {
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}
@keyframes lightSpeedIn {
  from {
    -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg);
    transform: translate3d(100%, 0, 0) skewX(-30deg);
    opacity: 0;
  }
  60% {
    -webkit-transform: skewX(20deg);
    transform: skewX(20deg);
    opacity: 1;
  }
  80% {
    -webkit-transform: skewX(-5deg);
    transform: skewX(-5deg);
    opacity: 1;
  }
  100% {
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}
.lightSpeedIn {
  -webkit-animation-name: lightSpeedIn;
  animation-name: lightSpeedIn;
  -webkit-animation-timing-function: ease-out;
  animation-timing-function: ease-out;
}

@-webkit-keyframes lightSpeedOut {
  from {
    opacity: 1;
  }
  100% {
    -webkit-transform: translate3d(100%, 0, 0) skewX(30deg);
    transform: translate3d(100%, 0, 0) skewX(30deg);
    opacity: 0;
  }
}
@keyframes lightSpeedOut {
  from {
    opacity: 1;
  }
  100% {
    -webkit-transform: translate3d(100%, 0, 0) skewX(30deg);
    transform: translate3d(100%, 0, 0) skewX(30deg);
    opacity: 0;
  }
}
.lightSpeedOut {
  -webkit-animation-name: lightSpeedOut;
  animation-name: lightSpeedOut;
  -webkit-animation-timing-function: ease-in;
  animation-timing-function: ease-in;
}

@-webkit-keyframes rotateIn {
  from {
    -webkit-transform-origin: center;
    transform-origin: center;
    -webkit-transform: rotate3d(0, 0, 1, -200deg);
    transform: rotate3d(0, 0, 1, -200deg);
    opacity: 0;
  }
  100% {
    -webkit-transform-origin: center;
    transform-origin: center;
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}
@keyframes rotateIn {
  from {
    -webkit-transform-origin: center;
    transform-origin: center;
    -webkit-transform: rotate3d(0, 0, 1, -200deg);
    transform: rotate3d(0, 0, 1, -200deg);
    opacity: 0;
  }
  100% {
    -webkit-transform-origin: center;
    transform-origin: center;
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}
.rotateIn {
  -webkit-animation-name: rotateIn;
  animation-name: rotateIn;
}

@-webkit-keyframes rotateInDownLeft {
  from {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
    transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0;
  }
  100% {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}
@keyframes rotateInDownLeft {
  from {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
    transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0;
  }
  100% {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}
.rotateInDownLeft {
  -webkit-animation-name: rotateInDownLeft;
  animation-name: rotateInDownLeft;
}

@-webkit-keyframes rotateInDownRight {
  from {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
    transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }
  100% {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}
@keyframes rotateInDownRight {
  from {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
    transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }
  100% {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}
.rotateInDownRight {
  -webkit-animation-name: rotateInDownRight;
  animation-name: rotateInDownRight;
}

@-webkit-keyframes rotateInUpLeft {
  from {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
    transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }
  100% {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}
@keyframes rotateInUpLeft {
  from {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
    transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }
  100% {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}
.rotateInUpLeft {
  -webkit-animation-name: rotateInUpLeft;
  animation-name: rotateInUpLeft;
}

@-webkit-keyframes rotateInUpRight {
  from {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, -90deg);
    transform: rotate3d(0, 0, 1, -90deg);
    opacity: 0;
  }
  100% {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}
@keyframes rotateInUpRight {
  from {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, -90deg);
    transform: rotate3d(0, 0, 1, -90deg);
    opacity: 0;
  }
  100% {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}
.rotateInUpRight {
  -webkit-animation-name: rotateInUpRight;
  animation-name: rotateInUpRight;
}

@-webkit-keyframes rotateOut {
  from {
    -webkit-transform-origin: center;
    transform-origin: center;
    opacity: 1;
  }
  100% {
    -webkit-transform-origin: center;
    transform-origin: center;
    -webkit-transform: rotate3d(0, 0, 1, 200deg);
    transform: rotate3d(0, 0, 1, 200deg);
    opacity: 0;
  }
}
@keyframes rotateOut {
  from {
    -webkit-transform-origin: center;
    transform-origin: center;
    opacity: 1;
  }
  100% {
    -webkit-transform-origin: center;
    transform-origin: center;
    -webkit-transform: rotate3d(0, 0, 1, 200deg);
    transform: rotate3d(0, 0, 1, 200deg);
    opacity: 0;
  }
}
.rotateOut {
  -webkit-animation-name: rotateOut;
  animation-name: rotateOut;
}

@-webkit-keyframes rotateOutDownLeft {
  from {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    opacity: 1;
  }
  100% {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
    transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }
}
@keyframes rotateOutDownLeft {
  from {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    opacity: 1;
  }
  100% {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
    transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }
}
.rotateOutDownLeft {
  -webkit-animation-name: rotateOutDownLeft;
  animation-name: rotateOutDownLeft;
}

@-webkit-keyframes rotateOutDownRight {
  from {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    opacity: 1;
  }
  100% {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
    transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0;
  }
}
@keyframes rotateOutDownRight {
  from {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    opacity: 1;
  }
  100% {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
    transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0;
  }
}
.rotateOutDownRight {
  -webkit-animation-name: rotateOutDownRight;
  animation-name: rotateOutDownRight;
}

@-webkit-keyframes rotateOutUpLeft {
  from {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    opacity: 1;
  }
  100% {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
    transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0;
  }
}
@keyframes rotateOutUpLeft {
  from {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    opacity: 1;
  }
  100% {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
    transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0;
  }
}
.rotateOutUpLeft {
  -webkit-animation-name: rotateOutUpLeft;
  animation-name: rotateOutUpLeft;
}

@-webkit-keyframes rotateOutUpRight {
  from {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    opacity: 1;
  }
  100% {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, 90deg);
    transform: rotate3d(0, 0, 1, 90deg);
    opacity: 0;
  }
}
@keyframes rotateOutUpRight {
  from {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    opacity: 1;
  }
  100% {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, 90deg);
    transform: rotate3d(0, 0, 1, 90deg);
    opacity: 0;
  }
}
.rotateOutUpRight {
  -webkit-animation-name: rotateOutUpRight;
  animation-name: rotateOutUpRight;
}

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

@-webkit-keyframes rollIn {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
    transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
  }
  100% {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}
@keyframes rollIn {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
    transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
  }
  100% {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}
.rollIn {
  -webkit-animation-name: rollIn;
  animation-name: rollIn;
}

@-webkit-keyframes rollOut {
  from {
    opacity: 1;
  }
  100% {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
    transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
  }
}
@keyframes rollOut {
  from {
    opacity: 1;
  }
  100% {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
    transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
  }
}
.rollOut {
  -webkit-animation-name: rollOut;
  animation-name: rollOut;
}

@-webkit-keyframes zoomIn {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }
  50% {
    opacity: 1;
  }
}
@keyframes zoomIn {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }
  50% {
    opacity: 1;
  }
}
.zoomIn {
  -webkit-animation-name: zoomIn;
  animation-name: zoomIn;
}

@-webkit-keyframes zoomInDown {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }
  60% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}
@keyframes zoomInDown {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }
  60% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}
.zoomInDown {
  -webkit-animation-name: zoomInDown;
  animation-name: zoomInDown;
}

@-webkit-keyframes zoomInLeft {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }
  60% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}
@keyframes zoomInLeft {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }
  60% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}
.zoomInLeft {
  -webkit-animation-name: zoomInLeft;
  animation-name: zoomInLeft;
}

@-webkit-keyframes zoomInRight {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }
  60% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}
@keyframes zoomInRight {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }
  60% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}
.zoomInRight {
  -webkit-animation-name: zoomInRight;
  animation-name: zoomInRight;
}

@-webkit-keyframes zoomInUp {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }
  60% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}
@keyframes zoomInUp {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }
  60% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}
.zoomInUp {
  -webkit-animation-name: zoomInUp;
  animation-name: zoomInUp;
}

@-webkit-keyframes zoomOut {
  from {
    opacity: 1;
  }
  50% {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }
  100% {
    opacity: 0;
  }
}
@keyframes zoomOut {
  from {
    opacity: 1;
  }
  50% {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }
  100% {
    opacity: 0;
  }
}
.zoomOut {
  -webkit-animation-name: zoomOut;
  animation-name: zoomOut;
}

@-webkit-keyframes zoomOutDown {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }
  100% {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
    -webkit-transform-origin: center bottom;
    transform-origin: center bottom;
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}
@keyframes zoomOutDown {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }
  100% {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
    -webkit-transform-origin: center bottom;
    transform-origin: center bottom;
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}
.zoomOutDown {
  -webkit-animation-name: zoomOutDown;
  animation-name: zoomOutDown;
}

@-webkit-keyframes zoomOutLeft {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);
  }
  100% {
    opacity: 0;
    -webkit-transform: scale(0.1) translate3d(-2000px, 0, 0);
    transform: scale(0.1) translate3d(-2000px, 0, 0);
    -webkit-transform-origin: left center;
    transform-origin: left center;
  }
}
@keyframes zoomOutLeft {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);
  }
  100% {
    opacity: 0;
    -webkit-transform: scale(0.1) translate3d(-2000px, 0, 0);
    transform: scale(0.1) translate3d(-2000px, 0, 0);
    -webkit-transform-origin: left center;
    transform-origin: left center;
  }
}
.zoomOutLeft {
  -webkit-animation-name: zoomOutLeft;
  animation-name: zoomOutLeft;
}

@-webkit-keyframes zoomOutRight {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);
  }
  100% {
    opacity: 0;
    -webkit-transform: scale(0.1) translate3d(2000px, 0, 0);
    transform: scale(0.1) translate3d(2000px, 0, 0);
    -webkit-transform-origin: right center;
    transform-origin: right center;
  }
}
@keyframes zoomOutRight {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);
  }
  100% {
    opacity: 0;
    -webkit-transform: scale(0.1) translate3d(2000px, 0, 0);
    transform: scale(0.1) translate3d(2000px, 0, 0);
    -webkit-transform-origin: right center;
    transform-origin: right center;
  }
}
.zoomOutRight {
  -webkit-animation-name: zoomOutRight;
  animation-name: zoomOutRight;
}

@-webkit-keyframes zoomOutUp {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }
  100% {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
    -webkit-transform-origin: center bottom;
    transform-origin: center bottom;
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}
@keyframes zoomOutUp {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }
  100% {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
    -webkit-transform-origin: center bottom;
    transform-origin: center bottom;
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}
.zoomOutUp {
  -webkit-animation-name: zoomOutUp;
  animation-name: zoomOutUp;
}

@-webkit-keyframes slideInDown {
  from {
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
    visibility: visible;
  }
  100% {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes slideInDown {
  from {
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
    visibility: visible;
  }
  100% {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
.slideInDown {
  -webkit-animation-name: slideInDown;
  animation-name: slideInDown;
}

@-webkit-keyframes slideInLeft {
  from {
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
    visibility: visible;
  }
  100% {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes slideInLeft {
  from {
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
    visibility: visible;
  }
  100% {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
.slideInLeft {
  -webkit-animation-name: slideInLeft;
  animation-name: slideInLeft;
}

@-webkit-keyframes slideInRight {
  from {
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
    visibility: visible;
  }
  100% {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes slideInRight {
  from {
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
    visibility: visible;
  }
  100% {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
.slideInRight {
  -webkit-animation-name: slideInRight;
  animation-name: slideInRight;
}

@-webkit-keyframes slideInUp {
  from {
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
    visibility: visible;
  }
  100% {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes slideInUp {
  from {
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
    visibility: visible;
  }
  100% {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
.slideInUp {
  -webkit-animation-name: slideInUp;
  animation-name: slideInUp;
}

@-webkit-keyframes slideOutDown {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  100% {
    visibility: hidden;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }
}
@keyframes slideOutDown {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  100% {
    visibility: hidden;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }
}
.slideOutDown {
  -webkit-animation-name: slideOutDown;
  animation-name: slideOutDown;
}

@-webkit-keyframes slideOutLeft {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  100% {
    visibility: hidden;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }
}
@keyframes slideOutLeft {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  100% {
    visibility: hidden;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }
}
.slideOutLeft {
  -webkit-animation-name: slideOutLeft;
  animation-name: slideOutLeft;
}

@-webkit-keyframes slideOutRight {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  100% {
    visibility: hidden;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }
}
@keyframes slideOutRight {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  100% {
    visibility: hidden;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }
}
.slideOutRight {
  -webkit-animation-name: slideOutRight;
  animation-name: slideOutRight;
}

@-webkit-keyframes slideOutUp {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  100% {
    visibility: hidden;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }
}
@keyframes slideOutUp {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  100% {
    visibility: hidden;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }
}
.slideOutUp {
  -webkit-animation-name: slideOutUp;
  animation-name: slideOutUp;
}

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

.slick-list {
  position: relative;
  display: block;
  overflow: hidden;
  margin: 0;
  padding: 0;
}

.slick-list:focus {
  outline: none;
}

.slick-list.dragging {
  cursor: pointer;
  cursor: hand;
}

.slick-slider .slick-track,
.slick-slider .slick-list {
  -webkit-transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
  -o-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
}

.slick-track {
  position: relative;
  top: 0;
  left: 0;
  display: block;
}

.slick-track:before,
.slick-track:after {
  display: table;
  content: '';
}

.slick-track:after {
  clear: both;
}

.slick-loading .slick-track {
  visibility: hidden;
}

.slick-slide {
  display: none;
  float: left;
  height: 100%;
  min-height: 1px;
}

[dir='rtl'] .slick-slide {
  float: right;
}

.slick-slide img {
  display: block;
}

.slick-slide.slick-loading img {
  display: none;
}

.slick-slide.dragging img {
  pointer-events: none;
}

.slick-initialized .slick-slide {
  display: block;
}

.slick-loading .slick-slide {
  visibility: hidden;
}

.slick-vertical .slick-slide {
  display: block;
  height: auto;
  border: 1px solid transparent;
}

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

/* Magnific Popup CSS */
.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;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  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: -moz-zoom-out;
  cursor: -webkit-zoom-out;
  cursor: zoom-out;
}

.mfp-zoom {
  cursor: pointer;
  cursor: -webkit-zoom-in;
  cursor: -moz-zoom-in;
  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;
  user-select: none;
}

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

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

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

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

.mfp-preloader a:hover {
  color: white;
}

.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;
  -webkit-box-shadow: none;
  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: white;
  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: #333333;
}

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

.mfp-counter {
  position: absolute;
  top: 0;
  right: 0;
  color: #cccccc;
  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 white;
  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 white;
  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: black;
}

/* Main image in popup */
img.mfp-img {
  width: auto;
  max-width: 100%;
  height: auto;
  display: block;
  line-height: 0;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  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: #444444;
}

.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;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    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 {
    -webkit-transform: scale(0.75);
    transform: scale(0.75);
  }

  .mfp-arrow-left {
    -webkit-transform-origin: 0;
    transform-origin: 0;
  }

  .mfp-arrow-right {
    -webkit-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;
}

/*------------------------------------*\
    #FOOTER MAIN
\*------------------------------------*/
.footer-main {
  padding: 40px 0;
  font-size: 13px;
  font-weight: 700;
  color: #231f20;
  text-align: center;
}
.footer-main ul {
  margin: 0;
  display: inline-block;
  list-style-type: none;
  font-size: 0;
  position: relative;
  top: 5px;
  margin-bottom: 20px;
}
.footer-main ul li {
  margin: 0;
  font-size: 13px;
  display: inline-block;
  vertical-align: bottom;
  margin-left: 5px;
  margin-right: 5px;
}
.footer-main a {
  text-decoration: underline;
  color: inherit;
}

.footer-main__logo {
  width: 173px;
  display: inline-block;
  vertical-align: bottom;
  margin-right: 15px;
  margin-bottom: 20px;
}

/*------------------------------------*\
    #HEADER MAIN
\*------------------------------------*/
.header-main {
  background-color: #231f20;
  position: fixed;
  left: 0;
  top: 0;
  height: 38px;
  width: 100%;
  z-index: 1000;
}
.styleguide .header-main {
  position: relative;
}
.header-main .justifize__box {
  position: relative;
  z-index: 2;
}
.header-main .justifize__box + .justifize__box {
  font-size: 0;
}
.header-main .justifize__box + .justifize__box > div {
  display: inline-block;
  vertical-align: middle;
}
.header-main .justifize__box + .justifize__box > div > * {
  font-size: 10px;
}
@media screen and (max-width: 768px) {
  .header-main .justifize__box + .justifize__box > div {
    padding-right: 40px;
  }
}
@media screen and (max-width: 480px) {
  .header-main .justifize__box + .justifize__box > div {
    padding-right: 15px;
  }
}
@media screen and (max-width: 768px) {
  .header-main .justifize__box + .justifize__box {
    display: block;
    background-color: #353537;
    position: absolute;
    left: 0;
    top: 100%;
    right: 0;
    z-index: 1;
  }
  .header-main .justifize__box + .justifize__box > div {
    display: block;
  }
}
.header-main .container {
  max-width: 1040px;
}

.header-main__dropdown {
  position: relative;
  height: 38px;
  line-height: 38px;
  display: inline-block;
  transition: background .2s ease;
  vertical-align: middle;
}
.header-main__dropdown > a {
  font-size: 10px;
  font-weight: 700;
  color: white;
  width: 115px;
  height: 24px;
  line-height: 24px;
  display: block;
  padding: 0 40px 0 20px;
  white-space: nowrap;
  border-left: 1px solid #6d6e71;
  border-right: 1px solid #6d6e71;
  position: relative;
  top: 7px;
}
.header-main__dropdown > a:after {
  content: '';
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 6px 5.5px 0 5.5px;
  border-color: #6d6e71 transparent transparent transparent;
  display: inline-block;
  margin-left: 10px;
}
@media screen and (max-width: 480px) {
  .header-main__dropdown > a {
    border: none;
    padding: 0 10px;
    width: auto;
  }
}
.header-main__dropdown:before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 1px;
  top: 0;
  bottom: 0;
  display: block;
  background-color: #231f20;
  opacity: 1;
  transition: all .2s ease;
}
.header-main__dropdown:hover {
  background-color: white;
}
.header-main__dropdown:hover:before, .header-main__dropdown:hover:after {
  opacity: 1;
}
.header-main__dropdown:hover > a {
  color: #231f20;
  border-color: transparent;
  text-decoration: none !important;
}
.header-main__dropdown:hover .header-main__sub-menu {
  opacity: 1;
  visibility: visible;
  transition: all .2s ease;
}

.header-main__sub-menu {
  border: 1px solid #231f20;
  border-top: none;
  background-color: white;
  position: absolute;
  transition: all .1s ease;
  margin-left: 0;
  margin-bottom: 0;
  top: 100%;
  left: 0;
  width: 200px;
  visibility: hidden;
  opacity: 0;
  list-style-type: none;
  font-size: 12px;
}
.header-main__sub-menu li {
  margin-bottom: 0;
}
.header-main__sub-menu a {
  color: #231f20;
  display: block;
  padding: 10px 20px;
  line-height: 1.2;
}
@media screen and (max-width: 480px) {
  .header-main__sub-menu a {
    padding: 10px;
  }
}
.header-main__sub-menu a:hover {
  background-color: #231f20;
  color: white;
  text-decoration: none;
}

.header-main__social {
  display: inline-block;
  vertical-align: middle;
  padding: 0 10px;
  position: relative;
}
.header-main__social a {
  color: white;
  display: inline-block;
  width: 30px;
  text-align: center;
  height: 38px;
  line-height: 38px;
}
.header-main__social a:hover {
  background-color: white;
  color: #231f20;
}
.header-main__social:after {
  content: '';
  position: absolute;
  right: 0;
  top: 7px;
  bottom: 7px;
  display: block;
  background-color: #6d6e71;
  width: 1px;
}
@media screen and (max-width: 480px) {
  .header-main__social {
    padding: 0;
  }
  .header-main__social:after {
    display: none;
  }
}

.header-main__logo {
  width: 37px;
  display: inline-block;
  vertical-align: middle;
  margin-left: 10px;
}
@media screen and (max-width: 768px) {
  .header-main__logo {
    position: absolute;
    right: 40px;
    bottom: 100%;
    margin-bottom: 6px;
  }
}
@media screen and (max-width: 480px) {
  .header-main__logo {
    right: 15px;
  }
}

.header-main__user {
  display: inline-block;
  vertical-align: middle;
  position: relative;
  margin-right: 10px;
  transition: all .2s ease;
}
.header-main__user > a {
  padding: 0 30px 0 20px;
  border-right: none;
  width: auto;
}
.header-main__user > a span {
  color: white;
  display: inline-block;
  margin-right: 20px;
  transition: all .2s ease;
  font-size: 10px;
  font-weight: 400;
}
.header-main__user > a .icon {
  color: #6d6e71;
}
.header-main__user > a:after {
  content: '';
  position: absolute;
  right: 10px;
  top: 50%;
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 6px 5.5px 0 5.5px;
  border-color: #6d6e71 transparent transparent transparent;
  display: inline-block;
}
@media screen and (max-width: 480px) {
  .header-main__user > a {
    padding: 0 20px 0 20px;
  }
  .header-main__user > a:after {
    right: 0;
  }
}
.header-main__user .header-main__sub-menu {
  width: auto;
  right: -1px;
  left: -1px;
}
.header-main__user:after, .header-main__user:before {
  content: '';
  position: absolute;
  right: 0;
  top: 7px;
  bottom: 7px;
  display: block;
  background-color: #6d6e71;
  width: 1px;
  transition: all .2s ease;
}
.header-main__user:before {
  right: auto;
  left: 0;
}
.header-main__user:hover {
  background-color: white;
}
.header-main__user:hover > a {
  color: #231f20;
}
.header-main__user:hover > a span {
  color: #231f20;
}
.header-main__user:hover:after, .header-main__user:hover:before {
  background-color: white;
}
@media screen and (max-width: 768px) {
  .header-main__user {
    float: right;
    margin-right: 0;
  }
}
@media screen and (max-width: 480px) {
  .header-main__user:after, .header-main__user:before {
    display: none;
  }
}

.header-main__email {
  display: inline-block;
  height: 38px;
  transition: all .2s ease;
  vertical-align: middle;
  position: relative;
}
.header-main__email > a {
  padding: 0 20px;
  line-height: 38px;
  text-decoration: none !important;
  display: block;
}
.header-main__email > a span {
  color: white;
  display: inline-block;
  transition: all .2s ease;
  font-size: 10px;
  font-weight: 400;
  color: white;
  margin-right: 10px;
}
.header-main__email > a .icon {
  color: #6d6e71;
}
.header-main__email:before {
  content: '';
  position: absolute;
  left: 0;
  top: 7px;
  bottom: 7px;
  display: block;
  background-color: #6d6e71;
  width: 1px;
  transition: all .2s ease;
}
.header-main__email:hover {
  background-color: white;
}
.header-main__email:hover span {
  color: #231f20;
}
.header-main__email:hover:before {
  background-color: white;
}
@media screen and (max-width: 768px) {
  .header-main__email {
    margin-left: 40px;
  }
}
@media screen and (max-width: 480px) {
  .header-main__email {
    margin-left: 15px;
  }
  .header-main__email > a {
    padding: 0;
    direction: rtl;
  }
  .header-main__email span {
    margin-right: 0;
    margin-left: 10px;
  }
  .header-main__email:before {
    display: none;
  }
}

.header-main__auth-link {
  font-size: 10px;
  font-weight: 700;
  color: white;
  height: 38px;
  line-height: 38px;
  padding: 0 20px;
  white-space: nowrap;
  position: relative;
  display: inline-block;
  vertical-align: middle;
  text-transform: uppercase;
}
.header-main__auth-link:after {
  content: '';
  position: absolute;
  left: 0;
  top: 7px;
  bottom: 7px;
  display: block;
  background-color: #6d6e71;
  width: 1px;
  transition: all .2s ease;
}
.header-main__auth-link:hover {
  background-color: white;
  color: #231f20;
  text-decoration: none;
}
.header-main__auth-link:hover:after {
  background-color: white;
}
@media screen and (max-width: 768px) {
  .header-main__auth-link:first-child {
    margin-left: 40px;
  }
}
@media screen and (max-width: 480px) {
  .header-main__auth-link:first-child {
    margin-left: 15px;
  }
}

/*------------------------------------*\
    #SUBHEADER
\*------------------------------------*/
.subheader {
  padding-top: 20px;
}
.subheader .nav-trigger {
  margin-bottom: 18px;
}
@media screen and (max-width: 1024px) {
  .subheader .container {
    padding: 0 !important;
  }
  .subheader .justifize__box {
    vertical-align: middle;
  }
  .subheader .justifize__box:first-child span {
    display: block;
  }
}
@media screen and (max-width: 768px) {
  .subheader {
    padding-top: 0;
  }
  .subheader .justifize__box {
    margin-top: 10px;
  }
  .subheader .justifize__box:first-child span {
    font-size: 10px;
    padding-top: 0 !important;
    margin-top: 5px;
  }
}
.subheader .site-logo {
  display: inline-block;
  vertical-align: bottom;
  margin-right: 20px;
}
.subheader .strapline {
  margin-top: -10px;
}
@media screen and (max-width: 768px) {
  .subheader .strapline {
    /*margin-top: 0;
    margin-bottom: 16px;
    font-size: 10px;*/
    visibility: hidden;
    height: 32px;
  }
}
@media screen and (max-width: 1025px -1) {
  .subheader .strapline {
    margin-bottom: 16px;
  }
}
.subheader span {
  font-size: 17px;
  color: #231f20;
  font-family: Arial, sans-serif;
  display: inline-block;
  vertical-align: bottom;
  line-height: 1;
  padding-top: 20px;
  margin-bottom: 16px;
}
.subheader .input {
  font-size: 11px;
  width: 270px;
  position: relative;
  z-index: 1;
  border: none;
  padding-right: 37px;
  margin-bottom: 16px;
}
.subheader .justifize__box {
  margin-bottom: 20px;
}
@media screen and (max-width: 1024px) {
  .subheader .justifize__box {
    margin-bottom: 0;
  }
}
.subheader .container {
  max-width: 1040px;
}
@media screen and (max-width: 400px) {
  .subheader.show-search .justifize__box, .subheader.show-search .justifize {
    display: block;
  }
  .subheader.show-search .justifize__box {
    float: right;
  }
  .subheader.show-search .justifize__box:first-child {
    display: none;
  }
}

.subheader__search {
  position: relative;
}
.subheader__search button, .subheader__search a {
  position: absolute;
  z-index: 2;
  right: 9px;
  top: 9px;
  border: none;
  background-color: transparent;
  padding: 0;
  display: block;
  color: #333742;
}
.subheader__search a {
  display: none;
}
@media screen and (max-width: 1024px) {
  .subheader__search {
    display: inline-block;
    vertical-align: middle;
    margin-bottom: 0;
  }
}
@media screen and (max-width: 600px) {
  .subheader__search .input {
    width: 200px;
  }
}
@media screen and (max-width: 500px) {
  .subheader__search .input {
    width: 150px;
  }
}
@media screen and (max-width: 1024px) {
  .subheader__search .input {
    width: 0;
    float: right;
    background-color: transparent;
    font-size: 0;
    padding: 0;
  }
  .show-search .subheader__search .input {
    background-color: white;
    font-size: 11px;
    padding: 0 37px 0 12px;
    width: 220px;
  }
  .subheader__search a {
    display: block;
    color: white;
  }
  .subheader__search button {
    visibility: hidden;
    opacity: 0;
    color: white;
    right: 0;
  }
  .show-search .subheader__search button {
    color: #333742;
    right: 9px;
  }
  .show-search .subheader__search a {
    visibility: hidden;
    opacity: 0;
  }
  .show-search .subheader__search button {
    visibility: visible;
    opacity: 1;
  }
}

@media all and (min-width: 770px) and (max-width: 1023px) {
  .search-and-menu {
    margin-top: -28px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .strapline {
    margin-bottom: 16px;
  }
}
.icon-dark {
  fill: #333742;
}

.search-and-menu {
  margin-top: 14px;
}
@media screen and (max-width: 1024px) {
  .search-and-menu {
    margin-top: 1px;
  }
}

.message {
  position: relative;
}
.message #message-container {
  position: absolute;
  top: 14px;
  left: 370px;
}
@media screen and (max-width: 1024px) {
  .message #message-container {
    left: 330px;
  }
}
@media screen and (max-width: 768px) {
  .message #message-container {
    left: 210px;
    top: 10px;
  }
}
@media screen and (max-width: 620px) {
  .message #message-container {
    position: relative;
    top: auto;
    left: auto;
    margin-bottom: 10px;
    text-align: center;
    margin-top: -20px;
  }
}
.message #message-container img {
  height: 15px;
  margin-bottom: 0;
  vertical-align: text-top;
}
@media screen and (min-width: 769px) {
  .message #message-container img {
    height: 20px;
    vertical-align: sub;
  }
}
.message #message-container a {
  color: #333742;
  font-size: 18px;
}
@media screen and (max-width: 768px) {
  .message #message-container a {
    font-size: 16px;
  }
}

/*------------------------------------*\
    #NAV MAIN
\*------------------------------------*/
.nav-main-wrap {
  position: relative;
  z-index: 10;
}

.nav-trigger {
  color: #231F20;
  display: none;
  cursor: pointer;
}
@media screen and (max-width: 1024px) {
  .nav-trigger {
    display: inline-block;
    vertical-align: middle;
    margin-left: 20px;
  }
}

.nav-main {
  position: relative;
  font-size: 0;
  margin-bottom: 95px;
  margin-left: 0;
  padding-left: 40px;
  padding-right: 40px;
}
@media screen and (min-width: 1025px) {
  .nav-main {
    display: block !important;
  }
}
@media screen and (max-width: 1024px) {
  .nav-main {
    display: none;
    position: absolute;
    top: 0;
    left: -40px;
    right: -40px;
    padding-left: 0;
    padding-right: 0;
    margin-bottom: 0;
  }
  .nav-main .nav-main__item {
    position: relative;
    display: block;
    width: 100%;
    margin-left: 0;
    margin-right: 0;
  }
  .nav-main .nav-main__item > a {
    border-radius: 0 !important;
    text-align: left;
    padding: 17px 20px 13px;
    height: auto;
    line-height: 1.2;
    border-bottom: 1px solid #fff;
  }
}
@media screen and (max-width: 480px) {
  .nav-main {
    left: -15px;
    right: -15px;
  }
}

.nav-main__item {
  font-size: 14px;
  display: inline-block;
  width: 15.7%;
  margin-left: .5%;
  margin-right: .5%;
}
.nav-main__item:first-child {
  margin-left: 0;
}
.nav-main__item:last-child {
  margin-right: 0;
}
.nav-main__item > a {
  height: 36px;
  line-height: 36px;
  display: block;
  background-color: #ee2346;
  color: white;
  text-align: center;
  font-family: Arial, sans-serif;
  font-size: 13px;
  font-weight: 700;
  text-transform: uppercase;
  border-radius: 5px 5px 0 0;
  text-decoration: none;
}
@media screen and (min-width: 1025px) {
  .nav-main__item.is-active > a {
    background-color: white;
    color: #ee2346;
  }
  .nav-main__item.is-active .nav-main__dropdown {
    visibility: visible;
    opacity: 1;
    padding-top: 40px;
    padding-bottom: 20px;
    z-index: 1;
    text-align: left;
    border: none;
  }
  .nav-main__item.is-active li {
    width: 10%;
    margin-right: 1%;
    vertical-align: bottom;
    position: relative;
  }
  .nav-main__item.is-active li a {
    font-size: 11px;
    text-align: left;
    padding-bottom: 10px;
    padding-top: 10px;
    padding-left: 5px;
    position: relative;
    z-index: 2;
  }
  .nav-main__item.is-active li:after {
    content: '';
    z-index: 1;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 4px;
    display: block;
    transition: all .2s ease;
  }
  .nav-main__item.is-active li:hover a {
    color: white;
  }
  .nav-main__item.is-active li:hover:after {
    height: 100%;
  }
  .nav-main__item.is-active .icon-wrap {
    display: none;
  }
}
@media screen and (min-width: 1025px) {
  .nav-main__item:hover .nav-main__dropdown {
    opacity: 1;
    visibility: visible;
    transition-duration: .2s;
    z-index: 2;
  }
}

.nav-main__dropdown {
  background-color: white;
  position: absolute;
  top: 100%;
  left: 0;
  width: 100%;
  text-align: center;
  visibility: hidden;
  opacity: 0;
  transition: all .1s ease;
  padding: 60px 40px;
  font-size: 0;
  border: 1px solid #b7bdce;
  border-top: none;
}
.nav-main__dropdown ul {
  margin-left: 0;
  margin-bottom: 0;
}
.nav-main__dropdown li {
  display: inline-block;
  vertical-align: top;
  width: 100px;
}
.nav-main__dropdown li a {
  display: block;
  text-align: center;
  font-size: 14px;
  color: #333742;
  text-decoration: none;
}
.nav-main__dropdown .icon-wrap {
  width: 80px;
  height: 60px;
  margin-bottom: 10px;
  background-color: #944eaf;
  display: block;
  margin-left: auto;
  margin-right: auto;
  transition: all .2s ease;
}
.nav-main__dropdown .icon-wrap:hover {
  background-color: #333742;
}

.nav-main__dropdown-right {
  float: right;
}
.nav-main__dropdown-right > span {
  color: #7f3f98;
  text-align: right;
  font-size: 14px;
  display: inline-block;
  vertical-align: middle;
  margin-right: 20px;
  display: none;
}
.nav-main__dropdown-right > span b {
  font-size: 24px;
  font-weight: 700;
}
.nav-main__dropdown-right > .btn--primary {
  vertical-align: middle;
  display: none;
}
.nav-main__dropdown-right .campaigns__item {
  display: block;
  max-width: 400px;
}
.nav-main__item.is-active .nav-main__dropdown-right {
  position: absolute;
  right: 40px;
  top: 20px;
}
.nav-main__item.is-active .nav-main__dropdown-right > .btn--primary, .nav-main__item.is-active .nav-main__dropdown-right > span {
  display: inline-block;
}
.nav-main__item.is-active .nav-main__dropdown-right .campaigns__item {
  display: none;
}
@media screen and (max-width: 1024px) {
  .nav-main__dropdown-right {
    position: relative !important;
    right: auto !important;
    top: auto !important;
    padding-top: 0;
    float: none;
    margin-bottom: 30px;
  }
  .nav-main__dropdown-right .campaigns__item {
    display: none;
  }
}

.dropdown-checkbox, .dropdown-trigger {
  display: none;
}

.dropdown-trigger {
  -moz-user-select: -moz-none;
  -ms-user-select: none;
  -webkit-user-select: none;
  user-select: none;
  /* http://compass-style.org/reference/compass/css3/user_interface/ */
  transition: all .3s ease;
  -moz-backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}
@media screen and (max-width: 1024px) {
  .dropdown-trigger {
    display: block;
    position: absolute;
    right: 8px;
    top: 8px;
    line-height: 32px;
    height: 32px;
    width: 32px;
    background-color: white;
    color: #231F20;
    text-align: center;
    font-weight: bold;
    font-size: 20px;
    border-radius: 50%;
    cursor: pointer;
  }
}

.dropdown-checkbox:checked + .dropdown-trigger {
  -moz-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}
.dropdown-checkbox:checked ~ .nav-main__dropdown {
  opacity: 1;
  visibility: visible;
  transition-duration: 0;
  z-index: 2;
  position: relative;
}

/*------------------------------------*\
    #WELCOME BOXES
\*------------------------------------*/
.welcome-boxes {
  margin-bottom: 20px;
}

.welcome-boxes__item {
  text-align: center;
  height: 170px;
  background-color: #f4f5f7;
}
.welcome-boxes__item h3 {
  margin-bottom: 0;
}

/*------------------------------------*\
    #INPUTS
\*------------------------------------*/
label {
  display: block;
}

/**
 * Base input styles.
 */
.input {
  -webkit-appearance: none;
  /* removing inner shadow on iOS inputs */
  -webkit-font-smoothing: inherit;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -moz-transition: all 0.2s ease;
  -o-transition: all 0.2s ease;
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease;
  background: white;
  border: 1px solid #b7bdce;
  color: #333742;
  display: inline-block;
  font-family: Arial, sans-serif;
  font-size: 14px;
  padding: 0 12px;
  /* remove browser defaults */
  vertical-align: middle;
  width: 100%;
  height: 36px;
  /**
   * @hover
   */
  /**
   * @focus
   */
  /**
   * Error state.
   */
}
.input:invalid {
  box-shadow: none;
  /* fixes mozilla red outline (shadow) */
}
.input[readonly] {
  cursor: text;
}
.input::-ms-clear {
  display: none;
  /* remove IE clear icon */
}
.input:hover {
  border-color: #333742;
}
.input:focus {
  border-color: #075384;
  color: #075384;
}
.input:focus::-webkit-input-placeholder {
  color: #075384;
}
.input:focus:-moz-placeholder {
  /* Firefox 18- */
  color: #075384;
}
.input:focus::-moz-placeholder {
  /* Firefox 19+ */
  color: #075384;
}
.input:focus:-ms-input-placeholder {
  color: #075384;
}
.is-error .input, .input.is-error {
  border-color: #ff8688;
}
.input::-webkit-input-placeholder {
  color: #333742;
}
.input:-moz-placeholder {
  /* Firefox 18- */
  color: #333742;
}
.input::-moz-placeholder {
  /* Firefox 19+ */
  color: #333742;
}
.input:-ms-input-placeholder {
  color: #333742;
}

/**
 * Error input.
 */
.input--error {
  position: relative;
}
.input--error .input {
  border-color: #ff0000;
  position: relative;
  z-index: 1;
}
.input--error:before {
  content: attr(data-error);
  z-index: 2;
  position: absolute;
  left: 1px;
  top: 1px;
  right: 1px;
  bottom: 1px;
  color: #ff0000;
  display: inline-block;
  font-family: Arial, sans-serif;
  font-size: 14px;
  padding: 0 12px;
  vertical-align: middle;
  line-height: 34px;
  background-color: white;
}

/**
 * Textarea input.
 */
.input--textarea {
  resize: none;
  font-style: italic;
  height: 100px;
  padding-top: 7px !important;
  padding-bottom: 10px;
}

.check-spellling {
  font-style: italic;
  text-decoration: none !important;
  color: #333742;
}

/*------------------------------------*\
    #PRIMARY BUTTON
\*------------------------------------*/
/**
 * Primary button.
 */
.btn--primary {
  -webkit-font-smoothing: inherit;
  transition: all .2s ease;
  background-color: #075384;
  border-radius: 0;
  color: #fff;
  font-weight: 700;
  height: 43px;
  line-height: 45px;
  width: auto;
  padding: 0 40px;
  text-align: center;
  font-size: 17px;
  text-transform: uppercase;
  font-family: Arial, sans-serif;
  display: inline-block;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border: none;
  outline: none;
  border: 1px solid #075384;
  max-width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  /**
   * @hover
   */
  /**
   * @active
   */
  /**
   * @disabled
   */
}
.btn--primary:not(:disabled):hover, .btn--primary:not(:disabled):focus {
  text-decoration: none;
  background-color: #333742;
  border-color: #333742;
  color: white;
}
.btn--primary:not(:disabled):active {
  border-color: #075384;
  background-color: transparent;
  color: #075384;
}
.btn--primary:disabled {
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=50);
  opacity: 0.5;
  cursor: default !important;
}
.campaigns__item.is-hovered .btn--primary, .campaign-boxes__item.is-hovered .btn--primary {
  background-color: white;
  color: #075384;
}
@media screen and (max-width: 480px) {
  .btn--primary {
    padding: 0 10px;
  }
}

.btn--transparent {
  background-color: transparent;
  color: #075384;
  /**
   * @active
   */
}
.btn--transparent:not(:disabled):active {
  border-color: #075384;
  color: white;
  background-color: #075384;
}

.btn--white {
  background-color: white;
  color: #075384;
  border-color: white;
  line-height: 43px;
  /**
   * @active
   */
}
.btn--white:not(:disabled):active {
  border-color: #075384;
  color: white;
  background-color: #075384;
}

.btn--medium {
  padding-left: 30px;
  padding-right: 30px;
}

.btn--normal {
  height: 36px;
  line-height: 38px;
  font-size: 15px;
}

.btn--load-more {
  width: 176px;
  text-align: center;
  padding: 0;
  text-transform: none;
}

.btn--small {
  padding-left: 20px;
  padding-right: 20px;
  height: 30px;
  line-height: 30px;
  font-size: 12px;
  text-transform: none;
}

.btn--tiny {
  width: 70px;
  padding-left: 0;
  padding-right: 0;
  height: 25px;
  line-height: 25px;
  font-size: 12px;
  font-family: Arial, sans-serif;
}

.btn--login-form {
  height: 36px;
  line-height: 38px;
  border: none;
  background-color: #075384;
  font-family: Arial, sans-serif;
  color: white;
  font-size: 15px;
  width: 100%;
}

.btn--login-button {
  height: 36px;
  line-height: 36px;
  border: none;
  background-color: #333742;
  font-family: Arial, sans-serif;
  text-align: left;
  text-transform: none;
  width: 146px;
  padding: 0;
  font-size: 0;
}
.btn--login-button span {
  vertical-align: middle;
  display: inline-block;
}
.btn--login-button .icon-wrap {
  position: relative;
  height: 100%;
  width: 36px;
  border-right: 1px solid rgba(255, 255, 255, 0.3);
}
.btn--login-button .icon {
  position: absolute;
  left: 50%;
  top: 47%;
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}
.btn--login-button .btn__text {
  font-size: 12px;
  width: calc(100% - 36px);
  text-align: center;
}
.btn--login-button:hover {
  background-color: #075384 !important;
  color: white !important;
}

.btn--facebook:active {
  background-color: #48659f !important;
}

.btn--twitter:active {
  background-color: #4099ff !important;
}

.btn--full {
  width: 100% !important;
  padding-left: 10px !important;
  padding-right: 10px !important;
}

.btn--large {
  width: 290px !important;
}

.btn--most-recent {
  background-color: transparent;
  color: #075384;
  padding: 0;
  border: none;
  text-transform: none;
  font-size: 12px;
  height: 30px;
  line-height: 32px;
}
.btn--most-recent:hover, .btn--most-recent:focus {
  color: #333742 !important;
  background-color: transparent !important;
}
.btn--most-recent:active {
  color: white !important;
  background-color: #075384 !important;
  padding: 0 25px;
}

/*------------------------------------*\
    #SITE LOGO
\*------------------------------------*/
.site-logo {
  display: inline-block;
  vertical-align: middle;
}
.site-logo > img {
  height: auto;
  width: 138px;
  display: inline-block;
  vertical-align: bottom;
  margin-right: 0;
  margin-bottom: 0;
}
.site-logo:hover {
  text-decoration: none;
}

@media screen and (min-width: 769px) {
  .site-logo > img {
    width: 259px;
    margin-right: 20px;
  }
}
/*------------------------------------*\
    #PAGINATION
\*------------------------------------*/
.pagination ul {
  list-style-type: none;
  font-size: 0;
  margin-left: 0;
  margin-bottom: 0;
}
.pagination ul li {
  display: inline-block;
  font-size: 20px;
  vertical-align: middle;
  margin: 0 5px;
  transition: all .2s ease;
  text-align: center;
  color: #333742;
  width: 30px;
  height: 30px;
  line-height: 28px;
  border: 1px solid #b7bdce;
  position: relative;
}
@media screen and (max-width: 450px) {
  .pagination ul li {
    width: 25px;
    height: 25px;
    margin: 0 3px;
    line-height: 23px;
    font-size: 16px;
  }
}
.pagination ul li:hover a {
  border-color: #333742;
  background-color: #333742;
  color: white;
}
.pagination ul li:active a {
  background-color: #7f3f98;
  border-color: #7f3f98;
}
.pagination ul a {
  color: inherit;
  text-decoration: none;
  display: block;
  position: absolute;
  left: -1px;
  top: -1px;
  width: calc(100% + 2px);
  height: calc(100% + 2px);
  border: 1px solid #b7bdce;
}
.pagination ul .icon {
  position: absolute;
  left: 53%;
  top: 53%;
  -moz-transform: translate(-53%, -53%);
  -ms-transform: translate(-53%, -53%);
  -webkit-transform: translate(-53%, -53%);
  transform: translate(-53%, -53%);
}
.pagination ul .pagination__start a, .pagination ul .pagination__prev a, .pagination ul .pagination__next a, .pagination ul .pagination__end a {
  background-color: #b7bdce;
  color: white;
}

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

/*------------------------------------*\
    #BREADCRUMBS
\*------------------------------------*/
.breadcrumbs {
  margin-bottom: 18px;
}
.breadcrumbs li {
  color: #7f3f98;
}
.breadcrumbs li:before {
  display: inline-block;
  margin-right: 5px;
  margin-left: 2px;
  font-weight: 400;
  font-size: 11px;
}
.breadcrumbs li:first-child {
  color: #58595b;
}
.breadcrumbs a {
  font-weight: 300;
  color: inherit;
  font-size: 11px;
}
.breadcrumbs .current:before {
  color: #7f3f98;
}

/*------------------------------------*\
    #SELECT BOX
\*------------------------------------*/
.sod_select {
  width: 100%;
  height: 36px;
  background-color: white;
  line-height: 36px;
  display: block;
  border: none;
  padding: 0;
  position: relative;
  cursor: pointer;
  -moz-transition: all 0.2s ease;
  -o-transition: all 0.2s ease;
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border: 1px solid #b7bdce !important;
  color: #333742;
  font-size: 14px;
  font-family: Arial, sans-serif;
  font-weight: 400;
}
.sod_select .sod_list_wrapper {
  border: none;
  outline: none;
  margin: 0;
  width: 100%;
  background-color: white;
  padding: 0;
  max-height: 217px;
  overflow: auto;
  display: block;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  opacity: 0;
  visibility: hidden;
  -moz-transition: all 0.2s ease;
  -o-transition: all 0.2s ease;
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease;
  z-index: 1000;
}
.sod_select.open {
  position: relative;
}
.sod_select.open .sod_list_wrapper {
  filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false);
  opacity: 1;
  visibility: visible;
  border: 1px solid #b7bdce;
}
.sod_select.open .sod_list {
  position: relative;
}
.sod_select.open .sod_list:after, .sod_select.open .sod_list:before {
  content: '';
  position: absolute;
  top: 0;
  left: 20px;
  right: 20px;
  display: block;
  background-color: #e7eff9;
  z-index: 3;
  height: 1;
}
.sod_select.open .sod_list:after {
  top: -3px;
  height: 3px;
  z-index: 2;
  left: 0;
  right: 0;
  background-color: white;
}
.sod_select .icon {
  position: absolute;
  right: 12px;
  top: 50%;
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  width: 15px;
  height: 9px;
  color: #4b555b;
  margin-top: 1px;
}
.sod_select .sod_option {
  -moz-transition: all 0.2s ease;
  -o-transition: all 0.2s ease;
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease;
  padding: 10px 20px;
  font-size: 14px;
  text-transform: none;
  line-height: 1.2;
  font-weight: 400 !important;
  color: #333742;
  position: relative;
  z-index: 1;
}
.sod_select .sod_option:before {
  display: none !important;
}
.sod_select .sod_option.active {
  background-color: #333742;
  color: white;
}
.sod_select.focus {
  box-shadow: none;
}
.sod_select:before, .sod_select:after {
  display: none;
}

.sod_label {
  font-size: 16px;
  color: #333742;
  font-weight: 400;
  text-transform: none;
  padding: 0 40px 0 20px;
}
.sod_label:after {
  content: '';
  position: absolute;
  display: block;
  z-index: 2;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 6px 5.5px 0 5.5px;
  border-color: #b7bdce transparent transparent transparent;
  top: 50%;
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  right: 10px;
}
.sod_label.sod_placeholder {
  color: black;
  color: rgba(0, 0, 0, 0.5);
}

/*------------------------------------*\
    #FORM
\*------------------------------------*/
.form-register {
  position: relative;
}
.form-register:before {
  content: '';
  display: block;
  position: absolute;
  left: -20px;
  top: 5px;
  bottom: 20px;
  width: 1px;
  background-color: #e9ebf0;
}
@media screen and (max-width: 768px) {
  .form-register:before {
    display: none;
  }
}

/*------------------------------------*\
    #HERO SLIDER
\*------------------------------------*/
.hero-slider {
  margin-bottom: 20px;
}
.hero-slider h1 {
  font-size: 60px;
  line-height: 1;
  color: white;
}
@media screen and (max-width: 600px) {
  .hero-slider h1 {
    font-size: 40px;
  }
}
.hero-slider .img-wrap {
  background-position: 50% 50%;
  background-size: cover;
  position: absolute;
  z-index: 1;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.hero-slider .img-wrap img {
  display: none;
}
.hero-slider .owl-dots {
  position: absolute;
  right: 40px;
  top: 50%;
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}
@media screen and (max-width: 768px) {
  .hero-slider .owl-dots {
    right: 20px;
  }
}
.hero-slider .owl-dot {
  display: block;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background-color: white;
  transition: all .2s ease;
  border: 1px solid white;
  margin-top: 10px;
  margin-bottom: 10px;
}
.hero-slider .owl-dot.active {
  background-color: transparent;
  -moz-transform: scale(1.3, 1.3);
  -ms-transform: scale(1.3, 1.3);
  -webkit-transform: scale(1.3, 1.3);
  transform: scale(1.3, 1.3);
}
.hero-slider .inner-wrap {
  width: 290px;
  max-width: 100%;
  color: white;
}

.hero-slider__item-content {
  position: relative;
  z-index: 2;
  padding: 40px 60px 50px 40px;
  overflow: hidden;
}
.hero-slider__item-content * {
  position: relative;
  z-index: 3;
}
.hero-slider__item-content:before, .hero-slider__item-content:after {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  z-index: 1;
  display: block;
  width: 100%;
  height: 100%;
  background-color: rgba(35, 31, 32, 0.4);
}
.hero-slider__item-content:after {
  z-index: 2;
  background-color: rgba(7, 83, 132, 0.6);
  -moz-transform: rotate(-60deg);
  -ms-transform: rotate(-60deg);
  -webkit-transform: rotate(-60deg);
  transform: rotate(-60deg);
  width: 200%;
  height: 200%;
  left: -90%;
  top: -50%;
}
.campaign-slider .hero-slider__item-content:after {
  background-color: rgba(255, 255, 255, 0.9);
}
@media screen and (max-width: 768px) {
  .hero-slider__item-content {
    padding: 40px 40px 50px 20px;
  }
}

.campaign-slider .inner-wrap {
  color: #333742;
}
.campaign-slider .inner-wrap b {
  font-weight: 700;
  color: #414042;
}
.campaign-slider h1 {
  color: #075384;
}

/*------------------------------------*\
    #CAMPAIGN BOXES
\*------------------------------------*/
.campaign-boxes {
  position: relative;
  margin-bottom: 20px;
}

.campaign-boxes__item {
  position: relative;
  padding: 30px;
}
.campaign-boxes__item h2, .campaign-boxes__item p {
  color: white;
}
.campaign-boxes__item p {
  max-width: 260px;
}
.campaign-boxes__item .img-wrap {
  position: absolute;
  z-index: 1;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-size: cover;
  background-position: 50% 50%;
}
.campaign-boxes__item .img-wrap img {
  display: none;
}
.campaign-boxes__item .img-wrap:before {
  content: '';
  width: 100%;
  height: 100%;
  display: block;
  background-color: rgba(35, 31, 32, 0.6);
  transition: all .2s ease;
}
.campaign-boxes__item.is-hovered .img-wrap:before {
  background-color: rgba(127, 63, 152, 0.8);
}

.campaign-boxes__content {
  position: relative;
  z-index: 2;
}

.campaign-boxes__days-left {
  color: white;
  position: absolute;
  top: 10px;
  right: 10px;
  font-weight: 700;
  font-size: 12px;
  z-index: 3;
}

/*------------------------------------*\
    #LEADER BOARD SLIDER
\*------------------------------------*/
.leader-board-wrap {
  background-image: url("images/patern2.jpg");
  background-position: 50% 50%;
  width: calc(100% + 80px);
  margin-left: -40px;
  padding: 40px;
  margin-bottom: 20px;
}
@media screen and (max-width: 480px) {
  .leader-board-wrap {
    width: calc(100% + 30px);
    margin-left: -15px;
    padding: 30px;
  }
}
.leader-board-wrap h2 {
  color: white;
}
.leader-board-wrap .slick-track {
  padding-top: 30px;
}

.leader-board-slider {
  width: calc(100% + 10px);
  margin-left: -5px;
  margin-bottom: 20px;
}
.leader-board-slider .slick-slide {
  padding-left: 5px;
  padding-right: 5px;
  outline: none;
}
.leader-board-slider .slick-slide:hover .leader-board__social {
  opacity: 1;
  visibility: visible;
}
.leader-board-slider .slick-slide:hover .img-overlay {
  background-color: rgba(35, 31, 32, 0.7);
}
.leader-board-slider .slick-arrow {
  width: 0;
  height: 0;
  border-style: solid;
  background-color: transparent;
  font-size: 0;
  position: absolute;
  top: 60px;
  padding: 0;
}
.leader-board-slider .slick-arrow.slick-disabled {
  opacity: .3;
}
.leader-board-slider .slick-arrow.slick-prev {
  border-width: 13px 14px 13px 0;
  border-color: transparent #ffffff transparent transparent;
  right: 100%;
  margin-right: 10px;
}
.leader-board-slider .slick-arrow.slick-next {
  border-width: 13px 0 13px 14px;
  border-color: transparent transparent transparent #ffffff;
  left: 100%;
  margin-left: 10px;
}
.leader-board-slider .img-wrap {
  padding-bottom: 100%;
  position: relative;
  background-size: cover;
  background-position: 50% 50%;
  margin-bottom: 5px;
  box-sizing: border-box;
}
.leader-board-slider .img-wrap img {
  display: none;
}
.leader-board-slider .img-wrap .img-overlay {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(35, 31, 32, 0.35);
  transition: all .2s ease;
}
.leader-board-slider .your-position {
  position: relative;
}
.leader-board-slider .your-position:before {
  content: 'Your position';
  color: white;
  font-size: 12px;
  position: absolute;
  bottom: 100%;
  width: 100%;
  left: 0;
  height: 30px;
  line-height: 1.1;
}
.leader-board-slider .your-position .img-wrap {
  padding-bottom: calc(100% - 8px);
  border: 4px solid white;
}
.leader-board-slider .slide-text {
  font-size: 10px;
  color: white;
}

.leader-board__social {
  position: absolute;
  top: 10px;
  right: 5px;
  z-index: 2;
  visibility: hidden;
  opacity: 0;
  transition: all .2s ease;
}
.leader-board__social a {
  color: white;
  display: block;
  text-align: right;
  margin-bottom: 4px;
  vertical-align: middle;
  text-decoration: none;
  font-size: 10px;
  font-weight: 700;
}
.leader-board__social a:hover {
  color: #b7bdce;
}
.leader-board__social a:hover span {
  color: #b7bdce;
}
.leader-board__social .icon-wrap {
  width: 18px;
  text-align: center;
}
.leader-board__social .icon {
  vertical-align: top;
}
.leader-board__social span {
  display: inline-block;
  vertical-align: middle;
  color: white;
}

/*------------------------------------*\
    #COUNTER
\*------------------------------------*/
.counter {
  counter-reset: list-ordered;
}

.counter__item {
  counter-increment: list-ordered;
  position: relative;
}
.counter__item:before {
  content: "" counter(list-ordered,decimal) "";
  position: absolute;
  left: 10px;
  top: 8px;
  font-size: 21px;
  line-height: 1;
  color: white;
  display: block;
  font-family: Arial, sans-serif;
  font-weight: 700;
}
.your-position .counter__item:before {
  top: 4px;
  left: 6px;
}

/*------------------------------------*\
    #MASONRY BOXES
\*------------------------------------*/
.masonry-boxes {
  max-width: calc(100% + 20px);
  width: calc(100% + 20px);
  margin-left: -10px;
  /* clearfix */
}
.masonry-boxes:after {
  content: '';
  display: table;
  clear: both;
}

.masonry-boxes__item {
  padding: 10px;
}

.masonry-boxes__sizer,
.masonry-boxes__item {
  width: 25%;
}
@media screen and (max-width: 768px) {
  .masonry-boxes__sizer,
  .masonry-boxes__item {
    width: 50%;
  }
}
@media screen and (max-width: 480px) {
  .masonry-boxes__sizer,
  .masonry-boxes__item {
    width: 100%;
  }
}

.masonry-boxes__item--half {
  width: 50%;
}
@media screen and (max-width: 768px) {
  .masonry-boxes__item--half {
    width: 100%;
  }
}

/*------------------------------------*\
    #YOUR STORIES
\*------------------------------------*/
.your-stories__item {
  width: 100%;
}
.your-stories__item .flag__img a {
  display: block;
  width: 66px;
  height: 66px;
  border-radius: 50%;
  border: 2px solid #b7bdce;
  overflow: hidden;
  background-size: cover;
  background-position: 50% 50%;
  position: relative;
}
.your-stories__item .flag__img a:before {
  content: '';
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  background-color: rgba(127, 63, 152, 0.7);
  opacity: 0;
  visibility: hidden;
  transition: all .2s ease;
  z-index: 1;
  border-radius: 50%;
}
.your-stories__item .flag__img a:hover:before {
  opacity: 1;
  visibility: visible;
}
.your-stories__item .flag__img img {
  display: none;
}
.your-stories__item h3 {
  margin-bottom: 0;
  line-height: 1.2;
}
.your-stories__item h3 a {
  color: white;
}
.your-stories__item p {
  color: white;
}
.your-stories__item p a {
  font-weight: 700;
  color: inherit;
  text-decoration: underline;
}
@media screen and (max-width: 481px) {
  .your-stories__item .flag, .your-stories__item .flag__img, .your-stories__item .flag_body {
    display: block;
  }
  .your-stories__item .your-stories__text {
    position: static;
    bottom: auto;
    left: auto;
    right: auto;
  }
  .your-stories__item .flag__img {
    position: absolute;
    bottom: 20px;
    left: 20px;
    z-index: 2;
  }
  .your-stories__item .flag__body {
    position: absolute;
    top: 20px;
    left: 20px;
    z-index: 2;
  }
  .your-stories__item .flag__body p {
    display: none;
  }
  .your-stories__item .your-stories__content {
    background-size: cover;
  }
  .your-stories__item .your-stories__content .img-wrap:before {
    background-color: rgba(35, 31, 32, 0.7);
  }
  .your-stories__item .your-stories__content .img-wrap > div:before {
    display: none;
  }
}

.your-stories__content {
  position: relative;
  overflow: hidden;
  background-size: cover;
}
.your-stories__content .img-wrap {
  background-size: cover;
  padding-bottom: 100%;
  background-position: 50% 50%;
  display: block;
  position: relative;
  z-index: 1;
}
.your-stories__content .img-wrap img {
  display: none;
}
.your-stories__content .img-wrap:before {
  content: '';
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  background-color: rgba(127, 63, 152, 0.8);
  opacity: 0;
  visibility: hidden;
  transition: all .2s ease;
  z-index: 1;
}
.your-stories__content .img-wrap:hover:before {
  opacity: 1;
  visibility: visible;
}

.your-stories__item--quarter .flag, .your-stories__item--quarter .flag__img, .your-stories__item--quarter .flag_body {
  display: block;
}
.your-stories__item--quarter .your-stories__text {
  position: static;
  bottom: auto;
  left: auto;
  right: auto;
}
.your-stories__item--quarter .flag__img {
  position: absolute;
  bottom: 20px;
  left: 20px;
  z-index: 2;
}
.your-stories__item--quarter .flag__body {
  position: absolute;
  top: 20px;
  left: 20px;
  z-index: 2;
}
.your-stories__item--quarter .flag__body p {
  display: none;
}
.your-stories__item--quarter .your-stories__content {
  background-size: cover;
}
.your-stories__item--quarter .your-stories__content .img-wrap:before {
  background-color: rgba(35, 31, 32, 0.7);
}

.your-stories__item--video .img-wrap:after {
  content: '';
  position: absolute;
  left: 50%;
  top: 50%;
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 37px 0 37px 51px;
  border-color: transparent transparent transparent #ffffff;
  opacity: .8;
  z-index: 2;
}
.your-stories__item--video .img-wrap > div {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
}
.your-stories__item--video .img-wrap > div:before {
  content: '';
  position: absolute;
  z-index: 1;
  display: block;
  z-index: 2;
  background-color: rgba(255, 255, 255, 0.6);
  -moz-transform: rotate(-60deg);
  -ms-transform: rotate(-60deg);
  -webkit-transform: rotate(-60deg);
  transform: rotate(-60deg);
  width: 200%;
  height: 200%;
  left: -175%;
  top: -100%;
  transition: all .2s ease;
}
.your-stories__item--video .img-wrap:hover > div:before {
  background-color: rgba(255, 255, 255, 0.4);
}

.your-stories__text {
  position: absolute;
  bottom: 20px;
  left: 20px;
  right: 20px;
  z-index: 2;
}

.your-stories__social {
  position: absolute;
  top: 20px;
  right: 10px;
  z-index: 2;
}
.your-stories__social a {
  color: white;
  display: block;
  text-align: right;
  margin-bottom: 10px;
  vertical-align: middle;
  text-decoration: none;
  font-size: 10px;
  font-weight: 700;
}
.your-stories__social a:hover {
  color: #b7bdce;
}
.your-stories__social .icon-wrap {
  width: 38px;
  text-align: center;
}
.your-stories__social .icon {
  vertical-align: top;
}
.your-stories__social span {
  display: inline-block;
  vertical-align: middle;
}

/*------------------------------------*\
    #CAMPAIGNS
\*------------------------------------*/
.campaigns__item {
  background-size: cover;
  background-position: 50% 50%;
  position: relative;
  padding: 20px 25px;
  color: white;
}
.campaigns__item .img-wrap {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
}
.campaigns__item .img-wrap img {
  display: none;
}
.campaigns__item .img-wrap:before {
  content: '';
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  background-color: rgba(35, 31, 32, 0.7);
  transition: all .2s ease;
  z-index: 1;
}
.campaigns__item.is-hovered .img-wrap:before, .campaigns__item:hover .img-wrap:before {
  background-color: rgba(127, 63, 152, 0.8);
}
.campaigns__item.is-hovered .btn--primary, .campaigns__item:hover .btn--primary {
  color: #7f3f98;
  background-color: white;
}

.campaigns__item-content {
  position: relative;
  z-index: 2;
  font-size: 14px;
}
.campaigns__item-content h2, .campaigns__item-content h3 {
  margin-bottom: 10px;
  color: white;
}
.campaigns__item-content p {
  margin-bottom: 30px;
}

.campaigns__item-state {
  border: 1px solid white;
  padding: 0 10px;
  height: 25px;
  line-height: 25px;
  display: block;
  text-transform: uppercase;
  font-size: 12px;
  font-weight: 700;
}

.campaigns__item-days {
  font-size: 12px;
  font-weight: 700;
}

.campaigns__item-number {
  font-weight: 700;
  font-size: 15px;
}

.campaigns__item--disabled .img-wrap:before {
  background-color: rgba(51, 55, 66, 0.7);
}

.campaign-select-wrap {
  width: 320px;
  max-width: 100%;
}

/*------------------------------------*\
    #TOOLTIP
\*------------------------------------*/
.tooltip {
  position: relative;
}
.tooltip:hover .tooltip__content {
  visibility: visible;
  opacity: 1;
  margin-bottom: 20px;
}

.tooltip__content {
  text-align: left;
  position: absolute;
  bottom: 100%;
  left: 50%;
  -moz-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  background-color: #e9ebf0;
  padding: 15px 20px;
  visibility: hidden;
  opacity: 0;
  transition: all .2s ease;
  z-index: 1000;
  width: 190px;
}
.tooltip__content:before {
  content: '';
  position: absolute;
  top: 100%;
  left: 50%;
  display: block;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 12px 9px 0 9px;
  border-color: #e9ebf0 transparent transparent transparent;
  -moz-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
}

/*------------------------------------*\
    #BADGES
\*------------------------------------*/
.badges {
  padding-top: 30px;
  border-top: 1px solid #e5e8f1;
  padding-bottom: 30px;
  border-bottom: 1px solid #e5e8f1;
}
.badges h2 {
  margin-bottom: 30px;
}
.badges img {
  width: 66px;
  opacity: .4;
  transition: all .2s ease;
  margin-bottom: 20px;
}
.badges .tooltip:hover img {
  opacity: 1;
}

.badges__item {
  text-align: center;
}

/*------------------------------------*\
    #FIGURE
\*------------------------------------*/
figure {
  margin-bottom: 20px;
}
figure .img-wrap {
  position: relative;
}
figure .img-wrap img {
  position: relative;
  z-index: 1;
}
figure .img-wrap:after {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  display: block;
  background-image: url("../images/img-overlay.png");
  background-repeat: no-repeat;
  background-size: 100% 100%;
  z-index: 2;
}

/*------------------------------------*\
    #PROFILE BOX
\*------------------------------------*/
.profile-box {
  margin-bottom: 20px;
}
.profile-box .img-wrap {
  width: 140px;
  height: 140px;
  position: relative;
  overflow: hidden;
}
.profile-box .img-wrap img {
  width: 100%;
  position: absolute;
  left: 0;
  top: 0;
}
.profile-box .flag__img {
  padding-right: 0;
}
.profile-box .flag__img img {
  max-width: none;
}
.profile-box .flag__body {
  padding-left: 40px !important;
}
.profile-box .flag__body h3 {
  margin-bottom: 10px;
}
.profile-box .flag__body a {
  color: #808285;
}
.profile-box .media, .profile-box .flag {
  background-color: #f5f6f9;
}
.profile-box .media__body, .profile-box .flag__body {
  padding: 15px 20px 10px;
  position: relative;
}
.profile-box .media__body h3, .profile-box .flag__body h3 {
  display: inline-block;
  vertical-align: middle;
  line-height: 1;
  margin-bottom: 0;
  margin-right: 20px;
  padding-top: 10px;
  padding-bottom: 10px;
}
.profile-box .media__body p, .profile-box .flag__body p {
  line-height: 1.3;
}
.profile-box header {
  margin-bottom: 5px;
}
@media screen and (max-width: 768px) {
  .profile-box .media__img {
    float: none;
    margin-right: 0;
    margin-bottom: 20px;
  }
}
@media screen and (max-width: 950px) {
  .profile-box .flag, .profile-box .flag__body, .profile-box .flag__img {
    display: block;
  }
}

.profile-box__content {
  max-width: 650px;
  padding-right: 150px;
  font-size: 14px;
}
@media screen and (max-width: 550px) {
  .profile-box__content {
    max-width: none;
    padding-right: 0;
  }
}

.profile-box__social {
  position: absolute;
  top: 20px;
  right: 10px;
  z-index: 2;
}
.profile-box--small .profile-box__social {
  top: 50%;
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}
.profile-box__social a {
  color: #b7bdce;
  display: block;
  text-align: right;
  margin-bottom: 10px;
  vertical-align: middle;
  text-decoration: none;
  font-size: 10px;
  font-weight: 700;
}
.profile-box__social .icon-wrap {
  width: 38px;
  text-align: center;
}
.profile-box__social .icon {
  vertical-align: top;
}
.profile-box__social span {
  display: inline-block;
  vertical-align: middle;
}
.profile-box__social span:first-child {
  color: #075384;
}
@media screen and (max-width: 550px) {
  .profile-box__social {
    position: relative;
    top: auto !important;
    right: auto;
    -moz-transform: translateY(0) !important;
    -ms-transform: translateY(0) !important;
    -webkit-transform: translateY(0) !important;
    transform: translateY(0) !important;
  }
  .profile-box__social a {
    display: inline-block;
    margin-right: 10px;
  }
}

.profile-box--small {
  margin-bottom: 40px;
}

/*------------------------------------*\
    #WRITE STORY
\*------------------------------------*/
@media screen and (min-width: 769px) {
  .write-story textarea {
    height: 272px;
  }
}

.write-story__tooltip {
  background-color: #e9ebf0;
  padding: 9px 20px;
  font-size: 14px;
  position: relative;
  line-height: 1.3;
  display: none;
}
.write-story__tooltip p {
  color: #414042;
}
.write-story__tooltip:before {
  content: '';
  display: block;
  position: absolute;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0 9px 12px 9px;
  border-color: transparent transparent #e9ebf0 transparent;
  bottom: 100%;
  left: 10px;
}
@media screen and (min-width: 769px) {
  .write-story__tooltip:before {
    border-width: 9px 12px 9px 0;
    border-color: transparent #e9ebf0 transparent transparent;
    left: auto;
    bottom: auto;
    right: 100%;
    top: 10px;
  }
}

@media screen and (min-width: 769px) {
  .write-story__tooltip--large {
    margin-top: 36px;
  }
}

.write-story__upload-icons {
  color: #b7bdce;
  font-size: 14px;
  margin-bottom: 5px;
}
.write-story__upload-icons span {
  vertical-align: middle;
}
.write-story__upload-icons a {
  color: #b7bdce;
  text-decoration: none;
  display: inline-block;
  vertical-align: middle;
  margin-right: 10px;
}
.write-story__upload-icons a:hover {
  color: #7a85a5;
}

.write-story__boxes {
  padding-bottom: 10px;
}
.write-story__boxes .img-wrap {
  padding-bottom: 73%;
  background-size: cover;
  background-position: 50% 50%;
  position: relative;
  display: block;
  background-color: #333742;
}
.write-story__boxes .img-wrap:before {
  content: '';
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  z-index: 1;
  transition: all .2s ease;
}
.magnific-popup .write-story__boxes .img-wrap:before {
  display: none;
}
.write-story__boxes .img-wrap:after {
  content: '';
  display: block;
  position: absolute;
  left: 50%;
  top: 50%;
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  background-image: url("../images/icon-plus.svg");
  background-position: 50% 50%;
  background-size: 16px 16px;
  background-repeat: no-repeat;
  width: 30px;
  height: 30px;
  border: 2px solid white;
  opacity: 0;
  visibility: hidden;
  transition: all .2s ease;
  border-radius: 50%;
  z-index: 3;
}
.magnific-popup .write-story__boxes .img-wrap:after {
  display: none;
}
.write-story-popup--videos .write-story__boxes .img-wrap:after {
  display: block;
  width: 0;
  height: 0;
  background: none;
  border-radius: 0;
  border-style: solid;
  border-width: 15px 0 15px 22px;
  border-color: transparent transparent transparent #ffffff;
  opacity: .8;
  visibility: visible;
  z-index: 1;
}
.write-story-popup--sound .write-story__boxes .img-wrap {
  text-align: center;
  position: relative;
}
.write-story-popup--sound .write-story__boxes .img-wrap > div {
  position: absolute;
  top: 50%;
  width: 100%;
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  left: 0;
  color: #e9ebf0;
}
.write-story-popup--sound .write-story__boxes .img-wrap .icon {
  margin-bottom: 15px;
}
.write-story__boxes .img-wrap:hover p {
  opacity: 0;
  visibility: hidden;
}
.write-story__boxes .img-wrap:hover:before {
  opacity: .9;
  background-color: #7f3f98;
}
.write-story__boxes .img-wrap:hover:after {
  opacity: 1;
  visibility: visible;
}
.write-story__boxes img {
  display: none;
}
.magnific-popup .write-story__boxes img {
  opacity: 0;
  display: block;
  position: absolute;
  left: 50%;
  top: 50%;
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  min-width: 100%;
  min-height: 100%;
  max-width: none;
  max-height: none;
  z-index: 2;
}
.write-story__boxes p {
  -moz-backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  margin-bottom: 0;
  text-align: center;
  color: white;
  font-weight: 700;
  font-size: 12px;
  position: absolute;
  top: 50%;
  width: 100%;
  left: 0;
  right: 0;
  z-index: 2;
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  transition: all .2s ease;
}

.write-story-popup__item {
  border: 1px solid #e9ebf0;
  padding: 20px;
}

/*------------------------------------*\
    #MAGNIFIC POPUP
\*------------------------------------*/
.mfp-container {
  background-color: black;
  background-color: rgba(0, 0, 0, 0.8);
  padding: 0;
}

.btn--openpopup {
  outline: none;
}

.magnific-popup {
  padding: 0;
  background-color: white;
  padding: 35px 40px 40px;
  max-height: 95vh;
  overflow-y: auto;
}
.magnific-popup .mfp-close {
  position: absolute;
  right: 40px;
  top: 40px;
  width: 21px;
  height: 21px;
  box-sizing: border-box;
  cursor: pointer;
  padding: 0;
  opacity: 1;
  display: block;
  margin-bottom: 0;
  background-image: url("../images/icon-close-popup.svg");
  background-repeat: no-repeat;
  background-position: 50% 50%;
  font-size: 0;
}
.magnific-popup .mfp-close .icon {
  position: relative;
  z-index: 1;
}
.magnific-popup .icon-wrap {
  text-align: center;
  border-radius: 50%;
  display: inline-block;
  width: 52px;
  height: 52px;
  border: 2px solid #a1a9bc;
  position: relative;
  margin-left: 3px;
  margin-right: 3px;
}
.magnific-popup .icon-wrap .icon {
  position: absolute;
  left: 50%;
  top: 50%;
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}

.mfp-content {
  margin: 0 auto;
  width: 100%;
  max-width: 1120px;
}

.mfp-bg {
  background-color: transparent;
}

.magnific-animate {
  opacity: 0;
  transition: all .3s ease;
  -moz-transform: translate(0, -30%);
  -ms-transform: translate(0, -30%);
  -webkit-transform: translate(0, -30%);
  transform: translate(0, -30%);
}

/**
 * Fade-move animation for first dialog
 */
/* start state */
.my-mfp-zoom-in .magnific-animate {
  opacity: 0;
}

/* animate in */
.my-mfp-zoom-in.mfp-ready .magnific-animate {
  opacity: 1;
  -moz-transform: translate(0, 0);
  -ms-transform: translate(0, 0);
  -webkit-transform: translate(0, 0);
  transform: translate(0, 0);
}

/* animate out */
.my-mfp-zoom-in.mfp-removing .magnific-animate {
  opacity: 0;
  -moz-transform: translate(0, -30%);
  -ms-transform: translate(0, -30%);
  -webkit-transform: translate(0, -30%);
  transform: translate(0, -30%);
}

/* Dark overlay, start state */
.my-mfp-zoom-in.mfp-bg {
  opacity: .001;
  /* Chrome opacity transition bug */
  transition: all .3s ease;
}

/* animate in */
.my-mfp-zoom-in.mfp-ready.mfp-bg {
  opacity: 0.8;
}

/* animate out */
.my-mfp-zoom-in.mfp-removing.mfp-bg {
  opacity: 0;
}

/*------------------------------------*\
    #DROPZONE
\*------------------------------------*/
.dropzone .dz-preview .dz-error-mark, .dropzone .dz-preview .dz-success-mark {
  position: absolute;
  display: none;
  left: 30px;
  top: 30px;
  width: 54px;
  height: 58px;
  left: 50%;
  margin-left: -27px;
}

.dropzone .dz-preview .dz-details .dz-size span, .dropzone .dz-preview .dz-details .dz-filename span {
  background-color: rgba(255, 255, 255, 0.4);
  padding: 0 0.4em;
  border-radius: 3px;
}

.dropzone .dz-preview .dz-error-mark, .dropzone .dz-preview .dz-success-mark {
  pointer-events: none;
  opacity: 0;
  z-index: 500;
  position: absolute;
  display: block;
  top: 50%;
  left: 50%;
  margin-left: -27px;
  margin-top: -27px;
}

.dropzone .dz-preview .dz-error-mark svg, .dropzone .dz-preview .dz-success-mark svg {
  display: block;
  width: 54px;
  height: 54px;
}

.dropzone {
  box-sizing: border-box;
  position: relative;
  min-height: 246px;
  background: white;
}
.dropzone:before {
  content: '';
  z-index: 2;
  position: absolute;
  width: 100%;
  height: 100%;
  display: block;
  left: 0;
  top: 0;
}
.dropzone .dropzone-bgr-content {
  position: absolute;
  left: 50%;
  top: 50%;
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  color: #e9ebf0;
  z-index: 1;
  text-align: center;
}
.dropzone .dropzone-bgr-content .icon {
  width: 92px;
  height: 92px;
  margin-bottom: 35px;
}
.dropzone .dropzone-bgr-content p {
  color: #333742;
  font-size: 14px;
  text-align: center;
  text-transform: uppercase;
  margin-bottom: 0;
}
.dropzone input {
  display: none;
}
.dropzone .dz-preview {
  width: 120px;
  position: relative;
  display: inline-block;
  vertical-align: top;
  margin: 9px;
  min-height: 100px;
  z-index: 3;
}
.dropzone .dz-preview .dz-progress {
  display: block;
  height: 15px;
  border: 1px solid #aaa;
  opacity: 1;
  z-index: 1000;
  pointer-events: none;
  position: absolute;
  height: 16px;
  left: 50%;
  top: 50%;
  margin-top: -8px;
  width: 80px;
  margin-left: -40px;
  background: rgba(255, 255, 255, 0.9);
  border-radius: 8px;
  overflow: hidden;
}
.dropzone .dz-preview .dz-progress .dz-upload {
  display: block;
  height: 100%;
  background: green;
  background: #333;
  background: linear-gradient(to bottom, #666666, #444444);
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  width: 0;
  transition: width 300ms ease-in-out;
}
.dropzone .dz-preview .dz-error-message {
  color: red;
  pointer-events: none;
  z-index: 1000;
  position: absolute;
  display: block;
  display: none;
  opacity: 0;
  transition: opacity 0.3s ease;
  border-radius: 8px;
  font-size: 13px;
  top: 130px;
  left: -10px;
  width: 140px;
  background: #be2626;
  background: linear-gradient(to bottom, #be2626, #a92222);
  padding: 0.5em 1.2em;
  color: white;
}
.dropzone .dz-preview .dz-error-message:after {
  content: '';
  position: absolute;
  top: -6px;
  left: 64px;
  width: 0;
  height: 0;
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-bottom: 6px solid #be2626;
}
.dropzone .dz-preview.dz-error .dz-error-mark {
  display: block;
  opacity: 1;
  animation: slide-in 3s cubic-bezier(0.77, 0, 0.175, 1);
}
.dropzone .dz-preview.dz-error:hover .dz-error-message {
  opacity: 1;
  pointer-events: auto;
}
.dropzone .dz-preview:hover {
  z-index: 1000;
}
.dropzone .dz-preview:hover .dz-details {
  opacity: 1;
}
.dropzone .dz-preview.dz-file-preview .dz-image {
  border-radius: 20px;
  background: #999;
  background: linear-gradient(to bottom, #eeeeee, #dddddd);
}
.dropzone .dz-preview.dz-file-preview .dz-details {
  opacity: 1;
}
.dropzone .dz-preview.dz-image-preview {
  background: white;
}
.dropzone .dz-preview.dz-image-preview .dz-details {
  transition: opacity 0.2s linear;
}
.dropzone .dz-preview .dz-remove {
  font-size: 14px;
  text-align: center;
  display: block;
  cursor: pointer;
  border: none;
  color: red;
}
.dropzone .dz-preview .dz-remove:hover {
  text-decoration: underline;
}
.dropzone .dz-preview .dz-details {
  z-index: 20;
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
  font-size: 13px;
  min-width: 100%;
  max-width: 100%;
  padding: 2em 1em;
  text-align: center;
  color: rgba(0, 0, 0, 0.9);
  line-height: 150%;
}
.dropzone .dz-preview .dz-details .dz-size {
  margin-bottom: 1em;
  font-size: 16px;
}
.dropzone .dz-preview .dz-details .dz-filename {
  white-space: nowrap;
}
.dropzone .dz-preview .dz-details .dz-filename:hover span {
  border: 1px solid rgba(200, 200, 200, 0.8);
  background-color: rgba(255, 255, 255, 0.8);
}
.dropzone .dz-preview .dz-details .dz-filename:not(:hover) {
  overflow: hidden;
  text-overflow: ellipsis;
}
.dropzone .dz-preview .dz-details .dz-filename:not(:hover) span {
  border: 1px solid transparent;
}
.dropzone .dz-preview .dz-image {
  border-radius: 20px;
  overflow: hidden;
  width: 120px;
  height: 120px;
  position: relative;
  display: block;
  z-index: 10;
}
.dropzone .dz-preview .dz-image img {
  display: block;
  left: 50%;
  top: 50%;
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  position: absolute;
  min-width: 100%;
  min-height: 100%;
  max-width: none;
  max-height: none;
}
.dropzone .dz-preview.dz-success .dz-success-mark {
  display: block;
  animation: passing-through 3s cubic-bezier(0.77, 0, 0.175, 1);
}
.dropzone .dz-preview.dz-processing .dz-progress {
  opacity: 1;
  transition: all 0.2s linear;
}
.dropzone .dz-preview.dz-complete .dz-progress {
  opacity: 0;
  transition: opacity 0.4s ease-in;
}
.dropzone .dz-preview:not(.dz-processing) .dz-progress {
  animation: pulse 6s ease infinite;
}
.dropzone.dz-clickable {
  cursor: pointer;
}
.dropzone.dz-clickable * {
  cursor: default;
}
.dropzone.dz-clickable .dz-message {
  display: none;
  cursor: pointer;
}
.dropzone.dz-clickable .dz-message * {
  cursor: pointer;
}
.dropzone.dz-drag-hover {
  border-style: solid;
}
.dropzone.dz-drag-hover .dz-message {
  opacity: 0.5;
}
.dropzone .dz-message {
  text-align: center;
  margin: 2em 0;
}
.dropzone.dz-started .dz-message {
  display: none;
}

@-webkit-keyframes passing-through {
  0% {
    opacity: 0;
    transform: translateY(40px);
  }
  30% {
    opacity: 1;
    transform: translateY(0px);
  }
  70% {
    opacity: 1;
    transform: translateY(0px);
  }
  100% {
    opacity: 0;
    transform: translateY(-40px);
  }
}
@-moz-keyframes passing-through {
  0% {
    opacity: 0;
    transform: translateY(40px);
  }
  30% {
    opacity: 1;
    transform: translateY(0px);
  }
  70% {
    opacity: 1;
    transform: translateY(0px);
  }
  100% {
    opacity: 0;
    transform: translateY(-40px);
  }
}
@keyframes passing-through {
  0% {
    opacity: 0;
    transform: translateY(40px);
  }
  30% {
    opacity: 1;
    transform: translateY(0px);
  }
  70% {
    opacity: 1;
    transform: translateY(0px);
  }
  100% {
    opacity: 0;
    transform: translateY(-40px);
  }
}
@-webkit-keyframes slide-in {
  0% {
    opacity: 0;
    transform: translateY(40px);
  }
  30% {
    opacity: 1;
    transform: translateY(0px);
  }
}
@-moz-keyframes slide-in {
  0% {
    opacity: 0;
    transform: translateY(40px);
  }
  30% {
    opacity: 1;
    transform: translateY(0px);
  }
}
@keyframes slide-in {
  0% {
    opacity: 0;
    transform: translateY(40px);
  }
  30% {
    opacity: 1;
    transform: translateY(0px);
  }
}
@-webkit-keyframes pulse {
  0% {
    transform: scale(1);
  }
  10% {
    transform: scale(1.1);
  }
  20% {
    transform: scale(1);
  }
}
@-moz-keyframes pulse {
  0% {
    transform: scale(1);
  }
  10% {
    transform: scale(1.1);
  }
  20% {
    transform: scale(1);
  }
}
@keyframes pulse {
  0% {
    transform: scale(1);
  }
  10% {
    transform: scale(1.1);
  }
  20% {
    transform: scale(1);
  }
}
/*------------------------------------*\
    #TABS
\*------------------------------------*/
.tabs__nav {
  margin-bottom: 0;
  margin-left: 0;
  list-style-type: none;
  font-size: 0;
}
.tabs__nav li {
  width: 33.33%;
  display: inline-block;
}
.tabs__nav .is-active {
  background-color: #f5f6f9 !important;
  color: #414042 !important;
}
.tabs__nav a {
  font-size: 14px;
  font-weight: 700;
  display: block;
  height: 36px;
  line-height: 36px;
  text-align: center;
  color: white;
  background-color: #333742;
  text-decoration: none;
}
.tabs__nav a:hover {
  background-color: #075384;
}

.tabs__item {
  display: none;
  padding: 40px 20px 0;
  background-color: #f5f6f9;
}
.no-js .tabs__item {
  display: block;
}

/*------------------------------------*\
    #COMMENTS
\*------------------------------------*/
.comments {
  border-bottom: 1px solid #e5e8f1;
}

.comments__item {
  border-top: 1px solid #e5e8f1;
  padding-top: 40px;
  padding-bottom: 40px;
}
.comments__item + .comments__item {
  border-top: none;
  padding-top: 0;
}

.comments__sort {
  margin-bottom: 35px;
}
.comments__sort span {
  font-weight: 700;
  font-size: 14px;
  color: #414042;
  margin-right: 40px;
  display: inline-block;
  vertical-align: middle;
}
.comments__sort ul {
  margin-left: auto;
  margin-bottom: 0;
  list-style-type: none;
  font-size: 0;
  display: inline-block;
  vertical-align: middle;
}
.comments__sort li {
  display: inline-block;
  vertical-align: middle;
  margin-right: 40px;
}
.comments__sort a {
  font-size: 14px;
  color: #333742;
}

.comments__item-header .flag {
  background-color: #f5f6f9;
}
.comments__item-header .flag__body h4 {
  display: inline-block;
  vertical-align: middle;
  margin-bottom: 0;
}
.comments__item-header .flag__body span {
  display: inline-block;
  vertical-align: middle;
  font-size: 14px;
}
.comments__item-header .flag__body span:before {
  content: '•';
  margin-right: 10px;
  margin-left: 10px;
  display: inline-block;
  vertical-align: middle;
  font-size: 17px;
}

.comments__item-text {
  padding: 20px 0;
  font-size: 14px;
}
.comments__item-text p {
  margin-bottom: 0;
}

.comments__item-reply {
  font-weight: 700;
  color: #414042;
  padding-left: 30px;
  position: relative;
}
.comments__item-reply:before {
  content: '';
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 6px 5.5px 0 5.5px;
  border-color: #b7bdce transparent transparent transparent;
  display: inline-block;
  vertical-align: middle;
  position: absolute;
  left: 10px;
  top: 50%;
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}

.comments__item-reply-time {
  display: inline-block;
  vertical-align: middle;
  font-size: 14px;
}
.comments__item-reply-time:before {
  content: '•';
  margin-right: 10px;
  margin-left: 10px;
  display: inline-block;
  vertical-align: middle;
  font-size: 17px;
}

.comments__item-report {
  color: #333742;
  font-size: 14px;
}

.comments__item--replied {
  padding-left: 40px;
  position: relative;
}
.comments__item--replied:before, .comments__item--replied:after {
  content: '';
  position: absolute;
  display: block;
  background-color: #e5e8f1;
}
.comments__item--replied:before {
  top: 29px;
  left: 9px;
  height: 1px;
  width: 20px;
}
.comments__item--replied:after {
  width: 1px;
  bottom: 40px;
  top: 0;
  left: 9px;
}

/*------------------------------------*\
    #SIDE TABS
\*------------------------------------*/
.side-tabs__element {
  color: #333742;
  display: block;
  padding-bottom: 20px;
}
.side-tabs__element .media__img {
  display: block;
  width: 80px;
  height: 80px;
  position: relative;
  overflow: hidden;
}
@media screen and (min-width: 769px) and (max-width: 1025px) {
  .side-tabs__element .media__img {
    float: none;
    margin-right: 0;
    margin-bottom: 20px;
  }
}
@media screen and (max-width: 480px) {
  .side-tabs__element .media__img {
    float: none;
    margin-right: 0;
    margin-bottom: 20px;
  }
}
.side-tabs__element img {
  position: absolute;
  left: 50%;
  top: 50%;
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  min-width: 100%;
  min-height: 100%;
  max-width: none;
  max-height: none;
}
.side-tabs__element h5 {
  color: #414042;
}
.side-tabs__element:hover {
  text-decoration: none;
}

/*------------------------------------*\
    #FILTER
\*------------------------------------*/
.filter-item {
  margin-bottom: 40px;
}
.filter-item a {
  display: inline-block;
  vertical-align: middle;
  padding-left: 25px;
  padding-right: 25px;
  color: #7f3f98;
  font-weight: 700;
  text-decoration: none;
  height: 30px;
  line-height: 30px;
}
.filter-item a:hover {
  color: #333742;
}
.filter-item a.is-active {
  color: white;
  background-color: #7f3f98;
}
.filter-item.your-stories-filter {
  margin-bottom: 0;
}

/*------------------------------------*\
    #WOW SECTION
\*------------------------------------*/
.wow-section {
  text-align: center;
  padding: 50px 0 60px;
  border-top: 1px solid #e5e8f1;
}
.wow-section h2 {
  margin-bottom: 40px;
  font-family: Arial, sans-serif;
}

/*------------------------------------*\
    #SHAME
\*------------------------------------*/
.is-invisible {
  -moz-transition: all 0.1s ease;
  -o-transition: all 0.1s ease;
  -webkit-transition: all 0.1s ease;
  transition: all 0.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: 20px !important;
}

.mt {
  margin-top: 20px !important;
}

.mr {
  margin-right: 20px !important;
}

.mb {
  margin-bottom: 20px !important;
}

.ml {
  margin-left: 20px !important;
}

.mh {
  margin-right: 20px !important;
  margin-left: 20px !important;
}

.mv {
  margin-top: 20px !important;
  margin-bottom: 20px !important;
}

/**
 * Add tiny margins.
 */
.m-- {
  margin: 5px !important;
}

.mt-- {
  margin-top: 5px !important;
}

.mr-- {
  margin-right: 5px !important;
}

.mb-- {
  margin-bottom: 5px !important;
}

.ml-- {
  margin-left: 5px !important;
}

.mh-- {
  margin-right: 5px !important;
  margin-left: 5px !important;
}

.mv-- {
  margin-top: 5px !important;
  margin-bottom: 5px !important;
}

/**
 * Add small margins.
 */
.m- {
  margin: 10px !important;
}

.mt- {
  margin-top: 10px !important;
}

.mr- {
  margin-right: 10px !important;
}

.mb- {
  margin-bottom: 10px !important;
}

.ml- {
  margin-left: 10px !important;
}

.mh- {
  margin-right: 10px !important;
  margin-left: 10px !important;
}

.mv- {
  margin-top: 10px !important;
  margin-bottom: 10px !important;
}

/**
 * Add large margins.
 */
.m\+ {
  margin: 40px !important;
}

.mt\+ {
  margin-top: 40px !important;
}

.mr\+ {
  margin-right: 40px !important;
}

.mb\+ {
  margin-bottom: 40px !important;
}

.ml\+ {
  margin-left: 40px !important;
}

.mh\+ {
  margin-right: 40px !important;
  margin-left: 40px !important;
}

.mv\+ {
  margin-top: 40px !important;
  margin-bottom: 40px !important;
}

/**
 * Add huge margins.
 */
.m\+\+ {
  margin: 80px !important;
}

.mt\+\+ {
  margin-top: 80px !important;
}

.mr\+\+ {
  margin-right: 80px !important;
}

.mb\+\+ {
  margin-bottom: 80px !important;
}

.ml\+\+ {
  margin-left: 80px !important;
}

.mh\+\+ {
  margin-right: 80px !important;
  margin-left: 80px !important;
}

.mv\+\+ {
  margin-top: 80px !important;
  margin-bottom: 80px !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: -20px !important;
}

.-mt {
  margin-top: -20px !important;
}

.-mr {
  margin-right: -20px !important;
}

.-mb {
  margin-bottom: -20px !important;
}

.-ml {
  margin-left: -20px !important;
}

.-mh {
  margin-right: -20px !important;
  margin-left: -20px !important;
}

.-mv {
  margin-top: -20px !important;
  margin-bottom: -20px !important;
}

/**
 * Large negative margins.
 */
.-m\+ {
  margin: -40px !important;
}

.-mt\+ {
  margin-top: -40px !important;
}

.-mr\+ {
  margin-right: -40px !important;
}

.-mb\+ {
  margin-bottom: -40px !important;
}

.-ml\+ {
  margin-left: -40px !important;
}

.-mh\+ {
  margin-right: -40px !important;
  margin-left: -40px !important;
}

.-mv\+ {
  margin-top: -40px !important;
  margin-bottom: -40px !important;
}

/**
 * Padding helper classes.
 *
 * Add paddings.
 */
.p {
  padding: 20px !important;
}

.pt {
  padding-top: 20px !important;
}

.pr {
  padding-right: 20px !important;
}

.pb {
  padding-bottom: 20px !important;
}

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

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

.pv {
  padding-top: 20px !important;
  padding-bottom: 20px !important;
}

/**
 * Add tiny paddings.
 */
.p-- {
  padding: 5px !important;
}

.pt-- {
  padding-top: 5px !important;
}

.pr-- {
  padding-right: 5px !important;
}

.pb-- {
  padding-bottom: 5px !important;
}

.pl-- {
  padding-left: 5px !important;
}

.ph-- {
  padding-right: 5px !important;
  padding-left: 5px !important;
}

.pv-- {
  padding-top: 5px !important;
  padding-bottom: 5px !important;
}

/**
 * Add small paddings.
 */
.p- {
  padding: 10px !important;
}

.pt- {
  padding-top: 10px !important;
}

.pr- {
  padding-right: 10px !important;
}

.pb- {
  padding-bottom: 10px !important;
}

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

.ph- {
  padding-right: 10px !important;
  padding-left: 10px !important;
}

.pv- {
  padding-top: 10px !important;
  padding-bottom: 10px !important;
}

/**
 * Add large paddings.
 */
.p\+ {
  padding: 40px !important;
}

.pt\+ {
  padding-top: 40px !important;
}

.pr\+ {
  padding-right: 40px !important;
}

.pb\+ {
  padding-bottom: 40px !important;
}

.pl\+ {
  padding-left: 40px !important;
}

.ph\+ {
  padding-right: 40px !important;
  padding-left: 40px !important;
}

.pv\+ {
  padding-top: 40px !important;
  padding-bottom: 40px !important;
}

/**
 * Add huge paddings.
 */
.p\+\+ {
  padding: 80px !important;
}

.pt\+\+ {
  padding-top: 80px !important;
}

.pr\+\+ {
  padding-right: 80px !important;
}

.pb\+\+ {
  padding-bottom: 80px !important;
}

.pl\+\+ {
  padding-left: 80px !important;
}

.ph\+\+ {
  padding-right: 80px !important;
  padding-left: 80px !important;
}

.pv\+\+ {
  padding-top: 80px !important;
  padding-bottom: 80px !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: 20px !important;
  }

  .medium-mt {
    margin-top: 20px !important;
  }

  .medium-mr {
    margin-right: 20px !important;
  }

  .medium-mb {
    margin-bottom: 20px !important;
  }

  .medium-ml {
    margin-left: 20px !important;
  }

  .medium-mh {
    margin-right: 20px !important;
    margin-left: 20px !important;
  }

  .medium-mv {
    margin-top: 20px !important;
    margin-bottom: 20px !important;
  }
}
@media screen and (min-width: 481px) {
  .medium-and-up-m {
    margin: 20px !important;
  }

  .medium-and-up-mt {
    margin-top: 20px !important;
  }

  .medium-and-up-mr {
    margin-right: 20px !important;
  }

  .medium-and-up-mb {
    margin-bottom: 20px !important;
  }

  .medium-and-up-ml {
    margin-left: 20px !important;
  }

  .medium-and-up-mh {
    margin-right: 20px !important;
    margin-left: 20px !important;
  }

  .medium-and-up-mv {
    margin-top: 20px !important;
    margin-bottom: 20px !important;
  }
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  .large-m {
    margin: 20px !important;
  }

  .large-mt {
    margin-top: 20px !important;
  }

  .large-mr {
    margin-right: 20px !important;
  }

  .large-mb {
    margin-bottom: 20px !important;
  }

  .large-ml {
    margin-left: 20px !important;
  }

  .large-mh {
    margin-right: 20px !important;
    margin-left: 20px !important;
  }

  .large-mv {
    margin-top: 20px !important;
    margin-bottom: 20px !important;
  }
}
@media screen and (min-width: 769px) {
  .large-and-up-m {
    margin: 20px !important;
  }

  .large-and-up-mt {
    margin-top: 20px !important;
  }

  .large-and-up-mr {
    margin-right: 20px !important;
  }

  .large-and-up-mb {
    margin-bottom: 20px !important;
  }

  .large-and-up-ml {
    margin-left: 20px !important;
  }

  .large-and-up-mh {
    margin-right: 20px !important;
    margin-left: 20px !important;
  }

  .large-and-up-mv {
    margin-top: 20px !important;
    margin-bottom: 20px !important;
  }
}
@media screen and (min-width: 1025px) {
  .extralarge-and-up-m {
    margin: 20px !important;
  }

  .extralarge-and-up-mt {
    margin-top: 20px !important;
  }

  .extralarge-and-up-mr {
    margin-right: 20px !important;
  }

  .extralarge-and-up-mb {
    margin-bottom: 20px !important;
  }

  .extralarge-and-up-ml {
    margin-left: 20px !important;
  }

  .extralarge-and-up-mh {
    margin-right: 20px !important;
    margin-left: 20px !important;
  }

  .extralarge-and-up-mv {
    margin-top: 20px !important;
    margin-bottom: 20px !important;
  }
}
/**
 * Add tiny margins.
 */
@media screen and (min-width: 481px) and (max-width: 768px) {
  .medium-m-- {
    margin: 5px !important;
  }

  .medium-mt-- {
    margin-top: 5px !important;
  }

  .medium-mr-- {
    margin-right: 5px !important;
  }

  .medium-mb-- {
    margin-bottom: 5px !important;
  }

  .medium-ml-- {
    margin-left: 5px !important;
  }

  .medium-mh-- {
    margin-right: 5px !important;
    margin-left: 5px !important;
  }

  .medium-mv-- {
    margin-top: 5px !important;
    margin-bottom: 5px !important;
  }
}
@media screen and (min-width: 481px) {
  .medium-and-up-m-- {
    margin: 5px !important;
  }

  .medium-and-up-mt-- {
    margin-top: 5px !important;
  }

  .medium-and-up-mr-- {
    margin-right: 5px !important;
  }

  .medium-and-up-mb-- {
    margin-bottom: 5px !important;
  }

  .medium-and-up-ml-- {
    margin-left: 5px !important;
  }

  .medium-and-up-mh-- {
    margin-right: 5px !important;
    margin-left: 5px !important;
  }

  .medium-and-up-mv-- {
    margin-top: 5px !important;
    margin-bottom: 5px !important;
  }
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  .large-m-- {
    margin: 5px !important;
  }

  .large-mt-- {
    margin-top: 5px !important;
  }

  .large-mr-- {
    margin-right: 5px !important;
  }

  .large-mb-- {
    margin-bottom: 5px !important;
  }

  .large-ml-- {
    margin-left: 5px !important;
  }

  .large-mh-- {
    margin-right: 5px !important;
    margin-left: 5px !important;
  }

  .large-mv-- {
    margin-top: 5px !important;
    margin-bottom: 5px !important;
  }
}
@media screen and (min-width: 769px) {
  .large-and-up-m-- {
    margin: 5px !important;
  }

  .large-and-up-mt-- {
    margin-top: 5px !important;
  }

  .large-and-up-mr-- {
    margin-right: 5px !important;
  }

  .large-and-up-mb-- {
    margin-bottom: 5px !important;
  }

  .large-and-up-ml-- {
    margin-left: 5px !important;
  }

  .large-and-up-mh-- {
    margin-right: 5px !important;
    margin-left: 5px !important;
  }

  .large-and-up-mv-- {
    margin-top: 5px !important;
    margin-bottom: 5px !important;
  }
}
@media screen and (min-width: 1025px) {
  .extralarge-and-up-m-- {
    margin: 5px !important;
  }

  .extralarge-and-up-mt-- {
    margin-top: 5px !important;
  }

  .extralarge-and-up-mr-- {
    margin-right: 5px !important;
  }

  .extralarge-and-up-mb-- {
    margin-bottom: 5px !important;
  }

  .extralarge-and-up-ml-- {
    margin-left: 5px !important;
  }

  .extralarge-and-up-mh-- {
    margin-right: 5px !important;
    margin-left: 5px !important;
  }

  .extralarge-and-up-mv-- {
    margin-top: 5px !important;
    margin-bottom: 5px !important;
  }
}
/**
 * Add small margins.
 */
@media screen and (min-width: 481px) and (max-width: 768px) {
  .medium-m- {
    margin: 10px !important;
  }

  .medium-mt- {
    margin-top: 10px !important;
  }

  .medium-mr- {
    margin-right: 10px !important;
  }

  .medium-mb- {
    margin-bottom: 10px !important;
  }

  .medium-ml- {
    margin-left: 10px !important;
  }

  .medium-mh- {
    margin-right: 10px !important;
    margin-left: 10px !important;
  }

  .medium-mv- {
    margin-top: 10px !important;
    margin-bottom: 10px !important;
  }
}
@media screen and (min-width: 481px) {
  .medium-and-up-m- {
    margin: 10px !important;
  }

  .medium-and-up-mt- {
    margin-top: 10px !important;
  }

  .medium-and-up-mr- {
    margin-right: 10px !important;
  }

  .medium-and-up-mb- {
    margin-bottom: 10px !important;
  }

  .medium-and-up-ml- {
    margin-left: 10px !important;
  }

  .medium-and-up-mh- {
    margin-right: 10px !important;
    margin-left: 10px !important;
  }

  .medium-and-up-mv- {
    margin-top: 10px !important;
    margin-bottom: 10px !important;
  }
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  .large-m- {
    margin: 10px !important;
  }

  .large-mt- {
    margin-top: 10px !important;
  }

  .large-mr- {
    margin-right: 10px !important;
  }

  .large-mb- {
    margin-bottom: 10px !important;
  }

  .large-ml- {
    margin-left: 10px !important;
  }

  .large-mh- {
    margin-right: 10px !important;
    margin-left: 10px !important;
  }

  .large-mv- {
    margin-top: 10px !important;
    margin-bottom: 10px !important;
  }
}
@media screen and (min-width: 769px) {
  .large-and-up-m- {
    margin: 10px !important;
  }

  .large-and-up-mt- {
    margin-top: 10px !important;
  }

  .large-and-up-mr- {
    margin-right: 10px !important;
  }

  .large-and-up-mb- {
    margin-bottom: 10px !important;
  }

  .large-and-up-ml- {
    margin-left: 10px !important;
  }

  .large-and-up-mh- {
    margin-right: 10px !important;
    margin-left: 10px !important;
  }

  .large-and-up-mv- {
    margin-top: 10px !important;
    margin-bottom: 10px !important;
  }
}
@media screen and (min-width: 1025px) {
  .extralarge-and-up-m- {
    margin: 10px !important;
  }

  .extralarge-and-up-mt- {
    margin-top: 10px !important;
  }

  .extralarge-and-up-mr- {
    margin-right: 10px !important;
  }

  .extralarge-and-up-mb- {
    margin-bottom: 10px !important;
  }

  .extralarge-and-up-ml- {
    margin-left: 10px !important;
  }

  .extralarge-and-up-mh- {
    margin-right: 10px !important;
    margin-left: 10px !important;
  }

  .extralarge-and-up-mv- {
    margin-top: 10px !important;
    margin-bottom: 10px !important;
  }
}
/**
 * Add large margins.
 */
@media screen and (min-width: 481px) and (max-width: 768px) {
  .medium-m\+ {
    margin: 40px !important;
  }

  .medium-mt\+ {
    margin-top: 40px !important;
  }

  .medium-mr\+ {
    margin-right: 40px !important;
  }

  .medium-mb\+ {
    margin-bottom: 40px !important;
  }

  .medium-ml\+ {
    margin-left: 40px !important;
  }

  .medium-mh\+ {
    margin-right: 40px !important;
    margin-left: 40px !important;
  }

  .medium-mv\+ {
    margin-top: 40px !important;
    margin-bottom: 40px !important;
  }
}
@media screen and (min-width: 481px) {
  .medium-and-up-m\+ {
    margin: 40px !important;
  }

  .medium-and-up-mt\+ {
    margin-top: 40px !important;
  }

  .medium-and-up-mr\+ {
    margin-right: 40px !important;
  }

  .medium-and-up-mb\+ {
    margin-bottom: 40px !important;
  }

  .medium-and-up-ml\+ {
    margin-left: 40px !important;
  }

  .medium-and-up-mh\+ {
    margin-right: 40px !important;
    margin-left: 40px !important;
  }

  .medium-and-up-mv\+ {
    margin-top: 40px !important;
    margin-bottom: 40px !important;
  }
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  .large-m\+ {
    margin: 40px !important;
  }

  .large-mt\+ {
    margin-top: 40px !important;
  }

  .large-mr\+ {
    margin-right: 40px !important;
  }

  .large-mb\+ {
    margin-bottom: 40px !important;
  }

  .large-ml\+ {
    margin-left: 40px !important;
  }

  .large-mh\+ {
    margin-right: 40px !important;
    margin-left: 40px !important;
  }

  .large-mv\+ {
    margin-top: 40px !important;
    margin-bottom: 40px !important;
  }
}
@media screen and (min-width: 769px) {
  .large-and-up-m\+ {
    margin: 40px !important;
  }

  .large-and-up-mt\+ {
    margin-top: 40px !important;
  }

  .large-and-up-mr\+ {
    margin-right: 40px !important;
  }

  .large-and-up-mb\+ {
    margin-bottom: 40px !important;
  }

  .large-and-up-ml\+ {
    margin-left: 40px !important;
  }

  .large-and-up-mh\+ {
    margin-right: 40px !important;
    margin-left: 40px !important;
  }

  .large-and-up-mv\+ {
    margin-top: 40px !important;
    margin-bottom: 40px !important;
  }
}
@media screen and (min-width: 1025px) {
  .extralarge-and-up-m\+ {
    margin: 40px !important;
  }

  .extralarge-and-up-mt\+ {
    margin-top: 40px !important;
  }

  .extralarge-and-up-mr\+ {
    margin-right: 40px !important;
  }

  .extralarge-and-up-mb\+ {
    margin-bottom: 40px !important;
  }

  .extralarge-and-up-ml\+ {
    margin-left: 40px !important;
  }

  .extralarge-and-up-mh\+ {
    margin-right: 40px !important;
    margin-left: 40px !important;
  }

  .extralarge-and-up-mv\+ {
    margin-top: 40px !important;
    margin-bottom: 40px !important;
  }
}
/**
 * Add huge margins.
 */
@media screen and (min-width: 481px) and (max-width: 768px) {
  .medium-m\+\+ {
    margin: 80px !important;
  }

  .medium-mt\+\+ {
    margin-top: 80px !important;
  }

  .medium-mr\+\+ {
    margin-right: 80px !important;
  }

  .medium-mb\+\+ {
    margin-bottom: 80px !important;
  }

  .medium-ml\+\+ {
    margin-left: 80px !important;
  }

  .medium-mh\+\+ {
    margin-right: 80px !important;
    margin-left: 80px !important;
  }

  .medium-mv\+\+ {
    margin-top: 80px !important;
    margin-bottom: 80px !important;
  }
}
@media screen and (min-width: 481px) {
  .medium-and-up-m\+\+ {
    margin: 80px !important;
  }

  .medium-and-up-mt\+\+ {
    margin-top: 80px !important;
  }

  .medium-and-up-mr\+\+ {
    margin-right: 80px !important;
  }

  .medium-and-up-mb\+\+ {
    margin-bottom: 80px !important;
  }

  .medium-and-up-ml\+\+ {
    margin-left: 80px !important;
  }

  .medium-and-up-mh\+\+ {
    margin-right: 80px !important;
    margin-left: 80px !important;
  }

  .medium-and-up-mv\+\+ {
    margin-top: 80px !important;
    margin-bottom: 80px !important;
  }
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  .large-m\+\+ {
    margin: 80px !important;
  }

  .large-mt\+\+ {
    margin-top: 80px !important;
  }

  .large-mr\+\+ {
    margin-right: 80px !important;
  }

  .large-mb\+\+ {
    margin-bottom: 80px !important;
  }

  .large-ml\+\+ {
    margin-left: 80px !important;
  }

  .large-mh\+\+ {
    margin-right: 80px !important;
    margin-left: 80px !important;
  }

  .large-mv\+\+ {
    margin-top: 80px !important;
    margin-bottom: 80px !important;
  }
}
@media screen and (min-width: 769px) {
  .large-and-up-m\+\+ {
    margin: 80px !important;
  }

  .large-and-up-mt\+\+ {
    margin-top: 80px !important;
  }

  .large-and-up-mr\+\+ {
    margin-right: 80px !important;
  }

  .large-and-up-mb\+\+ {
    margin-bottom: 80px !important;
  }

  .large-and-up-ml\+\+ {
    margin-left: 80px !important;
  }

  .large-and-up-mh\+\+ {
    margin-right: 80px !important;
    margin-left: 80px !important;
  }

  .large-and-up-mv\+\+ {
    margin-top: 80px !important;
    margin-bottom: 80px !important;
  }
}
@media screen and (min-width: 1025px) {
  .extralarge-and-up-m\+\+ {
    margin: 80px !important;
  }

  .extralarge-and-up-mt\+\+ {
    margin-top: 80px !important;
  }

  .extralarge-and-up-mr\+\+ {
    margin-right: 80px !important;
  }

  .extralarge-and-up-mb\+\+ {
    margin-bottom: 80px !important;
  }

  .extralarge-and-up-ml\+\+ {
    margin-left: 80px !important;
  }

  .extralarge-and-up-mh\+\+ {
    margin-right: 80px !important;
    margin-left: 80px !important;
  }

  .extralarge-and-up-mv\+\+ {
    margin-top: 80px !important;
    margin-bottom: 80px !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) {
  .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;
  }
}
/**
 * Padding helper classes.
 *
 * Add paddings.
 */
@media screen and (min-width: 481px) and (max-width: 768px) {
  .medium-p {
    padding: 20px !important;
  }

  .medium-pt {
    padding-top: 20px !important;
  }

  .medium-pr {
    padding-right: 20px !important;
  }

  .medium-pb {
    padding-bottom: 20px !important;
  }

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

  .medium-ph {
    padding-right: 20px !important;
    padding-left: 20px !important;
  }

  .medium-pv {
    padding-top: 20px !important;
    padding-bottom: 20px !important;
  }
}
@media screen and (min-width: 481px) {
  .medium-and-up-p {
    padding: 20px !important;
  }

  .medium-and-up-pt {
    padding-top: 20px !important;
  }

  .medium-and-up-pr {
    padding-right: 20px !important;
  }

  .medium-and-up-pb {
    padding-bottom: 20px !important;
  }

  .medium-and-up-pl {
    padding-left: 20px !important;
  }

  .medium-and-up-ph {
    padding-right: 20px !important;
    padding-left: 20px !important;
  }

  .medium-and-up-pv {
    padding-top: 20px !important;
    padding-bottom: 20px !important;
  }
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  .large-p {
    padding: 20px !important;
  }

  .large-pt {
    padding-top: 20px !important;
  }

  .large-pr {
    padding-right: 20px !important;
  }

  .large-pb {
    padding-bottom: 20px !important;
  }

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

  .large-ph {
    padding-right: 20px !important;
    padding-left: 20px !important;
  }

  .large-pv {
    padding-top: 20px !important;
    padding-bottom: 20px !important;
  }
}
@media screen and (min-width: 769px) {
  .large-and-up-p {
    padding: 20px !important;
  }

  .large-and-up-pt {
    padding-top: 20px !important;
  }

  .large-and-up-pr {
    padding-right: 20px !important;
  }

  .large-and-up-pb {
    padding-bottom: 20px !important;
  }

  .large-and-up-pl {
    padding-left: 20px !important;
  }

  .large-and-up-ph {
    padding-right: 20px !important;
    padding-left: 20px !important;
  }

  .large-and-up-pv {
    padding-top: 20px !important;
    padding-bottom: 20px !important;
  }
}
@media screen and (min-width: 1025px) {
  .extralarge-and-up-p {
    padding: 20px !important;
  }

  .extralarge-and-up-pt {
    padding-top: 20px !important;
  }

  .extralarge-and-up-pr {
    padding-right: 20px !important;
  }

  .extralarge-and-up-pb {
    padding-bottom: 20px !important;
  }

  .extralarge-and-up-pl {
    padding-left: 20px !important;
  }

  .extralarge-and-up-ph {
    padding-right: 20px !important;
    padding-left: 20px !important;
  }

  .extralarge-and-up-pv {
    padding-top: 20px !important;
    padding-bottom: 20px !important;
  }
}
/**
 * Add tiny paddings.
 */
@media screen and (min-width: 481px) and (max-width: 768px) {
  .medium-p-- {
    padding: 5px !important;
  }

  .medium-pt-- {
    padding-top: 5px !important;
  }

  .medium-pr-- {
    padding-right: 5px !important;
  }

  .medium-pb-- {
    padding-bottom: 5px !important;
  }

  .medium-pl-- {
    padding-left: 5px !important;
  }

  .medium-ph-- {
    padding-right: 5px !important;
    padding-left: 5px !important;
  }

  .medium-pv-- {
    padding-top: 5px !important;
    padding-bottom: 5px !important;
  }
}
@media screen and (min-width: 481px) {
  .medium-and-up-p-- {
    padding: 5px !important;
  }

  .medium-and-up-pt-- {
    padding-top: 5px !important;
  }

  .medium-and-up-pr-- {
    padding-right: 5px !important;
  }

  .medium-and-up-pb-- {
    padding-bottom: 5px !important;
  }

  .medium-and-up-pl-- {
    padding-left: 5px !important;
  }

  .medium-and-up-ph-- {
    padding-right: 5px !important;
    padding-left: 5px !important;
  }

  .medium-and-up-pv-- {
    padding-top: 5px !important;
    padding-bottom: 5px !important;
  }
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  .large-p-- {
    padding: 5px !important;
  }

  .large-pt-- {
    padding-top: 5px !important;
  }

  .large-pr-- {
    padding-right: 5px !important;
  }

  .large-pb-- {
    padding-bottom: 5px !important;
  }

  .large-pl-- {
    padding-left: 5px !important;
  }

  .large-ph-- {
    padding-right: 5px !important;
    padding-left: 5px !important;
  }

  .large-pv-- {
    padding-top: 5px !important;
    padding-bottom: 5px !important;
  }
}
@media screen and (min-width: 769px) {
  .large-and-up-p-- {
    padding: 5px !important;
  }

  .large-and-up-pt-- {
    padding-top: 5px !important;
  }

  .large-and-up-pr-- {
    padding-right: 5px !important;
  }

  .large-and-up-pb-- {
    padding-bottom: 5px !important;
  }

  .large-and-up-pl-- {
    padding-left: 5px !important;
  }

  .large-and-up-ph-- {
    padding-right: 5px !important;
    padding-left: 5px !important;
  }

  .large-and-up-pv-- {
    padding-top: 5px !important;
    padding-bottom: 5px !important;
  }
}
@media screen and (min-width: 1025px) {
  .extralarge-and-up-p-- {
    padding: 5px !important;
  }

  .extralarge-and-up-pt-- {
    padding-top: 5px !important;
  }

  .extralarge-and-up-pr-- {
    padding-right: 5px !important;
  }

  .extralarge-and-up-pb-- {
    padding-bottom: 5px !important;
  }

  .extralarge-and-up-pl-- {
    padding-left: 5px !important;
  }

  .extralarge-and-up-ph-- {
    padding-right: 5px !important;
    padding-left: 5px !important;
  }

  .extralarge-and-up-pv-- {
    padding-top: 5px !important;
    padding-bottom: 5px !important;
  }
}
/**
 * Add small paddings.
 */
@media screen and (min-width: 481px) and (max-width: 768px) {
  .medium-p- {
    padding: 10px !important;
  }

  .medium-pt- {
    padding-top: 10px !important;
  }

  .medium-pr- {
    padding-right: 10px !important;
  }

  .medium-pb- {
    padding-bottom: 10px !important;
  }

  .medium-pl- {
    padding-left: 10px !important;
  }

  .medium-ph- {
    padding-right: 10px !important;
    padding-left: 10px !important;
  }

  .medium-pv- {
    padding-top: 10px !important;
    padding-bottom: 10px !important;
  }
}
@media screen and (min-width: 481px) {
  .medium-and-up-p- {
    padding: 10px !important;
  }

  .medium-and-up-pt- {
    padding-top: 10px !important;
  }

  .medium-and-up-pr- {
    padding-right: 10px !important;
  }

  .medium-and-up-pb- {
    padding-bottom: 10px !important;
  }

  .medium-and-up-pl- {
    padding-left: 10px !important;
  }

  .medium-and-up-ph- {
    padding-right: 10px !important;
    padding-left: 10px !important;
  }

  .medium-and-up-pv- {
    padding-top: 10px !important;
    padding-bottom: 10px !important;
  }
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  .large-p- {
    padding: 10px !important;
  }

  .large-pt- {
    padding-top: 10px !important;
  }

  .large-pr- {
    padding-right: 10px !important;
  }

  .large-pb- {
    padding-bottom: 10px !important;
  }

  .large-pl- {
    padding-left: 10px !important;
  }

  .large-ph- {
    padding-right: 10px !important;
    padding-left: 10px !important;
  }

  .large-pv- {
    padding-top: 10px !important;
    padding-bottom: 10px !important;
  }
}
@media screen and (min-width: 769px) {
  .large-and-up-p- {
    padding: 10px !important;
  }

  .large-and-up-pt- {
    padding-top: 10px !important;
  }

  .large-and-up-pr- {
    padding-right: 10px !important;
  }

  .large-and-up-pb- {
    padding-bottom: 10px !important;
  }

  .large-and-up-pl- {
    padding-left: 10px !important;
  }

  .large-and-up-ph- {
    padding-right: 10px !important;
    padding-left: 10px !important;
  }

  .large-and-up-pv- {
    padding-top: 10px !important;
    padding-bottom: 10px !important;
  }
}
@media screen and (min-width: 1025px) {
  .extralarge-and-up-p- {
    padding: 10px !important;
  }

  .extralarge-and-up-pt- {
    padding-top: 10px !important;
  }

  .extralarge-and-up-pr- {
    padding-right: 10px !important;
  }

  .extralarge-and-up-pb- {
    padding-bottom: 10px !important;
  }

  .extralarge-and-up-pl- {
    padding-left: 10px !important;
  }

  .extralarge-and-up-ph- {
    padding-right: 10px !important;
    padding-left: 10px !important;
  }

  .extralarge-and-up-pv- {
    padding-top: 10px !important;
    padding-bottom: 10px !important;
  }
}
/**
 * Add large paddings.
 */
@media screen and (min-width: 481px) and (max-width: 768px) {
  .medium-p\+ {
    padding: 40px !important;
  }

  .medium-pt\+ {
    padding-top: 40px !important;
  }

  .medium-pr\+ {
    padding-right: 40px !important;
  }

  .medium-pb\+ {
    padding-bottom: 40px !important;
  }

  .medium-pl\+ {
    padding-left: 40px !important;
  }

  .medium-ph\+ {
    padding-right: 40px !important;
    padding-left: 40px !important;
  }

  .medium-pv\+ {
    padding-top: 40px !important;
    padding-bottom: 40px !important;
  }
}
@media screen and (min-width: 481px) {
  .medium-and-up-p\+ {
    padding: 40px !important;
  }

  .medium-and-up-pt\+ {
    padding-top: 40px !important;
  }

  .medium-and-up-pr\+ {
    padding-right: 40px !important;
  }

  .medium-and-up-pb\+ {
    padding-bottom: 40px !important;
  }

  .medium-and-up-pl\+ {
    padding-left: 40px !important;
  }

  .medium-and-up-ph\+ {
    padding-right: 40px !important;
    padding-left: 40px !important;
  }

  .medium-and-up-pv\+ {
    padding-top: 40px !important;
    padding-bottom: 40px !important;
  }
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  .large-p\+ {
    padding: 40px !important;
  }

  .large-pt\+ {
    padding-top: 40px !important;
  }

  .large-pr\+ {
    padding-right: 40px !important;
  }

  .large-pb\+ {
    padding-bottom: 40px !important;
  }

  .large-pl\+ {
    padding-left: 40px !important;
  }

  .large-ph\+ {
    padding-right: 40px !important;
    padding-left: 40px !important;
  }

  .large-pv\+ {
    padding-top: 40px !important;
    padding-bottom: 40px !important;
  }
}
@media screen and (min-width: 769px) {
  .large-and-up-p\+ {
    padding: 40px !important;
  }

  .large-and-up-pt\+ {
    padding-top: 40px !important;
  }

  .large-and-up-pr\+ {
    padding-right: 40px !important;
  }

  .large-and-up-pb\+ {
    padding-bottom: 40px !important;
  }

  .large-and-up-pl\+ {
    padding-left: 40px !important;
  }

  .large-and-up-ph\+ {
    padding-right: 40px !important;
    padding-left: 40px !important;
  }

  .large-and-up-pv\+ {
    padding-top: 40px !important;
    padding-bottom: 40px !important;
  }
}
@media screen and (min-width: 1025px) {
  .extralarge-and-up-p\+ {
    padding: 40px !important;
  }

  .extralarge-and-up-pt\+ {
    padding-top: 40px !important;
  }

  .extralarge-and-up-pr\+ {
    padding-right: 40px !important;
  }

  .extralarge-and-up-pb\+ {
    padding-bottom: 40px !important;
  }

  .extralarge-and-up-pl\+ {
    padding-left: 40px !important;
  }

  .extralarge-and-up-ph\+ {
    padding-right: 40px !important;
    padding-left: 40px !important;
  }

  .extralarge-and-up-pv\+ {
    padding-top: 40px !important;
    padding-bottom: 40px !important;
  }
}
/**
 * Add huge paddings.
 */
@media screen and (min-width: 481px) and (max-width: 768px) {
  .medium-p\+\+ {
    padding: 80px !important;
  }

  .medium-pt\+\+ {
    padding-top: 80px !important;
  }

  .medium-pr\+\+ {
    padding-right: 80px !important;
  }

  .medium-pb\+\+ {
    padding-bottom: 80px !important;
  }

  .medium-pl\+\+ {
    padding-left: 80px !important;
  }

  .medium-ph\+\+ {
    padding-right: 80px !important;
    padding-left: 80px !important;
  }

  .medium-pv\+\+ {
    padding-top: 80px !important;
    padding-bottom: 80px !important;
  }
}
@media screen and (min-width: 481px) {
  .medium-and-up-p\+\+ {
    padding: 80px !important;
  }

  .medium-and-up-pt\+\+ {
    padding-top: 80px !important;
  }

  .medium-and-up-pr\+\+ {
    padding-right: 80px !important;
  }

  .medium-and-up-pb\+\+ {
    padding-bottom: 80px !important;
  }

  .medium-and-up-pl\+\+ {
    padding-left: 80px !important;
  }

  .medium-and-up-ph\+\+ {
    padding-right: 80px !important;
    padding-left: 80px !important;
  }

  .medium-and-up-pv\+\+ {
    padding-top: 80px !important;
    padding-bottom: 80px !important;
  }
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
  .large-p\+\+ {
    padding: 80px !important;
  }

  .large-pt\+\+ {
    padding-top: 80px !important;
  }

  .large-pr\+\+ {
    padding-right: 80px !important;
  }

  .large-pb\+\+ {
    padding-bottom: 80px !important;
  }

  .large-pl\+\+ {
    padding-left: 80px !important;
  }

  .large-ph\+\+ {
    padding-right: 80px !important;
    padding-left: 80px !important;
  }

  .large-pv\+\+ {
    padding-top: 80px !important;
    padding-bottom: 80px !important;
  }
}
@media screen and (min-width: 769px) {
  .large-and-up-p\+\+ {
    padding: 80px !important;
  }

  .large-and-up-pt\+\+ {
    padding-top: 80px !important;
  }

  .large-and-up-pr\+\+ {
    padding-right: 80px !important;
  }

  .large-and-up-pb\+\+ {
    padding-bottom: 80px !important;
  }

  .large-and-up-pl\+\+ {
    padding-left: 80px !important;
  }

  .large-and-up-ph\+\+ {
    padding-right: 80px !important;
    padding-left: 80px !important;
  }

  .large-and-up-pv\+\+ {
    padding-top: 80px !important;
    padding-bottom: 80px !important;
  }
}
@media screen and (min-width: 1025px) {
  .extralarge-and-up-p\+\+ {
    padding: 80px !important;
  }

  .extralarge-and-up-pt\+\+ {
    padding-top: 80px !important;
  }

  .extralarge-and-up-pr\+\+ {
    padding-right: 80px !important;
  }

  .extralarge-and-up-pb\+\+ {
    padding-bottom: 80px !important;
  }

  .extralarge-and-up-pl\+\+ {
    padding-left: 80px !important;
  }

  .extralarge-and-up-ph\+\+ {
    padding-right: 80px !important;
    padding-left: 80px !important;
  }

  .extralarge-and-up-pv\+\+ {
    padding-top: 80px !important;
    padding-bottom: 80px !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) {
  .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;
  }
}
/*------------------------------------*\
    #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) {
  /**
   * 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;
  }
}
/*------------------------------------*\
    #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 * {
  -webkit-transition: none !important;
  -moz-transition: none !important;
  -ms-transition: none !important;
  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;
}

/*------------------------------------*\
    #COLORS
\*------------------------------------*/
.color-white {
  color: white !important;
}

.color-dark {
  color: #231f20 !important;
}

.color-purple {
  color: #462481 !important;
}

.color-purple-light {
  color: #944eaf !important;
}

.color-base {
  color: #7f3f98 !important;
}

.color-gray {
  color: #333742 !important;
}

.color-gray-dark {
  color: #414042 !important;
}

.color-light {
  color: #f5f6f9 !important;
}

/*------------------------------------*\
    #BACKGROUNDS
\*------------------------------------*/
.bgr-dark {
  background-color: #231f20 !important;
}

.bgr-purple {
  background-color: #462481 !important;
}

.bgr-purple-light {
  background-color: #944eaf !important;
}

.bgr-base {
  background-color: #7f3f98 !important;
}

.bgr-gray {
  background-color: #333742 !important;
}

.bgr-light {
  background-color: #f5f6f9 !important;
}

/*------------------------------------*\
    #HELPERS
\*------------------------------------*/
.border-top {
  padding-top: 40px !important;
  border-top: 1px solid #e5e8f1 !important;
}

.border-bottom {
  padding-bottom: 40px !important;
  border-bottom: 1px solid #e5e8f1 !important;
}

.full-width {
  width: 100% !important;
  max-width: 100% !important;
}

.max-width-200 {
  max-width: 100% !important;
  width: 200px !important;
}

.justifize__box {
  max-width: 100%;
}

/*------------------------------------*\
    #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) {
  /*
   * 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;
  }
}
/*------------------------------------*\
    #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: "";
  }
}
/*------------------------------------*\
    #Settings
\*------------------------------------*/
.font-xsmall, .socialUtil, .chat-module-title:nth-child(2) h2, .searchBoxContainer .searchBox form .noResults p {
  font-size: .8em;
}

.font-small, .articleImg, .tags, .live-chat-calendar-days li, .chat-indicator, .aaqHome .nextChatContainer .chatDateInfo .chatDate, .aaqHome .nextChatContainer .chatDateInfo .chatTime, .aaqHome .categoryMainContent .viewMore, .QnaSection .tnc, .findHelpSearchResults .orgDetailsContainer .orgDetails .helpTopics span, .searchBoxContainer .searchBox .formErrors span {
  font-size: .9em;
}

.font-regular, .chatfaq h3 {
  font-size: 1em;
}

.font-large, #idc-container-parent #idc-container h3, .aaqHome .mainContent h2, .searchBoxContainer .searchBox h3 {
  font-size: 1.1em;
}

.font-xlarge, .chat-module-title, .appsHome .mainContent .col-4 a h2, .appDetailsContainer h2, .searchBoxContainer .searchBox form .largeLabel {
  font-size: 1.4em;
}

.font-xxlarge, .aaqHome .askAQuestionContainer .askContent h2 {
  font-size: 1.7em;
}

.font-xxxlarge {
  font-size: 2em;
}

.leftFloat {
  float: left;
}

.rightFloat {
  float: right;
}

.borderbottom {
  border-bottom: 1px solid #e5e5e5;
}

.clear-both {
  clear: both;
}

.offScreen {
  position: absolute;
  left: -9999em;
}

.contact-us .contact-form label {
  display: none;
}

.layout__item__form {
  margin-bottom: 10px;
}

html {
  font-size: 14px;
}

.footer-main {
  padding: 20px 0 !important;
  font-weight: normal;
}
.footer-main ul {
  margin-bottom: 30px !important;
}
.footer-main ul li {
  font-size: 12px;
}
.footer-main ul p {
  font-weight: normal;
  font-size: 12px;
}
.footer-main p {
  font-size: 12px !important;
}

.link-disabled {
  pointer-events: none;
  cursor: default;
}

#login-lightbox {
  display: none;
  max-width: 460px;
}

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

.thin-header {
  position: relative;
  height: 300px;
  padding: 30px;
}
.thin-header .wrapper {
  max-width: 455px;
}
.thin-header .wrapper h1, .thin-header .wrapper p {
  color: #ffffff;
}
.thin-header .wrapper p {
  font-size: 16px;
}
@media screen and (max-width: 770px) {
  .thin-header .wrapper p {
    font-size: 12px;
  }
}

.default-img {
  width: auto;
  height: 81px;
}

.page-auction h2 {
  margin-bottom: 10px;
}
.page-auction .auction-details {
  text-align: center;
}
.page-auction .auction-details h1 {
  margin-top: 55px;
  font-size: 36px;
}
@media screen and (max-width: 1026px) {
  .page-auction .auction-details h1 {
    margin-top: 0;
  }
}
.page-auction .auction-partner-logo {
  position: relative;
}
.page-auction .auction-partner-logo img {
  width: 200px;
  height: 150px;
}
.page-auction .auction-overlay {
  position: absolute;
  top: 0;
  left: 0;
}
.page-auction .auctioneer img {
  float: left;
  margin-right: 20px;
  margin-bottom: 20px;
  max-width: 200px;
}
@media screen and (max-width: 482px) {
  .page-auction .auctioneer img {
    float: none;
    display: block;
  }
}
.page-auction .auctioneer .auctioneer-intro h3 {
  margin-bottom: 10px;
}

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

.textarea-small {
  height: 170px !important;
}

.base-color-one-button {
  background-color: #ee2346;
  border-color: #ee2346;
}

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

.colourBlockOne .nextSteps {
  border-color: #D61807;
}
.colourBlockOne .nextSteps h2 {
  background: #D61807;
}
.colourBlockOne .article-list-slash {
  background: url(images/angle-article-list-1.png) no-repeat 100% 25%;
}
.colourBlockOne .typeOfPost {
  background-color: #D61807;
}
.colourBlockOne .category-filter {
  color: #D61807;
}
.colourBlockOne .category-filter a {
  color: #D61807 !important;
}
.colourBlockOne .category-filter a:visited {
  color: #D61807 !important;
}
.colourBlockOne .category-filter a:hover {
  background-color: #D61807 !important;
}
.colourBlockOne .category-filter .current-cat a {
  background-color: #D61807 !important;
}

.colourBlockTwo .nextSteps {
  border-color: #003388;
}
.colourBlockTwo .nextSteps h2 {
  background: #003388;
}
.colourBlockTwo .article-list-slash {
  background: url(images/angle-article-list-2.png) no-repeat 100% 25%;
}
.colourBlockTwo .typeOfPost {
  background-color: #003388;
}
.colourBlockTwo .category-filter {
  color: #003388;
}
.colourBlockTwo .category-filter a {
  color: #003388 !important;
}
.colourBlockTwo .category-filter a:visited {
  color: #003388 !important;
}
.colourBlockTwo .category-filter a:hover {
  background-color: #003388 !important;
}
.colourBlockTwo .category-filter .current-cat a {
  background-color: #003388 !important;
}

.colourBlockThree .nextSteps {
  border-color: #047B04;
}
.colourBlockThree .nextSteps h2 {
  background: #047B04;
}
.colourBlockThree .article-list-slash {
  background: url(images/angle-article-list-3.png) no-repeat 100% 25%;
}
.colourBlockThree .typeOfPost {
  background-color: #047B04;
}
.colourBlockThree .category-filter {
  color: #047B04;
}
.colourBlockThree .category-filter a {
  color: #047B04 !important;
}
.colourBlockThree .category-filter a:visited {
  color: #047B04 !important;
}
.colourBlockThree .category-filter a:hover {
  background-color: #047B04 !important;
}
.colourBlockThree .category-filter .current-cat a {
  background-color: #047B04 !important;
}

.colourBlockFour .nextSteps {
  border-color: #025F78;
}
.colourBlockFour .nextSteps h2 {
  background: #025F78;
}
.colourBlockFour .article-list-slash {
  background: url(images/angle-article-list-4.png) no-repeat 100% 25%;
}
.colourBlockFour .typeOfPost {
  background-color: #025F78;
}
.colourBlockFour .category-filter {
  color: #025F78;
}
.colourBlockFour .category-filter a {
  color: #025F78 !important;
}
.colourBlockFour .category-filter a:visited {
  color: #025F78 !important;
}
.colourBlockFour .category-filter a:hover {
  background-color: #025F78 !important;
}
.colourBlockFour .category-filter .current-cat a {
  background-color: #025F78 !important;
}

.colourBlockFive .nextSteps {
  border-color: #AA2233;
}
.colourBlockFive .nextSteps h2 {
  background: #AA2233;
}
.colourBlockFive .article-list-slash {
  background: url(images/angle-article-list-5.png) no-repeat 100% 25%;
}
.colourBlockFive .typeOfPost {
  background-color: #AA2233;
}
.colourBlockFive .category-filter {
  color: #AA2233;
}
.colourBlockFive .category-filter a {
  color: #AA2233 !important;
}
.colourBlockFive .category-filter a:visited {
  color: #AA2233 !important;
}
.colourBlockFive .category-filter a:hover {
  background-color: #AA2233 !important;
}
.colourBlockFive .category-filter .current-cat a {
  background-color: #AA2233 !important;
}

.colourBlockSix .nextSteps {
  border-color: #882277;
}
.colourBlockSix .nextSteps h2 {
  background: #882277;
}
.colourBlockSix .article-list-slash {
  background: url(images/angle-article-list-6.png) no-repeat 100% 25%;
}
.colourBlockSix .typeOfPost {
  background-color: #882277;
}
.colourBlockSix .category-filter {
  color: #882277;
}
.colourBlockSix .category-filter a {
  color: #882277 !important;
}
.colourBlockSix .category-filter a:visited {
  color: #882277 !important;
}
.colourBlockSix .category-filter a:hover {
  background-color: #882277 !important;
}
.colourBlockSix .category-filter .current-cat a {
  background-color: #882277 !important;
}

.colourBlockSeven .nextSteps {
  border-color: #CF0072;
}
.colourBlockSeven .nextSteps h2 {
  background: #CF0072;
}
.colourBlockSeven .article-list-slash {
  background: url(images/angle-article-list-7.png) no-repeat 100% 25%;
}
.colourBlockSeven .typeOfPost {
  background-color: #CF0072;
}
.colourBlockSeven .category-filter {
  color: #CF0072;
}
.colourBlockSeven .category-filter a {
  color: #CF0072 !important;
}
.colourBlockSeven .category-filter a:visited {
  color: #CF0072 !important;
}
.colourBlockSeven .category-filter a:hover {
  background-color: #CF0072 !important;
}
.colourBlockSeven .category-filter .current-cat a {
  background-color: #CF0072 !important;
}

.colourBlockEight .nextSteps {
  border-color: #1D7C71;
}
.colourBlockEight .nextSteps h2 {
  background: #1D7C71;
}
.colourBlockEight .article-list-slash {
  background: url(images/angle-article-list-8.png) no-repeat 100% 25%;
}
.colourBlockEight .typeOfPost {
  background-color: #1D7C71;
}
.colourBlockEight .category-filter {
  color: #1D7C71;
}
.colourBlockEight .category-filter a {
  color: #1D7C71 !important;
}
.colourBlockEight .category-filter a:visited {
  color: #1D7C71 !important;
}
.colourBlockEight .category-filter a:hover {
  background-color: #1D7C71 !important;
}
.colourBlockEight .category-filter .current-cat a {
  background-color: #1D7C71 !important;
}

.colourBlockNine .nextSteps {
  border-color: #CC3300;
}
.colourBlockNine .nextSteps h2 {
  background: #CC3300;
}
.colourBlockNine .article-list-slash {
  background: url(images/angle-article-list-9.png) no-repeat 100% 25%;
}
.colourBlockNine .typeOfPost {
  background-color: #CC3300;
}
.colourBlockNine .category-filter {
  color: #CC3300;
}
.colourBlockNine .category-filter a {
  color: #CC3300 !important;
}
.colourBlockNine .category-filter a:visited {
  color: #CC3300 !important;
}
.colourBlockNine .category-filter a:hover {
  background-color: #CC3300 !important;
}
.colourBlockNine .category-filter .current-cat a {
  background-color: #CC3300 !important;
}

.input {
  padding: 0 12px 0 19px;
}

.sod_label {
  font-size: 14px;
}
.sod_label .sod_placeholder {
  color: rgba(0, 0, 0, 0.5);
}

::-webkit-input-placeholder {
  /* Chrome/Opera/Safari */
  color: rgba(0, 0, 0, 0.5) !important;
}

:-ms-input-placeholder {
  /* IE 10+ */
  color: rgba(0, 0, 0, 0.5) !important;
}

.input--textarea {
  font-style: normal;
}

/*------------------------------------*\
    #NAVIGATION MENU
\*------------------------------------*/
.nav-main__dropdown {
  padding-top: 20px !important;
}

.is-active li a {
  font-weight: bold;
}

.nav-main {
  margin-bottom: 75px;
}

.current-post-ancestor:after, .current-page-ancestor:after, .current-menu-item:after {
  height: 100% !important;
}

.current-post-ancestor a, .current-page-ancestor a, .current-menu-item a {
  color: #fff !important;
}

.subNavOne:after {
  background-color: #D61807;
}

.subNavTwo:after {
  background-color: #003388;
}

.subNavThree:after {
  background-color: #047B04;
}

.subNavFour:after {
  background-color: #025F78;
}

.subNavFive:after {
  background-color: #AA2233;
}

.subNavSix:after {
  background-color: #882277;
}

.subNavSeven:after {
  background-color: #CF0072;
}

.subNavEight:after {
  background-color: #1D7C71;
}

.subNavNine:after {
  background-color: #CC3300;
}

.footer-main .current-post-ancestor a, .footer-main .current-page-ancestor a, .footer-main .current-menu-item a {
  color: #231f20 !important;
}

.admin-bar .header-main {
  top: 32px;
}

@media all and (max-width: 782px) {
  .admin-bar .header-main {
    top: 46px;
  }
}
.no-subnav {
  margin-bottom: 0;
}

.subheader .input {
  font-size: 12px;
}

.nav-main__item a:hover {
  text-decoration: underline;
}

.nav-main__dropdown a:hover {
  text-decoration: none;
}

.get-involved-btn {
  background-color: #FF0700;
  color: #fff;
  display: inline-block;
  font-size: 10px;
  font-weight: bold;
  margin-left: 20px;
  padding: 3px 6px;
  text-decoration: none;
  text-transform: uppercase;
  vertical-align: middle;
}
@media screen and (max-width: 768px) {
  .get-involved-btn {
    display: none;
  }
}

a.get-involved-btn:hover {
  background-color: #fff;
  color: #FF0700;
  text-decoration: none;
}

.main-menu-social-buttons {
  display: none;
  background-color: #231f20;
  color: #fff;
  height: 47px;
  line-height: 47px;
  padding-left: 20px;
}
.main-menu-social-buttons a {
  margin-right: 10px;
}
@media screen and (max-width: 1024px) {
  .main-menu-social-buttons {
    display: block;
  }
}
.main-menu-social-buttons .header-main__social {
  padding: 0;
}
.main-menu-social-buttons .header-main__social:after {
  display: none;
}

@media screen and (max-width: 1024px) {
  .social-buttons-top {
    display: none;
  }
}

.top-bar-right {
  display: inline-block;
}
@media screen and (max-width: 480px) {
  .top-bar-right a {
    padding: 0 10px;
  }
  .top-bar-right a:after {
    display: none;
  }
}
@media screen and (max-width: 340px) {
  .top-bar-right a {
    padding: 0 5px;
  }
  .top-bar-right a:after {
    display: block;
  }
}
@media screen and (max-width: 480px) {
  .top-bar-right .header-main__sub-menu a {
    padding: 10px;
  }
}

.header-main__auth-link:first-child {
  margin-left: 0 !important;
}

a.user_profile_link:after {
  content: '';
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 6px 5.5px 0 5.5px;
  border-color: #6d6e71 transparent transparent transparent;
  display: inline-block;
  margin-left: 10px;
}

.user-dropdown {
  box-sizing: content-box;
}
.user-dropdown .user_profile_link {
  padding: 0 3px 0 10px !important;
}

.logged-in .header-main__auth-link:after {
  width: 0;
}

/*------------------------------------*\
    #Article Template
\*------------------------------------*/
.tabs__nav a {
  background-color: #7b8093;
}

.tabs__item {
  padding-top: 20px;
}

.link_popular_tab {
  text-decoration: none !important;
  color: inherit;
}
.link_popular_tab p {
  margin-bottom: 0;
}

.articleImg {
  position: relative;
}
.articleImg img {
  height: auto;
  width: 100%;
}

.articleImg p {
  z-index: 1;
  position: absolute;
  bottom: 0;
  padding: 7px;
  background: #000;
  color: #fff;
  margin-left: 15px;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
  zoom: 1;
  filter: alpha(opacity=85);
  opacity: 0.85;
}

.articleImg p a {
  color: #fff;
}
.articleImg p a:hover {
  text-decoration: none;
}

.yn-content {
  font-size: 14px;
}
.yn-content p, .yn-content li {
  font-size: 14px;
}

#img-caption {
  font-size: 12px;
}

.nextSteps {
  margin: 10px 0;
  float: left;
  border: 1px solid #452187;
  width: 100%;
}
.nextSteps h2 {
  background: #452187;
  color: #fff;
  padding: 10px;
  margin: 0;
}
.nextSteps .nextStepsInner {
  padding: 20px;
}
.nextSteps .nextStepsInner ul {
  margin-left: 0;
  width: 99%;
}
.nextSteps .nextStepsInner ul li {
  background: url("images/bullet.png") no-repeat 0 50%;
  list-style: none;
  margin-bottom: 10px;
  padding-left: 25px;
  width: 99%;
}

.tags {
  margin-bottom: 5px;
  clear: both;
  padding: 10px 0 0 0;
  width: 100%;
  float: left;
}
.tags p {
  float: left;
  padding-right: 10px;
  margin-bottom: 5px;
  font-size: 12px;
}
.tags a {
  margin-bottom: 10px;
  line-height: 1.5em;
  margin-left: 2px;
  margin-right: 4px;
  vertical-align: baseline;
}

.author-margin {
  margin-top: 14px;
}

.author-top a {
  text-decoration: none;
}
.author-top .author-details {
  display: inline-block;
  vertical-align: top;
  margin-left: 10px;
}
.author-top .author-details .byline .display-name a {
  color: #ee2346;
  font-weight: bold;
}
.author-top .author-details .byline .display-name a:hover {
  text-decoration: underline;
}
.author-top .author-details .post-date {
  font-style: italic;
  font-size: 12px;
}

.internalAuthor, .lastUpdated {
  margin: 20px 0;
}
.internalAuthor p, .lastUpdated p {
  font-size: 12px;
}

/* commenting */
#idc-container-parent #idc-container #IDCommentsHead {
  background: #e6e7e8;
}
#idc-container-parent #idc-container #IDCommentsHead h3 {
  padding: 10px 10px 0 10px;
}
#idc-container-parent #idc-container #IDCommentsHead h3 span {
  font-family: "AsapBold", sans-serif;
  color: #000;
}
#idc-container-parent #idc-container .idc-share {
  padding: 10px;
}
#idc-container-parent #idc-container .idc-toolbar p {
  background: #fff;
  padding-top: 10px;
  padding-left: 10px;
}
#idc-container-parent #idc-container .idc-btn_s .idc-r, #idc-container-parent #idc-container .idc-btn_l .idc-r {
  font-family: "AsapRegular", sans-serif;
}

body h1, body .hero-slider h1, body .hero-slider .h1 {
  font-size: 42px;
}
body h2, body .hero-slider h2 {
  font-size: 30px;
}
body h3, body .hero-slider h3 {
  font-size: 20px;
}
body p {
  font-size: 14px;
}

.nextSteps h2 {
  font-size: 17px !important;
}

h2.debateArticleHeading {
  font-size: 14px !important;
  background: #eeeeee;
  color: #ffffff;
  margin-bottom: 10px;
}
h2.debateArticleHeading span {
  background: #D61807 url(images/debateAnswerHeading.png) no-repeat 100% 100%;
  padding: 5px;
  display: block;
  width: 140px;
}

.answerQna {
  background: #FBF4D0 !important;
  float: left;
  margin-bottom: 5px;
}
.answerQna .userProfile {
  margin: 20px 20px 0 20px;
  float: left;
  width: 90px;
  position: relative;
}
.answerQna .userProfile span {
  background: #047B04;
  color: #ffffff;
  width: 90px;
  text-align: center;
  padding: 2px;
  position: absolute;
  top: 90px;
  right: 0;
  line-height: 1.2em;
}
.answerQna .expertAnswer {
  margin: 20px 20px 0 20px;
}

.blockquoteGrey {
  background: #e7e7e5 url(images/quoteOpenGrey.png) no-repeat 10px 20px;
  padding: 20px 0 20px 56px;
  font-size: 14px;
  display: inline-block;
}

.noBGC {
  background-color: transparent !important;
}
.noBGC div {
  background-color: transparent !important;
}

.noPaddTop {
  padding-top: 0;
}
.noPaddTop div {
  padding-top: 0;
}

.blockquoteGrey div {
  background: #e7e7e5 url(images/quoteCloseGrey.png) no-repeat right 0;
  padding-right: 45px;
  margin-right: 10px;
  min-height: 26px;
}

.expertAnswerQA {
  padding: 20px;
  background-color: #e7e7e5;
  margin-bottom: 20px;
}

.articleImgSlash .article-list-slash {
  position: absolute;
  height: 165px;
  width: 80px;
  z-index: 3;
}
.articleImgSlash .article-list-slash h4 {
  color: #fff;
  font-size: 12px;
  padding: 5px 10px 0 5px;
  line-height: 1.5em;
}

.chatIntro img {
  float: left;
  margin: 0 10px 10px 0;
}
.chatIntro.squared img {
  width: 106px;
  height: 106px;
}

.chat-question {
  margin-left: 0 !important;
}
.chat-question p {
  margin-left: 0 !important;
}

.chat-quotes {
  float: left;
}
.chat-quotes p {
  border-bottom: 1px solid #d9d9d9;
  margin-left: 20px;
}

.chat-mod strong {
  color: #452187;
}

.chat-expert strong {
  color: #047B04;
}

.rantsBio {
  border-bottom: 1px solid #cccccc;
  float: left;
  width: 100%;
  padding-bottom: 10px;
  margin-bottom: 10px;
}
.rantsBio img {
  padding: 1px;
  float: left;
  margin-right: 15px;
  max-width: 70px;
}
.rantsBio h4 {
  color: #333742;
  margin-bottom: 5px;
}
.rantsBio p {
  float: left;
  width: 81%;
  line-height: 1.3em;
}

.media__body h5 {
  margin-bottom: 5px !important;
}

.chatfaq {
  padding-bottom: 10px;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  transition: all 0.5s ease;
}
.chatfaq h3 {
  padding: 5px 15px;
  margin-bottom: 3px;
  background-image: url(images/faq-arrows-white.png);
  background-repeat: no-repeat;
  background-position: 99% 7px;
  background-color: #EFEFEF;
  transition: all 0.5s ease 0s;
  color: #fff;
}
.chatfaq h3 a {
  text-decoration: none;
}
.chatfaq h3:nth-of-type(2n) {
  background-color: #0b81cd;
}
.chatfaq h3:nth-of-type(2n+1) {
  background-color: #075384;
}
.chatfaq .tabOpen {
  background: #EFEFEF url(images/faq-arrows-white.png) no-repeat 99% -43px;
  transition: all 0.5s ease 0s;
}
.chatfaq .chatfaqAnswer {
  padding: 5px 25px;
}
.chatfaq .chatfaqAnswer.shown {
  display: block;
}
.chatfaq .chatfaqAnswer.hidden {
  display: none;
}

.breadcrumbs {
  font-size: 11px;
}

.credits p {
  font-size: 12px;
}

/*
* news article
*/
.label-news:before {
  content: 'NEWS';
  font-size: 10px;
  vertical-align: middle;
  background: #febe10;
  padding: 2px 6px;
}

/*
* blog article
*/
.label-blog:before {
  content: 'BLOG';
  font-size: 10px;
  vertical-align: middle;
  background: #febe10;
  padding: 2px 6px;
}

/*
* Next and previous post buttons
*/
.prev-next-posts {
  margin-bottom: 20px;
}
.prev-next-posts a {
  width: 48%;
  font-weight: 700;
  vertical-align: middle;
  color: #333742;
  position: relative;
  min-height: 64px;
  background-color: #febe10;
}
.prev-next-posts a div {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  margin: 0 30px;
}
.prev-next-posts a:hover {
  background-color: #333742;
  color: #febe10;
}
.prev-next-posts a.next-post {
  float: left;
  background-image: url("images/lessthan_thick.png");
  background-position: center left 8px;
  background-repeat: no-repeat;
}
@media screen and (max-width: 1024px) {
  .prev-next-posts a.next-post:nth-last-child(3) {
    margin-bottom: 20px;
  }
}
.prev-next-posts a.next-post:hover {
  background-image: url("images/lessthan_hover_thick.png");
}
.prev-next-posts a.prev-post {
  float: right;
  background-image: url("images/morethan_thick.png");
  background-position: center right 8px;
  background-repeat: no-repeat;
}
.prev-next-posts a.prev-post:hover {
  background-image: url("images/morethan_hover_thick.png");
}
@media screen and (max-width: 1024px) {
  .prev-next-posts a {
    width: 100%;
  }
}

.sidebar-archive {
  background-color: #f5f6f9;
  min-height: 165px;
  padding-bottom: 10px;
  padding-right: 10px;
}
.sidebar-archive:nth-child(n+2) {
  margin-top: 40px;
}
.sidebar-archive h3 {
  background-color: #7b8093;
  padding-left: 10px;
  color: #fff;
  line-height: 40px;
  margin-right: -10px;
  font-size: 14px;
}
.sidebar-archive ul {
  list-style: none;
  margin-left: 20px;
}
.sidebar-archive ul a {
  color: #333742;
}
.sidebar-archive ul .jaw_posts {
  margin-left: 10px;
  list-style: initial;
}

.blue-gradient {
  background: #3b85c8;
}

#idc-container-parent #idc-container a {
  color: #075384;
}
#idc-container-parent #idc-container .idc-share {
  width: 46px;
}
#idc-container-parent #idc-container .idc-toolbar a {
  color: #075384;
}
#idc-container-parent #idc-container #IDCommentsHead {
  background: #075384;
  padding: 5px 0;
}
#idc-container-parent #idc-container #IDCommentsHead h3 span {
  color: #fff;
  font-size: 1.3em;
}
#idc-container-parent #idc-container #IDCommentsNewThreadCover h3 {
  font-size: 1.3em;
}
#idc-container-parent #idc-container .idc-comments #IDCommentsNoCommentsDiv {
  padding: 10px;
  margin: 10px 0;
  width: 100%;
}
#idc-container-parent #idc-container .idc-user .idc-head_action.idc-user {
  background: #fff;
  width: 100%;
  margin: 0;
  border-radius: 0;
}
#idc-container-parent #IDCThread {
  background: #ffffff !important;
}
#idc-container-parent #IDCThread #IDCommentsNewThread .idc-c-b {
  padding: 0;
}
#idc-container-parent #IDCThread #IDCommentsNewThread .idc-c-b #IDNewThreadSubmitLI .idc-btn_l {
  background: #075384;
  border: none;
  border-bottom: 2px solid;
  border-radius: 0;
  color: #fff;
  display: block;
  height: 2em;
  line-height: 2em;
  position: relative;
  text-align: center;
  text-decoration: none;
  text-shadow: none;
}
#idc-container-parent #IDCThread #IDCommentsNewThread .idc-c-b #IDNewThreadSubmitLI .idc-btn_l span {
  background: none;
  text-shadow: none;
  line-height: 27px !important;
}
#idc-container-parent #IDCThread #IDCommentsNewThread .idc-c-b #IDNewThreadSubmitLI .idc-btn_l .idc-r {
  color: #fff;
}
#idc-container-parent h3 {
  color: #000;
}

#idc-container .idc-btn_l span, #idc-container .idc-btn_s span {
  backgorund: none;
}

#idc-container div.idc-text_noresize, #idc-container textarea.idc-text_noresize {
  width: 100% !important;
}

.tabs_submit_story li {
  width: 25%;
}

#story_submit_anchor_tag {
  width: 100%;
  border-top: 1px solid #e5e8f1;
  margin-bottom: 20px;
}

.campaign-featured-image {
  min-height: 380px;
  padding: 30px;
  background-position: right;
  position: relative;
}

.campaign-text-box {
  max-width: 400px;
  background-color: rgba(255, 255, 255, 0.7);
  padding: 25px;
}

.dark-bg {
  background-color: rgba(35, 31, 32, 0.6);
}

.dark-layer {
  background-color: rgba(35, 31, 32, 0.6);
  padding: 0 3px;
}

.submissions-single-campaign {
  position: absolute;
  bottom: 10px;
  right: 10px;
  z-index: 10;
  color: white;
  font-size: 12px;
  background-color: rgba(35, 31, 32, 0.6);
  padding: 0 3px;
}

.camp-intro {
  color: #fff;
  background-color: #075384;
  padding: 10px 25px;
  margin-bottom: 5px;
}

.story-campaign {
  margin-top: 45px;
}

.wow-section {
  padding: 30px 0 30px;
  border-top: 0;
}
.wow-section h2 {
  width: 70%;
  margin: 0 auto;
  font-size: 36px;
}
.wow-section .btn--primary {
  margin-top: 40px;
}

@media all and (max-width: 768px) {
  .wow-section h2 {
    width: 85%;
  }
}
@media all and (max-width: 600px) {
  .wow-section h2 {
    width: 100%;
    font-size: 24px;
  }
}
.spotify-container {
  width: 100%;
  height: 400px;
}

.campaigns__item-state-open {
  background-color: green;
}

.campaigns__item-state-float-right {
  width: auto;
  float: right;
  cursor: default;
}

.single-story-featured {
  margin-top: -20px;
  color: #fff;
  background-color: #ee2346;
  display: table;
  line-height: normal;
  padding: 2px 6px;
  margin-bottom: 5px;
  font-size: 11px;
}

.video-container {
  position: relative;
  padding-bottom: 56.25%;
  height: 0;
  overflow: hidden;
  margin: 30px 0 20px 0;
}

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

.entry-content img,
.entry-content iframe,
.entry-content object,
.entry-content embed {
  max-width: 100%;
}

a.no-decor:hover {
  text-decoration: none;
}

.socialUtil {
  margin: 10px 0;
  min-height: 55px;
  float: left;
  font-weight: bold;
  width: 100%;
  clear: both;
  display: inline;
}
.socialUtil .alignLeft {
  float: left;
}
.socialUtil #post_stats {
  float: right;
  margin-top: 26px;
  display: inline;
}
@media screen and (max-width: 1025px) {
  .socialUtil #post_stats {
    float: left;
    display: block;
    margin-top: 5px;
  }
}
.socialUtil #post_stats .view_count {
  width: auto;
  margin-bottom: 5px;
  color: #575a5d;
  line-height: 1em;
  font-size: 12px;
  margin-right: 20px;
  display: inline;
}
.socialUtil #post_stats .view_count span {
  color: #075384;
  word-spacing: 0.3em;
}
.socialUtil .icon-wrap {
  width: 20px;
  text-align: right;
  display: inline-block;
  vertical-align: text-top;
}
.socialUtil .icon {
  display: inline-block;
  fill: #808285;
  width: 18px;
  height: 12px;
  vertical-align: top;
}

.sharing_buttons {
  margin: 5px 0;
  text-align: left;
  line-height: normal;
}
.sharing_buttons .socialShareButton {
  width: 80px;
  height: 35px;
  margin-right: 1px;
  display: inline-block;
}
.sharing_buttons .socialShareButton span {
  position: absolute;
  left: -9999em;
}
.sharing_buttons .socialShareButton a {
  width: 100%;
  height: 32px;
  line-height: normal;
  text-decoration: none;
  /*margin-top: 3px;*/
  /*float: left;*/
  display: inline-block;
  background-repeat: no-repeat;
}
.sharing_buttons .socialShareButton a:hover {
  text-decoration: none !important;
  border-bottom: none !important;
}
.sharing_buttons .shareOnFacebook {
  background: #3C5898 no-repeat;
}
.sharing_buttons .shareOnFacebook a {
  background: url(images/icons/socialShareIcons.png) 8px 10px no-repeat;
}
.sharing_buttons .shareOnTwitter {
  background: #6AADD1;
}
.sharing_buttons .shareOnTwitter a {
  background: url(images/icons/socialShareIcons.png) 10px -29px no-repeat;
}
.sharing_buttons .shareOnGoogle {
  background: #CD3627;
}
.sharing_buttons .shareOnGoogle a {
  background: url(images/icons/socialShareIcons.png) 8px -65px no-repeat;
}
.sharing_buttons .shareOnWhatsapp {
  background: #65bc54;
  display: none;
}
.sharing_buttons .shareOnWhatsapp a {
  background: url(images/icons/socialShareIcons.png) 8px -146px no-repeat;
}
.sharing_buttons .shareOnEmail {
  background: #666666;
}
.sharing_buttons .shareOnEmail a {
  background: url(images/icons/socialShareIcons.png) 8px -186px no-repeat;
}
.sharing_buttons .shareOnSMS {
  background: #882277;
  display: none;
}
.sharing_buttons .shareOnSMS a {
  background: url(images/icons/socialShareIcons.png) 8px -228px no-repeat;
}

@media all and (max-width: 1025px) {
  .socialUtil .alignLeft {
    float: none;
  }
}
@media all and (max-width: 768px) {
  .sharing_buttons .socialShareButton {
    width: 35px;
    height: 35px;
  }
  .sharing_buttons .socialShareButton a {
    height: 32px;
  }
  .sharing_buttons .shareOnEmail a {
    background: url(images/icons/socialShareIcons.png) 4px -186px no-repeat;
  }
  .sharing_buttons .shareOnSMS a {
    background: url(images/icons/socialShareIcons.png) 4px -228px no-repeat;
  }
}
.no-margin-bottom {
  margin-bottom: 0;
}

.textarea-big {
  height: 272px !important;
}

.inputfile {
  width: 0.1px;
  height: 0.1px;
  opacity: 0;
  overflow: hidden;
  position: absolute;
  z-index: -1;
}

.input-label label {
  cursor: pointer;
  /* "hand" cursor */
}

.validation .wpcf7-validation-errors, .validation .wpcf7-spam-blocked {
  background: #ff0000;
  border: none;
  color: #ffffff;
  margin: 0 0 1em 0;
  padding: 5px;
  width: 100%;
}

.validation .wpcf7-validation-errors:before, .validation .wpcf7-spam-blocked:before {
  background: #ffffff;
  border-radius: 100%;
  -webkit-border-radius: 100%;
  -moz-border-radius: 100%;
  color: #ff0000;
  content: '!';
  margin-right: 5px;
  padding: 2px 7px;
}

.sod_option.optgroup {
  background-color: #F7F6F6 !important;
  color: inherit !important;
  font-size: 14px !important;
}

.sod_option.groupchild {
  padding-left: 40px !important;
}

.sod_select .sod_option {
  overflow: initial;
  white-space: normal;
}

.form-element.checkbox input[type="checkbox"] {
  vertical-align: sub;
}
.form-element.checkbox.aligned span.wpcf7-list-item {
  margin-left: 0;
}
.form-element.checkbox.aligned .txt {
  margin-left: -5px;
}

/*
/* Meet the mods
*/
.meet-the-mods .list .articleBlock {
  border-bottom: 4px solid #025F78;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  float: left;
  padding-bottom: 15px;
  font-size: 14px;
}
.meet-the-mods .list .articleBlock h3 {
  color: #000;
  display: inline-block;
  font-size: 1.1em;
  margin-bottom: 5px;
  width: 70%;
}
.meet-the-mods .list .articleBlock p {
  color: #575a5d;
  display: inline-block;
  line-height: 1.3em;
  margin-bottom: 10px;
  padding-bottom: 15px;
  width: 70%;
}
.meet-the-mods .list .articleBlock img {
  background: #eee;
  border: 1px solid #a2a5a4;
  display: inline-block;
  float: left;
  height: auto;
  margin: 5px 2% 0 0;
  padding: 1px;
  -moz-transform: rotate(-2deg);
  -ms-transform: rotate(-2deg);
  -o-transform: rotate(-2deg);
  -webkit-transform: rotate(-2deg);
  transform: rotate(-2deg);
  width: 28%;
}
.meet-the-mods .articleBlock {
  margin-bottom: 14px;
}
.meet-the-mods .articleBlock:nth-child(odd) {
  margin-right: 1%;
}
@media (max-width: 1024px) {
  .meet-the-mods .articleBlock {
    width: 100%;
  }
}
@media (min-width: 1025px) {
  .meet-the-mods .articleBlock {
    width: 49.5%;
    height: 265px;
  }
}

.newArticleBlock .flag__body {
  bottom: 5px;
  left: 5px;
  top: inherit;
  padding-right: 10px;
}
.newArticleBlock .flag__body h3 {
  font-size: 16px;
}
.newArticleBlock .flag__body p {
  font-size: 12px;
}
.newArticleBlock .flag__body p, .newArticleBlock .flag__body h3 {
  background-color: rgba(35, 31, 32, 0.7);
  padding: 0 5px;
  display: block;
}
.newArticleBlock .your-stories__social {
  display: block;
  top: 5px;
  right: 5px;
}
.newArticleBlock .your-stories__social .icon-wrap {
  width: auto;
}
.newArticleBlock .typeOfPost {
  display: block;
  top: 5px;
  left: 5px;
  position: absolute;
  z-index: 2;
  font-size: 10px;
  font-weight: bold;
  padding: 2px;
  line-height: 8px;
  color: #fff;
}

.category-filter div {
  color: #333742;
  font-weight: bold;
  font-size: 16px;
}
.category-filter ul {
  margin-left: 0;
  margin-bottom: 5px;
}
.category-filter li {
  color: #333742;
  display: inline-block;
  margin-left: 0;
}
.category-filter li:after {
  content: "|";
}
.category-filter li:last-child:after {
  content: "";
}
.category-filter li a {
  font-size: 14px;
  padding: 2px 3px;
}
.category-filter li a:hover {
  text-decoration: none;
  color: #fff !important;
}
.category-filter li a:hover:visited {
  color: #fff !important;
}
.category-filter li.current-cat a {
  color: #fff !important;
}
.category-filter li.current-cat a:visited {
  color: #fff !important;
}

.category-pagination, .category-pagination-no-float {
  float: right;
  font-weight: bold;
  font-size: 14px;
}
.category-pagination a, .category-pagination-no-float a {
  border: 1px solid #d9d9d9;
  padding: 0 3px;
  color: #5f5f5f;
}
.category-pagination a:hover, .category-pagination-no-float a:hover {
  text-decoration: none;
  background-color: #5f5f5f;
  color: #fff;
}
.category-pagination .current, .category-pagination-no-float .current, .category-pagination .dots, .category-pagination-no-float .dots {
  color: #a2a5a4;
}

.category-pagination-no-float {
  float: none;
  width: 100%;
  text-align: right;
}

.no-results {
  margin: 40px 0;
  font-weight: bold;
}

/* Expert Chat Category */
.expert-chat-active {
  background: #025F78;
  bottom: 0;
  left: 0;
  line-height: 2em;
  position: fixed;
  text-align: center;
  z-index: 10;
}
.expert-chat-active img {
  margin: 0 .3em -.4em 0;
}
.expert-chat-active p, .expert-chat-active a {
  color: #fff;
  margin: 0;
}
.expert-chat-active a:hover {
  text-decoration: none;
}

.expert-chat-calendar-wrap h3 {
  margin-bottom: .5em;
}

.expert-chat-calendar {
  border-bottom: 1px solid #eee;
  border-top: 1px solid #eee;
  height: 20em;
  margin-bottom: 1em;
  overflow: auto;
}
.expert-chat-calendar table {
  border-collapse: collapse;
  border-spacing: 0;
  margin-bottom: 1em;
  table-layout: fixed;
  text-align: center;
  word-break: normal;
  width: 100%;
}
.expert-chat-calendar table th, .expert-chat-calendar table td {
  border: 1px solid #d9d9d9;
  padding: 10px 5px;
}
.expert-chat-calendar table th {
  background: #eee;
}
.expert-chat-calendar table td.general-chat {
  background: #047B04;
  color: #fff;
}
.expert-chat-calendar table td.support-chat {
  background: #025F78;
  color: #fff;
}
.expert-chat-calendar table td.expert-chat {
  background: #D61807;
  color: #fff;
}

.calendar-row {
  border: 1px solid #eee;
  border-left: 2px solid;
  padding: 5px 7px;
  margin-bottom: 5px;
}
.calendar-row p {
  margin: 0;
}

/*
/* Chat Section
*/
.chat-section .viewStyle {
  margin-bottom: 1em;
}

/*
/* Chat cta
*/
.chat-cta {
  background: #eee;
  margin-bottom: 1em;
  padding: 10px;
  position: relative;
}
.chat-cta:after {
  bottom: 0;
  content: '';
  border-color: #5f5f5f #fff #fff #5f5f5f;
  border-style: solid;
  border-width: 5px 5px 5px 5px;
  position: absolute;
  right: 0;
}
.chat-cta p {
  margin: 0;
}
.chat-cta a {
  color: #000;
}

/*
/* Live Chat Calendar
*/
.chat-module-title {
  margin-bottom: .5em;
}
.chat-module-title:nth-child(2) {
  text-align: center;
}

.live-chat-calendar {
  float: left;
  margin-bottom: 1em;
}
.live-chat-calendar .col-6 {
  padding: 0;
}

.live-chat-calendar-days li, .live-chat-calendar-numbers li {
  background: #eee;
  float: left;
  margin: .2%;
  padding: 5px;
  width: 13.888%;
}

.chat-dots-wrapper {
  left: 0;
  position: absolute;
  top: 5px;
}

.active-chat {
  color: #fff;
  display: block;
  float: left;
  font-family: 'AsapBold', sans-serif;
  height: 15px;
  line-height: 15px;
  margin: 0 0 5px 5px;
  position: relative;
  text-align: center;
  width: 15px;
}
.active-chat img {
  width: 20px;
  height: 20px;
}

.live-chat-icon {
  background: url(images/chat-general.gif) 10px 10px no-repeat;
  font-family: 'AsapBold', sans-serif;
  height: 100%;
  left: 0;
  line-height: 45px;
  position: absolute;
  text-align: center;
  top: 0;
  width: 50px;
}

.live-chat-calendar-days li {
  background: #5f5f5f;
  color: #fff;
}

.live-chat-calendar-numbers li {
  border: 1px solid #d9d9d9;
  height: 75px;
  padding-top: 50px;
  position: relative;
}
.live-chat-calendar-numbers li.inactive {
  background: #d9d9d9;
}
.live-chat-calendar-numbers li.today {
  border: 1px solid #006699;
}

.chat-join a {
  background: #452187;
  color: #fff;
  display: block;
  padding: 5px;
  text-decoration: none;
  width: 50px;
}

.live-chat-general p {
  background: url(images/icon-chat-general.png) no-repeat 0 5px;
  padding-bottom: 13px;
}

.live-chat-expert p {
  background: url(images/icon-chat-expert.png) no-repeat 0 5px;
}

.live-chat-support p {
  background: url(images/icon-chat-support.png) no-repeat 0 5px;
}

.live-chat-relationship p {
  background: url(images/icon-chat-relationship.png) no-repeat 0 5px;
}

.live-chat-workshop p {
  background: url(images/icon-chat-workshop.png) no-repeat 0 5px;
}

.live-chat-politics-debate p {
  background: url(images/icon-chat-politics-debate.png) no-repeat 0 5px;
}

.live-chat-men-only p {
  background: url(images/icon-chat-men-only.png) no-repeat 0 5px;
}

.live-chat-women-only p {
  background: url(images/icon-chat-women-only.png) no-repeat 0 5px;
}

.live-chat-scroller {
  height: 335px;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  /*margin-top: 1em;*/
  /*padding-left:15px;*/
}
.live-chat-scroller li {
  margin-bottom: .5em;
}
.live-chat-scroller li .scroller-module {
  border: 1px solid #d9d9d9;
  float: left;
  padding: 5px 10px 10px 10px;
  position: relative;
  width: 100%;
}
.live-chat-scroller li .scroller-module p {
  padding-left: 40px;
}
.live-chat-scroller li .scroller-module div {
  padding-left: 40px;
}
.live-chat-scroller li .scroller-module div .chat-date {
  padding: 10px 0 0 30px;
  background: url("images/calendarIcon.png") no-repeat;
  margin-right: 25px;
}
.live-chat-scroller li .scroller-module div .chat-time {
  padding: 10px 0 0 30px;
  background: url("images/clockIcon.png") no-repeat;
}
.live-chat-scroller li .scroller-module div .joinChatButton {
  float: right;
  color: white;
  margin-top: -5px;
}
.live-chat-scroller li .scroller-module h3 {
  color: #006699;
}

.live-chat-scroller-scrollable {
  height: 340px;
  overflow: auto;
}

.calendar-arrow {
  background: url(images/calendar-arrow-sprite.gif) 0 0 no-repeat transparent;
  display: block;
  height: 30px;
  overflow: hidden;
  position: absolute;
  text-decoration: none;
  text-indent: 100%;
  top: 0;
  white-space: nowrap;
  width: 30px;
}

.calendar-arrow-right {
  background-position: 0 0;
  right: 0;
}

.calendar-arrow-left {
  background-position: -30px 0;
  left: 0;
}

/*
/* Chat archive
*/
.chatIntro img {
  float: left;
  margin: 0 10px 10px 0;
}

.chatArchive #article p {
  border-bottom: 1px solid #d9d9d9;
  margin-left: 20px;
}
.chatArchive #article p.backToTop, .chatArchive #article p.rightFloat {
  border: none;
}
.chatArchive #article .tags p {
  border-bottom: none;
}
.chatArchive #article blockquote {
  background: url("../images/quoteOpenHealth.png") 5% 1.2em no-repeat;
}
.chatArchive #article blockquote div {
  background: url("../images/quoteCloseHealth.png") 95% 0em no-repeat;
}
.chatArchive #article .chat-question {
  margin-left: 0;
}
.chatArchive #article .chat-quotes {
  float: left;
}
.chatArchive #article .chat-mod strong {
  color: #452187;
}
.chatArchive #article .chat-expert strong {
  color: #047B04;
}

.chat-closed {
  background: #d9d9d9;
  float: left;
  margin-bottom: 1em;
  padding: 10px;
  position: relative;
  margin-top: 1em;
}
.chat-closed:after {
  border-width: 10px;
  border-style: solid;
  border-color: #a2a5a4 #fff #fff #a2a5a4;
  content: '';
  position: absolute;
  right: 0;
  bottom: 0;
}

.meet-the-mods-module {
  float: left;
}
.meet-the-mods-module li {
  float: left;
  height: 77px;
  padding: 0 1px;
}
.meet-the-mods-module li img {
  width: 75px;
}
.meet-the-mods-module a {
  color: #000;
  text-decoration: none;
}
.meet-the-mods-module .cta {
  margin-top: 1em;
}

.cta {
  float: left;
  margin-top: 5px;
  text-align: right;
}
.cta a {
  color: #000;
  text-decoration: none;
}

/*
/* Chat Homepage
*/
.chat-schedule {
  border: 1px solid #d9d9d9;
  float: left;
  margin: 0;
  width: 100%;
}
.chat-schedule li {
  background: #fff;
  border-right: 1px solid #d9d9d9;
  float: left;
  list-style: none;
  margin: 0;
  width: 14.28%;
}
.chat-schedule li:last-child {
  border: none;
}
.chat-schedule li:nth-child(odd) {
  background: #eee;
}
.chat-schedule span {
  float: left;
  padding: 10px;
  width: 100%;
}
.chat-schedule .chat-day {
  text-transform: uppercase;
}
.chat-schedule .chat-day-active {
  background: #fff;
  color: #D61807;
  margin: -2px 2% 0;
  width: 96%;
}
.chat-schedule .chat-details {
  height: 120px;
}
.chat-schedule .chat-live {
  background: #D61807;
  margin-top: -8px;
  padding: 5px 0;
}
.chat-schedule .chat-live p {
  color: #fff;
}

/*
/* Chat home
*/
.chat-home .mainContent {
  padding: 0;
}
.chat-home #intro {
  background: url(images/category-header-chat.jpg) 0 0 no-repeat transparent;
  height: 250px;
  margin-bottom: 1em;
}
.chat-home #intro h1, .chat-home #intro p {
  background: #fff;
  float: left;
  padding: 10px;
  width: auto;
}
.chat-home #intro h1 {
  margin: 20px 20px 0;
  font-size: 2em;
}
.chat-home #intro p {
  margin: 10px 20px 0;
}

@media all and (max-width: 320px) {
  .live-chat-scroller li .scroller-module div span {
    float: left;
    margin-top: 10px;
  }
}
@media all and (max-width: 480px) {
  .live-chat-scroller li .scroller-module div .joinChatButton {
    float: left;
    margin-top: 20px;
  }
}
@media all and (max-width: 600px) {
  .live-chat-calender {
    display: none;
  }
}
@media all and (min-width: 768px) and (max-width: 1023px) {
  .live-chat-scroller li .scroller-module div .joinChatButton {
    margin-top: 20px;
  }

  .live-chat-calendar-numbers li {
    height: 115px;
    padding-top: 95px;
  }
}
@media all and (min-width: 768px) {
  .live-chat-scroller.col-6 {
    padding-left: 10px;
  }
}
@media all and (max-width: 1024px) {
  #html5chat .fullScreenLink {
    display: none;
  }
}
@media all and (min-width: 1025px) {
  .live-chat-scroller li .scroller-module div {
    margin-top: 20px;
  }

  .live-chat-calendar {
    padding: 0;
  }

  .chatFrameMax {
    position: absolute;
    top: 0px;
    left: 0;
    z-index: 1000;
    background: #ffffff;
  }

  #html5chat .fullScreenLink, #html5chat .minScreenLink {
    border: 0 !important;
    float: right;
    padding: 5px 5px 0 0;
    text-decoration: none;
  }
  #html5chat .fullScreenLink img, #html5chat .minScreenLink img {
    float: right;
  }
  #html5chat .minScreenLink {
    padding-right: 15px;
  }

  #article iframe.chatFrame {
    margin-top: 0;
  }
}
.active-chat {
  height: 18px;
  line-height: 20px;
  width: 20px;
}

.scroller-module div {
  margin-top: 0 !important;
}
.scroller-module p {
  padding-bottom: 0 !important;
}

.live-chat-scroller h3 {
  margin-bottom: 0 !important;
  font-size: 14px !important;
}
.live-chat-scroller li .scroller-module {
  /*height: 120px;*/
  padding-top: 10px;
}

.live-chat-icon {
  line-height: 105px;
  background-position: 10px 40px;
}

.chat-join a {
  position: absolute;
  right: 7px;
  bottom: 7px;
}

.new-live-chat {
  margin-bottom: 40px;
}
.new-live-chat .layout__item {
  margin-bottom: 0 !important;
}
.new-live-chat .joinChatButton {
  color: #ffffff;
}
.new-live-chat ul, .new-live-chat ol {
  list-style-type: none !important;
  margin-left: 0;
}
.new-live-chat .btn--tiny {
  width: auto;
  padding: 0 4px;
}

.live-chat-calender {
  margin-top: 6px;
}
.live-chat-calender ul, .live-chat-calender ol {
  margin-bottom: 0 !important;
}

#tslocal #set_location_box a, #tslocal #set_location_box a:hover {
  color: #333742;
  text-decoration: underline;
}
#tslocal .single-location .subheader span {
  color: #fff;
  font-size: 20px;
  font-weight: bold;
  text-transform: uppercase;
}
#tslocal .welcome-boxes__item {
  height: 300px;
}
#tslocal .localLafWidget {
  background: url("/wp-content/plugins/yn-tslocal/assets/lafWidgetBg.jpg") center;
}
#tslocal .welcome_message {
  margin: 20px 40px !important;
  text-align: left;
}
#tslocal .welcome_message h1 {
  font-size: 36px;
}
@media screen and (max-width: 1024px) {
  #tslocal .welcome_message h1 {
    font-size: 28px;
  }
}
@media screen and (max-width: 480px) {
  #tslocal .welcome_message h1 {
    font-size: 22px;
  }
}
#tslocal .localLafSearchBoxContainer {
  padding: 10px;
}
#tslocal .localLafSearchBox {
  background: url("/wp-content/plugins/yn-tslocal/assets/lafWidgetFormBg.png");
  color: #fff;
  margin: 0 auto;
  max-width: 360px;
  padding: 10px 20px;
}
#tslocal .localLafSearchBox h3 {
  color: #fff;
  margin-bottom: 10px;
}
#tslocal .localLafAppBox span {
  font-size: 14px;
}
#tslocal .localLafAppBox p {
  margin-bottom: 0;
}
#tslocal .distancetype span, #tslocal .distancetype label {
  display: inline-block;
}
#tslocal .localLafFieldContainer {
  margin-bottom: 10px;
}
#tslocal #myCurrentLocation {
  background: url("/wp-content/plugins/yn-tslocal/assets/location-2.png") no-repeat 378px center #333;
  color: #fff;
  display: block;
  max-width: 400px;
  padding: 6px 10px;
}
#tslocal #myCurrentLocation:hover {
  text-decoration: none;
}
#tslocal ul#tslocalMenu {
  margin-left: 0;
}
#tslocal ul#tslocalMenu li {
  border-top: 1px solid #eaeaea;
  line-height: 2.5em;
  list-style: none !important;
  max-width: 50%;
}
#tslocal ul#tslocalMenu a {
  color: #333742;
  font-size: 14px;
  line-height: 1.8em;
}
#tslocal .archive-location .main-content h1 {
  font-size: 42px;
}
#tslocal .archive-location .main-content h2 {
  font-size: 30px;
}
#tslocal .archive-location .main-content h3 {
  font-size: 20px;
}
#tslocal .remove_location_cookie {
  color: #333742;
  font-size: 11px;
}

.set-location {
  margin-top: -35px;
}

.menu_location_link {
  background: url("/wp-content/plugins/yn-tslocal/assets/location_icon.png") no-repeat center center;
}

.menu_location_link:hover {
  background: #fff url("/wp-content/plugins/yn-tslocal/assets/location_icon_dark.png") no-repeat center center;
}

@media all and (max-width: 520px) and (min-width: 250px), (max-width: 871px) and (min-width: 769px) {
  #tslocal .localLafWidget {
    background: transparent none;
  }
  #tslocal .localLafSearchBoxContainer {
    padding: 0;
  }
  #tslocal .localLafAppBox p span {
    display: block;
  }
}
.local-header {
  margin-left: 20px;
  margin-bottom: 50px;
}
.local-header .layout__item {
  margin-bottom: 0 !important;
  padding-left: 0 !important;
}
.local-header h1 {
  color: #fff;
}
.local-header .welcome-boxes__item {
  background: none !important;
  color: #fff;
}
.local-header .welcome-boxes__item .welcome_message {
  margin: 40px !important;
}
@media screen and (max-width: 482px) {
  .local-header .welcome-boxes__item .welcome_message {
    margin: 20px !important;
  }
}
.local-header .localLafWidget {
  background: none !important;
}
.local-header .localLafSearchBox {
  max-height: 300px;
}
@media screen and (max-width: 770px) {
  .local-header .localLafSearchBox {
    margin: 10px auto !important;
  }
}

.local-partners .local-partners-header h2, .local-partners .local-partners-header p {
  margin-bottom: 10px;
}
.local-partners .link-box {
  padding: 10px 0;
}
.local-partners .link-box a:hover {
  text-decoration: none;
}
.local-partners .link-box a:hover .wrapper {
  background-color: #075384;
}
.local-partners .link-box a:hover h3, .local-partners .link-box a:hover p {
  color: #fff;
}
.local-partners .link-box .wrapper {
  background-color: #E8EFFF;
  height: 225px;
  padding: 5px 10px;
  margin-right: 15px;
}
@media screen and (max-width: 767px) {
  .local-partners .link-box .wrapper {
    height: auto;
  }
}
.local-partners .link-box .img-wrapper {
  width: 100%;
  text-align: center;
}
.local-partners .link-box .img-wrapper img {
  margin-bottom: 5px;
}
.local-partners h3, .local-partners p {
  margin-bottom: 0;
  color: #333742;
}

#location-events h2 {
  color: #075384;
  margin-bottom: -4px;
}
#location-events h3 {
  margin-bottom: 0;
}
#location-events p {
  margin-bottom: 5px;
  color: #333742;
}
#location-events .campaign-boxes__item.no-dark-layer .img-wrap:before {
  background: none;
}
#location-events .campaign-boxes__item {
  padding: 10px;
  background-color: #e6e6e6;
}
@media screen and (min-width: 769px) {
  #location-events .campaign-boxes__item {
    height: 335px;
    overflow: hidden;
  }
}
#location-events .campaign-boxes__item p {
  max-width: none !important;
}
@media screen and (min-width: 769px) {
  #location-events .campaign-boxes__item .header {
    height: 77px;
    overflow: hidden;
  }
}
#location-events .event-list {
  background-color: #fff;
}
#location-events .event-list .layout__item {
  margin-bottom: 0;
  padding-left: 0;
}
@media screen and (min-width: 769px) {
  #location-events .event-list {
    height: 235px;
    overflow: auto;
  }
}
#location-events .event-list .single-event {
  border-bottom: 1px solid #e6e6e6;
}
#location-events .event-list .single-event:last-child {
  border-bottom: none;
}
@media screen and (max-width: 480px) {
  #location-events .event-list .single-event {
    margin-bottom: 10px;
  }
  #location-events .event-list .single-event:last-child {
    margin-bottom: 0;
  }
}
#location-events .event-list .single-event p {
  color: #333742 !important;
  line-height: normal;
}
@media screen and (min-width: 481px) {
  #location-events .event-list .single-event p {
    font-size: 90%;
    margin-bottom: 10px;
  }
}
#location-events .event-list .single-event h4 {
  color: #ee2346;
}
@media screen and (min-width: 481px) {
  #location-events .event-list .single-event h4 {
    font-size: 90%;
  }
}
@media screen and (min-width: 481px) {
  #location-events .event-list .single-event .event-thumbnail img {
    width: 80px;
    float: left;
    margin-left: 10px;
    margin-top: 10px;
  }
}
#location-events .event-list .single-event .event-text {
  padding: 10px 10px 0 10px;
}
@media screen and (min-width: 481px) {
  #location-events .event-list .single-event .event-text {
    overflow: hidden;
  }
}
#location-events .event-list .single-event .event-text .event-desc h4 {
  margin-bottom: 10px;
}
#location-events .event-list .single-event .event-text .event-data .icon-p .icon {
  float: left;
  color: #808285;
}
@media screen and (min-width: 481px) {
  #location-events .event-list .single-event .event-text .event-data .icon-p .icon {
    width: 12px;
    height: 12px;
  }
}
#location-events .event-list .single-event .event-text .event-data .icon-p p {
  overflow: hidden;
  padding-left: 5px;
}
#location-events .event-list .single-event .event-text .event-data .fix .link {
  text-align: right;
  margin-right: 0;
  padding-top: 5px;
  margin-bottom: 5px;
}

@media screen and (min-width: 600px) and (max-width: 768px), screen and (min-width: 990px) {
  .event-list .column1 {
    width: 45%;
    float: left;
  }

  .event-list .column2 {
    width: 45%;
    vertical-align: top;
    float: right;
  }
}
.event-list-restriction {
  background: url("images/icons/label-grey.svg");
}

.event-list-date {
  background: url("images/icons/calendar.svg");
}

.event-list-address {
  background: url("images/icons/location-icon.svg");
}

.event-list-icons {
  background-size: 16px 16px;
  background-position: 0 2px;
  background-repeat: no-repeat;
  float: left;
}
.event-list-icons .test-class {
  float: left;
  margin-left: 22px;
}
@media screen and (min-width: 481px) {
  .event-list-icons {
    background-size: 12px 12px;
    font-size: 90%;
    background-position: 0 3px;
  }
  .event-list-icons .test-class {
    margin-left: 16px;
  }
}

@media screen and (min-width: 1024px) {
  .fix {
    width: 49% !important;
  }
}
.btn--primary.btn--full.local-image {
  height: auto;
  white-space: normal;
  overflow: auto;
  padding: 10px;
  line-height: 25px;
  background-position-y: 50%;
  background-image: url("images/local-cta-blue.png");
  background-repeat: no-repeat;
  background-position-x: 15px;
}

.local-spotlight .campaign-boxes__item .img-wrap:before {
  background-color: rgba(35, 31, 32, 0.45);
}

.owl-height, .hero-slider__item-content {
  min-height: 380px;
}

.hero-slider__item-content h1 {
  max-width: 500px;
}

.campaign-boxes__item {
  min-height: 335px;
}

.campaign-slider .hero-slider__item-content:after {
  background-color: rgba(255, 255, 255, 0.7);
}

.aaq h2.debateArticleHeading {
  background: #eeeeee;
  color: #ffffff;
  margin-bottom: 10px;
}
.aaq h2.debateArticleHeading span {
  background: #D61807 url(images/debateAnswerHeading.png) no-repeat 100% 100%;
  padding: 5px;
  display: block;
  width: 140px;
}
.aaq #article .socialUtil {
  margin-bottom: 0;
}
.aaq #article .tags {
  padding: 0;
}
.aaq blockquote.blockquoteTwo {
  background-color: white;
}
.aaq .answerQna {
  background: #FBF4D0 !important;
  float: left;
  margin-bottom: 5px;
}
.aaq .answerQna .userProfile {
  float: left;
  width: 90px;
  position: relative;
}
.aaq .answerQna .userProfile span {
  background: #047B04;
  color: #ffffff;
  width: 90px;
  text-align: center;
  padding: 2px;
  position: absolute;
  top: 90px;
  right: 0;
  line-height: 1.2em;
}
.aaq .answerQna .expertAnswer {
  float: right;
  /* width:82%;*/
}

.aaqHome .mainContent .col-6, .aaqHome .mainContent .col-12 {
  padding: 0;
}
.aaqHome .mainContent .categoryMainContent {
  clear: both;
}
.aaqHome .mainContent .categoryMainContent h2 {
  border-bottom: 2px solid #000000;
  padding: 5px 10px 0 5px;
}
.aaqHome .mainContent h2 {
  margin-bottom: .75em;
}
.aaqHome .askAQuestionContainer {
  width: 100%;
  float: left;
  margin-bottom: 20px;
}
.aaqHome .askAQuestionContainer .askContent {
  background: #006690;
  padding: 20px;
  color: #ffffff;
}
.aaqHome .askAQuestionContainer .askContent .aaqButton {
  background: #cd3301;
  border-bottom: 3px solid #85391f;
}
.aaqHome .askAQuestionContainer .askContent .aaqButton:hover {
  background: #9a2601;
}
.aaqHome .askAQuestionContainer .askQuote {
  /*margin-top:80px;*/
}
.aaqHome .askAQuestionContainer .askQuote blockquote.blockquoteTwo {
  font-weight: bold;
  /*width:30em;
  margin-left:50px;*/
}
.aaqHome .nextChatContainer {
  border: 1px solid #EEEEEE;
  float: left;
  width: 100%;
  background: #EEEEEE;
}
.aaqHome .nextChatContainer h3 {
  font-size: 14px;
  margin-bottom: 0;
}
.aaqHome .nextChatContainer .chatDetails, .aaqHome .nextChatContainer .chatDateInfo {
  float: left;
}
.aaqHome .nextChatContainer .chatDetails {
  padding: 5px;
  background: #ffffff;
  height: 175px;
  width: 60%;
}
.aaqHome .nextChatContainer .chatDateInfo {
  margin-top: 30px;
  background: url(images/sideArrow.png) no-repeat -2px 50%;
  width: 40%;
}
.aaqHome .nextChatContainer .chatDateInfo .chatDate, .aaqHome .nextChatContainer .chatDateInfo .chatTime {
  margin-top: 0;
  padding-top: 30px;
  text-align: center;
  float: left;
}
.aaqHome .nextChatContainer .chatDateInfo .chatDate {
  background: url(images/calendarIcon.png) no-repeat 60% 0%;
  padding-left: 15px;
  width: 100px;
}
.aaqHome .nextChatContainer .chatDateInfo .chatTime {
  background: url(images/clockIcon.png) no-repeat 50% 0%;
}
.aaqHome .nextChatContainer .chatDateInfo .joinChat {
  float: left;
  /*margin-top:30px;*/
  margin: 20px;
}
.aaqHome .meetTheTeam .teamDetailsContainer {
  border: 1px solid #EEEEEE;
  padding: 5px;
  float: left;
  width: 100%;
}
.aaqHome .meetTheTeam .teamDetailsContainer .team {
  /*width:12.1%;
  margin:5px;*/
  float: left;
  /*padding:0 0 0 10px;*/
}
.aaqHome .meetTheTeam .teamDetailsContainer .team a {
  font-size: 0.75em;
  position: relative;
  color: #ffffff;
  /*height:60px;
  width:60px;*/
  overflow: hidden;
  float: left;
}
.aaqHome .meetTheTeam .teamDetailsContainer .team a img {
  /*width:60px;*/
}
.aaqHome .meetTheTeam .teamDetailsContainer .team a span {
  margin-top: 0;
  background: #000000;
  display: block;
  padding: 2px 0 2px 3px;
  line-height: 1.3em;
  /*width:60px;*/
}
.aaqHome .meetTheTeam .teamDetailsContainer .team a:hover span {
  position: absolute;
  bottom: 0;
  opacity: 0.75;
}
.aaqHome .debateQuestionContainer {
  width: 100%;
  float: left;
  margin: 20px 0;
}
.aaqHome .debateQuestionContainer .debateQuestion {
  /*width:80%;*/
  padding: 15px;
  border: 1px solid #eeeeee;
  background: #eeeeee url(images/aaqJoinDebate.png) no-repeat 99% 50%;
}
.aaqHome .debateQuestionContainer .debateQuestion p {
  padding-right: 150px;
}
.aaqHome .debateQuestionContainer .debateQuestion .response span {
  font-weight: bold;
}
.aaqHome .debateQuestionContainer .aaqButton {
  background: #9e6214;
  border-bottom: 3px solid #71460E;
}
.aaqHome .debateQuestionContainer .aaqButton:hover {
  background: #71460e;
}
.aaqHome .categoryMainContent .viewMore {
  float: right;
}
.aaqHome .categoryMainContent .viewMore a {
  color: #000000;
}
.aaqHome .hero-slider .hero-slider__item-content {
  min-height: 325px;
}
.aaqHome .hero-slider .img-wrap {
  background-position: 0 0;
}
.aaqHome .hero-slider .inner-wrap {
  float: left;
}
.aaqHome .hero-slider .inner-wrap-quote {
  float: right;
  width: 35%;
}
.aaqHome .hero-slider .blockquoteGrey {
  background-position: 5px top;
}
.aaqHome .hero-slider .blockquoteGrey div {
  color: #000;
}
.aaqHome .newNextChatContainer {
  border: 1px solid #eeeeee;
  padding: 10px 20px;
}
.aaqHome .newNextChatContainer h3 {
  font-size: 14px;
  margin-bottom: 5px;
}
.aaqHome .newNextChatContainer p {
  margin-bottom: 10px;
}
.aaqHome .newNextChatContainer .newChatDetails {
  padding: 5px;
  text-align: center;
}
.aaqHome .newNextChatContainer .newChatDetails .newDate {
  background: url(images/calendarIcon.png) no-repeat 50% 0;
  width: 120px;
  padding-top: 30px;
  display: inline-block;
  text-align: center;
}
.aaqHome .newNextChatContainer .newChatDetails .newTime {
  background: url(images/clockIcon.png) no-repeat 50% 0;
  width: 120px;
  padding-top: 30px;
  display: inline-block;
  text-align: center;
}
.aaqHome .newNextChatContainer .newChatDetails .newButton {
  display: inline-block;
  padding-top: 30px;
}
.aaqHome .newNextChatContainer .newChatDetails .newButton .btn--tiny {
  width: auto;
  padding: 0 4px;
}

.aaqButton {
  width: 200px;
  color: #ffffff;
  border-bottom: 3px solid #000000;
  text-decoration: none;
  display: block;
  padding: 5px;
  text-align: center;
}

@media all and (min-width: 320px) {
  .aaq .answerQna .expertAnswer {
    margin-top: 50px;
    width: 100%;
  }

  .aaqHome .mainContent .askAQuestionContainer .askQuote {
    padding: 0;
  }
  .aaqHome .mainContent .debateQuestionContainer .debateQuestion {
    background: #F0D5A6;
    float: left;
  }
  .aaqHome .mainContent .debateQuestionContainer .debateQuestion .response {
    margin: 5px;
    float: left;
  }
  .aaqHome .mainContent .debateQuestionContainer .aaqButton {
    float: left;
  }
  .aaqHome .meetTheTeam .teamDetailsContainer .team {
    margin: 5px;
  }
  .aaqHome .meetTheTeam .teamDetailsContainer .team a {
    height: 70px;
    width: 70px;
  }
  .aaqHome .meetTheTeam .teamDetailsContainer .team a img {
    width: 70px;
    height: 70px;
  }
  .aaqHome .meetTheTeam .teamDetailsContainer .team a span {
    width: 70px;
  }
}
@media all and (min-width: 480px) {
  .aaq .answerQna .expertAnswer {
    margin-top: 0;
    width: 75%;
  }

  .aaqHome .mainContent .meetTheTeam .teamDetailsContainer .team {
    width: 17.5%;
  }
  .aaqHome .mainContent .debateQuestionContainer .debateQuestion .response {
    margin: 5px 20px;
  }
}
@media all and (min-width: 568px) {
  .aaq .answerQna .expertAnswer {
    width: 80%;
  }

  .aaqHome .mainContent .meetTheTeam .teamDetailsContainer .team {
    width: 14.5%;
  }
}
@media all and (min-width: 568px) and (max-width: 1024px) {
  .aaqHome .mainContent .nextChat .nextChatContainer .chatDetails, .aaqHome .mainContent .nextChat .nextChatContainer .chatDateInfo {
    width: 50%;
  }
  .aaqHome .mainContent .nextChat .nextChatContainer .chatDetails {
    padding: 10px;
    height: 100%;
  }
  .aaqHome .mainContent .nextChat .nextChatContainer .chatDateInfo {
    margin-top: 0;
  }
  .aaqHome .mainContent .nextChat .nextChatContainer .chatDateInfo .joinChat {
    margin-top: 10px;
    margin-bottom: 10px;
  }
}
@media all and (min-width: 768px) and (max-width: 1024px) {
  .aaqHome .mainContent .askAQuestionContainer {
    background: url("images/aaqHomeBg.png") -100px -50px no-repeat;
  }
  .aaqHome .mainContent .askAQuestionContainer .askQuote {
    margin-top: 80px;
  }
  .aaqHome .mainContent .askAQuestionContainer .askQuote blockquote.blockquoteTwo {
    width: 80%;
    margin-left: 50px;
    background-color: transparent;
  }
  .aaqHome .mainContent .nextChat {
    padding-right: 5px;
  }
  .aaqHome .mainContent .nextChat .nextChatContainer .chatDateInfo .chatTime {
    margin-left: 30px;
  }
  .aaqHome .mainContent .nextChat .nextChatContainer .chatDetails {
    height: 275px;
    /*width:60%;*/
  }
  .aaqHome .mainContent .meetTheTeam {
    padding-left: 5px;
    margin-top: 0;
  }
  .aaqHome .mainContent .meetTheTeam .teamDetailsContainer .team {
    width: 17%;
  }
  .aaqHome .mainContent .meetTheTeam .teamDetailsContainer .team a {
    height: 60px;
    width: 60px;
  }
  .aaqHome .mainContent .meetTheTeam .teamDetailsContainer .team a img {
    width: 60px;
    height: 60px;
  }
  .aaqHome .mainContent .meetTheTeam .teamDetailsContainer .team a span {
    width: 60px;
  }
}
@media all and (min-width: 1024px) {
  .aaq .answerQna .expertAnswer {
    width: 82%;
  }

  .aaqHome .mainContent .askAQuestionContainer {
    background: url("images/aaqHomeBg.png") -10px -50px no-repeat;
    height: 230px;
  }
  .aaqHome .mainContent .meetTheTeam {
    padding-left: 10px;
    margin-top: 0;
  }
  .aaqHome .mainContent .meetTheTeam .teamDetailsContainer .team {
    /*padding:0 0 0 30px;*/
    width: 12.1%;
    margin: 5px;
  }
  .aaqHome .mainContent .meetTheTeam .teamDetailsContainer .team a {
    height: 60px;
    width: 60px;
  }
  .aaqHome .mainContent .meetTheTeam .teamDetailsContainer .team a img {
    width: 60px;
    height: 60px;
  }
  .aaqHome .mainContent .meetTheTeam .teamDetailsContainer .team a span {
    width: 60px;
  }
  .aaqHome .mainContent .nextChat .nextChatContainer .chatDetails {
    height: 205px;
  }
}
@media all and (min-width: 1025px) {
  .aaqHome .mainContent {
    padding-right: 0;
  }
  .aaqHome .mainContent .list .articleBlock:nth-child(2n+1) {
    margin-left: 2%;
    margin-right: 0;
  }
  .aaqHome .mainContent .list .articleBlock {
    width: 49%;
  }
  .aaqHome .mainContent .askAQuestionContainer {
    padding: 20px;
    background: url("images/aaqHomeBg.png") -20px 0 no-repeat;
  }
  .aaqHome .mainContent .askAQuestionContainer .askQuote {
    /*margin-top:50px;*/
  }
  .aaqHome .mainContent .askAQuestionContainer .askQuote blockquote.blockquoteTwo {
    width: 25em;
    margin-left: 30px;
    background-color: transparent;
  }
  .aaqHome .mainContent .debateQuestionContainer .debateQuestion {
    width: 100%;
    background: #eeeeee url(images/aaqJoinDebate.png) no-repeat 99% 90%;
    padding-right: 200px;
  }
  .aaqHome .mainContent .nextChat {
    padding-right: 10px;
  }
  .aaqHome .mainContent .nextChat .nextChatContainer .chatDetails {
    width: 60%;
    padding: 10px 20px;
  }
  .aaqHome .mainContent .nextChat .nextChatContainer .chatDateInfo {
    width: 40%;
    margin-top: 5px;
    padding-left: 10px;
  }
  .aaqHome .mainContent .nextChat .nextChatContainer .chatDateInfo .chatDate {
    width: 90px;
    margin-right: 5px;
  }
  .aaqHome .mainContent .nextChat .nextChatContainer .chatDateInfo .joinChat {
    margin-top: 30px;
  }
}
@media all and (max-width: 640px) {
  .chatDetails {
    width: 50% !important;
    height: auto !important;
  }

  .chatDateInfo {
    width: 50% !important;
    height: auto !important;
  }

  .chatTime {
    margin-left: 15px !important;
  }

  .debateQuestion {
    background: #eeeeee none !important;
  }
  .debateQuestion p {
    padding-right: 0 !important;
  }
}
.infoHint {
  float: left;
  left: -10px;
  position: absolute;
  top: 0;
}
.infoHint span {
  background: #fff;
  box-shadow: 0 0 5px;
  -moz-box-shadow: 0 0 5px;
  -webkit-box-shadow: 0 0 5px;
  display: block;
  left: -9999em;
  line-height: 1.5em;
  padding: 1em;
  position: absolute;
  width: 15em;
  z-index: 9999;
}
.infoHint:hover span {
  left: 28px;
  top: -5px;
  margin-left: -15px;
  padding-left: 15px;
}

.appsHome .mainContent {
  margin-bottom: 20px;
}
.appsHome .mainContent #intro h1 {
  font-size: 2em;
}
.appsHome .mainContent .col-4 {
  padding: 0;
}
.appsHome .mainContent .col-4 a {
  margin-bottom: 20px;
  margin-right: 9px;
  border: 1px solid #EFE4B0;
  float: left;
  padding: 10px;
  position: relative;
  color: #000000;
  text-decoration: none;
}
.appsHome .mainContent .col-4 a h2 {
  margin-bottom: 10px;
}
.appsHome .mainContent .col-4 a img {
  margin: 5px 0;
  width: 100%;
}
.appsHome .mainContent .col-4 a p {
  clear: both;
}
.appsHome .mainContent .col-4 a span {
  float: right;
  text-decoration: underline;
}
.appsHome .mainContent .col-4 a:hover {
  border: 1px solid #452187;
  background: #FAFAFA;
}
.appsHome .mainContent .col-4:nth-of-type(3n) div {
  margin-right: 0;
}

@media all and (min-width: 1025px) {
  .appsHome .mainContent .col-4 a {
    height: 18em;
  }
  .appsHome .mainContent .col-4 a span {
    position: absolute;
    bottom: 5px;
    right: 5px;
  }
}
@media all and (max-width: 1025px) {
  .appsHome .mainContent #intro {
    padding-right: 5px;
  }
}
@media all and (max-width: 600px) {
  .appsHome .mainContent .col-4 a {
    margin-right: 0;
  }
}
/* Ask a question section */
.QnaSection .form-wrapper {
  margin-bottom: .5em;
  position: relative;
  padding: 3px 13px;
}

.QnaSection input[type=text], textarea, select {
  width: 100%;
}

.QnaSection p {
  margin-bottom: 5px;
}
.QnaSection .questionBox {
  background: #eee;
  float: left;
  margin-bottom: 1em;
  position: relative;
  width: 100%;
  padding: 20px;
}
.QnaSection .questionBox .infoHint {
  float: left;
  left: -10px;
  position: absolute;
  top: 2px;
}
.QnaSection .questionBox .infoHint span {
  background: #fff;
  box-shadow: 0 0 5px;
  -moz-box-shadow: 0 0 5px;
  -webkit-box-shadow: 0 0 5px;
  display: block;
  left: -9999em;
  line-height: 1.5em;
  padding: 1em;
  position: absolute;
  width: 15em;
  z-index: 9999;
}
.QnaSection .questionBox .infoHint:hover span {
  left: 28px;
  top: -5px;
  margin-left: -15px;
  padding-left: 15px;
}
.QnaSection .questionBox .typeOne label {
  display: inline;
}
.QnaSection .questionBox .typeOne input {
  margin-left: 10px;
}
.QnaSection .questionBox input[type="checkbox"] {
  vertical-align: middle;
  margin-right: 3px;
}
.QnaSection .stepOneImg, .QnaSection .stepTwoImg {
  height: 100px;
  left: -15px;
  position: absolute;
  top: -15px;
  width: 100px;
}
.QnaSection .stepOneImg {
  background: url(images/stepOne.png) no-repeat 5px 0px;
}
.QnaSection .stepTwoImg {
  background: url(images/stepTwo.png) no-repeat 5px 0px;
}
.QnaSection .stepOneImg span, .QnaSection .stepTwoImg span {
  display: block;
  text-indent: -99999em;
}
.QnaSection .tnc {
  background: #d9d9d9;
  border: 1px solid #5f5f5f;
  height: 10em;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}
.QnaSection .age label, .QnaSection .postcode label, .QnaSection .email label, .QnaSection .phone label, .QnaSection .question label, .QnaSection .questionid label {
  display: none;
}

.QnaSection #intro a {
  color: #006699;
  text-decoration: none;
  transition-duration: 0.2s;
}
.QnaSection #intro a:hover {
  border-bottom: 1px solid #006699;
}

/* q&a answer div */
.answerQna {
  padding: 20px 20px 10px 20px;
  margin: 1em 0;
  background: #E7E7E5;
  clear: both;
}

.yourAdviceAnswer {
  margin: 0 !important;
}

.collectYourAnswer p {
  margin-bottom: 20px;
}
.collectYourAnswer ul {
  margin: 0;
}

.partnerContainer {
  float: left;
  width: 100%;
  margin-bottom: 20px;
}
.partnerContainer img {
  float: left;
  margin-right: 20px;
}
.partnerContainer h3 {
  padding-top: 5px;
}

.partnerDetails p {
  float: left;
  clear: both;
}
.partnerDetails #intro p {
  margin-bottom: 10px;
}
.partnerDetails #article p {
  float: none;
}

@media all and (max-width: 820px) {
  .partnerContainer img {
    float: none;
  }
  .partnerContainer p {
    float: none;
    width: 100%;
  }
}
/*
/* Staff list
*/
.staff .staff-block-single {
  color: #333742;
  font-size: 12px;
}
.staff .staff-block-single img {
  float: left;
  height: auto;
  margin-right: 10px;
  width: 130px;
  margin-top: 6px;
}
.staff .staff-block-single .staff-data {
  display: inline;
}
.staff .staff-block-single .staff-data h3 {
  margin-bottom: 0;
}
.staff .staff-block-single .staff-data p {
  color: #333742;
  font-size: 12px;
  margin-bottom: 0;
  text-decoration: none;
}
.staff .staff-block-single .staff-data p.jobtitle {
  color: #000;
}
.staff h2 {
  padding-left: 20px;
}

.appDetailsContainer {
  margin: 10px 0;
  float: left;
  padding: 30px;
}
.appDetailsContainer h2 {
  display: block;
  margin-bottom: 20px;
  position: relative;
  padding: 20px 10px 20px 70px;
}
.appDetailsContainer h2 img {
  position: absolute;
  left: 0;
  top: 0;
}
.appDetailsContainer .appDetails {
  float: left;
  width: 60%;
}
.appDetailsContainer .appDetails a img {
  margin: 20px 10px 0 0;
}
.appDetailsContainer .appScreenshot {
  float: right;
  width: 34%;
}
.appDetailsContainer .appScreenshot img {
  text-align: right;
}

.appDetailsContainer:nth-child(odd) {
  background: #F7F7F7;
}

@media all and (max-width: 800px) {
  .appDetailsContainer .appScreenshot {
    width: 48%;
  }
  .appDetailsContainer .appDetails {
    width: 50%;
  }
}
@media all and (max-width: 600px) {
  .appDetailsContainer .appScreenshot {
    width: 100%;
  }
  .appDetailsContainer .appDetails {
    width: 100%;
  }
}
@media all and (max-width: 520px) {
  .appDetailsContainer .appScreenshot {
    display: none;
  }
}
@media all and (max-width: 320px) {
  .appDetailsContainer {
    padding: 10px;
  }
  .appDetailsContainer .appDetails a img {
    margin: 20px 5px 0 0;
  }
}
.findHelp .mainContent {
  padding-left: 0;
  padding-right: 0;
}
.findHelp .ui-multiselect.lafSearch {
  margin-bottom: 10px;
}

.findHelpSearchResults {
  /*margin:10px 30px 20px 30px;
  float:left;*/
  clear: both;
}
.findHelpSearchResults .orgNo {
  /*width:20%;*/
  float: left;
  margin-left: 15px;
}
.findHelpSearchResults .orgNo span {
  border-radius: 100%;
  -moz-border-radius: 100%;
  -webkit-border-radius: 100%;
  color: #fff;
  font-family: "AsapBold", sans-serif;
  font-weight: bold;
  padding: 6px;
  background: #0492a8;
  margin-right: 5px;
}
.findHelpSearchResults .pagination {
  /* width:75%;*/
  float: right;
  padding-bottom: 15px;
}
.findHelpSearchResults .orgDetailsContainer {
  width: 100%;
  float: left;
  /*height:100px;*/
  margin-bottom: 10px;
}
.findHelpSearchResults .orgDetailsContainer .orgDistance {
  /*float:left;
  width:10%;*/
}
.findHelpSearchResults .orgDetailsContainer .orgDistance p {
  padding-left: 25px;
  background: url(images/signpost.png) no-repeat;
  margin-left: 25px;
}
.findHelpSearchResults .orgDetailsContainer .orgDistance .nationalOrg {
  background: url(images/nationalorgicon.png) no-repeat 5px 0px;
}
.findHelpSearchResults .orgDetailsContainer .orgDetails {
  /*float:right;
  width:85%;
  background:url(images/divider.png)no-repeat 0 0px;*/
  padding: 5px 5px 5px 25px;
  /*height:90px;*/
  position: relative;
}
.findHelpSearchResults .orgDetailsContainer .orgDetails a {
  color: #2B8190;
}
.findHelpSearchResults .orgDetailsContainer .orgDetails a:hover {
  color: #000000;
}
.findHelpSearchResults .orgDetailsContainer .orgDetails h5 {
  margin-bottom: 5px;
}
.findHelpSearchResults .orgDetailsContainer .orgDetails p {
  font-size: 14px;
  line-height: 1.1em;
}
.findHelpSearchResults .orgDetailsContainer .orgDetails .helpTopics {
  /*position:absolute;
  bottom:1px;*/
}
.findHelpSearchResults .orgDetailsContainer .orgDetails .helpTopics span {
  margin-right: 15px;
  float: left;
}
.findHelpSearchResults .orgDetailsContainer .orgDetails .helpTopics span span {
  background-image: url(images/findhelpicons.png);
  backgroun-repeat: no-repeat;
  width: 32px;
  height: 30px;
  margin-top: -4px;
  margin-right: 2px;
}
.findHelpSearchResults .orgDetailsContainer .orgDetails .helpTopics .abuse span {
  background-position: -8px -10px;
}
.findHelpSearchResults .orgDetailsContainer .orgDetails .helpTopics .bereavement span {
  background-position: -46px -10px;
}
.findHelpSearchResults .orgDetailsContainer .orgDetails .helpTopics .care span {
  background-position: -84px -10px;
}
.findHelpSearchResults .orgDetailsContainer .orgDetails .helpTopics .careers-study span {
  background-position: -122px -10px;
}
.findHelpSearchResults .orgDetailsContainer .orgDetails .helpTopics .child-care span {
  background-position: -161px -10px;
}
.findHelpSearchResults .orgDetailsContainer .orgDetails .helpTopics .disability-support span {
  background-position: -8px -55px;
}
.findHelpSearchResults .orgDetailsContainer .orgDetails .helpTopics .domestic-violence span {
  background-position: -46px -55px;
}
.findHelpSearchResults .orgDetailsContainer .orgDetails .helpTopics .drugs-alcohol span {
  background-position: -84px -55px;
}
.findHelpSearchResults .orgDetailsContainer .orgDetails .helpTopics .relationships span {
  background-position: -123px -54px;
}
.findHelpSearchResults .orgDetailsContainer .orgDetails .helpTopics .general-health span {
  background-position: -161px -54px;
}
.findHelpSearchResults .orgDetailsContainer .orgDetails .helpTopics .housing span {
  background-position: -8px -101px;
}
.findHelpSearchResults .orgDetailsContainer .orgDetails .helpTopics .legal-rights span {
  background-position: -46px -101px;
}
.findHelpSearchResults .orgDetailsContainer .orgDetails .helpTopics .mental-health span {
  background-position: -85px -100px;
}
.findHelpSearchResults .orgDetailsContainer .orgDetails .helpTopics .money span {
  background-position: -123px -101px;
}
.findHelpSearchResults .orgDetailsContainer .orgDetails .helpTopics .sexuality span {
  background-position: -161px -101px;
}
.findHelpSearchResults .orgDetailsContainer .orgDetails .helpTopics .sexual-health span {
  background-position: -8px -149px;
}
.findHelpSearchResults .orgDetailsContainer .orgDetails .helpTopics .self-harm span {
  background-position: -46px -149px;
}
.findHelpSearchResults .orgDetailsContainer:nth-child(odd) {
  background: #f0f0f0;
}

.searchBoxContainer {
  background: url(images/LAF-background1.png) no-repeat right;
  width: 100%;
  color: #ffffff;
  float: left;
  position: relative;
  margin-bottom: 30px;
}
.searchBoxContainer .searchBox {
  /*width:40%;
  float:left;*/
  /*margin:30px;*/
  background: #2b8190;
  /* position:absolute;*/
  margin: 30px;
  padding: 20px 20px 0px 20px;
  overflow: auto;
}
.searchBoxContainer .searchBox .formErrors span {
  color: #000;
  display: none;
}
.searchBoxContainer .searchBox .formErrors span.show {
  display: block;
}
.searchBoxContainer .searchBox form {
  margin-top: 10px;
}
.searchBoxContainer .searchBox form label {
  clear: left;
  float: left;
  width: 7em;
}
.searchBoxContainer .searchBox form input, .searchBoxContainer .searchBox form select {
  float: left;
  padding: 5px;
  width: 17.7em;
  margin-bottom: 10px;
}
.searchBoxContainer .searchBox form #loc {
  width: 255px;
}
.searchBoxContainer .searchBox form .largeLabel {
  margin-bottom: 5px;
}
.searchBoxContainer .searchBox form .fieldContainer {
  float: left;
}
.searchBoxContainer .searchBox form .distancetype {
  float: right;
}
.searchBoxContainer .searchBox form .distancetype input, .searchBoxContainer .searchBox form .distancetype label {
  width: auto;
  float: none;
}
.searchBoxContainer .searchBox form .blueButton {
  background: #363636;
  border-color: #000;
  width: 10em;
  float: right;
  padding: 0;
  clear: both;
}
.searchBoxContainer .searchBox form .blueButton:hover {
  background: #000;
}
.searchBoxContainer .searchBox form .noResults p {
  margin-bottom: 0;
  color: #FF0000;
}
.searchBoxContainer .appInfo {
  background: #2b8190;
  width: 50%;
  /*position:absolute;*/
  top: 162px;
  color: #ffffff;
  right: 30px;
  padding-left: 20px;
}
.searchBoxContainer .appInfo p {
  background: url(images/iphone.png) no-repeat 0 0;
  margin: -12px 0;
  padding: 25px 0 0 100px;
  height: 150px;
  float: left;
}
.searchBoxContainer .appInfo p span {
  float: left;
  margin: 8px 0;
}
.searchBoxContainer .appInfo p img {
  float: left;
  clear: both;
}

.touch .appInfo {
  display: none;
}

@media all and (min-width: 1025px) {
  .orgDetailsContainer {
    margin-bottom: 1px;
    height: 100px;
  }
  .orgDetailsContainer .orgDistance {
    float: left;
    width: 10%;
    position: relative;
  }
  .orgDetailsContainer .orgDistance p {
    /*margin-top:35px;*/
    position: absolute;
    top: 40px;
  }
  .orgDetailsContainer .orgDistance .nationalOrg {
    line-height: .9em;
  }
  .orgDetailsContainer .orgDetails {
    float: right;
    width: 85%;
    background: url(images/divider.png) no-repeat 0 0px;
    height: 100px;
  }
  .orgDetailsContainer .orgDetails .helpTopics {
    position: absolute;
    bottom: 5px;
  }
}
@media all and (max-width: 1024px) {
  .findHelp #intro {
    padding: 0 15px;
  }

  .findHelpSearchResults {
    margin: 0;
  }
  .findHelpSearchResults .orgDetailsContainer {
    padding-bottom: 10px;
  }
  .findHelpSearchResults .orgDetailsContainer p, .findHelpSearchResults .orgDetailsContainer .nationalOrg {
    margin-top: 5px;
  }

  .orgDetailsContainer .orgDistance {
    float: right;
    padding-right: 20px;
  }
  .orgDetailsContainer .orgDistance .nationalOrg {
    line-height: .9em;
    width: 100px;
  }

  .appInfo {
    float: left;
    width: 100%;
    margin-top: 40px;
    padding-left: 0;
  }
  .appInfo p {
    background: none;
    height: 90px;
    padding: 25px;
  }
  .appInfo p span {
    float: none;
  }
  .appInfo p img {
    float: none;
    margin-bottom: -20px;
    margin-left: 20px;
  }
}
@media all and (min-width: 800px) {
  .searchBoxContainer .searchBox {
    width: 40%;
    float: left;
  }
  .searchBoxContainer .searchBox, .searchBoxContainer .appInfo {
    position: absolute;
  }
}
@media all and (max-width: 900px) {
  .searchBoxContainer .searchBox {
    width: 70%;
  }
  .searchBoxContainer .appInfo {
    display: none;
  }
}
@media all and (max-width: 600px) {
  .findHelpSearchResults .orgNo {
    width: auto;
  }
  .findHelpSearchResults .pagination {
    width: 100%;
    text-align: right;
  }
  .findHelpSearchResults .pagination .page_nav {
    text-align: right;
  }
  .findHelpSearchResults .orgDetails .helpTopics span {
    margin-bottom: 3px;
  }
}
@media all and (max-width: 480px) {
  .searchBoxContainer .searchBox {
    margin: 0;
    width: 100%;
  }
}
/* Laf */
.ui-multiselect-hasfilter ul {
  position: relative;
  top: 2px;
}

.ui-multiselect-filter {
  float: left;
  margin-right: 10px;
  font-size: 11px;
}

.ui-multiselect-filter input {
  width: 100px;
  font-size: 10px;
  margin-left: 5px;
  height: 15px;
  padding: 2px;
  border: 1px solid #292929;
  -webkit-appearance: textfield;
  -webkit-box-sizing: content-box;
}

.ui-multiselect {
  padding: 2px 0 2px 4px;
  text-align: left;
  width: 200px;
}

.ui-multiselect span.ui-icon {
  float: right;
}

.ui-multiselect-single .ui-multiselect-checkboxes input {
  position: absolute !important;
  top: auto !important;
  left: -9999px;
}

.ui-multiselect-single .ui-multiselect-checkboxes label {
  padding: 5px !important;
}

.ui-multiselect-header {
  margin-bottom: 3px;
  padding: 3px 0 3px 4px;
}

.ui-multiselect-header ul {
  font-size: 0.8em;
}

.ui-multiselect-header ul li {
  float: left;
  padding: 0 10px 0 0;
}

.ui-multiselect-header a {
  text-decoration: none;
}

.ui-multiselect-header a:hover {
  text-decoration: underline;
}

.ui-multiselect-header span.ui-icon {
  float: left;
}

.ui-multiselect-header li.ui-multiselect-close {
  float: right;
  text-align: right;
  padding-right: 0;
}

.ui-multiselect-menu {
  display: none;
  padding: 3px;
  position: absolute;
  z-index: 10000;
  text-align: left;
}

.ui-multiselect-checkboxes {
  position: relative;
  overflow-y: auto;
}

.ui-multiselect-checkboxes label {
  cursor: default;
  display: block;
  border: 1px solid transparent;
  padding: 3px 1px;
}

.ui-multiselect-checkboxes label input {
  position: relative;
  top: 1px;
}

.ui-multiselect-checkboxes li {
  clear: both;
  font-size: 0.9em;
  padding-right: 3px;
}

/* remove label borders in IE6 because IE6 does not support transparency */
* html .ui-multiselect-checkboxes label {
  border: none;
}

.ui-multiselect-menu.lafSearch {
  color: black;
  font-size: .8em;
  background: #ffffff;
  padding-bottom: 15px;
}

.ui-multiselect.lafSearch {
  font-size: .8em;
  background: #ffffff !important;
  height: 30px;
}

.ui-multiselect.lafSearch:hover {
  background: #ffffff;
}

.ui-state-default,
.ui-widget-content .ui-state-default,
.ui-widget-header .ui-state-default {
  background: #ffffff !important;
}

.ui-state-hover,
.ui-widget-content .ui-state-hover,
.ui-widget-header .ui-state-hover,
.ui-state-focus,
.ui-widget-content .ui-state-focus,
.ui-widget-header .ui-state-focus,
.ui-state-active,
.ui-widget-content .ui-state-active,
.ui-widget-header .ui-state-active {
  color: black !important;
  border: 1px solid #0492a8 !important;
}

.ui-icon {
  background: url(images/adown.png) no-repeat 5px 5px !important;
}

.newFormBox {
  background: #2b8190;
  margin: 30px;
  padding: 20px 20px 0 20px;
  width: 40%;
  float: left;
}
.newFormBox h3 {
  color: #fff;
  margin: 0;
  font-size: 14px;
}
.newFormBox label {
  display: table-cell;
  padding-right: 10px;
  padding-top: 6px;
  float: left;
}
.newFormBox .fieldContainer, .newFormBox .distancetype, .newFormBox .btn--primary {
  margin-bottom: 0.5em;
}
.newFormBox .sod_select, .newFormBox input[type="text"] {
  display: table-cell;
  max-width: 245px;
  float: right;
  margin-bottom: 0.5em;
}
.newFormBox .distancetype input[type="radio"] {
  margin-left: 5px;
}
.newFormBox .distancetype label {
  display: inline-block;
  float: none;
}
.newFormBox .distancetype .distance {
  display: inline-block;
  padding-right: 0;
}

@media all and (max-width: 900px) {
  .newFormBox {
    margin: 0;
    width: auto;
  }
}
@media all and (max-width: 1130px) {
  .newFormBox {
    margin: 0;
  }

  .sod_select, input[type="text"] {
    max-width: none !important;
    width: 100%;
  }
}
/*
.orgDetails .newP{
  p {
    font-size: 14px !important;
  }
  h3{
    margin-bottom: 5px !important;
  }

}*/
.fancybox-skin {
  -webkit-border-radius: 0;
  border-radius: 0;
  -moz-border-radius: 0;
}

#my_fancybox {
  min-height: 350px;
  padding: 10px;
  display: none;
}

#my_fancybox h1 {
  color: #000;
  font-size: 20px;
  line-height: 25px;
}

#my_fancybox p {
  color: #000;
  font-size: 14px;
  background: #fff;
  padding: 20px;
  margin-top: 20px;
}

#my_fancybox a {
  color: #fff;
  font-size: 14px;
  background: #12a2bd;
  padding: 6px 12px;
  text-decoration: none;
  margin-top: 10px;
  display: inline-block;
}

@media all and (min-width: 480px) {
  #my_fancybox {
    padding: 30px;
  }

  #my_fancybox h1 {
    font-size: 30px;
    line-height: 35px;
  }

  #my_fancybox p {
    max-width: 70%;
  }

  #my_fancybox a {
    font-size: 18px;
    padding: 10px 20px;
    margin-top: 20px;
  }
}
.tcCancel {
  float: right;
  margin-left: 20px;
}

.chattc {
  border: 2px solid #d1d0ce;
  padding: 10px;
}

.tcButton {
  margin-top: 20px;
}

.acceptTC {
  float: right;
}

/*
/*
/* Local Advice Finder
/*
*/
.newlaf .blockWrap {
  margin-bottom: 10px;
}
.newlaf .blockWrap .leftCol {
  display: inline-block;
  vertical-align: top;
  width: 25%;
  padding-top: 3px;
}
.newlaf .blockWrap .rightCol {
  display: inline-block;
  width: 74%;
}
.newlaf .blockWrap .rightCol span {
  width: 140px;
  display: inline-block;
}
.newlaf p {
  font-size: 12px;
  margin-top: 25px;
}

#skill_translator_wrapper {
  padding: 8px 15px 8px 15px;
}
#skill_translator_wrapper #st_logo, #skill_translator_wrapper #st_step1_intro, #skill_translator_wrapper #st_step1_sponsor {
  text-align: center;
}
#skill_translator_wrapper #st_logo {
  margin: 30px 0;
}
#skill_translator_wrapper #st_step1_intro {
  font-size: 24px;
  width: 100%;
  margin: 10px auto;
  line-height: 24px;
  padding: 10px 0 5px 0;
}
#skill_translator_wrapper #st_step1_intro p {
  color: #fff;
}
#skill_translator_wrapper #st_step1_sponsor {
  display: block;
  margin-top: 30px;
  text-align: right;
}
#skill_translator_wrapper #st_step1_sponsor p {
  color: #fff;
  font-size: 8px;
}
#skill_translator_wrapper #st_step1_sponsor a:hover {
  text-decoration: none;
  border-bottom: none;
}
#skill_translator_wrapper #st_sponsor_wrapper {
  display: inline-block;
  min-width: 100px;
  text-align: left;
}

#st_main {
  width: 100%;
}
#st_main h1 {
  font-size: 1.7em;
  line-height: 1.1em;
  margin-bottom: 15px;
}
#st_main p {
  font-size: 1.1em;
  font-weight: normal;
  line-height: 1.4em;
}

#st_activities_box {
  background-color: #fff;
  width: inherit;
  margin-top: 20px;
}

#st_double_id .st_box {
  background-color: #fff;
  padding-bottom: 1px;
}
#st_double_id .st_box h3 {
  font-size: 1em;
  text-transform: uppercase;
  padding: 5px 15px;
  color: #006699;
  margin-bottom: 3px;
  -moz-transition: all ease 0.5s;
  -o-transition: all ease 0.5s;
  -webkit-transition: all ease 0.5s;
  transition: all 0.5s ease 0s;
  background-color: #DBDEE1 !important;
}
#st_double_id .st_box .oddBg {
  background-color: #EFEFEF !important;
}
#st_double_id .st_box .upArrow {
  background: url(images/st_arrows4.png) no-repeat right top;
  cursor: pointer;
}
#st_double_id .st_box .downArrow {
  background: url(images/st_arrows4.png) no-repeat right bottom;
  cursor: pointer;
}
#st_double_id .st_box input[type="checkbox"] {
  margin-left: 20px;
  width: 20px;
  height: 20px;
  vertical-align: middle;
}
#st_double_id .st_box p {
  margin: 5px;
}

#st_feedback {
  width: 100%;
  text-align: right;
  padding: 10px 0 0 0;
}
#st_feedback a {
  text-decoration: underline;
}
#st_feedback a:hover {
  border-bottom: none;
}

#st_button-wrapper {
  background-color: #fff;
  text-align: center;
  margin-top: 20px;
}

.st_button {
  width: 70%;
  display: inline-block;
  margin: 12px 0 12px 0;
  background-color: #fff;
  font-size: 18px;
  font-weight: bold;
  text-decoration: none;
  padding: 10px 0 5px 0;
  -webkit-appearance: none;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 0;
}

.st_button:hover {
  cursor: pointer;
  color: #fff;
}

input[type="submit"].st_button {
  font-family: inherit;
  line-height: inherit;
  outline: 0;
}

.st_table-row {
  display: table-row;
}

.st_table-cell {
  display: table-cell;
}

.st_table-cell-box {
  width: 45px;
  display: table-cell;
}

.st_table-cell-image {
  width: 25px;
  vertical-align: middle;
  display: table-cell;
}

#st_translation_box {
  padding-bottom: 1px !important;
}
#st_translation_box.st_box {
  margin-top: 20px;
}
#st_translation_box.st_box p {
  color: #000;
  margin: 0 20px 10px 20px;
  font-size: 100%;
  line-height: 22px;
}
#st_translation_box.st_box h4 {
  margin: 0 20px 0 20px;
}
#st_translation_box.st_box .error {
  color: #FF0000;
}
#st_translation_box .moreJob {
  padding: 5px 10px;
}
#st_translation_box .moreJob ul {
  margin-left: 0;
  width: 99%;
}
#st_translation_box .moreJob ul li {
  background: url("images/bullet.png") no-repeat 0 50%;
  list-style: none;
  margin-bottom: 10px;
  padding-left: 25px;
  width: 99%;
}
#st_translation_box .moreJob a {
  color: #006699;
  transition-duration: 0.2s;
  text-decoration: none;
}
#st_translation_box .moreJob a:hover {
  border-bottom: 1px solid #006699;
}
#st_translation_box .moreJob a:visited {
  color: #006699;
}

#st_back_button_link {
  float: right;
  margin-top: 8px;
  background: none;
  border: none;
  font-weight: normal;
  text-decoration: underline;
}
#st_back_button_link:hover {
  cursor: pointer;
}

#st_graph_main_wrapper {
  margin-top: 15px;
  margin-bottom: 20px;
}

.st_graph_wrapper {
  margin: 0 20px;
}

#skill_translator_wrapper .progress {
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 0;
  box-shadow: none;
  background-color: #959595;
  height: 30px;
  width: 95%;
  margin: 10px 0 0 0;
  float: left;
}
#skill_translator_wrapper .progress-bar {
  font-size: 16px;
  line-height: 30px;
  text-align: left;
}
#skill_translator_wrapper .progress-bar span {
  display: inline-block;
  margin-left: 30px;
  min-width: 150px;
}
#skill_translator_wrapper .st_info_image {
  width: 3%;
  float: right;
  margin-top: 10px;
  padding: 5px 0 0 1px;
}

#st_double_id #st_graph > p {
  color: #000 !important;
  margin: 10px 20px 10px 20px;
  font-size: 100%;
  line-height: 22px;
}
#st_double_id #st_graph > p a {
  color: #006699;
  transition-duration: 0.2s;
  text-decoration: none;
}
#st_double_id #st_graph > p a:hover {
  border-bottom: 1px solid #006699;
}
#st_double_id #st_graph > p a:visited {
  color: #006699;
}

#st_sharing_buttons {
  background-color: #fff;
  display: inline-block;
  padding: 1px 0 1px 1px;
  line-height: 14px;
  float: left;
}
#st_sharing_buttons .sharing_buttons {
  margin: 0;
  display: inline-block;
  line-height: 14px;
}

#st_sharing_button_wrapper {
  background-color: #fff;
  padding: 1px 1px 1px 0;
  display: inline-block;
}

#st_embed_button {
  width: 80px;
  height: 35px;
  background-color: #DB5041;
  padding: 3px;
  cursor: pointer;
}
#st_embed_button p {
  font-size: 12px;
  font-weight: bold;
  line-height: 20px;
  color: #fff;
  margin: 5px 0 0 7px;
  transition: all 0.5s ease 0s;
}
#st_embed_button .st_downArrow {
  background: url(images/st_arrows_white.png) no-repeat right bottom;
}
#st_embed_button .st_upArrow {
  background: url(images/st_arrows_white.png) no-repeat right top;
}

@media all and (max-width: 480px) {
  #st_sharing_button_wrapper {
    padding: 1px;
    margin-top: 5px;
    display: block;
    width: 82px;
  }

  #st_sharing_buttons {
    float: none;
    display: inline-block;
  }
  #st_sharing_buttons .socialShareButton:last-child {
    margin-right: 1px;
  }
}
#st_embed_text {
  background-color: #fff;
  padding: 3px;
}
#st_embed_text p {
  font-size: 14px;
  line-height: 22px;
  color: #000 !important;
  margin: 5px;
}
#st_embed_text a {
  color: #006699;
  transition-duration: 0.2s;
  text-decoration: none;
}
#st_embed_text a:hover {
  border-bottom: 1px solid #006699;
}

@media all and (min-width: 480px) {
  #skill_translator_wrapper {
    padding: 20px;
  }

  #skill_translator_wrapper #st_step1_intro {
    font-size: 30px;
    width: 90%;
    margin: 30px auto;
    line-height: 30px;
    padding: 20px 0 20px 0;
  }

  #st_sponsor_wrapper {
    min-width: 150px;
  }

  #skill_translator_wrapper #st_step1_sponsor {
    text-align: right;
  }

  .st_button {
    font-size: 22px;
    width: 60%;
  }

  .st_graph_wrapper {
    margin: 0 30px;
  }

  #st_translation_box.st_box p {
    margin: 0 30px 10px 30px;
  }
  #st_translation_box.st_box h4 {
    margin: 0 30px 0 30px;
  }

  #st_double_id #st_graph > p {
    margin: 10px 30px 10px 30px;
  }

  #st_translation_box .moreJob {
    padding: 10px 30px;
  }
}
@media all and (min-width: 768px) {
  #skill_translator_wrapper {
    padding: 20px;
  }
  #skill_translator_wrapper #st_step1_intro {
    font-size: 30px;
    width: 80%;
    margin: 30px auto;
    line-height: 30px;
    padding: 20px 0 20px 0;
  }
  #skill_translator_wrapper #st_sponsor_wrapper {
    min-width: 150px;
  }
  #skill_translator_wrapper #st_step1_sponsor {
    text-align: right;
  }

  .st_button {
    font-size: 30px;
    width: 50%;
  }

  .st_graph_wrapper {
    margin: 0 40px;
  }

  #st_translation_box.st_box p {
    margin: 0 40px 10px 40px;
  }
  #st_translation_box.st_box h4 {
    margin: 0 40px 0 40px;
  }

  #st_double_id #st_graph > p {
    margin: 10px 40px 10px 40px;
  }

  .progress {
    width: 99%;
  }

  #st_translation_box .moreJob {
    padding: 20px 40px;
  }
}
.clearBoth {
  clear: both;
}

.st_button {
  line-height: normal !important;
  text-decoration: none !important;
  padding-top: 0;
  padding-bottom: 0;
}

#st_translation_box.st_box h4 {
  color: #000 !important;
  font-size: 14px !important;
}

/*
/* Sitemap 
*/
#sitemap {
  padding-top: 10px;
}
#sitemap a {
  color: #5f5f5f;
  text-decoration: none;
}
#sitemap a:hover {
  border-bottom: 1px solid #5f5f5f;
}
#sitemap ul {
  width: 100%;
  margin-bottom: 20px;
  margin-left: 15px;
  font-size: 1em;
}
#sitemap ul ul {
  margin-left: 0;
  font-size: .95em;
}
#sitemap ul ul ul {
  font-size: .9em;
}
#sitemap ul li {
  display: inline-block;
  vertical-align: top;
  /*width: 19.7%;*/
}
#sitemap ul li.life > a, #sitemap ul li.talk > a, #sitemap ul li.stories > a, #sitemap ul li.ask > a, #sitemap ul li.about > a {
  color: #075384;
  font-weight: 700;
}
#sitemap ul li.life {
  width: 100%;
}
#sitemap ul li.life ul li.sex a {
  color: #D61807;
}
#sitemap ul li.life ul li.body a {
  color: #003388;
}
#sitemap ul li.life ul li.health a {
  color: #047B04;
}
#sitemap ul li.life ul li.drink a {
  color: #025F78;
}
#sitemap ul li.life ul li.house a {
  color: #AA2233;
}
#sitemap ul li.life ul li.money a {
  color: #882277;
}
#sitemap ul li.life ul li.work a {
  color: #CF0072;
}
#sitemap ul li.life ul li.crime a {
  color: #1D7C71;
}
#sitemap ul li.life ul li.travel a {
  color: #CC3300;
}
#sitemap ul li.life ul li.sex ul li, #sitemap ul li.life ul li.body ul li, #sitemap ul li.life ul li.health ul li, #sitemap ul li.life ul li.drink ul li, #sitemap ul li.life ul li.house ul li, #sitemap ul li.life ul li.money ul li, #sitemap ul li.life ul li.work ul li, #sitemap ul li.life ul li.crime ul li, #sitemap ul li.life ul li.travel ul li {
  width: 100%;
}
#sitemap ul li.life ul li.sex ul li a, #sitemap ul li.life ul li.body ul li a, #sitemap ul li.life ul li.health ul li a, #sitemap ul li.life ul li.drink ul li a, #sitemap ul li.life ul li.house ul li a, #sitemap ul li.life ul li.money ul li a, #sitemap ul li.life ul li.work ul li a, #sitemap ul li.life ul li.crime ul li a, #sitemap ul li.life ul li.travel ul li a {
  color: #5f5f5f;
  background: url("images/sitemapbullet.png") 0 50% no-repeat;
  padding-left: 10px;
  margin-bottom: 3px;
}
#sitemap ul li.talk ul li, #sitemap ul li.stories ul li, #sitemap ul li.ask ul li, #sitemap ul li.about ul li {
  width: 100%;
}

@media all and (min-width: 320px) {
  #sitemap ul li {
    width: 100%;
  }
}
@media all and (min-width: 480px) {
  #sitemap ul li {
    width: 48%;
  }
}
@media all and (min-width: 768px) {
  #sitemap ul li {
    width: 33%;
  }
}
@media all and (min-width: 1024px) {
  #sitemap ul li {
    width: 19.6%;
  }
}
.partnerContainer {
  float: left;
  width: 100%;
  margin-bottom: 20px;
}
.partnerContainer a {
  text-decoration: none;
  display: block;
  overflow: auto;
}
.partnerContainer a img {
  float: left;
  margin-right: 20px;
}
.partnerContainer a p {
  color: #333742;
  float: left;
  width: 75%;
}
.partnerContainer a:hover h3 {
  text-decoration: underline;
}
.partnerContainer a h3 {
  padding-top: 5px;
}
.partnerContainera:hover {
  background: #e3e2de;
}

.partnerDetails p {
  float: left;
  clear: both;
}

.section-logos {
  text-align: center;
}
.section-logos .partner-logo {
  display: inline-block;
  margin-right: 25px;
  width: 200px;
  height: 150px;
}
.section-logos .partner-logo .overlay {
  display: block;
  width: 100%;
  height: 100%;
  background: #3279BB;
  opacity: 0;
}
.section-logos a:hover {
  text-decoration: none;
  opacity: 0.7;
}
.section-logos a:hover .overlay {
  opacity: 0.5;
}

.new-partner-container {
  margin-bottom: 20px;
}
.new-partner-container a {
  text-decoration: none;
}
.new-partner-container a:hover h3 {
  text-decoration: underline;
}
.new-partner-container a img {
  display: block;
}
@media screen and (min-width: 481px) {
  .new-partner-container a img {
    float: left;
    margin-right: 20px;
  }
}
.new-partner-container a h3 {
  margin-bottom: 10px;
}
.new-partner-container a p {
  color: #333742;
}
.new-partner-container:after {
  content: "";
  display: table;
  clear: both;
}

.sidebarMain {
  padding: 0;
}
.sidebarMain .textwidget {
  margin-bottom: 20px;
}
.sidebarMain .textwidget iframe {
  margin: 0 10px;
}
.sidebarMain .ads_promo {
  display: none;
}

.bottom-widgets .discussionContent a {
  color: #000;
  text-decoration: none;
}
.bottom-widgets .discussionContent ul {
  margin-left: 0 !important;
  list-style-type: none;
}
.bottom-widgets .discussionContent ul li {
  float: left;
  width: 100%;
  margin-bottom: 10px;
}
.bottom-widgets .discussionContent ul li img {
  float: left;
  margin: 5px 10px 0 0;
}
.bottom-widgets .discussionContent ul li span {
  float: left;
  font-weight: bold;
  line-height: 1.2em;
  padding-top: 3px;
  width: 86%;
}
.bottom-widgets .discussionContent ul li p {
  display: inline;
  float: left;
  color: #5f5f5f;
  margin: 0;
}
.bottom-widgets .discussionContent ul li a {
  float: left;
  width: 100%;
}
.bottom-widgets .discussionContent ul li a:hover span {
  text-decoration: underline;
}
.bottom-widgets .moreDiscussion {
  float: right;
  margin-top: 5px;
}
.bottom-widgets .discussionContent h2, .bottom-widgets .socialFeedContent h2 {
  width: 100%;
  background-color: #ee2346;
  color: #fff;
  padding-left: 5px;
}

.js .noScriptSocialTabs,
.no-js .getsocial {
  display: none;
}

.no-js .noScriptSocialTabs {
  float: left;
  border: 1px solid #CCCCCC;
  width: 438px;
  height: 290px;
  padding: 10px;
}
.no-js .noScriptSocialTabs p {
  padding-bottom: 10px;
  font-weight: bold;
}
.no-js .noScriptSocialTabs p a {
  color: #000;
}

@media (max-width: 600px) {
  .bottom-widgets .socialFeedContent {
    display: none;
  }
}
@media (max-width: 1024px) {
  .bottom-widgets .large-and-up-1\/2 {
    width: 100% !important;
  }
}
.profile-box .profile_label {
  display: block;
  font-size: 11px;
  margin-top: 5px;
}
.profile-box .media, .profile-box .media__body {
  margin-bottom: -5px;
}
.profile-box .profile-box__social .icon-wrap {
  color: #808285;
}
.profile-box .edit-button {
  vertical-align: middle;
  width: 40px;
  padding-left: 0;
  padding-right: 0;
  height: 20px;
  line-height: 18px;
  font-size: 10px;
}

.campaign-slider .dark-purple h1, .campaign-slider .dark-purple h2, .campaign-slider .dark-purple h3, .campaign-slider .dark-purple h4, .campaign-slider .dark-purple p {
  color: #fff;
}
.campaign-slider .dark-purple .hero-slider__item-content:after {
  background-color: rgba(7, 83, 132, 0.6);
}

.your-voices-min-height {
  min-height: 335px;
  background-position: right;
}

.p-your-voices-box {
  max-width: 260px;
}

.submissions__count {
  position: absolute;
  bottom: 5px;
  right: 10px;
  z-index: 10;
  color: white;
  font-size: 11px;
}

.your-voices-btn {
  z-index: 10;
  position: absolute;
  bottom: 22px;
}

.campaigns__item .img-wrap:before {
  background-color: rgba(35, 31, 32, 0.6);
}

.campaigns__item-days {
  font-weight: normal;
  font-size: 11px;
  top: -10px;
  right: -13px;
  display: block;
  position: absolute;
}

.font12 {
  font-size: 12px;
}

.hero-slider__item-content:before, .hero-slider__item-content:after {
  background-color: unset;
}

.link-campaigns {
  width: 100%;
  text-align: center;
}

.stories-list .ribbon-wrapper {
  width: 85px;
  height: 88px;
  overflow: hidden;
  position: absolute;
  top: 10px;
  left: 10px;
  z-index: 2;
}
.stories-list .ribbon-wrapper .ribbon {
  text-align: center;
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  position: relative;
  padding: 4px 0;
  left: -30px;
  top: 15px;
  width: 120px;
  background-color: #ee2346;
  color: #fff;
  z-index: 3;
  font-size: 12px;
}
.stories-list .your-stories__item--half .flag__body {
  background-color: rgba(35, 31, 32, 0.7);
  padding: 0 4px;
}
.stories-list .your-stories__item--quarter .ribbon-wrapper {
  bottom: 10px;
  right: 10px;
  left: auto;
  top: auto;
}
.stories-list .your-stories__item--quarter .ribbon-wrapper .ribbon {
  right: 0;
  bottom: -45px;
  left: auto;
  top: auto;
}
.stories-list .your-stories__item--quarter .flag__img {
  bottom: 30px;
}
.stories-list .your-stories__item--quarter .flag__body {
  top: 10px;
  left: 10px;
  margin-right: 10px;
  width: auto;
  display: inline;
  background-color: rgba(35, 31, 32, 0.7);
  padding: 0 4px;
}
.stories-list .your-stories__item--quarter .your-stories__social {
  bottom: -5px;
  top: auto;
  left: 22px;
  right: auto;
}

@media all and (max-width: 481px) {
  .stories-list .your-stories__item--half .flag__body {
    top: 10px;
    left: 10px;
    margin-right: 10px;
    width: auto;
    display: inline;
  }
  .stories-list .your-stories__item--half .ribbon-wrapper {
    bottom: 10px;
    right: 10px;
    left: auto;
    top: auto;
  }
  .stories-list .your-stories__item--half .ribbon-wrapper .ribbon {
    right: 0;
    bottom: -45px;
    left: auto;
    top: auto;
  }
}
.your-stories__item--video .img-wrap > div:before {
  display: none;
}

.errors {
  color: #FF0000;
}

.checkbox-align {
  vertical-align: middle;
}
.checkbox-align span, .checkbox-align input {
  vertical-align: middle;
}

.image_upload_form .upload_file_section_wrapper .flag__body {
  padding-right: 10px;
}
.image_upload_form .upload_file_section_wrapper .wpcf7-form-control-wrap {
  display: table-row;
}

#remember-me {
  margin-bottom: 4px;
}

.header-main__member .header-main__sub-menu {
  width: 200px;
  font-size: 12px !important;
}
.header-main__member .user_profile_link img {
  margin-left: 10px;
}

.profile-box .media .media__img {
  margin-right: 20px;
  margin-bottom: 5px;
  margin-left: -15px;
}
.profile-box .media .media__body {
  padding: 0 15px !important;
}
.profile-box .media .media__body .profile-box__content {
  max-width: 800px;
  padding-right: 100px;
}
.profile-box .media .media__body .profile-box__social {
  top: 15px;
}

@media all and (max-width: 769px) {
  .profile-box .media .media__img {
    float: left;
  }
  .profile-box .media .media__img .img-wrap {
    width: 90px;
    height: 90px;
  }
  .profile-box .media .media__img .img-wrap img {
    width: 90px;
    height: 90px;
  }
}
@media all and (max-width: 550px) {
  .profile-box, .media, .media__body, .profile-box__content {
    padding-right: 5px !important;
  }
}
@media all and (min-width: 1090px) {
  .profile-box, .media, .media__body, .profile-box__content {
    padding-right: 0 !important;
  }
}
.campaigns-list {
  height: 256px;
  background-position: right;
}
.campaigns-list .campaign-list-cta {
  bottom: 12px;
  position: absolute;
  z-index: 9999;
}
.campaigns-list .mb {
  margin-bottom: 15px !important;
}
.campaigns-list h3 {
  line-height: normal;
}

#share-story {
  display: none;
}
#share-story .share-tips {
  background-color: #f5f6f9;
  padding: 10px;
}

@media all and (min-width: 720px) {
  #share-story {
    width: 700px;
  }
  #share-story .share-buttons {
    width: 325px;
    float: left;
    display: inline-block;
  }
  #share-story .share-tips {
    width: 325px;
    float: right;
    display: inline-block;
  }
}
@media all and (min-width: 1024px) {
  #share-story {
    width: 900px;
  }
  #share-story .share-buttons {
    width: 440px;
  }
  #share-story .share-tips {
    width: 440px;
  }
}
.edit-avatar-box {
  width: 140px;
  height: 160px;
}
.edit-avatar-box label {
  display: block;
  cursor: pointer;
  text-align: center;
  position: relative;
}
.edit-avatar-box label img {
  display: block;
  width: 140px;
  max-height: 140px;
}
.edit-avatar-box label:hover {
  text-decoration: underline;
}
.edit-avatar-box label .edit-bin {
  position: absolute;
  top: 0;
  right: 0;
}
.edit-avatar-box label .edit-bin .edit-bin-icon {
  padding: 3px;
  background-color: #F57B90;
  fill: #000;
}
.edit-avatar-box label .edit-bin .edit-bin-icon:hover {
  fill: #F57B90;
  background-color: #000;
}

#avatar_upload {
  display: none;
}

.bags.errors {
  color: #FF0000;
}
.bags.notifications {
  font-weight: bold;
  list-style-type: none;
  margin-left: 0;
}

.volunteer-box {
  position: relative;
  background-color: #ee2346;
  height: 380px;
  overflow: hidden;
}
@media screen and (max-width: 769px) {
  .volunteer-box {
    height: auto;
  }
}
.volunteer-box .role-image {
  height: 215px;
  background-position: 50% 50%;
  /*background-size: 591px auto;*/
}
.volunteer-box .role-content {
  padding: 10px;
  text-align: center;
  color: #fff;
}
.volunteer-box .role-content p {
  margin-bottom: 30px;
}
.volunteer-box .role-title {
  position: absolute;
  top: 150px;
  width: 100%;
  padding: 0 10px;
  color: #000;
  font-size: 24px;
  font-weight: 700;
  text-align: center;
  background-color: #febe10;
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -ms-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;
}
.volunteer-box .cta {
  position: absolute;
  bottom: 10px;
  right: 10px;
  color: #fff;
}
.volunteer-box .cta a {
  color: #fff;
  text-decoration: underline;
}
@media screen and (min-width: 481px) {
  .volunteer-box:hover .role-title {
    top: 177px;
  }
}
.volunteer-box .more-info {
  position: absolute;
  top: 10px;
  right: 10px;
  background-color: rgba(35, 31, 32, 0.7);
  color: #fff;
  padding: 0 3px;
  text-align: right;
  font-size: 12px;
}
.volunteer-box .recruiting-now {
  position: absolute;
  top: 10px;
  left: 10px;
  color: #fff;
  background-color: #ee2346;
  border: 1px solid #fff;
  text-transform: uppercase;
  padding: 4px 8px;
  text-align: center;
  font-size: 12px;
  font-weight: 700;
  line-height: 14px;
}

.volunteer-link {
  margin-bottom: 10px;
}

.volunteering-role-button {
  background-color: #febe10;
  color: #333742;
  border: none;
}

@media (max-width: 1024px) {
  .volunteering-role-column {
    display: block;
    width: 100% !important;
  }
}
/*
* news article
*/
.article-block-post-type-news .typeOfPost {
  background: #FCBF2E;
  color: #333742;
  text-transform: capitalize;
}
.article-block-post-type-news.newArticleBlock .flag__body h3 {
  background: #FCBF2E;
}
.article-block-post-type-news.newArticleBlock .flag__body h3 a {
  color: #333742;
}

/*
.prev-next-posts.post-type-news{
  a{
    color: $color-body-grey;
    background-color: $base-color-three;

    &:hover{
      background-color: $color-body-grey;
      color: $base-color-three;
    }

    &.next-post {
      background-image: url("images/lessthan_thick.png");

      &:hover {
        background-image: url("images/lessthan_hover_thick.png");
      }
    }

    &.prev-post {
      background-image: url("images/morethan_thick.png");

      &:hover {
        background-image: url("images/morethan_hover_thick.png");
      }
    }
  }
}*/
/*
* blog article
*/
.article-block-post-type-blog .typeOfPost {
  background: #FCBF2E;
  color: #333742;
  text-transform: capitalize;
}
.article-block-post-type-blog.newArticleBlock .flag__body h3 {
  background: #FCBF2E;
}
.article-block-post-type-blog.newArticleBlock .flag__body h3 a {
  color: #333742;
}

/*
* news campaign
*/
@media all and (min-width: 1025px) {
  .campaign-video-wrapper {
    position: absolute;
    top: 30px;
    right: 30px;
  }
}
.page-services .list-services, .page-resources .list-services {
  list-style-type: none;
  margin-left: 0;
}
.page-services .list-services li, .page-resources .list-services li {
  min-height: 170px;
  margin-bottom: 20px;
  padding: 10px;
}
@media screen and (min-width: 481px) {
  .page-services .list-services li, .page-resources .list-services li {
    padding: 30px;
  }
}
.page-services .list-services li:nth-child(odd), .page-resources .list-services li:nth-child(odd) {
  background: #e6e6e6;
}
.page-services .list-services li h2, .page-resources .list-services li h2 {
  line-height: normal;
  margin-bottom: 10px;
}
.page-services .list-services li img, .page-resources .list-services li img {
  float: left;
  width: 100px !important;
  height: 100px !important;
  margin-right: 10px;
}
@media screen and (min-width: 481px) {
  .page-services .list-services li img, .page-resources .list-services li img {
    margin-right: 30px;
  }
}
.page-services .list-services li .btn--primary, .page-resources .list-services li .btn--primary {
  float: right;
  margin-top: 10px;
  font-size: 14px;
}
@media screen and (min-width: 481px) {
  .page-services .list-services li .btn--primary, .page-resources .list-services li .btn--primary {
    margin-top: 20px;
    font-size: 17px;
  }
}
.page-services .list-services .fixed-size, .page-resources .list-services .fixed-size {
  width: 260px !important;
  padding-left: 10px;
  padding-right: 10px;
}
@media screen and (max-width: 480px) {
  .page-services .list-services .fixed-size, .page-resources .list-services .fixed-size {
    width: 223px !important;
  }
}
.page-services .services-footer, .page-resources .services-footer {
  padding: 10px;
}
.page-services .ext-wrapper, .page-resources .ext-wrapper {
  position: relative;
}
.page-services .ext-wrapper .thin-header .wrapper, .page-resources .ext-wrapper .thin-header .wrapper {
  max-width: 475px;
  background-color: rgba(255, 255, 255, 0.7);
  padding: 10px;
}
.page-services .ext-wrapper .thin-header .wrapper h1, .page-resources .ext-wrapper .thin-header .wrapper h1 {
  color: #075384;
}
@media screen and (max-width: 768px) {
  .page-services .ext-wrapper .thin-header .wrapper h1, .page-resources .ext-wrapper .thin-header .wrapper h1 {
    font-size: 30px;
  }
}
.page-services .ext-wrapper .thin-header .wrapper p, .page-resources .ext-wrapper .thin-header .wrapper p {
  color: inherit;
}
@media screen and (max-width: 480px) {
  .page-services .ext-wrapper .thin-header, .page-resources .ext-wrapper .thin-header {
    padding: 20px;
  }
}
.page-services .ext-wrapper .ticker, .page-resources .ext-wrapper .ticker {
  position: absolute;
  top: 70px;
  right: 50px;
  width: 225px;
}
@media screen and (max-width: 1024px) {
  .page-services .ext-wrapper .ticker, .page-resources .ext-wrapper .ticker {
    display: none;
  }
}
.page-services .ext-wrapper .ticker blockquote, .page-resources .ext-wrapper .ticker blockquote {
  margin: 1.5em 10px;
  padding: 0.5em 10px;
  quotes: "“" "”" "‘" "’";
  text-align: center;
  display: none;
}
.page-services .ext-wrapper .ticker blockquote:before, .page-resources .ext-wrapper .ticker blockquote:before {
  content: open-quote;
  font-size: 4em;
  line-height: 0.1em;
  margin-right: 0.25em;
  vertical-align: -0.4em;
}
.page-services .ext-wrapper .ticker blockquote:after, .page-resources .ext-wrapper .ticker blockquote:after {
  content: close-quote;
  font-size: 4em;
  line-height: 0.1em;
  margin-left: 0.25em;
  vertical-align: -0.6em;
}
.page-services .ext-wrapper .ticker blockquote p, .page-resources .ext-wrapper .ticker blockquote p {
  display: inline;
  font-weight: 700;
}

.advisors-form, .resources-form, .courses-form, .events-form {
  padding-left: 0;
}
.advisors-form .form-element, .resources-form .form-element, .courses-form .form-element, .events-form .form-element {
  margin-bottom: 20px;
}
.advisors-form .form-element.last, .resources-form .form-element.last, .courses-form .form-element.last, .events-form .form-element.last {
  margin-bottom: 0;
}
.advisors-form .form-element .number, .resources-form .form-element .number, .courses-form .form-element .number, .events-form .form-element .number {
  width: 100px;
}

.counselling-form-and-faq, .volunteering-faq {
  transition: all 0.5s ease 0s;
}
.counselling-form-and-faq .chatfaq h3, .volunteering-faq .chatfaq h3 {
  padding: 5px 25px 5px 15px;
  color: #075384;
  font-weight: normal;
  background-image: url(images/faq-arrows-blue-invert-long.png);
  background-position: 99% -128px;
}
.counselling-form-and-faq .chatfaq h3.tabOpen, .volunteering-faq .chatfaq h3.tabOpen {
  background: #EFEFEF url(images/faq-arrows-blue-invert-long.png) no-repeat 99% 10px;
  transition: all 0.5s ease 0s;
}
.counselling-form-and-faq .chatfaq h3:nth-of-type(2n+1), .volunteering-faq .chatfaq h3:nth-of-type(2n+1) {
  background-color: #eaeaea;
}
.counselling-form-and-faq .chatfaq h3:nth-of-type(2n), .volunteering-faq .chatfaq h3:nth-of-type(2n) {
  background-color: #f5f5f5;
}
.counselling-form-and-faq .chatfaq h3 a p, .volunteering-faq .chatfaq h3 a p {
  margin-bottom: 0;
}
.counselling-form-and-faq .chatfaq h3 a:hover p, .volunteering-faq .chatfaq h3 a:hover p {
  text-decoration: underline;
}

.news-research-boxes .volunteer-box {
  color: #333742;
  background-color: transparent;
  border: 1px solid lightgrey;
  height: 350px;
}
@media screen and (max-width: 769px) {
  .news-research-boxes .volunteer-box {
    height: auto;
  }
}
.news-research-boxes .volunteer-box .role-title {
  font-size: 16px;
}
.news-research-boxes .volunteer-box .role-content {
  color: #333742;
}
.news-research-boxes .volunteer-box .role-content p {
  margin-bottom: 0;
}
.news-research-boxes .volunteer-box .typeOfPost {
  display: block;
  top: 5px;
  left: 5px;
  position: absolute;
  z-index: 2;
  font-size: 12px;
  font-weight: bold;
  padding: 3px;
  line-height: 10px;
  background: #FCBF2E;
  color: #333742;
  text-transform: capitalize;
}

.course-list .course-block {
  padding-bottom: 20px;
  border-bottom: 3px solid #ee2346;
}
.course-list .course-block .course-title {
  padding-left: 40px;
}
.course-list .course-block .course-image {
  position: relative;
}
.course-list .course-block .course-image img {
  width: 100%;
  height: auto;
}
.course-list .course-block .course-badge {
  position: absolute;
  bottom: 0;
  right: 0;
  width: 80px;
  height: 80px;
}
.course-list .course-block h2 {
  color: #333742;
  font-size: 26px;
  margin-bottom: 10px;
}
.course-list .course-block .course-opt-button {
  margin-top: 10px;
}
.course-list .course-block .course-opt-button .option {
  margin-bottom: 5px;
  font-size: 13px;
  background-size: 12px 12px !important;
  background-position: 0 4px !important;
  background-repeat: no-repeat !important;
  padding-left: 17px;
}
.course-list .course-block .course-opt-button .option.clock {
  background-image: url("images/icons/clock.svg");
}
.course-list .course-block .course-opt-button .option.label {
  background-image: url("images/icons/label-grey.svg");
}
.course-list .course-block .course-opt-button .course-button {
  background-color: #ee2346;
  border: none;
}
.course-list .course-block .course-opt-button .course-button:hover {
  background-color: #333742;
}

.tm_courses .checkbox-indent {
  padding-left: 10px;
}
.tm_courses input[type="checkbox"] {
  vertical-align: middle;
}

.article-block-post-type-course .typeOfPost {
  background: #FCBF2E;
  color: #333742;
  text-transform: capitalize;
}

.colourBlockOne .article-block-post-type-course .typeOfPost {
  background: #D61807 !important;
  color: #fff;
}

.colourBlockTwo .article-block-post-type-course .typeOfPost {
  background: #003388 !important;
  color: #fff;
}

.colourBlockThree .article-block-post-type-course .typeOfPost {
  background: #047B04 !important;
  color: #fff;
}

.colourBlockFour .article-block-post-type-course .typeOfPost {
  background: #025F78 !important;
  color: #fff;
}

.colourBlockFive .article-block-post-type-course .typeOfPost {
  background: #AA2233 !important;
  color: #fff;
}

.colourBlockSix .article-block-post-type-course .typeOfPost {
  background: #882277 !important;
  color: #fff;
}

.colourBlockSeven .article-block-post-type-course .typeOfPost {
  background: #CF0072 !important;
  color: #fff;
}

.colourBlockEight .article-block-post-type-course .typeOfPost {
  background: #1D7C71 !important;
  color: #fff;
}

.colourBlockNine .article-block-post-type-course .typeOfPost {
  background: #CC3300 !important;
  color: #fff;
}

.vertical-timeline .cd-container {
  /* this class is used to give a max-width to the element it is applied to, and center it horizontally when it reaches that max-width */
  width: 90%;
  max-width: 1170px;
  margin: 0 auto;
}
.vertical-timeline .cd-container::after {
  /* clearfix */
  content: '';
  display: table;
  clear: both;
}
.vertical-timeline #cd-timeline {
  position: relative;
  padding-bottom: 2em;
  margin-top: 2em;
  margin-bottom: 2em;
}
.vertical-timeline #cd-timeline::before {
  /* this is the vertical line */
  content: '';
  position: absolute;
  top: 0;
  left: 28px;
  height: 100%;
  width: 4px;
  background: #ee2346;
}
.vertical-timeline .cd-timeline-block {
  position: relative;
  margin: 2em 0;
}
.vertical-timeline .cd-timeline-block:after {
  content: "";
  display: table;
  clear: both;
}
.vertical-timeline .cd-timeline-block:first-child {
  margin-top: 0;
}
.vertical-timeline .cd-timeline-block:last-child {
  margin-bottom: 0;
}
.vertical-timeline .cd-timeline-content {
  position: relative;
  margin-left: 75px;
  background: #075384;
  padding: 8px 1em;
}
.vertical-timeline .cd-timeline-content:after {
  content: "";
  display: table;
  clear: both;
}
.vertical-timeline .cd-timeline-content h2 {
  color: white;
  margin-bottom: 0;
  font-size: 1.25rem;
}
.vertical-timeline .cd-timeline-content::before {
  content: '';
  position: absolute;
  top: 8px;
  right: 100%;
  height: 0;
  width: 0;
  border: 7px solid transparent;
  border-right: 7px solid #025f78;
}
.vertical-timeline .event-year {
  position: relative;
  border-radius: 50%;
  background-color: #ee2346;
  width: 60px;
  height: 60px;
  text-align: center;
  padding-top: 16px;
  color: white;
  font-weight: 700;
  font-size: 18px;
}
.vertical-timeline .event-date {
  position: absolute;
  top: 0;
  padding: 5px 0;
  left: 10px;
  background-color: white;
  font-weight: 700;
}
.vertical-timeline .event-details {
  margin-left: 75px;
  box-shadow: 0 1px 0 #e6e6e6;
  padding-top: 1em;
}
@media screen and (max-width: 1025px) {
  .vertical-timeline .event-details {
    padding-right: 0;
  }
}
.vertical-timeline .event-details img {
  width: 250px;
  margin-right: 1em;
  margin-bottom: 1em;
  float: left;
}
@media screen and (max-width: 1025px) {
  .vertical-timeline .event-details img {
    width: 100%;
    margin-right: 0;
  }
}
.vertical-timeline .event-details .read-more {
  float: right;
  margin: 1em;
}
.vertical-timeline .cd-timeline-block > a:hover {
  text-decoration: none;
}
.vertical-timeline .event-details-left {
  float: left;
  max-width: 250px;
}

.event-map .em-location-map-container {
  width: 100% !important;
}

.event-thumbnail {
  max-width: 250px !important;
  height: auto;
  float: left;
  margin-right: 20px;
  margin-bottom: 20px;
}
@media screen and (max-width: 900px) {
  .event-thumbnail {
    float: none;
    margin-right: 0;
    max-width: 100% !important;
  }
}

.alignment .wpcf7-list-item {
  margin-left: 0 !important;
}

.collapsible {
  margin-bottom: 20px;
  background-color: #075384;
}
.collapsible .collapsible-content {
  background-color: #fff !important;
  padding: 12px 0px;
  display: none;
}
.collapsible h3 {
  color: #fff !important;
  padding: 7px 15px 7px 12px;
  font-size: 17px !important;
  margin-bottom: 0;
  -moz-transition: all ease 0.5s;
  -o-transition: all ease 0.5s;
  -webkit-transition: all ease 0.5s;
  transition: all ease 0.5s;
  background: url(images/app-submission-arrows.png) no-repeat 100% -32px;
}
.collapsible h3:hover {
  cursor: pointer;
}
.collapsible .collapsible-header {
  margin-right: 2px;
}
.collapsible .open h3 {
  background: url(images/app-submission-arrows.png) no-repeat 100% 8px;
}
.collapsible .wpcf7-response-output {
  margin-top: 0 !important;
}

#triage-button {
  position: fixed;
  bottom: 0;
  right: 0;
  z-index: 99999;
  color: #fff;
}
@media screen and (min-width: 416px) {
  #triage-button {
    right: 50px;
  }
}
#triage-button a {
  display: block;
  padding: 5px 35px 5px 50px;
  font-size: 16px;
  background: #231f20 url("images/icons/icon-triage-23.png") no-repeat 15px 6px;
  text-decoration: none;
}
#triage-button a:hover {
  background-color: #075384;
}

#triage-overlay {
  display: none;
  position: fixed;
  z-index: 999999999;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: auto;
  background-color: rgba(0, 0, 0, 0.4);
}

#triage-tool {
  background-color: #fff;
  border-top: 0;
  text-align: left;
  max-width: 400px;
  width: 100%;
  height: 100%;
  right: 0;
  bottom: -100%;
  position: fixed;
  z-index: 999999999999;
  -moz-transition: all ease 1s;
  -o-transition: all ease 1s;
  -webkit-transition: all ease 1s;
  transition: all ease 1s;
  overflow-y: scroll;
  overflow-x: hidden;
}
#triage-tool #triage-header {
  background-color: #075384;
  color: #fff;
  padding-bottom: 10px;
  height: 100px;
  position: relative;
}
@media screen and (max-width: 415px) {
  #triage-tool #triage-header {
    height: 80px;
    padding-bottom: 0;
  }
}
#triage-tool #triage-header .triage-close {
  color: #aaa;
  position: absolute;
  right: 7px;
  top: 0;
  font-size: 28px;
  font-weight: bold;
}
@media screen and (max-width: 415px) {
  #triage-tool #triage-header .triage-close {
    right: 26px;
  }
}
#triage-tool #triage-header .triage-close:hover,
#triage-tool #triage-header .triage-close:focus {
  color: black;
  text-decoration: none;
  cursor: pointer;
}
#triage-tool #triage-header .triage-top {
  position: fixed;
  width: 383px;
  height: 90px;
  background-color: #075384;
  padding: 10px;
  z-index: 1;
  text-align: initial;
}
@media screen and (max-width: 415px) {
  #triage-tool #triage-header .triage-top {
    width: 100%;
    text-align: center;
    height: 80px;
  }
}
#triage-tool #triage-header .triage-top .logo {
  width: 85px;
  float: left;
  margin-right: 10px;
}
@media screen and (min-width: 416px) {
  #triage-tool #triage-header .triage-top .logo {
    width: 140px;
    margin-right: 30px;
  }
}
#triage-tool #triage-header .triage-top #triage-contact {
  background-color: #ee2346;
  display: inline-block;
  padding: 0 5px;
  text-align: center;
  font-size: 11px;
  margin-right: 30px;
}
@media screen and (min-width: 416px) {
  #triage-tool #triage-header .triage-top #triage-contact {
    font-size: 13px;
    margin-right: 0;
  }
}
#triage-tool #triage-header .triage-top #triage-contact a {
  text-decoration: none;
}
#triage-tool #triage-header .triage-top #triage-contact a:hover {
  text-decoration: underline;
}
#triage-tool #triage-header .triage-top h3 {
  margin-top: 10px;
  color: #fff;
  text-align: center;
}
@media screen and (max-width: 415px) {
  #triage-tool #triage-header .triage-top h3 {
    margin-top: 0;
  }
}
#triage-tool .triage-intro {
  background-color: #075384;
  color: #fff;
  padding-left: 10%;
  padding-right: 10%;
  padding-bottom: 1px;
  text-align: center;
}
@media screen and (max-width: 415px) {
  #triage-tool .triage-intro p {
    margin-bottom: 10px;
  }
}
#triage-tool .bx-wrapper .bx-viewport {
  height: 100% !important;
}
#triage-tool .bx-wrapper .bx-viewport ul {
  margin: 0 !important;
  padding: 0 !important;
  top: 0 !important;
  width: 100%;
}
#triage-tool .bx-wrapper .bx-viewport ul li {
  background-color: #fff;
  color: #333742;
  padding: 0 20px;
  margin: 0;
}
@media screen and (max-width: 415px) {
  #triage-tool .bx-wrapper .bx-viewport ul li .smiley {
    width: 24px;
  }
}
#triage-tool .bx-wrapper .bx-viewport ul li .triage-range-wrapper {
  display: inline-block;
  width: 256px;
}
@media screen and (max-width: 415px) {
  #triage-tool .bx-wrapper .bx-viewport ul li .triage-range-wrapper {
    width: 172px;
  }
}
#triage-tool .bx-wrapper .bx-viewport ul li .triage-range-wrapper input {
  padding: 0 !important;
  height: auto !important;
  border: none !important;
}
#triage-tool .bx-wrapper .bx-viewport ul li label {
  font-size: 16px;
  margin-top: 20px;
  margin-bottom: 5px;
}
#triage-tool .bx-wrapper .bx-viewport ul li label:first-child {
  margin-top: 10px;
}
#triage-tool .bx-wrapper .bx-viewport ul li .mr {
  margin-right: 10px !important;
}
#triage-tool .bx-wrapper .bx-viewport ul li .ml {
  margin-left: 10px !important;
}
#triage-tool .bx-wrapper .bx-viewport ul li .sod_list_wrapper {
  height: 150px;
}
#triage-tool .bx-wrapper .bx-viewport ul li .btn--primary {
  margin-top: 40px;
}
#triage-tool .bx-wrapper .bx-viewport ul li #age {
  width: 60px;
}
#triage-tool .triage-back-btn {
  color: #fff;
  text-decoration: none;
  margin-bottom: 9px;
}
#triage-tool .triage-back-btn.top {
  margin-top: 12px !important;
}
#triage-tool .triage-back-btn.bottom {
  margin-top: 20px !important;
}
#triage-tool .signpost {
  display: block;
}
#triage-tool .signpost li {
  padding-left: 5px !important;
}
#triage-tool .signpost .signpost-bullet {
  width: auto;
  height: 25px;
  float: left;
  margin-right: 10px;
}
#triage-tool .signpost p {
  overflow: hidden;
}
#triage-tool .crisis {
  background-color: #ffe4c4;
  padding: 10px 15px;
  text-align: center;
  font-weight: 600;
  margin-top: 30px;
}
#triage-tool .validation {
  margin-top: 10px !important;
  margin-bottom: 0 !important;
}

.triage-open #triage-tool {
  bottom: 0;
}

.triage-open #triage-overlay {
  display: block;
}

.triage-results {
  width: 100%;
}
.triage-results .collapsible {
  margin-bottom: 20px;
  background-color: #fff;
}
.triage-results .collapsible .collapsible-header {
  margin: 0 !important;
  background-color: #febe10;
}
.triage-results .collapsible .collapsible-content {
  padding-top: 20px;
  padding-bottom: 0;
  display: none;
  background-color: #f5f6f9 !important;
}
.triage-results .collapsible .collapsible-content li {
  width: 100%;
  background-color: transparent !important;
}
.triage-results .collapsible .collapsible-content .media__body p {
  margin-bottom: 0;
}
.triage-results .collapsible .collapsible-content .media__body .chat-calendar {
  background: url("images/icons/calendar-blue.svg");
  background-size: 15px 15px;
  background-repeat: no-repeat;
  float: left;
  margin-top: 5px;
}
.triage-results .collapsible .collapsible-content .media__body .chat-calendar .chat-date {
  padding-left: 20px;
  float: left;
}
.triage-results .collapsible .collapsible-content .apps {
  margin-bottom: 20px !important;
}
.triage-results .collapsible .collapsible-content .app-link {
  padding-bottom: 0;
}
.triage-results .collapsible .collapsible-content .icon-store {
  margin-top: 5px;
  display: inline;
  width: 100px;
  height: auto;
}
.triage-results .collapsible h3 {
  color: #000 !important;
  padding: 10px 15px;
  font-size: 16px !important;
  font-weight: normal;
  margin-bottom: 0;
  -moz-transition: all ease 0.5s;
  -o-transition: all ease 0.5s;
  -webkit-transition: all ease 0.5s;
  transition: all ease 0.5s;
  background: url(images/faq-arrows-blue-invert-long.png) no-repeat 96% -117px;
}
@media screen and (max-width: 415px) {
  .triage-results .collapsible h3 {
    padding-left: 5px;
  }
}
.triage-results .collapsible h3:hover {
  cursor: pointer;
}
.triage-results .collapsible h3 img {
  height: 30px;
  width: auto;
  margin-right: 10px;
}
@media screen and (max-width: 415px) {
  .triage-results .collapsible h3 img {
    margin-right: 3px !important;
  }
}
.triage-results .collapsible h3 .va-bottom {
  vertical-align: bottom;
}
.triage-results .collapsible .collapsible-header {
  margin-right: 2px;
}
.triage-results .collapsible .open h3 {
  background: url(images/faq-arrows-blue-invert-long.png) no-repeat 96% 19px;
}
.triage-results .collapsible a {
  text-decoration: none;
}
.triage-results .advisor-item {
  margin-bottom: 20px !important;
}
.triage-results .advisor-item .advisor-action .advisor-button {
  color: #fff;
  margin-top: 10px !important;
}
@media screen and (max-width: 480px) {
  .triage-results .advisor-item .media__img {
    float: none;
    margin-bottom: 20px;
  }
}
.triage-results .advisor-item h5 {
  color: #333742 !important;
}

.fade-in {
  animation: fadein 1s;
  -moz-animation: fadein 1s;
  /* Firefox */
  -webkit-animation: fadein 1s;
  /* Safari and Chrome */
  -o-animation: fadein 1s;
  /* Opera */
}

@keyframes fadein {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@-moz-keyframes fadein {
  /* Firefox */
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@-webkit-keyframes fadein {
  /* Safari and Chrome */
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@-o-keyframes fadein {
  /* Opera */
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
[type=range] {
  -webkit-appearance: none;
  margin: 15px 0;
  width: 100%;
}
[type=range]:focus {
  outline: none;
}
[type=range]::-webkit-slider-runnable-track {
  width: 100%;
  height: 5px;
  cursor: pointer;
  transition: all .2s ease;
  box-shadow: 0 0 0 #222, 0 0 0 #2f2f2f;
  background: #e6e6e6;
  border: 0 solid #000;
  border-radius: 0;
}
[type=range]::-webkit-slider-thumb {
  box-shadow: 0 0 0 #111, 0 0 0 #1e1e1e;
  border: 1px solid #fff;
  height: 30px;
  width: 10px;
  border-radius: 0;
  background: #ee2346;
  cursor: pointer;
  -webkit-appearance: none;
  margin-top: -12.5px;
}
[type=range]:focus::-webkit-slider-runnable-track {
  background: #f3f3f3;
}
[type=range]::-moz-range-track {
  width: 100%;
  height: 5px;
  cursor: pointer;
  transition: all .2s ease;
  box-shadow: 0 0 0 #222, 0 0 0 #2f2f2f;
  background: #e6e6e6;
  border: 0 solid #000;
  border-radius: 0;
}
[type=range]::-moz-range-thumb {
  box-shadow: 0 0 0 #111, 0 0 0 #1e1e1e;
  border: 1px solid #fff;
  height: 30px;
  width: 10px;
  border-radius: 0;
  background: #ee2346;
  cursor: pointer;
}
[type=range]::-ms-track {
  width: 100%;
  height: 5px;
  cursor: pointer;
  transition: all .2s ease;
  background: transparent;
  border-color: transparent;
  border-width: 10px 0;
  color: transparent;
}
[type=range]::-ms-fill-lower {
  box-shadow: 0 0 0 #222, 0 0 0 #2f2f2f;
  background: #d9d9d9;
  border: 0 solid #000;
  border-radius: 0;
}
[type=range]::-ms-fill-upper {
  box-shadow: 0 0 0 #222, 0 0 0 #2f2f2f;
  background: #e6e6e6;
  border: 0 solid #000;
  border-radius: 0;
}
[type=range]::-ms-thumb {
  box-shadow: 0 0 0 #111, 0 0 0 #1e1e1e;
  border: 1px solid #fff;
  height: 30px;
  width: 10px;
  border-radius: 0;
  background: #ee2346;
  cursor: pointer;
}
[type=range]:focus::-ms-fill-lower {
  background: #e6e6e6;
}
[type=range]:focus::-ms-fill-upper {
  background: #f3f3f3;
}

/* Adds Firefox < 35 support */
/* FIREFOX won't let us hide the native select arrow, so we have to make it wider than needed and clip it via overflow on the parent container. The percentage width is a fallback since FF 4+ supports calc() so we can just add a fixed amount of extra width to push the native arrow out of view. We're applying this hack across all FF versions because all the previous hacks were too fragile and complex. You might want to consider not using this hack and using the native select arrow in FF. Note this makes the menus wider than the select button because they display at the specified width and aren't clipped. Targeting hack via http://browserhacks.com/#hack-758bff81c5c32351b02e10480b5ed48e */
/* Show only the native arrow */
@-moz-document url-prefix() {
  /* Warning: this kills the focus outline style */
  .custom-select {
    overflow: hidden;
  }

  .custom-select::after {
    display: block;
  }

  /* Make the native select extra wide so the arrow is clipped. 1.5em seems to be enough to safely clip it */
  .custom-select select {
    overflow: -moz-hidden-unscrollable;
    padding-right: .4em;
    background: none;
    /* Match-04 */
    border: 1px solid transparent;
    /* Match-05 */
    /* Firefox < 4 */
    min-width: 6em;
    width: 130%;
    /* Firefox 4-15 */
    min-width: -moz-calc(0em);
    width: -moz-calc(100% + 2.4em);
    /* Firefox 16+ */
    min-width: calc(0em);
    width: calc(100% + 2.4em);
  }

  /* Firefox 35+ that supports hiding the native select can have a proper 100% width, no need for the overflow clip trick */
  @supports (mask-type: alpha) {
    .custom-select {
      overflow: visible;
    }

    .custom-select select {
      -moz-appearance: none;
      width: 100%;
      padding-right: 2em;
      /* Match-01 padding-right */
    }
  }
}
/* Firefox focus has odd artifacts around the text, this kills that. See https://developer.mozilla.org/en-US/docs/Web/CSS/:-moz-focusring */
.custom-select select:-moz-focusring {
  color: transparent;
  text-shadow: 0 0 0 #000;
}

/* IE 10/11+ - This hides native dropdown button arrow so it will have the custom appearance. Targeting media query hack via http://browserhacks.com/#hack-28f493d247a12ab654f6c3637f6978d5 - looking for better ways to achieve this targeting */
/* The second rule removes the odd blue bg color behind the text in the select button in IE 10/11 and sets the text color to match the focus style's - fix via http://stackoverflow.com/questions/17553300/change-ie-background-color-on-unopened-focused-select-box */
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
  .custom-select select::-ms-expand {
    display: none;
  }

  .custom-select select:focus {
    border-color: #aaa;
    /* Match-03 */
  }

  .custom-select select:focus::-ms-value {
    background: transparent;
    color: #222;
    /* Match-02*/
  }

  .custom-select select {
    padding-right: 2em;
    /* Match-01 */
    background: none;
    /* Match-04 */
    border: 1px solid transparent;
    /* Match-05 */
  }

  .custom-select::after {
    display: block;
  }
}
/* Container used for styling the custom select, the buttom class below adds the
 * bg gradient, corners, etc. */
.custom-select {
  position: relative;
  display: block;
}

/* This is the native select, we're making everything but the text invisible so
 * we can see the button styles in the wrapper */
.custom-select select {
  width: 100%;
  margin: 0;
  outline: none;
  padding: .6em .8em .5em .8em;
  /* Prefixed box-sizing rules necessary for older browsers */
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  /* Font size must be 16px to prevent iOS page zoom on focus */
  font-size: 16px;
}

/* Custom arrow sits on top of the select - could be an image, SVG, icon font,
 * etc. or the arrow could just baked into the bg image on the select. */
.custom-select::after {
  content: " ";
  position: absolute;
  top: 50%;
  right: 1em;
  z-index: 2;
  /* These hacks make the select behind the arrow clickable in some browsers */
  pointer-events: none;
  display: none;
}

@supports (-webkit-appearance: none) or (appearance: none) or ((-moz-appearance: none) and (mask-type: alpha)) {
  /* Show custom arrow */
  .custom-select::after {
    display: block;
  }

  /* Remove select styling */
  .custom-select select {
    padding-right: 2em;
    /* Match-01 */
    /* inside @supports so that iOS <= 8 display the native arrow */
    background: none;
    /* Match-04 */
    /* inside @supports so that Android <= 4.3 display the native arrow */
    border: 1px solid transparent;
    /* Match-05 */
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
  }

  .custom-select select:focus {
    border-color: #aaa;
    /* Match-03 */
  }
}
.custom-select select {
  background: white;
  border: 1px solid #b7bdce;
  color: #333742;
  font-family: Arial, sans-serif;
  font-size: 14px;
  vertical-align: middle;
  height: 36px;
  padding: 0 12px 0 19px;
}
.custom-select option {
  padding: 4px;
}
.custom-select:after {
  content: "\25BC";
  top: 30%;
  color: #b7bdce;
}
.custom-select.form-element:after {
  top: 20%;
}
.custom-select.mb:after {
  top: 7px;
}
.custom-select.laf-select {
  width: 245px;
  float: right;
  margin-bottom: 7px;
}
.custom-select.laf-select:after {
  top: 22%;
}
.custom-select.laf-local {
  width: 100%;
}

.fadein,
.fadeout {
  -webkit-transition: all cubic-bezier(0.25, 0.46, 0.45, 0.94) 1.5s;
  -moz-transition: all cubic-bezier(0.25, 0.46, 0.45, 0.94) 1.5s;
  -o-transition: all cubic-bezier(0.25, 0.46, 0.45, 0.94) 1.5s;
  transition: all cubic-bezier(0.25, 0.46, 0.45, 0.94) 1.5s;
}

.fadein.ng-hide-remove,
.fadeout.ng-hide-add.ng-hide-add-active {
  opacity: 0;
  display: block !important;
}

.fadeout.ng-hide-add,
.fadein.ng-hide-remove.ng-hide-remove-active {
  opacity: 1;
  display: block !important;
}

/*********** Bootstrap begins **************/
.row {
  margin-left: -15px;
  margin-right: -15px;
}

.col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, .col-xs-2, .col-sm-2, .col-md-2, .col-lg-2, .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12 {
  position: relative;
  min-height: 1px;
  padding-left: 15px;
  padding-right: 15px;
}

.col-xs-1, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9, .col-xs-10, .col-xs-11, .col-xs-12 {
  float: left;
}

.col-xs-12 {
  width: 100%;
}

.col-xs-11 {
  width: 91.66666667%;
}

.col-xs-10 {
  width: 83.33333333%;
}

.col-xs-9 {
  width: 75%;
}

.col-xs-8 {
  width: 66.66666667%;
}

.col-xs-7 {
  width: 58.33333333%;
}

.col-xs-6 {
  width: 50%;
}

.col-xs-5 {
  width: 41.66666667%;
}

.col-xs-4 {
  width: 33.33333333%;
}

.col-xs-3 {
  width: 25%;
}

.col-xs-2 {
  width: 16.66666667%;
}

.col-xs-1 {
  width: 8.33333333%;
}

.col-xs-pull-12 {
  right: 100%;
}

.col-xs-pull-11 {
  right: 91.66666667%;
}

.col-xs-pull-10 {
  right: 83.33333333%;
}

.col-xs-pull-9 {
  right: 75%;
}

.col-xs-pull-8 {
  right: 66.66666667%;
}

.col-xs-pull-7 {
  right: 58.33333333%;
}

.col-xs-pull-6 {
  right: 50%;
}

.col-xs-pull-5 {
  right: 41.66666667%;
}

.col-xs-pull-4 {
  right: 33.33333333%;
}

.col-xs-pull-3 {
  right: 25%;
}

.col-xs-pull-2 {
  right: 16.66666667%;
}

.col-xs-pull-1 {
  right: 8.33333333%;
}

.col-xs-pull-0 {
  right: auto;
}

.col-xs-push-12 {
  left: 100%;
}

.col-xs-push-11 {
  left: 91.66666667%;
}

.col-xs-push-10 {
  left: 83.33333333%;
}

.col-xs-push-9 {
  left: 75%;
}

.col-xs-push-8 {
  left: 66.66666667%;
}

.col-xs-push-7 {
  left: 58.33333333%;
}

.col-xs-push-6 {
  left: 50%;
}

.col-xs-push-5 {
  left: 41.66666667%;
}

.col-xs-push-4 {
  left: 33.33333333%;
}

.col-xs-push-3 {
  left: 25%;
}

.col-xs-push-2 {
  left: 16.66666667%;
}

.col-xs-push-1 {
  left: 8.33333333%;
}

.col-xs-push-0 {
  left: auto;
}

.col-xs-offset-12 {
  margin-left: 100%;
}

.col-xs-offset-11 {
  margin-left: 91.66666667%;
}

.col-xs-offset-10 {
  margin-left: 83.33333333%;
}

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

.col-xs-offset-8 {
  margin-left: 66.66666667%;
}

.col-xs-offset-7 {
  margin-left: 58.33333333%;
}

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

.col-xs-offset-5 {
  margin-left: 41.66666667%;
}

.col-xs-offset-4 {
  margin-left: 33.33333333%;
}

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

.col-xs-offset-2 {
  margin-left: 16.66666667%;
}

.col-xs-offset-1 {
  margin-left: 8.33333333%;
}

.col-xs-offset-0 {
  margin-left: 0%;
}

@media (min-width: 768px) {
  .col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12 {
    float: left;
  }

  .col-sm-12 {
    width: 100%;
  }

  .col-sm-11 {
    width: 91.66666667%;
  }

  .col-sm-10 {
    width: 83.33333333%;
  }

  .col-sm-9 {
    width: 75%;
  }

  .col-sm-8 {
    width: 66.66666667%;
  }

  .col-sm-7 {
    width: 58.33333333%;
  }

  .col-sm-6 {
    width: 50%;
  }

  .col-sm-5 {
    width: 41.66666667%;
  }

  .col-sm-4 {
    width: 33.33333333%;
  }

  .col-sm-3 {
    width: 25%;
  }

  .col-sm-2 {
    width: 16.66666667%;
  }

  .col-sm-1 {
    width: 8.33333333%;
  }

  .col-sm-pull-12 {
    right: 100%;
  }

  .col-sm-pull-11 {
    right: 91.66666667%;
  }

  .col-sm-pull-10 {
    right: 83.33333333%;
  }

  .col-sm-pull-9 {
    right: 75%;
  }

  .col-sm-pull-8 {
    right: 66.66666667%;
  }

  .col-sm-pull-7 {
    right: 58.33333333%;
  }

  .col-sm-pull-6 {
    right: 50%;
  }

  .col-sm-pull-5 {
    right: 41.66666667%;
  }

  .col-sm-pull-4 {
    right: 33.33333333%;
  }

  .col-sm-pull-3 {
    right: 25%;
  }

  .col-sm-pull-2 {
    right: 16.66666667%;
  }

  .col-sm-pull-1 {
    right: 8.33333333%;
  }

  .col-sm-pull-0 {
    right: auto;
  }

  .col-sm-push-12 {
    left: 100%;
  }

  .col-sm-push-11 {
    left: 91.66666667%;
  }

  .col-sm-push-10 {
    left: 83.33333333%;
  }

  .col-sm-push-9 {
    left: 75%;
  }

  .col-sm-push-8 {
    left: 66.66666667%;
  }

  .col-sm-push-7 {
    left: 58.33333333%;
  }

  .col-sm-push-6 {
    left: 50%;
  }

  .col-sm-push-5 {
    left: 41.66666667%;
  }

  .col-sm-push-4 {
    left: 33.33333333%;
  }

  .col-sm-push-3 {
    left: 25%;
  }

  .col-sm-push-2 {
    left: 16.66666667%;
  }

  .col-sm-push-1 {
    left: 8.33333333%;
  }

  .col-sm-push-0 {
    left: auto;
  }

  .col-sm-offset-12 {
    margin-left: 100%;
  }

  .col-sm-offset-11 {
    margin-left: 91.66666667%;
  }

  .col-sm-offset-10 {
    margin-left: 83.33333333%;
  }

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

  .col-sm-offset-8 {
    margin-left: 66.66666667%;
  }

  .col-sm-offset-7 {
    margin-left: 58.33333333%;
  }

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

  .col-sm-offset-5 {
    margin-left: 41.66666667%;
  }

  .col-sm-offset-4 {
    margin-left: 33.33333333%;
  }

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

  .col-sm-offset-2 {
    margin-left: 16.66666667%;
  }

  .col-sm-offset-1 {
    margin-left: 8.33333333%;
  }

  .col-sm-offset-0 {
    margin-left: 0%;
  }
}
@media (min-width: 992px) {
  .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12 {
    float: left;
  }

  .col-md-12 {
    width: 100%;
  }

  .col-md-11 {
    width: 91.66666667%;
  }

  .col-md-10 {
    width: 83.33333333%;
  }

  .col-md-9 {
    width: 75%;
  }

  .col-md-8 {
    width: 66.66666667%;
  }

  .col-md-7 {
    width: 58.33333333%;
  }

  .col-md-6 {
    width: 50%;
  }

  .col-md-5 {
    width: 41.66666667%;
  }

  .col-md-4 {
    width: 33.33333333%;
  }

  .col-md-3 {
    width: 25%;
  }

  .col-md-2 {
    width: 16.66666667%;
  }

  .col-md-1 {
    width: 8.33333333%;
  }

  .col-md-pull-12 {
    right: 100%;
  }

  .col-md-pull-11 {
    right: 91.66666667%;
  }

  .col-md-pull-10 {
    right: 83.33333333%;
  }

  .col-md-pull-9 {
    right: 75%;
  }

  .col-md-pull-8 {
    right: 66.66666667%;
  }

  .col-md-pull-7 {
    right: 58.33333333%;
  }

  .col-md-pull-6 {
    right: 50%;
  }

  .col-md-pull-5 {
    right: 41.66666667%;
  }

  .col-md-pull-4 {
    right: 33.33333333%;
  }

  .col-md-pull-3 {
    right: 25%;
  }

  .col-md-pull-2 {
    right: 16.66666667%;
  }

  .col-md-pull-1 {
    right: 8.33333333%;
  }

  .col-md-pull-0 {
    right: auto;
  }

  .col-md-push-12 {
    left: 100%;
  }

  .col-md-push-11 {
    left: 91.66666667%;
  }

  .col-md-push-10 {
    left: 83.33333333%;
  }

  .col-md-push-9 {
    left: 75%;
  }

  .col-md-push-8 {
    left: 66.66666667%;
  }

  .col-md-push-7 {
    left: 58.33333333%;
  }

  .col-md-push-6 {
    left: 50%;
  }

  .col-md-push-5 {
    left: 41.66666667%;
  }

  .col-md-push-4 {
    left: 33.33333333%;
  }

  .col-md-push-3 {
    left: 25%;
  }

  .col-md-push-2 {
    left: 16.66666667%;
  }

  .col-md-push-1 {
    left: 8.33333333%;
  }

  .col-md-push-0 {
    left: auto;
  }

  .col-md-offset-12 {
    margin-left: 100%;
  }

  .col-md-offset-11 {
    margin-left: 91.66666667%;
  }

  .col-md-offset-10 {
    margin-left: 83.33333333%;
  }

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

  .col-md-offset-8 {
    margin-left: 66.66666667%;
  }

  .col-md-offset-7 {
    margin-left: 58.33333333%;
  }

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

  .col-md-offset-5 {
    margin-left: 41.66666667%;
  }

  .col-md-offset-4 {
    margin-left: 33.33333333%;
  }

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

  .col-md-offset-2 {
    margin-left: 16.66666667%;
  }

  .col-md-offset-1 {
    margin-left: 8.33333333%;
  }

  .col-md-offset-0 {
    margin-left: 0%;
  }
}
@media (min-width: 1200px) {
  .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12 {
    float: left;
  }

  .col-lg-12 {
    width: 100%;
  }

  .col-lg-11 {
    width: 91.66666667%;
  }

  .col-lg-10 {
    width: 83.33333333%;
  }

  .col-lg-9 {
    width: 75%;
  }

  .col-lg-8 {
    width: 66.66666667%;
  }

  .col-lg-7 {
    width: 58.33333333%;
  }

  .col-lg-6 {
    width: 50%;
  }

  .col-lg-5 {
    width: 41.66666667%;
  }

  .col-lg-4 {
    width: 33.33333333%;
  }

  .col-lg-3 {
    width: 25%;
  }

  .col-lg-2 {
    width: 16.66666667%;
  }

  .col-lg-1 {
    width: 8.33333333%;
  }

  .col-lg-pull-12 {
    right: 100%;
  }

  .col-lg-pull-11 {
    right: 91.66666667%;
  }

  .col-lg-pull-10 {
    right: 83.33333333%;
  }

  .col-lg-pull-9 {
    right: 75%;
  }

  .col-lg-pull-8 {
    right: 66.66666667%;
  }

  .col-lg-pull-7 {
    right: 58.33333333%;
  }

  .col-lg-pull-6 {
    right: 50%;
  }

  .col-lg-pull-5 {
    right: 41.66666667%;
  }

  .col-lg-pull-4 {
    right: 33.33333333%;
  }

  .col-lg-pull-3 {
    right: 25%;
  }

  .col-lg-pull-2 {
    right: 16.66666667%;
  }

  .col-lg-pull-1 {
    right: 8.33333333%;
  }

  .col-lg-pull-0 {
    right: auto;
  }

  .col-lg-push-12 {
    left: 100%;
  }

  .col-lg-push-11 {
    left: 91.66666667%;
  }

  .col-lg-push-10 {
    left: 83.33333333%;
  }

  .col-lg-push-9 {
    left: 75%;
  }

  .col-lg-push-8 {
    left: 66.66666667%;
  }

  .col-lg-push-7 {
    left: 58.33333333%;
  }

  .col-lg-push-6 {
    left: 50%;
  }

  .col-lg-push-5 {
    left: 41.66666667%;
  }

  .col-lg-push-4 {
    left: 33.33333333%;
  }

  .col-lg-push-3 {
    left: 25%;
  }

  .col-lg-push-2 {
    left: 16.66666667%;
  }

  .col-lg-push-1 {
    left: 8.33333333%;
  }

  .col-lg-push-0 {
    left: auto;
  }

  .col-lg-offset-12 {
    margin-left: 100%;
  }

  .col-lg-offset-11 {
    margin-left: 91.66666667%;
  }

  .col-lg-offset-10 {
    margin-left: 83.33333333%;
  }

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

  .col-lg-offset-8 {
    margin-left: 66.66666667%;
  }

  .col-lg-offset-7 {
    margin-left: 58.33333333%;
  }

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

  .col-lg-offset-5 {
    margin-left: 41.66666667%;
  }

  .col-lg-offset-4 {
    margin-left: 33.33333333%;
  }

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

  .col-lg-offset-2 {
    margin-left: 16.66666667%;
  }

  .col-lg-offset-1 {
    margin-left: 8.33333333%;
  }

  .col-lg-offset-0 {
    margin-left: 0%;
  }
}
.clearfix:before,
.clearfix:after,
.container:before,
.container:after,
.container-fluid:before,
.container-fluid:after,
.row:before,
.row:after {
  content: " ";
  display: table;
}

.clearfix:after,
.container:after,
.container-fluid:after,
.row:after {
  clear: both;
}

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

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

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

.hide {
  display: none !important;
}

.show {
  display: block !important;
}

.invisible {
  visibility: hidden;
}

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

.hidden {
  display: none !important;
}

.affix {
  position: fixed;
}

.visible-xs,
.visible-sm,
.visible-md,
.visible-lg {
  display: none !important;
}

.visible-xs-block,
.visible-xs-inline,
.visible-xs-inline-block,
.visible-sm-block,
.visible-sm-inline,
.visible-sm-inline-block,
.visible-md-block,
.visible-md-inline,
.visible-md-inline-block,
.visible-lg-block,
.visible-lg-inline,
.visible-lg-inline-block {
  display: none !important;
}

@media (max-width: 767px) {
  .visible-xs {
    display: block !important;
  }

  table.visible-xs {
    display: table !important;
  }

  tr.visible-xs {
    display: table-row !important;
  }

  th.visible-xs,
  td.visible-xs {
    display: table-cell !important;
  }
}
@media (max-width: 767px) {
  .visible-xs-block {
    display: block !important;
  }
}
@media (max-width: 767px) {
  .visible-xs-inline {
    display: inline !important;
  }
}
@media (max-width: 767px) {
  .visible-xs-inline-block {
    display: inline-block !important;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  .visible-sm {
    display: block !important;
  }

  table.visible-sm {
    display: table !important;
  }

  tr.visible-sm {
    display: table-row !important;
  }

  th.visible-sm,
  td.visible-sm {
    display: table-cell !important;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  .visible-sm-block {
    display: block !important;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  .visible-sm-inline {
    display: inline !important;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  .visible-sm-inline-block {
    display: inline-block !important;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  .visible-md {
    display: block !important;
  }

  table.visible-md {
    display: table !important;
  }

  tr.visible-md {
    display: table-row !important;
  }

  th.visible-md,
  td.visible-md {
    display: table-cell !important;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  .visible-md-block {
    display: block !important;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  .visible-md-inline {
    display: inline !important;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  .visible-md-inline-block {
    display: inline-block !important;
  }
}
@media (min-width: 1200px) {
  .visible-lg {
    display: block !important;
  }

  table.visible-lg {
    display: table !important;
  }

  tr.visible-lg {
    display: table-row !important;
  }

  th.visible-lg,
  td.visible-lg {
    display: table-cell !important;
  }
}
@media (min-width: 1200px) {
  .visible-lg-block {
    display: block !important;
  }
}
@media (min-width: 1200px) {
  .visible-lg-inline {
    display: inline !important;
  }
}
@media (min-width: 1200px) {
  .visible-lg-inline-block {
    display: inline-block !important;
  }
}
@media (max-width: 767px) {
  .hidden-xs {
    display: none !important;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  .hidden-sm {
    display: none !important;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  .hidden-md {
    display: none !important;
  }
}
@media (min-width: 1200px) {
  .hidden-lg {
    display: none !important;
  }
}
.visible-print {
  display: none !important;
}

@media print {
  .visible-print {
    display: block !important;
  }

  table.visible-print {
    display: table !important;
  }

  tr.visible-print {
    display: table-row !important;
  }

  th.visible-print,
  td.visible-print {
    display: table-cell !important;
  }
}
.visible-print-block {
  display: none !important;
}

@media print {
  .visible-print-block {
    display: block !important;
  }
}
.visible-print-inline {
  display: none !important;
}

@media print {
  .visible-print-inline {
    display: inline !important;
  }
}
.visible-print-inline-block {
  display: none !important;
}

@media print {
  .visible-print-inline-block {
    display: inline-block !important;
  }
}
@media print {
  .hidden-print {
    display: none !important;
  }
}
.progress {
  overflow: hidden;
  height: 20px;
  margin-bottom: 20px;
  background-color: #f5f5f5;
  border-radius: 4px;
  -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
}

.progress-bar {
  float: left;
  width: 0%;
  height: 100%;
  font-size: 12px;
  line-height: 20px;
  color: #ffffff;
  text-align: center;
  background-color: #337ab7;
  -webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
  box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
  -webkit-transition: width 0.6s ease;
  -o-transition: width 0.6s ease;
  transition: width 0.6s ease;
}

.progress-striped .progress-bar,
.progress-bar-striped {
  background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
  background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
  background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, rgba(0, 0, 0, 0) 25%, rgba(0, 0, 0, 0) 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, rgba(0, 0, 0, 0) 75%, rgba(0, 0, 0, 0));
  -webkit-background-size: 40px 40px;
  background-size: 40px 40px;
}

.progress.active .progress-bar,
.progress-bar.active {
  -webkit-animation: progress-bar-stripes 2s linear infinite;
  -o-animation: progress-bar-stripes 2s linear infinite;
  animation: progress-bar-stripes 2s linear infinite;
}

.progress-bar-success {
  background-color: #5cb85c;
}

.progress-striped .progress-bar-success {
  background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
  background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
  background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, rgba(0, 0, 0, 0) 25%, rgba(0, 0, 0, 0) 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, rgba(0, 0, 0, 0) 75%, rgba(0, 0, 0, 0));
}

.progress-bar-info {
  background-color: #5bc0de;
}

.progress-striped .progress-bar-info {
  background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
  background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
  background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, rgba(0, 0, 0, 0) 25%, rgba(0, 0, 0, 0) 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, rgba(0, 0, 0, 0) 75%, rgba(0, 0, 0, 0));
}

.progress-bar-warning {
  background-color: #f0ad4e;
}

.progress-striped .progress-bar-warning {
  background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
  background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
  background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, rgba(0, 0, 0, 0) 25%, rgba(0, 0, 0, 0) 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, rgba(0, 0, 0, 0) 75%, rgba(0, 0, 0, 0));
}

.progress-bar-danger {
  background-color: #d9534f;
}

.progress-striped .progress-bar-danger {
  background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
  background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
  background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, rgba(0, 0, 0, 0) 25%, rgba(0, 0, 0, 0) 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, rgba(0, 0, 0, 0) 75%, rgba(0, 0, 0, 0));
}

.tooltip {
  position: absolute;
  z-index: 1070;
  display: block;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-style: normal;
  font-weight: normal;
  letter-spacing: normal;
  line-break: auto;
  line-height: 1.42857143;
  text-align: left;
  text-align: start;
  text-decoration: none;
  text-shadow: none;
  text-transform: none;
  white-space: normal;
  word-break: normal;
  word-spacing: normal;
  word-wrap: normal;
  font-size: 12px;
  opacity: 0;
  filter: alpha(opacity=0);
}

.tooltip.in {
  opacity: 0.9;
  filter: alpha(opacity=90);
}

.tooltip.top {
  margin-top: -3px;
  padding: 5px 0;
}

.tooltip.right {
  margin-left: 3px;
  padding: 0 5px;
}

.tooltip.bottom {
  margin-top: 3px;
  padding: 5px 0;
}

.tooltip.left {
  margin-left: -3px;
  padding: 0 5px;
}

.tooltip-inner {
  max-width: 200px;
  padding: 3px 8px;
  color: #ffffff;
  text-align: center;
  background-color: #000000;
  border-radius: 4px;
}

.tooltip-arrow {
  position: absolute;
  width: 0;
  height: 0;
  border-color: transparent;
  border-style: solid;
}

.tooltip.top .tooltip-arrow {
  bottom: 0;
  left: 50%;
  margin-left: -5px;
  border-width: 5px 5px 0;
  border-top-color: #000000;
}

.tooltip.top-left .tooltip-arrow {
  bottom: 0;
  right: 5px;
  margin-bottom: -5px;
  border-width: 5px 5px 0;
  border-top-color: #000000;
}

.tooltip.top-right .tooltip-arrow {
  bottom: 0;
  left: 5px;
  margin-bottom: -5px;
  border-width: 5px 5px 0;
  border-top-color: #000000;
}

.tooltip.right .tooltip-arrow {
  top: 50%;
  left: 0;
  margin-top: -5px;
  border-width: 5px 5px 5px 0;
  border-right-color: #000000;
}

.tooltip.left .tooltip-arrow {
  top: 50%;
  right: 0;
  margin-top: -5px;
  border-width: 5px 0 5px 5px;
  border-left-color: #000000;
}

.tooltip.bottom .tooltip-arrow {
  top: 0;
  left: 50%;
  margin-left: -5px;
  border-width: 0 5px 5px;
  border-bottom-color: #000000;
}

.tooltip.bottom-left .tooltip-arrow {
  top: 0;
  right: 5px;
  margin-top: -5px;
  border-width: 0 5px 5px;
  border-bottom-color: #000000;
}

.tooltip.bottom-right .tooltip-arrow {
  top: 0;
  left: 5px;
  margin-top: -5px;
  border-width: 0 5px 5px;
  border-bottom-color: #000000;
}

/*********** Bootstrap ends **************/