body {
	font-family: 'fab',Helvetica,sans-serif;
	text-rendering: optimizeLegibility;
	-webkit-font-feature-settings: "kern" 1;
	   -moz-font-feature-settings: "kern" 1;
	        font-feature-settings: "kern" 1;
	-webkit-font-kerning: normal;
	   -moz-font-kerning: normal;
	        font-kerning: normal;
}

.hidden {
	display: none;
}

a {
	text-decoration: none;
}

p > a {
	font-weight: 700;
	color: inherit;
}

.clipbox {
	position: absolute;
	top: 0;
	width: 100%;
	height: 100%;
	-webkit-clip-path: inset(auto auto auto auto);
	        clip-path: inset(auto auto auto auto);
	clip: rect(auto auto auto auto);
	background-position: center center;
	background-repeat: no-repeat;
	-moz-background-size: cover;
	  -o-background-size: cover;
	     background-size: cover;
	z-index: 0;
	overflow: hidden;
}
.clipbox video {
	width: 100%;
	height: 100%;
	-o-object-fit: cover;
	   object-fit: cover;
}

nav {
	position: fixed;
	width: 100%;
	height: auto;
	top: 0;
	-webkit-user-select: none;
	   -moz-user-select: none;
	    -ms-user-select: none;
	        user-select: none;
}

nav,.project,footer {
	-webkit-backface-visibility: hidden;
	   -moz-backface-visibility: hidden;
	        backface-visibility: hidden;
	-webkit-transform: translateZ(0);
	   -moz-transform: translateZ(0);
	        transform: translateZ(0);
}

nav .logo {
	width: auto;
	height: auto;
	float: left;
	margin: 18px;
}

.logo svg {
	height: 32px;
}

.menu {
	position: fixed;
	width: 100%;
	height: 100%;
	z-index: 1000;
	background: rgba(0,0,0,0.85);
	opacity: 0;
	-webkit-transition: visibility .2s ease-in-out,opacity .2s ease-in-out;
	-o-transition: visibility .2s ease-in-out,opacity .2s ease-in-out;
	-moz-transition: visibility .2s ease-in-out,opacity .2s ease-in-out;
	transition: visibility .2s ease-in-out,opacity .2s ease-in-out;
	visibility: hidden;
}

.closearea {
	position: absolute;
	height: 100%;
	width: 100%;
	float: right;
	z-index: 630;
}

.menupanel {
	position: fixed;
	overflow-y: auto;
	width: 100%;
	height: 100%;
	background: #fff;
	-webkit-transform: translateY(0) translateX(0) rotate(0deg);
	   -moz-transform: translateY(0) translateX(0) rotate(0deg);
	    -ms-transform: translateY(0) translateX(0) rotate(0deg);
	     -o-transform: translateY(0) translateX(0) rotate(0deg);
	        transform: translateY(0) translateX(0) rotate(0deg);
	-webkit-transition: -webkit-transform .2s ease-in-out;
	transition: -webkit-transform .2s ease-in-out;
	-o-transition: -o-transform .2s ease-in-out;
	-moz-transition: transform .2s ease-in-out, -moz-transform .2s ease-in-out;
	transition: transform .2s ease-in-out;
	transition: transform .2s ease-in-out, -webkit-transform .2s ease-in-out, -moz-transform .2s ease-in-out, -o-transform .2s ease-in-out;
	right: -440px;
	z-index: 1000;
	display: -webkit-box;
	display: -webkit-flex;
	display: -moz-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-webkit-flex-direction: column;
	   -moz-box-orient: vertical;
	   -moz-box-direction: normal;
	    -ms-flex-direction: column;
	        flex-direction: column;
}
.homelink {
	width: auto;
	height: 14px;
	margin-top: auto;
	margin-left: 108px;
	margin-bottom: 36px;
}

.menucontents {
	padding-top: 102px;
	height: auto;
	width: auto;
}

.menucontents > ul {
	width: 100%;
	height: auto;
	text-align: left;
}

.menucontents > ul > li {
	padding-left: 108px;
}

.menulinks {
	margin-top: 8px;
	padding-bottom: 17px;
}

