@charset "UTF-8";
/*	Breakpoints
   ========================================================================== */
/*	- CSS Reset (2.0) & Normalize.css (2.1.2)
   ========================================================================== */
/*	Border box sizing
   .......................................................................... */
*,
*:before,
*:after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box; }

/*	Global reset
   .......................................................................... */
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,
main, nav, output, ruby, section, summary,
time, mark, audio, video {
  border: 0;
  font-size: 100%;
  margin: 0;
  padding: 0;
  vertical-align: baseline; }

/*	HTML5 display definitions
   .......................................................................... */
article, aside, details, figcaption, figure,
footer, header, hgroup, main, nav, section, summary {
  display: block;
  -webkit-backface-visibility: hidden; }

audio,
canvas,
video {
  display: inline-block; }

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

[hidden],
template {
  display: none; }

/*	Base
   .......................................................................... */
html {
  font-family: sans-serif;
  -moz-osx-font-smoothing: grayscale;
  -ms-text-size-adjust: 100%;
  -webkit-font-smoothing: antialiased;
  -webkit-text-size-adjust: 100%; }

/*	Links
   .......................................................................... */
a {
  background: transparent; }

a:focus {
  outline: 0; }

a:active,
a:hover {
  outline: 0; }

/*	Typography
   .......................................................................... */
abbr[title] {
  border-bottom: 1px dotted;
  cursor: help;
  text-transform: none; }

b,
strong {
  font-weight: bold; }

dfn {
  font-style: italic; }

.hr, hr {
  -moz-box-sizing: content-box;
  box-sizing: content-box;
  height: 0; }

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

code,
kbd,
pre,
samp {
  font-family: monospace, serif;
  font-size: 1em; }

pre {
  white-space: pre-wrap; }

q {
  quotes: "\201C" "\201D" "\2018" "\2019"; }

small {
  font-size: 80%; }

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

sup {
  top: -.5em; }

sub {
  bottom: -.25em; }

/*	Embedded content
   .......................................................................... */
img {
  border: 0;
  font-style: italic;
  -ms-interpolation-mode: bicubic;
  max-width: 100%;
  vertical-align: middle; }

img[width],
img[height] {
  max-width: none; }

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

/*	Lists
   .......................................................................... */
ol,
ul {
  list-style: none; }

/*	Forms
   .......................................................................... */
legend {
  border: 0;
  display: table;
  padding: 0;
  white-space: normal; }

button,
input,
select,
textarea {
  font-family: inherit;
  font-size: 100%;
  margin: 0; }

button,
input {
  line-height: normal; }

button,
select {
  text-transform: none; }

label[for],
input[type="checkbox"],
input[type="radio"],
select {
  cursor: pointer; }

button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
  cursor: pointer;
  -webkit-appearance: button; }

button[disabled],
html input[disabled] {
  cursor: default; }

input[type="checkbox"],
input[type="radio"] {
  box-sizing: border-box;
  padding: 0; }

input[type="search"] {
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
  -webkit-appearance: textfield; }

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

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

textarea {
  overflow: auto;
  vertical-align: top; }

/*	Tables
   .......................................................................... */
table {
  border-collapse: collapse;
  border-spacing: 0;
  width: 100%; }

/*	- Clear floats
   ========================================================================== */
.group:before,
.group:after {
  content: " ";
  display: table; }

.group:after {
  clear: both; }

/*	- Hide & show content
   ========================================================================== */
.hidden {
  display: none !important;
  visibility: hidden !important; }

.invisible {
  visibility: hidden; }

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

.visually-hidden.focusable:active,
.visually-hidden.focusable:focus {
  clip: auto;
  height: auto;
  margin: 0;
  overflow: visible;
  position: static;
  width: auto; }

/*	Show/hide on [device-width]
   .......................................................................... */
.show-on-phone,
.hide-on-small-tablet,
.hide-on-tablet,
.hide-on-desktop {
  display: inherit !important; }

.hide-on-phone,
.show-on-small-tablet,
.show-on-tablet,
.show-on-desktop {
  display: none !important; }

@media screen and (min-width: 500px) {
  .show-on-small-tablet,
  .hide-on-phone,
  .hide-on-tablet,
  .hide-on-desktop {
    display: inherit !important; }

  .hide-on-small-tablet,
  .show-on-phone,
  .show-on-tablet,
  .show-on-desktop {
    display: none !important; } }
@media screen and (min-width: 768px) {
  .show-on-tablet,
  .hide-on-phone,
  .hide-on-small-tablet,
  .hide-on-desktop {
    display: inherit !important; }

  .hide-on-tablet,
  .show-on-phone,
  .show-on-small-tablet,
  .show-on-desktop {
    display: none !important; } }
@media screen and (min-width: 960px) {
  .show-on-desktop,
  .hide-on-phone,
  .hide-on-small-tablet,
  .hide-on-tablet {
    display: inherit !important; }

  .hide-on-desktop,
  .show-on-phone,
  .show-on-small-tablet,
  .show-on-tablet {
    display: none !important; } }
/*	Show until [device-width]
   .......................................................................... */
@media screen and (max-width: 37.438em) {
  .show-until-phone {
    display: inherit !important; } }
@media screen and (max-width: 47.938em) {
  .show-until-small-tablet {
    display: inherit !important; } }
@media screen and (max-width: 59.938em) {
  .show-until-tablet {
    display: inherit !important; } }
@media screen and (min-width: 500px) {
  .show-until-phone {
    display: none !important; } }
@media screen and (min-width: 768px) {
  .show-until-small-tablet {
    display: none !important; } }
@media screen and (min-width: 960px) {
  .show-until-tablet {
    display: none !important; } }
/*	Show from [device-width]
   .......................................................................... */
@media screen and (min-width: 500px) {
  .show-from-small-tablet {
    display: inherit !important; } }
@media screen and (min-width: 768px) {
  .show-from-tablet {
    display: inherit !important; } }
@media screen and (min-width: 960px) {
  .show-from-desktop {
    display: inherit !important; } }
@media screen and (max-width: 37.438em) {
  .show-from-small-tablet {
    display: none !important; } }
@media screen and (max-width: 47.938em) {
  .show-from-tablet {
    display: none !important; } }
@media screen and (max-width: 59.938em) {
  .show-from-desktop {
    display: none !important; } }
/*	Show for [orientation]
   .......................................................................... */
@media screen and (orientation: landscape) {
  .show-for-landscape,
  .hide-for-portrait {
    display: inherit !important; }

  .hide-for-landscape,
  .show-for-portrait {
    display: none !important; } }
@media screen and (orientation: portrait) {
  .show-for-portrait,
  .hide-for-landscape {
    display: inherit !important; }

  .hide-for-portrait,
  .show-for-landscape {
    display: none !important; } }
/*	- Image replacement
   ========================================================================== */
.ir {
  display: inline-block;
  overflow: hidden;
  position: relative;
  vertical-align: top; }

.no-backgroundsize .ir {
  text-indent: -9999px; }

.ir:after {
  background-repeat: no-repeat;
  background-size: contain;
  content: "";
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%; }

/*	- Blocks in line
   ========================================================================== */
.blocks-in-line {
  font-size: 0; }

.blocks-in-line > * {
  display: inline-block;
  font-size: 1rem;
  vertical-align: middle; }

/*	- Furthe reset
   ========================================================================== */
body {
  cursor: default; }

p {
  font-size: 16px; }
  @media screen and (min-width: 960px) {
    p {
      font-size: 18px;
      line-height: 23px; } }

/* Mixins and Helpers
================================================== */
@-webkit-keyframes fadeinfromleft {
  0%,50% {
    opacity: 0;
    -webkit-transform: translateX(-20px); }
  100% {
    opacity: 1;
    -webkit-transform: translateX(0); } }
@-moz-keyframes fadeinfromleft {
  0%,50% {
    opacity: 0;
    -moz-transform: translateX(-20px); }
  100% {
    opacity: 1;
    -moz-transform: translateX(0); } }
@-ms-keyframes fadeinfromleft {
  0%,50% {
    opacity: 0;
    -ms-transform: translateX(-20px); }
  100% {
    opacity: 1;
    -ms-transform: translateX(0); } }
@-o-keyframes fadeinfromleft {
  0%,50% {
    opacity: 0;
    -o-transform: translateX(-20px); }
  100% {
    opacity: 1;
    -o-transform: translateX(0); } }
@keyframes fadeinfromleft {
  0%,50% {
    opacity: 0;
    transform: translateX(-20px); }
  100% {
    opacity: 1;
    transform: translateX(0); } }
.box-sizing, .warning, .fieldnote-wrap, .cp-col, .ct, .section-header .ttl,
.section-header .bod, .tabbed-cnt .cnt, .q-a-box-wrap, .artist-intro {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  -o-box-sizing: border-box;
  box-sizing: border-box; }

.box-sizing, .warning, .fieldnote-wrap, .cp-col, .ct, .section-header .ttl,
.section-header .bod, .tabbed-cnt .cnt, .q-a-box-wrap, .artist-intro {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  -o-box-sizing: border-box;
  box-sizing: border-box; }

.userselectnone {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none; }

.posrelative {
  position: relative; }

.valignp {
  display: table;
  width: 100%;
  height: 100%; }

.valignc {
  display: table-cell;
  vertical-align: middle;
  width: 100%;
  height: 100%; }

.clearboth {
  clear: both; }

.centertext {
  text-align: center; }

/*	- counterpreloader
   ========================================================================== */
.counterpreloader {
  position: fixed;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  background: #000;
  z-index: 99999;
  display: none; }

.showNo {
  color: #fff;
  width: 160px;
  height: 40px;
  position: absolute;
  text-align: center;
  top: 50%;
  left: 50%;
  margin-left: -80px;
  margin-top: -43px;
  font-size: 36px; }

.progress-bar {
  position: absolute;
  top: 50%;
  width: 0;
  height: 3px;
  background: #fff;
  color: red;
  left: 0; }

/*	- Preloader
   ========================================================================== */
html.js .counterpreloader {
  display: block; }

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

.slick-list {
  position: relative;
  overflow: hidden;
  display: block;
  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;
  left: 0;
  top: 0;
  display: block; }
  .slick-track:before, .slick-track:after {
    content: "";
    display: table; }
  .slick-track:after {
    clear: both; }
  .slick-loading .slick-track {
    visibility: hidden; }

.slick-slide {
  float: left;
  height: 100%;
  min-height: 1px;
  display: none; }
  [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; }

/*	- Flexslider
   ========================================================================== */
/*
 * jQuery FlexSlider v2.2.0
 * http://www.woothemes.com/flexslider/
 *
 * Copyright 2012 WooThemes
 * Free to use under the GPLv2 license.
 * http://www.gnu.org/licenses/gpl-2.0.html
 *
 * Contributing author: Tyler Smith (@mbmufffin)
 */
/* Browser Resets
*********************************/
.flex-container a:active,
.flexslider a:active,
.flex-container a:focus,
.flexslider a:focus {
  outline: none; }

.slides,
.flex-control-nav,
.flex-direction-nav {
  margin: 0;
  padding: 0;
  list-style: none; }

/* Icon Fonts
*********************************/
/* Font-face Icons */
@font-face {
  font-family: 'flexslider-icon';
  src: url("../fonts/flexslider-icon.eot");
  src: url("../fonts/flexslider-icon.eot?#iefix") format("embedded-opentype"), url("../fonts/flexslider-icon.woff") format("woff"), url("../fonts/flexslider-icon.ttf") format("truetype"), url("../fonts/flexslider-icon.svg#flexslider-icon") format("svg");
  font-weight: normal;
  font-style: normal; }
/* FlexSlider Necessary Styles
*********************************/
.flexslider {
  margin: 0;
  padding: 0; }

.flexslider .slides > li {
  display: none;
  -webkit-backface-visibility: hidden; }

/* Hide the slides before the JS is loaded. Avoids image jumping */
.flexslider .slides img {
  width: 100%;
  display: block; }

.flex-pauseplay span {
  text-transform: capitalize; }

/* Clearfix for the .slides element */
.slides:after {
  content: "\0020";
  display: block;
  clear: both;
  visibility: hidden;
  line-height: 0;
  height: 0; }

html[xmlns] .slides {
  display: block; }

* html .slides {
  height: 1%; }

/* No JavaScript Fallback */
/* If you are not using another script, such as Modernizr, make sure you
 * include js that eliminates this class on page load */
.no-js .slides > li:first-child {
  display: block; }

/* FlexSlider Default Theme
*********************************/
.flex-viewport {
  max-height: 2000px;
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -o-transition: all 1s ease;
  transition: all 1s ease; }

.loading .flex-viewport {
  max-height: 300px; }

.flexslider .slides {
  zoom: 1; }

.carousel li {
  margin-right: 5px; }

/* Direction Nav */
.flex-direction-nav {
  *height: 0; }

.flex-direction-nav a {
  text-decoration: none;
  display: block;
  width: 14px;
  height: 25px;
  margin: -7px 0 0;
  z-index: 10;
  overflow: hidden;
  opacity: 1;
  cursor: pointer;
  color: #fff;
  -webkit-transition: all .3s ease;
  -moz-transition: all .3s ease;
  transition: all .3s ease; }
  @media screen and (min-width: 768px) {
    .flex-direction-nav a {
      position: absolute; } }

.flex-direction-nav .flex-prev {
  left: 20px; }

.flex-direction-nav .flex-next {
  right: 20px;
  text-align: right; }

.flexslider:hover .flex-next:hover, .flexslider:hover .flex-prev:hover {
  opacity: 1; }

.flex-direction-nav .flex-disabled {
  opacity: 0 !important;
  filter: alpha(opacity=0);
  cursor: default; }

.flex-direction-nav a {
  text-indent: -99999px;
  overflow: hidden;
  font-size: 0;
  line-height: 0; }

.flex-direction-nav a.flex-prev {
  background: url(../images/icons.svg) no-repeat left center; }

.flex-direction-nav a.flex-next {
  background: url(../images/icons.svg) no-repeat right center; }

/* Pause/Play */
.flex-pauseplay a {
  display: block;
  width: 20px;
  height: 20px;
  position: absolute;
  bottom: 5px;
  left: 10px;
  opacity: 0.8;
  z-index: 10;
  overflow: hidden;
  cursor: pointer;
  color: #000; }

.flex-pauseplay a:before {
  font-family: "flexslider-icon";
  font-size: 20px;
  display: inline-block;
  content: '\f004'; }

.flex-pauseplay a:hover {
  opacity: 1; }

.flex-pauseplay a.flex-play:before {
  content: '\f003'; }

/* Control Nav */
.flex-control-nav {
  width: 100%;
  position: absolute;
  bottom: -40px;
  text-align: center; }

.flex-control-nav li {
  margin: 0 6px;
  display: inline-block;
  zoom: 1;
  *display: inline; }

.flex-control-paging li a {
  width: 11px;
  height: 11px;
  display: block;
  background: #666;
  background: rgba(0, 0, 0, 0.5);
  cursor: pointer;
  text-indent: -9999px;
  -webkit-border-radius: 20px;
  -moz-border-radius: 20px;
  -o-border-radius: 20px;
  border-radius: 20px;
  -webkit-box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.3);
  -moz-box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.3);
  -o-box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.3);
  box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.3); }

.flex-control-paging li a:hover {
  background: #333;
  background: rgba(0, 0, 0, 0.7); }

.flex-control-paging li a.flex-active {
  background: #000;
  background: rgba(0, 0, 0, 0.9);
  cursor: default; }

.flex-control-thumbs {
  margin: 5px 0 0;
  position: static;
  overflow: hidden; }

.flex-control-thumbs li {
  width: 25%;
  float: left;
  margin: 0; }

.flex-control-thumbs img {
  width: 100%;
  display: block;
  opacity: .7;
  cursor: pointer; }

.flex-control-thumbs img:hover {
  opacity: 1; }

.flex-control-thumbs .flex-active {
  opacity: 1;
  cursor: default; }

/*
@media screen and (min-width: $tablet-bp) {
  .flex-direction-nav .flex-prev { opacity: 1; left: 10px;}
  .flex-direction-nav .flex-next { opacity: 1; right: 10px;}
}
*/
@media screen and (min-width: 768px) {
  .flexslider .flex-prev,
  .flexslider .flex-next {
    opacity: 0; }

  .flexslider:hover .flex-prev {
    opacity: 1;
    left: 20px; }

  .flexslider:hover .flex-next {
    opacity: 1;
    right: 20px; } }
/*	- Home slider
   ========================================================================== */
.home-carousel .flex-direction-nav {
  position: absolute;
  left: 0;
  width: 100%;
  bottom: 20px;
  text-align: right;
  padding-right: 20px;
  padding-left: 20px;
  z-index: 9;
  height: 25px; }
  .home-carousel .flex-direction-nav li {
    display: inline-block;
    padding-left: 12px; }
  @media screen and (min-width: 500px) {
    .home-carousel .flex-direction-nav {
      padding-right: 40px;
      padding-left: 40px; } }
  @media screen and (min-width: 768px) {
    .home-carousel .flex-direction-nav {
      top: auto;
      bottom: 50px; }
      .home-carousel .flex-direction-nav a {
        top: 0; } }

/*	- breakpoints
   ========================================================================== */
#breakpointer {
  display: block;
  width: 20px;
  height: 20px;
  position: fixed;
  z-index: 999999;
  top: 0;
  right: 0;
  background: blue; }
  @media screen and (min-width: 500px) {
    #breakpointer {
      background: green; } }
  @media screen and (min-width: 768px) {
    #breakpointer {
      background: yellow; } }
  @media screen and (min-width: 960px) {
    #breakpointer {
      background: orange; } }
  @media screen and (min-width: 1280px) {
    #breakpointer {
      background: red; } }

/*	- Pseudo-class CSS transitions
   ========================================================================== */
a,
button,
input,
textarea {
  -moz-transition: background-color .2s ease-out, background-image .2s ease-out, border-color .2s ease-out, box-shadow .2s ease-out, color .2s ease-out, opacity .2s ease-out, text-shadow .2s ease-out;
  -ms-transition: background-color .2s ease-out, background-image .2s ease-out, border-color .2s ease-out, box-shadow .2s ease-out, color .2s ease-out, opacity .2s ease-out, text-shadow .2s ease-out;
  -o-transition: background-color .2s ease-out, background-image .2s ease-out, border-color .2s ease-out, box-shadow .2s ease-out, color .2s ease-out, opacity .2s ease-out, text-shadow .2s ease-out;
  -webkit-transition: background-color .2s ease-out, background-image .2s ease-out, border-color .2s ease-out, box-shadow .2s ease-out, color .2s ease-out, opacity .2s ease-out, text-shadow .2s ease-out;
  transition: background-color .2s ease-out, background-image .2s ease-out, border-color .2s ease-out, box-shadow .2s ease-out, color .2s ease-out, opacity .2s ease-out, text-shadow .2s ease-out; }

/*	ASSETS
   ==========================================================================
   ========================================================================== */
/*	- Embedded fonts
   ========================================================================== */
@font-face {
  font-family: "Calibre Light";
  font-style: normal;
  font-weight: normal;
  src: url("../fonts/Calibre/CalibreWeb-Light.eot");
  src: url("../fonts/Calibre/CalibreWeb-Light.eot#iefix") format("embedded-opentype"), url("../fonts/Calibre/CalibreWeb-Light.woff") format("woff"), url("../fonts/Calibre/CalibreWeb-Light.ttf") format("truetype"); }
@font-face {
  font-family: "Calibre Semibold";
  font-style: normal;
  font-weight: normal;
  src: url("../fonts/Calibre/CalibreWeb-Semibold.eot");
  src: url("../fonts/Calibre/CalibreWeb-Semibold.eot#iefix") format("embedded-opentype"), url("../fonts/Calibre/CalibreWeb-Semibold.woff") format("woff"), url("../fonts/Calibre/CalibreWeb-Semibold.ttf") format("truetype"); }
@font-face {
  font-family: "Calibre Thin";
  font-style: normal;
  font-weight: normal;
  src: url("../fonts/Calibre/CalibreWeb-Thin.eot");
  src: url("../fonts/Calibre/CalibreWeb-Thin.eot#iefix") format("embedded-opentype"), url("../fonts/Calibre/CalibreWeb-Thin.woff") format("woff"), url("../fonts/Calibre/CalibreWeb-Thin.ttf") format("truetype"); }
@font-face {
  font-family: "Dala Floda";
  font-style: normal;
  font-weight: normal;
  src: url("../fonts/dalafloda/DalaFloda-Medium-Web.eot");
  src: url("../fonts/dalafloda/DalaFloda-Medium-Web.eot#iefix") format("embedded-opentype"), url("../fonts/dalafloda/DalaFloda-Medium-Web.woff") format("woff"), url("../fonts/dalafloda/DalaFloda-Medium-Web.ttf") format("truetype"); }
@font-face {
  font-family: "Toast";
  font-style: normal;
  font-weight: normal;
  src: url("../fonts/toast.eot");
  src: url("../fonts/toast.eot#iefix") format("embedded-opentype"), url("../fonts/toast.woff") format("woff"), url("../fonts/toast.ttf") format("truetype"); }
b,
strong {
  font-family: "Calibre Semibold";
  font-style: normal;
  font-weight: normal; }

/*	- Flexslider
   ========================================================================== */
.flexslider .slides > li {
  display: none;
  position: relative; }

.flexslider .slides > li:first-child {
  display: block; }

.flexslider .slides img {
  max-width: none;
  width: 100%; }

.home .flex-viewport {
  max-height: 640px !important; }

.our-work .flex-viewport {
  max-height: 364px !important; }

/*	- Isotope
   ========================================================================== */
.isotope-hidden.isotope-item {
  pointer-events: none; }

.isotope,
.isotope .isotope-item {
  -moz-transition-duration: .8s;
  -ms-transition-duration: .8s;
  -o-transition-duration: .8s;
  -webkit-transition-duration: .8s;
  transition-duration: .8s; }

.isotope {
  -moz-transition-property: height, width;
  -ms-transition-property: height, width;
  -o-transition-property: height, width;
  -webkit-transition-property: height, width;
  transition-property: height, width; }

.isotope .isotope-item {
  -moz-transition-property: -moz-transform, opacity;
  -ms-transition-property: -ms-transform, opacity;
  -o-transition-property: -o-transform, opacity;
  -webkit-transition-property: -webkit-transform, opacity;
  transition-property: transform, opacity; }

.isotope.no-transition,
.isotope.no-transition .isotope-item,
.isotope .isotope-item.no-transition {
  -moz-transition-duration: 0;
  -ms-transition-duration: 0;
  -o-transition-duration: 0;
  -webkit-transition-duration: 0;
  transition-duration: 0; }

/*	MODULES
   ==========================================================================
   ========================================================================== */
/*	- Icons
   ========================================================================== */
[class*="icon-"] {
  font: normal normal 1em/1 "Toast";
  font-variant: normal;
  text-transform: none;
  speak: none; }

[class*="icon-"] > * {
  speak: normal; }

.icon-toast:before {
  content: "\e000"; }

.icon-slash:before {
  content: "\e001"; }

.icon-arrow-left:before {
  content: "\e002"; }

.icon-arrow-right:before {
  content: "\e003"; }

.icon-arrow-up:before {
  content: "\e004"; }

.icon-arrow-down:before {
  content: "\e005"; }

.icon-info:before {
  content: "\e006"; }

.icon-navicon:before {
  content: "\e007"; }

.icon-behance:before {
  content: "\e008"; }

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

.icon-github:before {
  content: "\e00a"; }

.icon-googleplus:before {
  content: "\e00b"; }

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

.icon-linkedin:before {
  content: "\e00d"; }

.icon-pinterest:before {
  content: "\e00e"; }

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

.icon-vimeo:before {
  content: "\e010"; }

.icon-close:before {
  content: "\e011"; }

.icon-slash {
  display: none; }

.icon-arrow-left:before {
  content: "";
  width: 14px;
  height: 24px;
  display: inline-block;
  text-indent: -99999px;
  overflow: hidden;
  background: url(../images/icons-horiz-blk.svg) no-repeat left bottom;
  margin-right: 14px;
  position: relative;
  top: 4px; }
  @media screen and (min-width: 500px) {
    .icon-arrow-left:before {
      top: 6px; } }
  @media screen and (min-width: 768px) {
    .icon-arrow-left:before {
      top: 9px; } }
  @media screen and (min-width: 960px) {
    .icon-arrow-left:before {
      top: 9px; } }

