* {
	border: none;
	outline: none;
	margin: 0px;
	padding: 0px;
}

html, body {
	width: 100%;
	height: 100%;
}

.wf-loading h1, .wf-loading h2, .wf-loading h3, .wf-loading p, .wf-loading ul, .wf-loading span, .wf-loading .moodlink, .wf-loading a {
	opacity: 0;
}

.wf-active h1, .wf-active h2, .wf-active h3, .wf-active p, .wf-active ul, .wf-active span, .wf-active .moodlink, .wf-active a {
	opacity: 1;
}

body {
	font-family: "nimbus-roman",sans-serif;
	font-style: normal;
	font-weight: 400;
    font-size: 12px;
	color: #000;
	-webkit-font-smoothing: antialiased;
	overflow-y: scroll;
}

body.home {
	overflow: hidden;
}

.desktopOnly {
	display: block;
}

.mobileOnly {
	display: none;
}

h1, h2, h3, h4, h5, h6 {
	font-weight: 700;
}

a {
	color: inherit;
	text-decoration: none;
	transition: color .15s;
}

a:link, a:visited {

}

/*
.no-touchevents a:hover, .no-touchevents a:active {
    color: #252525;
    transition: color .15s;
}
*/

.addb4:before {
	width: 0px;
	height: 100%;
	content: '';
	display: inline-block;
	*display: inline;
	zoom: 1;
	vertical-align: middle;
	margin-right: -4px;
}

.v-middle 	{ display: inline-block; *display: inline; zoom: 1; vertical-align: middle; }
.v-top 		{ display: inline-block; *display: inline; zoom: 1; vertical-align: top; 	}
.v-bottom 	{ display: inline-block; *display: inline; zoom: 1; vertical-align: bottom; }
.v-baseline { display: inline-block; *display: inline; zoom: 1; vertical-align: baseline; }

.centerMe {
	display: inline-block;
	*display: inline;
	zoom: 1;
	vertical-align: middle;
}

.clear { clear: both; }
.left { float: left; }
.right { float: right; }

.bgcover {
	background-size: cover;
	background-position: 50% 50%;
}

.mobileOnly {
	display: none;
}

.hidden {
	display: none;
}

#wrapper {
	width: 100%;
	min-height: 100%;
	padding-top: 0px;
}

#content {
	width: 100%;
	min-height: 100%;
}

	.splash #content #fullpage {
		opacity: 0;
	}

	#content .section {
		width: 100%;
		text-align: center;
		position: relative;
	}
	

/* ============== */
/* === Header === */
/* ============== */

#header {
	width: 100%;
	text-align: center;
	z-index: 300;
	position: fixed;
	top: 23px;
	left: 0px;
	z-index: 400;
	background-color: transparent;
	cursor: default;
	backface-visibility: hidden;
	-webkit-backface-visibility: hidden;
	opacity: 0;	

	transition: all .3s;
}

	#header .inner .moodlink {
		position: absolute;
		top: 23px;
		right: 20px;
		color: #fff;
		font-family: "nimbus-sans-extended", sans-serif;
		letter-spacing: .03em;
		text-transform: uppercase;
		font-weight: 400;
		font-size: 11px;
		z-index: 500;
		opacity: 0;
		
		transition: all .3s;
	}
	
	.lightbox #header .inner .moodlink {
		opacity: 1;
		color: #000;
	}
	
	.navOpen #header .inner .moodlink {
		opacity: 1;
		top: 0px;
	}
	
	.navOpen.lightbox #header .inner .moodlink {
		top: 23px;
	}
	
	.grid.story #header .inner .moodlink {
		color: #000;
		opacity: 1;
	}
	
	.grid.story #header .inner .moodlink:hover {
		opacity: .3;
	}
	
	.grid.scrollDown #header .inner .moodlink {
		color: #fff;
	}

	.scroll #header, .story #header, .slideshow #header, .grid #header {
		opacity: 1 !important;
	}

	.navOpen #header {
		opacity: 1 !important;
		background-color: transparent !important;
	}

	#header .inner {
		width: 100%;
		height: 100%;
		text-align: center;
		position: relative;
		font-family: "nimbus-sans", sans-serif;
		color: #fff;

		transition: color .2s linear 0s;
	}
	
	.dark #header .inner {
		color: #000;
		transition: color .2s linear .5s;
	}
	
	
#header .trigger {
    z-index: 310;
    cursor: pointer;
    font-size: 11px;
    font-family: "nimbus-sans-extended", sans-serif;
    letter-spacing: .03em;
    position: absolute;
    top: -15px;
    left: 50%;
    margin-left: -30px;
    padding: 15px;
}

.grid.masonry #header .trigger {
    position: absolute;
    top: 8px;
    color: #000;
}

/*
.slideshow #header .trigger {
	position: absolute;
	left: 50%;
	-webkit-transform: translateX(-50%);
		-ms-transform: translateX(-50%);
			transform: translateX(-50%);
}


	#header .trigger a {
		position: relative;
	}
	
*/

		#header .trigger img {
			position: absolute;
			top: 0px;
			left: 0px;
			display: block;
			width: 31px;
			padding: 15px;
			height: auto;
		    margin: -7px auto 0px;
		    opacity: 1;
		    transition: opacity .3s;
		}

		#header .trigger img:nth-child(2),
		#header .trigger img:nth-child(3) {
			display: none;
		}

	#header .trigger .menuButton {
		width: 100%;
	}

		#header .trigger .menuButton .line {
			position: relative;
			top: 0px;
			right: 0px;
			display: block;
			width: 100%;
			height: 1px;
			margin-bottom: 10px;
			background-color: #000;
			transition: all .3s;
			-webkit-transition: all .3s;
			-moz-transition: all .3s;
			-o-transition: all .3s;
		}
		
		.home #header .trigger .menuButton .line, .project #header .trigger .menuButton .line, .scroll #header .trigger .menuButton .line {
			background-color: #fff;
		}
		
		.home.fp-viewing-0 #header .trigger .menuButton .line, .bioOpen #header .trigger .menuButton .line {
			background-color: #000 !important;
		}
		
		.home.scroller.fp-viewing-0 #header .trigger .menuButton .line {
			background-color: #fff !important;
		}
		
		/*
		#header .trigger .menuButton:hover .line:first-child {
			top: -3px;
		}
		
		#header .trigger .menuButton:hover .line:last-child {
			top: 3px;
		}
		*/

		#header .trigger .menuButton .line:last-child {
			margin-bottom: 0px;
		}

		/*3 lines --> X animation*/
		.navOpen #header .menuButton .line:first-child {
			transform: rotate(45deg);
			-webkit-transform: rotate(45deg);
			-moz-transform: rotate(45deg);
			-ms-transform: rotate(45deg);
			top: 7px;
		}

		.navOpen #header .menuButton .line:nth-child(2) {
			opacity: 0;
		}

		.navOpen #header .menuButton .line:last-child {
			transform: rotate(-45deg);
			-webkit-transform: rotate(-45deg);
			-moz-transform: rotate(-45deg);
			-ms-transform: rotate(-45deg);
			top: -15px;
		}