.menulinks > li {
	width: auto;
	font-weight: regular;
	margin-bottom: 6px;
	padding-left: 18px;
	padding-right: 18px;
	font-size: 16pt;
	line-height: 31px;
}

.menutitle > li {
	padding-bottom: 3px;
	padding-top: 2px;
	font-size: 12pt;
}

.menupanel a {
	color: #000;
	-webkit-transition: opacity .3s ease-in-out;
	-o-transition: opacity .3s ease-in-out;
	-moz-transition: opacity .3s ease-in-out;
	transition: opacity .3s ease-in-out;
}

.menupanel a {
	opacity: .5;
}

.menupanel a:hover {
	opacity: 1;
}

.menutitle {
	opacity: .25;
	border-bottom: rgba(0,0,0,0.5) 1px solid;
}

.menutitle > ul > li {
	font-size: 10pt;
}

.menu > nav {
	position: fixed;
	right: 0;
	width: auto;
	z-index: 1050;
}

.menupanel.open {
	-webkit-transform: translateX(-440px);
	   -moz-transform: translateX(-440px);
	    -ms-transform: translateX(-440px);
	     -o-transform: translateX(-440px);
	        transform: translateX(-440px);
}

.menu.open {
	visibility: visible;
	opacity: 1;
}

.menubutton {
	float: right;
	width: 36px;
	height: 36px;
	margin: 18px;
	margin-left: 0;
	margin-bottom: 0;
	cursor: pointer;
}
.menubutton svg {
	width: 36px;
	height: 36px;
	-webkit-transform: scale(1,1);
	   -moz-transform: scale(1,1);
	    -ms-transform: scale(1,1);
	     -o-transform: scale(1,1);
	        transform: scale(1,1);
	-webkit-transition: .3s ease-in-out;
	-o-transition: .3s ease-in-out;
	-moz-transition: .3s ease-in-out;
	transition: .3s ease-in-out;
}

#line1,#line2,#line3 {
	-webkit-transition: .3s ease-in-out;
	-o-transition: .3s ease-in-out;
	-moz-transition: .3s ease-in-out;
	transition: .3s ease-in-out;
	-webkit-transform: translateY(0) translateX(0) rotate(0deg);
	   -moz-transform: translateY(0) translateX(0) rotate(0deg);
	    -ms-transform: translateY(0) translateX(0) rotate(0deg);
	     -o-transform: translateY(0) translateX(0) rotate(0deg);
	        transform: translateY(0) translateX(0) rotate(0deg);
	opacity: 1;
}
.menubutton.open #line1 {
	-webkit-transform: translateY(-2px) translateX(12.5px) rotate(45deg);
	   -moz-transform: translateY(-2px) translateX(12.5px) rotate(45deg);
	    -ms-transform: translateY(-2px) translateX(12.5px) rotate(45deg);
	     -o-transform: translateY(-2px) translateX(12.5px) rotate(45deg);
	        transform: translateY(-2px) translateX(12.5px) rotate(45deg);
}

.menubutton.open #line2 {
	-webkit-transform: translateX(-72px);
	   -moz-transform: translateX(-72px);
	    -ms-transform: translateX(-72px);
	     -o-transform: translateX(-72px);
	        transform: translateX(-72px);
}

.menubutton.open #line3 {
	-webkit-transform: translateY(12.5px) translateX(-13px) rotate(-45deg);
	   -moz-transform: translateY(12.5px) translateX(-13px) rotate(-45deg);
	    -ms-transform: translateY(12.5px) translateX(-13px) rotate(-45deg);
	     -o-transform: translateY(12.5px) translateX(-13px) rotate(-45deg);
	        transform: translateY(12.5px) translateX(-13px) rotate(-45deg);
}

.menubutton > svg > rect, #line1, #line2, #line3 {
	-webkit-transition: 0.3s ease-in-out;
	-o-transition: 0.3s ease-in-out;
	-moz-transition: 0.3s ease-in-out;
	transition: 0.3s ease-in-out;
}
.project {
	position: fixed;
	height: auto;
	top: 50%;
	margin-top: -36px;
	padding: 18px;
}

