@charset "utf-8";
/* CSS Document */

/* Flow */

.flow {
	overflow:hidden;
	margin-bottom:15px;
	clear:both;
}

.flow_entry {
	float:left;
	position:relative;
	margin:1%;
	overflow:hidden;
	background-color:rgba(0, 0, 0, .5);
}

.flow .square {
	width:31.3%;
	padding-bottom:31.33%;
	background-color:rgba(0, 0, 0, 0);
}

.flow .large_landscape {
	width:98%;
	padding-bottom:49%;
}

.flow .large_portrait {
	width:98%;
	padding-bottom:147%;
}

.flow_entry img {
	width:101%;
	position:absolute;
	top: 50%;
  left: 50%;
	-o-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	-webkit-transform: translate(-50%, -50%);
	-moz-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
}

.flow_entry .flow_entry_details {
	position:absolute;
	bottom:0px;
	width:100%;
	background: rgba(0, 0, 0, .5);
	color:#ffffff;
	text-shadow: 1px 1px 1px #000000;
	overflow:hidden;
	white-space: nowrap;
	text-align:left;
}

.flow_entry .flow_entry_details a {
	color:#ffffff;
}

.flow_entry .flow_entry_details a:hover {
	text-decoration:none;
	color:#0294e2;
}

.flow_entry .flow_entry_details .title {
	width:auto;
	overflow:hidden;
	line-height:100%;
	text-overflow: ellipsis;
	padding:4px;
	font-size:.8em;
	display:none;
}

.flow_entry .flow_entry_details .info {
	overflow:hidden;
	font-size:.78em;
	line-height:100%;
	text-overflow: ellipsis;
	padding:4px;
	padding-top:0px;
	font-size:.7em;
	display:none;
}

.flow .large_landscape .flow_entry_details .title, .flow .large_portrait .flow_entry_details .title {
	display:block;
}



@media screen and (min-width: 480px) {
	.flow_entry {
		margin:.5%;
	}
	
	.flow .large_landscape {
		width:99%;
		padding-bottom:49.5%;
	}
	
	.flow .large_landscape img {
		max-width:700px;
	}
	
	.flow .large_portrait {
		width:74%;
		padding-bottom:99%;
	}
	
	.flow .large_portrait img {
		max-height:700px;
	}
	
	.flow .square {
		width:24%;
		padding-bottom:24%;
	}
	
	.flow .square img {
		max-width:225px;
	}
	
	.flow_entry .flow_entry_details .title {
		display:block;
	}
	
	.flow .large_landscape .flow_entry_details .title, .flow .large_portrait .flow_entry_details .title {
		font-size:1em;
	}
	
	.flow .large_landscape .flow_entry_details .info, .flow .large_portrait .flow_entry_details .info {
		display:block;
	}
}


@media screen and (min-width: 640px) {
	.flow .large_landscape {
		width:59%;
		padding-bottom:39%;
	}
	
	.flow .large_portrait {
		width:39%;
		padding-bottom:59%;
	}
	
	.flow .square {
		width:19%;
		padding-bottom:19%;
	}

	.flow_entry .flow_entry_details .info {
		font-size:.8em;
	}
	
}

@media screen and (min-width: 960px) {
	.flow_entry .flow_entry_details .title {
		font-size:.9em;
	}
	
	.flow .large_landscape .flow_entry_details .title, .flow .large_portrait .flow_entry_details .title {
		font-size:1.2em;
	}
	
	.flow .large_landscape .flow_entry_details .info, .flow .large_portrait .flow_entry_details .info {
		font-size:1em;
	}
}


.flow_entry:nth-of-type(n+5){
	display:none;
}
@media screen and (min-width: 480px) {
	.flow_entry:nth-of-type(5){
		display:block;
	}
}



.thumb_entries .thumb_entry:nth-of-type(5) {
	display:none;
}

@media screen and (min-width: 320px) {
	.thumb_entries .thumb_entry:nth-of-type(4) {
		display:none;
	}
}

@media screen and (min-width: 568px) {
	.thumb_entries .thumb_entry:nth-of-type(4) {
		display:block;
	}
}

@media screen and (min-width: 769px) {
	.thumb_entries .thumb_entry:nth-of-type(5) {
		display:block;
	}
}

/* End Flow */



.index_splash_container {
	clear:both;
	background-repeat:no-repeat;
	background-position: center center;
	background-size:auto auto;
	background-color:#202020;
	width:100%;
	max-width:1024px;
	margin:0px auto;
	text-align:center;
	overflow:hidden;
	position:relative;
	margin-bottom:1em;
}

.index_splash_inner {
	background-color:rgba(32,32,32,.6);
	padding:11%;
}

.index_secondary_splash_container {
	width:100%;
	max-width:1024px;
	margin:0px auto;
	text-align:center;
	background-color:#333;
	padding:2em 0;
}

@media screen and (max-width: 320px) {
	.index_splash_container h1 {
		font-size:1.55em;
	}
	
	.index_splash_container h2 {
		font-size:1.20em;
	}
	
	.index_splash_container h3 {
		font-size:1em;
	}
}

@media screen and (min-width: 321px) {
	.index_splash_container h1 {
		font-size:2.0em;
	}
	
	.index_splash_container h2 {
		font-size:1.5em;
		line-height:1.5em;
	}
	
	.index_splash_container h3 {
		font-size:1.25em;
		line-height:1.25em;
	}
}

@media screen and (min-width: 701px) {
	.index_splash_container h1 {
		font-size:2.2em;
		line-height:2.2em;
	}
	
	.index_splash_container h2 {
		font-size:1.66em;
		line-height:1.66em;
	}
	
	.index_splash_container h3 {
		font-size:1.5em;
		line-height:1.5em;
	}
}