/* ============== */
/* === Footer === */
/* ============== */

#footer {
	width: 100%;
	height: 366px;
	background-color: #1B1B1B;
	color: #fff;
	font-size: 10px;
    letter-spacing: .08em;
	cursor: default;
	position: relative;
	z-index: 200;
}

	#footer .topmark {
		width: 94px;
		position: absolute;
		top: -49px;
		left: 50%;
		
		transform: translateX(-50%);
		-webkit-transform: translateX(-50%);
		-moz-transform: translateX(-50%);
		-o-transform: translateX(-50%);
	}

	#footer .inner {
		padding-top: 25px;
		text-align: center;
	}
	
	#footer .inner .credit {
		font-size: 120%;
	}
	
	#footer .inner .mark {
		width: 110px;
		padding-top: 50px;
	}
	
	#footer .inner ul.social {
		list-style-type: none;
		margin-top: 60px;
		margin-bottom: 25px;
	}
	
		#footer .inner ul.social li {
			height: 28px;
			margin-right: 15px;
		}
		
		#footer .inner ul.social li:last-child {
			margin-right: 0px;
		}
		
		#footer .inner ul.social li svg {
			height: 100%;
			color: #fff;
			fill: #fff;
		}
			
	
/* ============== */
/* === Loader === */
/* ============== */

#loader {
	position: fixed;
	top: 0%;
	left: 0%;
	background-color: #000;
	width: 100%;
	height: 100%;
	z-index: 600;
}

	#loader h1 {
		width: 90%;
		margin: auto;
	}
	
/* ============== */
/* === Lightbox Page === */
/* ============== */

.lightbox .lbTools {
	list-style-type: none;
	position: fixed;
	top: 20px;
	left: 2%;
	z-index: 500;
	opacity: 1;

	transition: opacity .3s;
}

.lightbox h1.mbintro {
	display: block;
	margin: 60px auto 30px auto;
	text-align: center;
	font-size: 300%;
	font-weight: 400;
}

.lightbox .lbTools li {
	font-family: "nimbus-sans-extended", sans-serif;
    letter-spacing: .03em;
    text-transform: uppercase;
    font-weight: 400;
	margin-right: 15px;
	cursor: pointer;
	font-size: 11px;
	
	transition: all .3s;
}

.lightbox .lbTools li:hover {
	opacity: .3;
}
	

/* ============== */
/* === HOMEPAGE === */
/* ============== */

h1.logoName {
    position: fixed;
    bottom: 44%;
    left: 0%;
    width: 100%;
    text-align: center;
    z-index: 601;
    font-weight: 400;
    color: #fff;
	font-size: 96px;
    font-size: 6.7vw;
    /*letter-spacing: -.02em;*/
    letter-spacing: -2px;
    line-height: 1;
    -webkit-backface-visibility: hidden;
    		backface-visibility: hidden;

    transition: bottom 1s ease .2s, font-size 1s ease 0s, opacity 1s, color .2s linear 0s;
}

.moveLogo h1.logoName {
	bottom: 20px;
	font-size: 33px;
	font-size: 2.3vw;
}

.scroll h1.logoName,
.story h1.logoName,
.slideshow h1.logoName {
	bottom: 20px !important;
	font-size: 33px !important;
	font-size: 2.3vw !important;
}

.grid.masonry h1.logoName {
	z-index: 100;
	bottom: 0px !important;
	font-size: 33px !important;
	font-size: 2.3vw !important;
	color: #000 !important;
    padding: 13px 0px 20px;
}

.navOpen h1.logoName {
	opacity: 0;
}

h1.logoName.white {
	color: #fff;
}

.dark h1.logoName {
	color: #000;
	transition: color .2s linear .5s;
}

.home .arrowholder {
	width: 100%;
	text-align: center;
	left: 0px;
	bottom: 30px;
	z-index: 300;
	position: fixed;
	cursor: pointer;
	opacity: 0;

	transition: opacity .4s linear 0s;
}

.home.fp-viewing-0-0 .arrowholder {
	opacity: 1;
	
	transition: opacity .4s linear .2s;
}

	.home .arrowholder img {
		display: block;
		margin: auto;
	}

	.home .arrowholder img {
		width: 27px;
	}

.home.fp-viewing-0 .arrowholder {
	opacity: 1;
}

.navOpen.home .arrowholder {
	opacity: 0 !important;
}

.home .section .infoHolder {
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
	z-index: 5;
}

	.home .section .infoHolder .info {
		width: 90%;
		opacity: 0;
		
		transition: opacity .6s linear 0s;
		-webkit-transition: opacity .6s linear 0s;
		-moz-transition: opacity .6s linear 0s;
		-o-transition: opacity .6s linear 0s;
	}
	
	.home .section.active .infoHolder .info {
		opacity: 1;
		
		transition: opacity .8s linear 1s;
		-webkit-transition: opacity .8s linear 1s;
		-moz-transition: opacity .8s linear 1s;
		-o-transition: opacity .8s linear 1s;
	}
	
	.home.navOpen .section.active .infoHolder .info {
		opacity: 0;
		
		transition: opacity .3s linear 0s;
		-webkit-transition: opacity .3s linear 0s;
		-moz-transition: opacity .3s linear 0s;
		-o-transition: opacity .3s linear 0s;
	}

		.home .section .infoHolder .info h1 {
			font-size: 6vw;
			color: #fff;
		    letter-spacing: -.02em;
			font-weight: 400;
		}
		
		.home .section.black .infoHolder .info h1 {
			color: #000;
		}

	
.home .section .imgHolder {
	clear: both;
	position: relative;
	overflow: hidden;
	height: 100%;
}

