@charset "UTF-8";
/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline; }

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block; }

body {
  line-height: 1; }

ol, ul {
  list-style: none; }

blockquote, q {
  quotes: none; }

blockquote:before, blockquote:after,
q:before, q:after {
  content: '';
  content: none; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

/*
$vw-phone: 		320 !default;
$vw-phablet: 	480 !default;
$vw-tablet: 	768 !default;
$vw-laptop: 	980 !default;
$vw-desk:		 1200 !default;
*/
/*------------------------------------*\
    $CSSWIZARDRY-GRIDS
\*------------------------------------*/
/**
 * CONTENTS
 * INTRODUCTION.........How the grid system works.
 * VARIABLES............Your settings.
 * MIXINS...............Library mixins.
 * GRID SETUP...........Build the grid structure.
 * WIDTHS...............Build our responsive widths around our breakpoints.
 * PUSH.................Push classes.
 * PULL.................Pull classes.
 */
/*------------------------------------*\
    $INTRODUCTION
\*------------------------------------*/
/**
 * csswizardry grids provides you with widths to suit a number of breakpoints
 * designed around devices of a size you specify. Out of the box, csswizardry
 * grids caters to the following types of device:
 *
 * palm     --  palm-based devices, like phones and small tablets
 * lap      --  lap-based devices, like iPads or laptops
 * portable --  all of the above
 * desk     --  stationary devices, like desktop computers
 * regular  --  any/all types of device
 *
 * These namespaces are then used in the library to give you the ability to
 * manipulate your layouts based around them, for example:
 *
   <div class="grid__item  one-whole  lap--one-half  desk--one-third">
 *
 * This would give you a grid item which is 100% width unless it is on a lap
 * device, at which point it become 50% wide, or it is on a desktop device, at
 * which point it becomes 33.333333333333333% width.
 *
 * csswizardry grids also has push and pull classes which allow you to nudge
 * grid items left and right by a defined amount. These follow the same naming
 * convention as above, but are prepended by either `push--` or `pull--`, for
 * example:
 *
   `class="grid__item  one-half  push--one-half"`
 *
 * This would give you a grid item which is 50% width and pushed over to the
 * right by 50%.
 *
 * All classes in csswizardry grids follow this patten, so you should fairly
 * quickly be able to piece together any combinations you can imagine, for
 * example:
 *
   `class="grid__item  one-whole  lap--one-half  desk--one-third  push--desk--one-third"`
 *
   `class="grid__item  one-quarter  palm--one-half  push--palm--one-half"`
 *
   `class="grid__item  palm--one-third  desk--five-twelfths"`
 */
/*------------------------------------*\
    $VARIABLES
\*------------------------------------*/
/**
 * If you are building a non-responsive site but would still like to use
 * csswizardry-grids, set this to ‘false’:
 */
/**
 * Is this build mobile first? Setting to ‘true’ means that all grids will be
 * 100% width if you do not apply a more specific class to them.
 */
/**
 * Set the spacing between your grid items.
 */
/**
 * Would you like Sass’ silent classes, or regular CSS classes?
 */
/**
 * Would you like push and pull classes enabled?
 */
/**
 * Using `inline-block` means that the grid items need their whitespace removing
 * in order for them to work correctly. Set the following to true if you are
 * going to achieve this by manually removing/commenting out any whitespace in
 * your HTML yourself.
 *
 * Setting this to false invokes a hack which cannot always be guaranteed,
 * please see the following for more detail:
 *
 * github.com/csswizardry/csswizardry-grids/commit/744d4b23c9d2b77d605b5991e54a397df72e0688
 * github.com/csswizardry/inuit.css/issues/170#issuecomment-14859371
 */
/**
 * Define your breakpoints. The first value is the prefix that shall be used for
 * your classes (e.g. `.palm--one-half`), the second value is the media query
 * that the breakpoint fires at.
 */
/**
 * Define which namespaced breakpoints you would like to generate for each of
 * widths, push and pull. This is handy if you only need pull on, say, desk, or
 * you only need a new width breakpoint at mobile sizes. It allows you to only
 * compile as much CSS as you need. All are turned on by default, but you can
 * add and remove breakpoints at will.
 *
 * Push and pull shall only be used if `$push` and/or `$pull` and `$responsive`
 * have been set to ‘true’.
 */
/**
 * You do not need to edit anything from this line onward; csswizardry-grids is
 * good to go. Happy griddin’!
 */
/*------------------------------------*\
    $MIXINS
\*------------------------------------*/
/**
 * These mixins are for the library to use only, you should not need to modify
 * them at all.
 *
 * Enclose a block of code with a media query as named in `$breakpoints`.
 */
/**
 * Drop relative positioning into silent classes which can’t take advantage of
 * the `[class*="push--"]` and `[class*="pull--"]` selectors.
 */
/*------------------------------------*\
    $GRID SETUP
\*------------------------------------*/
/**
 * 1. Allow the grid system to be used on lists.
 * 2. Remove any margins and paddings that might affect the grid system.
 * 3. Apply a negative `margin-left` to negate the columns’ gutters.
 */
.grid {
  list-style: none;
  /* [1] */
  margin: 0;
  /* [2] */
  padding: 0;
  /* [2] */
  margin-left: -10px;
  /* [3] */
  letter-spacing: -0.31em; }

/* Opera hack */
.opera:-o-prefocus,
.grid {
  word-spacing: -0.43em; }

/**
     * 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.
     */
.grid__item {
  display: inline-block;
  /* [1] */
  padding-left: 10px;
  /* [2] */
  vertical-align: top;
  /* [3] */
  width: 100%;
  /* [4] */
  /* [5] */
  /* [5] */
  box-sizing: border-box;
  /* [5] */
  letter-spacing: normal;
  word-spacing: normal; }

/**
 * Reversed grids allow you to structure your source in the opposite order to
 * how your rendered layout will appear. Extends `.grid`.
 */
.grid--rev {
  direction: rtl;
  text-align: left; }
  .grid--rev > .grid__item {
    direction: ltr;
    text-align: left; }

/**
 * Gutterless grids have all the properties of regular grids, minus any spacing.
 * Extends `.grid`.
 */
.grid--full {
  margin-left: 0; }
  .grid--full > .grid__item {
    padding-left: 0; }

/**
 * Align the entire grid to the right. Extends `.grid`.
 */
.grid--right {
  text-align: right; }
  .grid--right > .grid__item {
    text-align: left; }

/**
 * Centered grids align grid items centrally without needing to use push or pull
 * classes. Extends `.grid`.
 */
.grid--center {
  text-align: center; }
  .grid--center > .grid__item {
    text-align: left; }

/**
 * Align grid cells vertically (`.grid--middle` or `.grid--bottom`). Extends
 * `.grid`.
 */
.grid--middle > .grid__item {
  vertical-align: middle; }

.grid--bottom > .grid__item {
  vertical-align: bottom; }

/**
 * Create grids with narrower gutters. Extends `.grid`.
 */
.grid--narrow {
  margin-left: -5px; }
  .grid--narrow > .grid__item {
    padding-left: 5px; }

/**
 * Create grids with wider gutters. Extends `.grid`.
 */
.grid--wide {
  margin-left: -20px; }
  .grid--wide > .grid__item {
    padding-left: 20px; }

/*------------------------------------*\
    $WIDTHS
\*------------------------------------*/
/**
 * Create our width classes, prefixed by the specified namespace.
 */
/**
 * Our regular, non-responsive width classes.
 */
/**
     * Whole
     */
.one-whole {
  width: 100%; }

/**
     * Halves
     */
.one-half, .six-twelfths, .five-tenths, .four-eighths, .three-sixths, .two-quarters {
  width: 50%; }

/**
     * Thirds
     */
.one-third, .four-twelfths, .two-sixths {
  width: 33.333333333333333%; }

.two-thirds, .eight-twelfths, .four-sixths {
  width: 66.666666666666666%; }

/**
     * Quarters
     */
.one-quarter, .three-twelfths, .two-eighths {
  width: 25%; }

.three-quarters, .nine-twelfths, .six-eighths {
  width: 75%; }

/**
     * Fifths
     */
.one-fifth, .two-tenths {
  width: 20%; }

.two-fifths, .four-tenths {
  width: 40%; }

.three-fifths, .six-tenths {
  width: 60%; }

.four-fifths, .eight-tenths {
  width: 80%; }

/**
     * Sixths
     */
.one-sixth, .two-twelfths {
  width: 16.666666666666666%; }

.five-sixths, .ten-twelfths {
  width: 83.333333333333333%; }

/**
     * Eighths
     */
.one-eighth {
  width: 12.5%; }

.three-eighths {
  width: 37.5%; }

.five-eighths {
  width: 62.5%; }

.seven-eighths {
  width: 87.5%; }

/**
     * Tenths
     */
.one-tenth {
  width: 10%; }

.three-tenths {
  width: 30%; }

.seven-tenths {
  width: 70%; }

.nine-tenths {
  width: 90%; }

/**
     * Twelfths
     */
.one-twelfth {
  width: 8.333333333333333%; }

.five-twelfths {
  width: 41.666666666666666%; }

.seven-twelfths {
  width: 58.333333333333333%; }

.eleven-twelfths {
  width: 91.666666666666666%; }

/**
 * Our responsive classes, if we have enabled them.
 */
@media only screen and (max-width: 320px) {
  /**
     * Whole
     */
  .phone--one-whole {
    width: 100%; }
  /**
     * Halves
     */
  .phone--one-half, .phone--six-twelfths, .phone--five-tenths, .phone--four-eighths, .phone--three-sixths, .phone--two-quarters {
    width: 50%; }
  /**
     * Thirds
     */
  .phone--one-third, .phone--four-twelfths, .phone--two-sixths {
    width: 33.333333333333333%; }
  .phone--two-thirds, .phone--eight-twelfths, .phone--four-sixths {
    width: 66.666666666666666%; }
  /**
     * Quarters
     */
  .phone--one-quarter, .phone--three-twelfths, .phone--two-eighths {
    width: 25%; }
  .phone--three-quarters, .phone--nine-twelfths, .phone--six-eighths {
    width: 75%; }
  /**
     * Fifths
     */
  .phone--one-fifth, .phone--two-tenths {
    width: 20%; }
  .phone--two-fifths, .phone--four-tenths {
    width: 40%; }
  .phone--three-fifths, .phone--six-tenths {
    width: 60%; }
  .phone--four-fifths, .phone--eight-tenths {
    width: 80%; }
  /**
     * Sixths
     */
  .phone--one-sixth, .phone--two-twelfths {
    width: 16.666666666666666%; }
  .phone--five-sixths, .phone--ten-twelfths {
    width: 83.333333333333333%; }
  /**
     * Eighths
     */
  .phone--one-eighth {
    width: 12.5%; }
  .phone--three-eighths {
    width: 37.5%; }
  .phone--five-eighths {
    width: 62.5%; }
  .phone--seven-eighths {
    width: 87.5%; }
  /**
     * Tenths
     */
  .phone--one-tenth {
    width: 10%; }
  .phone--three-tenths {
    width: 30%; }
  .phone--seven-tenths {
    width: 70%; }
  .phone--nine-tenths {
    width: 90%; }
  /**
     * Twelfths
     */
  .phone--one-twelfth {
    width: 8.333333333333333%; }
  .phone--five-twelfths {
    width: 41.666666666666666%; }
  .phone--seven-twelfths {
    width: 58.333333333333333%; }
  .phone--eleven-twelfths {
    width: 91.666666666666666%; } }

@media only screen and (min-width: 320px) {
  /**
     * Whole
     */
  .phone-up--one-whole {
    width: 100%; }
  /**
     * Halves
     */
  .phone-up--one-half, .phone-up--six-twelfths, .phone-up--five-tenths, .phone-up--four-eighths, .phone-up--three-sixths, .phone-up--two-quarters {
    width: 50%; }
  /**
     * Thirds
     */
  .phone-up--one-third, .phone-up--four-twelfths, .phone-up--two-sixths {
    width: 33.333333333333333%; }
  .phone-up--two-thirds, .phone-up--eight-twelfths, .phone-up--four-sixths {
    width: 66.666666666666666%; }
  /**
     * Quarters
     */
  .phone-up--one-quarter, .phone-up--three-twelfths, .phone-up--two-eighths {
    width: 25%; }
  .phone-up--three-quarters, .phone-up--nine-twelfths, .phone-up--six-eighths {
    width: 75%; }
  /**
     * Fifths
     */
  .phone-up--one-fifth, .phone-up--two-tenths {
    width: 20%; }
  .phone-up--two-fifths, .phone-up--four-tenths {
    width: 40%; }
  .phone-up--three-fifths, .phone-up--six-tenths {
    width: 60%; }
  .phone-up--four-fifths, .phone-up--eight-tenths {
    width: 80%; }
  /**
     * Sixths
     */
  .phone-up--one-sixth, .phone-up--two-twelfths {
    width: 16.666666666666666%; }
  .phone-up--five-sixths, .phone-up--ten-twelfths {
    width: 83.333333333333333%; }
  /**
     * Eighths
     */
  .phone-up--one-eighth {
    width: 12.5%; }
  .phone-up--three-eighths {
    width: 37.5%; }
  .phone-up--five-eighths {
    width: 62.5%; }
  .phone-up--seven-eighths {
    width: 87.5%; }
  /**
     * Tenths
     */
  .phone-up--one-tenth {
    width: 10%; }
  .phone-up--three-tenths {
    width: 30%; }
  .phone-up--seven-tenths {
    width: 70%; }
  .phone-up--nine-tenths {
    width: 90%; }
  /**
     * Twelfths
     */
  .phone-up--one-twelfth {
    width: 8.333333333333333%; }
  .phone-up--five-twelfths {
    width: 41.666666666666666%; }
  .phone-up--seven-twelfths {
    width: 58.333333333333333%; }
  .phone-up--eleven-twelfths {
    width: 91.666666666666666%; } }

@media only screen and (min-width: 321px) and (max-width: 480px) {
  /**
     * Whole
     */
  .phablet--one-whole {
    width: 100%; }
  /**
     * Halves
     */
  .phablet--one-half, .phablet--six-twelfths, .phablet--five-tenths, .phablet--four-eighths, .phablet--three-sixths, .phablet--two-quarters {
    width: 50%; }
  /**
     * Thirds
     */
  .phablet--one-third, .phablet--four-twelfths, .phablet--two-sixths {
    width: 33.333333333333333%; }
  .phablet--two-thirds, .phablet--eight-twelfths, .phablet--four-sixths {
    width: 66.666666666666666%; }
  /**
     * Quarters
     */
  .phablet--one-quarter, .phablet--three-twelfths, .phablet--two-eighths {
    width: 25%; }
  .phablet--three-quarters, .phablet--nine-twelfths, .phablet--six-eighths {
    width: 75%; }
  /**
     * Fifths
     */
  .phablet--one-fifth, .phablet--two-tenths {
    width: 20%; }
  .phablet--two-fifths, .phablet--four-tenths {
    width: 40%; }
  .phablet--three-fifths, .phablet--six-tenths {
    width: 60%; }
  .phablet--four-fifths, .phablet--eight-tenths {
    width: 80%; }
  /**
     * Sixths
     */
  .phablet--one-sixth, .phablet--two-twelfths {
    width: 16.666666666666666%; }
  .phablet--five-sixths, .phablet--ten-twelfths {
    width: 83.333333333333333%; }
  /**
     * Eighths
     */
  .phablet--one-eighth {
    width: 12.5%; }
  .phablet--three-eighths {
    width: 37.5%; }
  .phablet--five-eighths {
    width: 62.5%; }
  .phablet--seven-eighths {
    width: 87.5%; }
  /**
     * Tenths
     */
  .phablet--one-tenth {
    width: 10%; }
  .phablet--three-tenths {
    width: 30%; }
  .phablet--seven-tenths {
    width: 70%; }
  .phablet--nine-tenths {
    width: 90%; }
  /**
     * Twelfths
     */
  .phablet--one-twelfth {
    width: 8.333333333333333%; }
  .phablet--five-twelfths {
    width: 41.666666666666666%; }
  .phablet--seven-twelfths {
    width: 58.333333333333333%; }
  .phablet--eleven-twelfths {
    width: 91.666666666666666%; } }

@media only screen and (min-width: 480px) {
  /**
     * Whole
     */
  .phablet-up--one-whole {
    width: 100%; }
  /**
     * Halves
     */
  .phablet-up--one-half, .phablet-up--six-twelfths, .phablet-up--five-tenths, .phablet-up--four-eighths, .phablet-up--three-sixths, .phablet-up--two-quarters {
    width: 50%; }
  /**
     * Thirds
     */
  .phablet-up--one-third, .phablet-up--four-twelfths, .phablet-up--two-sixths {
    width: 33.333333333333333%; }
  .phablet-up--two-thirds, .phablet-up--eight-twelfths, .phablet-up--four-sixths {
    width: 66.666666666666666%; }
  /**
     * Quarters
     */
  .phablet-up--one-quarter, .phablet-up--three-twelfths, .phablet-up--two-eighths {
    width: 25%; }
  .phablet-up--three-quarters, .phablet-up--nine-twelfths, .phablet-up--six-eighths {
    width: 75%; }
  /**
     * Fifths
     */
  .phablet-up--one-fifth, .phablet-up--two-tenths {
    width: 20%; }
  .phablet-up--two-fifths, .phablet-up--four-tenths {
    width: 40%; }
  .phablet-up--three-fifths, .phablet-up--six-tenths {
    width: 60%; }
  .phablet-up--four-fifths, .phablet-up--eight-tenths {
    width: 80%; }
  /**
     * Sixths
     */
  .phablet-up--one-sixth, .phablet-up--two-twelfths {
    width: 16.666666666666666%; }
  .phablet-up--five-sixths, .phablet-up--ten-twelfths {
    width: 83.333333333333333%; }
  /**
     * Eighths
     */
  .phablet-up--one-eighth {
    width: 12.5%; }
  .phablet-up--three-eighths {
    width: 37.5%; }
  .phablet-up--five-eighths {
    width: 62.5%; }
  .phablet-up--seven-eighths {
    width: 87.5%; }
  /**
     * Tenths
     */
  .phablet-up--one-tenth {
    width: 10%; }
  .phablet-up--three-tenths {
    width: 30%; }
  .phablet-up--seven-tenths {
    width: 70%; }
  .phablet-up--nine-tenths {
    width: 90%; }
  /**
     * Twelfths
     */
  .phablet-up--one-twelfth {
    width: 8.333333333333333%; }
  .phablet-up--five-twelfths {
    width: 41.666666666666666%; }
  .phablet-up--seven-twelfths {
    width: 58.333333333333333%; }
  .phablet-up--eleven-twelfths {
    width: 91.666666666666666%; } }

@media only screen and (min-width: 481px) and (max-width: 768px) {
  /**
     * Whole
     */
  .tablet--one-whole {
    width: 100%; }
  /**
     * Halves
     */
  .tablet--one-half, .tablet--six-twelfths, .tablet--five-tenths, .tablet--four-eighths, .tablet--three-sixths, .tablet--two-quarters {
    width: 50%; }
  /**
     * Thirds
     */
  .tablet--one-third, .tablet--four-twelfths, .tablet--two-sixths {
    width: 33.333333333333333%; }
  .tablet--two-thirds, .tablet--eight-twelfths, .tablet--four-sixths {
    width: 66.666666666666666%; }
  /**
     * Quarters
     */
  .tablet--one-quarter, .tablet--three-twelfths, .tablet--two-eighths {
    width: 25%; }
  .tablet--three-quarters, .tablet--nine-twelfths, .tablet--six-eighths {
    width: 75%; }
  /**
     * Fifths
     */
  .tablet--one-fifth, .tablet--two-tenths {
    width: 20%; }
  .tablet--two-fifths, .tablet--four-tenths {
    width: 40%; }
  .tablet--three-fifths, .tablet--six-tenths {
    width: 60%; }
  .tablet--four-fifths, .tablet--eight-tenths {
    width: 80%; }
  /**
     * Sixths
     */
  .tablet--one-sixth, .tablet--two-twelfths {
    width: 16.666666666666666%; }
  .tablet--five-sixths, .tablet--ten-twelfths {
    width: 83.333333333333333%; }
  /**
     * Eighths
     */
  .tablet--one-eighth {
    width: 12.5%; }
  .tablet--three-eighths {
    width: 37.5%; }
  .tablet--five-eighths {
    width: 62.5%; }
  .tablet--seven-eighths {
    width: 87.5%; }
  /**
     * Tenths
     */
  .tablet--one-tenth {
    width: 10%; }
  .tablet--three-tenths {
    width: 30%; }
  .tablet--seven-tenths {
    width: 70%; }
  .tablet--nine-tenths {
    width: 90%; }
  /**
     * Twelfths
     */
  .tablet--one-twelfth {
    width: 8.333333333333333%; }
  .tablet--five-twelfths {
    width: 41.666666666666666%; }
  .tablet--seven-twelfths {
    width: 58.333333333333333%; }
  .tablet--eleven-twelfths {
    width: 91.666666666666666%; } }

@media only screen and (min-width: 768px) {
  /**
     * Whole
     */
  .tablet-up--one-whole {
    width: 100%; }
  /**
     * Halves
     */
  .tablet-up--one-half, .tablet-up--six-twelfths, .tablet-up--five-tenths, .tablet-up--four-eighths, .tablet-up--three-sixths, .tablet-up--two-quarters {
    width: 50%; }
  /**
     * Thirds
     */
  .tablet-up--one-third, .tablet-up--four-twelfths, .tablet-up--two-sixths {
    width: 33.333333333333333%; }
  .tablet-up--two-thirds, .tablet-up--eight-twelfths, .tablet-up--four-sixths {
    width: 66.666666666666666%; }
  /**
     * Quarters
     */
  .tablet-up--one-quarter, .tablet-up--three-twelfths, .tablet-up--two-eighths {
    width: 25%; }
  .tablet-up--three-quarters, .tablet-up--nine-twelfths, .tablet-up--six-eighths {
    width: 75%; }
  /**
     * Fifths
     */
  .tablet-up--one-fifth, .tablet-up--two-tenths {
    width: 20%; }
  .tablet-up--two-fifths, .tablet-up--four-tenths {
    width: 40%; }
  .tablet-up--three-fifths, .tablet-up--six-tenths {
    width: 60%; }
  .tablet-up--four-fifths, .tablet-up--eight-tenths {
    width: 80%; }
  /**
     * Sixths
     */
  .tablet-up--one-sixth, .tablet-up--two-twelfths {
    width: 16.666666666666666%; }
  .tablet-up--five-sixths, .tablet-up--ten-twelfths {
    width: 83.333333333333333%; }
  /**
     * Eighths
     */
  .tablet-up--one-eighth {
    width: 12.5%; }
  .tablet-up--three-eighths {
    width: 37.5%; }
  .tablet-up--five-eighths {
    width: 62.5%; }
  .tablet-up--seven-eighths {
    width: 87.5%; }
  /**
     * Tenths
     */
  .tablet-up--one-tenth {
    width: 10%; }
  .tablet-up--three-tenths {
    width: 30%; }
  .tablet-up--seven-tenths {
    width: 70%; }
  .tablet-up--nine-tenths {
    width: 90%; }
  /**
     * Twelfths
     */
  .tablet-up--one-twelfth {
    width: 8.333333333333333%; }
  .tablet-up--five-twelfths {
    width: 41.666666666666666%; }
  .tablet-up--seven-twelfths {
    width: 58.333333333333333%; }
  .tablet-up--eleven-twelfths {
    width: 91.666666666666666%; } }

@media only screen and (min-width: 769px) and (max-width: 980px) {
  /**
     * Whole
     */
  .laptop--one-whole {
    width: 100%; }
  /**
     * Halves
     */
  .laptop--one-half, .laptop--six-twelfths, .laptop--five-tenths, .laptop--four-eighths, .laptop--three-sixths, .laptop--two-quarters {
    width: 50%; }
  /**
     * Thirds
     */
  .laptop--one-third, .laptop--four-twelfths, .laptop--two-sixths {
    width: 33.333333333333333%; }
  .laptop--two-thirds, .laptop--eight-twelfths, .laptop--four-sixths {
    width: 66.666666666666666%; }
  /**
     * Quarters
     */
  .laptop--one-quarter, .laptop--three-twelfths, .laptop--two-eighths {
    width: 25%; }
  .laptop--three-quarters, .laptop--nine-twelfths, .laptop--six-eighths {
    width: 75%; }
  /**
     * Fifths
     */
  .laptop--one-fifth, .laptop--two-tenths {
    width: 20%; }
  .laptop--two-fifths, .laptop--four-tenths {
    width: 40%; }
  .laptop--three-fifths, .laptop--six-tenths {
    width: 60%; }
  .laptop--four-fifths, .laptop--eight-tenths {
    width: 80%; }
  /**
     * Sixths
     */
  .laptop--one-sixth, .laptop--two-twelfths {
    width: 16.666666666666666%; }
  .laptop--five-sixths, .laptop--ten-twelfths {
    width: 83.333333333333333%; }
  /**
     * Eighths
     */
  .laptop--one-eighth {
    width: 12.5%; }
  .laptop--three-eighths {
    width: 37.5%; }
  .laptop--five-eighths {
    width: 62.5%; }
  .laptop--seven-eighths {
    width: 87.5%; }
  /**
     * Tenths
     */
  .laptop--one-tenth {
    width: 10%; }
  .laptop--three-tenths {
    width: 30%; }
  .laptop--seven-tenths {
    width: 70%; }
  .laptop--nine-tenths {
    width: 90%; }
  /**
     * Twelfths
     */
  .laptop--one-twelfth {
    width: 8.333333333333333%; }
  .laptop--five-twelfths {
    width: 41.666666666666666%; }
  .laptop--seven-twelfths {
    width: 58.333333333333333%; }
  .laptop--eleven-twelfths {
    width: 91.666666666666666%; } }

@media only screen and (min-width: 980px) {
  /**
     * Whole
     */
  .laptop-up--one-whole {
    width: 100%; }
  /**
     * Halves
     */
  .laptop-up--one-half, .laptop-up--six-twelfths, .laptop-up--five-tenths, .laptop-up--four-eighths, .laptop-up--three-sixths, .laptop-up--two-quarters {
    width: 50%; }
  /**
     * Thirds
     */
  .laptop-up--one-third, .laptop-up--four-twelfths, .laptop-up--two-sixths {
    width: 33.333333333333333%; }
  .laptop-up--two-thirds, .laptop-up--eight-twelfths, .laptop-up--four-sixths {
    width: 66.666666666666666%; }
  /**
     * Quarters
     */
  .laptop-up--one-quarter, .laptop-up--three-twelfths, .laptop-up--two-eighths {
    width: 25%; }
  .laptop-up--three-quarters, .laptop-up--nine-twelfths, .laptop-up--six-eighths {
    width: 75%; }
  /**
     * Fifths
     */
  .laptop-up--one-fifth, .laptop-up--two-tenths {
    width: 20%; }
  .laptop-up--two-fifths, .laptop-up--four-tenths {
    width: 40%; }
  .laptop-up--three-fifths, .laptop-up--six-tenths {
    width: 60%; }
  .laptop-up--four-fifths, .laptop-up--eight-tenths {
    width: 80%; }
  /**
     * Sixths
     */
  .laptop-up--one-sixth, .laptop-up--two-twelfths {
    width: 16.666666666666666%; }
  .laptop-up--five-sixths, .laptop-up--ten-twelfths {
    width: 83.333333333333333%; }
  /**
     * Eighths
     */
  .laptop-up--one-eighth {
    width: 12.5%; }
  .laptop-up--three-eighths {
    width: 37.5%; }
  .laptop-up--five-eighths {
    width: 62.5%; }
  .laptop-up--seven-eighths {
    width: 87.5%; }
  /**
     * Tenths
     */
  .laptop-up--one-tenth {
    width: 10%; }
  .laptop-up--three-tenths {
    width: 30%; }
  .laptop-up--seven-tenths {
    width: 70%; }
  .laptop-up--nine-tenths {
    width: 90%; }
  /**
     * Twelfths
     */
  .laptop-up--one-twelfth {
    width: 8.333333333333333%; }
  .laptop-up--five-twelfths {
    width: 41.666666666666666%; }
  .laptop-up--seven-twelfths {
    width: 58.333333333333333%; }
  .laptop-up--eleven-twelfths {
    width: 91.666666666666666%; } }

@media only screen and (min-width: 769px) and (max-width: 980px) {
  /**
     * Whole
     */
  .desk--one-whole {
    width: 100%; }
  /**
     * Halves
     */
  .desk--one-half, .desk--six-twelfths, .desk--five-tenths, .desk--four-eighths, .desk--three-sixths, .desk--two-quarters {
    width: 50%; }
  /**
     * Thirds
     */
  .desk--one-third, .desk--four-twelfths, .desk--two-sixths {
    width: 33.333333333333333%; }
  .desk--two-thirds, .desk--eight-twelfths, .desk--four-sixths {
    width: 66.666666666666666%; }
  /**
     * Quarters
     */
  .desk--one-quarter, .desk--three-twelfths, .desk--two-eighths {
    width: 25%; }
  .desk--three-quarters, .desk--nine-twelfths, .desk--six-eighths {
    width: 75%; }
  /**
     * Fifths
     */
  .desk--one-fifth, .desk--two-tenths {
    width: 20%; }
  .desk--two-fifths, .desk--four-tenths {
    width: 40%; }
  .desk--three-fifths, .desk--six-tenths {
    width: 60%; }
  .desk--four-fifths, .desk--eight-tenths {
    width: 80%; }
  /**
     * Sixths
     */
  .desk--one-sixth, .desk--two-twelfths {
    width: 16.666666666666666%; }
  .desk--five-sixths, .desk--ten-twelfths {
    width: 83.333333333333333%; }
  /**
     * Eighths
     */
  .desk--one-eighth {
    width: 12.5%; }
  .desk--three-eighths {
    width: 37.5%; }
  .desk--five-eighths {
    width: 62.5%; }
  .desk--seven-eighths {
    width: 87.5%; }
  /**
     * Tenths
     */
  .desk--one-tenth {
    width: 10%; }
  .desk--three-tenths {
    width: 30%; }
  .desk--seven-tenths {
    width: 70%; }
  .desk--nine-tenths {
    width: 90%; }
  /**
     * Twelfths
     */
  .desk--one-twelfth {
    width: 8.333333333333333%; }
  .desk--five-twelfths {
    width: 41.666666666666666%; }
  .desk--seven-twelfths {
    width: 58.333333333333333%; }
  .desk--eleven-twelfths {
    width: 91.666666666666666%; } }

@media only screen and (min-width: 1200px) {
  /**
     * Whole
     */
  .desk-up--one-whole {
    width: 100%; }
  /**
     * Halves
     */
  .desk-up--one-half, .desk-up--six-twelfths, .desk-up--five-tenths, .desk-up--four-eighths, .desk-up--three-sixths, .desk-up--two-quarters {
    width: 50%; }
  /**
     * Thirds
     */
  .desk-up--one-third, .desk-up--four-twelfths, .desk-up--two-sixths {
    width: 33.333333333333333%; }
  .desk-up--two-thirds, .desk-up--eight-twelfths, .desk-up--four-sixths {
    width: 66.666666666666666%; }
  /**
     * Quarters
     */
  .desk-up--one-quarter, .desk-up--three-twelfths, .desk-up--two-eighths {
    width: 25%; }
  .desk-up--three-quarters, .desk-up--nine-twelfths, .desk-up--six-eighths {
    width: 75%; }
  /**
     * Fifths
     */
  .desk-up--one-fifth, .desk-up--two-tenths {
    width: 20%; }
  .desk-up--two-fifths, .desk-up--four-tenths {
    width: 40%; }
  .desk-up--three-fifths, .desk-up--six-tenths {
    width: 60%; }
  .desk-up--four-fifths, .desk-up--eight-tenths {
    width: 80%; }
  /**
     * Sixths
     */
  .desk-up--one-sixth, .desk-up--two-twelfths {
    width: 16.666666666666666%; }
  .desk-up--five-sixths, .desk-up--ten-twelfths {
    width: 83.333333333333333%; }
  /**
     * Eighths
     */
  .desk-up--one-eighth {
    width: 12.5%; }
  .desk-up--three-eighths {
    width: 37.5%; }
  .desk-up--five-eighths {
    width: 62.5%; }
  .desk-up--seven-eighths {
    width: 87.5%; }
  /**
     * Tenths
     */
  .desk-up--one-tenth {
    width: 10%; }
  .desk-up--three-tenths {
    width: 30%; }
  .desk-up--seven-tenths {
    width: 70%; }
  .desk-up--nine-tenths {
    width: 90%; }
  /**
     * Twelfths
     */
  .desk-up--one-twelfth {
    width: 8.333333333333333%; }
  .desk-up--five-twelfths {
    width: 41.666666666666666%; }
  .desk-up--seven-twelfths {
    width: 58.333333333333333%; }
  .desk-up--eleven-twelfths {
    width: 91.666666666666666%; } }

/*------------------------------------*\
    $PUSH
\*------------------------------------*/
/**
 * Push classes, to move grid items over to the right by certain amounts.
 */
/*------------------------------------*\
    $PULL
\*------------------------------------*/
/**
 * Pull classes, to move grid items back to the left by certain amounts.
 */
/**
 * Add "--none" after a device name to hide it.
 * Use [device name]--center to center an element.
 * Use [device name]--only to only show it in that device width
 * NOTE: If $use-silent-classes: true; then use @extend. E.g. @extend %palm--only;
 */
@media only screen and (max-width: 320px) {
  .phone--only {
    display: inline-block !important; }
  .phone--only-block {
    display: block !important; }
  .phone--none {
    display: none; }
  .phone--center {
    display: block;
    margin: auto; }
  .phone-up--only {
    display: none; }
  .phone-up--only-block {
    display: none; }
  .phablet--only {
    display: none; }
  .phablet--only-block {
    display: none; }
  .phablet-up--only {
    display: none; }
  .phablet-up--only-block {
    display: none; }
  .tablet--only {
    display: none; }
  .tablet--only-block {
    display: none; }
  .tablet-up--only {
    display: none; }
  .tablet-up--only-block {
    display: none; }
  .laptop--only {
    display: none; }
  .laptop--only-block {
    display: none; }
  .laptop-up--only {
    display: none; }
  .laptop-up--only-block {
    display: none; }
  .desk--only {
    display: none; }
  .desk--only-block {
    display: none; }
  .desk-up--only {
    display: none; }
  .desk-up--only-block {
    display: none; } }

@media only screen and (min-width: 320px) {
  .phone-up--only {
    display: inline-block !important; }
  .phone-up--only-block {
    display: block !important; }
  .phone-up--none {
    display: none; }
  .phone-up--center {
    display: block;
    margin: auto; }
  .phone--only {
    display: none; }
  .phone--only-block {
    display: none; }
  .phablet--only {
    display: none; }
  .phablet--only-block {
    display: none; }
  .phablet-up--only {
    display: none; }
  .phablet-up--only-block {
    display: none; }
  .tablet--only {
    display: none; }
  .tablet--only-block {
    display: none; }
  .tablet-up--only {
    display: none; }
  .tablet-up--only-block {
    display: none; }
  .laptop--only {
    display: none; }
  .laptop--only-block {
    display: none; }
  .laptop-up--only {
    display: none; }
  .laptop-up--only-block {
    display: none; }
  .desk--only {
    display: none; }
  .desk--only-block {
    display: none; }
  .desk-up--only {
    display: none; }
  .desk-up--only-block {
    display: none; } }

@media only screen and (min-width: 321px) and (max-width: 480px) {
  .phablet--only {
    display: inline-block !important; }
  .phablet--only-block {
    display: block !important; }
  .phablet--none {
    display: none; }
  .phablet--center {
    display: block;
    margin: auto; }
  .phone--only {
    display: none; }
  .phone--only-block {
    display: none; }
  .phone-up--only {
    display: none; }
  .phone-up--only-block {
    display: none; }
  .phablet-up--only {
    display: none; }
  .phablet-up--only-block {
    display: none; }
  .tablet--only {
    display: none; }
  .tablet--only-block {
    display: none; }
  .tablet-up--only {
    display: none; }
  .tablet-up--only-block {
    display: none; }
  .laptop--only {
    display: none; }
  .laptop--only-block {
    display: none; }
  .laptop-up--only {
    display: none; }
  .laptop-up--only-block {
    display: none; }
  .desk--only {
    display: none; }
  .desk--only-block {
    display: none; }
  .desk-up--only {
    display: none; }
  .desk-up--only-block {
    display: none; } }

@media only screen and (min-width: 480px) {
  .phablet-up--only {
    display: inline-block !important; }
  .phablet-up--only-block {
    display: block !important; }
  .phablet-up--none {
    display: none; }
  .phablet-up--center {
    display: block;
    margin: auto; }
  .phone--only {
    display: none; }
  .phone--only-block {
    display: none; }
  .phone-up--only {
    display: none; }
  .phone-up--only-block {
    display: none; }
  .phablet--only {
    display: none; }
  .phablet--only-block {
    display: none; }
  .tablet--only {
    display: none; }
  .tablet--only-block {
    display: none; }
  .tablet-up--only {
    display: none; }
  .tablet-up--only-block {
    display: none; }
  .laptop--only {
    display: none; }
  .laptop--only-block {
    display: none; }
  .laptop-up--only {
    display: none; }
  .laptop-up--only-block {
    display: none; }
  .desk--only {
    display: none; }
  .desk--only-block {
    display: none; }
  .desk-up--only {
    display: none; }
  .desk-up--only-block {
    display: none; } }

@media only screen and (min-width: 481px) and (max-width: 768px) {
  .tablet--only {
    display: inline-block !important; }
  .tablet--only-block {
    display: block !important; }
  .tablet--none {
    display: none; }
  .tablet--center {
    display: block;
    margin: auto; }
  .phone--only {
    display: none; }
  .phone--only-block {
    display: none; }
  .phone-up--only {
    display: none; }
  .phone-up--only-block {
    display: none; }
  .phablet--only {
    display: none; }
  .phablet--only-block {
    display: none; }
  .phablet-up--only {
    display: none; }
  .phablet-up--only-block {
    display: none; }
  .tablet-up--only {
    display: none; }
  .tablet-up--only-block {
    display: none; }
  .laptop--only {
    display: none; }
  .laptop--only-block {
    display: none; }
  .laptop-up--only {
    display: none; }
  .laptop-up--only-block {
    display: none; }
  .desk--only {
    display: none; }
  .desk--only-block {
    display: none; }
  .desk-up--only {
    display: none; }
  .desk-up--only-block {
    display: none; } }

@media only screen and (min-width: 768px) {
  .tablet-up--only {
    display: inline-block !important; }
  .tablet-up--only-block {
    display: block !important; }
  .tablet-up--none {
    display: none; }
  .tablet-up--center {
    display: block;
    margin: auto; }
  .phone--only {
    display: none; }
  .phone--only-block {
    display: none; }
  .phone-up--only {
    display: none; }
  .phone-up--only-block {
    display: none; }
  .phablet--only {
    display: none; }
  .phablet--only-block {
    display: none; }
  .phablet-up--only {
    display: none; }
  .phablet-up--only-block {
    display: none; }
  .tablet--only {
    display: none; }
  .tablet--only-block {
    display: none; }
  .laptop--only {
    display: none; }
  .laptop--only-block {
    display: none; }
  .laptop-up--only {
    display: none; }
  .laptop-up--only-block {
    display: none; }
  .desk--only {
    display: none; }
  .desk--only-block {
    display: none; }
  .desk-up--only {
    display: none; }
  .desk-up--only-block {
    display: none; } }

@media only screen and (min-width: 980px) {
  .laptop-up--only {
    display: inline-block !important; }
  .laptop-up--only-block {
    display: block !important; }
  .laptop-up--none {
    display: none; }
  .laptop-up--center {
    display: block;
    margin: auto; }
  .phone--only {
    display: none; }
  .phone--only-block {
    display: none; }
  .phone-up--only {
    display: none; }
  .phone-up--only-block {
    display: none; }
  .phablet--only {
    display: none; }
  .phablet--only-block {
    display: none; }
  .phablet-up--only {
    display: none; }
  .phablet-up--only-block {
    display: none; }
  .tablet--only {
    display: none; }
  .tablet--only-block {
    display: none; }
  .tablet-up--only {
    display: none; }
  .tablet-up--only-block {
    display: none; }
  .laptop--only {
    display: none; }
  .laptop--only-block {
    display: none; }
  .desk--only {
    display: none; }
  .desk--only-block {
    display: none; }
  .desk-up--only {
    display: none; }
  .desk-up--only-block {
    display: none; } }

@media only screen and (min-width: 769px) and (max-width: 980px) {
  .desk--only {
    display: inline-block !important; }
  .desk--only-block {
    display: block !important; }
  .desk--none {
    display: none; }
  .desk--center {
    display: block;
    margin: auto; }
  .phone--only {
    display: none; }
  .phone--only-block {
    display: none; }
  .phone-up--only {
    display: none; }
  .phone-up--only-block {
    display: none; }
  .phablet--only {
    display: none; }
  .phablet--only-block {
    display: none; }
  .phablet-up--only {
    display: none; }
  .phablet-up--only-block {
    display: none; }
  .tablet--only {
    display: none; }
  .tablet--only-block {
    display: none; }
  .tablet-up--only {
    display: none; }
  .tablet-up--only-block {
    display: none; }
  .laptop--only {
    display: none; }
  .laptop--only-block {
    display: none; }
  .laptop-up--only {
    display: none; }
  .laptop-up--only-block {
    display: none; }
  .desk-up--only {
    display: none; }
  .desk-up--only-block {
    display: none; } }

@media only screen and (min-width: 1200px) {
  .desk-up--only {
    display: inline-block !important; }
  .desk-up--only-block {
    display: block !important; }
  .desk-up--none {
    display: none; }
  .desk-up--center {
    display: block;
    margin: auto; }
  .phone--only {
    display: none; }
  .phone--only-block {
    display: none; }
  .phone-up--only {
    display: none; }
  .phone-up--only-block {
    display: none; }
  .phablet--only {
    display: none; }
  .phablet--only-block {
    display: none; }
  .phablet-up--only {
    display: none; }
  .phablet-up--only-block {
    display: none; }
  .tablet--only {
    display: none; }
  .tablet--only-block {
    display: none; }
  .tablet-up--only {
    display: none; }
  .tablet-up--only-block {
    display: none; }
  .laptop--only {
    display: none; }
  .laptop--only-block {
    display: none; }
  .laptop-up--only {
    display: none; }
  .laptop-up--only-block {
    display: none; }
  .desk--only {
    display: none; }
  .desk--only-block {
    display: none; } }

/* -----------------------------------
 * Slidebars
 * Version 0.10.2
 * http://plugins.adchsm.me/slidebars/
 *
 * Written by Adam Smith
 * http://www.adchsm.me/
 *
 * Released under MIT License
 * http://plugins.adchsm.me/slidebars/license.txt
 *
 * -------------------
 * Slidebars CSS Index
 *
 * 001 - Box Model, Html & Body
 * 002 - Site
 * 003 - Slidebars
 * 004 - Animation
 * 005 - Helper Classes
 *
 * ----------------------------
 * 001 - Box Model, Html & Body
 */
html, body, #sb-site, .sb-site-container, .sb-slidebar {
  /* Set box model to prevent any user added margins or paddings from altering the widths or heights. */
  margin: 0;
  padding: 0;
  box-sizing: border-box; }

