/* CSS Document */

#pagewrap {
	position:			relative;

	margin:				0;
	padding:			0;

	width:				100%;
	height:				100%;
}

#mobilewrap {
	display:			none;
}

#desktopwrap {
	position:			relative;
	top:				50%;

	margin:				-160px auto 0 auto;
	padding:			0;

	width:				960px;
	height:				320px;
	
	overflow:			hidden;

	background-color:	rgb(255,255,255);
	
	box-sizing:			border-box;

	opacity:			0;
	transition:			opacity 2s;
}

.isready #desktopwrap {
	opacity:			1;
}

#desktopwrap header {
	opacity:			0;
	transition:			opacity 2s;	
	
	z-index:			1;	
}

.isready #desktopwrap header {
	opacity:			1;
	transition-delay: 	0.5s;	
}

section#dividers {
	opacity:			1;
	
	z-index:			2;
}

section.datatile {
	top:				77px;
	
	width:				180px;
	height:				215px;
	
	overflow:			hidden;
	
	opacity:			1;
}

section.datatile > div {
	position:			absolute;
	top:				0;
	left:				0;
	
	margin:				0;
	padding:			0;
	
	width:				100%;
	height:				100%;
	
	transition-timing-function:ease-in;	
}

section.datatile > div > img {
	width:				100%;
	height:				auto;
}

section.datatile > div.icon {
	top:				-215px;
	
	transition:			top 0.5s;		
}

section.datatile.ishighlighted > div.icon {
	top:				0;
	transition-delay: 	0.75s;			
}

section.datatile.ishighlighted > div.icon.two {
	transition-delay: 	1.0s;			
}

section.datatile.ishighlighted > div.icon.three {
	transition-delay: 	1.25s;			
}

section.datatile > div.title {
	top:				-215px;
	
	transition:			top 0.5s;		
}

section.datatile.ishighlighted > div.title {
	top:				0;
	transition-delay: 	0.5s;			
}

section.datatile > div.description {
	left:				180px;
	
	transition:			left 0.5s;		
}

section.datatile.ishighlighted > div.description {
	left:				0;
	transition-delay: 	0;			
}

section.datatile > div.link {
	opacity:			0;
	
	transition:			opacity 0.5s;		
	
	z-index:			99;
}

section.datatile > div.link a {
	display: block;
	width:100%;
	height:100%;
}
section.datatile.ishighlighted > div.link {
	opacity:			1;
	transition-delay: 	0;		
	
	transition-timing-function: linear;	
}

section#people {
	left:				32px;

	z-index:			10;
}

section#community {
	left:				212px;

	z-index:			20;
}

section#environment {
	left:				392px;

	z-index:			30;
}

section#governance {
	left:				572px;

	z-index:			40;
}

section#valuechain {
	left:				752px;

	z-index:			50;
}