.home .videoHolder {
	opacity: 1;
}

	.home .videoHolder #video {
	    width: auto;
	    height: auto;
	    /*min-width: 100%;
	    min-height: 100%;*/
	    position: absolute;
	    top: 50%;
	    left: 50%;
	    -webkit-transform: translate(-50%,-50%);
	    	-ms-transform: translate(-50%,-50%);
	    		transform: translate(-50%,-50%);
	}
	
	.home .videoHolder #video.forcewidth {
		width: 100%;
	}
	
	.home .videoHolder #video.forceheight {
		height: 100%;
	}
	
	.home.videos .videoHolder #video {
		width: auto !important;
		height: 100% !important;
	}


/*single-image centered layout*/

.centered .infoHolder .info h1 {
	/*color: #000 !important;*/
}

.centered .imgHolder {
	position: absolute !important;
    height: 80% !important;
    width: 80%;
    left: 10%;
    top: 10%;
}

	.centered .imgHolder img {
	    position: absolute;
	    top: 50%;
	    left: 50%;
	    -webkit-transform: translate(-50%, -50%);
	    	-ms-transform: translate(-50%, -50%);
	    		transform: translate(-50%, -50%);
	    width: auto;
	    height: auto;
	    max-width: 100%;
	    max-height: 100%;
	}


/*diptych layout*/

.diptych .infoHolder .info h1 {
	color: #000 !important;
}

.home .diptych .imgHolder {
    position: absolute;
    text-align: center;
    height: 90% !important;
    top: 5%;
    width: 80%;
    left: 10%;
}

.diptych .imgHolder {
	position: relative;
    text-align: center;
    height: 90% !important;
    top: 5%;
    width: 80%;
    left: 10%;
}

	.diptych .imgHolder .col {
		width: 43%;
		height: 100%;
		margin: 0% 0%;
		text-align: center;
	}

	.diptych .imgHolder img {
	    display: inline-block; *display: inline; zoom: 1;
	    vertical-align: middle;
	    width: auto;
	    height: auto;
	    max-width: 90%;
	    max-height: 90%;
	}
	
	.diptych .imgHolder img.landscape {
		max-width: 100%;
	}

.home .section.off .info {
	opacity: 0;
	
	transition: opacity .4s linear 0s;
	-webkit-transition: opacity .4s linear 0s;
	-moz-transition: opacity .4s linear 0s;
	-o-transition: opacity .4s linear 0s;
	
}

.home .section.active .info {
	opacity: 1;
	
	transition: opacity .4s linear 1s;
	-webkit-transition: opacity .4s linear 1s;
	-moz-transition: opacity .4s linear 1s;
	-o-transition: opacity .4s linear 1s;
}

.section.centered .infoHolder .info {
	/*width: 70%;*/
}

.home .button {
    display: block;
    margin: 40px auto 0px auto;
    opacity: 1;
    color: #fff;
    height: 30px;
    width: 150px;
    padding-top: 14px;
}

iframe {
    position: relative;
/*    top: 50%;
    -webkit-transform: translateY(-50%);
    	-ms-transform: translateY(-50%);
    		transform: translateY(-50%);*/
}

/*===\\========================================//===*/
/*====\\==== MASONRY GRIDS: general rules ====//====*/
/*=====\\====================================//=====*/

/*general grid header things*/
.grid.masonry #header {
    height: 60px;
    top: 0px;
    background-color: rgba(255,255,255,1);
}

.grid.masonry.scrollDown #header {
	background-color: rgba(255,255,255,0);
}

.grid.masonry.scrollUp #header {
	background-color: rgba(255,255,255,1);
}

/*the story title*/
#header h1 {
	display: none;
    position: fixed;
    top: 23px;
    left: 50%;
    -webkit-transform: translateX(-50%);
    	-ms-transform: translateX(-50%);
    		transform: translateX(-50%);
    margin-left: 5px;
	font-size: 11px;
	font-family: "nimbus-sans-extended", sans-serif;
    letter-spacing: .03em;
    text-transform: uppercase;
    font-weight: 400;

    transition: opacity .3s .3s, color .3s 0s;
}

.grid.masonry #header h1 {
	display: block;
}

.no-touchevents .grid.masonry #header:hover h1 {
	opacity: 0;
	transition: opacity .3s 0s;
}

	.grid.masonry.scrollDown #header h1 {
		color: rgba(255,255,255,1);
	}

/* show/hide menu trigger on hover */
.grid.masonry #header .trigger {
	opacity: 0;
	transition: opacity .3s 0s, color .3s 0s;
}

.lightbox.grid.masonry #header .trigger {
	opacity: 1 !important;
}

.no-touchevents .grid.masonry #header:hover .trigger {
	opacity: 1;
	transition: opacity .3s .3s;
}

.grid.masonry.scrollDown #header .trigger {
	color: rgba(255,255,255,1);
}

.navOpen.grid.masonry #header h1 {
	opacity: 0;
}

.navOpen.grid.masonry #header .trigger {
	opacity: 1;
}


/*swap out the icon color on scroll*/
.grid.masonry .icons a {
	position: relative;
}

	.grid.masonry .icons img {
		position: absolute;
		top: 0px;
		left: 0px;
		transition: opacity .3s;
	}

	.grid.masonry .icons img:nth-child(1) {
		opacity: 1;
	}

	.grid.masonry .icons img:nth-child(2) {
		opacity: 0;
	}

	.grid.masonry.scrollDown .icons img:nth-child(1) {
		opacity: 0;
	}

	.grid.masonry.scrollDown .icons img:nth-child(2) {
		opacity: 1;
	}

