@charset "UTF-8";

@font-face {
    font-family: 'raleway';
    src: url('../fonts/raleway-bold.eot');
    src: url('../fonts/raleway-bold.eot?#iefix') format('embedded-opentype'),
         url('../fonts/raleway-bold.woff') format('woff'),
         url('../fonts/raleway-bold.ttf') format('truetype'),
         url('../fonts/raleway-bold.svg#raleway') format('svg');
    font-weight: normal;
    font-style: normal;

}
@import url(https://fonts.googleapis.com/css?family=Oswald:400,300,700&subset=latin,latin-ext);
@font-face {
  font-family: 'Neuzeit';
  font-weight: normal;
  font-style: normal;
  src: url("../fonts/neuzeit-book.eot");
  /* IE9 Compat Modes */
  src: url("../fonts/neuzeit-bookd41d.eot?#iefix") format("embedded-opentype"), url("../fonts/neuzeit-book.woff") format("woff"), url("../fonts/neuzeit-book.html") format("truetype"), url("../fonts/neuzeit-book.svg#svgFontName") format("svg");
  /* Legacy iOS */ }
@font-face {
  font-family: 'Neuzeit';
  font-weight: bold;
  font-style: normal;
  src: url("../fonts/neuzeit-book.eot");
  /* IE9 Compat Modes */
  src: url("../fonts/neuzeit-bookd41d.eot?#iefix") format("embedded-opentype"), url("../fonts/neuzeit-book.woff") format("woff"), url("../fonts/neuzeit-book.html") format("truetype"), url("../fonts/neuzeit-book.svg#svgFontName") format("svg");
  /* Legacy iOS */ }
@font-face {
  font-family: 'fontello';
  src: url("../fonts/fontello97d2.eot?67832890");
  src: url("../fonts/fontello97d2.eot?67832890#iefix") format("embedded-opentype"), url("../fonts/fontello97d2.woff?67832890") format("woff"), url("../fonts/fontello97d2.html?67832890") format("truetype"), url("../fonts/fontello97d2.svg?67832890#fontello") format("svg");
  font-weight: normal;
  font-style: normal; }
/**
 * Eric Meyer's Reset CSS v2.0 (http://meyerweb.com/eric/tools/css/reset/)
 * http://cssreset.com
 */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline; }

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


.artworks-space {
	margin-right: 32px; 
}


body {
  line-height: 1; }

ol, ul {
  list-style: none; }

blockquote, q {
  quotes: none; }

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

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

body {
  font-family: 'Oswald';
  font-size: 15px;
  line-height: 1.4em;
  color: #6d6e71;
  background: white;
  position: relative;
  min-height: 100%;
  -webkit-font-smoothing: antialiased; }

[class^="icon-"]:before, [class*=" icon-"]:before {
  font-family: "fontello";
  font-style: normal;
  font-weight: normal;
  speak: none;
  display: inline-block;
  text-decoration: inherit;
  width: 1em;
  margin-right: .2em;
  text-align: center;
  /* opacity: .8; */
  /* For safety - reset parent styles, that can break glyph codes*/
  font-variant: normal;
  text-transform: none;
  /* fix buttons height, for twitter bootstrap */
  line-height: 1em;
  /* Animation center compensation - margins should be symmetric */
  /* remove if not needed */
  margin-left: .2em;
  /* you can be more comfortable with increased icons size */
  /* font-size: 120%; */
  /* Uncomment for 3D effect */
  /* text-shadow: 1px 1px 1px rgba(127, 127, 127, 0.3); */ }


.icon-instagram:before {
  content: '\e800'; }

.icon-vimeo:before {
  content: '\e802'; }

.icon-facebook:before {
  content: '\e801'; }


header > div,
footer > div,
.wrapper {
  max-width: 1500px;
  width: 90%;
  margin: 0 auto; }

.wrapper:after, .grid:after {
  content: '';
  clear: both;
  display: block; }

html {
  height: 100%; }

body {
  height: 100%;
   }

.wrap,
.page-content {
  min-height: 100%;
  background: white;
}

.margintop
{
    margin-top:120px;
}
.overflow-visible {
  overflow: visible !important; }

@media screen and (max-width: 800px) {
  body {
    -webkit-text-size-adjust: 100%; } }
header {
  background: #333333;
  position: fixed;
  left: 0;
  right: 0;
  top: 0;
  padding: 0;
  z-index: 1001; }

header .marque {
  display: inline-block;
  vertical-align: center;
  float: left;
  line-height: 3em;
  width: 12px; }

header .marque img {
  display: block;
  margin-top: 0px; }

header nav {
  float: right;
  overflow: hidden;
  width: auto;
  margin-top:10px;
}

header nav a {
  text-decoration: none;
  line-height: 3em;
  color: #fff;
  display: block;
  padding: 0 0.6em;
  float: left;
  -webkit-transition: color 0.3s ease-out;
  -ms-transition: color 0.3s ease-out;
  -moz-transition: color 0.3s ease-out;
  -o-transition: color 0.3s ease-out;
  transition: color 0.3s ease-out; }

