body {
	font-family: 'Montserrat', sans-serif;
	font-weight:100;
	background: #222;
	margin:0 0 0 0;
}

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

#social {
	margin-left: auto;
	margin-right: auto;
	width: 130px;
	padding-top: 60px;
	padding-bottom: 50px;
}

.sub-header {
	font-family: 'Montserrat', sans-serif;
	font-weight:100;
}


.video {
	padding-top:50px;
}

.video-text {
	color:#bbb;
	font-size:12px;
	}
	
.video-text-title {
	color:#fff;
	font-size:12px;
	}

#info {
	width:95%;
	max-width:900px;
	margin:0 auto 40px auto;
	font-family: 'Montserrat', sans-serif;
	font-size: 0.7em;
	letter-spacing: 0.1px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-o-box-sizing: border-box;
	color:#fff;
	}

#info .info-wrapper {
	padding:10px;
	padding-top:70px;
	/*padding-left:60px;*/
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-o-box-sizing: border-box;
	margin-left: auto;
    margin-right: auto;
    /*max-width: 650px;*/
	/*width:500px;*/
	}
	
#info a {
	/*color:#c09853;*/
	color:hsl(0, 0%, 69%);
	text-decoration:none;
	}
	
#info a:hover {
	color: #fff200;
}
	
#info p {
		margin:5px 0 0 0;
		color:hsl(0, 0%, 69%);	
	}
	
	#contact {
   		margin: auto;
    	width: 500px;
	}

	.contact-logo {
		position: relative;
		top: 47px;
		left:-65px;
	}

	ul.contact {
		list-style:none;
		/*width:455px;*/
		margin-left:auto;
		margin-right:auto;
		margin-bottom:15px;
		color:hsl(0, 0%, 69%);
		padding:0;
	}
	.contact li {
		display:inline;
	}
	
	.contact > li::after {
    	content: " . ";
	}
	
	li:last-child:after { 
	content: ""; 
	}
	
	.container { 
		position: relative; 
		/*width: 100%; */
		width: 98%;
		max-width: 1400px;
		margin: 0 auto; 
		-webkit-transition: all 1s ease;
	  	-moz-transition: all 1s ease;
	  	-o-transition: all 1s ease;
	  	transition: all 1s ease;	
	  
	}
	#filter-block {
		margin-left: auto;
		margin-right:auto;
		width: 478px;
		padding:0;
		margin-top:-32px;
		/*padding-left:20px;*/
	}
	
	#filters {
		/*margin-left: auto;
		margin-right:auto;
		margin-top:-17px;
		padding:0;*/
		list-style:none;
		/*width:425px;*/
		/*overflow:hidden;*/
	}

	#filters li {
		float:left;
		border-right: solid 1px #888;
	}
	
	#filters li:last-child {
		float:left;
		border-right: none;
	}
	
	
	#filters li span {
		display: block;
		padding:0px 10px;		
		text-decoration:none;
		/*color:#666;*/
		color:#fff;
		cursor: pointer;
		font-family: 'Montserrat', sans-serif;
		letter-spacing: 0.5px;
		font-size:1.3em;
		line-height:12px;
		text-transform:uppercase;
	}
	
	#filters li span.active {
		color:#fff200;
	}
 	
	#filters li span:hover {
		color:#fff200;
	}
	
	.filter-vid {
		color: hsl(0, 0%, 100%) !important;
		cursor: pointer;
		display: block;
		font-family:'Montserrat', sans-serif;
		letter-spacing: 0.5px;
		font-weight: 300;
		font-size: 1.3em;
		padding-bottom: 0;
		padding-left: 10px;
		padding-right: 10px;
		padding-top: 0px;
		text-decoration-color: -moz-use-text-color;
		text-decoration-line: none;
		text-decoration-style: solid;
		margin-top:-10px;
		text-transform:uppercase;
	}
	
	.filter-vid a {
		color: hsl(0, 0%, 100%);
		cursor: pointer;
		display: block;
		font-family:'Montserrat', sans-serif;
		font-size: 1.3em;
		text-decoration-color: -moz-use-text-color;
		text-decoration-line: none;
		text-decoration-style: solid;
	}
	
	a.filter-vid:hover {
		color:#fff200 !important;
	}
	
	.filter-vid a:hover {
		color:#fff200 !important;
	}
	
	#filter-block a:hover {
		color:#fff200 !important;
	}


	img.desaturate { 
		-webkit-filter: grayscale(100%); 
		filter: grayscale(100%); 
		-webkit-transition: all 1s ease;
		-moz-transition: all 1s ease;
		-o-transition: all 1s ease;
		-ms-transition: all 1s ease;
		transition: all 1s ease;
		}
		
	img.desaturate:hover { 
		-webkit-filter: grayscale(0%); 
		filter: grayscale(0%); 
		-webkit-transition: all 1s ease;
		-moz-transition: all 1s ease;
		-o-transition: all 1s ease;
		-ms-transition: all 1s ease;
		transition: all 1s ease;
		
		-ms-transform: translate(0px,-20px); /* IE 9 */
   		-webkit-transform: translate(0px,-20px); /* Safari */
    	transform: translate(0px,-20px); /* Standard syntax */
	}
 
	#portfolio-link {
		height: 56px;
		margin-top:-58px;
 	}
 
	#portfoliolist .portfolio {
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		-o-box-sizing: border-box;
		width: 25%;
		margin: 0%;
		display:none;
		float:left;
		overflow:hidden;
		background-color:#222222;
	}


	.portfolio-wrapper {
		overflow:hidden;
		position: relative !important;
		background: #666;
		cursor:pointer;
		margin: 10px;
	}

	.portfolio img {
		width:100%;
		position: relative;
	}
	
	.portfolio .label {
		position: absolute;
		width: 100%;
		height: 50px;
		bottom: -50px;
	}

		.portfolio .label-bg {
			background: #fff200 /*hsl(38, 46%, 54%)*//*#e95a44*/;
			width: 100%;
			height:100%;
			position: absolute;
			top:0;
			left:0;
			padding-top:100px;
			
		}
	
		.portfolio .label-text {
			color:#000;
			position: relative;
			z-index:500;
			padding:5px 8px;
		}
			
			.portfolio .text-category {
				display:block;
				font-size:10px;
				font-family:'Montserrat', sans-serif;
				text-transform: uppercase;
			}
	
			.text-title {
				text-decoration:none;
				color:#000;
				font-family:'Montserrat', sans-serif;
				font-size: 0.9em;
				font-weight: 400;
			}