html, body {
  width: 100%; }

html {
  height: 100%;
  /* Site is as tall as device. */ }

body {
  min-height: 100%;
  height: auto;
  position: relative;
  /* Required for static Slidebars to function properly. */ }

/* Site scroll locking - prevent site from scrolling when a Slidebar is open, except when static Slidebars are only available. */
html.sb-scroll-lock.sb-active:not(.sb-static) {
  overflow: hidden; }

/* ----------
 * 002 - Site
 */
#sb-site, .sb-site-container {
  /* You may now use class .sb-site-container instead of #sb-site and use your own id. However please make sure you don't set any of the following styles any differently on your id. */
  width: 100%;
  position: relative;
  z-index: 1;
  /* Site sits above Slidebars */
  background-color: #ffffff;
  /* Default background colour, overwrite this with your own css. I suggest moving your html or body background styling here. Making this transparent will allow the Slidebars beneath to be visible. */ }

/* ---------------
 * 003 - Slidebars
 */
.sb-slidebar {
  height: 100%;
  overflow-y: auto;
  /* Enable vertical scrolling on Slidebars when needed. */
  position: fixed;
  top: 0;
  z-index: 0;
  /* Slidebars sit behind sb-site. */
  display: none;
  /* Initially hide the Slidebars. Changed from visibility to display to allow -webkit-overflow-scrolling. */
  background-color: #222222;
  /* Default Slidebars background colour, overwrite this with your own css. */
  -webkit-transform: translate(0px);
  /* Fixes issues with translated and z-indexed elements on iOS 7. */ }