.project h2 {
	font-size: 16pt;
	font-weight: regular;
	line-height: 1.25;
	padding-bottom: 29px;
	letter-spacing: 1px;
}

.work .projectbutton, .blockoftext > .links {
	display: inline-block;
	width: auto;
	font-size: 16pt;
	font-weight: regular;
	line-height: 18px;
	padding: 11px 12px 13px;
	border: 2px solid;
	cursor: pointer;
	-webkit-transition: 0.3s ease-in-out;
	-o-transition: 0.3s ease-in-out;
	-moz-transition: 0.3s ease-in-out;
	transition: 0.3s ease-in-out;
}
.perspectiveContainer {
	margin: auto;
  	position: fixed;
  	top: 0; left: 0;
	bottom: 0; right: 0;
	width: 47vw;
	height: 11vw;
	-webkit-perspective: 300px;
	   -moz-perspective: 300px;
	        perspective: 300px;
	background: #000;
	overflow: hidden;
}
.tiltingplane {
	position: absolute;
	margin-left: -75vw;
	margin-top: -90vh;
	width: 200vw;
	height: 200vh;
}
.tiltingplane svg {
	width: 100%;
	height: 100%;
	left: -25%;
	top: -25%;
	opacity: 0;
	-webkit-animation-delay: 1s;
	   -moz-animation-delay: 1s;
	     -o-animation-delay: 1s;
	        animation-delay: 1s;
	-webkit-animation: fadeMeese 0.5s ease-in;
	   -moz-animation: fadeMeese 0.5s ease-in;
	     -o-animation: fadeMeese 0.5s ease-in;
	        animation: fadeMeese 0.5s ease-in;
	-webkit-animation-fill-mode: forwards;
	   -moz-animation-fill-mode: forwards;
	     -o-animation-fill-mode: forwards;
	        animation-fill-mode: forwards;
	-webkit-transform: rotate(-90deg) scale(1.25) translateX(-25%);
	   -moz-transform: rotate(-90deg) scale(1.25) translateX(-25%);
	    -ms-transform: rotate(-90deg) scale(1.25) translateX(-25%);
	     -o-transform: rotate(-90deg) scale(1.25) translateX(-25%);
	        transform: rotate(-90deg) scale(1.25) translateX(-25%);
}
@-webkit-keyframes fadeMeese {
	100% {
		opacity: 1;
	}
}
@-moz-keyframes fadeMeese {
	100% {
		opacity: 1;
	}
}
@-o-keyframes fadeMeese {
	100% {
		opacity: 1;
	}
}
@keyframes fadeMeese {
	100% {
		opacity: 1;
	}
}
.tiltingplane svg line {
	stroke: #FF4B5C;
	stroke-width: 32px;
}


.mask {
	margin: auto;
  position: fixed;
  top: 0; left: 0;
	bottom: 0; right: 0;
	width: 50vw;
	height: 13vw;
}
.mask svg {
	fill: #fff;
	width: 100%;
	height: 100%;
}
.downarrow {
	width: 100%;
	font-size: 36pt;
	text-align: center;
	position: fixed;
	bottom: 18px;
	cursor: pointer;
}

.downarrow svg {
	width: 64px;
	height: 64px;
}

.blockoftext {
	margin-top: 72px;
	padding-top: 108px;
	padding-bottom: 108px;
	max-width: 666px;
	margin-left: auto;
	margin-right: auto;
}

.blockoftext h2,.blockoftext p,.blockoftext > .links {
	margin-left: 18px;
	margin-right: 18px;
}

.blockoftext h2 {
	font-size: 30px;
	font-weight: regular;
	line-height: 1.25;
	letter-spacing: 1px;
}

.blockoftext p {
	padding-top: 36px;
	font-size: 20px;
	font-weight: regular;
	line-height: 2;
}

.blockoftext > .links {
	margin-top: 36px;
	width: auto;
	max-width: 300px;
	font-size: 20px;
	line-height: 1;
}

.blockoftext > .links a {
	color: inherit;
}

footer {
	background-color: #fff;
	color: #000;
	padding: 0;
	width: 100%;
	height: auto;
}

footer > ul {
	width: auto;
	float: left;
	padding-left: 18px;
	padding-top: 18px;
}