#grid {
	list-style-type: none;
	width: 96%;
	margin: 60px auto 50px auto;
    z-index: 50;
}

	#grid > li, #grid .cell {
		display: block;
		float: left;
		opacity: 0;
		overflow: hidden;
		color: #fff;
	}

	.grid-sizer, #grid > li {
		width: 32%;
	}

	.gutter-sizer {
		width: 2%;
	}
	
	#grid li.cell a {
		display: block;
		width: 100%;
		height: 100%;
		position: relative;
	}
	
    #grid > li.shown,
	#grid .cell.shown,
    .no-js #grid > li,
    .no-cssanimations #grid > li {
    	opacity: 1;
    }

      #grid > li img {
      	outline: none;
      	border: none;
      	display: block;
      	width: 100%;
      }
	
	/* Effect 1: opacity */
	.grid.effect-1 li.animate {
		-webkit-animation: fadeIn 0.65s ease forwards;
		animation: fadeIn 0.65s ease forwards;
	}

	@-webkit-keyframes fadeIn {
		0% { }
		100% { opacity: 1; }
	}

	@keyframes fadeIn {
		0% { }
		100% { opacity: 1; }
	}

	#grid .caption {
		/*display: none;*/
		position: absolute;
		top: 0px;
		left: 0px;
		width: 100%;
		height: 100%;
		background-color: rgba(0,0,0,.6);
		text-align: center;
		opacity: 0;

		transition: opacity .3s;
	}

	.no-touchevents #grid li a:hover .caption {
		opacity: 1;
	}

		#grid .caption h2 {
			width: 88%;
			position: absolute;
			top: 50%;
			left: 50%;
			color: white;
			-webkit-transform: translate(-50%,-20%);
				-ms-transform: translate(-50%,-20%);
					transform: translate(-50%,-20%);
			font-weight: 400;
			line-height: 1;
		    font-size: 39px;
		    letter-spacing: -.02em;
		    opacity: 0;

		    transition: opacity .3s 0s, transform 0s .3s;
		}

		.no-touchevents #grid li a:hover .caption h2 {
			opacity: 1;
			-webkit-transform: translate(-50%,-50%);
				-ms-transform: translate(-50%,-50%);
					transform: translate(-50%,-50%);

			transition: opacity .5s .2s, transform .3s .2s;
		}


	
/*	.grid .gridfoot {
		width: 100%;
		text-align: center;
		left: 0px;
		bottom: 0px;
		z-index: 300;
		position: fixed;
		cursor: pointer;
		background-color: #fff;
	}
		
		.grid .gridfoot h1 {
			font-size: 30px;
			font-weight: 400;
			display: block;
			margin: auto;
			padding-bottom: 7px;
		}*/
	
/*===\\========================================//===*/
/*====\\==== VERTICAL SCROLL STORY PAGE ====//====*/
/*=====\\====================================//=====*/

ul.vertscroll {
	list-style-type: none;
	width: 100%;
	position: relative;
}

	.vertscroll .slide {
		width: 100%;
		height: 100%;
		overflow: hidden;
		text-align: center;
		
	}
	
	.vertscroll .slide:active {
		cursor: grabbing;
		cursor: -moz-grabbing;
		cursor: -webkit-grabbing;
	}

		.slideshow .fullscreen .bg {
		    width: 100%;
		    height: 100%;
		}

		.slideshow .centered {}

			.slideshow .centered .photo {
			    height: 80%;
			    position: relative;
			    top: 10%;
				margin: auto;
			}

				.slideshow .centered .photo.portrait {
				    height: 100%;
				    width: auto;
				    top: 0px;
					margin: auto;
				}

	.arrowTrigPrev {
	    position: absolute;
	    top: 0px;
	    left: 0px;
	    width: 20%;
	    height: 100%;
	    z-index: 110;
	}

		.arrowTrigPrev img {
		    display: block;
		    width: 27px;
		    height: auto;
		    position: absolute;
		    top: 50%;
		    left: 20px;
			-webkit-transform: translateY(-50%);
				-ms-transform: translateY(-50%);
					transform: translateY(-50%);
			cursor: pointer;
			opacity: 0;
			transition: opacity .3s;
		}

		.no-touchevents .arrowTrigPrev:hover img {
			opacity: 1;
		}

	.arrowTrigNext {
	    position: absolute;
	    top: 0px;
	    right: 0px;
	    width: 20%;
	    height: 100%;
	    z-index: 110;
	}

		.arrowTrigNext img {
		    display: block;
		    width: 27px;
		    height: auto;
		    position: absolute;
		    top: 50%;
		    right: 20px;
			-webkit-transform: translateY(-50%);
				-ms-transform: translateY(-50%);
					transform: translateY(-50%);
			cursor: pointer;
			opacity: 0;
			transition: opacity .3s;
		}

		.no-touchevents .arrowTrigNext:hover img {
			opacity: 1;
		}

	.slideshow .arrow img:nth-child(2) {
		display: block;
	}

	.slideshow .arrow img:nth-child(1) {
		display: none;
	}

	.white-icons.slideshow .arrow img:nth-child(2) {
		display: none;
	}

	.white-icons.slideshow .arrow img:nth-child(1) {
		display: block;
	}

	.slideshow #header {
		height: 140px;
	}

		.slideshow #header .trigger img:nth-child(1),
		.slideshow #header .trigger img:nth-child(2) {
			display: none;
		}

		.slideshow #header .trigger img:nth-child(3) {
			display: block;
		}

		.white-icons.slideshow #header .trigger img:nth-child(3) {
			display: none;
		}

		.white-icons.slideshow #header .trigger img:nth-child(2) {
			display: block;
		}
/*
		.white-x.slideshow #header .trigger img:nth-child(2) {
			display: block;
		}

		.white-x.slideshow #header .trigger img:nth-child(3) {
			display: none;
		}*/
		
		.slideshow #header .trigger img {
			opacity: 0;
		}

		.no-touchevents .slideshow #header:hover .trigger img {
			opacity: 1;
		}
		
.vertscroll .fullscreenimg {
    display: block;
    position: absolute;
    margin-right: 0px;
    max-width: none;
    max-height: none;
}

	
	
/*===\\========================================//===*/
/*====\\==== MOODBOARD / LIGHTBOX  ====//====*/
/*=====\\====================================//=====*/

.grid .cell .moodboard {
	position: absolute;
	top: 20px;
	right: 20px;
	z-index: 50;
	opacity: 0;
	
	transition: opacity .3s;
	-webkit-transition: opacity .3s;
	-moz-transition: opacity .3s;
	-o-transition: opacity .3s;
}

.grid.story .cell:hover .moodboard {
	opacity: 1;
}

	.grid .cell .moodboard .lb .line {
		background-color: #fff;
	}
	
	.grid .cell .moodboard .lb .line:before {
		background-color: #fff;
	}