@media only screen and (min-width: 1820px) {
#portfoliolist .portfolio {
		/*width:48%;*/
		width:25%;
		margin:0;
	}
}

/* #Tablet (Portrait) */
@media only screen and (min-width: 768px) and (max-width: 1350px /*959px*/) {
	.container {
		/*width: 850px;*/
	}
	
	#portfoliolist .portfolio {
		/*width:48%;*/
		width:31%;
		margin:1%;
	}
	
	.portfolio-wrapper {
		margin: 0;
	}

	
	.text-title {
		font-size: 0.7em;
	}
	
	.portfolio .text-category {
		font-size: 0.6em;
	}
}


/*  #Mobile (Portrait) - Note: Design for a width of 320px */
@media only screen and (max-width: 767px) {
	.container { 
		width: 90%; 
	}
	
	#portfoliolist .portfolio {
		width:48%;
		margin:1%;
	}		

	#ads {
		display:none;
	}
	
	#contact {
		width:240px !important;
	}
	.contact-logo {
		position: relative;
		top:0;
		left:100px;
	}
	
	ul.contact {
		text-align:center;
		width:auto;
	}
	
	.contact li {
		display:block;
	}
	
	.contact > li::after {
    	content: "";
	}
	
	#info {
		margin:0 auto 0px auto;
	}
	
	#info p {
		margin-left:auto;
		margin-right:auto;
		/*margin-bottom:50px;*/
	}
	
	#filter-block {
		margin-top:0;
	}
	
	.filter-vid {
		margin-top: 0;
	}
	
	
}


/* #Mobile (Landscape) - Note: Design for a width of 480px */
@media only screen and (min-width: 580px) and (max-width: 767px) {
	.container {
		width: 98%;
	}
	
	#ads {
		display:none;
	}
	
	.text-title {
		font-size: 0.7em;
	}
	
	.portfolio .text-category {
		font-size: 0.6em;
	}
	
	.portfolio-wrapper {
		margin: 0;
	}

	

}

@media only screen and (max-width: 580px) {
	.container {
		width: 95%;
	}
	
	#portfoliolist .portfolio {
		width:100%;
		margin:1%;
	}
	
	#filter-block {
		width:165px;
	}
	
	.text-title {
		font-size: 0.9em;
	}
	
	.portfolio .text-category {
		font-size: 0.7em;
	}
	
}


/* #Clearing */

/* Self Clearing Goodness */
.container:after { content: "\0020"; display: block; height: 0; clear: both; visibility: hidden; }

.clearfix:before,
.clearfix:after,
.row:before,
.row:after {
  content: '\0020';
  display: block;
  overflow: hidden;
  visibility: hidden;
  width: 0;
  height: 0; }
.row:after,
.clearfix:after {
  clear: both; }
.row,
.clearfix {
  zoom: 1; }

.clear {
  clear: both;
  display: block;
  overflow: hidden;
  visibility: hidden;
  width: 0;
  height: 0;
}