footer > ul > li {
	width: auto;
	font-weight: regular;
	margin-bottom: 18px;
	font-size: 16pt;
	line-height: 18px;
}

.links {
	width: auto;
}

footer,footer a {
	color: #000;
	-webkit-transition: opacity .3s ease-in-out;
	-o-transition: opacity .3s ease-in-out;
	-moz-transition: opacity .3s ease-in-out;
	transition: opacity .3s ease-in-out;
}

footer a {
	opacity: .5;
}

footer a:hover {
	opacity: 1;
}

.copy {
	width: auto;
	float: right;
	padding-right: 18px;
	text-align: right;
}

.clipbox a {
	color: inherit;
}


/** MENU BUTTON HOVER STATES **/

.menubutton {
	fill: #000;
}
.menubutton:hover > svg {
	background: #000;
}
.menubutton:hover #line1, .menubutton:hover #line2, .menubutton:hover #line3 {
	fill: #fff;
}
.about .menubutton {
	fill: #FF4B5C;
}
.about .menubutton:hover > svg {
	background: #FF4B5C;
}
.about .menubutton:hover #line1, .about .menubutton:hover #line2, .about .menubutton:hover #line3 {
	fill: #fff;
}
.clipbox:nth-of-type(2n-1) .menubutton {
	fill: #000;
}
.clipbox:nth-of-type(2n-1) .menubutton:hover > svg {
	background: #000;
}
.clipbox:nth-of-type(2n-1) .menubutton:hover #line1, .clipbox:nth-of-type(2n-1) .menubutton:hover #line2, .clipbox:nth-of-type(2n-1) .menubutton:hover #line3 {
	fill: #fff;
}
.clipbox:nth-of-type(2n) .menubutton {
	fill: #fff;
}
.clipbox:nth-of-type(2n) .menubutton:hover > svg {
	background: #fff;
}
.clipbox:nth-of-type(2n) .menubutton:hover #line1, .clipbox:nth-of-type(2n) .menubutton:hover #line2, .clipbox:nth-of-type(2n) .menubutton:hover #line3 {
	fill: #000;
}


/* HOME HEROES */

.meesemark {
	cursor: pointer;
}

.work footer {
	position: absolute;
	top: 700%;
}

.clipbox:nth-of-type(1) {
	top: 0;
	background-color: #fff;
}

.clipbox:nth-of-type(1) .project {
	width: 100%;
	height: 400px;
	margin-top: -200px;
	position: fixed;
	background: url();
	background-position: center center;
	-moz-background-size: 420px;
	  -o-background-size: 420px;
	     background-size: 420px;
	background-repeat: no-repeat;
	padding: 0;
}
.herologo svg {
	margin-top: -60px;
	max-width: 640px;
	height: auto;
}
.clipbox:nth-of-type(1) > nav {
	z-index: 100;
}

.clipbox:nth-of-type(2) {
	top: 100%;
	background-color: #000;
	color: #fff;
}

.clipbox:nth-of-type(2) > nav svg {
	fill: #fff;
}

.clipbox:nth-of-type(2) > nav {
	z-index: 200;
}
.clipbox:nth-of-type(2) video {
	-o-object-position: center bottom;
	   object-position: center bottom;
}
.clipbox:nth-of-type(2) .projectbutton {
	border-color: #fff;
}
.clipbox:nth-of-type(2) .projectbutton:hover {
	background: #fff;
	color: #000;
	border-color: #fff;
}


.clipbox:nth-of-type(3) {
	top: 200%;
	color: #000;
	background-color: #fff;
}

.clipbox:nth-of-type(3) > nav svg {
	fill: #000;
}

.clipbox:nth-of-type(3) > nav {
	z-index: 300;
}

.clipbox:nth-of-type(3) .projectbutton {
	border-color: #000;
}
.clipbox:nth-of-type(3) .projectbutton:hover {
	background: #000;
	color: #fff;
	border-color: #000;
}

.clipbox:nth-of-type(4) {
	top: 300%;
	background-color: #000;
	color: #fff;
}

.clipbox:nth-of-type(4) > nav svg {
	fill: #fff;
}