.sb-left {
  left: 0;
  /* Set Slidebar to the left. */ }

.sb-right {
  right: 0;
  /* Set Slidebar to the right. */ }

html.sb-static .sb-slidebar,
.sb-slidebar.sb-static {
  position: absolute;
  /* Makes Slidebars scroll naturally with the site, and unfixes them for Android Browser < 3 and iOS < 5. */ }

.sb-slidebar.sb-active {
  display: block;
  /* Makes Slidebars visibile when open. Changed from visibility to display to allow -webkit-overflow-scrolling. */ }

.sb-style-overlay {
  z-index: 9999;
  /* Set z-index high to ensure it overlays any other site elements. */ }

.sb-momentum-scrolling {
  -webkit-overflow-scrolling: touch;
  /* Adds native momentum scrolling for iOS & Android devices. */ }

/* Slidebar widths for browsers/devices that don't support media queries. */
.sb-slidebar {
  width: 30%; }

.sb-width-thin {
  width: 15%; }

.sb-width-wide {
  width: 45%; }

@media (max-width: 480px) {
  /* Slidebar widths on extra small screens. */
  .sb-slidebar {
    width: 70%; }
  .sb-width-thin {
    width: 55%; }
  .sb-width-wide {
    width: 85%; } }

@media (min-width: 481px) {
  /* Slidebar widths on small screens. */
  .sb-slidebar {
    width: 55%; }
  .sb-width-thin {
    width: 40%; }
  .sb-width-wide {
    width: 70%; } }