.slideshow .moodboard {
	position: fixed;
	top: 15px;
	right: 20px;
	z-index: 500;
	opacity: 1;

	transition: opacity .3s;
}

	.slideshow .moodboard a {
		color: #fff;
		font-family: "nimbus-sans-extended", sans-serif;
	}

	.moodboard .label {
		display: inline-block;
		*display: inline;
		zoom: 1;
		background-color: #fff;
		width: 130px;
		height: 16px;
		padding: 10px 2px 10px 11px;
		border-radius: 3px;
		position: relative;
		top: 2px;
		left: -16px;
		
		transition: opacity .3s;
		-webkit-transition: opacity .3s;
		-moz-transition: opacity .3s;
		-o-transition: opacity .3s;
	}
	
	.moodboard .label.hidden {
		opacity: 0;
	}
	
		.moodboard .label:after {
			content: '';
			display: block;
			width: 10px;
			height: 10px;
			background-color: #fff;
			position: absolute;
			right: -5px;
			top: 14px;
			
			transform: rotate(135deg);
			-webkit-transform: rotate(135deg);
			-moz-transform: rotate(135deg);
			-o-transform: rotate(135deg);
		}

	.moodboard .lb {
		cursor: pointer;
		display: inline-block;
		*display: inline;
		zoom: 1;
	}

	.moodboard .lb .line {
		display: inline-block;
		*display: inline;
		zoom: 1;
		width: 25px;
		height: 3px;
		background-color: #000;
		
		transform: rotate(90deg);
		-webkit-transform: rotate(90deg);
		-moz-transform: rotate(90deg);
		-o-transform: rotate(90deg);
	}
	
	.white-icons .moodboard .lb .line {
		background-color: #fff;
	}
	
	.moodboard.added .lb .line {
		transform: rotate(0deg);
		-webkit-transform: rotate(0deg);
		-moz-transform: rotate(0deg);
		-o-transform: rotate(0deg);
	}
	
	.moodboard .lb .line:before {
		content: '';
		display: inline-block;
		*display: inline;
		zoom: 1;
		width: 25px;
		height: 3px;
		background-color: #000;
		position: absolute;
		top: 0px;
		
		transform: rotate(90deg);
		-webkit-transform: rotate(90deg);
		-moz-transform: rotate(90deg);
		-o-transform: rotate(90deg);
	}
	
	.white-icons .moodboard .lb .line:before {
		background-color: #fff;
	}
	
	.moodboard.added .lb .line:before {
		display: none;
	}
	
	.mblink#copyme {
		opacity: 0;
		width: 100%;
		overflow: hidden;
	}
	
/*===\\========================================//===*/
/*====\\==== HORIZONTAL SCROLL STORY PAGE ====//====*/
/*=====\\====================================//=====*/

body.slideshow {
	overflow: hidden;
}

body.story {
	overflow-y: hidden;
}

body.grid.story {
	overflow-y: scroll;
}

.story table, .story table td, .story table td img {
	height: 100%;
}

	.story table td img {
		margin-right: -1px;
	}

	.story .icons, .vert .icons, .grid .icons, .slideshow .icons, .scroll .icons, .home .icons {
		list-style-type: none;
		position: fixed;
		top: 15px;
		left: 20px;
		z-index: 500;
		opacity: 1;

		transition: opacity .3s;
	}

		.slideshow .icons a,
		.home .icons,
		.scroll .icons {
			position: relative;
		}
		
		.home.fp-viewing-0-0 .icons {
			opacity: 0;
		}

			.slideshow .icons a img,
			.home .icons a img,
			.scroll .icons a img {
				position: absolute;
				top: 0px;
				left: 0px;
				transition: opacity .3s .6s;
			}

			.slideshow .icons a img:first-child {
				opacity: 1;
			}

			.slideshow .icons a img:last-child {
				opacity: 0;
			}

			.white-icons.slideshow .icons a img:first-child {
				opacity: 0;
			}

			.white-icons.slideshow .icons a img:last-child {
				opacity: 1;
			}
			
			.dark.home .icons a img:last-child {
				opacity: 0;
			}

			.dark.home .icons a img:first-child {
				opacity: 1;
			}


			/*STYLES SPECIFIC TO SCROLL.PHP*/
			.scroll .icons a img:first-child {
				opacity: 0;
			}

			.scroll .icons a img:last-child {
				opacity: 1;
			}

			.white-icons.scroll .icons a img:first-child {
				opacity: 0;
			}

			.white-icons.scroll .icons a img:last-child {
				opacity: 1;
			}

	
	.story .icons img, .vert .icons img, .grid .icons img, .slideshow .icons img, .scroll .icons img, .home .icons img {
		width: 29px;
		margin-right: 15px;
	}

	.navOpen.story .icons, 
	.navOpen.vert .icons, 
	.navOpen.grid .icons,
	.navOpen.slideshow .icons,
	.navOpen.scroll .icons {
		opacity: 0;
	}
	



/* === \\ ============================= // === */
/* ==== \\ === VIDEO / MOTION PAGE === // ==== */
/* ===== \\ ========================= // ===== */

/* when videos play... */
body.playing h1.logoName {
	opacity: 0;
	z-index: -1;
}

body.videos #header {
	opacity: 1 !important;
	z-index: 400;

	transition: opacity .4s 0s, z-index 0s .4s;
}

body.videos.playing #header {
	opacity: 0 !important;
	z-index: -1;
	transition: opacity .4s 0s, z-index 0s 0s;
}

.closeVid {
	display: block;
	cursor: pointer;
	width: 26px;
	height: auto;
	position: fixed;
	top: 20px;
	left: 50%;
	margin-left: -13px;
	opacity: 0;
	z-index: -1;

	transition: opacity .4s 0s, z-index 0s .4s;
}

body.playing .closeVid {
	opacity: 1;
	z-index: 15;

	transition: opacity .4s .2s, z-index 0s 0s;
}

.videoHolder {
    position: absolute;
    top: 0px;
    left: 0px;
    z-index: -1;
    opacity: 0;
    width: 100%;
    height: 100%;
    background-color: #000;

    transition: opacity .4s 0s, z-index 0s .4s;
}

.playing .videoHolder {
	opacity: 1;
	z-index: 10;

	transition: opacity .4s 0s, z-index 0s 0s;
}

	.videoHolder .inner {
	    position: relative;
	    width: 100%;
	    height: 100%;
	}



.videos .black-overlay {
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
	z-index: 2;
	background-color: rgba(0,0,0,.3);

	transition: background-color .3s;
}	

.videos.vidInfo .black-overlay {
	background-color: rgba(0,0,0,.6);
}

.videos .imgHolder {
	z-index: 1;
}