.icon-arrow-right:before {
  content: "";
  width: 14px;
  height: 24px;
  display: inline-block;
  text-indent: -99999px;
  overflow: hidden;
  background: url(../images/icons-horiz-blk.svg) no-repeat right bottom;
  margin-left: 14px;
  position: relative;
  top: 4px; }
  @media screen and (min-width: 500px) {
    .icon-arrow-right:before {
      top: 6px; } }
  @media screen and (min-width: 768px) {
    .icon-arrow-right:before {
      top: 9px; } }
  @media screen and (min-width: 960px) {
    .icon-arrow-right:before {
      top: 9px; } }

.icon-arrow-up:before {
  content: "\e004"; }

.icon-arrow-down:before {
  content: "\e005"; }

/*	- Typography
   ========================================================================== */
html {
  color: #000;
  font: 300 .875em/1.5em "Calibre Light", sans-serif; }

@media screen and (min-width: 500px) {
  html {
    font-size: 1em; } }
@media screen and (min-width: 960px) {
  html {
    font-size: 1.125em; } }
.hr, hr {
  border: 0;
  border-top: 1px solid #0081af;
  height: 0;
  margin: 40px 0; }

@media screen and (min-width: 500px) {
  .hr, hr {
    margin: 60px 0; } }
@media screen and (min-width: 960px) {
  .hr, hr {
    margin: 80px 0; } }
h1, h2, h3, h4, h5, h6 {
  font-weight: normal;
  line-height: 1.25;
  position: relative; }

h1 .icon-slash,
h2 .icon-slash,
h3 .icon-slash,
h4 .icon-slash,
h5 .icon-slash,
h6 .icon-slash {
  bottom: 100%;
  font-size: .625em;
  margin-right: -.3125em;
  position: absolute;
  right: 100%;
  color: #0081af; }

a {
  color: #000;
  text-decoration: none;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0.2); }

/*	Entry content
   .......................................................................... */
.plain-content {
  padding: 40px 20px;
  max-width: 960px;
  margin: 0 auto; }

.entry-content h1 {
  font-size: 2em;
  margin: .67em 0; }

.entry-content h2 {
  font-size: 1.5em;
  margin: .75em 0; }