.clipbox:nth-of-type(4) > nav {
	z-index: 400;
}

.clipbox:nth-of-type(4) .projectbutton {
	border-color: #fff;
}
.clipbox:nth-of-type(4) .projectbutton:hover {
	background: #fff;
	color: #000;
	border-color: #fff;
}

.clipbox:nth-of-type(5) {
	top: 400%;
	background-color: #fff;
	background-position: center top;
	background-image: url(bg-wabbit2.jpg);
	color: #000;
}

.clipbox:nth-of-type(5) > nav svg {
	fill: #000;
}

.clipbox:nth-of-type(5) > nav {
	z-index: 500;
}
.clipbox:nth-of-type(5) .projectbutton {
	border-color: #000;
}
.clipbox:nth-of-type(5) .projectbutton:hover {
	background: #000;
	color: #fff;
}

.clipbox:nth-of-type(6) {
	top: 500%;
	background-color: #fff;
	background-image: url(bg-aviation.jpg);
	color: #fff;
}

.clipbox:nth-of-type(6) > nav svg {
	fill: #fff;
}

.clipbox:nth-of-type(6) > nav {
	z-index: 600;
}
.clipbox:nth-of-type(6) .projectbutton {
	border-color: #fff;
}
.clipbox:nth-of-type(6) .projectbutton:hover {
	background: #fff;
	color: #000;
}

.clipbox:nth-of-type(7) {
	top: 600%;
	background-color: #fff;
	background-image: url(archive-bg.jpg);
	color: #000;
}

.clipbox:nth-of-type(7) > nav svg {
	fill: #000;
}

.clipbox:nth-of-type(7) > nav {
	z-index: 700;
}
.clipbox:nth-of-type(7) .projectbutton {
	border-color: #000;
}
.clipbox:nth-of-type(7) .projectbutton:hover {
	background: #000;
	color: #fff;
}

.art, .toyota, .aviation,.schmopera,.about,.archive,.tappersgame {
	width: 100%;
	position: absolute;
	z-index: 150;
}

.art nav, .toyota nav, .aviation nav,.schmopera nav,.about nav,.archive nav, .tappersgame nav {
	position: fixed;
	color: #000;
	background-color: rgba(255,255,255,0.8);
	z-index: 200;
	fill: #000;
}

.art section:nth-of-type(1), .toyota section:nth-of-type(1), .tappersgame section:nth-of-type(1), .aviation section:nth-of-type(1),.about section:nth-of-type(1),.schmopera section:nth-of-type(1),.archive section:nth-of-type(1) {
	position: relative;
	width: 100%;
	margin-top: -90px;
	padding-top: 90px;
	min-height: 400px;
	background-position: center center;
	background-repeat: no-repeat;
	-moz-background-size: cover;
	  -o-background-size: cover;
	     background-size: cover;
	z-index: 100;
}

.artwork {
	width:auto;
	padding: 9px;
	position:relative;
	display: -webkit-box;
	display: -webkit-flex;
	display: -moz-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: horizontal;
	-webkit-box-direction: normal;
	-webkit-flex-direction: row;
	   -moz-box-orient: horizontal;
	   -moz-box-direction: normal;
	    -ms-flex-direction: row;
	        flex-direction: row;
	-webkit-flex-wrap: wrap;
	    -ms-flex-wrap: wrap;
	        flex-wrap: wrap;
	-webkit-box-pack: start;
	-webkit-justify-content: flex-start;
	   -moz-box-pack: start;
	    -ms-flex-pack: start;
	        justify-content: flex-start;
	background-color: inherit;
}
.artwork-item {
	display:inline-block;
  	width: 100%;
	height:auto;
	padding: 9px;
	overflow: hidden;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}

.artwork img {
	width: 100%;
	height: auto;
}
.artvid {
	width: 100%;
	height: 100%;
	overflow: hidden;
	padding: 0; margin: 0;
}
.autodidactivity .artwork-item video {
	width: 100%;
	height: 100%;
	-webkit-transform: scale(1.5,1.5);
	   -moz-transform: scale(1.5,1.5);
	    -ms-transform: scale(1.5,1.5);
	     -o-transform: scale(1.5,1.5);
	        transform: scale(1.5,1.5);
}
.artwork-item video {
	width: 100%;
	height: auto;
	-webkit-transform: scale(1.5,1.5);
	   -moz-transform: scale(1.5,1.5);
	    -ms-transform: scale(1.5,1.5);
	     -o-transform: scale(1.5,1.5);
	        transform: scale(1.5,1.5);
}