nav a.selected {
  color: #ACD07A; }

header nav a:hover,
.work nav a.work,
.us nav a.us,
.journal nav a.journal {
  color: #333333; }
.work {
    background-color: #ACD07A;
    line-height: 55pt;
    height: 70px;
}
.social-icons {
  font-size: 15px;
  line-height: 1.4em;
  display: inline-block;
  line-height: 4em;
      margin-top: 5px;
      
    margin-left: 10px;
}
  .social-icons a {
    color: #E3E8DC;
    text-decoration: none;
    border-bottom: 0 !important;
    font-size: 1.2em;
    transition: all 0.3s ease-out; }
    .social-icons a:hover {
      color: #ACD07A; }
  .social-icons li {
    display: inline-block; }

.header-social-icons {
  float: right;
  text-align: right; }





.homepage-header {
  background: #ACD07A;
      
          padding: 4px 0 0 0;
  }
.homepage-header-inner {
  font-size: 1.6em;
    color: white;
    line-height: 1.4;
    text-align: center;
    width: 70%;
    margin: 30px auto 0px auto;
    padding-bottom: 30px;
}
.homepage-header-img img
{
    width:100%;
}





@media all and (min-width: 800px) {
  .header-social-icons {
    width: 25%; }

  header nav {
    width: 15%; } }
@media all and (min-width: 1060px) {
  header nav {
    width: 12%; } }
@media only screen and (max-width: 540px) {
 
	.icon-instagram {
    display: none; }
	.icon-facebook {
    display: none; }
	.icon-vimeo {
    display: none; }
	.artworks-space {
	margin-right: 0px; 
	}
}


.site-footer {
  color: #999999;
  background: white;
  position: static;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 100;
  border-top: 1px solid rgba(109, 110, 113, 0.25);
  line-height: 1.35; }

.home-page .site-footer {
  border-top: 0; }

.footer-block {
  display: block;
  width: 100%;
  margin: 2em 0; }
  .footer-block:first-child {
    max-width: none; }
  .footer-block.project-planner:hover {
    background: #f0f0f0; }
  .footer-block h3 {
    color: #6d6e71;
    margin-bottom: 0.3em; }
  .footer-block p {
    margin-bottom: 1em; }
  .footer-block a {
    color: #999999;
    text-decoration: none;
    -webkit-transition: all 0.3s ease-out;
    -ms-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out; }
    .footer-block a:hover {
      color: #ACD07A; }
  .footer-block .tel {
    margin-bottom: 0; }
  .footer-block .address span:after {
    content: ', '; }
  .footer-block .address span:last-child:after {
    content: ''; }

a.footer-block {
  color: #999999;
  text-decoration: none;
  -webkit-transition: all 0.3s ease-out;
  -ms-transition: all 0.3s ease-out;
  -moz-transition: all 0.3s ease-out;
  -o-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out; }

.social li {
  margin: 0.2em 0; }

footer input {
  display: block;
  font-size: 1em;
  font-family: 'Oswald';
  -webkit-font-smoothing: antialiased;
  color: #a7a9ac;
  padding: 0.4em 0;
  margin-bottom: 0.4em;
  border: 0; }

footer input.text {
  border-bottom: 1px solid rgba(109, 110, 113, 0.25);
  width: 100%;
  max-width: 20em; }

footer input[type="submit"] {
  border-bottom: 1px solid rgba(109, 110, 113, 0.25);
  background: transparent;
  padding: 0.4em 0;
  cursor: pointer;
  -webkit-transition: all 0.3s ease-out;
  -ms-transition: all 0.3s ease-out;
  -moz-transition: all 0.3s ease-out;
  -o-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out; }
  footer input[type="submit"]:hover {
    color: #00c4b3;
    border-color: #00c4b3; }

@media only screen and (min-width: 550px) {
  .footer-wrapper {
    width: 100%;
    margin: 0 1em 0 -1em; }

  .footer-block {
    float: left;
    box-sizing: border-box;
    padding: 1em;
    margin-top: 0;
    width: 38%; }
    .footer-block:first-child {
      padding-top: 3em;
      width: 100%;
      margin: 0; }
    .footer-block.our-info p {
      display: inline; }
    .footer-block.our-info p:after {
      content: ' / '; }
    .footer-block.our-info p:last-child:after {
      content: ''; }
    .footer-block.join-newsletter {
      width: 45%; }
    .footer-block.social-wrapper {
      width: 15%; } }
@media only screen and (min-width: 850px) {
  .footer-wrapper {
    margin: 0 2em 0 -2em; }

  .footer-block {
    padding: 1em 2em; } }
@media only screen and (min-width: 1050px) {
  .footer-wrapper {
    display: table; }

  .footer-block {
    display: table-cell;
    vertical-align: top;
    float: none;
    width: 25%;
    padding: 4% 1.5em 4% 2.5em; }
    .footer-block:first-child {
      padding: 4% 0 4% 2em;
      width: 25%; }
    .footer-block.our-info p {
      display: block; }
    .footer-block.our-info p:after {
      content: ''; }
    .footer-block.join-newsletter {
      width: 35%; }
    .footer-block.social-wrapper {
      width: 15%; }
    .footer-block .address span {
      display: block; }
    .footer-block .address span:after {
      content: ''; } }
/**
 * Styles for page setions
 */
body.no-hero {
  margin-top: 6em; }



.team img
{
    width:100%;
}
.hero-picture {
  height: 100%;
  width: 100%;
  background-repeat: no-repeat;
  background-position: center center;
  -webkit-background-size: cover;
  -ms-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  position: relative;
  z-index: -1; }

.hero-picture-small .hero-picture {
  height: 60%; }

.page-section {
  overflow: hidden;
  margin-bottom: 3em; }
  .page-section:first-child {
    margin-top: 0em; }
  .page-section h1,
  .page-section h2,
  .page-section h3 {
    color: #ACD07A; }
  .page-section h2 span {
    display: block;
    color: #6d6e71; }
  .page-section p {
    margin-bottom: 1em;
    text-align:justify;
        font-weight: 100;
  }
    .page-section p:last-child {
      margin-bottom: 0; }
  .page-section a {
    color: #777777;
    /*display: inline-block;*/
    border-bottom: 1px solid rgba(119, 119, 119, 0.4);
    text-decoration: none;
    -webkit-text-size-adjust: 100%;
    -webkit-transition: all 0.3s ease-out;
    -ms-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out; }
    .page-section a:hover {
      color: #ACD07A; }

.section-title {
  margin-bottom: 2.26666em; }
  .section-title h1,
  .section-title h2,
  .section-title .section-runner {
    font-size: 1.4em;
    line-height: 1.4em;
    margin-bottom: 0.3em;
     }
  .section-title .section-runner {
    margin-bottom: 1em; }

.section-text {
  box-sizing: border-box;
  max-width: 560px;
  margin-bottom: 2em; }
  .section-text.section-text--large {
    font-size: 1.13333em;
    line-height: 1.4em; }
  .section-text.section-text--cols {
    -webkit-column-count: 2;
    -moz-column-count: 2;
    column-count: 2;
    -webkit-column-width: 300px;
    -moz-column-width: 300px;
    column-width: 300px;
    -webkit-column-gap: 2em;
    -moz-column-gap: 2em;
    column-gap: 2em; }
  .section-text:last-child {
    margin-bottom: 0; }
  .section-text h2 {
          font-size: 20px;
     }
    .section-text h2:first-child {
      margin-top: 0; }

.content-columns {
  overflow: hidden; }
  .content-columns .content-col-wrapper {
    margin: 0 -1em -2em;
    overflow: hidden; }
  .content-columns .content-col {
    box-sizing: border-box;
    margin-bottom: 2em;
    padding: 0 1em;
    float: left; }
    .content-columns .content-col.content-col--2-1 {
      width: 50%; }
      .content-columns .content-col.content-col--2-1:nth-child(odd) {
        clear: left; }
    .content-columns .content-col.content-col--3-1 {
      width: 100%; }
      .content-columns .content-col.content-col--3-1 .social-icons {
        margin-left: -2px;
        margin-right: -5px; }
        .content-columns .content-col.content-col--3-1 .social-icons a {
          }

.content-links-list {
  list-style: none; }
  .content-links-list .content-links-list-item {
    display: block;
    margin-bottom: 1.6em; }
    .content-links-list .content-links-list-item p {
      margin-bottom: 1em;
      color: #777777; }
    .content-links-list .content-links-list-item img {
      max-width: 100%; }

.plain-list {
  list-style: none;
  padding-left: 0; }

.bulleted-list {
  list-style: none;
  padding-left: 0; }
  .bulleted-list li {
    list-style: none; }
    .bulleted-list li:before {
      content: "– "; }

.section-inner {
  position: relative;
  max-width: 1500px;
  width: 84%;
  margin: 0 auto;
  overflow: hidden; }

@media all and (min-width: 319px) {
  .content-columns .content-col.content-col--3-1 {
    width: 100%;
    text-align:center;
  } }
@media all and (min-width: 650px) {
  .content-columns .content-col.content-col--3-1 {
    width: 100%;
    text-align:center;
  } }
@media all and (min-width: 800px) {
  .page-section {
    overflow: hidden;
    margin-bottom: 5%; }
    .page-section:first-child {
      margin-top: 5%; }

  .section-title {
    width: 100%;
    float: left; }

  .section-text {
    width: 100%;
    padding-left: 0.5em;
    float: right;
    clear: right;
    max-width: none; }

  .content-columns .content-col.content-col--3-1 {
    width: 100%;
        text-align: center;
  } }
@media all and (min-width: 950px) {
  .content-columns .content-col.content-col--3-1 {
    width: 100%;
        text-align: center;
  } }
@media all and (min-width: 1060px) {
  .section-title {
    width: 100%;
     }

  .section-text {
    width: 100%; }

  .content-columns .content-col.content-col--3-1 {
    width: 100%;
        text-align: center;
  } }
@media all and (min-width: 1200px) {
  .content-columns .content-col.content-col--3-1 {
    width: 50%;
        text-align: center;
  } }
@media all and (max-width: 800px) {
  .content-columns .content-col.content-col--2-1 {
    width: 100%; } }




.about-photo{
    width:50%;
    margin:auto;
}
.about-content{
    width:100%;
    float:right;
    margin-left:10px;
}
/* Box colors */
.bg-1 {
	background: #ECEFF1;
	color: #37474f;
}
.bg-2 {
	background: #7986cb;
	color: #ECEFF1;
}
.bg-3 {
	background: #37474f;
	color: #fff;
}

/* Common button styles */
.button {
	min-width: 150px;
	max-width: 150px;
	display: block;
	margin: 1em 0 0 0;
	padding: 1em 2em;
	border: none;
	background: none;
	color: inherit;
	vertical-align: middle;
	position: relative;
	z-index: 1;
	-webkit-backface-visibility: hidden;
	-moz-osx-font-smoothing: grayscale;
}
.button:focus {
	outline: none;
}
.button > span {
	vertical-align: middle;
}

/* Text color adjustments (we could stick to the "inherit" but that does not work well in Safari) */
.bg-1 .button {
	color: #37474f;
	border-color: #37474f;
}
.bg-2 .button {
	color: #ECEFF1;
	border-color: #ECEFF1;
}
.bg-3 .button {
	color: #fff;
	border-color: #fff;
}

/* Sizes */
.button--size-s {
	font-size: 14px;
}
.button--size-m {
	font-size: 16px;
}
.button--size-l {
	font-size: 18px;
}

/* Typography and Roundedness */
.button--text-upper {
	letter-spacing: 2px;
	text-transform: uppercase;
}
.button--text-thin {
	font-weight: 300;
}
.button--text-medium {
	font-weight: 500;
}
.button--text-thick {
	font-weight: 600;
}
.button--round-s {
	border-radius: 5px;
}
.button--round-m {
	border-radius: 15px;
}
.button--round-l {
	border-radius: 40px;
}

/* Borders */
.button--border-thin {
	border: 1px solid;
}
.button--border-medium {
	border: 2px solid;
}
.button--border-thick {
	border: 3px solid;
}

/* Individual button styles */

/* Winona */
.button--winona {
	overflow: hidden;
	padding: 0;
	-webkit-transition: border-color 0.3s, background-color 0.3s;
	transition: border-color 0.3s, background-color 0.3s;
	-webkit-transition-timing-function: cubic-bezier(0.2, 1, 0.3, 1);
	transition-timing-function: cubic-bezier(0.2, 1, 0.3, 1);
}
.button--winona::after {
	content: attr(data-text);
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	opacity: 0;
	color: #3f51b5;
	-webkit-transform: translate3d(0, 25%, 0);
	transform: translate3d(0, 25%, 0);
}
.button--winona > span {
	display: block;
}
.button--winona.button--inverted {
	color: #7986cb;
}
.button--winona.button--inverted:after {
	color: #fff;
}
.button--winona::after,
.button--winona > span {
	padding: 1em 2em;
	-webkit-transition: -webkit-transform 0.3s, opacity 0.3s;
	transition: transform 0.3s, opacity 0.3s;
	-webkit-transition-timing-function: cubic-bezier(0.2, 1, 0.3, 1);
	transition-timing-function: cubic-bezier(0.2, 1, 0.3, 1);
}
.button--winona:hover {
	border-color: #3f51b5;
	background-color: rgba(63, 81, 181, 0.1);
}
.button--winona.button--inverted:hover {
	border-color: #21333C;
	background-color: #21333C;
}
.button--winona:hover::after {
	opacity: 1;
	-webkit-transform: translate3d(0, 0, 0);
	transform: translate3d(0, 0, 0);
}
.button--winona:hover > span {
	opacity: 0;
	-webkit-transform: translate3d(0, -25%, 0);
	transform: translate3d(0, -25%, 0);
}

/* Ujarak */
.button--ujarak {
	-webkit-transition: border-color 0.4s, color 0.4s;
	transition: border-color 0.4s, color 0.4s;
}
.button--ujarak::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: #37474f;
	z-index: -1;
	opacity: 0;
	-webkit-transform: scale3d(0.7, 1, 1);
	transform: scale3d(0.7, 1, 1);
	-webkit-transition: -webkit-transform 0.4s, opacity 0.4s;
	transition: transform 0.4s, opacity 0.4s;
	-webkit-transition-timing-function: cubic-bezier(0.2, 1, 0.3, 1);
	transition-timing-function: cubic-bezier(0.2, 1, 0.3, 1);
}
.button--ujarak.button--round-s::before {
	border-radius: 2px;
}
.button--ujarak.button--inverted::before {
	background: #7986CB;
}
.button--ujarak,
.button--ujarak::before {
	-webkit-transition-timing-function: cubic-bezier(0.2, 1, 0.3, 1);
	transition-timing-function: cubic-bezier(0.2, 1, 0.3, 1);
}
.button--ujarak:hover {
	color: #fff;
	border-color: #37474f;
}
.button--ujarak.button--inverted:hover {
	color: #37474F;
	border-color: #fff;
}
.button--ujarak:hover::before {
	opacity: 1;
	-webkit-transform: translate3d(0, 0, 0);
	transform: translate3d(0, 0, 0);
}

/* Wayra */
.button--wayra {
	overflow: hidden;
	width: 245px;
	-webkit-transition: border-color 0.3s, color 0.3s;
	transition: border-color 0.3s, color 0.3s;
	-webkit-transition-timing-function: cubic-bezier(0.2, 1, 0.3, 1);
	transition-timing-function: cubic-bezier(0.2, 1, 0.3, 1);
}
.button--wayra::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 150%;
	height: 100%;
	background: #37474f;
	z-index: -1;
	-webkit-transform: rotate3d(0, 0, 1, -45deg) translate3d(0, -3em, 0);
	transform: rotate3d(0, 0, 1, -45deg) translate3d(0, -3em, 0);
	-webkit-transform-origin: 0% 100%;
	transform-origin: 0% 100%;
	-webkit-transition: -webkit-transform 0.3s, opacity 0.3s, background-color 0.3s;
	transition: transform 0.3s, opacity 0.3s, background-color 0.3s;
}
.button--wayra:hover {
	color: #fff;
	border-color: #3f51b5;
}
.button--wayra.button--inverted:hover {
	color: #3f51b5;
	border-color: #fff;
}
.button--wayra:hover::before {
	opacity: 1;
	background-color: #3f51b5;
	-webkit-transform: rotate3d(0, 0, 1, 0deg);
	transform: rotate3d(0, 0, 1, 0deg);
	-webkit-transition-timing-function: cubic-bezier(0.2, 1, 0.3, 1);
	transition-timing-function: cubic-bezier(0.2, 1, 0.3, 1);
}
.button--wayra.button--inverted:hover::before {
	background-color: #fff;
}

/* Tamaya */
.button--tamaya {
	overflow: hidden;
	color: #7986cb;
	min-width: 180px;
}
.button--tamaya.button--inverted {
	color: #37474f;
	border-color: #37474f;
}
.button--tamaya::before,
.button--tamaya::after {
	content: attr(data-text);
	position: absolute;
	width: 100%;
	height: 50%;
	left: 0;
	background: #7986cb;
	color: #fff;
	overflow: hidden;
	-webkit-transition: -webkit-transform 0.3s;
	transition: transform 0.3s;
	-webkit-transition-timing-function: cubic-bezier(0.2, 1, 0.3, 1);
	transition-timing-function: cubic-bezier(0.2, 1, 0.3, 1);
}
.button--tamaya.button--inverted::before,
.button--tamaya.button--inverted::after {
	background: #fff;
	color: #37474f;
}
.button--tamaya::before {
	top: 0;
	padding-top: 1em;
}
.button--tamaya::after {
	bottom: 0;
	line-height: 0;
}
.button--tamaya > span {
	display: block;
	-webkit-transform: scale3d(0.2, 0.2, 1);
	transform: scale3d(0.2, 0.2, 1);
	opacity: 0;
	-webkit-transition: -webkit-transform 0.3s, opacity 0.3s;
	transition: transform 0.3s, opacity 0.3s;
	-webkit-transition-timing-function: cubic-bezier(0.2, 1, 0.3, 1);
	transition-timing-function: cubic-bezier(0.2, 1, 0.3, 1);
}
.button--tamaya:hover::before {
	-webkit-transform: translate3d(0, -100%, 0);
	transform: translate3d(0, -100%, 0);
}
.button--tamaya:hover::after {
	-webkit-transform: translate3d(0, 100%, 0);
	transform: translate3d(0, 100%, 0);
}
.button--tamaya:hover > span {
	opacity: 1;
	-webkit-transform: scale3d(1, 1, 1);
	transform: scale3d(1, 1, 1);
}

/* Rayen */
.button--rayen {
	overflow: hidden;
	padding: 0;
	width: 150px;
    color: #333333;
}
.button--rayen.button--inverted {
	color: #fff;
}
.button--rayen::before {
	content: attr(data-text);
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
        color: #fff;
    background: #333333;
	-webkit-transform: translate3d(-100%, 0, 0);
	transform: translate3d(-100%, 0, 0);
}
.button--rayen.button--inverted::before {
	background: #fff;
	color: #37474f;
}
.button--rayen > span {
	display: block;
}
.button--rayen::before,
.button--rayen > span {
	padding: 1em 0em;
	-webkit-transition: -webkit-transform 0.3s;
	transition: transform 0.3s;
	-webkit-transition-timing-function: cubic-bezier(0.75, 0, 0.125, 1);
	transition-timing-function: cubic-bezier(0.75, 0, 0.125, 1);
}
.button--rayen:hover::before {
	-webkit-transform: translate3d(0, 0, 0);
	transform: translate3d(0, 0, 0);
}
.button--rayen:hover > span {
	-webkit-transform: translate3d(0, 100%, 0);
	transform: translate3d(0, 100%, 0);
}

/* Pipaluk */
.button--pipaluk {
	width: 240px;
	padding: 1.5em 3em;
	color: #fff;
}
.button--pipaluk.button--inverted {
	color: #7986cb;
}
.button--pipaluk::before,
.button--pipaluk::after {
	content: '';
	border-radius: inherit;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: -1;
	-webkit-transition: -webkit-transform 0.3s, background-color 0.3s;
	transition: transform 0.3s, background-color 0.3s;
	-webkit-transition-timing-function: cubic-bezier(0.25, 0, 0.3, 1);
	transition-timing-function: cubic-bezier(0.25, 0, 0.3, 1);
}
.button--pipaluk::before {
	border: 2px solid #7986cb;
}
.button--pipaluk.button--inverted::before {
	border-color: #fff;
}
.button--pipaluk::after {
	background: #7986cb;
}
.button--pipaluk.button--inverted::after {
	background: #fff;
}
.button--pipaluk:hover::before {
	-webkit-transform: scale3d(1, 1, 1);
	transform: scale3d(1, 1, 1);
}
.button--pipaluk::before,
.button--pipaluk:hover::after {
	-webkit-transform: scale3d(0.7, 0.7, 1);
	transform: scale3d(0.7, 0.7, 1);
}
.button--pipaluk:hover::after {
	background-color: #3f51b5;
}
.button--pipaluk.button--inverted:hover::after {
	background-color: #fff;
}

/* Nuka */
.button--nuka {
	margin: 1em 2em;
	-webkit-transition: color 0.3s;
	transition: color 0.3s;
	-webkit-transition-timing-function: cubic-bezier(0.2, 1, 0.3, 1);
	transition-timing-function: cubic-bezier(0.2, 1, 0.3, 1);
}
.button--nuka.button--inverted {
	color: #37474f;
}
.button--nuka::before,
.button--nuka::after {
	content: '';
	position: absolute;
	border-radius: inherit;
	background: #7986cb;
	z-index: -1;
}
.button--nuka::before {
	top: -4px;
	bottom: -4px;
	left: -4px;
	right: -4px;
	opacity: 0.2;
	-webkit-transform: scale3d(0.7, 1, 1);
	transform: scale3d(0.7, 1, 1);
	-webkit-transition: -webkit-transform 0.3s, opacity 0.3s;
	transition: transform 0.3s, opacity 0.3s;
}
.button--nuka::after {
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	-webkit-transform: scale3d(1.1, 1, 1);
	transform: scale3d(1.1, 1, 1);
	-webkit-transition: -webkit-transform 0.3s, background-color 0.3s;
	transition: transform 0.3s, background-color 0.3s;
}
.button--nuka::before,
.button--nuka::after {
	-webkit-transition-timing-function: cubic-bezier(0.2, 1, 0.3, 1);
	transition-timing-function: cubic-bezier(0.2, 1, 0.3, 1);
}
.button--nuka.button--inverted::before,
.button--nuka.button--inverted::after {
	background: #fff;
}
.button--nuka:hover {
	color: #fff;
}
.button--nuka:hover::before {
	opacity: 1;
}
.button--nuka:hover::after {
	background-color: #37474f;
}
.button--nuka.button--inverted:hover::after {
	background-color: #7986cb;
}
.button--nuka:hover::after,
.button--nuka:hover::before {
	-webkit-transform: scale3d(1, 1, 1);
	transform: scale3d(1, 1, 1);
}

/* Moema */
.button--moema {
	padding: 1.5em 3em;
	border-radius: 50px;
	background: #7986cb;
	color: #fff;
	-webkit-transition: background-color 0.3s, color 0.3s;
	transition: background-color 0.3s, color 0.3s;
}
.button--moema.button--inverted {
	background: #ECEFF1;
	color: #37474f;
}
.button--moema::before {
	content: '';
	position: absolute;
	top: -20px;
	left: -20px;
	bottom: -20px;
	right: -20px;
	background: inherit;
	border-radius: 50px;
	z-index: -1;
	opacity: 0.4;
	-webkit-transform: scale3d(0.8, 0.5, 1);
	transform: scale3d(0.8, 0.5, 1);
}
.button--moema:hover {
	-webkit-transition: background-color 0.1s 0.3s, color 0.1s 0.3s;
	transition: background-color 0.1s 0.3s, color 0.1s 0.3s;
	color: #ECEFF1;
	background-color: #3f51b5;
	-webkit-animation: anim-moema-1 0.3s forwards;
	animation: anim-moema-1 0.3s forwards;
}
.button--moema.button--inverted:hover {
	color: #ECEFF1;
	background-color: #7986cb;
}
.button--moema:hover::before {
	-webkit-animation: anim-moema-2 0.3s 0.3s forwards;
	animation: anim-moema-2 0.3s 0.3s forwards;
}
@-webkit-keyframes anim-moema-1 {
	60% {
		-webkit-transform: scale3d(0.8, 0.8, 1);
		transform: scale3d(0.8, 0.8, 1);
	}
	85% {
		-webkit-transform: scale3d(1.1, 1.1, 1);
		transform: scale3d(1.1, 1.1, 1);
	}
	100% {
		-webkit-transform: scale3d(1, 1, 1);
		transform: scale3d(1, 1, 1);
	}
}
@keyframes anim-moema-1 {
	60% {
		-webkit-transform: scale3d(0.8, 0.8, 1);
		transform: scale3d(0.8, 0.8, 1);
	}
	85% {
		-webkit-transform: scale3d(1.1, 1.1, 1);
		transform: scale3d(1.1, 1.1, 1);
	}
	100% {
		-webkit-transform: scale3d(1, 1, 1);
		transform: scale3d(1, 1, 1);
	}
}
@-webkit-keyframes anim-moema-2 {
	to {
		opacity: 0;
		-webkit-transform: scale3d(1, 1, 1);
		transform: scale3d(1, 1, 1);
	}
}
@keyframes anim-moema-2 {
	to {
		opacity: 0;
		-webkit-transform: scale3d(1, 1, 1);
		transform: scale3d(1, 1, 1);
	}
}

/* Isi */
.button--isi {
	padding: 1.2em 2em;
	color: #fff;
	background: #7986cb;
	overflow: hidden;
}
.button--isi::before {
	content: '';
	z-index: -1;
	position: absolute;
	top: 50%;
	left: 100%;
	margin: -15px 0 0 1px;
	width: 30px;
	height: 30px;
	border-radius: 50%;
	background: #3f51b5;
	-webkit-transform-origin: 100% 50%;
	transform-origin: 100% 50%;
	-webkit-transform: scale3d(1, 2, 1);
	transform: scale3d(1, 2, 1);
	-webkit-transition: -webkit-transform 0.3s, opacity 0.3s;
	transition: transform 0.3s, opacity 0.3s;
	-webkit-transition-timing-function: cubic-bezier(0.7,0,0.9,1);
	transition-timing-function: cubic-bezier(0.7,0,0.9,1);
}
.button--isi .button__icon {
	vertical-align: middle;
}
.button--isi > span {
	vertical-align: middle;
	padding-left: 0.75em;
}
.button--isi:hover::before {
	-webkit-transform: scale3d(9, 9, 1);
	transform: scale3d(9, 9, 1);
}

/* Aylen */
.button.button--aylen {
	background: #fff;
	color: #37474f;
	overflow: hidden;
	-webkit-transition: color 0.3s;
	transition: color 0.3s;
}
.button--aylen.button--inverted {
	background: none;
	color: #fff;
}
.button--aylen::before,
.button--aylen::after {
	content: '';
	position: absolute;
	height: 100%;
	width: 100%;
	bottom: 100%;
	left: 0;
	z-index: -1;
	-webkit-transition: -webkit-transform 0.3s;
	transition: transform 0.3s;
	-webkit-transition-timing-function: cubic-bezier(0.75, 0, 0.125, 1);
	transition-timing-function: cubic-bezier(0.75, 0, 0.125, 1);
}
.button--aylen::before {
	background: #7986cb;
}
.button--aylen::after {
	background: #3f51b5;
}
.button--aylen:hover {
	color: #fff;
}
.button--aylen:hover::before,
.button--aylen:hover::after {
	-webkit-transform: translate3d(0, 100%, 0);
	transform: translate3d(0, 100%, 0);
}
.button--aylen:hover::after {
	-webkit-transition-delay: 0.175s;
	transition-delay: 0.175s;
}

/* Saqui */
.button.button--saqui {
	overflow: hidden;
	color: #fff;
	background: #37474f;
	-webkit-transition: background-color 0.3s ease-in, color 0.3s ease-in;
	transition: background-color 0.3s ease-in, color 0.3s ease-in;
}
.button--saqui.button--inverted {
	background: #fff;
	color: #37474f;
}
.button--saqui::after {
	content: attr(data-text);
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	padding: 1em 2em;
	color: #37474f;
	-webkit-transform-origin: -25% 50%;
	transform-origin: -25% 50%;
	-webkit-transform: rotate3d(0, 0, 1, 45deg);
	transform: rotate3d(0, 0, 1, 45deg);
	-webkit-transition: -webkit-transform 0.3s ease-in;
	transition: transform 0.3s ease-in;
}
.button--saqui.button--inverted::after {
	color: #fff;
}
.button--saqui:hover::after,
.button--saqui:hover {
	-webkit-transition-timing-function: ease-out;
	transition-timing-function: ease-out;
}
.button--saqui:hover {
	background-color: #7986cb;
	color: #7986cb;
}
.button--saqui.button--inverted:hover {
	background-color: #3f51b5;
	color: #3f51b5;
}
.button--saqui:hover::after {
	-webkit-transform: rotate3d(0, 0, 1, 0deg);
	transform: rotate3d(0, 0, 1, 0deg);
}

/* Wapasha */
.button.button--wapasha {
	background: #37474f;
	color: #fff;
	-webkit-transition: background-color 0.3s, color 0.3s;
	transition: background-color 0.3s, color 0.3s;
}
.button--wapasha.button--inverted {
	background: #fff;
	color: #37474f;
}
.button--wapasha::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	border: 2px solid #3f51b5;
	z-index: -1;
	border-radius: inherit;
	opacity: 0;
	-webkit-transform: scale3d(0.6, 0.6, 1);
	transform: scale3d(0.6, 0.6, 1);
	-webkit-transition: -webkit-transform 0.3s, opacity 0.3s;
	transition: transform 0.3s, opacity 0.3s;
	-webkit-transition-timing-function: cubic-bezier(0.75, 0, 0.125, 1);
	transition-timing-function: cubic-bezier(0.75, 0, 0.125, 1);
}
.button--wapasha.button--inverted::before {
	border-color: #7986cb;
}
.button--wapasha:hover {
	background-color: #fff;
	color: #3f51b5;
}
.button--wapasha.button--inverted:hover {
	background-color: #37474f;
	color: #7986cb;
}
.button--wapasha:hover::before {
	-webkit-transform: scale3d(1, 1, 1);
	transform: scale3d(1, 1, 1);
	opacity: 1;
}

/* Nina */
.button--nina {
	padding: 0 2em;
	background: #7986cb;
	color: #fff;
	overflow: hidden;
	-webkit-transition: background-color 0.3s;
	transition: background-color 0.3s;
}
.button--nina.button--inverted {
	background: #fff;
	color: #7986cb;
}
.button--nina > span {
	display: inline-block;
	padding: 1em 0;
	opacity: 0;
	color: #fff;
	-webkit-transform: translate3d(0, -10px, 0);
	transform: translate3d(0, -10px, 0);
	-webkit-transition: -webkit-transform 0.3s, opacity 0.3s;
	transition: transform 0.3s, opacity 0.3s;
	-webkit-transition-timing-function: cubic-bezier(0.75, 0, 0.125, 1);
	transition-timing-function: cubic-bezier(0.75, 0, 0.125, 1);
}
.button--nina::before {
	content: attr(data-text);
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	padding: 1em 0;
	-webkit-transition: -webkit-transform 0.3s, opacity 0.3s;
	transition: transform 0.3s, opacity 0.3s;
	-webkit-transition-timing-function: cubic-bezier(0.75, 0, 0.125, 1);
	transition-timing-function: cubic-bezier(0.75, 0, 0.125, 1);
}
.button--nina:hover {
	background-color: #3f51b5;
}
.button--nina:hover::before {
	opacity: 0;
	-webkit-transform: translate3d(0, 100%, 0);
	transform: translate3d(0, 100%, 0);
}
.button--nina:hover > span {
	opacity: 1;
	-webkit-transform: translate3d(0, 0, 0);
	transform: translate3d(0, 0, 0);
}
.button--nina:hover > span:nth-child(1) {
	-webkit-transition-delay: 0.045s;
	transition-delay: 0.045s;
}
.button--nina:hover > span:nth-child(2) {
	-webkit-transition-delay: 0.09s;
	transition-delay: 0.09s;
}
.button--nina:hover > span:nth-child(3) {
	-webkit-transition-delay: 0.135s;
	transition-delay: 0.135s;
}
.button--nina:hover > span:nth-child(4) {
	-webkit-transition-delay: 0.18s;
	transition-delay: 0.18s;
}
.button--nina:hover > span:nth-child(5) {
	-webkit-transition-delay: 0.225s;
	transition-delay: 0.225s;
}
.button--nina:hover > span:nth-child(6) {
	-webkit-transition-delay: 0.27s;
	transition-delay: 0.27s;
}
.button--nina:hover > span:nth-child(7) {
	-webkit-transition-delay: 0.315s;
	transition-delay: 0.315s;
}
.button--nina:hover > span:nth-child(8) {
	-webkit-transition-delay: 0.36s;
	transition-delay: 0.36s;
}
.button--nina:hover > span:nth-child(9) {
	-webkit-transition-delay: 0.405s;
	transition-delay: 0.405s;
}
.button--nina:hover > span:nth-child(10) {
	-webkit-transition-delay: 0.45s;
	transition-delay: 0.45s;
}

/* Nanuk */
.button--nanuk {
	padding: 0 2em;
	overflow: hidden;
	background: #7986cb;
	-webkit-transition: background-color 0.3s;
	transition: background-color 0.3s;
}
.button--nanuk.button--inverted {
	background: #fff;
	color: #7986cb;
}
.button--nanuk > span {
	display: inline-block;
	padding: 1em 0;
}
.button--nanuk:hover {
	background-color: #3f51b5;
}
.button--nanuk:hover > span:nth-child(odd) {
	-webkit-animation: anim-nanuk-1 0.5s forwards;
	animation: anim-nanuk-1 0.5s forwards;
}
.button--nanuk:hover > span:nth-child(even) {
	-webkit-animation: anim-nanuk-2 0.5s forwards;
	animation: anim-nanuk-2 0.5s forwards;
}
.button--nanuk:hover > span:nth-child(odd),
.button--nanuk:hover > span:nth-child(even) {
	-webkit-animation-timing-function: cubic-bezier(0.75, 0, 0.125, 1);
	transition-animation-function: cubic-bezier(0.75, 0, 0.125, 1);
}
@-webkit-keyframes anim-nanuk-1 {
	0%,
	100% {
		opacity: 1;
		-webkit-transform: translate3d(0, 0, 0);
		transform: translate3d(0, 0, 0);
	}
	49% {
		opacity: 1;
		-webkit-transform: translate3d(0, 100%, 0);
		transform: translate3d(0, 100%, 0);
	}
	50% {
		opacity: 0;
		-webkit-transform: translate3d(0, 100%, 0);
		transform: translate3d(0, 100%, 0);
		color: inherit;
	}
	51% {
		opacity: 0;
		-webkit-transform: translate3d(0, -100%, 0);
		transform: translate3d(0, -100%, 0);
		color: #fff;
	}
	100% {
		color: #fff;
	}
}
@keyframes anim-nanuk-1 {
	0%,
	100% {
		opacity: 1;
		-webkit-transform: translate3d(0, 0, 0);
		transform: translate3d(0, 0, 0);
	}
	49% {
		opacity: 1;
		-webkit-transform: translate3d(0, 100%, 0);
		transform: translate3d(0, 100%, 0);
	}
	50% {
		opacity: 0;
		-webkit-transform: translate3d(0, 100%, 0);
		transform: translate3d(0, 100%, 0);
		color: inherit;
	}
	51% {
		opacity: 0;
		-webkit-transform: translate3d(0, -100%, 0);
		transform: translate3d(0, -100%, 0);
		color: #fff;
	}
	100% {
		color: #fff;
	}
}
@-webkit-keyframes anim-nanuk-2 {
	0%,
	100% {
		opacity: 1;
		-webkit-transform: translate3d(0, 0, 0);
		transform: translate3d(0, 0, 0);
	}
	49% {
		opacity: 1;
		-webkit-transform: translate3d(0, -100%, 0);
		transform: translate3d(0, -100%, 0);
	}
	50% {
		opacity: 0;
		-webkit-transform: translate3d(0, -100%, 0);
		transform: translate3d(0, -100%, 0);
		color: inherit;
	}
	51% {
		opacity: 0;
		-webkit-transform: translate3d(0, 100%, 0);
		transform: translate3d(0, 100%, 0);
		color: #fff;
	}
	100% {
		color: #fff;
	}
}
@keyframes anim-nanuk-2 {
	0%,
	100% {
		opacity: 1;
		-webkit-transform: translate3d(0, 0, 0);
		transform: translate3d(0, 0, 0);
	}
	49% {
		opacity: 1;
		-webkit-transform: translate3d(0, -100%, 0);
		transform: translate3d(0, -100%, 0);
	}
	50% {
		opacity: 0;
		-webkit-transform: translate3d(0, -100%, 0);
		transform: translate3d(0, -100%, 0);
		color: inherit;
	}
	51% {
		opacity: 0;
		-webkit-transform: translate3d(0, 100%, 0);
		transform: translate3d(0, 100%, 0);
		color: #fff;
	}
	100% {
		color: #fff;
	}
}
.button--nanuk:hover > span:nth-child(1) {
	-webkit-animation-delay: 0s;
	animation-delay: 0s;
}
.button--nanuk:hover > span:nth-child(2) {
	-webkit-animation-delay: 0.05s;
	animation-delay: 0.05s;
}
.button--nanuk:hover > span:nth-child(3) {
	-webkit-animation-delay: 0.1s;
	animation-delay: 0.1s;
}
.button--nanuk:hover > span:nth-child(4) {
	-webkit-animation-delay: 0.15s;
	animation-delay: 0.15s;
}
.button--nanuk:hover > span:nth-child(5) {
	-webkit-animation-delay: 0.2s;
	animation-delay: 0.2s;
}
.button--nanuk:hover > span:nth-child(6) {
	-webkit-animation-delay: 0.25s;
	animation-delay: 0.25s;
}
.button--nanuk:hover > span:nth-child(7) {
	-webkit-animation-delay: 0.3s;
	animation-delay: 0.3s;
}
.button--nanuk:hover > span:nth-child(8) {
	-webkit-animation-delay: 0.35s;
	animation-delay: 0.35s;
}
.button--nanuk:hover > span:nth-child(9) {
	-webkit-animation-delay: 0.4s;
	animation-delay: 0.4s;
}
.button--nanuk:hover > span:nth-child(10) {
	-webkit-animation-delay: 0.45s;
	animation-delay: 0.45s;
}
.button--nanuk:hover > span:nth-child(11) {
	-webkit-animation-delay: 0.5s;
	animation-delay: 0.5s;
}

/* Antiman */
.button--antiman {
	background: none;
	border: none;
	height: 60px;
}
.button--antiman.button--inverted,
.button--antiman.button--inverted-alt {
	-webkit-transition: color 0.3s;
	transition: color 0.3s;
	-webkit-transition-timing-function: cubic-bezier(0.75, 0, 0.125, 1);
	transition-timing-function: cubic-bezier(0.75, 0, 0.125, 1);
}
.button--antiman > span {
	padding-left: 0.35em;
}
.button--antiman::before,
.button--antiman::after {
	content: '';
	z-index: -1;
	border-radius: inherit;
	pointer-events: none;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	-webkit-backface-visibility: hidden;
	-webkit-transition: -webkit-transform 0.3s, opacity 0.3s;
	transition: transform 0.3s, opacity 0.3s;
	-webkit-transition-timing-function: cubic-bezier(0.75, 0, 0.125, 1);
	transition-timing-function: cubic-bezier(0.75, 0, 0.125, 1);
}
.button--antiman::before {
	border: 2px solid #37474f;
	opacity: 0;
	-webkit-transform: scale3d(1.2, 1.2, 1);
	transform: scale3d(1.2, 1.2, 1);
}
.button--antiman.button--border-thin::before {
	border-width: 1px;
}
.button--antiman.button--border-medium::before {
	border-width: 2px;
}
.button--antiman.button--border-thick::before {
	border-width: 3px;
}
.button--antiman.button--inverted::before {
	border-color: #7986cb;
}
.button--antiman.button--inverted-alt::before {
	border-color: #3f51b5;
}
.button--antiman::after {
	background: #fff;
}
.button--antiman.button--inverted::after {
	background: #7986cb;
}
.button--antiman.button--inverted-alt::after {
	background: #3f51b5;
}
.button--antiman.button--inverted:hover {
	color: #7986cb;
}
.button--antiman.button--inverted-alt:hover {
	color: #3f51b5;
}
.button--antiman:hover::before {
	opacity: 1;
	-webkit-transform: scale3d(1, 1, 1);
	transform: scale3d(1, 1, 1);
}
.button--antiman:hover::after {
	opacity: 0;
	-webkit-transform: scale3d(0.8, 0.8, 1);
	transform: scale3d(0.8, 0.8, 1);
}

/* Itzel */
.button--itzel {
	border: none;
	padding: 0px;
	overflow: hidden;
	width: 255px;
}
.button--itzel::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	border: 2px solid;
	border-radius: inherit;
	-webkit-clip-path: polygon(0% 0%, 0% 100%, 35% 100%, 35% 60%, 65% 60%, 65% 100%, 100% 100%, 100% 0%);
	clip-path: url(../index.html#clipBox);
	-webkit-transform: translate3d(0, 100%, 0) translate3d(0, -2px, 0);
	transform: translate3d(0, 100%, 0) translate3d(0, -2px, 0);
	-webkit-transform-origin: 50% 100%;
	transform-origin: 50% 100%;
}

.button--itzel.button--border-thin::before {
	border: 1px solid;
	-webkit-transform: translate3d(0, 100%, 0) translate3d(0, -1px, 0);
	transform: translate3d(0, 100%, 0) translate3d(0, -1px, 0);
}
.button--itzel.button--border-thick::before {
	border: 3px solid;
	-webkit-transform: translate3d(0, 100%, 0) translate3d(0, -3px, 0);
	transform: translate3d(0, 100%, 0) translate3d(0, -3px, 0);
}

.button--itzel::before,
.button--itzel .button__icon {
	-webkit-transition: -webkit-transform 0.3s;
	transition: transform 0.3s;
	-webkit-transition-timing-function: cubic-bezier(0.75, 0, 0.125, 1);
	transition-timing-function: cubic-bezier(0.75, 0, 0.125, 1);
}
.button--itzel .button__icon {
	position: absolute;
	top: 100%;
	left: 50%;
	padding: 20px;
	font-size: 20px;
	-webkit-transform: translate3d(-50%, 0, 0);
	transform: translate3d(-50%, 0, 0);
}
.button--itzel > span {
	display: block;
	padding: 20px;
	-webkit-transition: -webkit-transform 0.3s, opacity 0.3s;
	transition: transform 0.3s, opacity 0.3s;
	-webkit-transition-delay: 0.3s;
	transition-delay: 0.3s;
}
.button--itzel:hover::before {
	-webkit-transform: translate3d(0, 0, 0);
	transform: translate3d(0, 0, 0);
}
.button--itzel:hover .button__icon {
	-webkit-transition-delay: 0.1s;
	transition-delay: 0.1s;
	-webkit-transform: translate3d(-50%, -100%, 0);
	transform: translate3d(-50%, -100%, 0);
}
.button--itzel:hover > span {
	opacity: 0;
	-webkit-transform: translate3d(0, -50%, 0);
	transform: translate3d(0, -50%, 0);
	-webkit-transition-delay: 0s;
	transition-delay: 0s;
}

/* Naira */
.button--naira {
	padding: 0;
	overflow: hidden;
	-webkit-transition: background-color 0.3s;
	transition: background-color 0.3s;
}
.button--naira::before {
	content: '';
	position: absolute;
	left: -50%;
	width: 200%;
	height: 200%;
	background: #37474f;
	top: -50%;
	z-index: -1;
	-webkit-transform: translate3d(0, -100%, 0) rotate3d(0, 0, 1, -10deg);
	transform: translate3d(0, -100%, 0) rotate3d(0, 0, 1, -10deg);
}
.button--naira.button--inverted::before {
	background: #7986cb;
}
.button--naira-up::before {
	-webkit-transform: translate3d(0, 100%, 0) rotate3d(0, 0, 1, 10deg);
	transform: translate3d(0, 100%, 0) rotate3d(0, 0, 1, 10deg);
}
.button--naira > span {
	display: block;
}
.button--naira .button__icon {
	position: absolute;
	top: 0;
	width: 100%;
	left: 0;
	color: #fff;
	-webkit-transform: translate3d(0, -100%, 0);
	transform: translate3d(0, -100%, 0);
}
.button--naira-up .button__icon {
	-webkit-transform: translate3d(0, 100%, 0);
	transform: translate3d(0, 100%, 0);
}
.button--naira > span,
.button--naira .button__icon {
	padding: 1em 2em;
	-webkit-transition: -webkit-transform 0.3s;
	transition: transform 0.3s;
	-webkit-transition-timing-function: cubic-bezier(0.75, 0, 0.125, 1);
	transition-timing-function: cubic-bezier(0.75, 0, 0.125, 1);
}
.button--naira:hover::before {
	-webkit-animation: anim-naira-1 0.3s forwards ease-in;
	animation: anim-naira-1 0.3s forwards ease-in;
}
.button--naira-up:hover::before {
	-webkit-animation: anim-naira-2 0.3s forwards ease-in;
	animation: anim-naira-2 0.3s forwards ease-in;
}
@-webkit-keyframes anim-naira-1 {
	50% {
		-webkit-transform: translate3d(0, -50%, 0) rotate3d(0, 0, 1, -10deg);
		transform: translate3d(0, -50%, 0) rotate3d(0, 0, 1, -10deg);
		-webkit-animation-timing-function: ease-out;
		animation-timing-function: ease-out;
	}
	100% {
		-webkit-transform: translate3d(0, 0%, 0) rotate3d(0, 0, 1, 0deg);
		transform: translate3d(0, 0%, 0) rotate3d(0, 0, 1, 0deg);
	}
}
@keyframes anim-naira-1 {
	50% {
		-webkit-transform: translate3d(0, -50%, 0) rotate3d(0, 0, 1, -10deg);
		transform: translate3d(0, -50%, 0) rotate3d(0, 0, 1, -10deg);
		-webkit-animation-timing-function: ease-out;
		animation-timing-function: ease-out;
	}
	100% {
		-webkit-transform: translate3d(0, 0%, 0) rotate3d(0, 0, 1, 0deg);
		transform: translate3d(0, 0%, 0) rotate3d(0, 0, 1, 0deg);
	}
}
@-webkit-keyframes anim-naira-2 {
	50% {
		-webkit-transform: translate3d(0, 50%, 0) rotate3d(0, 0, 1, 10deg);
		transform: translate3d(0, 50%, 0) rotate3d(0, 0, 1, 10deg);
		-webkit-animation-timing-function: ease-out;
		animation-timing-function: ease-out;
	}
	100% {
		-webkit-transform: translate3d(0, 0%, 0) rotate3d(0, 0, 1, 0deg);
		transform: translate3d(0, 0%, 0) rotate3d(0, 0, 1, 0deg);
	}
}
@keyframes anim-naira-2 {
	50% {
		-webkit-transform: translate3d(0, 50%, 0) rotate3d(0, 0, 1, 10deg);
		transform: translate3d(0, 50%, 0) rotate3d(0, 0, 1, 10deg);
		-webkit-animation-timing-function: ease-out;
		animation-timing-function: ease-out;
	}
	100% {
		-webkit-transform: translate3d(0, 0%, 0) rotate3d(0, 0, 1, 0deg);
		transform: translate3d(0, 0%, 0) rotate3d(0, 0, 1, 0deg);
	}
}
.button--naira:hover {
	background-color: #37474f;
	-webkit-transition: background-color 0s 0.3s;
	transition: background-color 0s 0.3s;
}
.button--naira.button--inverted:hover {
	background-color: #7986cb;
}
.button--naira:hover .button__icon {
	-webkit-transform: translate3d(0, 0, 0);
	transform: translate3d(0, 0, 0);
}
.button--naira:hover > span {
	opacity: 0;
	-webkit-transform: translate3d(0, 100%, 0);
	transform: translate3d(0, 100%, 0);
}
.button--naira-up:hover > span {
	-webkit-transform: translate3d(0, -100%, 0);
	transform: translate3d(0, -100%, 0);
}

/* Quidel */
.button--quidel {
	background: #7986cb;
	color: #7986cb;
	overflow: hidden;
	-webkit-transition: color 0.3s;
	transition: color 0.3s;
	-webkit-transition-timing-function: cubic-bezier(0.75, 0, 0.125, 1);
	transition-timing-function: cubic-bezier(0.75, 0, 0.125, 1);
}
.button--quidel.button--inverted {
	background: #fff;
	color: #fff;
}
.button--quidel::before,
.button--quidel::after {
	content: '';
	position: absolute;
	z-index: -1;
	border-radius: inherit;
}
.button--quidel::after {
	top: 2px;
	left: 2px;
	right: 2px;
	bottom: 2px;
	background: #fff;
}
.button--quidel.button--inverted::after {
	background: #37474f;
}
.button--quidel::before {
	background: #37474f;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	-webkit-transform: translate3d(0, 100%, 0);
	transform: translate3d(0, 100%, 0);
	-webkit-transition: -webkit-transform 0.3s;
	transition: transform 0.3s;
	-webkit-transition-timing-function: cubic-bezier(0.75, 0, 0.125, 1);
	transition-timing-function: cubic-bezier(0.75, 0, 0.125, 1);
}
.button--quidel.button--inverted::before {
	background: #7986cb;
}
.button--round-s.button--quidel::after {
	border-radius: 3px;
}
.button--round-m.button--quidel::after {
	border-radius: 13px;
}
.button--round-l.button--quidel::after {
	border-radius: 40px;
}
.button--quidel > span {
	padding-left: 0.35em;
}
.button--quidel:hover {
	color: #37474f;
}
.button--quidel.button--inverted:hover {
	color: #7986cb;
}
.button--quidel:hover::before {
	-webkit-transform: translate3d(0, 0, 0);
	transform: translate3d(0, 0, 0);
}

/* Sacnite */
.button.button--sacnite {
	width: 70px;
	height: 70px;
	min-width: 0;
	padding: 0;
	color: #fff;
	-webkit-transition: color 0.3s;
	transition: color 0.3s;
}
.button--scanite.button--round-l {
	border-radius: 50%;
}
.button--sacnite.button--inverted {
	color: #37474f;
}
.button--sacnite::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	border-radius: inherit;
	z-index: -1;
	box-shadow: inset 0 0 0 35px #37474f;
	-webkit-transform: scale3d(0.9, 0.9, 1);
	transform: scale3d(0.9, 0.9, 1);
	-webkit-transition: box-shadow 0.3s, -webkit-transform 0.3;
	transition: box-shadow 0.3s, transform 0.3s;
}
.button--sacnite.button--inverted::before {
	box-shadow: inset 0 0 0 35px #fff;
}
.button--sacnite .button__icon {
	font-size: 22px;
	width: 22px;
}
.button--sacnite > span {
	position: absolute;
	opacity: 0;
	pointer-events: none;
}
.button--sacnite:hover {
	color: #37474f;
}
.button--sacnite.button--inverted:hover {
	color: #fff;
}
.button--sacnite:hover::before {
	box-shadow: inset 0 0 0 2px #37474f;
	-webkit-transform: scale3d(1, 1, 1);
	transform: scale3d(1, 1, 1);
}
.button--sacnite.button--inverted:hover::before {
	box-shadow: inset 0 0 0 2px #fff;
}

/* Shikoba */
.button.button--shikoba {
	padding: 1em 30px 1em 50px;
	overflow: hidden;
	background: #fff;
	color: #37474f;
	border-color: #37474f;
	-webkit-transition: background-color 0.3s, border-color 0.3s, color 0.3s;
	transition: background-color 0.3s, border-color 0.3s, color 0.3s;
}
.button--shikoba.button--inverted {
	color: #fff;
	background: #7986cb;
}
.button--shikoba > span {
	display: inline-block;
	-webkit-transform: translate3d(-10px, 0, 0);
	transform: translate3d(-10px, 0, 0);
	-webkit-transition: -webkit-transform 0.3s;
	transition: transform 0.3s;
	-webkit-transition-timing-function: cubic-bezier(0.75, 0, 0.125, 1);
	transition-timing-function: cubic-bezier(0.75, 0, 0.125, 1);
}
.button--shikoba .button__icon {
	position: absolute;
	left: 20px;
	font-size: 18px;
	-webkit-transform: translate3d(-40px, 2.5em, 0);
	transform: translate3d(-40px, 2.5em, 0);
	-webkit-transition: -webkit-transform 0.3s;
	transition: transform 0.3s;
	-webkit-transition-timing-function: cubic-bezier(0.75, 0, 0.125, 1);
	transition-timing-function: cubic-bezier(0.75, 0, 0.125, 1);
}
.button--shikoba:hover .button__icon,
.button--shikoba:hover > span {
	-webkit-transform: translate3d(0, 0, 0);
	transform: translate3d(0, 0, 0);
}
.button--shikoba:hover {
	background: #3f51b5;
	border-color: #3f51b5;
	color: #fff;
}




.svg-wrapper {
  width: 100%;
  display: block;
  height: auto;
  position: relative;
  padding-top: 32.95%; }

.home-illustration-fallback {
  display: none; }

@media only screen and (max-width: 800px) {
  .svg-wrapper {
    width: 156%;
    padding-top: 51.45%; } }
@media only screen and (max-width: 600px) {
  .svg-wrapper {
    width: 224%;
    padding-top: 73.95%; } }
.svg-wrapper svg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  transform: translateZ(0); }

.home-page {
  margin-top: 0; }

.home-page-intro-wrapper {
  overflow: visible; }

.home-page-intro {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 3em;
  width: 100%;
  display: table; }

.home-page-intro-inner {
  font-size: 1.5em;
  color: white;
  line-height: 1.4;
  box-sizing: border-box;
  display: table-cell;
  vertical-align: middle; }
  .home-page-intro-inner > * {
    max-width: 22em; }
  .home-page-intro-inner h1 {
    font-weight: bold;
    color: #1d6166; }

@media all and (min-width: 800px) {
  .home-page-intro {
    margin-bottom: -5%; }

  .home-page-intro-inner {
    padding-left: 37%; }
    .home-page-intro-inner > * {
      padding-left: 0.4em; } }
@media all and (min-width: 1060px) {
  
    
    .home-page-intro {
    margin-bottom: -11%; }

  .home-page-intro-inner {
    padding-left: 50%; } }
@media all and (min-width: 1500px) {
  .home-page-intro-inner {
    font-size: 2em; }
    .home-page-intro-inner > * {
      padding-left: 0.25em; } }
.home-page-section {
  margin-top: 2%;
  margin-bottom: 2%; }
  .home-page-section:first-child {
    padding-top: 3em; }
  .home-page-section > h2 {
    margin-bottom: 1.6em;
    color: #cacccd;
    font-size: 1.13333em; }



  



.home-page .grid  {
  color: #8a8c8f; }
.home-page .grid .grid-item .post-meta {
  margin-bottom: 1em; }
.home-page .grid .grid-item .post-more {
  display: block;
  padding-top: 1em; }

.home-page-blog-wrapper {
  background: #f2f2f2;
  padding: 2% 0 5%;
  margin-bottom: 0; }

.grid.home-page-blog .grid-item {
  padding-right: 1em; }
  .grid.home-page-blog .grid-item h2,
  .grid.home-page-blog .grid-item h3,
  .grid.home-page-blog .grid-item p {
    padding-left: 0; }
  .grid.home-page-blog .grid-item a {
    display: block;
    border: 0; }
    .grid.home-page-blog .grid-item a * {
      -webkit-transition: all 0.3s ease-out;
      -ms-transition: all 0.3s ease-out;
      -moz-transition: all 0.3s ease-out;
      -o-transition: all 0.3s ease-out;
      transition: all 0.3s ease-out; }
    .grid.home-page-blog .grid-item a:hover h2,
    .grid.home-page-blog .grid-item a:hover h3,
    .grid.home-page-blog .grid-item a:hover .post-more {
      color: #ACD07A; }
    .grid.home-page-blog .grid-item a:hover .post-excerpt,
    .grid.home-page-blog .grid-item a:hover .post-meta {
      opacity: 0.6; }
  .grid.home-page-blog .grid-item h2,
  .grid.home-page-blog .grid-item h3,
  .grid.home-page-blog .grid-item p,
  .grid.home-page-blog .grid-item .post-meta {
    font-size: 1.13333em;
    line-height: 1.4em; }

.home-page-social-blocks {
  background: #dbdbdb;
  margin: 0; }
  .home-page-social-blocks .social-blocks-wrapper {
    margin: 0 auto;
    max-width: 1920px; }

.social-block {
  position: relative;
  color: white;
  text-align: center;
  background-size: 100%;
  background-size: cover; }
  .social-block.social-block--spotify {
    background: #1fc3b4; }
  .social-block.social-block--twitter {
    background: #fc5a5d; }
    .social-block.social-block--twitter img {
      max-height: 1em;
      vertical-align: middle; }
  .social-block.social-block--instagram {
    padding-bottom: 100%; }
    .social-block.social-block--instagram > div {
      background-size: 100%;
      position: absolute;
      top: 0;
      bottom: 0;
      left: 0;
      right: 0; }
    .social-block.social-block--instagram .social-block-inner {
      background: rgba(0, 0, 0, 0.3);
      height: 100%; }
  .social-block .social-block-inner {
    overflow: hidden; }
  .social-block a {
    color: white;
    border-bottom: 1px solid rgba(255, 255, 255, 0.4); }
    .social-block a:hover {
      color: rgba(255, 255, 255, 0.7); }
  .social-block p {
    font-size: 1.13333em;
    line-height: 1.4em;
    overflow: hidden;
    max-height: 60%; }
  .social-block .social-block-icon {
    font-size: 3em;
    border-bottom: 0;
    padding: 10% 10% 5%; }
  .social-block .social-block-content {
    overflow: hidden;
    padding: 0 10% 12%; }

.home-twitter {
  text-align: center; }
  .home-twitter .icon-twitter {
    font-size: 3em; }
  .home-twitter p {
    margin: 2em auto 0 auto;
    max-width: 50em; }

.huge-type {
  text-align: center;
  font-size: 23px;
  line-height: 5em; }

#pong {
  background: rgba(255, 255, 255, 0.7);
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  width: 100%;
  height: 100%;
  display: none; }

@media all and (min-width: 600px) {
  .social-block,
  .social-block.social-block--instagram {
    width: 33.333%;
    float: left;
    padding-bottom: 33.333%; }
    .social-block .social-block-inner,
    .social-block.social-block--instagram .social-block-inner {
      position: absolute;
      top: 0;
      left: 0;
      bottom: 0;
      right: 0; }
    .social-block .social-block-icon,
    .social-block.social-block--instagram .social-block-icon {
      padding: 0;
      position: absolute;
      top: 8%;
      left: 0;
      right: 0; }
    .social-block .social-block-content,
    .social-block.social-block--instagram .social-block-content {
      padding: 0;
      position: absolute;
      top: 35%;
      bottom: 10%;
      left: 8%;
      right: 8%; } }
@media all and (min-width: 900px) {
  .social-block .social-block-icon,
  .social-block.social-block--instagram .social-block-icon {
    top: 12%; }
  .social-block .social-block-content,
  .social-block.social-block--instagram .social-block-content {
    top: 32%;
    left: 12%;
    right: 12%; } }
@media all and (min-width: 1050px) {
  .social-block .social-block-icon,
  .social-block.social-block--instagram .social-block-icon {
    top: 18%; }
  .social-block .social-block-content,
  .social-block.social-block--instagram .social-block-content {
    top: 42%; } }
@media only screen and (min-width: 1800px) {
  .home-page-intro-wrapper-outer {
    font-size: 2em; } }
.circle {
  -webkit-transform-origin: center center;
  -ms-transform-origin: center center;
  -moz-transform-origin: center center;
  -o-transform-origin: center center;
  transform-origin: center center; }

.pipe, .arc {
  cursor: pointer;
  transition: all 1s; }

.square {
  -webkit-animation: slide 4s infinite ease-in-out;
  -ms-animation: slide 4s infinite ease-in-out;
  -moz-animation: slide 4s infinite ease-in-out;
  -o-animation: slide 4s infinite ease-in-out;
  animation: slide 4s infinite ease-in-out; }

.square-two {
  -webkit-animation: slide-alt 4s infinite ease-in-out;
  -ms-animation: slide-alt 4s infinite ease-in-out;
  -moz-animation: slide-alt 4s infinite ease-in-out;
  -o-animation: slide-alt 4s infinite ease-in-out;
  animation: slide-alt 4s infinite ease-in-out;
  -webkit-animation-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53);
  -ms-animation-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53);
  -moz-animation-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53);
  -o-animation-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53);
  animation-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53); }

.square--vert {
  -webkit-animation: slide-vert 1s infinite ease-in-out alternate;
  -ms-animation: slide-vert 1s infinite ease-in-out alternate;
  -moz-animation: slide-vert 1s infinite ease-in-out alternate;
  -o-animation: slide-vert 1s infinite ease-in-out alternate;
  animation: slide-vert 1s infinite ease-in-out alternate;
  -webkit-animation: slide-vert 1s infinite cubic-bezier(0.77, 0, 0.175, 1) alternate;
  -ms-animation: slide-vert 1s infinite cubic-bezier(0.77, 0, 0.175, 1) alternate;
  -moz-animation: slide-vert 1s infinite cubic-bezier(0.77, 0, 0.175, 1) alternate;
  -o-animation: slide-vert 1s infinite cubic-bezier(0.77, 0, 0.175, 1) alternate;
  animation: slide-vert 1s infinite cubic-bezier(0.77, 0, 0.175, 1) alternate; }

.square--vert-2 {
  -webkit-animation-delay: -1000ms;
  -ms-animation-delay: -1000ms;
  -moz-animation-delay: -1000ms;
  -o-animation-delay: -1000ms;
  animation-delay: -1000ms; }

.floating-eye {
  -webkit-animation: float 3s infinite ease-in-out alternate;
  -ms-animation: float 3s infinite ease-in-out alternate;
  -moz-animation: float 3s infinite ease-in-out alternate;
  -o-animation: float 3s infinite ease-in-out alternate;
  animation: float 3s infinite ease-in-out alternate;
  cursor: pointer; }

.little-ball {
  -webkit-animation: little-ball-spin 4s infinite cubic-bezier(0.68, -0.55, 0.265, 1.55);
  -ms-animation: little-ball-spin 4s infinite cubic-bezier(0.68, -0.55, 0.265, 1.55);
  -moz-animation: little-ball-spin 4s infinite cubic-bezier(0.68, -0.55, 0.265, 1.55);
  -o-animation: little-ball-spin 4s infinite cubic-bezier(0.68, -0.55, 0.265, 1.55);
  animation: little-ball-spin 4s infinite cubic-bezier(0.68, -0.55, 0.265, 1.55);
  -webkit-transform-origin: center center;
  -ms-transform-origin: center center;
  -moz-transform-origin: center center;
  -o-transform-origin: center center;
  transform-origin: center center;
  -webkit-transform-origin: 1417px 547.3px;
  -ms-transform-origin: 1417px 547.3px;
  -moz-transform-origin: 1417px 547.3px;
  -o-transform-origin: 1417px 547.3px;
  transform-origin: 1417px 547.3px; }

.little-ball-2 {
  -webkit-animation-delay: -1s;
  -ms-animation-delay: -1s;
  -moz-animation-delay: -1s;
  -o-animation-delay: -1s;
  animation-delay: -1s;
  -webkit-transform-origin: 1370.4px 547.4px;
  -ms-transform-origin: 1370.4px 547.4px;
  -moz-transform-origin: 1370.4px 547.4px;
  -o-transform-origin: 1370.4px 547.4px;
  transform-origin: 1370.4px 547.4px; }

.little-ball-3 {
  -webkit-transform-origin: 1322.4px 547.3px;
  -ms-transform-origin: 1322.4px 547.3px;
  -moz-transform-origin: 1322.4px 547.3px;
  -o-transform-origin: 1322.4px 547.3px;
  transform-origin: 1322.4px 547.3px; }

.pulsating-circles g {
  -webkit-transform: scale(0.75);
  -ms-transform: scale(0.75);
  -moz-transform: scale(0.75);
  -o-transform: scale(0.75);
  transform: scale(0.75);
  -webkit-transform-origin: center center;
  -ms-transform-origin: center center;
  -moz-transform-origin: center center;
  -o-transform-origin: center center;
  transform-origin: center center;
  -webkit-animation: pulsate 3s infinite cubic-bezier(0.45, -0.6, 0.57, 1.65);
  -ms-animation: pulsate 3s infinite cubic-bezier(0.45, -0.6, 0.57, 1.65);
  -moz-animation: pulsate 3s infinite cubic-bezier(0.45, -0.6, 0.57, 1.65);
  -o-animation: pulsate 3s infinite cubic-bezier(0.45, -0.6, 0.57, 1.65);
  animation: pulsate 3s infinite cubic-bezier(0.45, -0.6, 0.57, 1.65); }

.pulsating-circles g:nth-child(1) {
  -webkit-animation-delay: 100ms;
  -ms-animation-delay: 100ms;
  -moz-animation-delay: 100ms;
  -o-animation-delay: 100ms;
  animation-delay: 100ms;
  -webkit-transform-origin: 378.6px 196.8px;
  -ms-transform-origin: 378.6px 196.8px;
  -moz-transform-origin: 378.6px 196.8px;
  -o-transform-origin: 378.6px 196.8px;
  transform-origin: 378.6px 196.8px; }

.pulsating-circles g:nth-child(2) {
  -webkit-animation-delay: 200ms;
  -ms-animation-delay: 200ms;
  -moz-animation-delay: 200ms;
  -o-animation-delay: 200ms;
  animation-delay: 200ms;
  -webkit-transform-origin: 378.6px 196.8px;
  -ms-transform-origin: 378.6px 196.8px;
  -moz-transform-origin: 378.6px 196.8px;
  -o-transform-origin: 378.6px 196.8px;
  transform-origin: 378.6px 196.8px; }

.pulsating-circles g:nth-child(3) {
  -webkit-animation-delay: 300ms;
  -ms-animation-delay: 300ms;
  -moz-animation-delay: 300ms;
  -o-animation-delay: 300ms;
  animation-delay: 300ms;
  -webkit-transform-origin: 378.6px 196.8px;
  -ms-transform-origin: 378.6px 196.8px;
  -moz-transform-origin: 378.6px 196.8px;
  -o-transform-origin: 378.6px 196.8px;
  transform-origin: 378.6px 196.8px; }

.pulsating-circles g:nth-child(4) {
  -webkit-animation-delay: 400ms;
  -ms-animation-delay: 400ms;
  -moz-animation-delay: 400ms;
  -o-animation-delay: 400ms;
  animation-delay: 400ms;
  -webkit-transform-origin: 378.6px 196.8px;
  -ms-transform-origin: 378.6px 196.8px;
  -moz-transform-origin: 378.6px 196.8px;
  -o-transform-origin: 378.6px 196.8px;
  transform-origin: 378.6px 196.8px; }

.pulsating-circles g:nth-child(5) {
  -webkit-animation-delay: 500ms;
  -ms-animation-delay: 500ms;
  -moz-animation-delay: 500ms;
  -o-animation-delay: 500ms;
  animation-delay: 500ms;
  -webkit-transform-origin: 378.6px 196.8px;
  -ms-transform-origin: 378.6px 196.8px;
  -moz-transform-origin: 378.6px 196.8px;
  -o-transform-origin: 378.6px 196.8px;
  transform-origin: 378.6px 196.8px; }

.pulsating-circles g:nth-child(6) {
  -webkit-animation-delay: 600ms;
  -ms-animation-delay: 600ms;
  -moz-animation-delay: 600ms;
  -o-animation-delay: 600ms;
  animation-delay: 600ms;
  -webkit-transform-origin: 378.6px 196.8px;
  -ms-transform-origin: 378.6px 196.8px;
  -moz-transform-origin: 378.6px 196.8px;
  -o-transform-origin: 378.6px 196.8px;
  transform-origin: 378.6px 196.8px; }

.little-ball--alt {
  -webkit-animation: little-ball-alt-spin 2s infinite ease-in-out;
  -ms-animation: little-ball-alt-spin 2s infinite ease-in-out;
  -moz-animation: little-ball-alt-spin 2s infinite ease-in-out;
  -o-animation: little-ball-alt-spin 2s infinite ease-in-out;
  animation: little-ball-alt-spin 2s infinite ease-in-out;
  -webkit-transform-origin: 1730.1px 422.25px;
  -ms-transform-origin: 1730.1px 422.25px;
  -moz-transform-origin: 1730.1px 422.25px;
  -o-transform-origin: 1730.1px 422.25px;
  transform-origin: 1730.1px 422.25px; }

.little-ball--alt-2 {
  -webkit-transform-origin: 1776.71px 422.25px;
  -ms-transform-origin: 1776.71px 422.25px;
  -moz-transform-origin: 1776.71px 422.25px;
  -o-transform-origin: 1776.71px 422.25px;
  transform-origin: 1776.71px 422.25px;
  -webkit-animation-delay: -500ms;
  -ms-animation-delay: -500ms;
  -moz-animation-delay: -500ms;
  -o-animation-delay: -500ms;
  animation-delay: -500ms; }

@-webkit-keyframes slide {
  0% {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    -moz-transform: translateX(0);
    -o-transform: translateX(0);
    transform: translateX(0);
    -webkit-animation-timing-function: cubic-bezier(0.325, 0.005, 0.35, 0.995);
    -ms-animation-timing-function: cubic-bezier(0.325, 0.005, 0.35, 0.995);
    -moz-animation-timing-function: cubic-bezier(0.325, 0.005, 0.35, 0.995);
    -o-animation-timing-function: cubic-bezier(0.325, 0.005, 0.35, 0.995);
    animation-timing-function: cubic-bezier(0.325, 0.005, 0.35, 0.995); }
  40% {
    -webkit-transform: translateX(-261px);
    -ms-transform: translateX(-261px);
    -moz-transform: translateX(-261px);
    -o-transform: translateX(-261px);
    transform: translateX(-261px); }
  50% {
    -webkit-transform: translateX(-261px);
    -ms-transform: translateX(-261px);
    -moz-transform: translateX(-261px);
    -o-transform: translateX(-261px);
    transform: translateX(-261px);
    -webkit-animation-timing-function: cubic-bezier(0.575, 0.005, 0.515, 1.005);
    -ms-animation-timing-function: cubic-bezier(0.575, 0.005, 0.515, 1.005);
    -moz-animation-timing-function: cubic-bezier(0.575, 0.005, 0.515, 1.005);
    -o-animation-timing-function: cubic-bezier(0.575, 0.005, 0.515, 1.005);
    animation-timing-function: cubic-bezier(0.575, 0.005, 0.515, 1.005); }
  90% {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    -moz-transform: translateX(0);
    -o-transform: translateX(0);
    transform: translateX(0); }
  100% {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    -moz-transform: translateX(0);
    -o-transform: translateX(0);
    transform: translateX(0); } }
@-moz-keyframes slide {
  0% {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    -moz-transform: translateX(0);
    -o-transform: translateX(0);
    transform: translateX(0);
    -webkit-animation-timing-function: cubic-bezier(0.325, 0.005, 0.35, 0.995);
    -ms-animation-timing-function: cubic-bezier(0.325, 0.005, 0.35, 0.995);
    -moz-animation-timing-function: cubic-bezier(0.325, 0.005, 0.35, 0.995);
    -o-animation-timing-function: cubic-bezier(0.325, 0.005, 0.35, 0.995);
    animation-timing-function: cubic-bezier(0.325, 0.005, 0.35, 0.995); }
  40% {
    -webkit-transform: translateX(-261px);
    -ms-transform: translateX(-261px);
    -moz-transform: translateX(-261px);
    -o-transform: translateX(-261px);
    transform: translateX(-261px); }
  50% {
    -webkit-transform: translateX(-261px);
    -ms-transform: translateX(-261px);
    -moz-transform: translateX(-261px);
    -o-transform: translateX(-261px);
    transform: translateX(-261px);
    -webkit-animation-timing-function: cubic-bezier(0.575, 0.005, 0.515, 1.005);
    -ms-animation-timing-function: cubic-bezier(0.575, 0.005, 0.515, 1.005);
    -moz-animation-timing-function: cubic-bezier(0.575, 0.005, 0.515, 1.005);
    -o-animation-timing-function: cubic-bezier(0.575, 0.005, 0.515, 1.005);
    animation-timing-function: cubic-bezier(0.575, 0.005, 0.515, 1.005); }
  90% {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    -moz-transform: translateX(0);
    -o-transform: translateX(0);
    transform: translateX(0); }
  100% {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    -moz-transform: translateX(0);
    -o-transform: translateX(0);
    transform: translateX(0); } }
@keyframes slide {
  0% {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    -moz-transform: translateX(0);
    -o-transform: translateX(0);
    transform: translateX(0);
    -webkit-animation-timing-function: cubic-bezier(0.325, 0.005, 0.35, 0.995);
    -ms-animation-timing-function: cubic-bezier(0.325, 0.005, 0.35, 0.995);
    -moz-animation-timing-function: cubic-bezier(0.325, 0.005, 0.35, 0.995);
    -o-animation-timing-function: cubic-bezier(0.325, 0.005, 0.35, 0.995);
    animation-timing-function: cubic-bezier(0.325, 0.005, 0.35, 0.995); }
  40% {
    -webkit-transform: translateX(-261px);
    -ms-transform: translateX(-261px);
    -moz-transform: translateX(-261px);
    -o-transform: translateX(-261px);
    transform: translateX(-261px); }
  50% {
    -webkit-transform: translateX(-261px);
    -ms-transform: translateX(-261px);
    -moz-transform: translateX(-261px);
    -o-transform: translateX(-261px);
    transform: translateX(-261px);
    -webkit-animation-timing-function: cubic-bezier(0.575, 0.005, 0.515, 1.005);
    -ms-animation-timing-function: cubic-bezier(0.575, 0.005, 0.515, 1.005);
    -moz-animation-timing-function: cubic-bezier(0.575, 0.005, 0.515, 1.005);
    -o-animation-timing-function: cubic-bezier(0.575, 0.005, 0.515, 1.005);
    animation-timing-function: cubic-bezier(0.575, 0.005, 0.515, 1.005); }
  90% {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    -moz-transform: translateX(0);
    -o-transform: translateX(0);
    transform: translateX(0); }
  100% {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    -moz-transform: translateX(0);
    -o-transform: translateX(0);
    transform: translateX(0); } }
@-webkit-keyframes slide-alt {
  0% {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    -moz-transform: translateX(0);
    -o-transform: translateX(0);
    transform: translateX(0);
    -webkit-animation-timing-function: cubic-bezier(0.575, 0.005, 0.515, 1.005);
    -ms-animation-timing-function: cubic-bezier(0.575, 0.005, 0.515, 1.005);
    -moz-animation-timing-function: cubic-bezier(0.575, 0.005, 0.515, 1.005);
    -o-animation-timing-function: cubic-bezier(0.575, 0.005, 0.515, 1.005);
    animation-timing-function: cubic-bezier(0.575, 0.005, 0.515, 1.005); }
  40% {
    -webkit-transform: translateX(-261px);
    -ms-transform: translateX(-261px);
    -moz-transform: translateX(-261px);
    -o-transform: translateX(-261px);
    transform: translateX(-261px); }
  50% {
    -webkit-transform: translateX(-261px);
    -ms-transform: translateX(-261px);
    -moz-transform: translateX(-261px);
    -o-transform: translateX(-261px);
    transform: translateX(-261px);
    -webkit-animation-timing-function: cubic-bezier(0.325, 0.005, 0.35, 0.995);
    -ms-animation-timing-function: cubic-bezier(0.325, 0.005, 0.35, 0.995);
    -moz-animation-timing-function: cubic-bezier(0.325, 0.005, 0.35, 0.995);
    -o-animation-timing-function: cubic-bezier(0.325, 0.005, 0.35, 0.995);
    animation-timing-function: cubic-bezier(0.325, 0.005, 0.35, 0.995); }
  90% {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    -moz-transform: translateX(0);
    -o-transform: translateX(0);
    transform: translateX(0); }
  100% {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    -moz-transform: translateX(0);
    -o-transform: translateX(0);
    transform: translateX(0); } }
@-moz-keyframes slide-alt {
  0% {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    -moz-transform: translateX(0);
    -o-transform: translateX(0);
    transform: translateX(0);
    -webkit-animation-timing-function: cubic-bezier(0.575, 0.005, 0.515, 1.005);
    -ms-animation-timing-function: cubic-bezier(0.575, 0.005, 0.515, 1.005);
    -moz-animation-timing-function: cubic-bezier(0.575, 0.005, 0.515, 1.005);
    -o-animation-timing-function: cubic-bezier(0.575, 0.005, 0.515, 1.005);
    animation-timing-function: cubic-bezier(0.575, 0.005, 0.515, 1.005); }
  40% {
    -webkit-transform: translateX(-261px);
    -ms-transform: translateX(-261px);
    -moz-transform: translateX(-261px);
    -o-transform: translateX(-261px);
    transform: translateX(-261px); }
  50% {
    -webkit-transform: translateX(-261px);
    -ms-transform: translateX(-261px);
    -moz-transform: translateX(-261px);
    -o-transform: translateX(-261px);
    transform: translateX(-261px);
    -webkit-animation-timing-function: cubic-bezier(0.325, 0.005, 0.35, 0.995);
    -ms-animation-timing-function: cubic-bezier(0.325, 0.005, 0.35, 0.995);
    -moz-animation-timing-function: cubic-bezier(0.325, 0.005, 0.35, 0.995);
    -o-animation-timing-function: cubic-bezier(0.325, 0.005, 0.35, 0.995);
    animation-timing-function: cubic-bezier(0.325, 0.005, 0.35, 0.995); }
  90% {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    -moz-transform: translateX(0);
    -o-transform: translateX(0);
    transform: translateX(0); }
  100% {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    -moz-transform: translateX(0);
    -o-transform: translateX(0);
    transform: translateX(0); } }
@keyframes slide-alt {
  0% {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    -moz-transform: translateX(0);
    -o-transform: translateX(0);
    transform: translateX(0);
    -webkit-animation-timing-function: cubic-bezier(0.575, 0.005, 0.515, 1.005);
    -ms-animation-timing-function: cubic-bezier(0.575, 0.005, 0.515, 1.005);
    -moz-animation-timing-function: cubic-bezier(0.575, 0.005, 0.515, 1.005);
    -o-animation-timing-function: cubic-bezier(0.575, 0.005, 0.515, 1.005);
    animation-timing-function: cubic-bezier(0.575, 0.005, 0.515, 1.005); }
  40% {
    -webkit-transform: translateX(-261px);
    -ms-transform: translateX(-261px);
    -moz-transform: translateX(-261px);
    -o-transform: translateX(-261px);
    transform: translateX(-261px); }
  50% {
    -webkit-transform: translateX(-261px);
    -ms-transform: translateX(-261px);
    -moz-transform: translateX(-261px);
    -o-transform: translateX(-261px);
    transform: translateX(-261px);
    -webkit-animation-timing-function: cubic-bezier(0.325, 0.005, 0.35, 0.995);
    -ms-animation-timing-function: cubic-bezier(0.325, 0.005, 0.35, 0.995);
    -moz-animation-timing-function: cubic-bezier(0.325, 0.005, 0.35, 0.995);
    -o-animation-timing-function: cubic-bezier(0.325, 0.005, 0.35, 0.995);
    animation-timing-function: cubic-bezier(0.325, 0.005, 0.35, 0.995); }
  90% {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    -moz-transform: translateX(0);
    -o-transform: translateX(0);
    transform: translateX(0); }
  100% {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    -moz-transform: translateX(0);
    -o-transform: translateX(0);
    transform: translateX(0); } }
@-webkit-keyframes slide-vert {
  0% {
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    -moz-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0); }
  100% {
    -webkit-transform: translateY(90px);
    -ms-transform: translateY(90px);
    -moz-transform: translateY(90px);
    -o-transform: translateY(90px);
    transform: translateY(90px); } }
@-moz-keyframes slide-vert {
  0% {
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    -moz-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0); }
  100% {
    -webkit-transform: translateY(90px);
    -ms-transform: translateY(90px);
    -moz-transform: translateY(90px);
    -o-transform: translateY(90px);
    transform: translateY(90px); } }
@keyframes slide-vert {
  0% {
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    -moz-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0); }
  100% {
    -webkit-transform: translateY(90px);
    -ms-transform: translateY(90px);
    -moz-transform: translateY(90px);
    -o-transform: translateY(90px);
    transform: translateY(90px); } }
@-webkit-keyframes float {
  0% {
    -webkit-transform: translateY(0px);
    -ms-transform: translateY(0px);
    -moz-transform: translateY(0px);
    -o-transform: translateY(0px);
    transform: translateY(0px); }
  100% {
    -webkit-transform: translateY(-10px);
    -ms-transform: translateY(-10px);
    -moz-transform: translateY(-10px);
    -o-transform: translateY(-10px);
    transform: translateY(-10px); } }
@-moz-keyframes float {
  0% {
    -webkit-transform: translateY(0px);
    -ms-transform: translateY(0px);
    -moz-transform: translateY(0px);
    -o-transform: translateY(0px);
    transform: translateY(0px); }
  100% {
    -webkit-transform: translateY(-10px);
    -ms-transform: translateY(-10px);
    -moz-transform: translateY(-10px);
    -o-transform: translateY(-10px);
    transform: translateY(-10px); } }
@keyframes float {
  0% {
    -webkit-transform: translateY(0px);
    -ms-transform: translateY(0px);
    -moz-transform: translateY(0px);
    -o-transform: translateY(0px);
    transform: translateY(0px); }
  100% {
    -webkit-transform: translateY(-10px);
    -ms-transform: translateY(-10px);
    -moz-transform: translateY(-10px);
    -o-transform: translateY(-10px);
    transform: translateY(-10px); } }
@-webkit-keyframes little-ball-spin {
  0% {
    -webkit-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg); }
  25% {
    -webkit-transform: rotate(270deg);
    -ms-transform: rotate(270deg);
    -moz-transform: rotate(270deg);
    -o-transform: rotate(270deg);
    transform: rotate(270deg); }
  50% {
    -webkit-transform: rotate(270deg);
    -ms-transform: rotate(270deg);
    -moz-transform: rotate(270deg);
    -o-transform: rotate(270deg);
    transform: rotate(270deg); }
  75% {
    -webkit-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg); } }
