@font-face {
	font-family: "Graublau Web Regular";
	src: url("../_type/GraublauWeb.eot");
	src: local("Graublau Web Regular"), local("GraublauWeb-Regular"),
		url("../_type/GraublauWeb.woff") format("woff"),
		url("../_type/GraublauWeb.otf") format("opentype"),
		url("../_type/GraublauWeb.svg#GraublauWeb-Regular") format("svg");
	}
@font-face {
	font-family: "Graublau Web Bold";
	src: url("../_type/GraublauWebBold.eot");
	src: local("Graublau Web Bold"), local("GraublauWeb-Bold"),
		url("../_type/GraublauWebBold.woff") format("woff"),
		url("../_type/GraublauWebBold.otf") format("opentype"),
		url("../_type/GraublauWebBold.svg#GraublauWeb-Bold") format("svg");
	}

body {
	font-size: 62.5%;
	background: rgb(39, 39, 39) url(../_img/bg.png) repeat-x;
	color: white;
	margin: 0;
	padding: 0 0 30px;
	font-family: 'Graublau Web Regular', sans-serif;
}

#wrapper {
	width: 957px;
	margin: 0 auto;
	-webkit-box-shadow: 0 1px 7px rgb(20, 20, 20);
	-moz-box-shadow: 0 1px 7px rgb(20, 20, 20);
	box-shadow: 0 1px 7px rgb(20, 20, 20);
}

p, li {
	font-size: 1.2em;
}

h1, h2, h3, h4, h5, h6 {
	font-family: 'FuturaStd-CondensedBold', 'Futura-CondensedMedium', 'Futura-CondensedExtraBold', 'Futura', 'Beteckna Regular', 'Century Gothic', sans-serif;
	font-weight: 100;
	margin: 5px 0 0;
	text-shadow: 0 0 4px black;
	color: white;
}

h1, h2 {
	text-transform: uppercase;
}

h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
	color: white;
	text-decoration: none;
}

h2 {
	font-size: 1.9em;
}

h3 {
	font-size: 1.7em;
}

h4 {
	font-size: 1.2em;
	text-transform: uppercase;
}


a, a:visited {
	color: white;
}

a:focus {
	outline: none;
}

a img {
	border: none;
}

#nav {
	margin: 0;
	position: relative;
	height: 20px;
	z-index: 10;
	font-size: 1.4em;

}
	
	#model-header, #finish-header {
		font-size: 0.8em;
		line-height: 2.2em;
	}
	
	#model-header {
		display: none;
	}
	
	#model, #finish {
		list-style: none;
		margin: 0;
		padding: 0;
	}

	#model li {
		display: block;
		position: absolute;
		margin: 0 10px 0 0;
		top: 3px;
		
		overflow: hidden;
		text-indent: -999px;
	}

	#model li a {
		display: block;
		height: 28px;
	}

	#model-lars {
		left: 0px;
	}
	
		#model-lars a {
			width: 104px;
			padding: 0 10px 0 0;
			border-right: 2px solid rgb(109, 110, 113);
			background: url(../_img/lars-inactive.png) no-repeat;
		}
		
		#model-lars a:hover, #model-lars a.selected {
			background: url(../_img/lars-active.png) no-repeat;
		}
		
	#model-type1 {
		left: 125px;
	}
	
		#model-type1 a {
			width: 182px;
			padding: 0 10px 0 0;
			border-right: 2px solid rgb(109, 110, 113);
			background: url(../_img/type1-inactive.png) no-repeat;
		}
		
		#model-type1 a:hover, #model-type1 a.selected {
			background: url(../_img/type1-active.png) no-repeat;
		}
		
	#model-type2 {
		left: 328px;
	}

		#model-type2 a {
			width: 182px;
			padding: 0 10px 0 0;
			background: url(../_img/type2-inactive.png) no-repeat;
		}

		#model-type2 a:hover, #model-type2 a.selected {
			background: url(../_img/type2-active.png) no-repeat;
		}

	#engstrom-link {
		float: right;
	}

	#nav-finish {
		float: right;
		width: 194px;
	}
	
	#finish {	
		float: right;
	}
	
	#finish-header {
		float: left;
	}
	
	#finish li {
		display: block;
		float: left;
		margin: 8px 0 0 10px;
		height: 45px;
	}

	#finish a:hover {
		text-indent: 0;
	}

	#finish li a {
		width: 20px;
		height: 20px;
		padding-top: 25px;
		display: block;
		
		text-indent: -999px;
		
		font-size: 0.7em;
		text-decoration: none;
	}

		#palisander a {
			background: url(../_img/palisander-inactive.png) no-repeat top left;
		}
		
		#palisander a:hover, #palisander a.selected {
			background: url(../_img/palisander-active.png) no-repeat top left;
		}
		
		#walnut a {
			background: url(../_img/walnut-inactive.png) no-repeat top left;
		}
		
		#walnut a:hover, #walnut a.selected {
			background: url(../_img/walnut-active.png) no-repeat top left;
		}
		
		#maple a {
			background: url(../_img/maple-inactive.png) no-repeat top left;
		}
		
		#maple a:hover, #maple a.selected {
			background: url(../_img/maple-active.png) no-repeat top left;
		}
		
		#ebony a {
			background: url(../_img/ebony-inactive.png) no-repeat top left;
		}
		
		#ebony a:hover, #ebony a.selected {
			background: url(../_img/ebony-active.png) no-repeat top left;
		}
		
		#black a {
			background: url(../_img/black-inactive.png) no-repeat top left;
		}
		
		#black a:hover, #black a.selected {
			background: url(../_img/black-active.png) no-repeat top left;
		}