/* ABOUT */

.about section:nth-of-type(1) {
	color: #FF4B5C;
	background: #fff;
}

.about > nav svg {
	fill: #FF4B5C;
}


/* ART */

.art section:nth-of-type(1) {
	color: #fff;
	background: #FF4B5C;
	#background-image: url(bg2-blurred.jpg);
}
.art .links {
	border-color: #fff;
}
.art .links:hover {
	background: #fff;
	color: #000;
}

/* TOYOTA */

.toyota section:nth-of-type(1) {
	color: #fff;
	background: #1f1e2e;
	#background-image: url(toyota-bg-blurred.jpg);
}

.toyota .links {
	border-color: #fff;
}
.toyota .links:hover {
	background: #fff;
	color: #000;
}
.toyota-interactive {
	margin-top: 108px;
	margin-bottom: 72px;
	
}
.toyota-interactive .note {
	margin: auto;
	text-align: center;
	color: #666;
	width: 300px;
	padding-top: 24px;
}
.toyota .artworks img {
	width: auto;
	height: auto;
	display:inline-block;
}

/* TAPPERS */
.tappersgame > nav {
	
}
.tappersgame section:nth-of-type(1) {
	color: #f00;
	#background: #ffaa55;
	background: #eee;
}

.tappersgame .links {
	border-color: #ffaa55;
}
.tappersgame .links:hover {
	background: #ffaa55;
	color: #000;
}
.tappers-interactive {
	margin-top: 108px;
	margin-bottom: 72px;
	
}
.tappersgame .artworks img {
	width: auto;
	height: auto;
	display:inline-block;
}
.tappersgame .artwork-item video {
	width: 100%;
	height: auto;
}
.tappersgame .artwork-item video {
	width: 100%;
	height: auto;
	-webkit-transform: scale(1,1);
	   -moz-transform: scale(1,1);
	    -ms-transform: scale(1,1);
	     -o-transform: scale(1,1);
	        transform: scale(1,1);
}
/*
.tappersgame > .artwork-item:nth-of-type(1) {
	overflow: hidden:
} */

/* AVIATION */

.aviation section:nth-of-type(1) {
	color: #fff;
	background: #83afeb;
	#background-image: url(bg-aviation-blurred.jpg);
}

.aviation .links {
	border-color: #fff;
}
.aviation .links:hover {
	background: #fff;
	color: #000;
}
.aviationlogo {
	max-height: 288px;
	width: 100%;
	background-color: #fff;
	text-align: center;
	margin-bottom: -18px;
}

.aviationlogo img {
	height: auto;
	max-height: 288px;
	max-width: 100%;
	opacity: .8;
	filter: alpha(opacity=80);
}


/* SCHMOPERA */

.schmopera section:nth-of-type(1) {
	color: #fff;
	background-position: center top;
	background: #02a8e0;
	#background-image: url(bg-wabbit-blurred.jpg);
}

.schmopera .links {
	border-color: #fff;
}
.schmopera .links:hover {
	background: #fff;
	color: #000;
}


/* ARCHIVE */
.archive {
	background: #efefef;
}
.archive-items {
	padding: 18px;
	margin-left: auto;
	margin-right: auto;
	max-width: 476px;
	padding-bottom: 72px;
}
.archive h2 {
	margin-top: 108px;
	font-size: 30px;
	font-weight: regular;
	line-height: 24px;
}
.archive-items img {
	width: 100%;
	height: auto;
	background-color: #000;
	margin-top: 108px;
	margin-bottom: 12px;
}
.archive-items > .container {
	width: 100%;
	height: auto;
	text-align: center;
	background: #059;
	margin-top: 108px;
	margin-bottom: 12px;
	padding-top: 108px;
	padding-bottom: 108px;
}
.archive p {
	width: 100%;
	font-size: 12pt;
	line-height: 12px;
}
.archive p > span {
	width: auto;
	float: right;
}
.archive p > span:nth-of-type(2) {
	float: left;
}
.logoAnimated {
	max-width: 72px;
	margin: 18px;
	fill: #eee;
}