@-moz-keyframes little-ball-spin {
  0% {
    -webkit-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg); }
  25% {
    -webkit-transform: rotate(270deg);
    -ms-transform: rotate(270deg);
    -moz-transform: rotate(270deg);
    -o-transform: rotate(270deg);
    transform: rotate(270deg); }
  50% {
    -webkit-transform: rotate(270deg);
    -ms-transform: rotate(270deg);
    -moz-transform: rotate(270deg);
    -o-transform: rotate(270deg);
    transform: rotate(270deg); }
  75% {
    -webkit-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg); } }
@keyframes little-ball-spin {
  0% {
    -webkit-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg); }
  25% {
    -webkit-transform: rotate(270deg);
    -ms-transform: rotate(270deg);
    -moz-transform: rotate(270deg);
    -o-transform: rotate(270deg);
    transform: rotate(270deg); }
  50% {
    -webkit-transform: rotate(270deg);
    -ms-transform: rotate(270deg);
    -moz-transform: rotate(270deg);
    -o-transform: rotate(270deg);
    transform: rotate(270deg); }
  75% {
    -webkit-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg); } }
@-webkit-keyframes little-ball-alt-spin {
  0% {
    -webkit-transform: translateY(0px) rotate(0deg);
    -ms-transform: translateY(0px) rotate(0deg);
    -moz-transform: translateY(0px) rotate(0deg);
    -o-transform: translateY(0px) rotate(0deg);
    transform: translateY(0px) rotate(0deg); }
  50% {
    -webkit-transform: translateY(-40px) rotate(180deg);
    -ms-transform: translateY(-40px) rotate(180deg);
    -moz-transform: translateY(-40px) rotate(180deg);
    -o-transform: translateY(-40px) rotate(180deg);
    transform: translateY(-40px) rotate(180deg); }
  100% {
    -webkit-transform: translateY(0px) rotate(360deg);
    -ms-transform: translateY(0px) rotate(360deg);
    -moz-transform: translateY(0px) rotate(360deg);
    -o-transform: translateY(0px) rotate(360deg);
    transform: translateY(0px) rotate(360deg); } }