.entry-content .lead-title {
  color: #000000; }

.entry-content h3 {
  font-size: 1.17em;
  margin: .83em 0; }

.entry-content h5 {
  font-size: .83em;
  margin: 1.5em 0; }

.entry-content h6 {
  font-size: .75em;
  margin: 1.67em 0; }

.entry-content p a {
  margin: -.5em;
  padding: .5em;
  position: relative;
  color: #000;
  text-decoration: underline; }

.entry-content p a:hover {
  text-decoration: none; }

.entry-content h4,
.entry-content p,
.entry-content blockquote,
.entry-content pre,
.entry-content address,
.entry-content dl,
.entry-content ol,
.entry-content ul,
.entry-content table {
  margin: 1.12em 0; }

.entry-content ol,
.entry-content ul {
  padding: 0 0 0 1.5em; }

.entry-content ol li {
  list-style: decimal outside; }

.entry-content ul li {
  list-style: disc outside; }

.entry-content li ol,
.entry-content li ul {
  margin: 0; }

.entry-content dd {
  margin: 0 0 0 1.5em; }

.entry-content h1:first-child,
.entry-content h2:first-child,
.entry-content h3:first-child,
.entry-content h4:first-child,
.entry-content h5:first-child,
.entry-content h6:first-child,
.entry-content p:first-child,
.entry-content blockquote:first-child,
.entry-content pre:first-child,
.entry-content address:first-child,
.entry-content dl:first-child,
.entry-content ol:first-child,
.entry-content ul:first-child,
.entry-content table:first-child {
  margin-top: 0; }

.entry-content h1:last-child,
.entry-content h2:last-child,
.entry-content h3:last-child,
.entry-content h4:last-child,
.entry-content h5:last-child,
.entry-content h6:last-child,
.entry-content p:last-child,
.entry-content blockquote:last-child,
.entry-content pre:last-child,
.entry-content address:last-child,
.entry-content dl:last-child,
.entry-content ol:last-child,
.entry-content ul:last-child,
.entry-content table:last-child {
  margin-bottom: 0; }

.post-content img {
  margin: 30px 0px;
  display: block;
  width: 100%;
  height: auto; }

.post-content .instagram-imgwrap img {
  margin-top: 0; }

.post-content .aligncenter {
  width: auto;
  max-width: 100%;
  margin: 30px auto; }

.post header img {
  width: 100%;
  height: auto; }

.entry-content iframe {
  width: 100%;
  height: 366px;
  display: block; }

/*	CSS columns
   .......................................................................... */
@media screen and (min-width: 500px) {
  .columnize {
    -webkit-column-count: 2;
    -moz-column-count: 2;
    -ms-column-count: 2;
    -o-column-count: 2;
    column-count: 2;
    -webkit-column-gap: 20px;
    -moz-column-gap: 20px;
    -ms-column-gap: 20px;
    -o-column-gap: 20px;
    column-gap: 20px; }

  .no-csscolumns .columnize {
    margin: 0 -10px; }

  .no-csscolumns .columnize .column {
    padding: 0 10px; } }
@media screen and (min-width: 960px) {
  .columnize {
    -webkit-column-count: 2;
    -moz-column-count: 2;
    -ms-column-count: 2;
    -o-column-count: 2;
    column-count: 2;
    -webkit-column-gap: 40px;
    -moz-column-gap: 40px;
    -ms-column-gap: 40px;
    -o-column-gap: 40px;
    column-gap: 40px; }

  .no-csscolumns .columnize {
    margin: 0 -20px; }

  .no-csscolumns .columnize .column {
    padding: 0 20px; } }
/*	Selection pseudo-elements
   .......................................................................... */
::-moz-selection {
  background: rgba(0, 0, 0, 0.99);
  color: #fff;
  text-shadow: none; }

::selection {
  background: rgba(0, 0, 0, 0.99);
  color: #fff;
  text-shadow: none; }

/*	- Root elements
   ========================================================================== */
html {
  height: 100%; }

body {
  height: 100%;
  overflow-y: scroll; }

.hidden {
  display: none;
  visibility: hidden; }

/*	- Forms
   ========================================================================== */
/*	Fieldset
   .......................................................................... */
/*	Form fields
   .......................................................................... */
.form-fields {
  list-style: none;
  margin: 0; }

.form-fields > li:not(:last-child) {
  margin-bottom: 1em; }

/*	Label
   .......................................................................... */
label {
  display: inline-block;
  vertical-align: top; }

/*	Text inputs
   .......................................................................... */
.text-input {
  color: inherit;
  -webkit-appearance: none; }

.text-input:focus {
  outline: 0; }

textarea.text-input {
  height: auto;
  line-height: 1;
  resize: vertical; }

::-webkit-input-placeholder {
  color: #999; }

::-moz-placeholder {
  color: #999;
  opacity: 1; }

:-ms-input-placeholder {
  color: #999; }

/*	Buttons
   .......................................................................... */
.button {
  border: 0;
  display: inline-block;
  margin: 0;
  padding: 0;
  text-align: center;
  text-decoration: none;
  vertical-align: top; }

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

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

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

/*	- Tables
   ========================================================================== */
th,
td {
  border: 1px solid #ccc;
  padding: 5px 10px; }

th {
  text-align: left; }

/*	LAYOUT
   ==========================================================================
   ========================================================================== */
/*	- Containers
   ========================================================================== */
.container {
  border: solid transparent;
  border-width: 0 20px;
  margin: 0 auto;
  max-width: 1380px;
  position: relative; }

@media screen and (min-width: 500px) {
  .container {
    border-width: 0 40px; } }
@media screen and (min-width: 960px) {
  .container {
    border-width: 0 80px; } }
.no-lastchild .container {
  max-width: 1 500px; }

.container.md {
  max-width: 1280px; }

.container.topchild {
  padding-top: 0 !important; }

/*	- Toast logo
   ========================================================================== */
.toast-logo {
  display: inline-block;
  width: 135px;
  height: 41px;
  background: url("../images/toast-logo.svg") no-repeat center center;
  -webkit-transition: 0.6s;
  -moz-transition: 0.6s;
  -ms-transition: 0.6s;
  -o-transition: 0.6s;
  transition: 0.6s;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -ms-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  z-index: 5; }
  @media screen and (min-width: 768px) and (min-height: 460px) {
    .toast-logo {
      width: 207px;
      height: 65px; } }

.toast-logo.reverse {
  background: url("../images/toast-logo-reverse.svg") no-repeat center center;
  opacity: 0;
  display: none;
  visibility: hidden; }

/*	- Header
   ========================================================================== */
#mfPreviewBar {
  height: 0 !important;
  padding: 0 !important; }

.header {
  position: fixed;
  top: 0;
  background: #fff;
  right: 0;
  -webkit-transition: 0.6s;
  -moz-transition: 0.6s;
  -ms-transition: 0.6s;
  -o-transition: 0.6s;
  transition: 0.6s;
  width: 100%;
  height: 100px;
  z-index: 1000; }
  .header > .container,
  .header .navbar {
    position: absolute;
    bottom: 0;
    width: 100%;
    -webkit-transition: 0.4s;
    -moz-transition: 0.4s;
    -ms-transition: 0.4s;
    -o-transition: 0.4s;
    transition: 0.4s; }
    .header > .container > .container,
    .header .navbar > .container {
      height: 70px; }
  .header .toast-logo {
    position: absolute; }

.header.sticky {
  height: 109px; }
  @media screen and (min-width: 768px) and (min-height: 460px) {
    .header.sticky .toast-logo {
      width: 160px;
      height: 50px; } }
  .header.sticky .feattag {
    display: none;
    visibility: hidden; }

.mainwrapper {
  background-color: #fff; }
  @media screen and (min-width: 768px) and (min-height: 460px) {
    .mainwrapper {
      padding-top: 100px; } }

.single-project .main {
  z-index: 1; }
.single-project .mainwrapper {
  padding-top: 100px; }

@media screen and (min-width: 768px) and (min-height: 460px) {
  .header {
    height: 150px; }
    .header .toast-logo {
      position: absolute;
      bottom: 36px;
      left: 0; }
    .header .toast-logo.non-reverse.desktop {
      opacity: 1;
      display: block;
      visibility: visible; }

  .header.sticky {
    width: 100%; }

  .mainwrapper {
    padding-top: 150px; }

  .single-project .mainwrapper,
  .the-studio .mainwrapper {
    padding-top: 100px; } }
@media screen and (min-width: 768px) and (min-height: 460px) {
  body.home.first-visit .nonsticky.header {
    position: absolute; } }
@media screen and (min-width: 960px) {
  .header .toast-logo {
    bottom: 36px; } }
/*
@media (max-height:460px){
	.header {
		position: fixed;
		top:0;
		height: 70px;

	}
}
*/
body.home.first-visit .header.nonsticky {
  background: transparent; }
  @media screen and (min-width: 768px) and (min-height: 460px) {
    body.home.first-visit .header.nonsticky {
      background: #fff; } }

header.sticky {
  background: #fff; }

/*	Site logo
   .......................................................................... */
.site-logo {
  left: 0;
  margin-top: -30px;
  position: absolute;
  top: 50%; }

@media screen and (min-width: 500px) {
  .site-logo {
    margin-top: -36px; } }
@media screen and (min-width: 1280px) {
  .site-logo {
    margin-top: -48px; } }
.site-logo .icon-toast {
  float: left;
  font-size: 60px;
  margin-right: .25em;
  vertical-align: top; }

@media screen and (min-width: 500px) {
  .site-logo .icon-toast {
    font-size: 72px; } }
@media screen and (min-width: 1280px) {
  .site-logo .icon-toast {
    font-size: 96px; } }
.site-logo .slash-container {
  height: 0;
  position: absolute;
  width: 0; }

@media screen and (min-width: 768px) {
  .site-logo .slash-container {
    left: 36px;
    top: 36px; } }
@media screen and (min-width: 1280px) {
  .site-logo .slash-container {
    left: 48px;
    top: 48px; } }
.site-logo .icon-slash {
  display: none; }

@media screen and (min-width: 768px) {
  .site-logo .icon-slash {
    color: #0081af;
    display: block;
    font-size: 0;
    left: -.5em;
    position: absolute;
    top: -.5em; } }
.marquee {
  float: left;
  line-height: 1;
  margin-top: 10px;
  text-transform: uppercase; }

@media screen and (min-width: 500px) {
  .marquee {
    line-height: 1.125;
    margin-top: 9px; } }
@media screen and (min-width: 1280px) {
  .marquee {
    line-height: 1.25;
    margin-top: 17px; } }
.marquee span {
  display: block;
  position: relative; }

/*	Navicon
   .......................................................................... */
.navicon {
  border: 0;
  color: #fff;
  margin-top: -20px;
  padding: 8px;
  position: absolute;
  right: 0;
  top: 50%; }

@media screen and (min-width: 500px) {
  .navicon {
    margin-top: -24px; } }
@media screen and (min-width: 768px) {
  .navicon {
    display: none; } }
.navicon .icon-navicon {
  font-size: 24px;
  vertical-align: middle; }

@media screen and (min-width: 500px) {
  .navicon .icon-navicon {
    font-size: 32px; } }
.no-js .navicon {
  display: inherit; }

/*	- Navigation
   ========================================================================== */
.nav:target {
  display: block; }

.nav {
  background: #3d3834;
  float: right; }

.nav-item-contact .swap {
  display: none; }

.nav-item-contact a {
  padding-right: 0 !important; }

@media screen and (min-width: 960px) {
  .nav-item-contact span {
    position: relative;
    z-index: 2; }

  .nav-item-contact .swap {
    color: #190907;
    position: absolute;
    top: 0;
    right: 10px;
    z-index: 1;
    display: block;
    text-align: right; }

  .nav-item-contact:hover span {
    /* color: #190907; */ }

  .nav-item-contact:hover .swap {
    /* z-index: 3; */
    /* color: #0081af; */ } }
/*	Main menu
   .......................................................................... */
.main-menu {
  font-family: "Nexa", sans-serif;
  font-weight: 700;
  text-transform: uppercase; }

@media screen and (min-width: 768px) {
  .main-menu {
    font-size: 0;
    margin-top: 4px; } }
.main-menu li {
  border-bottom: 1px solid rgba(255, 255, 255, 0.1); }

.main-menu li:first-child {
  font-weight: 300; }

.main-menu li:last-child {
  display: none; }

@media screen and (min-width: 768px) {
  .main-menu li {
    border: 0;
    display: inline-block;
    font-size: 13px; }

  .main-menu li:nth-child(1),
  .main-menu li:nth-child(2) {
    display: none; }

  .main-menu li:last-child {
    display: inline-block;
    margin-left: 48px; } }
@media screen and (min-width: 1280px) {
  .main-menu li:last-child {
    margin-left: 96px; } }
.main-menu a {
  color: #fff;
  display: block;
  line-height: 2.857;
  -moz-transition: .6s;
  -ms-transition: .6s;
  -o-transition: .6s;
  -webkit-transition: .6s;
  transition: .6s; }

@media screen and (min-width: 768px) {
  .main-menu a {
    padding: 0 16px; } }
@media screen and (min-width: 1280px) {
  .main-menu a {
    line-height: 3.333;
    padding: 0 10px; } }
.main-menu a:hover {
  color: #000; }

.main-menu .active a {
  color: #000; }

/*	Hero
   ========================================================================== */
.hero-wrap {
  width: 100%;
  position: relative;
  z-index: 100; }

.hero-movie {
  width: 100%;
  height: 100%;
  position: fixed;
  top: 72px;
  z-index: 10;
  background: #000; }

@media screen and (min-width: 768px) {
  .hero-movie {
    top: 0; } }
.hero-movie img {
  width: 100%;
  height: auto;
  position: absolute;
  top: 0;
  -moz-transition-duration: .1s;
  -ms-transition-duration: .1s;
  -o-transition-duration: .1s;
  -webkit-transition-duration: .1s;
  transition-duration: .1s; }

.hero.container {
  background: #fff;
  border-width: 20px 20px 0; }

.offcanvasnav .hero-wrap {
  left: 15em; }

@media screen and (min-width: 768px) {
  .offcanvasnav .hero-wrap {
    left: auto; } }
.no-lastchild .hero.container {
  max-width: 1720px; }

.hero-outer-wrap {
  height: 0;
  padding-top: 25%;
  position: relative;
  overflow: hidden; }

.large .hero-outer-wrap {
  padding-top: 37.5%; }

.hero-inner-wrap {
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%; }

.home .hero a {
  display: block; }

.hero-info {
  z-index: 2;
  background: rgba(28, 15, 9, 0.95);
  bottom: 33px;
  height: 140px;
  max-width: 390px;
  padding: 20px 60px 20px 20px;
  position: absolute;
  right: -400px;
  -webkit-transition: all .27s ease-out;
  -moz-transition: all .27s ease-out;
  -o-transition: all .27s ease-out;
  transition: all .27s ease-out;
  color: #b4b1ae;
  display: none; }

.hero-info span {
  color: #fff; }

.hero-info a {
  color: #0081af; }

.hero-info a:hover {
  color: #000; }

.large.hero .slides .show-info {
  position: absolute;
  bottom: 33px;
  right: 0;
  width: 40px;
  background: #fff;
  height: 140px;
  z-index: 10;
  text-align: center;
  line-height: 140px;
  font-size: 24px;
  display: none; }

.hero-info.active {
  right: 0; }

.hero-info .icon-arrow-right {
  position: relative;
  top: 2px; }

@media screen and (min-width: 56em) {
  .large.hero .slides .hero-info, .large.hero .slides .show-info {
    display: block; } }
/*	Page title
   .......................................................................... */
.page-title {
  position: relative;
  padding: 40px auto;
  display: block; }

.large.hero .page-title {
  pointer-events: none; }

@media screen and (min-width: 500px) {
  .page-title {
    padding: 60px 0; } }
@media screen and (min-width: 1280px) {
  .page-title {
    padding: 60px 0; } }
@media screen and (min-width: 90em) {
  .page-title {
    padding: 60px 0; } }
@media screen and (min-width: 115em) {
  .page-title {
    padding: 60px 0; } }
.page-title h1 {
  color: #0081af;
  font-size: 0;
  letter-spacing: -.025em;
  line-height: 1;
  margin: 0; }

.page-title h1 span {
  background: #fff;
  display: inline-block;
  font-size: 30px;
  padding: 5px 10px; }

@media screen and (min-width: 500px) {
  .page-title h1 span {
    font-size: 60px;
    padding: 10px 0; } }
@media screen and (min-width: 1280px) {
  .page-title h1 span {
    font-size: 90px;
    padding: 15px 0; } }
@media screen and (min-width: 90em) {
  .page-title h1 span {
    font-size: 120px;
    padding: 20px 0; } }
@media screen and (min-width: 115em) {
  .page-title h1 span {
    font-size: 150px;
    line-height: 185px;
    padding: 25px 0; }

  .page-title.multi h1 span {
    line-height: 150px; } }
.page-title h1 span:first-child {
  padding-bottom: 0; }

.page-title h1 span + span {
  background: none;
  display: block;
  padding-bottom: 0;
  padding-top: 0; }

/*	- Main
   ========================================================================== */
.main .container {
  padding: 20px 0;
  overflow: hidden; }

@media screen and (min-width: 500px) {
  padding: 60px 0; }
@media screen and (min-width: 960px) {
  .main .container {
    padding: 60px 0; } }
@media screen and (max-width: 37.438em) {
  .our-work .main .container {
    padding-top: 0; } }
/*	Section title
   .......................................................................... */
.section-title {
  font-size: 1.4em;
  margin-bottom: .67em;
  font-family: 'Calibre Thin', sans-serif;
  font-size: 71px; }

.section-header {
  overflow: hidden; }

/*	Brand bar
   .......................................................................... */
.brand-bar {
  background: #fff;
  border-bottom: 1px solid #0081af;
  line-height: 39px;
  min-height: 40px;
  position: relative;
  z-index: 1;
  position: fixed;
  width: 100%;
  z-index: 90;
  left: 0;
  top: 72px;
  display: none; }

@media screen and (min-width: 500px) {
  .brand-bar {
    margin: 0 -20px; } }
@media screen and (min-width: 960px) {
  .brand-bar {
    display: block;
    line-height: 59px;
    margin: 0;
    min-height: 60px; } }
@media screen and (max-width: 59.938em) {
  .work .brand-bar {
    margin-top: -40px; } }
.no-csscalc .brand-bar.sticky {
  width: 100%; }

/*	Sub-navigation
   .......................................................................... */
.sub-menu {
  font-family: "Nexa", sans-serif;
  text-align: center;
  text-transform: uppercase; }

.sub-menu .archive-link {
  opacity: 0.45;
  position: absolute;
  right: 22px !important; }

.sub-menu.isotope-filter {
  display: none; }

@media screen and (min-width: 960px) {
  .sub-menu.isotope-filter {
    display: block; } }
.sub-menu li {
  border-top: 1px solid #0081af;
  display: block;
  vertical-align: top; }

@media screen and (min-width: 500px) {
  .sub-menu li {
    border: 0;
    display: inline-block; } }
.sub-menu a {
  color: #000;
  display: block;
  padding: 0 1em; }

@media screen and (min-width: 500px) {
  .sub-menu a {
    padding: 0 1.5em; } }
@media screen and (min-width: 960px) {
  .sub-menu a {
    padding: 0 2em; } }
.sub-menu a:hover,
.sub-menu a.active {
  color: #190907; }

/*	Margined
   .......................................................................... */
.margined {
  margin-bottom: 40px;
  margin-top: 40px; }

.margined-top {
  margin-top: 40px; }

.margined-bottom {
  margin-bottom: 40px; }

@media screen and (min-width: 500px) {
  .margined {
    margin-bottom: 40px;
    margin-top: 40px; }

  .margined-top {
    margin-top: 40px; }

  .margined-bottom {
    margin-bottom: 40px; } }
@media screen and (min-width: 960px) {
  .margined {
    margin-bottom: 60px;
    margin-top: 60px; }

  .margined-top {
    margin-top: 60px; }

  .margined-bottom {
    margin-bottom: 60px; } }
.margined:first-child {
  margin-top: 0; }

.margined:last-child {
  margin-bottom: 0; }

/*	Padded
   .......................................................................... */
.padded {
  padding-bottom: 40px;
  padding-top: 40px; }

.padded-top {
  padding-top: 40px; }

.padded-bottom {
  padding-bottom: 40px; }

.padded .text {
  max-width: 700px;
  margin: auto;
  display: none; }

@media screen and (min-width: 500px) {
  .padded {
    padding-bottom: 60px;
    padding-top: 60px; }

  .padded-top {
    padding-top: 60px; }

  .padded-bottom {
    padding-bottom: 60px; } }
@media screen and (min-width: 960px) {
  .padded {
    padding-bottom: 80px;
    padding-top: 80px; }

  .padded-top {
    padding-top: 80px; }

  .padded-bottom {
    padding-bottom: 80px; } }
.padded:first-child {
  padding-top: 0; }

.padded:last-child {
  padding-bottom: 0; }

/*	Pulled
   .......................................................................... */
.pulled {
  margin-left: -20px;
  margin-right: -20px;
  padding-left: 20px;
  padding-right: 20px; }

@media screen and (min-width: 500px) and (max-width: 59.938em) {
  .pulled {
    padding-bottom: 40px;
    padding-top: 40px; } }
@media screen and (min-width: 960px) {
  .pulled {
    margin-left: -60px;
    margin-right: -60px;
    padding-left: 60px;
    padding-right: 60px; } }
/*	Bordered
   .......................................................................... */
.bordered {
  border-top: 1px solid #000; }

.linebtm {
  border-bottom: solid 1px #000; }

/*	Hoverlay
   .......................................................................... */
.hoverlay {
  background-size: cover;
  /*
  	background: #90c4ed;
  	background: rgba(144,196,237,.85);
  */
  color: #fff;
  font-family: 'Calibre Light';
  font-weight: normal;
  font-size: 1em;
  line-height: 1.25em;
  height: 100%;
  left: 0;
  opacity: 0;
  position: absolute;
  top: 0;
  -moz-transition: opacity .2s ease-out;
  -ms-transition: opacity .2s ease-out;
  -o-transition: opacity .2s ease-out;
  -webkit-transition: opacity .2s ease-out;
  transition: opacity .2s ease-out;
  width: 100%;
  z-index: 9; }

.hoverlay img {
  height: 100%;
  left: 0;
  padding: 0 !important;
  position: absolute;
  top: 0;
  width: 100%; }

.no-opacity .hoverlay {
  visibility: hidden; }

.no-rgba .hoverlay {
  background: transparent;
  -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#D890C4ED,endColorstr=#D890C4ED)";
  zoom: 1; }

@media screen and (min-width: 500px) {
  .hoverlay {
    bottom: 0;
    height: auto;
    left: 0;
    right: 0;
    top: 0;
    width: auto; } }
a:hover .hoverlay,
a:focus .hoverlay {
  opacity: 1; }

.no-opacity a:hover .hoverlay,
.no-opacity a:focus .hoverlay {
  visibility: visible; }

.hoverlay-outer-wrap {
  display: block;
  height: 100%;
  width: 100%;
  position: relative;
  background: rgba(0, 0, 0, 0.8); }

.hoverlay-inner-wrap {
  display: block;
  padding: 0 30px;
  text-align: left;
  vertical-align: middle;
  position: absolute;
  bottom: 30px; }

a:hover .hoverlay .hoverlay-inner-wrap {
  -webkit-animation: fadeinfromleft 0.8s ease-in;
  -moz-animation: fadeinfromleft 0.8s ease-in;
  -ms-animation: fadeinfromleft 0.8s ease-in;
  -o-animation: fadeinfromleft 0.8s ease-in;
  animation: fadeinfromleft 0.8s ease-in; }

.hoverlay-title {
  display: inline;
  font-size: 24px; }

.hoverlay .continual {
  display: none;
  font-size: 80%;
  margin-top: .75em; }

/*	Intro content
   .......................................................................... */
.intro-content {
  font-size: 1.0625em; }

.intro-content .lead {
  font-family: "Nexa", sans-serif;
  font-size: 1.0625em; }

@media screen and (min-width: 500px) {
  .intro-content,
  .intro-content .lead {
    font-size: 1.125em; } }
/*	- Footer
   ========================================================================== */
.phonefont {
  font-size: 18px;
  margin-right: 10px;
  letter-spacing: .5px; }

/* Layout 
-------------------------------- */
.footer {
  padding-bottom: 20px; }

.branches-wrap {
  margin: 20px auto;
  overflow: hidden;
  width: 231px;
  text-align: center; }

.footer .social-networks {
  display: block;
  text-align: center;
  clear: both;
  float: none; }

.disclaimer {
  clear: both;
  float: none;
  text-align: center; }

.footerlogo {
  display: none;
  width: 98px;
  height: 31px;
  background: url("../images/toast-logo-reverse.svg") no-repeat center center;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -ms-background-size: cover;
  -o-background-size: cover;
  background-size: cover; }

@media screen and (min-width: 670px) {
  .footerlogo {
    display: inline-block; }

  .branches-wrap {
    margin: auto;
    text-align: left; } }
@media screen and (min-width: 670px) {
  .footer {
    padding-bottom: 0; }
    .footer .footerlogo {
      margin: 18px 0; }

  .branches-wrap {
    float: left; }

  .footer .social-networks {
    clear: none;
    float: right;
    margin-left: 20px; }

  .disclaimer {
    margin: 26px 0;
    text-align: right;
    clear: none; } }
/* Branches 
-------------------------------- */
.branches {
  padding-top: 18px;
  float: left;
  padding-top: 18px; }

.branches-wrap img {
  display: block;
  float: left; }

.branches h5 {
  text-transform: uppercase;
  font-size: 13px;
  margin-bottom: 4px;
  padding-left: 11px; }

.footer-wrap {
  background: #000;
  clear: both;
  position: relative;
  z-index: 9; }
  .footer-wrap .phonefont {
    font-family: "Calibre Semibold", helvetica, sans-serif;
    font-weight: normal;
    font-size: 18px;
    margin-right: 10px; }

.footer {
  border-top-width: 0;
  color: #fff; }

/* Social network 
-------------------------------- */
.footer .social-networks {
  margin-top: 17px; }

@media screen and (min-width: 670px) {
  .footer .social-networks {
    margin-top: 26px; } }
@media screen and (min-width: 960px) {
  .footer .social-networks {
    font-size: .889em; } }
@media screen and (min-width: 1280px) {
  .footer .social-networks {
    font-size: 13px; } }
.standout {
  font-family: "Calibre Semibold", helvetica, sans-serif;
  font-weight: normal;
  font-size: 18px;
  margin-right: 10px;
  letter-spacing: .5px; }

/* Disclaimer 
-------------------------------- */
.disclaimer {
  font-size: 12px;
  line-height: 14px;
  margin-top: 6px; }
  @media screen and (min-width: 670px) {
    .disclaimer {
      float: right; } }

.disclaimer li {
  display: inline-block;
  margin-right: 0;
  margin-left: 5px; }

.disclaimer a {
  font-weight: bold; }

.dark-background .footer .container {
  background: #3d3834;
  color: #fff; }

.footer a {
  color: #fff; }

.dark-background .footer a {
  color: #fff; }

.footer a:hover {
  text-decoration: underline; }

/*	Business card
   .......................................................................... */
@media screen and (min-width: 500px) {
  .footer .business-card {
    float: left; } }
.footer-logo {
  display: inline-block;
  margin-bottom: 10px; }

@media screen and (min-width: 500px) {
  .footer-logo {
    float: left;
    margin-bottom: 0;
    margin-right: 1.25em; } }
.footer-logo .icon-toast {
  font-size: 60px;
  vertical-align: middle; }

@media screen and (min-width: 500px) {
  .footer-logo .icon-toast {
    font-size: 72px; } }
@media screen and (min-width: 1280px) {
  .footer-logo .icon-toast {
    font-size: 96px; } }
.footer .vcard {
  line-height: 1.25;
  text-transform: uppercase;
  font-size: 15px; }

@media screen and (min-width: 500px) {
  .footer .vcard {
    float: left;
    margin-top: 2px; } }
@media screen and (min-width: 960px) {
  .footer .vcard {
    font-size: .889em; } }
@media screen and (min-width: 1280px) {
  .footer .vcard {
    margin-top: 11px;
    font-size: 1em; } }
.footer .vcard .tel {
  font-weight: bold;
  margin-bottom: .5em; }

/*	Social networks
   .......................................................................... */
.social-networks {
  line-height: 1; }

.social-networks li {
  margin-right: .444em;
  font-size: 12px; }

.social-networks li:last-child {
  margin-right: 0; }

.social-networks a:hover {
  opacity: .5; }

.social-networks a:hover {
  text-decoration: none !important; }

.social-networks [class*=icon-] {
  font-size: 2em;
  vertical-align: middle; }

/*	PAGES
   ==========================================================================
   ========================================================================== */
/*	- Home
   ========================================================================== */
/*	Intro content
   .......................................................................... */
.home .intro-content {
  padding-bottom: 0; }

.homepage-intro {
  text-align: left;
  max-width: 850px;
  margin: 40px auto; }

.homepage-intro .ttl {
  text-transform: uppercase;
  font-size: 30px;
  color: #0081ad;
  margin-bottom: 0;
  font-family: 'Calibre Semibold';
  font-weight: normal; }

.homepageintro {
  text-align: left; }
  .homepageintro h1, .homepageintro h2, .homepageintro h3 {
    font-weight: 700; }
    .homepageintro h1 em, .homepageintro h2 em, .homepageintro h3 em {
      display: block;
      font-style: normal;
      font-weight: normal; }
  .homepageintro h1, .homepageintro h3 {
    font-size: 1.5em;
    max-width: 500px; }
  .homepageintro h2 {
    font-size: 1.4em;
    max-width: 450px; }
  @media screen and (min-width: 768px) {
    .homepageintro h1, .homepageintro h2, .homepageintro h3 {
      font-size: 2em; } }
  .homepageintro.slogan {
    float: right;
    text-align: right; }

.homepage-intro .subttl {
  margin-top: 0;
  text-transform: uppercase;
  line-height: 32px;
  font-weight: 400;
  font-size: 24px;
  color: #0081ad;
  font-family: 'Calibre Semibold';
  font-weight: normal; }

.homepageintro .brand-crafted-thinking {
  width: 125px !important;
  margin-bottom: 25px; }
  .homepageintro .brand-crafted-thinking img {
    width: 125px;
    opacity: 1 !important; }
  @media screen and (min-width: 768px) {
    .homepageintro .brand-crafted-thinking {
      width: 160px !important; }
      .homepageintro .brand-crafted-thinking img {
        width: 150px; } }

@media screen and (min-width: 768px) {
  .homepage-intro {
    margin: 90px auto; }

  .homepage-intro .ttl {
    font-size: 44px; }

  .homepage-intro .subttl {
    font-size: 34px;
    line-height: 40px; } }
@media screen and (min-width: 960px) {
  .homepage-intro .ttl {
    font-size: 54px; }

  .homepage-intro .subttl {
    font-size: 50px;
    line-height: 60px; } }
@media screen and (min-width: 1280px) {
  .homepage-intro .ttl {
    font-size: 64px; }

  .homepage-intro .subttl {
    font-size: 53px;
    line-height: 64px; } }
/*	Featured list
   .......................................................................... */
.featured-list {
  margin-top: -20px; }

@media screen and (min-width: 670px) {
  .featured-list {
    margin: 0 -10px -10px -10px; } }
@media screen and (min-width: 670px) {
  .featured-list > div {
    height: 0;
    position: relative; } }
.featured-list-item {
  display: block;
  position: relative;
  -webkit-tap-highlight-color: transparent; }

@media screen and (min-width: 670px) {
  .featured-list-item {
    position: absolute; } }
.featured-list-item img {
  max-width: none;
  width: 100%; }

@media screen and (min-width: 670px) {
  .featured-list-item img {
    height: 100%;
    left: 0;
    padding: 10px;
    position: absolute;
    top: 0;
    width: 100%; } }
/*	One item container
   .................................. */
@media screen and (min-width: 670px) {
  .featured-list .one-item-container {
    padding-top: 40%; }

  .one-item-container .featured-list-item:nth-child(1) {
    height: 100%;
    left: 0;
    top: 0;
    width: 100%; } }
/*	Two items container
   .................................. */
@media screen and (min-width: 670px) {
  .featured-list .two-items-container {
    padding-top: 30%; }

  .two-items-container .featured-list-item:nth-child(1) {
    height: 100%;
    left: 0;
    top: 0;
    width: 50%; }

  .two-items-container .featured-list-item:nth-child(2) {
    height: 100%;
    right: 0;
    top: 0;
    width: 50%; } }
/*	Three items container
   .................................. */
@media screen and (min-width: 670px) {
  .featured-list .three-items-container {
    padding-top: 60%; }

  .three-items-container .featured-list-item:nth-child(1) {
    height: 50%;
    left: 0;
    top: 0;
    width: 50%; }

  .three-items-container .featured-list-item:nth-child(2) {
    bottom: 0;
    height: 50%;
    left: 0;
    width: 50%; }

  .three-items-container .featured-list-item:nth-child(3) {
    height: 100%;
    right: 0;
    top: 0;
    width: 50%; } }
/*	Four items container
   .................................. */
@media screen and (min-width: 670px) {
  .featured-list .four-items-container {
    padding-top: 62%; }

  .four-items-container .featured-list-item:nth-child(1) {
    height: 40%;
    left: 0;
    top: 0;
    width: 33.3334%; }

  .four-items-container .featured-list-item:nth-child(2) {
    height: 60%;
    right: 0;
    top: 0;
    width: 66.6668%; }

  .four-items-container .featured-list-item:nth-child(3) {
    bottom: 0;
    height: 60%;
    left: 0;
    width: 33.3334%; }

  .four-items-container .featured-list-item:nth-child(4) {
    bottom: 0;
    height: 40%;
    right: 0;
    width: 66.6668%; } }
/*	Six items container
   .................................. */
@media screen and (min-width: 670px) {
  .featured-list .six-items-container {
    padding-top: 70%; }

  .six-items-container .featured-list-item:nth-child(1) {
    height: 35%;
    left: 0;
    top: 0;
    width: 33.3334%; }

  .six-items-container .featured-list-item:nth-child(2) {
    height: 50%;
    left: 33.3334%;
    top: 0;
    width: 33.3334%; }

  .six-items-container .featured-list-item:nth-child(3) {
    top: 0;
    height: 50%;
    right: 0;
    width: 33.3334%; }

  .six-items-container .featured-list-item:nth-child(4) {
    bottom: 0;
    height: 65%;
    left: 0;
    width: 33.3334%; }

  .six-items-container .featured-list-item:nth-child(5) {
    bottom: 0;
    height: 50%;
    left: 33.3334%;
    width: 33.3334%; }

  .six-items-container .featured-list-item:nth-child(6) {
    bottom: 0;
    height: 50%;
    right: 0;
    width: 33.3334%; } }
/*	Five items container
   .................................. */
@media screen and (min-width: 670px) {
  .featured-list .five-items-container {
    padding-top: 86%; }

  .five-items-container .featured-list-item:nth-child(1) {
    height: 72%;
    left: 0;
    top: 0;
    width: 66.6668%; }

  .five-items-container .featured-list-item:nth-child(2) {
    height: 37%;
    right: 0;
    top: 0;
    width: 33.3334%; }

  .five-items-container .featured-list-item:nth-child(3) {
    top: 37%;
    height: 22%;
    right: 0;
    width: 33.3334%; }

  .five-items-container .featured-list-item:nth-child(4) {
    bottom: 0;
    height: 28%;
    left: 0;
    width: 66.6668%; }

  .five-items-container .featured-list-item:nth-child(5) {
    bottom: 0;
    height: 41%;
    right: 0%;
    width: 33.3334%; } }
/*	- Work
   ========================================================================== */
.container-wrap {
  position: relative;
  z-index: 5; }

.proj-section-intro {
  position: relative;
  padding-bottom: 33%;
  overflow: hidden;
  z-index: 1; }
  .proj-section-intro .coverfixbkgd-c {
    background-repeat: no-repeat;
    background-position: center top;
    -webkit-background-size: contain;
    -moz-background-size: contain;
    -ms-background-size: contain;
    -o-background-size: contain;
    background-size: contain;
    top: 100px; }

.tags {
  padding: 0 !important;
  margin: 0; }

.tags li {
  display: inline-block;
  list-style: none; }

.tags.reverse a {
  color: #fff; }

.tags a {
  color: #000000;
  font-size: 19px;
  margin-right: 15px;
  font-family: "Calibre Semibold";
  font-style: normal;
  font-weight: normal; }

@media screen and (min-width: 768px) {
  a.tag {
    font-size: 19px; } }
@media screen and (min-width: 960px) {
  a.tag {
    font-size: 29px; } }
@media screen and (min-width: 1280px) {
  a.tag {
    font-size: 39px; } }
.proj-section-intro .img-block {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%; }

.proj-section-intro img {
  -webkit-filter: grayscale(100%);
  -moz-filter: grayscale(100%);
  filter: grayscale(100%);
  width: 100%;
  height: auto; }

/*	Projects list
   .......................................................................... */
.projects-list {
  margin: 0 auto;
  min-height: 100%; }

.loading {
  background: url(../images/ico_loading.gif) no-repeat 50% 80px; }

.projects-list li {
  /* padding: 10px; */ }

@media screen and (max-width: 37.438em) {
  .projects-list li {
    width: 100%;
    /* max-width: 390px; */
    margin: 0 auto;
    padding: 10px 0px; } }
@media screen and (min-width: 960px) {
  .projects-list li {
    float: left;
    width: 33.3334%; } }
@media screen and (min-width: 100em) {
  .projects-list li {
    /* width: 25%; */ } }
.projects-list a {
  display: block;
  position: relative; }

/*	- Work single
   ========================================================================== */
/*	Project details
   .......................................................................... */
.project-details-wrap {
  overflow: hidden;
  margin-top: 20px; }
  @media screen and (min-width: 500px) {
    .project-details-wrap {
      padding: 0 50px; } }

@media screen and (min-width: 768px) {
  .project-details {
    float: left;
    padding-right: 20px;
    width: 65%; } }
@media screen and (min-width: 960px) {
  .project-details {
    max-width: 650px; } }
@media screen and (min-width: 1280px) {
  .project-details {
    width: 75%; } }
.project-details-wrap .section-title {
  margin-bottom: 0;
  font-size: 44px;
  line-height: 44px;
  position: relative;
  left: -0; }

@media screen and (min-width: 1280px) {
  .project-details-wrap .section-title {
    font-size: 70px;
    line-height: 69px; } }
.project-details .lead {
  margin-top: 17px; }

.project-details .follow {
  margin-top: 1.12em; }

@media screen and (min-width: 1280px) {
  .project-details .lead {
    float: left;
    padding-right: 40px;
    width: 100%; }

  .project-details .follow {
    float: left;
    margin-top: 0;
    padding-left: 40px;
    width: 66.666%; } }
/*	Deliverables
   .......................................................................... */
@media screen and (min-width: 768px) {
  .deliverables {
    float: left;
    padding-left: 20px;
    width: 35%; } }
@media screen and (min-width: 960px) {
  .deliverables {
    padding-left: 80px; } }
@media screen and (min-width: 1280px) {
  .deliverables {
    width: 25%; } }
.project-socials {
  color: #939191; }

.project-socials a {
  font-size: 1.05em;
  margin-right: 4px;
  display: inline-block;
  color: #000;
  line-height: 1.25em; }

.project-socials li a {
  margin-top: 8px;
  border-bottom: solid 1px #000;
  pointer-events: none; }

.ps-sm-icons {
  display: block;
  margin-top: 30px; }

.project-socials a:hover {
  border-bottom: none; }

.project-socials .ps-sm-icons {
  font-size: 1.5em; }
  .project-socials .ps-sm-icons a:focus, .project-socials .ps-sm-icons a:hover {
    opacity: 0.5; }

.services-list {
  margin-top: 11px; }

.launch-site {
  margin-top: 36px;
  font-weight: bold;
  color: #fff; }

.launch-site:hover {
  text-decoration: underline; }

/*	Previous & next project
   .......................................................................... */
.projects-menu {
  pointer-events: none;
  padding: 15px 0px; }

@media screen and (min-width: 500px) {
  .projects-menu {
    margin-bottom: 0px; } }
@media screen and (min-width: 960px) {
  .no-touch .projects-menu {
    border: 0;
    height: 0;
    left: 0;
    margin-top: 0;
    padding-top: 0;
    position: fixed;
    top: 50%;
    width: 100%;
    z-index: 10; } }
.project-link {
  float: left;
  pointer-events: auto;
  width: 50%; }

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

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

@media screen and (min-width: 960px) {
  .no-touch .project-link {
    background: #fff;
    float: none;
    margin-top: -115px;
    padding: 20px;
    position: absolute;
    top: 0;
    -moz-transition: margin 0.6s cubic-bezier(0.19, 1, 0.22, 1);
    -ms-transition: margin 0.6s cubic-bezier(0.19, 1, 0.22, 1);
    -o-transition: margin 0.6s cubic-bezier(0.19, 1, 0.22, 1);
    -webkit-transition: margin 0.6s cubic-bezier(0.19, 1, 0.22, 1);
    transition: margin 0.6s cubic-bezier(0.19, 1, 0.22, 1);
    width: auto; }

  .no-touch .prev-project {
    left: 0;
    margin-left: -320px; }

  .no-touch .next-project {
    margin-right: -320px;
    right: 0; } }
.no-touch .prev-project:hover {
  margin-left: 0; }

.no-touch .next-project:hover {
  margin-right: 0; }

.project-link .label-wrap {
  white-space: nowrap; }

.project-link .label-wrap span {
  display: inline-block;
  line-height: 2em;
  vertical-align: top; }

@media screen and (min-width: 960px) {
  .no-touch .project-link .label-wrap span {
    display: none; } }
.no-touch .label-wrap .icon-arrow-left,
.no-touch .label-wrap .icon-arrow-right {
  color: #fff;
  display: inline-block;
  line-height: 2em;
  text-align: center;
  width: 2em; }

.label-wrap .icon-arrow-left {
  margin-right: 2px;
  line-height: 2em;
  vertical-align: top; }

.label-wrap .icon-arrow-right {
  margin-left: 2px;
  line-height: 2em;
  vertical-align: top; }

@media screen and (min-width: 960px) {
  .no-touch .label-wrap .icon-arrow-left,
  .no-touch .label-wrap .icon-arrow-right {
    background: transparent;
    border-radius: 0;
    color: #000;
    font-size: 1.50em;
    height: 100%;
    line-height: 230px;
    position: absolute;
    top: 0;
    width: 40px; }

  .no-touch .label-wrap .icon-arrow-left {
    right: -45px; }

  .no-touch .label-wrap .icon-arrow-right {
    left: -45px; } }
.project-link img {
  display: none; }

@media screen and (min-width: 960px) {
  .no-touch .project-link img {
    display: inherit;
    height: 190px;
    width: 280px; } }
/*	Showcase list
   .......................................................................... */
.showcase-list {
  margin-top: 20px; }

@media screen and (min-width: 500px) {
  .showcase-list {
    margin: 40px; } }
@media screen and (min-width: 500px) {
  .showcase-list li {
    height: 0;
    position: relative; } }
.showcase-list-item {
  margin-top: 20px;
  position: relative; }

@media screen and (min-width: 500px) {
  .showcase-list-item {
    margin-top: 0;
    position: absolute; } }
.showcase-list-item img {
  max-width: none;
  width: 100%; }

@media screen and (min-width: 100em) {
  .showcase-list-item .entry-content {
    max-width: 60%; } }
.showcase-list-item .entry-content blockquote {
  font-family: "Apercu", sans-serif;
  font-size: 1.25em;
  overflow: hidden;
  color: #000;
  text-decoration: underline; }

.showcase-list-item:empty {
  display: none; }

@media screen and (min-width: 500px) {
  .showcase-list-item img,
  .showcase-list-item .entry-content {
    height: 100%;
    left: 0;
    padding: 10px;
    position: absolute;
    top: 0;
    width: 100%; }

  .showcase-list-item .entry-content {
    padding: 30px; }

  .showcase-list-item:empty {
    display: block; } }
@media screen and (min-width: 960px) {
  .showcase-list-item .entry-content {
    padding: 50px; } }
/*	Video
   .................................. */
.showcase-list .two-items-container iframe {
  max-width: 960px;
  max-height: 540px;
  margin: 0 auto;
  display: block;
  position: relative;
  z-index: 1; }

.showcase-list .one-item-container .iframe-wrap {
  padding: 10px;
  height: 100%;
  width: 100%; }

/*	One item container
   .................................. */
@media screen and (min-width: 500px) {
  .showcase-list .one-item-container {
    padding-top: 38.2%; }

  .showcase-list .tall.one-item-container {
    padding-top: 60%; }

  .one-item-container .showcase-list-item:nth-child(1) {
    height: 100%;
    left: 0;
    top: 0;
    width: 100%; } }
/*	Two items container
   .................................. */
@media screen and (min-width: 500px) {
  .showcase-list .two-items-container {
    padding-top: 30%; }

  .showcase-list .tall.two-items-container {
    padding-top: 60%; }

  .two-items-container .showcase-list-item:nth-child(1) {
    height: 100%;
    left: 0;
    top: 0;
    width: 50%; }

  .two-items-container .showcase-list-item:nth-child(2) {
    height: 100%;
    right: 0;
    top: 0;
    width: 50%; } }
/*	Three items container
   .................................. */
@media screen and (min-width: 500px) {
  .showcase-list .three-items-container {
    padding-top: 60%; }

  .showcase-list .three-items-container.alt {
    padding-top: 30%; }

  .showcase-list .tall.three-items-container {
    padding-top: 60%; }

  .three-items-container .showcase-list-item:nth-child(1) {
    height: 50%;
    left: 0;
    top: 0;
    width: 50%; }

  .three-items-container .showcase-list-item:nth-child(2) {
    height: 50%;
    left: 0%;
    top: 50%;
    width: 50%; }

  .three-items-container .showcase-list-item:nth-child(3) {
    height: 100%;
    left: 50%;
    top: 0;
    width: 50%; }

  .alt.three-items-container .showcase-list-item:nth-child(1) {
    height: 100%;
    left: 0;
    top: 0;
    width: 50%; }

  .alt.three-items-container .showcase-list-item:nth-child(2) {
    height: 100%;
    left: 50%;
    top: 0;
    width: 25%; }

  .alt.three-items-container .showcase-list-item:nth-child(3) {
    height: 100%;
    left: 75%;
    top: 0;
    width: 25%; }

  .tall.three-items-container .showcase-list-item:nth-child(1) {
    height: 100%;
    left: 0%;
    top: 0;
    width: 50%; }

  .tall.three-items-container .showcase-list-item:nth-child(2) {
    height: 50%;
    left: 50%;
    top: 0;
    width: 50%; }

  .tall.three-items-container .showcase-list-item:nth-child(3) {
    height: 50%;
    left: 50%;
    top: 50%;
    width: 50%; } }
/*	Four items container
   .................................. */
@media screen and (min-width: 500px) {
  .showcase-list .four-items-container {
    padding-top: 60%; }

  .four-items-container .showcase-list-item:nth-child(1) {
    height: 50%;
    left: 0;
    top: 0;
    width: 50%; }

  .four-items-container .showcase-list-item:nth-child(2) {
    bottom: 0;
    height: 50%;
    left: 0;
    width: 25%; }

  .four-items-container .showcase-list-item:nth-child(3) {
    bottom: 0;
    height: 50%;
    left: 25%;
    width: 25%; }

  .four-items-container .showcase-list-item:nth-child(4) {
    height: 100%;
    right: 0;
    top: 0;
    width: 50%; }

  .swap.four-items-container .showcase-list-item:nth-child(1) {
    height: 100%;
    left: 0;
    top: 0;
    width: 50%; }

  .swap.four-items-container .showcase-list-item:nth-child(2) {
    height: 50%;
    left: 50%;
    top: 0;
    width: 50%; }

  .swap.four-items-container .showcase-list-item:nth-child(3) {
    bottom: 0;
    height: 50%;
    left: 50%;
    width: 25%; }

  .swap.four-items-container .showcase-list-item:nth-child(4) {
    bottom: 0;
    height: 50%;
    right: 0;
    width: 25%; } }
/*	Related
   .......................................................................... */
.related-projects-ttl {
  font-size: 36px;
  line-height: 36px;
  margin-bottom: 20px; }

.related.projects-list li {
  padding-top: 10px;
  padding-bottom: 10px; }
  .related.projects-list li img {
    max-width: none;
    width: 100%; }

@media screen and (min-width: 500px) {
  .related.projects-list .ttile-wrap {
    padding-left: 10px;
    padding-right: 10px; }

  .related-projects-ttl {
    margin-left: 10px; } }
@media screen and (min-width: 670px) {
  .related.projects-list .ttile-wrap {
    width: 50%;
    float: left; } }
@media screen and (min-width: 768px) {
  .related.projects-list .ttile-wrap {
    width: 33.333%;
    float: left; }

  .related.projects-list .ttile-wrap:last-child {
    display: none !important; } }
@media screen and (min-width: 1280px) {
  .related.projects-list .ttile-wrap {
    width: 33.333%; } }
/*	- Studio
   ========================================================================== */
.studio-dsk {
  display: none;
  visibility: hidden; }

.studio-mbl {
  display: block;
  visibility: visible; }

@media screen and (min-width: 768px) {
  .studio-dsk {
    display: block;
    visibility: visible; }

  .studio-mbl {
    display: none;
    visibility: hidden; } }
.studio-dsk .container {
  padding-top: 0;
  padding-bottom: 30px; }

/*	About us
   .......................................................................... */
@media screen and (min-width: 960px) {
  .about {
    float: left;
    padding-right: 80px;
    width: 60%;
    margin-bottom: 0; } }
@media screen and (min-width: 1280px) {
  .about {
    padding-right: 240px; } }
/*	Services
   .......................................................................... */
@media screen and (min-width: 960px) {
  .services {
    float: left;
    width: 40%;
    margin-top: 0; } }
@media screen and (min-width: 500px) {
  .services .services-list {
    -moz-column-count: 2;
    -webkit-column-count: 2;
    column-count: 2;
    -ms-column-count: 2;
    -o-column-count: 2; } }
/*	Split content
   .................................. */
.split-content > * {
  margin-top: 20px; }

@media screen and (min-width: 500px) {
  .split-content > * {
    margin-left: auto;
    margin-right: auto;
    margin-top: 30px;
    max-width: 80%; } }
@media screen and (min-width: 960px) {
  .split-content > * {
    margin-top: 40px;
    max-width: 66.667%; } }
@media screen and (min-width: 1280px) {
  .split-content > * {
    float: left;
    margin: 0;
    max-width: none;
    width: 50%; }

  .split-content > *:first-child {
    padding-right: 40px; }

  .split-content > *:last-child {
    padding-left: 40px; } }
.split-content > *:first-child {
  margin-top: 0; }

/*	About us carousel
   .................................. */
.about .flexslider {
  position: relative; }

@media screen and (min-width: 500px) {
  .about .flex-direction-nav {
    bottom: 20px;
    font-size: 0;
    position: absolute;
    right: 20px; }

  .about .flex-direction-nav li {
    display: inline-block;
    font-size: 1.125rem; }

  .about .flex-prev,
  .about .flex-next {
    border-radius: 50%;
    color: #cccbcb;
    display: block;
    font: normal normal 1em/40px "Toast";
    font-variant: normal;
    text-align: center;
    text-transform: none;
    width: 40px;
    speak: none; }

  .about .flex-prev {
    margin-right: 10px; }

  .about .flex-prev:hover,
  .about .flex-next:hover {
    background: #4d3e3c; } }
/*	Our process
   .......................................................................... */
.process {
  	/*
  background-position: 50% 50%;
  	background-repeat: no-repeat;
  	background-size: cover;
  	color: #fff;
  */ }

.process .lead {
  margin-bottom: 20px; }

@media screen and (min-width: 960px) {
  .process .lead {
    float: left;
    margin-bottom: 0;
    padding-right: 40px;
    width: 25%; } }
@media screen and (min-width: 960px) {
  .process-steps {
    float: left;
    margin-top: -18px;
    width: 75%; } }
.process-intro {
  position: relative; }

.process-intro .pullquote {
  font-size: 1.2em;
  text-decoration: underline;
  color: #fff;
  margin-top: 1em;
  padding: 0 1em; }

@media screen and (min-width: 500px) {
  .process-intro .pullquote {
    position: absolute;
    bottom: 10%;
    right: 5%;
    max-width: 40%;
    padding: 0; } }
@media screen and (min-width: 960px) {
  .process-intro .pullquote {
    font-size: 1.6em;
    bottom: 20%;
    right: 10%; } }
@media screen and (min-width: 1280px) {
  .process-intro .pullquote {
    max-width: 30%;
    font-size: 1.8em; } }
.process-steps li {
  background-color: rgba(255, 255, 255, 0.15);
  padding: 40px 20px;
  border-bottom: 1px solid #ddd; }

.process-steps li:last-of-type {
  border-bottom: 0; }

@media screen and (min-width: 960px) {
  .process-steps li {
    background-color: transparent;
    -moz-transition: background-color .2s ease-out;
    -ms-transition: background-color .2s ease-out;
    -o-transition: background-color .2s ease-out;
    -webkit-transition: background-color .2s ease-out;
    transition: background-color .2s ease-out; }

  .process-steps li:hover {
    background-color: #fafafa; } }
.process-steps li:last-child {
  margin-bottom: 0; }

.process-description {
  font-family: "Nexa", sans-serif;
  font-size: 1.05em;
  line-height: 1.125;
  margin-bottom: .5em; }

@media screen and (min-width: 960px) {
  .process-description {
    float: left;
    margin-bottom: 0;
    padding-right: 40px;
    width: 30%; } }
.process-title {
  font-size: 1.174em;
  line-height: inherit;
  margin-bottom: .25em;
  color: #000; }

@media screen and (min-width: 960px) {
  .process-steps li .entry-content {
    float: left;
    width: 70%; } }
/*	Clients
   .......................................................................... */
.clients {
  clear: both; }

.logo-wrap {
  overflow: hidden;
  margin: 0 auto;
  width: 100%; }

.clients-list ul {
  right: -1px;
  position: relative;
  background: #fff; }

.clients li .greyscale {
  display: block;
  zoom: 1;
  filter: alpha(opacity=80);
  opacity: 0.8; }

.clients-list li:hover .greyscale {
  display: none; }

.clients-list ul:before {
  content: "";
  display: block;
  width: 100%;
  height: 1px;
  background: #fff;
  position: absolute;
  bottom: 0;
  left: 0; }

.clients-list li {
  width: 50%;
  padding: 5%;
  float: left;
  text-align: center;
  border-bottom: 1px solid #ddd;
  border-right: 1px solid #ddd;
  text-align: left; }

.clients-list li .inner-wrap {
  position: relative;
  display: inline-block;
  text-align: center; }

.clients-list li img {
  display: none;
  margin: 0 auto; }

.clients-list li:hover img {
  display: block; }

@media screen and (min-width: 32.5em) {
  .clients-list li {
    width: 33.33%;
    padding: 3%; } }
@media screen and (min-width: 500px) {
  .clients-list li {
    width: 25%;
    padding: 2%; } }
@media screen and (min-width: 1280px) {
  .clients-list li {
    width: 20%;
    padding: 2%; } }
.clients .slider-controls {
  display: inline-block;
  margin-left: .5em; }

.clients .slider-controls a {
  background: #000;
  border-radius: 50%;
  color: #fff;
  display: inline-block;
  font-size: .75em;
  line-height: 1.778em;
  margin-top: -.15em;
  text-align: center;
  vertical-align: top;
  width: 1.778em; }

.clients .slider-controls a:hover {
  background: inherit;
  color: inherit; }

.clients .slider-controls a i {
  line-height: 0;
  vertical-align: middle; }

.client-logo-wrap {
  float: left;
  padding: 10px;
  text-align: center;
  width: 50%; }

@media screen and (min-width: 500px) {
  .client-logo-wrap {
    padding: 15px;
    width: 33.333%; } }
@media screen and (min-width: 960px) {
  .client-logo-wrap {
    padding: 20px;
    width: 20%; } }
.clients-list img {
  max-width: 100% !important;
  width: auto !important; }

.clients-list .flex-direction-nav {
  display: none; }

/*	Team intro
   .................................. */
@media screen and (min-width: 960px) {
  .team-bio {
    float: left;
    width: 50%; } }
.team-bio-title {
  color: #0081af;
  display: block;
  font-family: "Nexa", sans-serif;
  font-size: 30px;
  letter-spacing: -.025em;
  line-height: 1;
  margin-bottom: .5em; }

@media screen and (min-width: 500px) {
  .team-bio-title {
    font-size: 60px; } }
@media screen and (min-width: 960px) {
  .team-bio-title {
    font-size: 90px; } }
@media screen and (min-width: 960px) {
  .team-photo {
    float: left;
    width: 50%; } }
/*	Team list
   .................................. */
.team-list {
  margin: -10px; }

.team-list li {
  padding: 10px; }

@media screen and (min-width: 500px) {
  .team-list li {
    float: left;
    width: 50%; } }
@media screen and (min-width: 960px) {
  .team-list li {
    width: 33.333%; } }
.team-list a {
  display: block;
  position: relative; }

.team-list img {
  max-width: none;
  width: 100%; }

.team-list .fun {
  height: 100%;
  left: 0;
  opacity: 0;
  position: absolute;
  top: 0;
  -moz-transition: opacity .2s ease-out;
  -ms-transition: opacity .2s ease-out;
  -o-transition: opacity .2s ease-out;
  -webkit-transition: opacity .2s ease-out;
  transition: opacity .2s ease-out;
  width: 100%; }

.team-list a:hover .fun {
  opacity: 1; }

.team-list .hoverlay {
  background: none;
  color: #190907; }

.team-list .active .fun, .team-list .active .hoverlay {
  opacity: 1; }

.profile-popup {
  position: fixed;
  z-index: 10;
  left: 0;
  top: 50%;
  width: 100%;
  margin-top: -210px;
  color: #fff;
  padding: 30px;
  background: #1c0f09;
  background: rgba(28, 15, 9, 0.95);
  display: none;
  -webkit-transform: scale(1.5);
  -moz-transform: scale(1.5);
  transform: scale(1.5);
  -webkit-transition: all .15s;
  -moz-transition: all .15s;
  -o-transition: all .15s;
  transition: all .15s; }

@media screen and (min-width: 960px) {
  .profile-popup {
    left: 50%;
    margin-left: -425px;
    max-width: 850px;
    padding: 50px; } }
@media screen and (max-width: 500px) {
  .profile-popup {
    margin-left: 0;
    left: 0;
    position: relative;
    top: 0;
    left: auto;
    margin-left: 0;
    margin-top: 0 !important; } }
.profile-popup.active {
  display: block;
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  transform: scale(1); }

.profile-popup h4 {
  font-weight: normal;
  margin-bottom: 15px; }

.close-popup {
  width: 40px;
  height: 40px;
  cursor: pointer;
  position: absolute;
  top: 20px;
  right: 20px;
  padding: 10px 0px 0px 10px; }

.close-popup .alt {
  -webkit-transform: rotate(90deg);
  -moz-transform: rotate(90deg);
  -o-transform: rotate(90deg);
  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1);
  -ms-transform: rotate(90deg);
  transform: rotate(90deg);
  position: absolute;
  top: 10px;
  left: 10px; }

.close-popup:hover {
  color: #0081af; }

/*	- Team member
   ========================================================================== */
/*	Latest field notes
   .......................................................................... */
/*	- Field notes
   ========================================================================== */
.field-notes .mainwrapper {
  padding-top: 100px; }
  @media screen and (min-width: 768px) and (min-height: 460px) {
    .field-notes .mainwrapper {
      padding-top: 150px; } }

.category .mainwrapper {
  padding-top: 100px; }
  @media screen and (min-width: 768px) and (min-height: 460px) {
    .category .mainwrapper {
      padding-top: 150px; } }

/*	Post
   .......................................................................... */
.post {
  margin-left: auto;
  margin-right: auto;
  max-width: 920px;
  padding-top: 25px; }

.post-content {
  position: relative;
  margin-top: 5px; }

.team-member .post-content {
  padding: 40px 20px; }

@media screen and (min-width: 500px) {
  .post-content,
  .team-member .post-content {
    /*
    				float: right;
    				margin-top: -80px;
    				padding: 40px;
    				width: 75%;
    */ }

  .post-content {
    padding-right: 0; } }
.post-meta {
  margin: 0 0 30px 0;
  display: inline-block;
  font-family: "Calibre Semibold", sans-serif;
  font-style: normal;
  font-weight: normal;
  text-transform: uppercase;
  font-size: 16px;
  padding-right: 2px; }
  .post-meta .smllhr {
    margin: 0; }
  .post-meta .post-timestamp {
    display: block; }

.post-title {
  color: #000000;
  font-size: 26px;
  line-height: 30px;
  font-family: 'Calibre Light', sans-serif;
  margin-bottom: 31px; }

@media screen and (min-width: 500px) {
  .post-title {
    font-size: 30px;
    line-height: 37px; } }
@media screen and (min-width: 768px) {
  .post-title {
    font-size: 32px;
    line-height: 38px; } }
@media screen and (min-width: 960px) {
  .post-title {
    font-size: 45px;
    line-height: 53px;
    margin-bottom: 25px;
    font-family: 'Calibre Thin', sans-serif; } }
@media screen and (min-width: 1280px) {
  .post-title {
    font-size: 45px;
    line-height: 55px;
    margin-bottom: 25px; } }
/*
 .culture-first-intro {
	margin-bottom: 50px;	
	position: relative;
 	.ttl {
		  font-size: 40px;
		  line-height: 40px;
			font-family: 'Calibre Thin', sans-serif;
			margin-bottom: 6px;
 	}
 	.sbttl {
		font-size: 26px;
		line-height: 36px;
		display: inline;
		border-bottom: solid 1px #000;	 	
 	}	 
 	.htl {
 			top:auto;
		    bottom: 33px;	
 	}
	@media screen and (min-width: $mobile-bp)  {
	 	.ttl {
			font-size: 50px;
			line-height: 52px;
		}
	}
	@media screen and (min-width: $dsk-bp)  {
	 	.ttl {
			font-size: 70px;
			line-height: 65px;
		}
	}
	
	
*/
.post-title a {
  color: #000000; }

.post-title a:hover {
  color: #0081af; }

.post-title em {
  display: block;
  font-style: normal;
  font-weight: 300;
  font-size: 0.75em; }

.post .button-wrap-right {
  margin-top: 1.12em;
  text-align: left; }

@media screen and (min-width: 500px) {
  .post .button-wrap-right {
    text-align: right; } }
.post .continual {
  display: inline-block; }

.post .continual [class*="icon-"] {
  vertical-align: middle; }

.post .social-networks {
  text-align: left;
  margin: 20px 0; }

@media screen and (min-width: 500px) {
  .post .social-networks {
    /*
    				background: transparent;
    				float: left;
    				margin-top: 40px;
    				padding: 0;
    				width: 25%;
    */ } }
.post .social-networks li {
  margin: .444em .444em 0 0; }

.social-networks li.description {
  margin: 0 0 .444em;
  width: 100%; }

.social-networks .description span {
  font-size: 14px; }

.post .social-networks a:hover {
  color: #555; }

/*	Caption
   .......................................................................... */
.wp-caption {
  max-width: 920px;
  position: relative;
  width: 100% !important; }

.wp-caption-text {
  font-size: .77em; }

.wp-caption img {
  height: auto !important;
  max-width: 100%;
  width: 100% !important; }

/*	Tweet
   .......................................................................... */
.tweet {
  border: solid #0081af;
  border-width: 1px 0;
  text-align: center; }

.tweet + .tweet {
  margin-top: -1px; }

.tweet-content {
  margin-left: auto;
  margin-right: auto;
  max-width: 920px; }

.entry-content .tweet-title {
  font-size: 1.5em;
  font-weight: 300; }

@media screen and (min-width: 500px) {
  .entry-content .tweet-title {
    font-size: 1.75em; } }
@media screen and (min-width: 960px) {
  .entry-content .tweet-title {
    font-size: 2em; } }
.tweet-menu {
  margin-top: 20px;
  text-align: center; }

.tweet-menu li {
  font-size: 1rem; }

.tweet-menu li:before {
  bottom: -2px;
  content: "·";
  margin: 0 8px;
  position: relative; }

.tweet-menu li:first-child:before {
  display: none; }

.tweet-menu a {
  font-size: .9em; }

/*	Pagination
   .......................................................................... */
.pagination ol {
  text-align: center; }

.pagination li {
  display: none; }

.pagination li:first-child,
.pagination li:last-child,
.pagination li.ellipsis,
.pagination li.active {
  display: inline-block; }

@media screen and (min-width: 768px) {
  .pagination li {
    display: inline-block; } }
.pagination .icon-arrow-left,
.pagination .icon-arrow-right {
  vertical-align: middle; }

.pagination a {
  display: block;
  line-height: 2em;
  min-width: 2em; }

.pagination .active a {
  background: #4d3e3c;
  border-radius: 50%;
  color: #cccbcb;
  position: relative; }

.pagination .active a:before,
.pagination .active a:after {
  color: #000;
  content: "...";
  font-weight: 300;
  margin-right: .55em;
  pointer-events: none;
  position: absolute;
  right: 100%; }

.pagination .active a:after {
  left: 100%;
  margin: 0 0 0 .55em;
  right: auto; }

@media screen and (min-width: 768px) {
  .pagination .active a:before,
  .pagination .active a:after {
    display: none; } }
/*	- Field notes single
   ========================================================================== */
/*	Prism
   .......................................................................... */
pre[class*="language-"] {
  font-size: 80%; }

/*	New business
   .......................................................................... */
@media screen and (min-width: 1280px) {
  .new-business {
    float: left;
    width: 50%; } }
/*	New talent
   .......................................................................... */
@media screen and (min-width: 1280px) {
  .new-talent {
    float: left;
    margin-top: 0;
    width: 50%; } }
/*	Business card
   .......................................................................... */
@media screen and (min-width: 768px) {
  .contact .business-card {
    float: left;
    width: 50%; } }
@media screen and (min-width: 1280px) {
  .contact .business-card {
    float: none;
    width: auto; } }
.contact .business-card .tel {
  font-weight: 700;
  margin: .33em 0; }

@media screen and (min-width: 768px) {
  .contact .business-card .tel {
    margin: .67em 0; } }
.contact .business-card .adr div {
  display: inline; }

@media screen and (min-width: 768px) {
  .contact .business-card .adr div {
    display: block; } }
/*	Follow us
   .......................................................................... */
@media screen and (min-width: 768px) {
  .follow-us {
    float: left;
    margin-top: 0;
    width: 50%; } }
@media screen and (min-width: 1280px) {
  .follow-us {
    float: none;
    margin-top: 40px;
    width: auto; } }
/*	MEDIA QUERIES
   ==========================================================================
   ========================================================================== */
/*	- Tablet
   .......................................................................... */
/*	- Desktop
   .......................................................................... */
/*	- Widescreen desktop
   .......................................................................... */
/*	- Full HD
   .......................................................................... */
/*	- Retina graphics
   .......................................................................... */
/*	PRINT
   ==========================================================================
   ========================================================================== */
@media print {
  * {
    background: transparent !important;
    box-shadow: none !important;
    color: #000 !important;
    text-shadow: none !important; }

  a,
  a:visited {
    text-decoration: underline; }

  a[href]:after {
    content: " (" attr(href) ")"; }

  abbr[title]:after {
    content: " (" attr(title) ")"; }

  .ir a:after,
  a[href^="javascript:"]:after,
  a[href^="#"]:after {
    content: ""; }

  pre,
  blockquote {
    border: 1px solid #999;
    page-break-inside: avoid; }

  thead {
    display: table-header-group; }

  tr,
  img {
    page-break-inside: avoid; }

  img {
    max-width: 100% !important; }

  @page {
    margin: .5cm; }
  p,
  h2,
  h3 {
    orphans: 3;
    widows: 3; }

  h2,
  h3 {
    page-break-after: avoid; } }
.e404 {
  min-height: 100%;
  padding-top: 90px; }

.e404 h1 {
  font-size: 32px;
  line-height: 32px;
  display: block;
  text-align: center;
  padding-bottom: 450px;
  font-family: "Apercu", sans-serif;
  color: #000; }

.error404 .main .container {
  background: url(../images/saget404.jpg) center bottom no-repeat;
  -webkit-background-size: 500px 750px;
  background-size: 500px 750px; }

@media screen and (min-width: 768px) {
  .e404 {
    padding-top: 180px; }

  .e404 h1 {
    font-size: 72px;
    line-height: 72px;
    padding-bottom: 850px; }

  .error404 .main .container {
    background-size: auto; } }
.e404 h1 a {
  text-decoration: underline; }

.error404 .down {
  position: fixed;
  bottom: 60px;
  font-size: 60px;
  line-height: 60px;
  width: 100%;
  text-align: center;
  left: 0; }

.error404 .brand-bar {
  display: none !important; }

@media screen and (max-height: 32em) {
  #contact {
    position: relative;
    padding-top: 70px; } }
/*	- News page
   ========================================================================== */
.news-ttl {
  color: #0081ad;
  text-align: center;
  display: inline-block;
  font-size: 43px;
  font-weight: 300;
  border-bottom: solid 2px; }

.news-ttl-wrap {
  text-align: center; }

.news-gallery {
  overflow: hidden;
  margin: -10px; }

.news-link-wrap.category-tweet .news-txt {
  opacity: 1;
  color: #000000; }

.news-link-wrap.category-tweet .news-txt .ttl {
  color: #0081ad;
  border-color: #0081ad; }

.news-link {
  display: block;
  margin: 10px;
  background-color: #ede8da;
  position: relative;
  overflow: hidden;
  background-size: cover; }

.news-link img {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: auto; }

.news-txt {
  padding: 40px;
  position: relative;
  color: #fff;
  opacity: 0;
  -moz-transition-duration: .8s;
  -ms-transition-duration: .8s;
  -o-transition-duration: .8s;
  -webkit-transition-duration: .8s;
  transition-duration: .8s; }

.news-txt .ttl {
  font-size: 26px;
  display: inline;
  border-bottom: solid 2px #fff;
  margin: 10px 0;
  line-height: 38px; }

.news-txt p {
  margin-top: 20px; }

.news-txt .date {
  display: block;
  margin-bottom: 10px; }

.news-link-wrap:hover .news-txt {
  opacity: 1; }

@media screen and (min-width: 500px) {
  .news-link-wrap {
    width: 50%;
    float: left; } }
@media screen and (min-width: 960px) {
  .news-link-wrap {
    width: 33.3334%;
    float: left; } }
/*	- Animations to tiles
   ========================================================================== */
@-webkit-keyframes moveup {
  /* Safari and Chrome */
  0%,5% {
    opacity: 0;
    -webkit-transform: translateY(100px); }
  70% {
    opacity: 0; }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0); } }
@-moz-keyframes moveup {
  /* Firefox */
  0%,50% {
    opacity: 0; }
  100% {
    opacity: 1; } }
@-o-keyframes moveup {
  /* Opera */
  0%,50% {
    opacity: 0; }
  100% {
    opacity: 1; } }
@keyframes moveup {
  0%,50% {
    opacity: 0; }
  100% {
    opacity: 1; } }
.moveup {
  -webkit-animation: moveup .8s ease-in;
  -moz-animation: moveup 2s ease-in;
  -o-animation: moveup 2s ease-in;
  -ms-animation: moveup 2s ease-in;
  animation: moveup 2s ease-in; }

/* 2. Add it to the class

Arguments:::

    animation-name:				the name of the animation
    animation-duration:			how long the keyframes will take to go from 0% to 100%
    animation-timing-function:	the speed from start to end (linier, ease [slow start, then ends fast]
    animation-delay:			the delay beofore it animates
    animation-iteration-count:	the number of times it plays
    animation-direction:		normal or reverse?
    animation-play-state:		running or paused


------------------------------------------- */
@media screen and (min-width: 768px) {
  .tile-effect.loaded {
    -webkit-animation: moveup .5s linear;
    -moz-animation: moveup .5s linear;
    -ms-animation: moveup .5s linear;
    -o-animation: moveup .5s linear;
    animation: moveup .5s linear; }

  .fd-efx {
    opacity: 0;
    -webkit-transition: 0.4s;
    -moz-transition: 0.4s;
    -ms-transition: 0.4s;
    -o-transition: 0.4s;
    transition: 0.4s; }

  .fd-efx.loaded {
    opacity: 1; } }
/*	- Home page edits
   ========================================================================== */
.bkgd-image {
  display: block;
  bottom: 10px;
  height: auto;
  left: 10px;
  right: 10px;
  top: 10px;
  width: auto;
  position: absolute;
  -moz-transition-duration: .8s;
  -ms-transition-duration: .8s;
  -o-transition-duration: .8s;
  -webkit-transition-duration: .8s;
  transition-duration: .8s;
  -webkit-transition-delay: .3s; }

@-webkit-keyframes fadeinandout {
  /* Safari and Chrome */
  0%,50% {
    opacity: 0; }
  51%, 100% {
    opacity: 1; } }
.bkgd-image div:first-child {
  -webkit-animation: fadeinandout .5s linear; }

.bkgd-image div {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  text-align: center;
  -moz-transition-duration: .4s;
  -ms-transition-duration: .4s;
  -o-transition-duration: .4s;
  -webkit-transition-duration: .4s;
  transition-duration: .4s;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -ms-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  background-position: center center; }

.bkgd-image div.front {
  z-index: 1; }

.bkgd-image div {
  z-index: 0; }

.bkgd-image div.hide {
  opacity: 0; }

/*	- Fade homepage features in
   ========================================================================== */
@-webkit-keyframes fadein {
  /* Safari and Chrome */
  0%,50% {
    opacity: 0; }
  100% {
    opacity: 1; } }
@-moz-keyframes fadein {
  /* Firefox */
  0%,50% {
    opacity: 0; }
  100% {
    opacity: 1; } }
@-o-keyframes fadein {
  /* Opera */
  0%,50% {
    opacity: 0; }
  100% {
    opacity: 1; } }
@keyframes fadein {
  0%,50% {
    opacity: 0; }
  100% {
    opacity: 1; } }
/*	- Fade homepage features in
   ========================================================================== */
.hero-slider {
  overflow: hidden;
  position: relative;
  height: 100%;
  overflow: hidden;
  margin-bottom: 25px; }
  @media screen and (min-width: 768px) {
    .hero-slider {
      margin-bottom: 0; } }
  .hero-slider .slides {
    height: 100%; }
  .hero-slider .flllink {
    display: block;
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 2; }
  .hero-slider .slides li {
    height: 100%;
    position: relative;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -ms-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    background-size: cover; }
  .hero-slider .slides .hero-cnt {
    display: block;
    float: right;
    text-align: right;
    position: absolute;
    right: 0;
    bottom: 60px; }
    .hero-slider .slides .hero-cnt .smllhr {
      margin-right: 3px;
      margin-bottom: 30px;
      border-color: #000; }
    @media screen and (min-width: 1280px) {
      .hero-slider .slides .hero-cnt {
        max-width: 550px; }
        .hero-slider .slides .hero-cnt .smllhr {
          margin-top: 30px; } }
  .hero-slider .slides li .cnt {
    border: solid transparent;
    border-width: 0 30px;
    margin: 0 auto;
    max-width: 1380px;
    position: relative;
    display: block;
    color: #000;
    background-position: center center;
    overflow: hidden;
    height: 300px; }
    @media screen and (min-width: 500px) {
      .hero-slider .slides li .cnt {
        border-width: 0 40px; } }
    @media screen and (min-width: 1280px) {
      .hero-slider .slides li .cnt {
        padding-top: 80px;
        height: 500px; } }
    @media screen and (min-width: 960px) {
      .hero-slider .slides li .cnt {
        border-width: 0 80px; } }
  .hero-slider .slides li a {
    color: #000; }
  .hero-slider .slides .ttl span {
    font-size: 18px;
    line-height: 28px;
    display: inline-block;
    font-family: 'Calibre Light';
    font-weight: normal;
    text-align: right;
    background: #000;
    color: #fff;
    margin-bottom: 3px;
    padding-right: 4px;
    padding-left: 4px; }
    @media screen and (min-width: 768px) {
      .hero-slider .slides .ttl span {
        font-size: 32px;
        line-height: 31px; } }
  .hero-slider .slides .tag {
    font-family: 'Calibre Semibold';
    font-weight: normal;
    font-size: 30px;
    line-height: 35px;
    text-transform: uppercase;
    display: block; }
    @media screen and (min-width: 1280px) {
      .hero-slider .slides .tag {
        font-size: 60px;
        line-height: 65px;
        text-align: right; } }
  .hero-slider .slides .tag {
    font-size: 26px; }
  .hero-slider .flex-direction-nav {
    position: absolute;
    bottom: 60px;
    left: 0;
    width: 100%;
    height: 40px; }
    .hero-slider .flex-direction-nav a.flex-prev {
      background: url(../images/icons-horiz-blk.svg) no-repeat left center; }
    .hero-slider .flex-direction-nav a.flex-next {
      background: url(../images/icons-horiz-blk.svg) no-repeat right center; }

/*	- Home breaks
   ========================================================================== */
.container.home-breaks-outerwrap {
  padding-top: 0;
  padding-bottom: 0; }

.home-breaks-wrap {
  overflow: hidden;
  border-width: 0 10px;
  padding-bottom: 60px; }
  @media screen and (min-width: 500px) {
    .home-breaks-wrap {
      border-width: 0 30px; } }
  @media screen and (min-width: 960px) {
    .home-breaks-wrap {
      border-width: 0 70px; } }

.home-break {
  font-family: 'Calibre Light', helvetica, arial, sans-serif;
  font-weight: normal;
  position: relative; }

.home-break .cnt {
  margin: 10px;
  padding-top: 22px;
  padding-bottom: 40px;
  border-bottom: solid 4px #000; }
  @media screen and (min-width: 768px) {
    .home-break .cnt {
      min-height: 225px; } }
  @media screen and (min-width: 960px) {
    .home-break .cnt {
      padding-top: 42px;
      padding-bottom: 42px;
      min-height: 250px; } }

.home-break .type {
  font-size: 25px;
  line-height: 27px;
  display: block;
  font-family: 'Calibre Light', helvetica, arial, sans-serif;
  font-weight: normal; }
  @media screen and (min-width: 768px) {
    .home-break .type {
      font-size: 32px;
      line-height: 40px; } }
  @media screen and (min-width: 960px) {
    .home-break .type {
      font-size: 40px;
      line-height: 40px;
      font-family: 'Calibre Thin', helvetica, arial, sans-serif; } }

.home-break .type a {
  color: #000000; }

.home-break span.tag,
.home-break .taglist ul {
  text-transform: lowercase;
  margin-top: 8;
  font-family: 'Calibre Semibold', helvetica, arial, sans-serif;
  font-weight: normal;
  font-size: 14px;
  line-height: 18px; }
  @media screen and (min-width: 960px) {
    .home-break span.tag,
    .home-break .taglist ul {
      font-size: 20px;
      line-height: 24px; } }

.home-break .taglist ul li {
  float: left; }

.home-break .taglist ul a,
.home-break span.tag a {
  color: #000000;
  margin-right: 5px;
  display: inline; }
  .home-break .taglist ul a:before,
  .home-break span.tag a:before {
    content: '#'; }
  .home-break .taglist ul a:hover,
  .home-break span.tag a:hover {
    border-bottom: solid 2px #000; }

.home-break .ttl {
  margin: 16px 0;
  font-size: 16px; }

.home-break .ttl a {
  display: inline; }
  .home-break .ttl a:hover {
    text-decoration: none; }

.home-break p {
  font-size: 22px;
  line-height: 28px; }

@media screen and (min-width: 670px) {
  .home-break {
    width: 33.3334%;
    float: left; }

  .home-break .taglist {
    position: absolute;
    bottom: 34px; } }
@media screen and (min-width: 960px) {
  .home-break .type {
    font-size: 34px;
    line-height: 36px; }

  .home-break .ttl {
    max-width: 310px;
    font-size: 20px;
    line-height: 28px; } }
@media screen and (min-width: 960px) {
  .home-break .type {
    font-size: 44px;
    line-height: 46px; } }
@media screen and (min-width: 1280px) {
  .home-break .type {
    font-size: 50px;
    line-height: 46px; }

  .home-break .ttl {
    font-size: 26px;
    line-height: 35px; } }
/* Warning messages
================================================== */
.warning {
  display: none;
  background: #ffa500;
  color: #000;
  text-align: center;
  margin: 0;
  font-family: arial, sans-serif;
  font-size: 16px;
  line-height: 27px;
  font-weight: bold;
  z-index: 9999;
  position: fixed;
  width: 100%;
  padding: 24px; }
  .warning a {
    text-decoration: underline;
    color: #000 !important; }

html.ltie9 .ie-warn {
  bottom: 0;
  display: block; }

html.no-js .nojs-warn {
  top: 0;
  display: block; }

/*	- Field notes
   ========================================================================== */
#fieldnotes-wrap {
  overflow: hidden;
  max-width: 1399px;
  margin: auto;
  margin-top: -10px; }

#fieldnotes {
  overflow: hidden;
  margin-right: auto;
  margin-left: auto;
  border-width: 0 10px; }
  @media screen and (min-width: 500px) {
    #fieldnotes {
      border-width: 0 30px; } }
  @media screen and (min-width: 768px) {
    #fieldnotes {
      border-width: 0 70px; } }

.fieldnote-wrap {
  padding: 10px;
  width: 100%; }
  @media screen and (min-width: 670px) {
    .fieldnote-wrap {
      float: left;
      width: 50%; } }
  @media screen and (min-width: 1105px) {
    .fieldnote-wrap {
      width: 33.33%; } }

.fieldnote {
  font-size: .5em;
  background-color: #000000;
  position: relative; }
  .fieldnote * {
    color: #fff; }
  .fieldnote .post-title a {
    color: #fff; }
  .fieldnote > .bkgd {
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-size: cover; }
  .fieldnote > .group {
    padding: 25px;
    opacity: 0; }
  .fieldnote:focus > .group, .fieldnote:hover > .group, .fieldnote:active > .group {
    -webkit-animation: fadeinfromleft 0.8s ease-in;
    -moz-animation: fadeinfromleft 0.8s ease-in;
    -ms-animation: fadeinfromleft 0.8s ease-in;
    -o-animation: fadeinfromleft 0.8s ease-in;
    animation: fadeinfromleft 0.8s ease-in;
    opacity: 1; }
  .fieldnote:focus > .bkgd, .fieldnote:hover > .bkgd, .fieldnote:active > .bkgd {
    opacity: 0.2; }

/*	- New tile styles
   ========================================================================== */
.ttile-wrap {
  padding: 10px 0;
  display: block;
  height: 255px; }
  @media screen and (min-width: 670px) {
    .ttile-wrap {
      height: auto;
      padding: 10px; } }

.ttile {
  display: block;
  background: #eee;
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden; }
  .ttile .bglink {
    top: 0;
    display: block;
    z-index: 4;
    position: absolute;
    width: 100%;
    height: 100%; }
  .ttile .ttl {
    display: block;
    position: absolute;
    width: 100%;
    bottom: 41px; }
    @media screen and (min-width: 960px) {
      .ttile .ttl {
        bottom: 56px; } }
  .ttile .bkgd-image {
    display: block;
    bottom: 0;
    height: auto;
    left: 0;
    right: 0;
    top: 0;
    width: auto; }
    @media screen and (min-width: 670px) {
      .ttile .bkgd-image {
        position: absolute; } }
  .ttile .catlinks {
    bottom: 15px;
    display: block;
    padding: 0;
    margin: 0;
    width: 100%;
    position: absolute; }
    .ttile .catlinks li {
      list-style: none;
      display: block;
      float: left; }
    .ttile .catlinks a {
      display: inline-block; }
    @media screen and (min-width: 960px) {
      .ttile .catlinks {
        bottom: 30px; } }
  .ttile .ttl,
  .ttile > .catlinks {
    z-index: 5;
    left: -100%; }
  .ttile .hover {
    -webkit-transition: 0.4s;
    -moz-transition: 0.4s;
    -ms-transition: 0.4s;
    -o-transition: 0.4s;
    transition: 0.4s;
    z-index: 3;
    opacity: 0; }
  .ttile.touched .ttl,
  .ttile.touched > .catlinks, .ttile:hover .ttl,
  .ttile:hover > .catlinks {
    left: 0;
    -webkit-animation: fadeinfromleft 0.4s ease-in;
    -moz-animation: fadeinfromleft 0.4s ease-in;
    -ms-animation: fadeinfromleft 0.4s ease-in;
    -o-animation: fadeinfromleft 0.4s ease-in;
    animation: fadeinfromleft 0.4s ease-in; }
  .ttile.touched .hover, .ttile:hover .hover {
    opacity: 1; }
  .ttile .ttl,
  .ttile > .catlinks {
    color: #fff;
    padding: 0 15px; }
    @media screen and (min-width: 960px) {
      .ttile .ttl,
      .ttile > .catlinks {
        padding: 0 30px; } }
  .ttile .catlinks a {
    padding-right: 10px;
    color: #fff; }
    .ttile .catlinks a:before {
      content: '#'; }
    .ttile .catlinks a:focus, .ttile .catlinks a:hover {
      text-decoration: underline; }
  .ttile .ttl {
    font-size: 24px;
    line-height: 26px;
    /*
    		font-size: 18px;
    		@media screen and (min-width: $smtablet-bp) {
    		}
    */ }
    @media screen and (min-width: 1280px) {
      .ttile .ttl {
        font-size: 35px;
        line-height: 33px; } }

.ttile.noopac .ttl,
.ttile.noopac > .catlinks {
  z-index: 5;
  left: -100%; }
.ttile.noopac .hover {
  -webkit-transition: 0.4s;
  -moz-transition: 0.4s;
  -ms-transition: 0.4s;
  -o-transition: 0.4s;
  transition: 0.4s;
  z-index: 3;
  opacity: 0; }
.ttile.noopac:hover .ttl,
.ttile.noopac:hover > .catlinks {
  left: 0;
  -webkit-animation: fadeinfromleft 0.4s ease-in;
  -moz-animation: fadeinfromleft 0.4s ease-in;
  -ms-animation: fadeinfromleft 0.4s ease-in;
  -o-animation: fadeinfromleft 0.4s ease-in;
  animation: fadeinfromleft 0.4s ease-in; }
.ttile.noopac:hover .hover {
  opacity: 1; }

/*	- New nav
   ========================================================================== */
.mdl-close-btn {
  display: block;
  position: absolute;
  top: 20px;
  right: 20px;
  background: url(../images/closex-blk.png) no-repeat center center;
  width: 24px;
  height: 24px;
  cursor: pointer; }

.mainnav {
  position: fixed;
  display: none;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 10; }
  .mainnav > ul {
    display: block;
    position: absolute;
    top: 50%;
    width: 100%;
    margin-top: -115px;
    z-index: 5; }
  .mainnav a {
    text-align: center;
    display: inline-block;
    font-family: 'Calibre Semibold', helvetica, arial, sans-serif;
    text-transform: uppercase;
    font-size: 17px;
    color: #fff;
    position: relative; }
    .mainnav a:before {
      content: '';
      display: block;
      width: 100%;
      height: 2px;
      background: #fff;
      position: absolute;
      bottom: 0px;
      opacity: 0;
      -webkit-transition: 0.4s;
      -moz-transition: 0.4s;
      -ms-transition: 0.4s;
      -o-transition: 0.4s;
      transition: 0.4s; }
    .mainnav a:focus:before, .mainnav a:hover:before {
      content: '';
      display: block;
      width: 100%;
      height: 2px;
      background: #fff;
      position: absolute;
      bottom: 0;
      opacity: 1; }
  .mainnav li {
    text-align: center;
    padding: 14px 18px;
    position: relative; }
  .mainnav li.active > a:before {
    bottom: 0;
    opacity: 1; }
  @media (max-height: 460px) {
    .mainnav a {
      color: #fff; } }

@media screen and (max-width: 768px) {
  .mainnav.mblnav-open a {
    color: #fff !important; } }

.closemainnav {
  z-index: 5;
  background: #000;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: block; }

.hamburger {
  display: inline-block;
  width: 32px;
  margin-right: 0;
  /* margin-top: 7px; */
  /* float: right; */
  margin-right: 0;
  cursor: pointer;
  position: absolute;
  right: 0;
  top: 10px;
  cursor: pointer; }
  .hamburger em {
    display: block;
    height: 2px;
    margin: 5px 0;
    background: #000;
    -webkit-transition: 0.4s;
    -moz-transition: 0.4s;
    -ms-transition: 0.4s;
    -o-transition: 0.4s;
    transition: 0.4s;
    position: relative; }
  .hamburger:focus em, .hamburger:hover em {
    opacity: 0.6; }

.hamburger.open em:first-child {
  transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  /* IE 9 */
  -ms-transform: rotate(-45deg);
  /* IE 9 */
  -moz-transform: rotate(-45deg);
  /* Chrome, Safari, Opera */
  -webkit-transform: rotate(-45deg);
  /* Chrome, Safari, Opera */
  top: 7px; }
.hamburger.open em:nth-child(2) {
  opacity: 0; }
.hamburger.open em:last-child {
  transform: rotate(45deg);
  -o-transform: rotate(45deg);
  /* IE 9 */
  -ms-transform: rotate(45deg);
  /* IE 9 */
  -moz-transform: rotate(45deg);
  /* Chrome, Safari, Opera */
  -webkit-transform: rotate(45deg);
  /* Chrome, Safari, Opera */
  top: -7px; }

@media (max-height: 460px) {
  .home.first-visit .nonsticky .hamburger em {
    background: #fff; } }
/* - Non-mobile --------- */
@media screen and (min-width: 768px) {
  .mainnav {
    position: relative;
    display: block !important;
    z-index: 99;
    float: right;
    width: 70%; }
    .mainnav > ul {
      position: relative;
      bottom: 0;
      top: 0;
      width: auto;
      margin-top: auto;
      right: 0;
      float: right; }
    .mainnav li {
      display: block;
      text-align: left; }
    .mainnav > ul > li {
      float: left; }
    .mainnav a {
      font-size: .85em;
      color: #000;
      display: block; }
      .mainnav a:focus:before, .mainnav a:hover:before {
        background: #000; }
    .mainnav li.active a:before {
      background: #000; }

  .closemainnav {
    display: none;
    visibility: hidden; }

  .hamburger {
    display: none;
    visibility: hidden; } }
.toast-logo.desktop {
  left: -2px; }

.home.first-visit .nonsticky .toast-logo.reverse {
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -ms-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  opacity: 1;
  display: block;
  visibility: visible; }
.home.first-visit .nonsticky .toast-logo.non-reverse {
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -ms-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  opacity: 0;
  display: none;
  visibility: hidden; }
.home.first-visit .nonsticky .hamburger em {
  background: #fff; }
.home.first-visit .nonsticky .mainnav a {
  color: #fff; }
.home.first-visit .sticky .toast-logo.reverse {
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -ms-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  opacity: 0;
  display: none;
  visibility: hidden; }
.home.first-visit .sticky .toast-logo.non-reverse {
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -ms-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  opacity: 1;
  display: block;
  visibility: visible; }
.home.first-visit .sticky .hamburger em {
  background: #000; }
.home.first-visit .sticky .mainnav a {
  color: #000; }
@media screen and (min-width: 768px) and (min-height: 460px) {
  .home.first-visit .nonsticky .toast-logo.reverse,
  .home.first-visit .sticky .toast-logo.reverse {
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -ms-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    opacity: 0;
    display: none;
    visibility: hidden; }
  .home.first-visit .nonsticky .toast-logo.non-reverse,
  .home.first-visit .sticky .toast-logo.non-reverse {
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -ms-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    opacity: 1;
    display: block;
    visibility: visible; }
  .home.first-visit .nonsticky .hamburger em,
  .home.first-visit .sticky .hamburger em {
    background: #000; }
  .home.first-visit .nonsticky .mainnav a,
  .home.first-visit .sticky .mainnav a {
    color: #000; } }

.home.passed-first-visit .nonsticky .toast-logo.reverse,
.home.passed-first-visit .sticky .toast-logo.reverse {
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -ms-background-size: cover;
  -o-background-size: cover;
  background-size: cover; }
.home.passed-first-visit .nonsticky .toast-logo.non-reverse,
.home.passed-first-visit .sticky .toast-logo.non-reverse {
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -ms-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  opacity: 0;
  display: none;
  visibility: hidden; }
.home.passed-first-visit .nonsticky .hamburger em,
.home.passed-first-visit .sticky .hamburger em {
  background: #000; }
.home.passed-first-visit .nonsticky .mainnav a,
.home.passed-first-visit .sticky .mainnav a {
  color: #000; }
.home.passed-first-visit .nonsticky .toast-logo.reverse,
.home.passed-first-visit .sticky .toast-logo.reverse {
  opacity: 0;
  display: none;
  visibility: hidden; }
.home.passed-first-visit .nonsticky .toast-logo.non-reverse,
.home.passed-first-visit .sticky .toast-logo.non-reverse {
  opacity: 1;
  display: block;
  visibility: visible; }

/*	- Contact section
   ========================================================================== */
body.single-artist .header,
body.contact .header {
  background-color: #000; }
body.single-artist .header.sticky .navbar,
body.contact .header.sticky .navbar {
  background-color: transparent; }
body.single-artist .mainnav li.active a:before,
body.contact .mainnav li.active a:before {
  background: #fff; }
body.single-artist .mainnav a,
body.contact .mainnav a {
  color: #fff; }
  body.single-artist .mainnav a:focus:before, body.single-artist .mainnav a:hover:before,
  body.contact .mainnav a:focus:before,
  body.contact .mainnav a:hover:before {
    background: #fff; }
body.single-artist .toast-logo,
body.contact .toast-logo {
  background: url(../images/toast-logo-reverse.svg) no-repeat center center;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -ms-background-size: cover;
  -o-background-size: cover;
  background-size: cover; }
body.single-artist .hamburger em,
body.contact .hamburger em {
  background-color: #fff; }

body.contact {
  background: url(../images/bkgd/Toast_CONTACT.jpg) no-repeat top 150px center #000;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -ms-background-size: cover;
  -o-background-size: cover;
  background-size: cover; }
  body.contact .mainwrapper {
    background-color: transparent; }
  body.contact .main {
    padding-top: 50px; }
    @media screen and (min-width: 768px) {
      body.contact .main {
        padding-top: 0; } }

.single-artist {
  padding-bottom: 100px; }
  .single-artist .header {
    background-color: #000;
    background-position: center center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -ms-background-size: cover;
    -o-background-size: cover;
    background-size: cover; }
    .single-artist .header:before {
      content: '';
      display: block;
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background: rgba(0, 0, 0, 0.5); }
  .single-artist .footer-wrap {
    margin-top: 0; }

/*	Google maps
   .......................................................................... */
.google-maps-outer-wrap {
  border-radius: 50%;
  margin: 0;
  padding-top: 0;
  overflow: hidden;
  position: relative;
  -webkit-mask-image: -webkit-radial-gradient(center center, closest-side circle, white 100%, black 100%);
  height: 230px;
  width: 230px;
  max-width: none; }
  @media screen and (min-width: 768px) {
    .google-maps-outer-wrap {
      margin: 60px 0;
      position: absolute;
      top: 0;
      right: 0; } }
  @media screen and (min-width: 1280px) {
    .google-maps-outer-wrap {
      height: 360px;
      width: 360px; } }
  .google-maps-outer-wrap .gmnoprint {
    display: none;
    visibility: hidden; }

.google-maps-inner-wrap {
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%; }

.google-maps {
  height: 100% !important;
  width: 100% !important; }

.google-maps .map-placeholder {
  max-width: none;
  width: 100%; }

.cp-col {
  padding-right: 40px; }
  @media screen and (min-width: 670px) {
    .cp-col {
      float: left;
      width: 50%; } }
  @media screen and (min-width: 768px) {
    .cp-col {
      float: left;
      max-width: 320px; } }

.cp-col.cts {
  clear: both;
  width: 100%; }
  @media screen and (min-width: 960px) {
    .cp-col.cts {
      width: auto; } }
  @media screen and (min-width: 768px) {
    .cp-col.cts {
      clear: none;
      width: 50%; } }

.ct {
  width: 100%; }
  @media screen and (min-width: 670px) {
    .ct {
      padding-right: 40px;
      width: 50%;
      float: left; } }
  @media screen and (min-width: 768px) {
    .ct {
      width: auto;
      float: none;
      padding-right: 0; } }

.contactslide,
.contactslide_cnt {
  overflow: hidden;
  color: #fff;
  padding-bottom: 45px;
  padding-top: 0; }
  .contactslide .phonefont,
  .contactslide_cnt .phonefont {
    font-size: 30px;
    margin-bottom: 8px;
    margin-top: 29px; }
  .contactslide .deco,
  .contactslide_cnt .deco {
    position: absolute;
    top: 52px;
    left: -60px;
    display: none; }
    @media screen and (min-width: 768px) {
      .contactslide .deco,
      .contactslide_cnt .deco {
        display: block; } }
  .contactslide .htl,
  .contactslide_cnt .htl {
    top: 0; }
  .contactslide .ttl,
  .contactslide_cnt .ttl {
    text-transform: none;
    font-size: 2.7em;
    border-bottom: solid 2px #FFF;
    display: inline-block;
    margin-bottom: 20px;
    color: #fff; }
  .contactslide .subttl,
  .contactslide_cnt .subttl {
    margin: 0 0 12px 0;
    text-transform: uppercase;
    font-family: "Calibre Semibold", helvetica, sans-serif;
    color: #fff;
    font-size: 20px; }
  .contactslide .subttl.paddtop,
  .contactslide_cnt .subttl.paddtop {
    margin: 63px 0 12px 0; }
  .contactslide p,
  .contactslide_cnt p {
    font-size: 20px; }
  .contactslide p, .contactslide a,
  .contactslide_cnt p,
  .contactslide_cnt a {
    color: #fff;
    line-height: 24px; }
  .contactslide .smllhr,
  .contactslide_cnt .smllhr {
    margin: 0;
    border-color: #fff; }
  .contactslide .social-networks a,
  .contactslide_cnt .social-networks a {
    color: #fff; }
  .contactslide .follow-bl,
  .contactslide_cnt .follow-bl {
    margin: 35px 0;
    height: 24px; }
    .contactslide .follow-bl > p,
    .contactslide_cnt .follow-bl > p {
      display: block;
      float: left;
      margin-right: 15px; }
    .contactslide .follow-bl .social-networks,
    .contactslide_cnt .follow-bl .social-networks {
      display: block;
      float: left; }
  .contactslide .cnt-det,
  .contactslide_cnt .cnt-det {
    font-family: "Calibre Semibold", helvetica, sans-serif;
    font-size: 16px;
    line-height: 21px;
    margin: 9px 0; }
    .contactslide .cnt-det a,
    .contactslide_cnt .cnt-det a {
      text-decoration: underline;
      display: inline-block; }
      .contactslide .cnt-det a:focus, .contactslide .cnt-det a:hover,
      .contactslide_cnt .cnt-det a:focus,
      .contactslide_cnt .cnt-det a:hover {
        text-decoration: none; }
  .contactslide .grey a,
  .contactslide_cnt .grey a {
    text-decoration: underline; }
    .contactslide .grey a:focus, .contactslide .grey a:hover,
    .contactslide_cnt .grey a:focus,
    .contactslide_cnt .grey a:hover {
      text-decoration: none; }
  @media screen and (min-width: 768px) {
    .contactslide,
    .contactslide_cnt {
      margin-right: 230px; }
      .contactslide .subttl.frst,
      .contactslide_cnt .subttl.frst {
        margin-top: 63px; } }
  @media screen and (min-width: 960px) {
    .contactslide,
    .contactslide_cnt {
      padding-top: 0; } }
  @media screen and (min-width: 1280px) {
    .contactslide,
    .contactslide_cnt {
      margin-right: 360px; } }

/*	- Carousel loads after page loads
   ========================================================================== */
.passed-first-visit .home-carousel {
  display: none;
  opacity: 0; }

.first-visit .home-carousel {
  display: block;
  opacity: 1; }

/*	- Homepage carousel
   ========================================================================== */
.home-carousel {
  display: none;
  opacity: 0;
  height: 100%;
  background: #000;
  position: relative;
  overflow: hidden; }
  .home-carousel .slides {
    height: 100%; }
    .home-carousel .slides li {
      height: 100%;
      position: relative;
      -webkit-background-size: cover;
      -moz-background-size: cover;
      -ms-background-size: cover;
      -o-background-size: cover;
      background-size: cover;
      background-position: center center; }
      .home-carousel .slides li:before {
        content: '';
        display: block;
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: 5;
        /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#000000+0,000000+100&amp;0+0,0.65+100 */
        background: -moz-linear-gradient(top, transparent 0%, rgba(0, 0, 0, 0.65) 100%);
        /* FF3.6+ */
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, transparent), color-stop(100%, rgba(0, 0, 0, 0.65)));
        /* Chrome,Safari4+ */
        background: -webkit-linear-gradient(top, transparent 0%, rgba(0, 0, 0, 0.65) 100%);
        /* Chrome10+,Safari5.1+ */
        background: -o-linear-gradient(top, transparent 0%, rgba(0, 0, 0, 0.65) 100%);
        /* Opera 11.10+ */
        background: -ms-linear-gradient(top, transparent 0%, rgba(0, 0, 0, 0.65) 100%);
        /* IE10+ */
        background: linear-gradient(to bottom, transparent 0%, rgba(0, 0, 0, 0.65) 100%);
        /* W3C */
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#a6000000',GradientType=0 );
        /* IE6-9 */ }
  .home-carousel .container {
    position: absolute;
    bottom: 50px;
    left: 8px;
    width: 100%;
    right: 0;
    z-index: 100; }
  .home-carousel .ttl {
    color: #fff;
    font-family: "Calibre Light", helvetica, sans-serif;
    display: block;
    padding: 10px 0;
    overflow: hidden;
    margin-bottom: 8px; }
    .home-carousel .ttl p {
      font-size: 25px;
      line-height: 31px;
      margin-top: 10px;
      max-width: 400px; }
    .home-carousel .ttl strong {
      font-family: "Calibre Semibold", helvetica, sans-serif;
      font-weight: normal; }
  @media screen and (min-width: 500px) {
    .home-carousel {
      height: 100%; } }
  @media screen and (min-width: 768px) {
    .home-carousel .ttl p {
      font-size: 31px;
      line-height: 35px;
      position: relative;
      left: -3px;
      max-width: 500px;
      margin-top: 7px; }
    .home-carousel .slides {
      position: fixed;
      width: 100%;
      top: 0; } }

/*	- Grid
   ========================================================================== */
.mainwrapper {
  position: relative; }

/*	- Parralax
   ========================================================================== */
.abveparrx {
  position: relative;
  z-index: 2; }

.parallax-up {
  position: fixed;
  top: 150px;
  left: 0;
  height: 520px;
  position: fixed;
  width: 100%;
  background-repeat: no-repeat;
  background: url(../images/Toast-loader-Image-o.svg) no-repeat left top;
  -webkit-background-size: 90%;
  -moz-background-size: 90%;
  -ms-background-size: 90%;
  -o-background-size: 90%;
  background-size: 90%;
  z-index: 2;
  opacity: 0.02;
  pointer-events: none; }

.parallax-down {
  position: fixed;
  width: 100%;
  left: 0;
  background: url(../images/Toast-loader-Image-s.svg) no-repeat right bottom;
  z-index: 2;
  opacity: 0.02;
  top: 477px;
  height: 264px;
  -webkit-background-size: contain;
  -moz-background-size: contain;
  -ms-background-size: contain;
  -o-background-size: contain;
  background-size: contain;
  pointer-events: none; }

@media screen and (min-width: 768px) {
  .parallax-up, .parallax-down {
    min-height: 1100px; } }

.parallax-down {
  width: 100%; }

@media screen and (min-width: 768px) {
  .parallax-up {
    top: 0;
    height: 100%;
    width: 100%;
    -webkit-background-size: 1100px;
    -moz-background-size: 1100px;
    -ms-background-size: 1100px;
    -o-background-size: 1100px;
    background-size: 1100px; }

  .parallax-down {
    top: 0;
    -webkit-background-size: 720px;
    -moz-background-size: 720px;
    -ms-background-size: 720px;
    -o-background-size: 720px;
    background-size: 720px;
    height: 100%;
    min-width: 1210px; } }
.ltie9 .parallax-up,
.ltie9 .parallax-down,
.ie9 .parallax-up,
.ie9 .parallax-down {
  display: none; }

/* IE10 fix */
@media all and (-ms-high-contrast: none) {
  .parallax-up,
  .parallax-down {
    display: none; } }
.section-header .ttl {
  margin-bottom: 20px; }
  .section-header .ttl > span {
    color: #000;
    border-bottom: solid 2px #000;
    display: inline;
    font-size: 2.5em;
    line-height: 1.2em; }
@media screen and (min-width: 500px) {
  .section-header .ttl {
    width: 33.3334%;
    float: left;
    padding: 10px; }
  .section-header .bod {
    display: block;
    width: 66.6667%;
    padding: 10px;
    margin-left: 33.3334%;
    -webkit-column-count: 2;
    /* Chrome, Safari, Opera */
    -moz-column-count: 2;
    /* Firefox */
    column-count: 2;
    -webkit-column-gap: 20px;
    /* Chrome, Safari, Opera */
    -moz-column-gap: 20px;
    /* Firefox */
    column-gap: 20px; } }

/*	- HR elements
   ========================================================================== */
.hr.smllhr,
hr.smllhr {
  border-color: #fff;
  width: 25px;
  display: inline-block;
  border-width: 2px; }

.hr.smllhr.blk,
hr.smllhr.blk {
  border-color: #000; }

/*	- Header - non home
   ========================================================================== */
@media screen and (min-width: 768px) {
  .non-home .toast-logo desktop {
    width: 212px;
    height: 67px; } }
/*	- Services
   ========================================================================== */
.narrowrow {
  max-width: 1050px;
  margin: auto; }

.service-tiles {
  height: 255px; }
  .service-tiles .bglink {
    position: absolute;
    width: 100%;
    height: 100%; }
  .service-tiles .bkgd-image div {
    background-color: none; }
  .service-tiles .bkgd-image img {
    opacity: 0; }
  .service-tiles .bkgd-image div.hover {
    background-color: rgba(0, 0, 0, 0.5);
    position: absolute; }

@media screen and (min-width: 670px) {
  .service-tiles {
    height: auto;
    position: relative;
    width: 33.3334%;
    float: left; }
    .service-tiles .bkgd-image,
    .service-tiles .bkgd-image div {
      position: relative; }
    .service-tiles .bkgd-image img {
      opacity: 0; }
    .service-tiles:nth-child(3n+4) {
      clear: left; } }

/*	- NEWS
   ========================================================================== */
.post-meta.smll {
  font-family: 'Calibre Semibold', sans-serif;
  font-size: 16px;
  border: none;
  margin: 10px 0;
  text-transform: none;
  display: block; }

.bgimg {
  cursor: pointer; }

.note-instagram {
  position: relative;
  background: #000; }
  .note-instagram img {
    -webkit-transition: 0.4s;
    -moz-transition: 0.4s;
    -ms-transition: 0.4s;
    -o-transition: 0.4s;
    transition: 0.4s; }
  .note-instagram .icon-instagram {
    content: '';
    display: block;
    position: absolute;
    bottom: 15px;
    right: 15px;
    font-size: 38px;
    color: #fff; }
  .note-instagram:focus img, .note-instagram:hover img {
    opacity: .7; }

.note-advert {
  display: block;
  background: url(../images/bkgd/carve-smll.png) no-repeat center center black;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -ms-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  -webkit-transition: 0.4s;
  -moz-transition: 0.4s;
  -ms-transition: 0.4s;
  -o-transition: 0.4s;
  transition: 0.4s;
  color: #fff;
  padding: 30px 40px 40px 40px;
  /*
  	a {
  		color: #fff;
  		text-decoration: none;
  		&:hover {
  			text-decoration: underline;
  		}
  	}
  */ }
  .note-advert .ttl {
    font-size: 40px;
    line-height: 46px;
    border-bottom: solid 1px #fff;
    display: inline;
    font-family: 'Calibre Thin', sans-serif; }
  .note-advert .subttl {
    margin-top: 20px;
    font-size: 20px; }
  .note-advert .acti {
    text-transform: uppercase;
    font-size: 17px;
    margin: 14px 0 7px 0;
    line-height: 20px; }
  .note-advert .cta {
    line-height: 12px;
    font-size: 15px;
    font-weight: 700;
    margin-top: 15px; }
  .note-advert:focus, .note-advert:hover {
    background-color: rgba(0, 0, 0, 0.9); }

.note-mention {
  background: rgba(200, 200, 200, 0.3);
  padding: 30px 40px 40px 40px;
  display: block;
  -webkit-transition: 0.4s;
  -moz-transition: 0.4s;
  -ms-transition: 0.4s;
  -o-transition: 0.4s;
  transition: 0.4s; }
  .note-mention .ttl {
    font-family: 'Calibre Thin', sans-serif;
    font-size: 40px;
    line-height: 46px;
    border-bottom: solid 1px #000;
    margin-bottom: 20px;
    display: inline-block; }
  .note-mention:focus, .note-mention:hover {
    background: rgba(200, 200, 200, 0.6); }

.note-twitter {
  padding: 30px 40px 40px 40px;
  position: relative;
  display: block;
  background: rgba(200, 200, 200, 0.3);
  -webkit-transition: 0.4s;
  -moz-transition: 0.4s;
  -ms-transition: 0.4s;
  -o-transition: 0.4s;
  transition: 0.4s; }
  .note-twitter:before {
    content: '';
    display: block;
    width: 45px;
    height: 45px;
    position: absolute;
    bottom: 20px;
    right: 20px;
    background: url(../images/twitter_circle_black.svg) no-repeat center center;
    z-index: 1; }
  .note-twitter .ttl {
    font-family: 'Calibre Thin', sans-serif;
    font-size: 40px;
    line-height: 46px;
    margin-bottom: 20px;
    display: inline-block; }
    .note-twitter .ttl a {
      border-bottom: solid 1px #000;
      display: inline; }
  .note-twitter p {
    max-width: 85%; }
  .note-twitter a {
    word-wrap: break-word; }
  .note-twitter .bgimg {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -ms-background-size: cover;
    -o-background-size: cover;
    background-size: cover; }
  .note-twitter .txt {
    position: relative;
    z-index: 1; }

.note-twitter.tweetlink:focus, .note-twitter.tweetlink:hover {
  background: rgba(200, 200, 200, 0.6); }

.note-twitter.wthumb {
  background-color: #000;
  overflow: hidden; }
  .note-twitter.wthumb:before {
    content: '';
    display: block;
    width: 40px;
    height: 40px;
    position: absolute;
    bottom: 20px;
    right: 20px;
    background: url(../images/twitter_circle_white.svg) no-repeat center center;
    z-index: 1; }
  .note-twitter.wthumb .txt {
    color: #fff; }
    .note-twitter.wthumb .txt a {
      color: #fff; }
  .note-twitter.wthumb .ttl a {
    color: #fff;
    display: inline;
    border-bottom: solid 1px #fff; }
  .note-twitter.wthumb .bgimg {
    -webkit-transition: 0.4s;
    -moz-transition: 0.4s;
    -ms-transition: 0.4s;
    -o-transition: 0.4s;
    transition: 0.4s;
    opacity: 0.3; }
  @media screen and (min-width: 768px) {
    .note-twitter.wthumb .bgimg {
      opacity: 1; }
    .note-twitter.wthumb .txt {
      left: -120%; }
    .note-twitter.wthumb:hover .bgimg {
      opacity: 0.3; }
    .note-twitter.wthumb:hover .txt {
      left: 0;
      -webkit-animation: fadeinfromleft 0.4s ease-in;
      -moz-animation: fadeinfromleft 0.4s ease-in;
      -ms-animation: fadeinfromleft 0.4s ease-in;
      -o-animation: fadeinfromleft 0.4s ease-in;
      animation: fadeinfromleft 0.4s ease-in; } }

.note-fieldnote {
  background: #efeeec;
  padding: 30px 40px 40px 40px;
  position: relative;
  min-height: 450px; }
  .note-fieldnote .ttl {
    font-family: 'Calibre Thin', sans-serif;
    margin-bottom: 20px;
    font-size: 35px;
    line-height: 45px;
    display: inline-block; }
    .note-fieldnote .ttl a {
      border-bottom: solid 1px #000; }
  .note-fieldnote .bgimg {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -ms-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    background-position: center center; }
  .note-fieldnote .txt {
    width: 80%;
    position: relative;
    z-index: 1; }
  .note-fieldnote .social-networks {
    margin-top: 20px; }
    .note-fieldnote .social-networks a {
      color: #fff; }
  .note-fieldnote:before {
    content: '';
    display: block;
    width: 40px;
    height: 40px;
    position: absolute;
    bottom: 20px;
    right: 20px;
    background: url(../images/blog_circle_black.svg) no-repeat center center;
    z-index: 1; }

.note-fieldnote.wthumb {
  background-color: #000;
  overflow: hidden; }
  .note-fieldnote.wthumb .txt {
    color: #fff; }
  .note-fieldnote.wthumb .ttl a {
    color: #fff;
    border-bottom-color: #fff; }
  .note-fieldnote.wthumb .bgimg {
    opacity: 0.2; }
  @media screen and (min-width: 768px) {
    .note-fieldnote.wthumb .bgimg {
      opacity: 1; }
    .note-fieldnote.wthumb .txt {
      color: #fff;
      left: -120%; }
    .note-fieldnote.wthumb:hover .bgimg {
      opacity: 0.2; }
    .note-fieldnote.wthumb:hover .txt {
      left: 0;
      -webkit-animation: fadeinfromleft 0.4s ease-in;
      -moz-animation: fadeinfromleft 0.4s ease-in;
      -ms-animation: fadeinfromleft 0.4s ease-in;
      -o-animation: fadeinfromleft 0.4s ease-in;
      animation: fadeinfromleft 0.4s ease-in; } }

/*	- Studio header
   ========================================================================== */
.the-studio .main {
  background-color: #fff;
  position: relative; }

.studio-header {
  position: relative;
  margin-bottom: 50px;
  padding-bottom: 50%;
  width: 100%;
  top: 100px; }
  .studio-header .container {
    padding-top: 0; }
  .studio-header .coverfixbkgd-c {
    background-repeat: no-repeat;
    background-position: center top;
    -webkit-background-size: contain;
    -moz-background-size: contain;
    -ms-background-size: contain;
    -o-background-size: contain;
    background-size: contain;
    top: 100px; }
    @media screen and (min-width: 768px) {
      .studio-header .coverfixbkgd-c {
        top: 109px; } }
  @media screen and (min-width: 768px) {
    .studio-header {
      padding-bottom: 36%; } }

.htl {
  text-align: right;
  font-family: "Calibre Semibold", sans-serif;
  font-style: normal;
  font-weight: normal;
  text-transform: uppercase;
  font-size: 16px;
  padding-right: 2px;
  margin-bottom: 30px; }
  .htl .smllhr {
    margin: 5px 0px; }
  @media screen and (min-width: 768px) {
    .htl {
      position: absolute;
      top: 0;
      right: 0; } }

/* Tabs
---------------------------------- */
.tabbed-cnt {
  position: relative; }
  .tabbed-cnt .deco {
    display: none;
    position: absolute;
    top: 7px;
    left: 30%;
    margin: 5px 0 5px -60px; }
    @media screen and (min-width: 768px) {
      .tabbed-cnt .deco {
        display: block; } }
    @media screen and (min-width: 960px) {
      .tabbed-cnt .deco {
        left: 50%; } }

.tabbed-cnt {
  min-height: 300px; }
  @media screen and (min-width: 960px) {
    .tabbed-cnt {
      min-height: 350px; } }

.lbl {
  position: relative;
  padding: 10px 0 10px 0;
  padding-right: 40px; }
  .lbl .spanmarker {
    content: '';
    display: block;
    position: absolute;
    width: 18px;
    height: 18px;
    top: 50%;
    margin-top: -9px;
    right: 0; }
    .lbl .spanmarker:before {
      content: '';
      position: absolute;
      height: 2px;
      width: 17px;
      top: 8px;
      background: #000;
      transform: rotate(-45deg);
      -o-transform: rotate(-45deg);
      /* IE 9 */
      -ms-transform: rotate(-45deg);
      /* IE 9 */
      -moz-transform: rotate(-45deg);
      /* Chrome, Safari, Opera */
      -webkit-transform: rotate(-45deg);
      /* Chrome, Safari, Opera */
      -webkit-transition: 0.1s;
      -moz-transition: 0.1s;
      -ms-transition: 0.1s;
      -o-transition: 0.1s;
      transition: 0.1s; }
    .lbl .spanmarker:after {
      content: '';
      position: absolute;
      height: 2px;
      width: 17px;
      top: 8px;
      background: #000;
      -webkit-transition: 0.1s;
      -moz-transition: 0.1s;
      -ms-transition: 0.1s;
      -o-transition: 0.1s;
      transition: 0.1s;
      transform: rotate(45deg);
      -o-transform: rotate(45deg);
      /* IE 9 */
      -ms-transform: rotate(45deg);
      /* IE 9 */
      -moz-transform: rotate(45deg);
      /* Chrome, Safari, Opera */
      -webkit-transform: rotate(45deg);
      /* Chrome, Safari, Opera */
      left: -11px; }
  .lbl h3 {
    text-transform: uppercase;
    display: inline;
    font-size: 28px; }
    @media screen and (min-width: 768px) {
      .lbl h3 {
        line-height: .8; } }
    @media screen and (min-width: 960px) {
      .lbl h3 {
        font-size: 35px;
        line-height: 1.25; } }
    @media screen and (min-width: 1280px) {
      .lbl h3 {
        font-size: 42px; } }
  .lbl p {
    font-size: 18px;
    line-height: 21px; }
  @media screen and (min-width: 768px) {
    .lbl {
      max-width: 300px;
      width: 40%; }
      .lbl:before {
        display: none; } }
  @media screen and (min-width: 960px) {
    .lbl {
      padding: 20px 0 0 0;
      width: 50%; } }

.lbl.active h3 {
  font-family: "Calibre Semibold", sans-serif; }
.lbl.active .spanmarker:before {
  transform: rotate(45deg);
  -o-transform: rotate(45deg);
  /* IE 9 */
  -ms-transform: rotate(45deg);
  /* IE 9 */
  -moz-transform: rotate(45deg);
  /* Chrome, Safari, Opera */
  -webkit-transform: rotate(45deg);
  /* Chrome, Safari, Opera */
  left: -5px; }
.lbl.active .spanmarker:after {
  transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  /* IE 9 */
  -ms-transform: rotate(-45deg);
  /* IE 9 */
  -moz-transform: rotate(-45deg);
  /* Chrome, Safari, Opera */
  -webkit-transform: rotate(-45deg);
  /* Chrome, Safari, Opera */
  left: -5px; }

.tabbed-cnt .lbl {
  border-top: solid 2px #eee;
  cursor: pointer; }
@media screen and (min-width: 768px) {
  .tabbed-cnt .lbl:hover h3,
  .tabbed-cnt .lbl:focus h3 {
    font-family: "Calibre Semibold", sans-serif; } }
@media screen and (min-width: 768px) {
  .tabbed-cnt .lbl {
    border-top: none; } }

.lbl[data-lbl="intro"] {
  display: none;
  visibility: hidden; }

.sd-head {
  position: relative; }
  .sd-head hr.smllhr.deco {
    margin: 5px 0;
    position: absolute;
    top: 7px;
    left: 40%;
    margin-left: -40px; }
  @media screen and (min-width: 768px) {
    .sd-head {
      height: 0;
      padding-top: 40px; } }

.sd-head.mgm-team {
  height: auto;
  padding-top: auto; }
  .sd-head.mgm-team hr.smllhr.deco {
    display: none; }
  @media screen and (min-width: 960px) {
    .sd-head.mgm-team {
      height: 0;
      padding-top: 40px; }
      .sd-head.mgm-team hr.smllhr.deco {
        display: inline-block; } }

.tabbed-cnt {
  /*
  	.cnt {
  		opacity: 0;
  		
  	}
  	.cnt.active {
  		opacity: 1;
  		
  	}
  */ }
  .tabbed-cnt .cnt {
    display: none;
    margin-bottom: 40px; }
    .tabbed-cnt .cnt .ttl-wrap {
      margin: 0;
      max-width: 500px; }
    .tabbed-cnt .cnt p {
      font-size: 18px;
      display: inline;
      line-height: 23px; }
    .tabbed-cnt .cnt h4 {
      display: inline;
      border-bottom: solid 1px #000;
      font-size: 19px;
      line-height: 29px; }
    @media screen and (min-width: 768px) {
      .tabbed-cnt .cnt {
        padding: 0 7px;
        opacity: 0;
        display: block;
        -webkit-transition: 0.4s;
        -moz-transition: 0.4s;
        -ms-transition: 0.4s;
        -o-transition: 0.4s;
        transition: 0.4s;
        -webkit-transition-delay: 0s;
        transition-delay: 0s;
        position: absolute;
        top: 0;
        max-width: 420px;
        left: 40%;
        width: 40%;
        margin-left: 20px; }
        .tabbed-cnt .cnt h4 {
          font-size: 25px;
          line-height: 39px; }
        .tabbed-cnt .cnt .ttl-wrap {
          margin-top: 0; }
        .tabbed-cnt .cnt p {
          font-size: 18px;
          line-height: 23px; } }
    @media screen and (min-width: 960px) {
      .tabbed-cnt .cnt {
        padding: 20px 7px; }
        .tabbed-cnt .cnt p {
          font-size: 18px;
          line-height: 23px;
          /*
          				font-size: 24px;
          				line-height: 33px;
          */ } }
    @media screen and (min-width: 1280px) {
      .tabbed-cnt .cnt {
        padding: 20px 7px 100px 7px;
        left: 50%;
        width: 50%; }
        .tabbed-cnt .cnt h4 {
          font-size: 27px;
          line-height: 47px; } }
    @media screen and (min-width: 1105px) {
      .tabbed-cnt .cnt p {
        font-size: 20px;
        line-height: 30px; } }
    @media screen and (min-width: 1400px) {
      .tabbed-cnt .cnt h4 {
        font-size: 29px;
        line-height: 48px; }
      .tabbed-cnt .cnt p {
        font-size: 22px;
        line-height: 33px; } }
  .tabbed-cnt .cnt.first-child {
    display: block; }
  @media screen and (min-width: 768px) {
    .tabbed-cnt .cnt.active {
      opacity: 1;
      -webkit-transition-delay: .4s;
      transition-delay: .4s; } }

/* Team
---------------------------------- */
.team {
  position: relative;
  z-index: 99; }
  .team .tag {
    display: inline;
    border-bottom: solid 1px #000;
    font-size: 25px;
    line-height: 37px; }
  .team p {
    margin-top: 10px;
    margin-bottom: 10px;
    max-width: 600px; }
  @media screen and (min-width: 768px) {
    .team .intro {
      width: 70%;
      padding-right: 100px; }
    .team .tag {
      font-size: 25px;
      line-height: 41px; } }
  @media screen and (min-width: 960px) {
    .team .intro {
      width: 50%; } }
  @media screen and (min-width: 1280px) {
    .team .tag {
      font-size: 35px;
      line-height: 49px; } }

.team-excerpt {
  padding-right: 6px;
  min-height: 285px;
  float: left; }
  .team-excerpt .ttl {
    font-family: "Calibre Semibold", sans-serif;
    text-transform: uppercase;
    display: block;
    line-height: 20px;
    font-size: 16px;
    padding: 10px 10px 1px 10px; }
  .team-excerpt p {
    margin: 0;
    padding: 0 10px 20px 10px;
    font-size: 16px;
    line-height: 20px;
    min-height: 80px; }
  .team-excerpt a {
    display: block;
    position: relative; }
    .team-excerpt a:before {
      content: '';
      display: block;
      background: url(../images/cross.svg) no-repeat center center rgba(0, 0, 0, 0.5);
      width: 100%;
      height: 100%;
      opacity: 0;
      position: absolute;
      -webkit-transition: 0.4s;
      -moz-transition: 0.4s;
      -ms-transition: 0.4s;
      -o-transition: 0.4s;
      transition: 0.4s; }
    .team-excerpt a:focus:before, .team-excerpt a:hover:before {
      opacity: 1; }

.team-excerpt-intro {
  max-width: 700px;
  font-size: 18px;
  line-height: 28px; }
  .team-excerpt-intro span {
    border-bottom: solid 1px #000;
    display: inline; }
  @media screen and (min-width: 768px) {
    .team-excerpt-intro {
      font-size: 25px;
      line-height: 39px; } }
  @media screen and (min-width: 960px) {
    .team-excerpt-intro {
      width: 50%;
      padding: 20px 7px;
      margin-left: 40%;
      max-width: 420px; }
      .team-excerpt-intro > * {
        margin-left: 20px; } }
  @media screen and (min-width: 960px) {
    .team-excerpt-intro {
      font-size: 25px;
      line-height: 39px; } }
  @media screen and (min-width: 1280px) {
    .team-excerpt-intro {
      width: 50%;
      margin-left: 50%;
      font-size: 30px;
      line-height: 49px; } }

.team-excerpts.senior {
  margin-top: 65px; }
  .team-excerpts.senior .team-excerpt {
    width: 50%; }
    @media screen and (min-width: 500px) {
      .team-excerpts.senior .team-excerpt {
        width: 20%; }
        .team-excerpts.senior .team-excerpt img {
          width: 100%; } }

.team-excerpts.non-senior {
  margin-top: 12px; }
  .team-excerpts.non-senior .team-excerpt {
    width: 50%; }
    @media screen and (min-width: 500px) {
      .team-excerpts.non-senior .team-excerpt {
        width: 20%; } }
    @media screen and (min-width: 960px) {
      .team-excerpts.non-senior .team-excerpt {
        width: 12.5%; } }

.team-excerpts {
  overflow: hidden;
  margin-right: -6px; }

.team-cnt-shell {
  width: 100%;
  height: 100%;
  display: table; }

.container.team-cnt {
  position: relative;
  overflow: visible;
  display: table-cell;
  vertical-align: middle;
  padding-top: 60px;
  padding-bottom: 60px; }
  .container.team-cnt .mdl-close-btn {
    top: 20px;
    right: 0px;
    position: absolute;
    z-index: 1; }
    @media screen and (min-width: 768px) {
      .container.team-cnt .mdl-close-btn {
        position: absolute;
        top: 60px;
        right: -20px; } }
  .container.team-cnt h4 {
    font-family: "Calibre Semibold", sans-serif;
    text-transform: uppercase;
    display: block;
    font-size: 35px;
    line-height: 30px; }
  .container.team-cnt p.position {
    font-size: 21px;
    line-height: 25px;
    display: block;
    padding: 17px 0 42px 0;
    margin-bottom: 0; }
  .container.team-cnt p {
    margin-bottom: 13px;
    line-height: 23px; }
  .container.team-cnt .smllhr.blk {
    display: block;
    margin: 30px 0; }
  .container.team-cnt img {
    max-width: 195px; }
  @media screen and (min-width: 768px) {
    .container.team-cnt {
      padding-top: 100px;
      padding-bottom: 100px; } }
  @media screen and (min-width: 960px) {
    .container.team-cnt h4 {
      margin-left: 50%; }
    .container.team-cnt img {
      float: left;
      max-width: 290px; }
    .container.team-cnt .smllhr.blk {
      margin: 0 0 0 -70px;
      position: absolute;
      top: 0;
      left: 50%; }
    .container.team-cnt p {
      margin-left: 50%; }
    .container.team-cnt h4, .container.team-cnt p {
      max-width: 445px; } }
  @media screen and (min-width: 960px) {
    .container.team-cnt .smllhr.blk {
      margin: 0 0 0 -70px; } }

.team-cnt-wrap {
  display: none;
  background: #fff;
  position: fixed;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 1000;
  left: 0;
  overflow-y: scroll; }

img.mugshot {
  width: auto !important;
  margin-bottom: 40px; }

 /* Artist
---------------------------------- */
body.culture .mainwrapper {
  height: 100%;
  padding-top: 0; }
body.culture .past-culture-first {
  background-color: transparent; }
body.culture .past-culture-first.sticky .navbar {
  background-color: transparent; }
body.culture .past-culture-first .mainnav li.active a:before {
  background: #fff; }
body.culture .past-culture-first .mainnav a {
  color: #fff; }
  body.culture .past-culture-first .mainnav a:focus:before, body.culture .past-culture-first .mainnav a:hover:before {
    background: #fff; }
body.culture .nonsticky .navbar {
  background: transparent; }
body.culture .past-culture-first .hamburger em {
  background-color: #fff; }
body.culture .footer-wrap {
  margin-top: 20px; }
body.culture .toast-logo {
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -ms-background-size: cover;
  -o-background-size: cover;
  background-size: cover; }
body.culture .past-culture-first .toast-logo.non-reverse {
  opacity: 0;
  display: none;
  visibility: hidden; }
body.culture .past-culture-first .toast-logo.reverse {
  opacity: 1;
  display: block;
  visibility: visible; }
body.culture .not-past-culture-first .toast-logo.non-reverse {
  opacity: 1;
  display: block;
  visibility: visible; }
body.culture .not-past-culture-first .toast-logo.reverse {
  opacity: 0;
  display: none;
  visibility: hidden; }
@media screen and (min-width: 768px) {
  body.culture .footer-wrap {
    margin-top: 0; } }

.homepageintro {
  -webkit-transition: 0.4s;
  -moz-transition: 0.4s;
  -ms-transition: 0.4s;
  -o-transition: 0.4s;
  transition: 0.4s; }

.homepageintro.hide {
  opacity: 0; }

.artist-intro {
  -webkit-transition: 0.4s;
  -moz-transition: 0.4s;
  -ms-transition: 0.4s;
  -o-transition: 0.4s;
  transition: 0.4s; }

.artist-intro.hide {
  opacity: 0; }

.cl-down {
  display: none;
  background: url(../images/cl-down.svg) no-repeat center center;
  width: 46px;
  height: 28px;
  position: absolute;
  bottom: 10%;
  left: 50%;
  margin-left: -23px;
  -webkit-transition: 0.4s;
  -moz-transition: 0.4s;
  -ms-transition: 0.4s;
  -o-transition: 0.4s;
  transition: 0.4s; }
  @media screen and (min-width: 768px) {
    .cl-down {
      display: block; } }
  .cl-down:focus, .cl-down:hover {
    bottom: 7%; }

.fullsz-image:before {
  content: '';
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5); }

.fullsz-image {
  position: relative;
  top: 0;
  height: 100%;
  overflow: hidden;
  width: 100%;
  background-position: center center;
  background-repeat: no-repeat;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -ms-background-size: cover;
  -o-background-size: cover;
  background-size: cover; }
  .fullsz-image .intro {
    position: absolute;
    bottom: 10%;
    width: 100%;
    color: #fff;
    font-size: 60px;
    text-transform: uppercase;
    line-height: 43px; }
  .fullsz-image h1 {
    font-size: 45px;
    line-height: 43px;
    text-align: left; }
    @media screen and (min-width: 500px) {
      .fullsz-image h1 {
        font-size: 60px;
        line-height: 54px;
        max-width: 350px; } }

.culturepagehead .coverfixbkgd-c {
  background-position: center top;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -ms-background-size: cover;
  -o-background-size: cover;
  background-size: cover; }

.culture-first {
  padding-top: 100px;
  background-color: #fff;
  position: relative;
  padding-top: 30px; }
  @media screen and (min-width: 500px) {
    .culture-first {
      padding-bottom: 100px;
      padding-top: 100px; } }

.culture-first-intro {
  margin-bottom: 50px;
  position: relative; }
  .culture-first-intro .ttl {
    font-size: 40px;
    line-height: 40px;
    font-family: 'Calibre Thin', sans-serif;
    margin-bottom: 6px; }
  .culture-first-intro .sbttl {
    font-size: 26px;
    line-height: 36px;
    display: inline;
    border-bottom: solid 1px #000; }
  .culture-first-intro .htl {
    top: auto;
    bottom: 33px; }
  @media screen and (min-width: 500px) {
    .culture-first-intro .ttl {
      font-size: 50px;
      line-height: 52px; } }
  @media screen and (min-width: 960px) {
    .culture-first-intro .ttl {
      font-size: 70px;
      line-height: 65px; } }

.q-a-sect {
  margin-left: -10px;
  margin-right: -10px;
  padding: 0 35px; }
  .q-a-sect .slick-prev,
  .q-a-sect .slick-next {
    position: absolute;
    top: 50%;
    width: 14px;
    padding: 0;
    height: 24px;
    margin-top: -12px;
    display: block;
    border: none;
    text-indent: -99999px;
    overflow: hidden; }
    .q-a-sect .slick-prev:focus,
    .q-a-sect .slick-next:focus {
      outline: none; }
  .q-a-sect .slick-prev {
    background: url(../images/icons-horiz-blk.svg) no-repeat left bottom;
    left: 10px; }
  .q-a-sect .slick-next {
    background: url(../images/icons-horiz-blk.svg) no-repeat right bottom;
    right: 10px; }
  @media screen and (min-width: 500px) {
    .q-a-sect {
      padding: 0; }
      .q-a-sect .slick-prev {
        left: -15px; }
      .q-a-sect .slick-next {
        right: -15px; }
      .q-a-sect .slick-prev,
      .q-a-sect .slick-next {
        opacity: 0.5;
        -webkit-transition: 0.4s;
        -moz-transition: 0.4s;
        -ms-transition: 0.4s;
        -o-transition: 0.4s;
        transition: 0.4s; }
        .q-a-sect .slick-prev:focus, .q-a-sect .slick-prev:hover,
        .q-a-sect .slick-next:focus,
        .q-a-sect .slick-next:hover {
          opacity: 1; } }
  @media screen and (min-width: 670px) {
    .q-a-sect {
      margin-bottom: 120px; }
      .q-a-sect .slick-prev {
        left: -15px; }
      .q-a-sect .slick-next {
        right: -15px; } }
  @media screen and (min-width: 768px) {
    .q-a-sect {
      margin-bottom: 60px; }
      .q-a-sect .slick-prev,
      .q-a-sect .slick-next {
        top: 50%;
        margin-top: -12px; }
      .q-a-sect .slick-prev {
        left: -20px; }
      .q-a-sect .slick-next {
        right: -20px; } }

.q-a-sect-noslide {
  overflow: hidden; }

.q-a-box-wrap {
  text-align: center;
  padding: 10px;
  margin: 10px auto 10px auto; }
  @media screen and (min-width: 500px) {
    .q-a-box-wrap {
      float: left;
      width: 33.3334%; } }
  @media screen and (min-width: 768px) {
    .q-a-box-wrap {
      width: 20%;
      max-width: 400px; } }

.slick-slide .q-a-box-wrap {
  width: auto;
  padding: 10px; }

.q-a-box {
  position: relative;
  display: inline-block;
  cursor: pointer;
  text-align: left;
  width: 100%; }
  .q-a-box .q-a-box-hover {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    padding: 20px 0;
    -webkit-transition: 0.4s;
    -moz-transition: 0.4s;
    -ms-transition: 0.4s;
    -o-transition: 0.4s;
    transition: 0.4s;
    font-size: 22px;
    line-height: 25px;
    border-top: solid 2px #000; }
    .q-a-box .q-a-box-hover span {
      display: block;
      min-height: 52px; }
  .q-a-box .cc {
    display: block;
    opacity: 1;
    margin-bottom: 10px; }
  .q-a-box .cc.blackcol {
    display: none; }
  .q-a-box .cc.whitecol {
    display: block; }
  .q-a-box img {
    width: 100%;
    height: auto; }
  .q-a-box .q-a-box-hover {
    background: rgba(0, 0, 0, 0.8);
    color: #fff;
    position: absolute;
    border-top: none;
    padding: 30px;
    opacity: 0; }
  .q-a-box:focus .q-a-box-hover, .q-a-box:hover .q-a-box-hover {
    opacity: 1; }
  .q-a-box .cc {
    margin-bottom: 16px;
    position: relative;
    width: auto; }
    .q-a-box .cc path {
      fill: #fff; }
  @media screen and (min-width: 500px) {
    .q-a-box .cc {
      height: 20px;
      margin-bottom: 6px; }
    .q-a-box .q-a-box-hover {
      padding: 10px; }
      .q-a-box .q-a-box-hover span {
        font-size: 14px;
        line-height: 18px; } }
  @media screen and (min-width: 1105px) {
    .q-a-box {
      width: auto; }
      .q-a-box .cc {
        height: auto;
        margin-bottom: 16px;
        width: 50px; }
      .q-a-box .q-a-box-hover {
        padding: 20px; }
        .q-a-box .q-a-box-hover span {
          font-size: 20px;
          line-height: 25px; } }
  @media screen and (min-width: 1280px) {
    .q-a-box .q-a-box-hover {
      padding: 30px; } }

.home-break.culture-sec {
  position: relative;
  z-index: 2; }
  .home-break.culture-sec .taglist ul a,
  .home-break.culture-sec span.tag a {
    font-family: 'Calibre Semibold', helvetica, arial, sans-serif;
    font-weight: normal;
    pointer-events: none; }
    .home-break.culture-sec .taglist ul a:focus, .home-break.culture-sec .taglist ul a:hover,
    .home-break.culture-sec span.tag a:focus,
    .home-break.culture-sec span.tag a:hover {
      border-bottom: none; }
  @media screen and (min-width: 500px) {
    .home-break.culture-sec {
      min-height: 85px; } }
  @media screen and (min-width: 960px) {
    .home-break.culture-sec .ttl {
      font-size: 16px;
      line-height: 26px; } }

body.single .mdl-close-btn {
  display: block;
  position: absolute;
  top: 85px;
  right: 0;
  z-index: 1; }

@media screen and (min-width: 960px) {
  body.single .main .toppost {
    padding-top: 0; } }
.feattag {
  display: none;
  opacity: 0;
  position: absolute;
  left: 234px;
  bottom: 35px;
  -webkit-transition: 0.4s;
  -moz-transition: 0.4s;
  -ms-transition: 0.4s;
  -o-transition: 0.4s;
  transition: 0.4s; }
  .feattag > img {
    -webkit-transition: 0.4s;
    -moz-transition: 0.4s;
    -ms-transition: 0.4s;
    -o-transition: 0.4s;
    transition: 0.4s;
    display: block;
    transform: translateX(-20px);
    -o-transform: translateX(-20px);
    /* IE 9 */
    -ms-transform: translateX(-20px);
    /* IE 9 */
    -moz-transform: translateX(-20px);
    /* Chrome, Safari, Opera */
    -webkit-transform: translateX(-20px);
    /* Chrome, Safari, Opera */
    opacity: 0;
    transition-timing-function: ease-in; }
  .feattag > img:first-child {
    transition-delay: .1s; }
  .feattag > img:nth-child(2) {
    transition-delay: .3s; }
  .feattag > img:last-child {
    transition-delay: .5s; }
  @media screen and (min-width: 768px) and (min-height: 460px) {
    .feattag {
      display: block; } }

.feattag.show {
  opacity: 1; }
  .feattag.show > img {
    transform: translateX(0px);
    -o-transform: translateX(0px);
    /* IE 9 */
    -ms-transform: translateX(0px);
    /* IE 9 */
    -moz-transform: translateX(0px);
    /* Chrome, Safari, Opera */
    -webkit-transform: translateX(0px);
    /* Chrome, Safari, Opera */
    opacity: 1; }

.tabbed-cnt.artist_qa_tabs {
  min-height: 500px; }
  .tabbed-cnt.artist_qa_tabs .smllhr {
    top: -40px;
    opacity: 0; }
  .tabbed-cnt.artist_qa_tabs .lbl {
    padding: 10px 108px 10px 0;
    display: block;
    position: relative; }
  .tabbed-cnt.artist_qa_tabs .lbl h3 {
    font-size: 16px;
    line-height: 23px;
    text-transform: none;
    max-width: 172px;
    padding-left: 25px;
    display: inline-block; }
    .tabbed-cnt.artist_qa_tabs .lbl h3 > span {
      width: 40px;
      display: block;
      position: absolute;
      left: 0; }
  .tabbed-cnt.artist_qa_tabs .cnt .ttl-wrap {
    padding-left: 25px;
    padding-right: 25px; }
  .tabbed-cnt.artist_qa_tabs .tabbed-cnt .cnt p {
    font-size: 14px;
    line-height: 21px; }
  @media screen and (min-width: 415px) {
    .tabbed-cnt.artist_qa_tabs .lbl h3 {
      max-width: none; } }
  @media screen and (min-width: 768px) {
    .tabbed-cnt.artist_qa_tabs .lbl h3 {
      max-width: 200px; }
    .tabbed-cnt.artist_qa_tabs .cnt {
      padding: 3px; }
    .tabbed-cnt.artist_qa_tabs .lbl {
      padding: 5px 0;
      max-width: 350px; } }
  @media screen and (min-width: 768px) {
    .tabbed-cnt.artist_qa_tabs .lbl h3 {
      padding-left: 31px;
      font-size: 18px;
      line-height: 23px; }
    .tabbed-cnt.artist_qa_tabs .cnt {
      width: 50%; } }
  @media screen and (min-width: 1024px) {
    .tabbed-cnt.artist_qa_tabs .lbl h3 {
      max-width: 465px; } }
  @media screen and (min-width: 1280px) {
    .tabbed-cnt.artist_qa_tabs .smllhr {
      opacity: 1; } }

img.brand-crafted-thinking {
  width: 160px !important;
  position: relative;
  left: -6px; }
  @media screen and (min-width: 768px) {
    img.brand-crafted-thinking {
      right: 10px;
      position: absolute;
      bottom: -7px;
      left: auto; } }

.brand-crafted-thinking {
  width: 160px !important;
  position: relative;
  left: -6px;
  right: 10px;
  position: absolute;
  bottom: -7px;
  left: auto; }
  .brand-crafted-thinking img {
    display: block;
    width: 150px;
    opacity: 0; }
  .brand-crafted-thinking img:first-child {
    -webkit-animation: fadeinfromleft 0.8s 1 alternate ease-in forwards 1.1s;
    -moz-animation: fadeinfromleft 0.8s 1 alternate ease-in forwards 1.1s;
    -ms-animation: fadeinfromleft 0.8s 1 alternate ease-in forwards 1.1s;
    -o-animation: fadeinfromleft 0.8s 1 alternate ease-in forwards 1.1s;
    animation: fadeinfromleft 0.8s 1 alternate ease-in forwards 1.1s; }
  .brand-crafted-thinking img:nth-child(2) {
    -webkit-animation: fadeinfromleft 0.8s 1 alternate ease-in forwards 1.3s;
    -moz-animation: fadeinfromleft 0.8s 1 alternate ease-in forwards 1.3s;
    -ms-animation: fadeinfromleft 0.8s 1 alternate ease-in forwards 1.3s;
    -o-animation: fadeinfromleft 0.8s 1 alternate ease-in forwards 1.3s;
    animation: fadeinfromleft 0.8s 1 alternate ease-in forwards 1.3s; }
  .brand-crafted-thinking img:nth-child(3) {
    -webkit-animation: fadeinfromleft 0.8s 1 alternate ease-in forwards 1.5s;
    -moz-animation: fadeinfromleft 0.8s 1 alternate ease-in forwards 1.5s;
    -ms-animation: fadeinfromleft 0.8s 1 alternate ease-in forwards 1.5s;
    -o-animation: fadeinfromleft 0.8s 1 alternate ease-in forwards 1.5s;
    animation: fadeinfromleft 0.8s 1 alternate ease-in forwards 1.5s; }
  @media screen and (min-width: 768px) {
    .brand-crafted-thinking {
      right: 10px;
      position: absolute;
      bottom: -7px;
      left: auto; } }

/*
.feattag {
	display: none;
	opacity: 0;
	position: absolute;
	left: 234px;
	bottom: 28px;
	@include transition(.4s);
	> img {
		@include transition(.4s);
		display: block;
		@include transform(translateX(-20px));
		opacity: 0;
		transition-timing-function: ease-in;
	}
	> img:first-child {
		transition-delay: .1s;
	}
	> img:nth-child(2) {
		transition-delay: .3s;
	}
	> img:last-child {
		transition-delay: .5s;
	}
	@media screen and (min-width: $tablet-bp) and (min-height:460px){
		display: block;		
	}
}
.feattag.show {
	opacity: 1;
	> img {
		@include transform(translateX(0px));
		opacity: 1;
	}
}
*/
body.single .mdl-close-btn.post-close {
  position: fixed;
  top: 100px;
  right: 25px;
  margin-right: -10px;
  width: 40px;
  height: 40px; }
  @media screen and (min-width: 768px) {
    body.single .mdl-close-btn.post-close {
      right: 40px;
      top: 185px; } }

/*	Artist detail pages
   ========================================================================== */
.artist-intro-wrap {
  overflow: hidden;
  margin-top: 100px;
  margin-bottom: 100px; }
  .artist-intro-wrap p {
    max-width: 500px;
    margin-left: auto;
    font-size: 16px;
    line-height: 26px; }
  @media screen and (min-width: 768px) {
    .artist-intro-wrap {
      margin-top: 0; } }

.herovideoimage {
  max-width: 716px;
  padding-top: 39px;
  clear: left; }
  .herovideoimage > * {
    height: auto;
    width: 100%; }

.artist-intro {
  text-align: right; }
  .artist-intro .smllhr {
    margin-top: 28px;
    margin-bottom: 40px; }
  .artist-intro .artist-no {
    display: block; }
  .artist-intro .artist-ttl {
    text-transform: uppercase;
    line-height: 42px;
    font-size: 45px;
    margin: 10px 0 15px 0; }
  .artist-intro .artist-type {
    font-family: "Calibre Semibold", helvetica, sans-serif;
    text-transform: uppercase;
    font-size: 17px;
    margin-bottom: 40px; }
  .artist-intro .cnt {
    margin: 30px 0 20px 0; }

.findoutmore {
  display: block;
  font-family: 'Calibre Semibold';
  padding: 15px 0 0 0;
  font-size: 16px; }
  .findoutmore:hover, .findoutmore:focus {
    text-decoration: underline; }
  @media screen and (min-width: 768px) {
    .findoutmore {
      font-size: 18px; } }

.art-ttl-style {
  font-size: 26px;
  border-bottom: solid 1px #000;
  margin: 20px 0;
  display: inline-block; }

@media screen and (min-width: 700px) {
  .herovideoimage {
    width: 60%; }

  .artist-intro.dt {
    float: right;
    width: 40%;
    max-width: 320px;
    padding-left: 30px; } }
@media screen and (min-width: 768px) {
  .herovideoimage {
    float: left; }

  .artist-intro.dt {
    padding-top: 61px; }

  .artist-intro .artist-ttl {
    line-height: 54px;
    font-size: 54px; }
  .artist-intro .smllhr {
    opacity: 1; } }
/* artist listing page
==================================================== */
.container.artist-section-ttl-outerwrap {
  margin-top: 100px; }
  @media screen and (max-width: 960px) {
    .container.artist-section-ttl-outerwrap {
      padding: 40px 0; } }
  @media screen and (min-width: 768px) {
    .container.artist-section-ttl-outerwrap {
      margin-top: 0; } }

.artist-section-ttl-wrap {
  max-width: 495px;
  margin-bottom: 10px; }

.artist-section-ttl {
  font-size: 25px;
  line-height: 37px;
  display: inline;
  border-bottom: solid 1px #000;
  font-family: "Calibre Thin", helvetica, sans-serif; }
  @media screen and (min-width: 500px) {
    .artist-section-ttl {
      font-size: 35px;
      line-height: 49px;
      border-bottom: solid 2px #000; } }
  @media screen and (min-width: 960px) {
    .artist-section-ttl {
      font-size: 43px;
      line-height: 60px; } }

.artist-listing {
  overflow: hidden;
  position: relative;
  background-color: #000; }
  .artist-listing .artist-intro {
    z-index: 1;
    pointer-events: none; }
  .artist-listing .artist-ttl,
  .artist-listing .artist-ttl a {
    color: #fff; }
  .artist-listing .artist-ttl {
    line-height: 47px;
    margin: 10px 0 10px 0; }
  .artist-listing .artist-type,
  .artist-listing .artist-type a {
    color: #fff; }
  .artist-listing .catlinks a {
    color: #fff;
    font-family: 'Calibre Semibold', helvetica, arial, sans-serif;
    text-transform: uppercase;
    font-size: .9em; }
  .artist-listing .lrg-link {
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -ms-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    -webkit-transition: 0.5s;
    -moz-transition: 0.5s;
    -ms-transition: 0.5s;
    -o-transition: 0.5s;
    transition: 0.5s;
    background-position: right center;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    text-indent: -99999px; }
  .artist-listing:hover .lrg-link {
    opacity: 0.7;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -ms-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    transform: scale(1.05);
    -o-transform: scale(1.05);
    /* IE 9 */
    -ms-transform: scale(1.05);
    /* IE 9 */
    -moz-transform: scale(1.05);
    /* Chrome, Safari, Opera */
    -webkit-transform: scale(1.05);
    /* Chrome, Safari, Opera */ }

.artist-listing.nonumber:before {
  content: '';
  display: block;
  position: absolute;
  top: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.4);
  z-index: 1;
  pointer-events: none; }
.artist-listing.nonumber .artist-intro .smllhr {
  margin-top: 28px;
  margin-bottom: 20px; }
.artist-listing.nonumber .artist-intro .lrg-link {
  background-position: center center; }
@media screen and (min-width: 960px) {
  .artist-listing.nonumber .artist-intro {
    padding: 90px 0; } }

.hmbp-image {
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -ms-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  width: 100%;
  height: 100%;
  -webkit-animation: shim-image 2s ease-in;
  -moz-animation: shim-image 2s ease-in;
  -ms-animation: shim-image 2s ease-in;
  -o-animation: shim-image 2s ease-in;
  animation: shim-image 2s ease-in; }
  .hmbp-image:before {
    content: '';
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 9;
    /* IE9 SVG, needs conditional override of 'filter' to 'none' */
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzAwMDAwMCIgc3RvcC1vcGFjaXR5PSIwIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMwMDAwMDAiIHN0b3Atb3BhY2l0eT0iMC42NSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
    background: -moz-linear-gradient(top, transparent 0%, rgba(0, 0, 0, 0.45) 100%);
    /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, transparent), color-stop(100%, rgba(0, 0, 0, 0.45)));
    /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, transparent 0%, rgba(0, 0, 0, 0.45) 100%);
    /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, transparent 0%, rgba(0, 0, 0, 0.45) 100%);
    /* Opera 11.10+ */
    background: -ms-linear-gradient(top, transparent 0%, rgba(0, 0, 0, 0.45) 100%);
    /* IE10+ */
    background: linear-gradient(to bottom, transparent 0%, rgba(0, 0, 0, 0.45) 100%);
    /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#a6000000',GradientType=0 );
    /* IE6-8 */ }

.shimmer-effect,
.shimmer-effect li {
  display: block;
  width: 100%;
  height: 100%;
  padding: 0;
  margin: 0;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -ms-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  background-attachment: fixed;
  background-color: #000; }

.shimmer-effect {
  position: relative; }
  .shimmer-effect .x {
    color: #fff; }

.shimmer-effect li {
  position: absolute;
  top: 0;
  left: 0; }

.shimmer-effect li.hide {
  opacity: 0; }

.shimmer-effect li:first-child {
  z-index: 50; }

.shimmer-effect li:nth-child(2) {
  z-index: 40; }

.shimmer-effect li:nth-child(3) {
  z-index: 30; }

.shimmer-effect li:nth-child(4) {
  z-index: 20; }

.shimmer-effect li:last-child {
  z-index: 10; }

.shimmer-effect li:before {
  content: '';
  display: block;
  bottom: 0;
  top: auto;
  left: 0;
  width: 100%;
  position: absolute;
  height: 100%;
  /* IE9 SVG, needs conditional override of 'filter' to 'none' */
  background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzAwMDAwMCIgc3RvcC1vcGFjaXR5PSIwIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMwMDAwMDAiIHN0b3Atb3BhY2l0eT0iMC42NSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
  background: -moz-linear-gradient(top, transparent 0%, rgba(0, 0, 0, 0.65) 100%);
  /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, transparent), color-stop(100%, rgba(0, 0, 0, 0.65)));
  /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top, transparent 0%, rgba(0, 0, 0, 0.65) 100%);
  /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top, transparent 0%, rgba(0, 0, 0, 0.65) 100%);
  /* Opera 11.10+ */
  background: -ms-linear-gradient(top, transparent 0%, rgba(0, 0, 0, 0.65) 100%);
  /* IE10+ */
  background: linear-gradient(to bottom, transparent 0%, rgba(0, 0, 0, 0.65) 100%);
  /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#a6000000',GradientType=0 );
  /* IE6-8 */ }
@media screen and (min-width: 500px) {
  .shimmer-effect li:before {
    height: 40%; } }

/*
@-webkit-keyframes shim-pitchblack {
    0%,50%		{	opacity: 0; -webkit-transform: translateX(-20px);} 
    100% 		{	opacity: 1;	-webkit-transform: translateX(0);} 
}
@-moz-keyframes shim-pitchblack { 
    0%,50%		{	opacity: 0; -moz-transform: translateX(-20px);} 
    100% 		{	opacity: 1;	-moz-transform: translateX(0);} 
}
@-ms-keyframes shim-pitchblack { 
    0%,50%		{	opacity: 0; -ms-transform: translateX(-20px);} 
    100% 		{	opacity: 1;	-ms-transform: translateX(0);} 
}
@-o-keyframes shim-pitchblack { 
    0%,50%		{	opacity: 0; -o-transform: translateX(-20px);} 
    100% 		{	opacity: 1;	-o-transform: translateX(0);} 
}
@keyframes shim-pitchblack { 
    0%,50%		{	opacity: 0; transform: translateX(-20px);} 
    100% 		{	opacity: 1;	transform: translateX(0);} 
}
*/
/*
@-webkit-keyframes shim-overlay {
    0%			{	opacity: 0; } 
    60%			{	opacity: 0.3; } 
    61%			{	opacity: 0.7; } 
    70%			{	opacity: 0.3; } 
	75%			{	opacity: 0.7; } 
    100% 		{	opacity: 0;	} 
}
@-moz-keyframes shim-overlay { 
    0%			{	opacity: 0.3; } 
    10%			{	opacity: 0.3; } 
    11%			{	opacity: 0.7; } 
    20%			{	opacity: 0.3; } 
	25%			{	opacity: 0.7; } 
    100% 		{	opacity: 1;	} 
}
@-ms-keyframes shim-overlay { 
    0%			{	opacity: 0.3; } 
    10%			{	opacity: 0.3; } 
    11%			{	opacity: 0.7; } 
    20%			{	opacity: 0.3; } 
	25%			{	opacity: 0.7; } 
    100% 		{	opacity: 1;	} 
}
@-o-keyframes shim-overlay { 
    0%			{	opacity: 0.3; } 
    10%			{	opacity: 0.3; } 
    11%			{	opacity: 0.7; } 
    20%			{	opacity: 0.3; } 
	25%			{	opacity: 0.7; } 
    100% 		{	opacity: 1;	} 
}
@keyframes shim-overlay { 
    0%			{	opacity: 0.3; } 
    10%			{	opacity: 0.3; } 
    11%			{	opacity: 0.7; } 
    20%			{	opacity: 0.3; } 
	25%			{	opacity: 0.7; } 
    100% 		{	opacity: 1;	} 
}
*/
@-webkit-keyframes shim-image {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }
@-moz-keyframes shim-image {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }
@-ms-keyframes shim-image {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }
@-o-keyframes shim-image {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }
@keyframes shim-image {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }
/*
.shim-pitchblack {
	opacity: 0;
}
*/
/*
.shim-overlay {
	@include animate (shim-overlay 15s ease-in);	
}
*/
.shim-image {
  opacity: 1;
  -webkit-animation: shim-image 1s ease-in;
  -moz-animation: shim-image 1s ease-in;
  -ms-animation: shim-image 1s ease-in;
  -o-animation: shim-image 1s ease-in;
  animation: shim-image 1s ease-in; }

html.js .mblnav-open ul li {
  opacity: 0; }

.mblheader {
  display: block;
  height: 100px;
  position: absolute;
  width: 100%; }
  .mblheader .mbllogo {
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
    width: 135px;
    height: 39px;
    left: -2px;
    position: absolute;
    bottom: 31px;
    background: url("../images/toast-logo-reverse.svg") no-repeat center center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -ms-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    z-index: 9; }
    .mblheader .mbllogo:focus, .mblheader .mbllogo:hover {
      text-decoration: none;
      border: none; }
    .mblheader .mbllogo:before {
      display: none;
      visibility: hidden; }
  .mblheader .hamburger em {
    background: #fff !important;
    opacity: 1;
    z-index: 9; }
  @media screen and (min-width: 768px) {
    .mblheader {
      display: none; } }

.artist-nav {
  overflow: hidden;
  width: 40px;
  float: left;
  margin-top: 28px;
  top: 0; }
  .artist-nav a {
    display: block;
    width: 14px;
    height: 25px;
    text-indent: -99999px;
    overflow: hidden;
    font-size: 0;
    line-height: 0;
    text-decoration: none;
    position: relative; }
  .artist-nav a[rel="prev"] {
    float: left;
    background: url(../images/icons-horiz-blk.svg) no-repeat left center;
    margin-right: 8px; }
  .artist-nav a[rel="next"] {
    float: left;
    background: url(../images/icons-horiz-blk.svg) no-repeat right center; }
  @media screen and (min-width: 768px) {
    .artist-nav {
      position: relative;
      top: auto; } }

.artistslider {
  position: relative; }

.mainwrapper {
  -webkit-animation: fadein 1s ease-in;
  -moz-animation: fadein 1s ease-in;
  -ms-animation: fadein 1s ease-in;
  -o-animation: fadein 1s ease-in;
  animation: fadein 1s ease-in; }

.piccta-mask {
  overflow: hidden;
  height: 374px;
  text-align: center;
  padding-right: 20px;
  padding-left: 20px; }
  .piccta-mask > * {
    color: #fff;
    z-index: 3;
    position: relative; }
  .piccta-mask .ttl {
    font-size: 2.3em;
    margin: 120px auto 20px auto; }
  .piccta-mask .bod {
    font-size: 1.5em;
    max-width: 550px;
    margin: auto; }
  .piccta-mask .btn {
    border-bottom: solid 2px #fff;
    background: transparent;
    padding: 15px auto;
    color: #fff;
    font-size: 1.5em;
    margin: 20px;
    display: inline-block;
    -webkit-transition: 0.4s;
    -moz-transition: 0.4s;
    -ms-transition: 0.4s;
    -o-transition: 0.4s;
    transition: 0.4s; }
    .piccta-mask .btn:focus, .piccta-mask .btn:hover {
      border-bottom-color: transparent; }
  @media screen and (min-width: 768px) {
    .piccta-mask {
      height: 426px; }
      .piccta-mask .ttl {
        font-size: 2.7em; } }

.piccta {
  padding: 85px 20px;
  height: 550px;
  bottom: 0;
  opacity: 0;
  position: fixed;
  width: 100%;
  overflow: hidden;
  padding: 40px 20px;
  background-image: url(../images/bkgd/Toast-Contact-Strip.jpg);
  background-position: top center;
  background-repeat: no-repeat;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -ms-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  -webkit-backface-visibility: hidden;
  -webkit-perspective: 1000;
  backface-visibility: hidden;
  perspective: 1000; }
  .piccta:before {
    content: '';
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.2); }
  @media screen and (min-width: 768px) {
    .piccta {
      padding: 85px 20px; } }

.piccta.showit {
  opacity: 1; }

.ltie9 .piccta,
.ie9 .piccta {
  display: none; }
.ltie9 .piccta-mask,
.ie9 .piccta-mask {
  position: relative;
  background-image: url(../images/bkgd/Toast-Contact-Strip.jpg); }

/* IE10 fix */
@media all and (-ms-high-contrast: none) {
  .piccta {
    display: none; }

  .piccta-mask {
    position: relative;
    background-image: url(../images/bkgd/Toast-Contact-Strip.jpg); } }
/* IE11 */
@media all and (-ms-high-contrast: none) {
  *::-ms-backdrop, .piccta {
    display: none; }

  *::-ms-backdrop, .piccta-mask {
    position: relative;
    background-image: url(../images/bkgd/Toast-Contact-Strip.jpg); } }
.backtotop {
  display: none;
  position: fixed;
  bottom: 0;
  right: 0;
  width: 74px;
  height: 74px;
  z-index: 50;
  opacity: 0;
  text-indent: -999999px;
  -webkit-transition: 0.5s;
  -moz-transition: 0.5s;
  -ms-transition: 0.5s;
  -o-transition: 0.5s;
  transition: 0.5s;
  background: url(../images/backtop-black.svg) no-repeat center center; }
  @media screen and (min-width: 960px) {
    .backtotop {
      display: block; } }

.backtotop.settobtm {
  background: url(../images/backtop.svg) no-repeat center center; }

.backtotop.show {
  opacity: 1; }

.coverfixbkgd-p {
  position: relative; }

.coverfixbkgd-c {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-position: center top; }

.bkgd-cover {
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -ms-background-size: cover;
  -o-background-size: cover;
  background-size: cover; }

.fbteamexcerpt {
  margin: 60px 0; }
  .fbteamexcerpt img {
    margin-right: 30px;
    max-width: 320px;
    width: 100%;
    margin-bottom: 30px; }
  .fbteamexcerpt .ttl {
    font-family: "Calibre Semibold", sans-serif;
    text-transform: uppercase;
    display: block;
    font-size: 35px;
    line-height: 30px; }
  .fbteamexcerpt .position {
    font-size: 21px;
    line-height: 25px;
    display: block;
    padding: 17px 0 42px 0;
    margin-bottom: 0; }
  @media (min-width: 768px) {
    .fbteamexcerpt img {
      float: left;
      margin-right: 30px; }
    .fbteamexcerpt .fbteamexcerpt-cnt {
      margin-left: 340px; } }

.the-studio .main {
  background-color: #fff;
  position: relative;
  z-index: 2;
  padding-bottom: 70px; }
  @media screen and (min-width: 768px) and (min-height: 460px) {
    .the-studio .main {
      padding-top: 100px; } }

.home .main {
  background-color: #fff;
  position: relative;
  z-index: 2;
  padding-bottom: 70px;
  padding-top: 100px; }
  @media screen and (min-width: 768px) and (min-height: 460px) {
    .home .main {
      padding-top: 0; } }

.contact .mainwrapper {
  padding-top: 100px; }
  @media screen and (min-width: 768px) and (min-height: 460px) {
    .contact .mainwrapper {
      padding-top: 150px; } }

.piccta {
  z-index: 0; }

.first-visit .home-carousel {
  z-index: 2; }

.proj-services-menu {
  display: block;
  padding: 0 !important;
  margin: 0 !important; }
  .proj-services-menu li {
    display: block;
    float: left;
    list-style: none;
    padding: 0; }
  .proj-services-menu a {
    display: block;
    padding: 0 10px 0 0;
    color: #999;
    font-weight: 600;
    -webkit-transition: 0.4s;
    -moz-transition: 0.4s;
    -ms-transition: 0.4s;
    -o-transition: 0.4s;
    transition: 0.4s; }
    .proj-services-menu a:focus, .proj-services-menu a:hover {
      color: #000; }
  .proj-services-menu .current-project-parent a {
    color: #000; }
  @media screen and (min-width: 768px) and (min-height: 460px) {
    .proj-services-menu a {
      padding: 0 20px 0 0; } }

.toastaddress {
  font-size: 0.9em;
  line-height: 1.4em;
  margin-bottom: 20px;
  text-align: center; }
  .toastaddress strong {
    font-size: 1.1em; }
  .toastaddress strong,
  .toastaddress .lastline {
    display: block; }
  @media screen and (min-width: 670px) {
    .toastaddress {
      float: left;
      text-align: left; }
      .toastaddress strong,
      .toastaddress .lastline {
        display: inline; }
      .toastaddress strong {
        font-size: 1em; } }

ul.submenu {
  display: none; }
  ul.submenu a {
    font-size: 13px;
    display: inline-block; }
  ul.submenu li {
    padding-top: 12px;
    padding-bottom: 0; }
  @media screen and (min-width: 670px) {
    ul.submenu {
      position: absolute;
      background-color: #fff;
      left: 1px;
      top: 48px; }
      ul.submenu li {
        padding-bottom: 12px; } }

.hassubmenu.open > a {
  opacity: .3; }
.hassubmenu.open ul.submenu {
  display: block; }
@media screen and (min-width: 670px) {
  .hassubmenu.open ul.submenu {
    display: none; } }

@media screen and (min-width: 670px) {
  .hassubmenu:focus ul.submenu, .hassubmenu:hover ul.submenu {
    display: block; } }

.ps-sm-icons > * {
  float: left;
  width: 29px;
  height: 29px;
  display: block;
  overflow: hidden;
  position: relative;
  margin-right: 1px; }
.ps-sm-icons .icon-facebook,
.ps-sm-icons .icon-twitter,
.ps-sm-icons .icon-googleplus {
  position: absolute;
  top: 1px;
  left: 1px;
  pointer-events: none;
  z-index: 1; }
.ps-sm-icons .ps-sm-link {
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
  width: 29px;
  height: 29px;
  overflow: hidden; }