.logoAnimated rect{
	fill: #eee;
}
.logoAnimated polyline {
	fill: #059;
}

.logoAnimated polyline:nth-of-type(1) {
	opacity: 0;
	-webkit-transform: translateY(270%);
	   -moz-transform: translateY(270%);
	    -ms-transform: translateY(270%);
	     -o-transform: translateY(270%);
	        transform: translateY(270%);
	-webkit-animation: barUp 2s ease;
	   -moz-animation: barUp 2s ease;
	     -o-animation: barUp 2s ease;
	        animation: barUp 2s ease;
  -webkit-animation-fill-mode: forwards;
     -moz-animation-fill-mode: forwards;
       -o-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
	-webkit-animation-delay: 1s;
	   -moz-animation-delay: 1s;
	     -o-animation-delay: 1s;
	        animation-delay: 1s;
}

.logoAnimated polyline:nth-of-type(2) {
	-webkit-transform: translateY(130%);
	   -moz-transform: translateY(130%);
	    -ms-transform: translateY(130%);
	     -o-transform: translateY(130%);
	        transform: translateY(130%);
	-webkit-animation: topArrowUp 2s ease;
	   -moz-animation: topArrowUp 2s ease;
	     -o-animation: topArrowUp 2s ease;
	        animation: topArrowUp 2s ease;
  -webkit-animation-fill-mode: forwards;
     -moz-animation-fill-mode: forwards;
       -o-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
	-webkit-animation-delay: 1s;
	   -moz-animation-delay: 1s;
	     -o-animation-delay: 1s;
	        animation-delay: 1s;
}
.logoAnimated polyline:nth-of-type(3) {
	-webkit-transform: translateY(130%);
	   -moz-transform: translateY(130%);
	    -ms-transform: translateY(130%);
	     -o-transform: translateY(130%);
	        transform: translateY(130%);
	-webkit-animation: bottomArrowUp 0.5s ease;
	   -moz-animation: bottomArrowUp 0.5s ease;
	     -o-animation: bottomArrowUp 0.5s ease;
	        animation: bottomArrowUp 0.5s ease;
  -webkit-animation-fill-mode: forwards;
     -moz-animation-fill-mode: forwards;
       -o-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
	-webkit-animation-delay: 2.5s;
	   -moz-animation-delay: 2.5s;
	     -o-animation-delay: 2.5s;
	        animation-delay: 2.5s;
}

@-webkit-keyframes barUp {
  0% {
		opacity: 0;
  }
	25% {
		opacity: 1;
	}
	20% {
		-webkit-transform: translateY(285%);
		        transform: translateY(285%);
  }
	30% {
		-webkit-transform: translateY(270%);
		        transform: translateY(270%);
  }
	40% {
		-webkit-transform: translateY(300%);
		        transform: translateY(300%);
  }
  100% {
    -webkit-transform: translateY(0%);
            transform: translateY(0%);
		opacity: 1;
  }
}

@-moz-keyframes barUp {
  0% {
		opacity: 0;
  }
	25% {
		opacity: 1;
	}
	20% {
		-moz-transform: translateY(285%);
		     transform: translateY(285%);
  }
	30% {
		-moz-transform: translateY(270%);
		     transform: translateY(270%);
  }
	40% {
		-moz-transform: translateY(300%);
		     transform: translateY(300%);
  }
  100% {
    -moz-transform: translateY(0%);
         transform: translateY(0%);
		opacity: 1;
  }
}

@-o-keyframes barUp {
  0% {
		opacity: 0;
  }
	25% {
		opacity: 1;
	}
	20% {
		-o-transform: translateY(285%);
		   transform: translateY(285%);
  }
	30% {
		-o-transform: translateY(270%);
		   transform: translateY(270%);
  }
	40% {
		-o-transform: translateY(300%);
		   transform: translateY(300%);
  }
  100% {
    -o-transform: translateY(0%);
       transform: translateY(0%);
		opacity: 1;
  }
}