@-moz-keyframes little-ball-alt-spin {
  0% {
    -webkit-transform: translateY(0px) rotate(0deg);
    -ms-transform: translateY(0px) rotate(0deg);
    -moz-transform: translateY(0px) rotate(0deg);
    -o-transform: translateY(0px) rotate(0deg);
    transform: translateY(0px) rotate(0deg); }
  50% {
    -webkit-transform: translateY(-40px) rotate(180deg);
    -ms-transform: translateY(-40px) rotate(180deg);
    -moz-transform: translateY(-40px) rotate(180deg);
    -o-transform: translateY(-40px) rotate(180deg);
    transform: translateY(-40px) rotate(180deg); }
  100% {
    -webkit-transform: translateY(0px) rotate(360deg);
    -ms-transform: translateY(0px) rotate(360deg);
    -moz-transform: translateY(0px) rotate(360deg);
    -o-transform: translateY(0px) rotate(360deg);
    transform: translateY(0px) rotate(360deg); } }
@keyframes little-ball-alt-spin {
  0% {
    -webkit-transform: translateY(0px) rotate(0deg);
    -ms-transform: translateY(0px) rotate(0deg);
    -moz-transform: translateY(0px) rotate(0deg);
    -o-transform: translateY(0px) rotate(0deg);
    transform: translateY(0px) rotate(0deg); }
  50% {
    -webkit-transform: translateY(-40px) rotate(180deg);
    -ms-transform: translateY(-40px) rotate(180deg);
    -moz-transform: translateY(-40px) rotate(180deg);
    -o-transform: translateY(-40px) rotate(180deg);
    transform: translateY(-40px) rotate(180deg); }
  100% {
    -webkit-transform: translateY(0px) rotate(360deg);
    -ms-transform: translateY(0px) rotate(360deg);
    -moz-transform: translateY(0px) rotate(360deg);
    -o-transform: translateY(0px) rotate(360deg);
    transform: translateY(0px) rotate(360deg); } }