.buttons {
    font-family: "nimbus-sans-extended", sans-serif;
    font-weight: 400;
    font-size: 16px;
    color: #fff;
    width: 88%;
    max-width: 710px;
    margin: 33px auto 0px;
    letter-spacing: .08em;
}

	.buttons .play {
   		display: inline-block; *display: inline; zoom: 1;
   		vertical-align: middle;
   		width: 14%;
	}
	
	.buttons form {
   		display: inline-block; *display: inline; zoom: 1;
   		vertical-align: middle;
   		width: 14%;
	}
	
		.buttons form .customButton {
			font-family: "nimbus-sans-extended",sans-serif;
			background: transparent;
			cursor: pointer;
			font-size: 16px;
			color: #fff;
			text-transform: uppercase;
		}
		
@media all and (max-width: 1440px) {
	.buttons { font-size: 13px; }
	.buttons form .customButton {font-size: 13px;}
}

@media all and (min-width: 1800px) {
	.buttons { font-size: 16px; }
	.buttons form .customButton {font-size: 16px;}
}

		.buttons .play span {
			cursor: pointer;
		}

	.buttons .infoToggle, .buttons p {
		display: inline-block; *display: inline; zoom: 1;
		vertical-align: middle;
		width: 14%;
		position: relative;
		text-align: center;
	}

		.buttons .infoToggle span {
			transition: opacity .3s;
		}

		.buttons .infoToggle span:first-child {
			position: relative;
			top: 0px;
			left: 0px;
			cursor: pointer;
			opacity: 1;
		}

		.buttons .infoToggle span:last-child {
			position: absolute;
			top: 0px;
			left: 50%;
			-webkit-transform: translateX(-50%);
				-ms-transform: translateX(-50%);
					transform: translateX(-50%);
			cursor: pointer;
			opacity: 0;
		}

		.vidInfo .buttons .infoToggle span:first-child {
			opacity: 0;
		}

		.vidInfo .buttons .infoToggle span:last-child {
			opacity: 1;
		}

.writeup {
    display: none; 
    color: #fff;
    font-family: "nimbus-sans-extended", sans-serif;
    line-height: 1.5;
    letter-spacing: .03em;
    font-size: 15px;
    width: 88%;
    max-width: 600px;
    margin: auto;
    position: relative;
    top: 40px;
    text-transform: uppercase;
}

	.writeup p {
		opacity: 0;
		transition: opacity .4s 0s;
	}

	.writeup.open p {
		opacity: 1;
		transition: opacity .4s .3s;
	}



	
/* NAV OVERLAY */

#overlay, #bio {
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0px;
	left: 0px;
	text-align: center;
	
	/*visibility: hidden;*/
	z-index: -1;
	opacity: 0;

	transition: opacity .4s 0s, z-index 0s .4s;
}

	.navOpen #overlay {
		/*visibility: visible;*/
		z-index: 50;
		opacity: 1;

		transition: opacity .4s 0s, z-index 0s 0s;
	}
	
	.bioOpen #bio {
		/*visibility: visible;*/
		z-index: 50;
		opacity: 1;

		transition: opacity .4s 0s, z-index 0s 0s;
	}

	#overlay .inner {
		width: 100%;
		height: 100%;
		background-color: rgba(0,0,0,.5);
		color: #fff;
		text-align: center;
	}
	
	#overlay .inner .holder {
		opacity: 0;
	}
	
	.navOpen #overlay .inner .holder {
		opacity: 1;
		
		transition: opacity .6s;
		-webkit-transition: opacity .6s;
		-moz-transition: opacity .6s;
		-o-transition: opacity .6s;
		
	}
	
	#overlay .inner .mark {
		width: 75px;
	}
	
	#overlay .inner ul {
		list-style-type: none;
	}
	
		#overlay .inner ul.nav {
			position: relative;
		    font-size: 86px;
		    /*font-size: 6.7vw;*/
		    margin-top: 56px;
		    letter-spacing: -.02em;
			color: #fff;
			opacity: 1;
			z-index: 1;

			transition: opacity .4s .3s, z-index 0s .7s;
		}

		@media all and (max-height: 830px) {
			#overlay .inner ul.nav {font-size: 56px;}
		}
		@media all and (max-height: 624px) {
			#overlay .inner ul.nav {font-size: 45px;}
		}
		@media all and (max-height: 570px) {
			#overlay .inner ul.nav {font-size: 36px;}
		}

		#overlay .inner ul.nav > li {
			margin-bottom: 25px;
			position: relative;
			display: block;
		    padding: 0em 0em;
		}

		#overlay .inner ul.nav .fadeMe {
			opacity: 0;
    		transition: opacity .4s;
		}

		#overlay .inner ul.nav .fadeMe.on {
			opacity: 1;
		}

			#overlay .inner ul.nav li a {
			    display: block;
			    line-height: 1;
			}
			
			.no-touchevents #overlay .inner ul.nav li a:hover {
				color: #000;
			}

			#overlay .inner ul.nav li .theText {
				display: none;
			}
	
	#overlay ul.social {
		line-height: 1;
		display: block;
		font-size: 0px;
		letter-spacing: 0px;
		padding-top: 45px;
		cursor: default;
	}
	
	
		#overlay ul.social li {
		    margin: 0px 15px 0px 15px;
		    width: 20px;
		    height: auto;
		}
		
		#overlay ul.social li svg {
		    display: block;
		    width: 20px;
		    fill: #fff;
			opacity: 1;
			
			transition: opacity .3s;
			-webkit-transition: opacity .3s;
			-moz-transition: opacity .3s;
			-o-transition: opacity .3s;
			
		}
		
		.no-touchevents #overlay ul.social li svg:hover {
			opacity: .7;
		}
	