#closeup {
	
	position: relative;
	overflow: hidden;
	height: 670px;
	background: url(../_img/closeup.jpg) no-repeat;
}
	
	#header {
		position: absolute;
		top: 0;
		left: 0;
		width: 912px;
		padding: 30px 20px 0;
	}
	
	h1 {
		display: none;
	}
	
	#closeup-image-wrapper {
		/* Set width & height here instead */
		width: 100%;
		height: 659px;
		margin-top: 11px;
		text-align: center;
	}
	
	#closeup-image-wrapper.loading {
		background: url(../_img/loading.gif) no-repeat center center;
	}
	
		#closeup-image {
			margin: 0 auto;
		}
	
	
	#closeup-node-texts {
		position: absolute;
		top: 0;
		width: 100%;
		height: 100%;
	}
	
	.node-text {
		z-index: 1;
		
		display: none;
		position: absolute;
		width: 300px;
		padding: 100px 10px 0;
	}
	
	.node-text.right {
		margin: 10px 0 0 -44px;
		background: url(../_img/node-shine-right.png) no-repeat center top;
	}
	
	.node-text.left {
		margin: 10px 0 0 -258px;
		background: url(../_img/node-shine-left.png) no-repeat center top;
	}
	
	.node-text p {
		font-size: 1.4em;
		line-height: 1.43em;
	}
	
	.node-text p, .node-text h2 {
		text-shadow: 1px 1px 3px black;
	}

	
	/* Nodes */
	#inventor, #node-inventor {
		top: 170px;
		left: 267px;
	}

	#inventor-xls, #node-inventor-xls {
		top: 170px;
		left: 267px;
	}
	
	
	#zero-tim, #node-zero-tim {
		top: 320px;
		left: 600px;
	}

	#zero-tim-xls, #node-zero-tim-xls {
		top: 320px;
		left: 350px;
	}
	

	#capacitors, #node-capacitors {
		top: 375px;
		left: 445px;
	}

	#capacitors-xls, #node-capacitors-xls {
		top: 400px;
		left: 500px;
	}
	
	
	#class-a, #node-class-a {
		top: 320px;
		left: 400px;
	}

	#class-a-xls, #node-class-a-xls {
		top: 295px;
		left: 645px;
	}
	
	
	#materials, #node-materials {
		top: 265px;
		left: 605px;
	}

	#materials-xls, #node-materials-xls {
		top: 305px;
		left: 550px;
	}


	#design, #node-design {
		top: 270px;
		left: 480px;
	}

	#design-xls, #node-design-xls {
		top: 300px;
		left: 267px;
	}
	

	#mantle, #node-mantle {
		top: 120px;
		left: 675px;
	}

	#mantle-xls, #node-mantle-xls {
		top: 270px;
		left: 450px;
	}
	

	#pure-sound, #node-pure-sound {
		top: 260px;
		left: 345px;
	}
	
	#pure-sound-xls, #node-pure-sound-xls {
		top: 270px;
		left: 330px;
	}


	#inputs, #node-inputs {
		top: 400px;
		left: 675px;
	}
	
	#inputs-xls, #node-inputs-xls {
		top: 390px;
		left: 675px;
	}
	
	
	#architecture, #node-architecture {
		top: 182px;
		left: 300px;
	}
	
	/* End Nodes */

	#closeup-nodes {
		position: absolute;
		top: 0;
		width: 100%;
		height: 100%;
		z-index: 2;
	}
	
		#closeup-nodes ul {
			list-style: none;
		}
	
		#closeup-nodes li {
			position: absolute;
		}
		
		#closeup-nodes #closeup-node-list li a img {
			width: 20px;
			height: 20px;
			border: none;
			opacity:0.5;
		}
		
		
		#closeup-node-list li {
			display: none;
		}
		
		
		#closeup-node-sets li {
			top: 280px;
		}
			
			#closeup-node-sets li a {
				height: 105px;
				display: block;
				text-indent: -999px;
				overflow: hidden;
			}
			
			#closeup-node-sets li a:hover {
				opacity: 0.8;
			}
			
			#rotate-left {
				left: 17%;
			}
			
				#rotate-left a {
					background: url(../_img/arrow-left-inactive.png) no-repeat;
					width: 49px
				}
				
				#rotate-left a:hover {	
					background: url(../_img/arrow-left-active.png) no-repeat;
				}
			
			#rotate-right {
				right: 17%;
			}
			
				#rotate-right a {	
					background: url(../_img/arrow-right-inactive.png) no-repeat;
					width: 45px;
				}
			
				#rotate-right a:hover {	
					background: url(../_img/arrow-right-active.png) no-repeat;
				}
	
	
	#model-info {

	}
	
	#model-info .node-text {
		z-index: 1;
		display: none;
		position: relative;
		width: 280px;
		padding: 0 20px;

		position: absolute;
		bottom: 10px;
		left: 0;
	}
	
	#model-info .node-text.lars {
		width: 937px;
		display: block;
	}
	
	#model-info .node-text .column {
		width: 30%;
		padding-right: 20px;
		float: left;
		display: block;
	}
	
	#notes {
		position: absolute;
		top: 120px;
		left: 10%;
		margin-left: -2%;
		width: 80%;
		z-index: 1000;
		
		background: black;
		padding: 10px 20px;
		-moz-border-radius: 12px; /* FF1+ */
	  	-webkit-border-radius: 12px; /* Saf3+, Chrome */
	    border-radius: 12px; /* Opera 10.5, IE 9 */
		
		 -moz-box-shadow: 0px 0px 4px #444; /* FF3.5+ */
	  -webkit-box-shadow: 0px 0px 4px #444; /* Saf3.0+, Chrome */
	          box-shadow: 0px 0px 4px #444; /* Opera 10.5, IE 9.0 */
		
		border: 2px solid rgb(140, 140, 140);
	}
	
	#notes .note {
		float: left;
		width: 46%;
		padding: 0 4% 0 0;
	}

	#notes a.close-link {
		position: absolute;
		top: 0;
		right: 0;
		padding: 3px 5px;
		margin: 10px;
		text-transform: uppercase;
		text-decoration: none;
		background: white;
		color: black;
		
		-moz-border-radius: 5px; /* FF1+ */
	  	-webkit-border-radius: 5px; /* Saf3+, Chrome */
	    border-radius: 5px; /* Opera 10.5, IE 9 */
	}
	
	#notes a.close-link:hover {
		color: rgb(50, 50, 50);
		background: rgb(200, 200, 200);
	}
			