@-webkit-keyframes pulsate {
  0% {
    -webkit-transform: scale(0.75);
    -ms-transform: scale(0.75);
    -moz-transform: scale(0.75);
    -o-transform: scale(0.75);
    transform: scale(0.75); }
  20% {
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    -moz-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1); }
  50% {
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    -moz-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1); }
  70% {
    -webkit-transform: scale(0.75);
    -ms-transform: scale(0.75);
    -moz-transform: scale(0.75);
    -o-transform: scale(0.75);
    transform: scale(0.75); }
  100% {
    -webkit-transform: scale(0.75);
    -ms-transform: scale(0.75);
    -moz-transform: scale(0.75);
    -o-transform: scale(0.75);
    transform: scale(0.75); } }
@-moz-keyframes pulsate {
  0% {
    -webkit-transform: scale(0.75);
    -ms-transform: scale(0.75);
    -moz-transform: scale(0.75);
    -o-transform: scale(0.75);
    transform: scale(0.75); }
  20% {
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    -moz-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1); }
  50% {
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    -moz-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1); }
  70% {
    -webkit-transform: scale(0.75);
    -ms-transform: scale(0.75);
    -moz-transform: scale(0.75);
    -o-transform: scale(0.75);
    transform: scale(0.75); }
  100% {
    -webkit-transform: scale(0.75);
    -ms-transform: scale(0.75);
    -moz-transform: scale(0.75);
    -o-transform: scale(0.75);
    transform: scale(0.75); } }