@keyframes barUp {
  0% {
		opacity: 0;
  }
	25% {
		opacity: 1;
	}
	20% {
		-webkit-transform: translateY(285%);
		   -moz-transform: translateY(285%);
		     -o-transform: translateY(285%);
		        transform: translateY(285%);
  }
	30% {
		-webkit-transform: translateY(270%);
		   -moz-transform: translateY(270%);
		     -o-transform: translateY(270%);
		        transform: translateY(270%);
  }
	40% {
		-webkit-transform: translateY(300%);
		   -moz-transform: translateY(300%);
		     -o-transform: translateY(300%);
		        transform: translateY(300%);
  }
  100% {
    -webkit-transform: translateY(0%);
       -moz-transform: translateY(0%);
         -o-transform: translateY(0%);
            transform: translateY(0%);
		opacity: 1;
  }
}
@-webkit-keyframes topArrowUp {
  0% {
		-webkit-transform: translateY(130%);
		        transform: translateY(130%);
  }
	30% {
		-webkit-transform: translateY(-4%);
		        transform: translateY(-4%);
  }
	40% {
    -webkit-transform: translateY(8%);
            transform: translateY(8%);
  }
  100% {
		-webkit-transform: translateY(-87%);
		        transform: translateY(-87%);
  }
}
@-moz-keyframes topArrowUp {
  0% {
		-moz-transform: translateY(130%);
		     transform: translateY(130%);
  }
	30% {
		-moz-transform: translateY(-4%);
		     transform: translateY(-4%);
  }
	40% {
    -moz-transform: translateY(8%);
         transform: translateY(8%);
  }
  100% {
		-moz-transform: translateY(-87%);
		     transform: translateY(-87%);
  }
}
@-o-keyframes topArrowUp {
  0% {
		-o-transform: translateY(130%);
		   transform: translateY(130%);
  }
	30% {
		-o-transform: translateY(-4%);
		   transform: translateY(-4%);
  }
	40% {
    -o-transform: translateY(8%);
       transform: translateY(8%);
  }
  100% {
		-o-transform: translateY(-87%);
		   transform: translateY(-87%);
  }
}
@keyframes topArrowUp {
  0% {
		-webkit-transform: translateY(130%);
		   -moz-transform: translateY(130%);
		     -o-transform: translateY(130%);
		        transform: translateY(130%);
  }
	30% {
		-webkit-transform: translateY(-4%);
		   -moz-transform: translateY(-4%);
		     -o-transform: translateY(-4%);
		        transform: translateY(-4%);
  }
	40% {
    -webkit-transform: translateY(8%);
       -moz-transform: translateY(8%);
         -o-transform: translateY(8%);
            transform: translateY(8%);
  }
  100% {
		-webkit-transform: translateY(-87%);
		   -moz-transform: translateY(-87%);
		     -o-transform: translateY(-87%);
		        transform: translateY(-87%);
  }
}
@-webkit-keyframes bottomArrowUp {
  0% {
		-webkit-transform: translateY(130%);
		        transform: translateY(130%);
  }
  100% {
		-webkit-transform: translateY(0%);
		        transform: translateY(0%);
  }
}
@-moz-keyframes bottomArrowUp {
  0% {
		-moz-transform: translateY(130%);
		     transform: translateY(130%);
  }
  100% {
		-moz-transform: translateY(0%);
		     transform: translateY(0%);
  }
}
@-o-keyframes bottomArrowUp {
  0% {
		-o-transform: translateY(130%);
		   transform: translateY(130%);
  }
  100% {
		-o-transform: translateY(0%);
		   transform: translateY(0%);
  }
}
@keyframes bottomArrowUp {
  0% {
		-webkit-transform: translateY(130%);
		   -moz-transform: translateY(130%);
		     -o-transform: translateY(130%);
		        transform: translateY(130%);
  }
  100% {
		-webkit-transform: translateY(0%);
		   -moz-transform: translateY(0%);
		     -o-transform: translateY(0%);
		        transform: translateY(0%);
  }
}