@media (min-width: 768px) {
  /* Slidebar widths on medium screens. */
  .sb-slidebar {
    width: 40%; }
  .sb-width-thin {
    width: 25%; }
  .sb-width-wide {
    width: 55%; } }

@media (min-width: 992px) {
  /* Slidebar widths on large screens. */
  .sb-slidebar {
    width: 30%; }
  .sb-width-thin {
    width: 15%; }
  .sb-width-wide {
    width: 45%; } }

@media (min-width: 1200px) {
  /* Slidebar widths on extra large screens. */
  .sb-slidebar {
    width: 20%; }
  .sb-width-thin {
    width: 5%; }
  .sb-width-wide {
    width: 35%; } }

/* ---------------
 * 004 - Animation
 */
.sb-slide, #sb-site, .sb-site-container, .sb-slidebar {
  transition: transform 400ms ease;
  -webkit-transition-property: -webkit-transform, left, right;
  /* Add left/right for Android < 4.4. */
  -webkit-backface-visibility: hidden;
  /* Prevents flickering. This is non essential, and you may remove it if your having problems with fixed background images in Chrome. */ }

/* --------------------
 * 005 - Helper Classes
 */
.sb-hide {
  display: none;
  /* Optionally applied to control classes when Slidebars is disabled over a certain width. */ }