@keyframes pulsate {
  0% {
    -webkit-transform: scale(0.75);
    -ms-transform: scale(0.75);
    -moz-transform: scale(0.75);
    -o-transform: scale(0.75);
    transform: scale(0.75); }
  20% {
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    -moz-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1); }
  50% {
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    -moz-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1); }
  70% {
    -webkit-transform: scale(0.75);
    -ms-transform: scale(0.75);
    -moz-transform: scale(0.75);
    -o-transform: scale(0.75);
    transform: scale(0.75); }
  100% {
    -webkit-transform: scale(0.75);
    -ms-transform: scale(0.75);
    -moz-transform: scale(0.75);
    -o-transform: scale(0.75);
    transform: scale(0.75); } }
#map {
  height: 60%; }

@media screen and (max-width: 800px) {
  #map {
    height: 70%; } }
.custom-popup .leaflet-popup-content-wrapper {
  background: #F7323F;
  color: #fff;
  font-size: 16px;
  line-height: 24px;
  border-radius: 0;
  font-family: "Oswald"; }

.custom-popup .leaflet-popup-content {
  padding: 10px;
  text-align: center;
  width: 200px; }

.custom-popup .leaflet-popup-content-wrapper a {
  color: rgba(255, 255, 255, 0.5); }

.custom-popup .leaflet-popup-tip-container {
  width: 16px;
  height: 10px; }

