/* ==========================================================================
   Eik Zetterberg styles 
   ========================================================================== */
/* Font-face */

@font-face {
	font-family:"Trade Gothic W01 Cn 18";
	src: url('fonts/087e5c21-3358-4cf3-9d2c-289a03a48292.eot'); /* IE9 Compat Modes */
	src: url('fonts/087e5c21-3358-4cf3-9d2c-289a03a48292.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
	     url('fonts/fb754dec-aa8f-444c-be48-868464c47ab0.woff') format('woff'), /* Modern Browsers */
	     url('fonts/295ff20c-2b48-4fa6-be92-a53bbf9bbbb4.ttf')  format('truetype'), /* Safari, Android, iOS */
	     url('fonts/c573d9d0-0726-4b95-aeee-fb621a299563.svg#c573d9d0-0726-4b95-aeee-fb621a299563') format('svg'); /* Legacy iOS */
	}

html, body {
	color: #282828;
	text-rendering: optimizeLegibility;
	font-size: 10px; /* 4px */
    line-height: 1.4;
}

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

img { vertical-align: middle;image-rendering:optimizeQuality;-ms-interpolation-mode:bicubic;}

/* Containers */

body {
	overflow: hidden;
}


#wrapper {
	width: 64%;
	margin: 0 auto;
	position: relative;
	background: #fff;
}

.touch #wrapper {
	width: 80%;
}
.container {
	position: relative;
	overflow: hidden;
	opacity: 0;
/*	background: #cc0000;
*/}

.container a {
	width: 100%;
	height: auto;
	display: none;
}

.container a:first-child {
	display: block;
}

.placeholder {
	width: 100%;
	height: auto;
	visibility: hidden;
}

.content, .overlay {
	position: absolute;
	top: 0;
	left: 0;
	width: 100.5%;
	height: auto;	
}

.overlay {
	opacity: 0;
}

.container:hover .overlay {
	opacity: 1;
	cursor: pointer;
	z-index: 999;
}
		
#contact {
	width: 12.333333333%;
	height: auto;
	display: block;	
	position: absolute;
	top: 6.94610778%;
	left: 4%;
	z-index: 10;
}

#internet {
	width: 25%;
	height: auto;
	display: block;	
	position: absolute;
	top: 13.5329341%;
	left: 12.25%;
	z-index: 1;
}

#magazines {
	width: 18.75%;
	height: auto;
	display: block;	
	position: absolute;
	top: 0%;
	left: 40.5%;
	z-index: 1;
}

#branding {
	width: 25%;
	height: auto;
	display: block;	
	position: absolute;
	top: 3.59281437%;
	left: 67.5%;
	z-index: 8;
	background: transparent;
}

#film {
	width: 52.5%;
	height: auto;
	display: block;	
	position: absolute;
	top: 22.754491%;
	left: 47.5%;
	z-index: 1;
}

#editorial {
	width: 18.75%;
	height: auto;
	display: block;	
	position: absolute;
	top: 43.1137725%;
	left: 0%;
	z-index: 1;
}

#logo {
	width: 18.3333333%;
	height: auto;
	display: block;	
	position: absolute;
	top: 43.1137725%;
	left: 24.1666667%;
	z-index: 1;
}

#fashion {
	width: 37.5%;
	height: auto;
	display: block;	
	position: absolute;
	top: 57.4850299%;
	left: 5%;
	z-index: 2;
}

#advertising {
	width: 12.5%;
	height: auto;
	display: block;	
	position: absolute;
	top: 73.8922156%;
	left: 44.5%;
	z-index: 1;
}

#design {
	width: 18.75%;
	height: auto;
	display: block;	
	position: absolute;
	top: 71.8562874%;
	left: 65.4166667%;
	z-index: 1;
}


#personal {
	width: 12.5%;
	height: auto;
	display: block;	
	position: absolute;
	top: 83.8323353%;
	left: 81.9166667%;
	z-index: 11;
}

#type {
	opacity: 0;
}

#type {
	width: 100%;
	height: auto;
	display: block;	
	position: absolute;
	bottom: 0;
	left: 1px;
	z-index: 1;
	text-align: center;
	text-transform: uppercase;
	letter-spacing: 0.25em;
	font-weight: normal;
	font-family:'Trade Gothic W01 Cn 18', Arial, sans-serif;
}

#type a {
	text-decoration: none;
	color: #282828;
}

#type a:hover {
	border-bottom: 1px solid #282828;
}