.white, .white a, .white li {
  color: #ffffff; }

.pink {
  color: #cc0846; }

.brown {
  color: #302a21; }

::-moz-selection {
  background: #000000;
  color: #ffffff; }

::selection {
  background: #000000;
  color: #ffffff; }

body.about .s3 a, .continue-exploring div a, section > div.w .tabs a, .button {
  display: block;
  padding: 12px;
  border: 1px solid #ffffff;
  color: #ffffff;
  text-decoration: none;
  text-align: center;
  transition: all 0.2s; }

.fs-s, .fs-s > * {
  font-size: 11px; }

.fs-m, .fs-m > * {
  font-size: 14px; }

.fs-l, .fs-l > * {
  font-size: 16px; }

.fs-xl, .fs-xl > * {
  font-size: 24px; }

.fs-xxl, .fs-xxl > * {
  font-size: 36px; }

.fs-xxxl, .fs-xxxl > * {
  font-size: 36px; }

@media only screen and (min-width: 480px) {
  .fs-xxxl, .fs-xxxl > * {
    font-size: 66px; } }

body, input, textarea, select, button, a, td, li, ol, ul {
  color: #000000;
  font-family: "Montserrat", "Open Sans", Helvetica, Arial, sans-serif;
  font-size: 14px;
  line-height: 1.2;
  font-weight: 300; }

.dontsplit {
  display: inline;
  white-space: nowrap;
  margin: 0;
  padding: 0; }

strong {
  font-weight: 600; }

.content p {
  max-width: 750px; }

.content ul {
  list-style: disc; }
  .content ul li {
    margin-bottom: 0.5em;
    padding-left: 0.25em;
    margin-left: 1em; }

q {
  quotes: "“" "”" "‘" "’"; }

* {
  box-sizing: border-box; }

html, body {
  width: 100%; }

section {
  padding-top: 70px;
  position: relative;
  background: center 70px no-repeat;
  background-size: cover;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center; }
  @media only screen and (min-width: 768px) {
    section {
      min-height: 100vh; }
      .ie11 .us section {
        height: 100vh; }
      .ie11 .continue-exploring section {
        height: 100vh; } }
  section > div.w {
    flex: 0 0 auto;
    max-width: 980px;
    width: 100%;
    padding: 40px; }
    section > div.w p, section > div.w ul {
      margin-bottom: 1.2em; }
    section > div.w h1 {
      margin-bottom: 0.5em;
      line-height: 1; }
    section > div.w .tabs {
      display: flex;
      justify-content: center;
      flex-wrap: wrap; }
      @media only screen and (min-width: 480px) {
        section > div.w .tabs {
          flex-wrap: nowrap; } }
      section > div.w .tabs a {
        flex: 1 1 100%;
        margin: 0 10px 10px 10px; }
        @media only screen and (min-width: 480px) {
          section > div.w .tabs a {
            flex: 0 1 100%; }
            section > div.w .tabs a.single_button {
              flex: 0 0 auto;
              min-width: 235px; } }
        section > div.w .tabs a:hover {
          background: #ffffff;
          color: #9a0936; }
      section > div.w .tabs.left {
        justify-content: flex-start; }
        section > div.w .tabs.left li {
          flex: 1 0 100%; }
          section > div.w .tabs.left li a {
            margin: 0 0 10px 0; }
          @media only screen and (min-width: 480px) {
            section > div.w .tabs.left li {
              flex: 0 1 235px; }
              section > div.w .tabs.left li a {
                margin: 0 20px 10px 0; } }
section.header {
  min-height: 100vh; }
  .ie11 section.header {
    height: 100vh; }
  section.header > div {
    max-width: 830px;
    padding: 40px; }
    section.header > div h1, section.header > div p {
      color: #ffffff;
      text-align: center;
      margin-bottom: 1.4em; }

header {
  background: #ffffff;
  height: 70px;
  transition: height 0.2s ease-out;
  position: fixed;
  z-index: 20;
  top: 0;
  left: 0;
  right: 0;
  display: flex;
  flex-direction: row;
  align-items: flex-end;
  justify-content: space-between;
  padding: 0 15px; }
  @media only screen and (min-width: 480px) {
    header {
      padding: 0 30px; } }
  header .logo {
    display: block;
    flex: 1 1 185px;
    padding-bottom: 10px; }
  header nav {
    flex: 0 0 auto;
    text-align: right;
    padding-bottom: 15px; }
    header nav ul {
      display: none; }
    header nav .menu_btn_wrapper {
      display: block;
      transition: transform 0.2s; }
      header nav .menu_btn_wrapper:hover {
        transform: rotate(90deg); }
    @media only screen and (min-width: 980px) {
      header nav .menu_btn_wrapper {
        display: none; }
      header nav ul {
        display: flex; }
        header nav ul li:not(:last-of-type) {
          margin-right: 10px; }
          header nav ul li:not(:last-of-type):after {
            color: #ada296;
            content: '|';
            margin-left: 10px; }
        header nav ul li a {
          text-decoration: none;
          color: #ada296;
          transition: color 0.2s; }
          header nav ul li a:hover {
            color: #cc0846; }
          header nav ul li a.current {
            color: #9a0936; }
        .ie:not(.ie11) header nav ul {
          display: block; }
          .ie:not(.ie11) header nav ul li {
            float: left; } }
  header a {
    color: #ffffff;
    cursor: pointer; }

footer {
  position: fixed;
  z-index: 10;
  left: 0;
  right: 0;
  bottom: 0;
  background: #9a0936;
  background: rgba(154, 9, 54, 0.96);
  box-shadow: 0 0 30px rgba(0, 0, 0, 0.5); }
  footer .handle {
    position: absolute;
    left: calc( 50% - 19px);
    top: -29px;
    background: #cc0846;
    display: block;
    padding: 8px 10px 5px 10px;
    transition: all 0.2s; }
    footer .handle:hover {
      padding-bottom: 10px;
      top: -34px; }
  footer .contact-details {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    max-width: 700px;
    margin: auto;
    padding: 0 5px;
    height: 0;
    opacity: 0;
    transition: all 0.2s;
    overflow: hidden; }
    footer .contact-details.active {
      opacity: 1;
      padding: 35px 5px 40px 5px;
      height: auto; }
    footer .contact-details div {
      flex: 1 1 auto;
      margin: 10px;
      text-align: center; }
      @media only screen and (min-width: 480px) {
        footer .contact-details div[itemprop=tel] {
          text-align: right; }
        footer .contact-details div[itemprop=email] {
          text-align: left; } }
      footer .contact-details div, footer .contact-details div a {
        color: #ffffff;
        text-decoration: none; }
      footer .contact-details div img {
        vertical-align: baseline;
        margin: 0 5px -2px 0; }

.continue-exploring {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  justify-content: center;
  padding: 0;
  min-height: 100vh; }
  .ie11 .continue-exploring {
    height: 100vh; }
  .ie:not(.ie11) .continue-exploring {
    display: none; }
  .continue-exploring h4 {
    position: absolute;
    background: #302a21;
    text-align: center;
    width: 100%;
    padding: 20px;
    top: calc( 50% - 35px);
    color: #ffffff; }
    @media only screen and (min-width: 480px) {
      .continue-exploring h4 {
        max-width: 350px;
        left: 50%;
        transform: translateX(-50%); } }
    @media only screen and (min-width: 768px) {
      .continue-exploring h4 {
        top: 20%; } }
  .continue-exploring div {
    display: flex;
    justify-content: center;
    align-items: center;
    background: center center no-repeat;
    background-size: cover;
    flex: 1 1 auto; }
    @media screen and (max-width: 768px) {
      .ie .continue-exploring div {
        height: 50vh; } }
    .continue-exploring div.services.left {
      background-image: url("../img/continue-exploring/services-left.png"); }
    .continue-exploring div.markets.right {
      background-image: url("../img/continue-exploring/markets-right.png"); }
    .continue-exploring div.projects.left {
      background-image: url("../img/continue-exploring/projects-left.png"); }
    .continue-exploring div.projects.right {
      background-image: url("../img/continue-exploring/projects-right.png"); }
    .continue-exploring div.testimonials.right {
      background-image: url("../img/continue-exploring/testimonials-right.png"); }
    .continue-exploring div.publications.right {
      background-image: url("../img/continue-exploring/publications-right.png"); }
    .continue-exploring div a {
      width: 100%;
      max-width: 235px; }
      .continue-exploring div a:hover {
        background-color: #9a0936; }
  @media only screen and (min-width: 768px) {
    .continue-exploring {
      flex-direction: row; }
      .continue-exploring div {
        flex: 0 1 50%; } }
.sb-slidebar {
  width: 180px;
  border-left: 5px solid #302a21;
  background: #ffffff;
  background: rgba(255, 255, 255, 0.96);
  max-height: 100vh;
  overflow: auto;
  z-index: 101;
  box-shadow: 0 0 30px rgba(0, 0, 0, 0.5); }
  .sb-slidebar nav {
    padding: 10px 10px; }
    .sb-slidebar nav a {
      color: #ada296;
      text-decoration: none;
      font-size: 14px;
      display: block; }
    .sb-slidebar nav a {
      padding: 15px 15px;
      border-bottom: 1px solid rgba(173, 162, 150, 0.2); }
      .sb-slidebar nav a:last-of-type {
        border-bottom: none; }
      .sb-slidebar nav a.current {
        color: #302a21; }
      .sb-slidebar nav a:hover {
        background: #cc0846;
        color: #ffffff; }

body.home .sb-site-container {
  background: #ada296; }

body.home main {
  background: #ffffff;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  height: 100vh;
  min-height: 100vh;
  padding-top: 70px;
  position: relative; }
  @media only screen and (min-width: 768px) {
    body.home main {
      margin: auto; } }
  body.home main div {
    display: flex;
    flex: 1 0 50%;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    cursor: pointer;
    position: relative;
    padding: 20px;
    overflow: hidden; }
    .ie:not(.ie11) body.home main div {
      display: block;
      width: 100%;
      height: 20%;
      float: left; }
    body.home main div:after {
      content: '';
      position: absolute;
      top: 0;
      bottom: 0;
      left: 0;
      right: 0;
      opacity: 0;
      transition: all 0.2s;
      -webkit-filter: blur(3px);
              filter: blur(3px);
      will-change: opacity; }
    body.home main div:hover:after {
      opacity: 1; }
    body.home main div, body.home main div:after {
      background: no-repeat center center;
      background-size: cover; }
    body.home main div a {
      font-size: 18px;
      color: #ffffff;
      text-decoration: none;
      border-bottom: 1px solid #ffffff;
      padding-bottom: 10px;
      text-align: left;
      line-height: 1.2;
      position: relative;
      z-index: 5;
      display: inline-block; }
    body.home main div.our_projects, body.home main div.our_projects:after {
      background-image: url(../img/home/our_projects.jpg);
      background-position: center top; }
    body.home main div.services, body.home main div.services:after {
      background-image: url(../img/home/services.png); }
    body.home main div.testimonials {
      background: #302a21; }
      body.home main div.testimonials .full {
        display: none; }
    body.home main div.about_us, body.home main div.about_us:after {
      background-image: url(../img/home/about_us.jpg);
      background-position: 70% 30%; }
  @media only screen and (min-width: 480px) {
    body.home main div a {
      font-size: 25px; } }
  @media only screen and (min-width: 768px) {
    body.home main {
      flex-direction: row;
      flex-wrap: wrap;
      align-items: stretch; }
      body.home main div {
        flex: 1 1 auto;
        height: 40%;
        padding: 45px; }
        body.home main div.services {
          flex-basis: 31%; }
        body.home main div.about_us {
          flex-basis: 31%; }
        body.home main div.testimonials {
          flex-basis: 31%; }
        body.home main div.our_projects {
          flex-basis: 100%;
          height: 60%; }
          body.home main div.our_projects a {
            font-size: 40px; }
        .ie:not(.ie11) body.home main div {
          height: 50%; }
          .ie:not(.ie11) body.home main div.services {
            width: 33%; }
          .ie:not(.ie11) body.home main div.about_us {
            width: 33%; }
          .ie:not(.ie11) body.home main div.testimonials {
            width: 33%; }
          .ie:not(.ie11) body.home main div.our_projects {
            width: 100%; } }
  @media screen and (min-width: 768px) and (min-height: 768px) {
    body.home main div.testimonials .abbreviated {
      display: none; }
    body.home main div.testimonials .full {
      display: block; }
    body.home main div.testimonials p {
      font-size: 25px;
      color: #ffffff;
      margin-bottom: 20px; }
    body.home main div.testimonials a {
      font-size: 15px;
      font-weight: bold; }
    body.home main div.testimonials:hover p {
      border-color: #f1185b;
      color: #f1185b; } }
body.about .header {
  background-image: url("../img/about/header.jpg"); }

body.about .s1 h1 {
  color: #cc0846; }

body.about .s1 .content .fs-xl {
  color: #6D5C4A; }

body.about .s1 .tabs a {
  border-color: #cc0846;
  color: #cc0846; }
  body.about .s1 .tabs a:hover {
    background: #9a0936;
    color: #ffffff; }
  body.about .s1 .tabs a.active {
    background: #cc0846;
    color: #ffffff; }

body.about .s1 article {
  margin: 50px 0 25px; }
  body.about .s1 article img {
    width: 215px;
    height: auto;
    max-width: 100%;
    margin-bottom: 15px; }

body.about .s2 {
  background: #40392f right center no-repeat url("../img/about/who-we-are.jpg");
  background-size: cover; }
  body.about .s2 h1 {
    color: #ffffff; }
  body.about .s2 .content, body.about .s2 li, body.about .s2 a {
    color: #ffffff; }
  body.about .s2 .tabs a:hover {
    background: #9a0936;
    color: #ffffff; }
  body.about .s2 .tabs a.active {
    color: #cc0846;
    background: #ffffff; }
  body.about .s2 .s-team.active {
    display: flex !important;
    flex-direction: column;
    height: 100%;
    min-height: 313px; }
    body.about .s2 .s-team.active > * {
      flex-shrink: 0; }
  body.about .s2 .team-members {
    height: 100%;
    min-height: 427px;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    position: relative; }
    body.about .s2 .team-members .team-member {
      flex: 1 1 33%;
      margin-top: 25px;
      position: relative;
      cursor: pointer;
      margin-right: 25px; }
      body.about .s2 .team-members .team-member .img {
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        background: center center no-repeat;
        background-size: cover; }
      body.about .s2 .team-members .team-member .details {
        position: absolute;
        bottom: 0;
        left: 0;
        right: 0;
        z-index: 2;
        background: #cc0846;
        padding: 8px 5px;
        color: #000000;
        text-align: center;
        font-weight: 600; }
    body.about .s2 .team-members .team-member-popup {
      position: absolute;
      z-index: 3;
      top: 15px;
      bottom: 0;
      left: 0;
      right: 0;
      background: #ffffff;
      display: none; }
      body.about .s2 .team-members .team-member-popup.active {
        display: block; }
      body.about .s2 .team-members .team-member-popup .close {
        position: absolute;
        top: 0;
        right: 0;
        background: #cc0846;
        padding: 5px 10px;
        font-size: 16px;
        cursor: pointer; }
      body.about .s2 .team-members .team-member-popup .img {
        position: absolute;
        display: none;
        top: 15px;
        left: 15px;
        width: 200px;
        bottom: 15px;
        background: center center no-repeat;
        background-size: cover; }
      body.about .s2 .team-members .team-member-popup .details {
        position: absolute;
        top: 35px;
        bottom: 35px;
        left: 20px;
        right: 20px;
        background: center center no-repeat;
        background-size: cover;
        color: #000000;
        display: flex;
        flex-direction: row;
        align-items: center; }
        body.about .s2 .team-members .team-member-popup .details .wrapper {
          max-height: 100%;
          overflow-y: scroll; }
          body.about .s2 .team-members .team-member-popup .details .wrapper::-webkit-scrollbar {
            width: 10px; }
          body.about .s2 .team-members .team-member-popup .details .wrapper::-webkit-scrollbar-track {
            border-radius: 5px;
            background: rgba(0, 0, 0, 0.1); }
          body.about .s2 .team-members .team-member-popup .details .wrapper::-webkit-scrollbar-thumb {
            border-radius: 5px;
            background: rgba(0, 0, 0, 0.3); }
          body.about .s2 .team-members .team-member-popup .details .wrapper::-webkit-scrollbar-thumb:hover {
            background: rgba(0, 0, 0, 0.3); }
          body.about .s2 .team-members .team-member-popup .details .wrapper::-webkit-scrollbar-thumb:window-inactive {
            background: r rgba(0, 0, 0, 0.3); }
        body.about .s2 .team-members .team-member-popup .details .title {
          color: #cc0846;
          font-size: 16px;
          font-weight: 600; }
  @media only screen and (min-width: 480px) {
    body.about .s2 ul {
      -webkit-columns: 3;
         -moz-columns: 3;
              columns: 3;
      margin: 1.5em 0; }
    body.about .s2 .team-members .team-member {
      max-width: 215px;
      flex: 0 1 33%; }
    body.about .s2 .team-members .team-member-popup {
      right: 25px; }
      body.about .s2 .team-members .team-member-popup .img {
        display: block; }
      body.about .s2 .team-members .team-member-popup .details {
        left: 245px; } }
body.about .s3 {
  background: #ffffff right center no-repeat url("../img/about/where-we-work.jpg?1220");
  background-size: cover; }
  body.about .s3 h1 {
    color: #cc0846; }
  body.about .s3 p {
    margin-left: auto;
    margin-right: auto; }
  body.about .s3 .content {
    color: #ffffff; }
  body.about .s3 > div {
    align-self: center;
    text-align: center; }
    body.about .s3 > div a {
      margin-left: auto;
      margin-right: auto; }
  body.about .s3 a {
    max-width: 235px;
    color: #ffffff;
    border-color: #ffffff;
    margin-top: 2em; }
    body.about .s3 a:hover {
      background: #cc0846;
      color: #ffffff;
      border-color: #ffffff; }

body.projects .header {
  background-image: url("../img/projects/header.jpg"); }

body.projects .project {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  padding: 0;
  color: #ffffff; }
  body.projects .project .image {
    background: center center no-repeat;
    background-size: cover;
    flex: 1 1 auto; }
    body.projects .project .image img {
      width: 100%;
      height: auto; }
  body.projects .project .w {
    flex: 1 1 auto;
    padding: 0; }
    body.projects .project .w .details {
      padding: 5%; }
      body.projects .project .w .details dt {
        margin-top: 1em;
        font-weight: 400; }
      body.projects .project .w .details p {
        margin-top: 2em; }
  body.projects .project.odd {
    background: #302a21; }
    body.projects .project.odd dt {
      color: #cc0846; }
  body.projects .project.even {
    background: #cc0846; }
    body.projects .project.even dt {
      color: #302a21; }
  @media only screen and (min-width: 768px) {
    body.projects .project {
      flex-direction: row;
      align-items: stretch; }
      body.projects .project .image {
        flex: 2 1 100%; }
      body.projects .project .w {
        flex: 1 2 100%;
        padding: 70px 0 0; }
        body.projects .project .w .details {
          padding: 20% 20% 20% 10%; }
      body.projects .project.odd {
        flex-direction: row; }
      body.projects .project.even {
        flex-direction: row-reverse; } }
body.services .header {
  background-image: url("../img/services/header.jpg"); }

body.services section a {
  text-decoration: none; }

body.services section a.button {
  display: inline-block;
  min-width: 235px;
  max-width: 100%;
  margin-top: 2em; }

body.services section p {
  margin: 1em 0 2em; }

body.services section dt {
  margin: 0 0 0.5em;
  cursor: pointer;
  text-decoration: underline; }

body.services section dd {
  margin-bottom: 1em; }

body.services section a.active:before {
  content: '> '; }

body.services section.s1 {
  background: #302a21; }
  body.services section.s1 h1 {
    color: #6D5C4A; }
  body.services section.s1 dt {
    color: #cc0846; }
  body.services section.s1 dd {
    color: #ffffff; }

body.services section.s2 {
  background: #ffffff; }
  body.services section.s2 h1 {
    color: #6D5C4A; }
  body.services section.s2 dt {
    color: #cc0846; }
  body.services section.s2 dd {
    color: #302a21; }
  body.services section.s2 a.button {
    color: #302a21;
    border-color: #302a21; }

body.publications .header {
  background-image: url("../img/publications/header.jpg"); }

body.publications .publications {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  justify-content: flex-start;
  padding: 0; }
  @media screen and (max-width: 768px) {
    .ie body.publications .publications {
      display: block; } }
  body.publications .publications .publication {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: center; }
    body.publications .publications .publication.one {
      color: #ffffff;
      background: #302a21; }
    body.publications .publications .publication.two {
      color: #ffffff;
      background: #6D5C4A;
      border-color: #302a21; }
    body.publications .publications .publication.three {
      background: #cc0846;
      color: #ffffff; }
    body.publications .publications .publication.four {
      color: #302a21;
      background: #ada296;
      border-color: #302a21; }
    body.publications .publications .publication .image {
      background: center center no-repeat;
      background-size: cover;
      flex: 1 1 auto; }
      body.publications .publications .publication .image img {
        width: 100%;
        height: auto;
        min-height: 50vh; }
    body.publications .publications .publication .w {
      flex: 1 1 auto; }
      body.publications .publications .publication .w .details {
        padding: 20% 20% 20% 10%;
        max-width: 100%; }
        body.publications .publications .publication .w .details h2, body.publications .publications .publication .w .details p {
          margin-bottom: 0.75em; }
        body.publications .publications .publication .w .details a {
          color: inherit; }
        body.publications .publications .publication .w .details a.button {
          color: inherit;
          border-color: inherit;
          display: inline-block;
          max-width: 235px;
          margin-top: 1em; }
    @media only screen and (min-width: 768px) {
      body.publications .publications .publication {
        display: flex;
        flex: 1 1 auto;
        flex-direction: row; }
        body.publications .publications .publication.odd {
          flex-direction: row; }
        body.publications .publications .publication.even {
          flex-direction: row-reverse; }
        body.publications .publications .publication .image {
          flex: 1 0 40%; }
        body.publications .publications .publication .w {
          flex: 1 1 60%;
          display: flex;
          flex-direction: row;
          align-items: center;
          justify-content: center; } }
body.testimonials .header {
  background-image: url("../img/testimonials/header.jpg"); }

body.testimonials section.testimonials {
  flex-direction: column;
  align-items: stretch;
  justify-content: space-around;
  padding: 10% 0; }
  body.testimonials section.testimonials.odd {
    background: #ffffff; }
  body.testimonials section.testimonials.even {
    background: #302a21; }
  body.testimonials section.testimonials .testimonial {
    flex: 0 0 auto;
    display: flex;
    flex-direction: row;
    justify-content: center; }
    body.testimonials section.testimonials .testimonial.one q, body.testimonials section.testimonials .testimonial.one p, body.testimonials section.testimonials .testimonial.one img {
      color: #cc0846;
      border-color: #cc0846; }
    body.testimonials section.testimonials .testimonial.one q > span {
      color: #000000; }
    body.testimonials section.testimonials .testimonial.two q, body.testimonials section.testimonials .testimonial.two p, body.testimonials section.testimonials .testimonial.two img {
      color: #ada296;
      border-color: #ada296; }
    body.testimonials section.testimonials .testimonial.two q > span {
      color: #000000; }
    body.testimonials section.testimonials .testimonial.three q, body.testimonials section.testimonials .testimonial.three p, body.testimonials section.testimonials .testimonial.three img {
      color: #ada296;
      border-color: #ada296; }
    body.testimonials section.testimonials .testimonial.three q > span {
      color: #ffffff; }
    body.testimonials section.testimonials .testimonial.four q, body.testimonials section.testimonials .testimonial.four p, body.testimonials section.testimonials .testimonial.four img {
      color: #cc0846;
      border-color: #cc0846; }
    body.testimonials section.testimonials .testimonial.four q > span {
      color: #ffffff; }
    body.testimonials section.testimonials .testimonial .w {
      padding: 0 10%;
      text-align: center; }
      body.testimonials section.testimonials .testimonial .w .details {
        max-width: 600px; }
        body.testimonials section.testimonials .testimonial .w .details q {
          position: relative;
          display: block;
          padding: 60px 0; }
          body.testimonials section.testimonials .testimonial .w .details q:after, body.testimonials section.testimonials .testimonial .w .details q:before {
            font-family: Helvetica, Arial, sans-serif;
            font-size: 100px;
            font-weight: 600;
            color: inherit;
            position: absolute;
            left: calc( 50% - 20px);
            line-height: 1; }
          body.testimonials section.testimonials .testimonial .w .details q:before {
            top: -0px;
            content: open-quote; }
          body.testimonials section.testimonials .testimonial .w .details q:after {
            bottom: -60px;
            content: close-quote; }
        body.testimonials section.testimonials .testimonial .w .details p {
          text-align: left;
          margin: -34px 0 30px calc( 50% + 40px);
          position: relative; }
          body.testimonials section.testimonials .testimonial .w .details p.with-photo {
            padding-top: 75px; }
            @media only screen and (min-width: 768px) {
              body.testimonials section.testimonials .testimonial .w .details p.with-photo {
                padding-top: 0;
                padding-left: 85px; } }
          body.testimonials section.testimonials .testimonial .w .details p img {
            position: absolute;
            left: 0;
            top: -15px;
            width: 75px;
            height: 75px;
            border-radius: 100%;
            border-style: solid;
            border-width: 1px; }

body.markets .header {
  background-image: url("../img/markets/header.jpg"); }

body.markets section {
  background: center center no-repeat;
  background-size: cover; }
  body.markets section h1 {
    margin-bottom: 1em; }
  body.markets section ul {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    justify-content: flex-start; }
    body.markets section ul li {
      flex: 0 1 100%;
      margin-bottom: 1em; }
      @media only screen and (min-width: 480px) {
        body.markets section ul li {
          flex: 0 1 50%; } }
      @media only screen and (min-width: 980px) {
        body.markets section ul li {
          flex: 0 1 33%; } }
body.markets .s1 {
  background-image: url("../img/markets/europe.png");
  background-position: right center; }
  body.markets .s1 h1, body.markets .s1 li {
    color: #ffffff; }

body.markets .s2 {
  background-image: url("../img/markets/middle-east.png");
  background-position: right center; }
  body.markets .s2 h1, body.markets .s2 li {
    color: #000000; }

body.markets .s3 {
  background-image: url("../img/markets/africa-asia.png"); }
  body.markets .s3 h1, body.markets .s3 li {
    color: #ffffff; }

body:not(.home) section {
  padding-top: 70px;
  background-position-y: 70px; }

body:not(.home) body.home main {
  padding-top: 70px; }

body:not(.home) header {
  height: 70px; }

@media only screen and (min-width: 768px) {
  body:not(.home) body.projects .project .w {
    padding-top: 70px; } }
/*# sourceMappingURL=screen.min.css.map */