.custom-popup .leaflet-popup-tip {
  border-left: 7px solid transparent;
  border-right: 7px solid transparent;
  border-top: 10px solid #F7323F; }

.marker-title div {
  opacity: 0.7;
  line-height: 1.3; }

.contact .category-links a {
  display: inline-block;
  float: left;
  margin-right: 40px;
  padding-left: 1.2em; }
  .contact .category-links a:after {
    left: 0; }
  .contact .category-links a.eating:after {
    background: #00c4b3; }
  .contact .category-links a.drinking:after {
    background: #ff8f12; }
  .contact .category-links a.us:after {
    background: #e83944; }

@media all and (min-width: 800px) {
  float: right;
  width: 63%; }
@media all and (min-width: 1060px) {
  .contact .category-links {
    width: 50%; } }
@media all and (max-height: 760px) {
  .map {
    height: 450px; } }
@media all and (max-height: 600px) {
  .map {
    height: 350px; } }
@media all and (max-height: 500px) {
  .map {
    height: 300px; } }
@media all and (max-height: 400px) {
  .map {
    height: 200px; } }
/* Add this attribute to the element that needs a tooltip */
[data-tooltip] {
  position: relative;
  z-index: 2;
  cursor: pointer; }

/* Hide the tooltip content by default */
[data-tooltip]:before,
[data-tooltip]:after {
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
  -webkit-transition: opacity 300ms ease-in-out, -webkit-transform 300ms ease-in-out;
  -moz-transition: opacity 300ms ease-in-out, transform 300ms ease-in-out;
  transition: opacity 300ms ease-in-out, transform 300ms ease-in-out;
  -webkit-transform: translateY(2px);
  -moz-transform: translateY(2px);
  transform: translateY(2px); }

/* Position tooltip above the element */
[data-tooltip]:before {
  position: absolute;
  bottom: 150%;
  left: 50%;
  margin-bottom: 5px;
  margin-left: -1em;
  padding: 0.5em 0.7em;
  width: auto;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  background-color: black;
  background-color: rgba(51, 51, 51, 0.9);
  color: #fff;
  content: attr(data-tooltip);
  text-transform: capitalize;
  text-align: center;
  font-size: 14px;
  line-height: 1.2; }

/* Triangle hack to make tooltip look like a speech bubble */
[data-tooltip]:after {
  position: absolute;
  bottom: 150%;
  left: 50%;
  margin-left: -5px;
  width: 0;
  border-top: 5px solid #000;
  border-top: 5px solid rgba(51, 51, 51, 0.9);
  border-right: 5px solid transparent;
  border-left: 5px solid transparent;
  content: " ";
  font-size: 0;
  line-height: 0; }

/* Show tooltip content on hover */
[data-tooltip]:hover:before,
[data-tooltip]:hover:after {
  visibility: visible;
  opacity: 1;
  -webkit-transform: translateY(0);
  -moz-transform: translateY(0);
  transform: translateY(0); }

.category-icons a.tag {
  content: '';
  display: block;
  height: 10px;
  width: 10px;
  border-radius: 15px;
  position: relative;
  background: #d1d3d4; }

.category-icons {
  list-style: none;
  margin: 0.8em 0;
  padding: 0; }

.category-icons li {
  display: inline-block;
  margin: 0 0.1em; }

.category-icons a.tag:hover:after, .category-icons a.tag.active:after {
  content: '';
  display: block;
  top: 3px;
  left: 3px;
  right: 3px;
  bottom: 3px;
  border-radius: 15px;
  background: white;
  position: absolute; }

li.code[data-tooltip]:before,
li.code a.tag,
li.code a:after,
.wrapper.code-main li.code a:after,
.code-main .no-image, .code-main .post-content .no-image {
  background-color: #ff5b34; }

li.code[data-tooltip]:after {
  border-top-color: #ff5b34; }

li.inspiration[data-tooltip]:before,
li.inspiration a.tag,
li.inspiration a:after,
.wrapper.inspiration-main li.inspiration a:after,
.inspiration-main .no-image, .inspiration-main .post-content .no-image {
  background-color: #684458; }

li.inspiration[data-tooltip]:after {
  border-top-color: #684458; }

li.made[data-tooltip]:before,
li.made a.tag,
li.made a:after,
.wrapper.made-main li.made a:after,
.made-main .no-image, .made-main .post-content .no-image {
  background-color: #0074c8; }

li.made[data-tooltip]:after {
  border-top-color: #0074c8; }

li.thinking[data-tooltip]:before,
li.thinking a.tag,
li.thinking a:after,
.wrapper.thinking-main li.thinking a:after,
.thinking-main .no-image {
  background-color: #70a087; }

li.thinking[data-tooltip]:after {
  border-top-color: #70a087; }

li.people[data-tooltip]:before,
li.people a.tag,
li.people a:after,
.wrapper.people-main li.people a:after,
.people-main .no-image {
  background-color: #00bc6f; }

li.people[data-tooltip]:after {
  border-top-color: #00bc6f; }

li.process[data-tooltip]:before,
li.process a.tag,
li.process a:after,
.wrapper.process-main li.process a:after,
.process-main .no-image {
  background-color: #00c4b3; }

li.process[data-tooltip]:after {
  border-top-color: #00c4b3; }

li.ideas[data-tooltip]:before,
li.ideas a.tag,
li.ideas a:after,
.wrapper.ideas-main li.ideas a:after,
.ideas-main .no-image {
  background-color: #00795f; }

li.ideas[data-tooltip]:after {
  border-top-color: #00795f; }

li.adventures[data-tooltip]:before,
li.adventures a.tag,
li.adventures a:after,
.wrapper.adventures-main li.adventures a:after,
.adventures-main .no-image {
  background-color: #dc5f13; }

li.adventures[data-tooltip]:after {
  border-top-color: #dc5f13; }

li.design[data-tooltip]:before,
li.design a.tag,
li.design a:after,
.wrapper.design-main li.design a:after,
.design-main .no-image {
  background-color: #ffbf3b; }

li.design[data-tooltip]:after {
  border-top-color: #ffbf3b; }

li.studio[data-tooltip]:before,
li.studio a.tag,
li.studio a:after,
.wrapper.studio-main li.studio a:after,
.studio-main .no-image {
  background-color: #f6323e; }

li.studio[data-tooltip]:after {
  border-top-color: #f6323e; }

li.found[data-tooltip]:before,
li.found a.tag,
li.found a:after,
.wrapper.found-main li.found a:after,
.found-main .no-image {
  background-color: #00a0ae; }

li.found[data-tooltip]:after {
  border-top-color: #00a0ae; }

li.interesting[data-tooltip]:before,
li.interesting a.tag,
li.interesting a:after,
.wrapper.interesting-main li.interesting a:after,
.interesting-main .no-image {
  background-color: #f46177; }

li.interesting[data-tooltip]:after {
  border-top-color: #f46177; }

.blog-category.code-main .cat-highlight,
.blog-category.code-main .blog-content a,
.blog-category.code-main .blog-content h3,
.blog-category.code-main .blog-content h2 {
  color: #ff5b34; }

li.code a:hover {
  color: #ff5b34; }

.blog-category.inspiration-main .cat-highlight,
.blog-category.inspiration-main .blog-content a,
.blog-category.inspiration-main .blog-content h3,
.blog-category.inspiration-main .blog-content h2 {
  color: #684458; }

li.inspiration a:hover {
  color: #684458; }

.blog-category.made-main .cat-highlight,
.blog-category.made-main .blog-content a,
.blog-category.made-main .blog-content h3,
.blog-category.made-main .blog-content h2 {
  color: #0074c8; }

li.made a:hover {
  color: #0074c8; }

.blog-category.thinking-main .cat-highlight,
.blog-category.thinking-main .blog-content a,
.blog-category.thinking-main .blog-content h3,
.blog-category.thinking-main .blog-content h2 {
  color: #70a087; }

li.thinking a:hover {
  color: #70a087; }

.blog-category.people-main .cat-highlight,
.blog-category.people-main .blog-content a,
.blog-category.people-main .blog-content h3,
.blog-category.people-main .blog-content h2 {
  color: #00bc6f; }

li.people a:hover {
  color: #00bc6f; }

.blog-category.process-main .cat-highlight,
.blog-category.process-main .blog-content a,
.blog-category.process-main .blog-content h3,
.blog-category.process-main .blog-content h2 {
  color: #00c4b3; }

li.process a:hover {
  color: #00c4b3; }

.blog-category.ideas-main .cat-highlight,
.blog-category.ideas-main .blog-content a,
.blog-category.ideas-main .blog-content h3,
.blog-category.ideas-main .blog-content h2 {
  color: #00795f; }

li.ideas a:hover {
  color: #00795f; }

.blog-category.adventures-main .cat-highlight,
.blog-category.adventures-main .blog-content a,
.blog-category.adventures-main .blog-content h3,
.blog-category.adventures-main .blog-content h2 {
  color: #dc5f13; }

li.adventures a:hover {
  color: #dc5f13; }

.blog-category.design-main .cat-highlight,
.blog-category.design-main .blog-content a,
.blog-category.design-main .blog-content h3,
.blog-category.design-main .blog-content h2 {
  color: #ffbf3b; }

li.design a:hover {
  color: #ffbf3b; }

.blog-category.studio-main .cat-highlight,
.blog-category.studio-main .blog-content a,
.blog-category.studio-main .blog-content h3,
.blog-category.studio-main .blog-content h2 {
  color: #f6323e; }

li.studio a:hover {
  color: #f6323e; }

.blog-category.found-main .cat-highlight,
.blog-category.found-main .blog-content a,
.blog-category.found-main .blog-content h3,
.blog-category.found-main .blog-content h2 {
  color: #00a0ae; }

li.found a:hover {
  color: #00a0ae; }

.blog-category.interesting-main .cat-highlight,
.blog-category.interesting-main .blog-content a,
.blog-category.interesting-main .blog-content h3,
.blog-category.interesting-main .blog-content h2 {
  color: #f46177; }

li.interesting a:hover {
  color: #f46177; }

/**
 * Projects index page styles
 */
.projects {
  padding-bottom: 4%; }
  /*.projects figure {
    background-color: #e83944; }
    .projects figure img {
      border: 1px solid white; }*/
  .projects .project-index-meta {
    opacity: 0.6; }
  .projects .project-index-content {
    font-size: 1.13333em;
    line-height: 1.4em;
    color: white;
    position: absolute;
    top: 1em;
    bottom: 1em;
    left: 1em;
    right: 1em;
    max-width: 20em;
    opacity: 0;
    transition: all .3s ease-out; }

/**
 * Individual project page styles
 */
.project-footer {
  width: 50%;
  float: right;
  padding: 3.5em 0 5em 0.5em;
  -webkit-box-sizing: border-box;
  -ms-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -o-box-sizing: border-box;
  box-sizing: border-box; }

.project-social ul {
  list-style: none;
  margin: 0; }
.project-social li {
  display: inline-block; }
.project-social li:before {
  content: '  /  '; }
.project-social li:first-child:before {
  content: ''; }
.project-social a {
  text-decoration: none;
  color: #174d59;
  -webkit-transition: all 0.3s ease-out;
  -ms-transition: all 0.3s ease-out;
  -moz-transition: all 0.3s ease-out;
  -o-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out; }
.project-social a:hover {
  color: #51cec9; }

.project-nav {
  padding-top: 1em; }
  .project-nav a {
    text-decoration: none;
    display: block;
    float: left;
    clear: left;
    color: #777777;
    border-bottom: 1px solid rgba(119, 119, 119, 0.4);
    -webkit-transition: all 0.3s ease-out;
    -ms-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out; }
    .project-nav a:hover {
      color: #ACD07A; }

@media all and (min-width: 600px) {
  .projects .project-index-content {
    font-size: 15px;
    line-height: 1.4em; } }
@media all and (min-width: 850px) {
  .projects .project-index-content {
    top: 2em;
    left: 25%;
    right: 0.5em;
    padding-right: 3em; } }
@media all and (min-width: 1160px) {
  .projects .project-index-content {
    font-size: 1.13333em;
    line-height: 1.4em; } }
@media all and (min-width: 1300px) {
  .projects .project-index-content {
    top: 50%;
    bottom: 2em; } }
/**
 * Basic generic grid
 */
.grid {
  overflow: hidden;
  margin: 0 0; }
  .grid img {
    width: 100%; }
  .grid .grid-item {
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    position: relative;
    padding: 0 0.5em 0;
    margin-bottom: 1em; }
    .grid .grid-item figure {
      overflow: hidden;
      position: relative;
      display: block;
      height: 0;
      padding-bottom: 68%; }
    .grid .grid-item img {
      display: block;
      width: 100%;
      transition: all .3s ease-out;
      /* prevent weird 1px width/height/position changes on hover in Chrome */
      position: relative;
      -webkit-backface-visibility: hidden; }
    .grid .grid-item a {
      text-decoration: none;
      color: #666666; }
      /*.grid .grid-item a:hover img {
        opacity: 0.1;
        -webkit-backface-visibility: hidden; }
      .grid .grid-item a:hover .project-index-content {
        opacity: 1; }*/
    .grid .grid-item h2,
    .grid .grid-item h3 {
      padding-top: 0.5em; }

.media-grid img,
.media-grid iframe {
  display: block;
  max-width: 100%; }
.media-grid > * {
  margin-bottom: 0em; }
.media-grid [data-embed] {
  margin-left: 0.5em;
  margin-right: 0.5em; }
.media-grid .grid-item {
  margin-bottom: 1em; }
  .media-grid .grid-item:nth-child(odd) {
    clear: none !important; }
.media-grid .animated-panorama {
  position: relative;
  padding-bottom: 50%;
  max-height: 670px; }
  .media-grid .animated-panorama div {
    margin-left: -100%;
    -webkit-transform: translate3d(0, 0, 1);
    -webkit-animation-duration: 60s;
    -webkit-animation-name: animated-panorama-wrapper;
    -webkit-animation-direction: alternate;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    -moz-transform: translate3d(0, 0, 1);
    -moz-animation-duration: 60s;
    -moz-animation-name: animated-panorama-wrapper;
    -moz-animation-direction: alternate;
    -moz-animation-iteration-count: infinite;
    -moz-animation-timing-function: linear;
    transform: translate3d(0, 0, 1);
    animation-duration: 60s;
    animation-name: animated-panorama-wrapper;
    animation-direction: alternate;
    animation-iteration-count: infinite;
    animation-timing-function: linear; }
  .media-grid .animated-panorama img {
    position: absolute;
    width: auto;
    max-width: none;
    height: 100%;
    margin-left: 100%;
    -webkit-animation-duration: 60s;
    -webkit-animation-name: animated-panorama;
    -webkit-animation-direction: alternate;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    -moz-animation-duration: 60s;
    -moz-animation-name: animated-panorama;
    -moz-animation-direction: alternate;
    -moz-animation-iteration-count: infinite;
    -moz-animation-timing-function: linear;
    animation-duration: 60s;
    animation-name: animated-panorama;
    animation-direction: alternate;
    animation-iteration-count: infinite;
    animation-timing-function: linear; }

@-webkit-keyframes animated-panorama-wrapper {
  from {
    margin-left: -100%; }
  to {
    margin-left: 0; } }
@-moz-keyframes animated-panorama-wrapper {
  from {
    margin-left: -100%; }
  to {
    margin-left: 0; } }
@keyframes animated-panorama-wrapper {
  from {
    margin-left: -100%; }
  to {
    margin-left: 0; } }
@-webkit-keyframes animated-panorama {
  from {
    -webkit-transform: translate3d(0, 0, 0); }
  to {
    -webkit-transform: translate3d(-100%, 0, 0); } }
@-moz-keyframes animated-panorama {
  from {
    -moz-transform: translate3d(0, 0, 0); }
  to {
    -moz-transform: translate3d(-100%, 0, 0); } }
@keyframes animated-panorama {
  from {
    transform: translate3d(0, 0, 0); }
  to {
    transform: translate3d(-100%, 0, 0); } }
@media all and (min-width: 600px) {
      
    .grid .grid-item {
    width: 33%;
    float: left; }
    .grid .grid-item:nth-child(odd) {
      /*clear: left;*/ } }


.grid-item-client img
{
    -webkit-filter: grayscale(1);
	-webkit-filter: grayscale(100%);
	filter: gray;
	filter: grayscale(100%);
	filter: url(desaturate.svg#greyscale);

    -webkit-transition: color 0.3s ease-out;
  -ms-transition: color 0.3s ease-out;
  -moz-transition: color 0.3s ease-out;
  -o-transition: color 0.3s ease-out;
  transition: color 0.3s ease-out;
}
.grid-item-client img:hover
{
    -webkit-filter: grayscale(0);
	-webkit-filter: grayscale(0%);
	filter: grayscale(0%);


}

@media all and (min-width: 1060px) {
    .grid-item-client {
        width: 20%;
        float: left;
    }
}


@media all and (max-width: 1060px) {
    .grid-item-client {
        width: 30%;
        float: left;
    }
}

@media all and (max-width: 600px) {
    .grid-item-client {
        width: 50%;
        float: left;
    }
}






@media all and (min-width: 850px) {
  
    .grid .grid-item h2,
  .grid .grid-item h3,
  .grid .grid-item p {
     }
  .grid .grid-item-4-1 {
    width: 25%; }
    .grid .grid-item-4-1:nth-child(odd) {
      clear: none; } }
.caption-l,
.caption-r {
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  padding: 3em 0 3em 50%;
  margin: 2em 0;
  position: relative;
  color: #a7a9ac; }

.arrow-up:after,
.arrow-down:after {
  background-image: url("../images/arrow.html");
  background-repeat: no-repeat;
  background-size: 23px 58px;
  content: '';
  display: block;
  width: 25px;
  height: 29px;
  position: absolute; }

.arrow-up:after {
  background-position: 1% 1%; }

.arrow-up:after,
.arrow-down:after {
  top: 50%;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  transform: translateY(-50%); }

.arrow-down:after {
  background-position: 1% 100%; }

.left,
.left:after {
  left: 0; }

.right,
.right:after {
  right: 0; }

@media screen and (max-width: 600px) {
  .caption-l,
  .caption-r {
    padding-left: 0;
    padding-right: 0; } }

.submit {
  background: #05ce7b;
  position: relative; }
  .submit:hover {
    background: #049257; }
  .submit:disabled {
    background: #72b894; }
  .submit:focus {
    outline-width: 0; }

.btn-loader {
  display: inline-block;
  vertical-align: middle;
  max-height: 3.8em;
  margin-top: -2px;
  opacity: 0;
  -webkit-transition: all 0.3s ease-out;
  -ms-transition: all 0.3s ease-out;
  -moz-transition: all 0.3s ease-out;
  -o-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out; }
  .btn-loader.visible {
    opacity: 1; }

form.hire-us .what label {
  margin-bottom: 1em;
  margin-left: 0.5em;
  margin-top: 0.1em; }
form.hire-us label:hover {
  cursor: pointer; }

form.hire-us .name, form.hire-us .email {
  float: left;
  width: 47.25%; }

form.hire-us .email {
  margin-left: 5%; }

form input {
  -webkit-appearance: none;
  border-radius: 0; }

.form-group {
  margin-bottom: 20px; }

form.hire-us input[type="text"], form.hire-us input[type="email"], form.hire-us input[type="tel"], form.hire-us input[type="url"], form.hire-us input[type="password"], form.hire-us textarea {
  box-sizing: border-box;
  background-color: #f0f0ee;
  border: none;
  display: block;
  font-size: 1em;
  padding: 0.4em;
  margin-bottom: 1.4em;
  width: 100%;
  vertical-align: middle;
  font-family: 'Oswald'; }
form.hire-us label {
  color: #58595b;
  border: 0;
  display: inline-block;
  font-size: 1em;
  font-weight: bold;
  line-height: 1.4em;
  margin-bottom: 0.5em;
  position: relative;
  text-transform: none; }
form.hire-us textarea {
  min-height: 200px; }
form.hire-us .digital-details, form.hire-us .print-details {
  margin-bottom: 1.4em; }
  form.hire-us .digital-details input, form.hire-us .print-details input {
    display: none; }
  form.hire-us .digital-details .grid-col-third, form.hire-us .print-details .grid-col-third {
    text-align: center;
    padding: 0.5em;
    box-sizing: border-box;
    width: 33.3%;
    float: left; }
    form.hire-us .digital-details .grid-col-third label, form.hire-us .print-details .grid-col-third label {
      padding: 15px;
      margin-bottom: 0;
      background: #f0f0ee;
      display: block; }
form.hire-us input[type=text].slider-value {
  background: none;
  border: none;
  text-align: center; }
form.hire-us input[type=checkbox]:checked + label {
  background: #e83944;
  color: white; }

.feedback-msg {
  position: fixed;
  bottom: -300px;
  left: 0;
  right: 0;
  padding: 2em 0;
  z-index: 1000;
  color: white;
  -webkit-transition: bottom 0.5s ease-out;
  -ms-transition: bottom 0.5s ease-out;
  -moz-transition: bottom 0.5s ease-out;
  -o-transition: bottom 0.5s ease-out;
  transition: bottom 0.5s ease-out; }
  .feedback-msg.msg-success {
    background: #05ce7b; }
  .feedback-msg.msg-error {
    background: #e83944; }
  .feedback-msg.msg-visible {
    bottom: 0; }
  .feedback-msg p {
    max-width: 1500px;
    width: 90%;
    margin: 0 auto; }
  .feedback-msg a {
    color: white; }

.ui-slider {
  width: 100%;
  margin: 2em auto; }

/* Functional styling;
 * These styles are required for noUiSlider to function.
 * You don't need to change these rules to apply your design.
 */
.noUi-target,
.noUi-target * {
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -ms-touch-action: none;
  -ms-user-select: none;
  -moz-user-select: none;
  -moz-box-sizing: border-box;
  box-sizing: border-box; }

.noUi-base {
  width: 100%;
  height: 100%;
  position: relative; }

.noUi-origin {
  position: absolute;
  right: 0;
  top: 0;
  left: 0;
  bottom: 0; }

.noUi-handle {
  position: relative;
  z-index: 1; }

.noUi-stacking .noUi-handle {
  /* This class is applied to the lower origin when
     its values is > 50%. */
  z-index: 10; }

.noUi-stacking + .noUi-origin {
  /* Fix stacking order in IE7, which incorrectly
     creates a new context for the origins. */
  *z-index: -1; }

.noUi-state-tap .noUi-origin {
  -webkit-transition: left 0.3s, top 0.3s;
  transition: left 0.3s, top 0.3s; }

.noUi-state-drag * {
  cursor: inherit !important; }

/* Slider size and handle placement;
 */
.noUi-horizontal {
  height: 2px;
  margin: 20px 0; }

.noUi-horizontal .noUi-handle {
  width: 28px;
  border-radius: 200px;
  height: 28px;
  left: -17px;
  top: -12px;
  margin: 0; }

.noUi-horizontal.noUi-extended {
  padding: 0 15px; }

.noUi-horizontal.noUi-extended .noUi-origin {
  right: -15px; }

.noUi-vertical {
  width: 18px; }

.noUi-vertical .noUi-handle {
  width: 28px;
  height: 34px;
  left: -6px;
  top: -17px; }

.noUi-vertical.noUi-extended {
  padding: 15px 0; }

.noUi-vertical.noUi-extended .noUi-origin {
  bottom: -15px; }

/* Styling;
 */
.noUi-background {
  background: gainsboro; }

.noUi-connect {
  background: #f5fbfd;
  -webkit-transition: background 450ms;
  transition: background 450ms; }

/* Handles and cursors;
 */
.noUi-dragable {
  cursor: w-resize; }

.noUi-vertical .noUi-dragable {
  cursor: n-resize; }

.noUi-handle {
  background: #58595b;
  cursor: default; }

.noUi-handle:after {
  left: 17px; }

/* Disabled state;
 */
[disabled].noUi-connect,
[disabled] .noUi-connect {
  background: #B8B8B8; }

[disabled] .noUi-handle {
  cursor: not-allowed; }

[data-embed] {
  position: relative;
  cursor: pointer; }

[data-embed]:after {
  content: ' ';
  position: absolute;
  top: 50%;
  margin-top: -25px;
  left: 50%;
  margin-left: -13px;
  border-left: rgba(255, 255, 255, 0.7) 40px solid;
  border-top: transparent 26px solid;
  border-bottom: transparent 26px solid;
  z-index: 2;
  -webkit-transition: all 0.3s ease-out;
  -ms-transition: all 0.3s ease-out;
  -moz-transition: all 0.3s ease-out;
  -o-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out; }

[data-embed]:before {
  content: ' ';
  position: absolute;
  width: 100px;
  height: 100px;
  top: 50%;
  margin-top: -50px;
  left: 50%;
  margin-left: -50px;
  border: rgba(255, 255, 255, 0.7) 1px solid;
  border-radius: 50px;
  z-index: 2;
  -webkit-transition: all 0.3s ease-out;
  -ms-transition: all 0.3s ease-out;
  -moz-transition: all 0.3s ease-out;
  -o-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out; }

[data-embed]:hover:after {
  border-left-color: rgba(255, 255, 255, 0.9); }

[data-embed]:hover:before {
  border-color: rgba(255, 255, 255, 0.9); }

[data-embed].video-in-place:after,
[data-embed].video-in-place:before {
  display: none; }

  
  

		
/* ------------------------------------
       
      MAIN PROJECTS

------------------------------------ */

			#posts .post,
			#posts .post a .wrap { position: relative; }
			#posts .post a {  
				display: block;
			}
			#posts .post.latest .wrap,
			#posts .post.latebig .wrap /*hack for extra height*/ { padding-bottom: 3px; }
			#posts .post a img {
				width: 100%;
				height: auto;
			}
			#posts .post a .overlay {
				position: absolute;
				top: 0;
				left: 0;
				width: 100%;
				height: 100%;
				text-align: center;
				opacity: 0;
			}
			#posts .post a .overlay span {
				display: none;
				margin-bottom: 10px;
			}
			body.notouch #posts .post a:hover .overlay {
				opacity: 1;
			}
	
	
/* ------------------------------------
       
      PAGE & PROJECT INFO

------------------------------------ */	
	
			#info .container { position: relative; }

			#project #info { border-bottom: 1px solid #e1e1e1; }
			
			#info #loading {
				font-size: 32px;
				text-align: center;
				position: fixed;
				z-index: 9999;
				width: 100%;
				height: 100%;
				opacity: 0.95;
			}
			#info #loading .spin {
				position: absolute;
				left: 50%;
				top: 50%;
				margin: -140px 0 0 -17px;
			}
			
			#info .row { margin: 0 0 60px; }
			
			#info h2 span.icon { display: none; }
			#info h2 span.icon.open {
				-webkit-transform: rotate(-180deg); 
				-moz-transform: rotate(-180deg);
				filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
			}
			
			.ProjMeta.B { 
				display: none; 
				margin: 20px 0 0;
			}

/* ------------------------------------
       
      PROJECT MEDIA

------------------------------------ */			
			
			#project #media .wrap .each .pad {
				position: relative;
			}
			#project #media .wrap .caption {
				position: absolute;
				bottom: 10px;
				left: 10px;
				padding: 10px;
				line-height: 11px;
				font-weight: 500;
			}
			#project #media .wrap .each img {
				width: 100%; 
				height: auto; 
			}
			#project #media .wrap .each.med {
				float: left;
				width: 50%;
			}


            
/* ------------------------------------
       
      GENERAL ARCHITECTURE

------------------------------------ */
	
			#WRAPPER { 
				width: 100%; 
				min-height: 100%; 
				height: auto !important; 
				height: 100%; 
				margin: 0 0 -86px; /* MATCHES FOOTER & PUSH HEIGHT */
			}
			
			.stretch .container { 
				width: 100%; 
				margin: 0 auto; 
				max-width: 1400px; 
			}
			
			#header .inner,
			#project #media .inner,
			#footer .inner { padding: 0; }
			
			#info .inner { padding: 60px 40px 0 30px; }
			
			#header .logo h1 a,
			#header .menu li a,
			#info .wrap,
			#footer .legal span,
			#footer .social ul li,
			#footer .subscribe #mc_embed_signup { margin: 0 0 0 10px; }
			
			#posts .inner { padding: 40px 40px 30px 30px; }
			#posts .post a { margin: 0 0 10px 10px; }

#project #media .wrap {
    padding: 0;
    margin-bottom: 50px;
}
    #project #media .wrap .each .pad {
        padding: 0;
        margin: -4px 0px;
    }

		

.width50{
	width:50% !important;
}

@media screen and (max-width: 600px) {
	.width50{
	width:100% !important;
}
}