.popup #overlay ul.nav {
	opacity: 0;
	z-index: -1;

	transition: opacity .3s 0s, z-index 0s .3s;
}

	#overlay .menuText {
	    position: absolute;
	    top: 0px;
	    left: 0px;
	    width: 100%;
	    height: 100%;
	    /*background-color: rgba(0,0,0,.5);*/
	    color: #fff;
	    text-align: center;
	    letter-spacing: -.02em;
	    opacity: 0;
	    z-index: -1;

	    transition: opacity .4s 0s, z-index 0s .4s;
	}

	body.popup #overlay .menuText {
		opacity: 1;
		z-index: 1;
		transition: opacity .4s .3s, z-index 0s 0s;
	}

		#overlay .menuText .holdEmAll {
		    position: relative;
    		top: 3%;
		    width: 76.6%;
		}

			#overlay .menuText .holdEmAll .swapIt {
		        max-width: 1103px;
			    margin: auto;
			}

				.swapIt p {
					/* font-size: 34px; */
					/*font-size: 2.6vw;*/
					font-size: 1.4vw;
					padding-bottom: 1.1em;
					letter-spacing: -.03em;
					line-height: 1.2;
				}

				.swapIt p:last-child {
					font-size: 14px;
					font-size: 1.4vw;
					/*font-size: .9vw;*/
					padding-bottom: 0em;
				}

					.swapIt p:last-child a {
						display: inline-block; *display: inline; zoom: 1;
						vertical-align: baseline;
						font-family: "nimbus-sans-extended", sans-serif;
					    margin: 0px 20px;
					    letter-spacing: .08em;
					}

				@media all and (max-width: 1439px) {
					/* .swapIt p { font-size: 28px} */
					.swapIt p:last-child a { font-size: 13px; }
				}
				
				@media all and (max-width: 1200px) {
					.swapIt p { font-size: 18px}
					.swapIt p:last-child { font-size: 18px; }
				}

				@media all and (min-width: 1921px) {
					/* .swapIt p { font-size: 36px; } */
					.swapIt p:last-child a { font-size: 17px; }
				}
				
				@media all and (max-height: 600px) {
					/* .swapIt p { font-size: 18px; } */
				}

			#overlay .menuText .holdEmAll .social {
				    padding-top: 50px;
			}

/* PDF SELECTOR */

  .pdf_select, .pdfOverlay {
    position: fixed;
    z-index: -500;
    opacity: 0;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    overflow: hidden;
    text-align: center;
    background-color: rgba(0,0,0,.7);

    transition-property: opacity, z-index;
    transition-duration: .4s, 0s;
    transition-delay: 0s, .4s;
    -webkit-transition-property: opacity, z-index;
    -webkit-transition-duration: .4s, 0s;
    -webkit-transition-delay: 0s, .4s;
    -moz-transition-property: opacity, z-index;
    -moz-transition-duration: .4s, 0s;
    -moz-transition-delay: 0s, .4s;
    -o-transition-property: opacity, z-index;
    -o-transition-duration: .4s, 0s;
    -o-transition-delay: 0s, .4s;
  }

  .pdf_select.on, .pdfOverlay.on, .pdfOpen .pdf_select, .linkOpen .pdf_link {
    z-index: 500;
    opacity: 1;

    transition-property: opacity, z-index;
    transition-duration: .4s, 0s;
    transition-delay: 0s, 0s;
    -webkit-transition-property: opacity, z-index;
    -webkit-transition-duration: .4s, 0s;
    -webkit-transition-delay: 0s, 0s;
    -moz-transition-property: opacity, z-index;
    -moz-transition-duration: .4s, 0s;
    -moz-transition-delay: 0s, 0s;
    -o-transition-property: opacity, z-index;
    -o-transition-duration: .4s, 0s;
    -o-transition-delay: 0s, 0s;
  }

    .pdf_select article, .pdfOverlay article {
      position: relative;
      z-index: 3;
      color: #fff;
      padding: 40px 50px;
    }

      .pdf_select article img.closeLB, .pdfOverlay article img.closeLB {
        display: block;
        width: 14px;
        height: auto;
        position: absolute;
        top: 11px;
        right: 12px;
        cursor: pointer;
      }

      .pdf_select article h1, .pdfOverlay article h1 {
		font-weight: normal;
		letter-spacing: .05em;
		font-size: 14px;
		font-family: "nimbus-sans", sans-serif;
		padding-bottom: 13px;
		line-height: 1em;
      }

      .pdf_select article p, .pdfOverlay article p {
		color: #fff;
		line-height: 1.3;
		font-size: 14px;
		font-family: "nimbus-sans", sans-serif;
      }

		.pdfOverlay article p.theLink {
		    color: #fff;
			letter-spacing: .05em;
			font-size: 14px;
			text-transform: uppercase;
			font-family: "nimbus-sans", sans-serif;
		}

	  .pdfOverlay .linkHolder {
	    font-size: 14px;
	    padding: 30px 20px;
	  }

		.pdfOverlay .linkHolder span {
			font-size: 80%;
			color: #00b0c2;
			background-color: #0460ce;
		}

      .pdf_select article ul {
        list-style-type: none;
        padding: 30px 0px;
      }

        .pdf_select article ul li {
		  /*
		  border: 1px solid #cecece;
          background-color: #ffffff;
		  */
          cursor: pointer;
          margin-right: 20px;
          padding: 24px 9px;

          transition-property: border, background-color;
          transition-duration: 200ms;
          -webkit-transition-property: border, background-color;
          -webkit-transition-duration: 200ms;
          -moz-transition-property: border, background-color;
          -moz-transition-duration: 200ms;
          -o-transition-property: border, background-color;
          -o-transition-duration: 200ms;
        }

        .pdf_select article ul li:last-child {
        	margin-right: 0px;
        }

        .no-touch .pdf_select article ul li:hover {
          border: 1px solid #eeeeee;
          background-color: #EFEFEF;
        }

        .pdf_select article ul li.selected img {
          border: 8px solid #000;
        }

          .pdf_select article ul li img {
            display: block;
            border: 8px solid transparent;
            width: 170px;
            height: auto;

            transition-property: border, background-color;
            transition-duration: 200ms;
            -webkit-transition-property: border, background-color;
            -webkit-transition-duration: 200ms;
            -moz-transition-property: border, background-color;
            -moz-transition-duration: 200ms;
            -o-transition-property: border, background-color;
            -o-transition-duration: 200ms;
          }

          .pdf_select article ul li h2 {
		    font-family: "nimbus-sans-extended", sans-serif;
			font-weight: normal;
		    letter-spacing: .03em;
		    font-size: 12px;
		    line-height: 1;
		    padding: 19px 0px 0px;
          }

      .pdf_select article a.downloadPDF {
	    font-family: "nimbus-sans-extended", sans-serif;
		color: #FFFFFF;
	    font-size: 11px;
	    letter-spacing: .03em;
	    line-height: 1;
        display: inline-block; *display: inline; zoom: 1;
		border: 1px solid #fff;
		padding: 5px 8px;

        transition: all .3s;
      }
	  
	  /*
	  .pdf_select article a.downloadPDF:hover {
		  color: #000;
	  }

      
	  .no-touchevents .pdf_select article a.downloadPDF:hover,
      .pdf_select article a.downloadPDF:active {
  		background-color: #000;
  		transition: background-color .15s;
      }
	  */

    .pdf_select .closeBG, .pdf_link .closeBG {
      position: absolute;
      top: 0px;
      left: 0px;
      width: 100%;
      height: 100%;
      z-index: 1;
    }
	
	.linkOpen .clearAll p {
		margin-bottom: 15px;
	}
	
	.linkOpen .clearAll a {	
	    font-family: "nimbus-sans-extended", sans-serif;
		font-size: 11px;
		margin-right: 25px;
		border: 1px solid #fff;
		padding: 5px 8px;
		color: #fff;
	}
	
	.linkOpen .clearAll a:last-child {
		margin-right: 0px;
	}
	
