/*
Niklas Goslar
© Copyright 2011 by Niklas Goslar & Jens Buss
*/

/*------------ GLOBAL -------------------------*/

* {
	margin: 0;
	padding: 0;
}

body {
	background-color: black;
	color: white;
	margin: 50px;
	
	font: normal 10px/14px Helvetica, Arial, sans-serif;
	text-transform: uppercase;
}

.container {
	width: 100%;
}

.containment {
	width: 90%;
	margin: 0 auto;
}

.clear {
	clear: both;
}

p {
	margin: 0 0 14px;
}

a {
	text-decoration: none;
}

a:hover, a:visited {
	color: #aeaeae;
}

a img {
	border: none;
}

/*------------ HEAD -------------------------*/

#head {
	margin: 15px 0;
}

#head h1 a#logo {
	display: block;
	width: 238px;
	height: 29px;
	background: url(../img/niklas-goslar.gif);
	text-indent: -9000px;
}

#head h2#title {
	width: 86px;
	height: 23px;
	background: url(../img/niklas-goslar.gif) 0 -29px;
	text-indent: -9000px;
	
	margin: 0 0 20px;
}

ul#navigation {
	list-style-type: none;
}

ul#navigation li {
	display: inline-block;
	margin: 0 40px 0 0;
}

ul#navigation li a {
	display: block;
	height: 14px;
	background: url(../img/niklas-goslar.gif);
	text-indent: -9000px;
}

ul#navigation li a.showreel {
	width: 80px;
	background-position: 0 -52px;
}
ul#navigation li a.showreel:hover, ul#navigation li a.showreel.active {
	background-position: 0 -66px;
}
ul#navigation li a.info {
	width: 49px;
	background-position: 0 -80px;
}
ul#navigation li a.info:hover, ul#navigation li a.info.active {
	background-position: 0 -94px;
}
ul#navigation li a.references {
	width: 95px;
	background-position: 0 -108px;
}
ul#navigation li a.references:hover, ul#navigation li a.references.active {
	background-position: 0 -122px;
}
ul#navigation li a.contact {
	width: 66px;
	background-position: 0 -136px;
}
ul#navigation li a.contact:hover, ul#navigation li a.contact.active {
	background-position: 0 -150px;
}

/*------------ CONTENT -------------------------*/

#content h1, #content h2, strong {
	font-size: 100%;
	font-weight: normal;
}

#content ul {
	list-style-type: none;
}

#content li li {
	margin: -14px 0 0;
	padding: 0 0 14px 80px;
}

.entry {
	float: left;
	margin: 0 20px 15px 0;
	width: 266px;
	overflow: hidden;
	position: relative;
}

.entry img {
	display: block;
	margin: 0 0 5px;
	width: 266px;
	height: 149px;
}
.entry p {
	position: absolute;
	top: 48%;
	left: 0;
	z-index: 10;
	width: 100%;
	text-align: center;
	display: none;
}
.entry:hover p {
	display: block;
}
.entry:hover img {
	opacity: .4;
}

.entry a {
	display: block;
	color: white;
}

.highlight, strong, a {
	color: #00d0b7; /* turquoise */
}

iframe {
	margin: 0 20px 15px 0;
}
.artImg {
	display: block;
	margin: 0 14px 14px 0;
}