.page{
	width: 100%;
	margin: 0 auto;
	position: relative;
}
#container{
	max-width: 1600px;
	margin: auto;
}
/*#container img{
	width: 100%;
	height: auto;
}*/

#loadscreen{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: #000000;    
	z-index: 2;	
	color: #ffffff;
	font-size: 2em;
}
	#loadscreen span{
		margin: auto;
		position: absolute;
		text-align: center;
		top: 15%;
		width: 100%;
	}
canvas {
	height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
	z-index: 0;
}
/* MASONRY */
.grid-sizer{
	width: 20%;	
}
.grid-gutter{
	width:0%;
	height:0%;		
}
.item{
	width: 20%;	
	background: #cccccc;
	cursor: pointer;
	height: auto;
	position: relative;
}
	.item > img:first-child{
		position: relative;    
		visibility: hidden;
	}
/* WIDTHS */
.w20{
	width: 20%;	
}
.w40{
	width: 40%;	
}
/* ITEM PARTS */
.bg{
	background: url("../images/bg-75-opacity.png") repeat scroll 0 0 transparent;
	height: 100%;
	left: 0;
	position: absolute;
	top: 0;
	width: 100%;
	display: none;
	z-index: 1;
}
.homemodal{
    left: 0;
    position: absolute;
    top: 0;
    z-index: 1;	
}
.spinner_container{
	left: 10%;
    position: absolute;
    top: 15%;
}
.slideshow-list{
	display: none;	
}
.slideshow-container{
    left: 0;
    position: absolute;
    top: 0;
    z-index: 1;	
}
	.slideshow-container .next{
		width: 31px;
		height: 57px;
		position: absolute;
		top: 35%;
		right: 1%;
		background: url("../images/slideshow-next-button.png");
	}
	.slideshow-container .prev{
		width: 31px;
		height: 57px;
		background: #ff0000;
		position: absolute;
		top: 35%;
		left: 1%;
		background: url("../images/slideshow-previous-button.png");
	}
a.link{
	top: 0;
	left: 0;
	position: absolute;
	width: 100%;
	height: 100%;
	z-index: 2;
	opacity: 0.4;
	display: none;
}
	a.link .content{
		bottom: 10px;
		left: 0;
		padding: 0 10px;
		position: absolute;
		width: 90%;
		z-index: 0;
	}
/*.title{
	position: absolute;
	bottom: 5%;
	left: 5%;
	z-index: 0;
}*/
	a.summary h2,
	.title h2,
	.link h2{    
		color: #FFFFFF;
		font-size: 1.538em;
		text-shadow: 0 0 5px #000000;
		margin-bottom: 3px;
		text-transform: uppercase;
		font-weight: bold;
	}
	a.summary h3,
	.title h3{    
		color: #FFFFFF;
		font-size: 0.923em;
		text-shadow: 0 0 5px #000000;
		text-transform: uppercase;
		font-weight: bold;
	}
	a.summary p{
		color: #FFFFFF;
		text-decoration: none;
		text-shadow: 0 0 5px #000000;   
		font-size: 1.3em;
		line-height: 1.1em;
	}
	.playbutton{
		background: url("../images/play-button-1.png") no-repeat;
		float: left;
		height: 20px;
		width: 18px;
	}
	.icon-article{
		background: url("../images/icon-article.png") no-repeat;
		float: left;
		height: 20px;
		width: 18px;
	}
	.icon-slideshow{
		background: url("../images/icon-slideshow.png") no-repeat;
		float: left;
		height: 19px;
		width: 21px;
	}
	a.link h2,
	a.summary h2{
		float: left;
		font-size: 1.077em;
		line-height: 1em;
		margin-top: 3px;
		width: 90%;
	}
a.summary{
	top: 0;
	left: 0;
	position: absolute;
	width: 100%;
	height: 100%;
	z-index: 1;
	opacity: 0.4;
}
	a.summary .content{
		bottom: 10px;
		left: 0;
		padding: 0 10px;
		position: absolute;
		width: 90%;
		z-index: 0;
	}
	.responsive_object { 
		height: 100%;
		position: absolute;
		width: 100%;
	} 
		.responsive_object iframe, 
		.responsive_object object, 
		.responsive_object embed { 
		   height: 100%;
			position: absolute;
			width: 100%;
			z-index: 2;
		}
@media screen and (min-width: 720px) {
  /* 10 columns for larger screens */
  .grid-sizer { width: 20%; }
}
@media handheld, only screen and (max-width: 800px) {
	.grid-sizer{
		width: 50%;	
	}
	.item { 
		width: 50%;	
	}
	div.item:nth-child(3n+3) { 
		width: 100%;
	}
}