#articles {
	background: black url(../_img/bottom-panel.jpg) no-repeat bottom left;
	clear: both;
}
	
	.article {
		display: none;
		padding: 20px 20px 10px;
		clear: both;
		color: rgb(177, 179, 180);
	}
	
	.article h2 {
		margin-bottom: 10px;
	}
	
	.article ul {
		padding-left: 20px;
		margin-left: 0;
	}
	
	.article p, .article ul {
		margin: 0.5em 0 1.0em;
	}
	
	.article blockquote {
		margin-left: 0;
	}
	
	.article a, .article a:visited {
		color: rgb(177, 179, 180);
	}
	
	.article a[rel~="external"] {
		background: url(../_img/external-link.gif) 99% 40% no-repeat;
		padding-right: 18px;
	}
		
		.review {
			padding: 10px 0;
			border-bottom: 1px solid rgb(135, 136, 138);
		}
		
		.review:last-child {
			border: none;
		}
		
		.entry, .sidebar {
			margin: 0;
			padding: 0 0 20px 0;
			clear: none;
		}
		
		.entry {
			float: left;
			width: 598px;
			clear: left;
		}

		.sidebar {
			margin-top: 3.1em;
			float: right;
			clear: right;
		}

#teasers {
	background: black url(../_img/teasers.jpg) repeat-x;
	height: 210px;
	padding: 25px 0 22px;
}
	#teasers .teaser {
		width: 278px;
		float: left;
		padding: 0 20px;
		
		height: 200px;
		
		display: block;
		position: relative;
		
		border-right: 1px solid rgb(118, 119, 119);
	}
	
	#teasers .teaser.last, .sidebar {
		border: none;
		width: 279px;
	}
	
	#teasers .teaser p {
		margin: 0.8em 0 0.8em;
		color: rgb(157, 160, 159);
		font-weight: normal;
		line-height: 1.5em;
		text-shadow: 0 0 4px black;
	}
	
	#teasers .read-more {
		position: absolute;
		bottom: 0;
		display: block;
		clear: both;
	}
	
	#teasers .read-more-link {
		display: block;
		width: 57px;
		height: 22px;
		line-height: 21px;
		text-align: center;
		text-transform: uppercase;
		font-size: 9px;
		text-shadow: 0 1px 1px #555;
		text-decoration: none;
		color: #eee;
		margin: 0;
		padding: 0;
		word-wrap: none;
		overflow: hidden;
	}

	#teasers .read-more-link:hover {
		color: white;
		text-shadow: 0 1px 1px #222;
		opacity: 0.8;
	}
	

