@import url(http://fonts.googleapis.com/css?family=Roboto:400,700,300,100);
.cf:before,.cf:after {
	content:" ";
	display:table
}
.cf:after {
	clear:both
}
.animated {
	-webkit-animation-fill-mode:both;
	-moz-animation-fill-mode:both;
	-ms-animation-fill-mode:both;
	-o-animation-fill-mode:both;
	animation-fill-mode:both;
	-webkit-animation-duration:1s;
	-moz-animation-duration:1s;
	-ms-animation-duration:1s;
	-o-animation-duration:1s;
	animation-duration:1s
}
.animated-slow {
	-webkit-animation-fill-mode:both;
	-moz-animation-fill-mode:both;
	-ms-animation-fill-mode:both;
	-o-animation-fill-mode:both;
	animation-fill-mode:both;
	-webkit-animation-duration:1.5s;
	-moz-animation-duration:1.5s;
	-ms-animation-duration:1.5s;
	-o-animation-duration:1.5s;
	animation-duration:1.5s;
	animation-delay:200ms;
	-moz-animation-delay:200ms;
	-webkit-animation-delay:200ms
}
.animated.hinge {
	-webkit-animation-duration:1s;
	-moz-animation-duration:1s;
	-ms-animation-duration:1s;
	-o-animation-duration:1s;
	animation-duration:1s
}
@-webkit-keyframes fadeIn {
	0% {
		opacity:0
	}
	100% {
		opacity:1
	}
}
@-moz-keyframes fadeIn {
	0% {
		opacity:0
	}
	100% {
		opacity:1
	}
}
@-o-keyframes fadeIn {
	0% {
		opacity:0
	}
	100% {
		opacity:1
	}
}
@keyframes fadeIn {
	0% {
		opacity:0
	}
	100% {
		opacity:1
	}
}
.fadeIn {
	-webkit-animation-name:fadeIn;
	-moz-animation-name:fadeIn;
	-o-animation-name:fadeIn;
	animation-name:fadeIn
}
.delay-0 {
	animation-delay:0ms;
	-moz-animation-delay:0ms;
	-webkit-animation-delay:0ms
}
.delay-1 {
	animation-delay:500ms;
	-moz-animation-delay:500ms;
	-webkit-animation-delay:500ms
}
.delay-2 {
	animation-delay:1000ms;
	-moz-animation-delay:1000ms;
	-webkit-animation-delay:1000ms
}
.delay-3 {
	animation-delay:1500ms;
	-moz-animation-delay:1500ms;
	-webkit-animation-delay:1500ms
}
.delay-4 {
	animation-delay:2000ms;
	-moz-animation-delay:2000ms;
	-webkit-animation-delay:2000ms
}
.delay-5 {
	animation-delay:2500ms;
	-moz-animation-delay:2500ms;
	-webkit-animation-delay:2500ms
}
.delay-6 {
	animation-delay:3000ms;
	-moz-animation-delay:3000ms;
	-webkit-animation-delay:3000ms
}
.delay-7 {
	animation-delay:3500ms;
	-moz-animation-delay:3500ms;
	-webkit-animation-delay:3500ms
}
.delay-8 {
	animation-delay:4000ms;
	-moz-animation-delay:4000ms;
	-webkit-animation-delay:4000ms
}
.delay-9 {
	animation-delay:4500ms;
	-moz-animation-delay:4500ms;
	-webkit-animation-delay:4500ms
}
.delay-10 {
	animation-delay:5000ms;
	-moz-animation-delay:5000ms;
	-webkit-animation-delay:5000ms
}
.delay-11 {
	animation-delay:5500ms;
	-moz-animation-delay:5500ms;
	-webkit-animation-delay:5500ms
}
.delay-12 {
	animation-delay:6000ms;
	-moz-animation-delay:6000ms;
	-webkit-animation-delay:6000ms
}
.delay-13 {
	animation-delay:6500ms;
	-moz-animation-delay:6500ms;
	-webkit-animation-delay:6500ms
}
.delay-14 {
	animation-delay:7000ms;
	-moz-animation-delay:7000ms;
	-webkit-animation-delay:7000ms
}
.delay-15 {
	animation-delay:7500ms;
	-moz-animation-delay:7500ms;
	-webkit-animation-delay:7500ms
}
.delay-16 {
	animation-delay:8000ms;
	-moz-animation-delay:8000ms;
	-webkit-animation-delay:8000ms
}
.delay-17 {
	animation-delay:8500ms;
	-moz-animation-delay:8500ms;
	-webkit-animation-delay:8500ms
}
.delay-18 {
	animation-delay:9000ms;
	-moz-animation-delay:9000ms;
	-webkit-animation-delay:9000ms
}
.delay-19 {
	animation-delay:9500ms;
	-moz-animation-delay:9500ms;
	-webkit-animation-delay:9500ms
}
@-webkit-keyframes fadeInUp {
	0% {
		opacity:0;
		-webkit-transform:translateY(40px)
	}
	100% {
		opacity:1;
		-webkit-transform:translateY(0)
	}
}
@-moz-keyframes fadeInUp {
	0% {
		opacity:0;
		-moz-transform:translateY(40px)
	}
	100% {
		opacity:1;
		-moz-transform:translateY(0)
	}
}
@-o-keyframes fadeInUp {
	0% {
		opacity:0;
		-o-transform:translateY(40px)
	}
	100% {
		opacity:1;
		-o-transform:translateY(0)
	}
}
@keyframes fadeInUp {
	0% {
		opacity:0;
		transform:translateY(40px)
	}
	100% {
		opacity:1;
		transform:translateY(0)
	}
}
.fadeInUp {
	-webkit-animation-name:fadeInUp;
	-moz-animation-name:fadeInUp;
	-o-animation-name:fadeInUp;
	animation-name:fadeInUp
}
@keyframes bounceAround {
	0%,20%,50%,80%,100% {
		-webkit-transform:translateY(0);
		-ms-transform:translateY(0);
		transform:translateY(0)
	}
	40% {
		-webkit-transform:translateY(-10px);
		-ms-transform:translateY(-10px);
		transform:translateY(-10px)
	}
	60% {
		-webkit-transform:translateY(0);
		-ms-transform:translateY(0);
		transform:translateY(0)
	}
}
@-webkit-keyframes bounceAround {
	0% {
		-webkit-transform:translateY(0);
		-ms-transform:translateY(0);
		transform:translateY(0)
	}
	50% {
		-webkit-transform:translateY(-10px);
		-ms-transform:translateY(-10px);
		transform:translateY(-10px)
	}
	100% {
		-webkit-transform:translateY(0);
		-ms-transform:translateY(0);
		transform:translateY(0)
	}
}
@-moz-keyframes bounceAround {
	0% {
		-webkit-transform:translateY(0);
		-ms-transform:translateY(0);
		transform:translateY(0)
	}
	50% {
		-webkit-transform:translateY(-10px);
		-ms-transform:translateY(-10px);
		transform:translateY(-10px)
	}
	100% {
		-webkit-transform:translateY(0);
		-ms-transform:translateY(0);
		transform:translateY(0)
	}
}
@-o-keyframes bounceAround {
	0% {
		-webkit-transform:translateY(0);
		-ms-transform:translateY(0);
		transform:translateY(0)
	}
	50% {
		-webkit-transform:translateY(-10px);
		-ms-transform:translateY(-10px);
		transform:translateY(-10px)
	}
	100% {
		-webkit-transform:translateY(0);
		-ms-transform:translateY(0);
		transform:translateY(0)
	}
}
@keyframes bounceAround {
	0% {
		-webkit-transform:translateY(0);
		-ms-transform:translateY(0);
		transform:translateY(0)
	}
	50% {
		-webkit-transform:translateY(-10px);
		-ms-transform:translateY(-10px);
		transform:translateY(-10px)
	}
	100% {
		-webkit-transform:translateY(0);
		-ms-transform:translateY(0);
		transform:translateY(0)
	}
}
.bounceAround {
	-webkit-animation-name:bounceAround;
	-moz-animation-name:bounceAround;
	-o-animation-name:bounceAround;
	animation-name:bounceAround;
	animation-iteration-count:infinite;
	-webkit-animation-iteration-count:infinite;
	-webkit-animation-duration:3s;
	-moz-animation-duration:3s;
	-ms-animation-duration:3s;
	-o-animation-duration:3s;
	animation-duration:3s;
	-webkit-animation-fill-mode:both;
	-moz-animation-fill-mode:both;
	-ms-animation-fill-mode:both;
	-o-animation-fill-mode:both;
	animation-fill-mode:both
}
@-webkit-keyframes fadeOutDown {
	0% {
		opacity:1;
		-webkit-transform:translateY(0);
		transform:translateY(0)
	}
	100% {
		opacity:0;
		-webkit-transform:translateY(20px);
		transform:translateY(20px);
		height:0
	}
}
@keyframes fadeOutDown {
	0% {
		opacity:1;
		-webkit-transform:translateY(0);
		-ms-transform:translateY(0);
		transform:translateY(0)
	}
	100% {
		opacity:0;
		-webkit-transform:translateY(20px);
		-ms-transform:translateY(20px);
		transform:translateY(20px);
		height:0
	}
}
.fadeOutDown {
	-webkit-animation-name:fadeOutDown;
	animation-name:fadeOutDown
}
@-webkit-keyframes fadeInDown {
	0% {
		opacity:0;
		-webkit-transform:translateY(-20px);
		transform:translateY(-20px)
	}
	100% {
		opacity:1;
		-webkit-transform:translateY(0);
		transform:translateY(0)
	}
}
@keyframes fadeInDown {
	0% {
		opacity:0;
		-webkit-transform:translateY(-20px);
		-ms-transform:translateY(-20px);
		transform:translateY(-20px)
	}
	100% {
		opacity:1;
		-webkit-transform:translateY(0);
		-ms-transform:translateY(0);
		transform:translateY(0)
	}
}
.fadeInDown {
	-webkit-animation-name:fadeInDown;
	animation-name:fadeInDown
}
@-webkit-keyframes fadeInDownBig {
	0% {
		opacity:0;
		-webkit-transform:translateY(-2000px);
		transform:translateY(-2000px)
	}
	100% {
		opacity:1;
		-webkit-transform:translateY(0);
		transform:translateY(0)
	}
}
h1,.h1 {
	font-weight:100;
	text-transform:uppercase;
	letter-spacing:3px;
	border:solid 1px #fff;
	display:inline-block;
	padding:10px 14px;
	font-size:20px
}
h1.dark,.h1.dark {
	color:#222;
	border:solid 1px #222
}
@media (min-width:768px) {
	h1,.h1 {
		font-size:36px;
		padding:15px 20px
	}
}
h2,.h2 {
	font-size:14px;
	letter-spacing:1px;
	text-transform:uppercase;
	font-weight:100;
	margin:10px 0;
	text-align:center
}
h2.dark,.h2.dark {
	color:#222
}
@media (min-width:768px) {
	h2,.h2 {
		font-size:18px
	}
}
h3,.h3 {
	margin:0 0 20px 0;
	text-transform:uppercase;
	letter-spacing:1px;
	font-size:18px;
	color:#222
}
@media (min-width:768px) {
	h3,.h3 {
		font-size:20px
	}
}
@media (min-width:768px) {
	.project h1,.project .h1 {
		font-size:30px
	}
}
@media (min-width:768px) {
	.project h2,.project .h2 {
		font-size:15px
	}
}
@media (min-width:768px) {
	.project h3,.project .h3 {
		font-size:18px
	}
}
a {
	color:#111;
	border-bottom:solid 2px;
	text-transform:uppercase;
	font-size:11px;
	font-weight:600;
	text-decoration:none;
	transition:all 0.6s
}
a:hover,a:focus {
	text-decoration:none;
	color:#000
}
@media (min-width:992px) {
	.text-3-columns {
		-webkit-column-count:3;
		-moz-column-count:3;
		column-count:3
	}
}
@media (min-width:992px) {
	.text-2-columns {
		-webkit-column-count:2;
		-moz-column-count:2;
		column-count:2
	}
}
blockquote {
	margin-top:20px;
	margin-bottom:0
}
.text-right {
	text-align:right
}
.quote-caption {
	margin:0 0 20px 0
}
.long-form {
	font-size:16px
}
.preloader-container {
	position:absolute;
	top:0;
	right:0;
	left:0;
	bottom:0;
	background:#000;
	z-index:10
}
.stop-scrolling {
	height:100%;
	overflow:hidden
}
.preloader {
	position:absolute;
	top:50%;
	left:50%;
	transform:translate(-50%,-50%)
}
.preloader span {
	display:block;
	bottom:0px;
	width:9px;
	height:5px;
	background:#fafafa;
	position:absolute;
	animation:preloaderAnim 1.5s infinite ease-in-out;
	-webkit-animation:preloaderAnim 1.5s infinite ease-in-out
}
.preloader span:nth-child(2) {
	left:11px;
	animation-delay:.2s;
	-webkit-animation-delay:0.2s
}
.preloader span:nth-child(3) {
	left:22px;
	animation-delay:.4s;
	-webkit-animation-delay:0.4s
}
.preloader span:nth-child(4) {
	left:33px;
	animation-delay:.6s;
	-webkit-animation-delay:0.6s
}
.preloader span:nth-child(5) {
	left:44px;
	animation-delay:.8s;
	-webkit-animation-delay:0.8s
}
@keyframes preloaderAnim {
	0% {
		height:5px;
		transform:translateY(0px);
		background:#fff
	}
	25% {
		height:30px;
		transform:translateY(15px);
		background:#f6f6f6
	}
	50% {
		height:5px;
		transform:translateY(0px);
		background:#fff
	}
	100% {
		height:5px;
		transform:translateY(0px);
		background:#fff
	}
}
@-webkit-keyframes preloaderAnim {
	0% {
		height:5px;
		transform:translateY(0px);
		background:#fff
	}
	25% {
		height:30px;
		transform:translateY(15px);
		background:#f6f6f6
	}
	50% {
		height:5px;
		transform:translateY(0px);
		background:#fff
	}
	100% {
		height:5px;
		transform:translateY(0px);
		background:#fff
	}
}
html {
	font-size:62.5%
}
body {
	background:#000;
	font-family:"Roboto","franklin-gothic-urw",gothic,sans-serif;
	color:#fff;
	font-weight:400
}
img {
	max-width:100%
}
header {
	height:500px;
	padding:180px 0 0 0;
	text-align:center;
	position:relative
}
.project-video {
	height:350px;
	text-align:center;
	padding:80px 0 0 0;
	position:relative
}
.project-video span {
	text-transform:uppercase;
	letter-spacing:2px;
	font-weight:100;
	padding:0 0 3px 0;
	border-bottom:solid 1px #fff;
	position:absolute;
	bottom:15px;
	left:50%;
	transform:translatex(-50%);
	cursor:pointer
}
.overlay {
	height:100%;
	width:100%;
	position:absolute;
	top:0;
	left:0;
	z-index:-1;
	background-color:rgba(0,0,0,0.58);
	background-image:_deprecated-webkit-gradient(linear,left top,left bottom,rgba(0,0,0,0.58) 0%,transparent 35%,transparent 75%,rgba(0,0,0,0.58) 100%);
	background-image:-webkit-linear-gradient(rgba(0,0,0,0.58) 0%,transparent 35%,transparent 75%,rgba(0,0,0,0.58) 100%);
	background-image:linear-gradient(rgba(0,0,0,0.58) 0%,transparent 35%,transparent 75%,rgba(0,0,0,0.58) 100%)
}
.project-content {
	background:#fafafa;
	color:#222;
	display:none;
	padding-top:50px;
	padding-bottom:50px;
	z-index:1;
	position:relative
}
.content-title {
	margin-bottom:30px
}
.content-image {
	margin-top:10px;
	margin-bottom:20px
}
.portfolio-image {
	margin-bottom:40px
}
.close {
	position:absolute;
	top:0;
	right:0;
	line-height:50px;
	font-size:40px;
	display:block;
	width:50px;
	text-align:center
}
@media (min-width:992px) {
	section:nth-of-type(even) .project-content {
		transform:translatex(-50%)
	}
	section {
		width:50%;
		float:left
	}
	.spacer {
		float:left;
		width: 50%
	}
}