/* CUSTOM VIDEO CONTROLS */

.videoHolder .arrowPlay {
	width: 52px;
	position: absolute;
	top: 50%;
	left: 50%;
	z-index: 20;
	cursor: pointer;
	opacity: 0;
	
	transform: translate(-50%,-50%);
	-webkit-transform: translate(-50%,-50%);
	-moz-transform: translate(-50%,-50%);
	-o-transform: translate(-50%,-50%);
}

.playing .videoHolder .arrowPlay {
	opacity: 0;
	transition: opacity .3s;
	-webkit-transition: opacity .3s;
	-moz-transition: opacity .3s;
	-o-transition: opacity .3s;
}

.playing .videoHolder .arrowPlay.hide {
	opacity: 0 !important;
	transition: opacity .3s;
	-webkit-transition: opacity .3s;
	-moz-transition: opacity .3s;
	-o-transition: opacity .3s;
}

.playing .videoHolder:hover .arrowPlay {
	opacity: 1;
	transition: opacity .3s;
	-webkit-transition: opacity .3s;
	-moz-transition: opacity .3s;
	-o-transition: opacity .3s;
}
	
#video-controls {
	position: absolute;
	bottom: 10px;
	left: 0;
	right: 0;
	padding: 5px;
	z-index: 30;
	opacity: 0;
	-webkit-transition: opacity .3s;
	-moz-transition: opacity .3s;
	-o-transition: opacity .3s;
	-ms-transition: opacity .3s;
	transition: opacity .3s;
	background: transparent;
}

.playing .videoHolder:hover #video-controls {
	opacity: .9;
}

.playing #video-controls.hide {
	opacity: 0 !important;
	transition: opacity .3s;
	-webkit-transition: opacity .3s;
	-moz-transition: opacity .3s;
	-o-transition: opacity .3s;
}

#video-controls button {
	background: rgba(0,0,0,.5);
	border: 0;
	color: #EEE;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	-o-border-radius: 3px;
	border-radius: 3px;
}

#video-controls button:hover {
	cursor: pointer;
}

#video-controls #seek-bar {
	width: 80%;
	position: relative;
	top: -9px;
}

	/* clear defaults */
	input[type=range] {
	  -webkit-appearance: none; /* Hides the slider so that custom slider can be made */
	  width: 100%; /* Specific width is required for Firefox. */
	  background: transparent; /* Otherwise white in Chrome */
	}

	input[type=range]::-webkit-slider-thumb {
	  -webkit-appearance: none;
	}

	input[type=range]:focus {
	  outline: none; /* Removes the blue border. You should probably do some kind of focus styling for accessibility reasons though. */
	}

	input[type=range]::-ms-track {
	  width: 100%;
	  cursor: pointer;

	  /* Hides the slider so custom styles can be added */
	  background: transparent; 
	  border-color: transparent;
	  color: transparent;
	}
	
	/* style the track button */
	/* Special styling for WebKit/Blink */
	input[type=range]::-webkit-slider-thumb {
	  -webkit-appearance: none;
	  border: 1px solid #ccc;
	  height: 16px;
	  width: 10px;
	  border-radius: 0px;
	  background: #ffffff;
	  cursor: pointer;
	  margin-top: -8px; /* You need to specify a margin in Chrome, but in Firefox and IE it is automatic */
	  box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d; /* Add cool effects to your sliders! */
	}

	/* All the same stuff for Firefox */
	input[type=range]::-moz-range-thumb {
	  box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
	  border: 1px solid #ccc;
	  height: 16px;
	  width: 10px;
	  border-radius: 0px;
	  background: #ffffff;
	  cursor: pointer;
	}

	/* All the same stuff for IE */
	input[type=range]::-ms-thumb {
	  box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
	  border: 1px solid #ccc;
	  height: 16px;
	  width: 10px;
	  border-radius: 3px;
	  background: #ffffff;
	  cursor: pointer;
	}
	
	/* style the track bg */
	
	input[type=range]::-webkit-slider-runnable-track {
	  width: 100%;
	  height: 4px;
	  cursor: pointer;
	  background: #fff;
	  border-radius: 1.3px;
	  border: 0px solid #010101;
	}

	input[type=range]:focus::-webkit-slider-runnable-track {
	  background: #fff;
	}

	input[type=range]::-moz-range-track {
	  width: 100%;
	  height: 4px;
	  cursor: pointer;
	  background: #fff;
	  border-radius: 1.3px;
	  border: 0px solid #010101;
	}

	input[type=range]::-ms-track {
	  width: 100%;
	  height: 4px;
	  cursor: pointer;
	  background: transparent;
	  border-color: transparent;
	  border-width: 0px 0;
	  color: transparent;
	}
	input[type=range]::-ms-fill-lower {
	  background: #fff;
	  border: 0px solid #010101;
	  border-radius: 2.6px;
	}
	input[type=range]:focus::-ms-fill-lower {
	  background: #fff;
	}
	input[type=range]::-ms-fill-upper {
	  background: #fff;
	  border: 0px solid #010101;
	  border-radius: 2.6px;
	}
	input[type=range]:focus::-ms-fill-upper {
	  background: #fff;
	}

#video-controls #volume-bar {
	width: 60px;
}

#video-controls #full-screen {
	height: 20px;
	width: auto;
	cursor: pointer;
	position: relative;
	top: -2px;
}

#video-controls #mute {
	height: 25px;
	width: auto;
	cursor: pointer;
	margin: 0px 10px 0px 10px;
}