#footer {
	background: black;
	clear: both;
	display: block;
	padding: 15px 20px 10px;
}

#footer h2 {
	text-indent: -999px;
	overflow: hidden;
}

#footer h2 a {
	display: block;
	width: 154px;
	height: 17px;
	background: url(../_img/engstromengstrom.gif) no-repeat;
}

#footer p {
	font-size: 1.3em;
}

#footer p, #footer h2 {
	float: right;
	height: 17px;
	line-height: 17px;
	margin: 0 15px 5px 0;
}

.floatleft {
	float: left;
}

.gold {
	color: rgb(255, 180, 60);
}

.pink .colorize, a:hover span.gold, a:hover span.active {
	color: rgb(199, 0, 92);
}
	.pink .read-more-link {
		background: url(../_img/button-pink.png) no-repeat top left;
	}
	
.blue .colorize {
	color: rgb(118, 200, 223);
}
	.blue .read-more-link {
		background: url(../_img/button-blue.png) no-repeat top left;
	}
	
.green .colorize {
	color: rgb(136, 163, 48);
}
	.green .read-more-link {
		background: url(../_img/button-green.png) no-repeat top left;
	}
	
.inactive, .inactive .colorize, .inactive * {
	color: rgb(62, 61, 64) ! important;
}

	.inactive .read-more-link {
		color: rgb(62, 61, 64) ! important;
		text-shadow: none ! important;
		background: url(../_img/button-inactive.png) no-repeat top left;
		
	}

#footer .colorize {
	color: rgb(160, 160, 160);
	margin: 0 3px 0 10px;
}

.clear {
	float: none;
	clear: both;
}

.image-caption {
	font-size: 1.1em;
	padding-bottom: 1.4em;
}

.uppercase {
	text-transform: uppercase;
}

/* Changes */

#nav-finish, #closeup-node-texts, #closeup-nodes {
	display: none;
}