@CHARSET "UTF-8";

/* Fonts */

@font-face {
    font-family: 'MuseoSans500';
    src: url('../fonts/MuseoSans_500-webfont.eot');
    src: url('../fonts/MuseoSans_500-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/MuseoSans_500-webfont.woff') format('woff'),
         url('../fonts/MuseoSans_500-webfont.ttf') format('truetype'),
         url('../fonts/MuseoSans_500-webfont.svg#MuseoSans500') format('svg');
    font-weight: normal;
    font-style: normal;

}
/*****************************************************************
 * Basic Element and Class Styles
 *****************************************************************/

* {
	margin: 0;
	padding: 0;
}

body {
	background: #1b1b1b url('../images/equalizer.jpg') no-repeat center bottom;
}


.wrapper {
	width: 980px;
	margin: 0 auto;
	position: relative;
}

/******************************************************************************
 * Positioning Containers
 *****************************************************************************/

#container {
	width: 100%;
}

div#mantle {
	position: absolute;
	top: 142px;
	left: 0;
	z-index: 100;
}

#globalnavi,
div#mantle iframe {
	width: 240px;
	z-index: 100;
}

div#mantle iframe {
	margin-top: 20px;
}

.box-bg,
div#mantle iframe {
	background: #111;
	-webkit-box-shadow: 2px 3px 3px 3px rgba(0, 0, 0, 0.5);
	-moz-box-shadow: 2px 3px 3px 3px rgba(0, 0, 0, 0.5);
	box-shadow: 2px 3px 3px 3px rgba(0, 0, 0, 0.5); 
}

#impressions {
	position: relative;
	height: 418px;
	border-top: 1px solid #181818;
}

#impressions img {
	padding: 15px;
	position: absolute;
	left: 0;
	top: 0;
}

#sidenavi {
	position: absolute;
	top: 43px;
	right: 250px;
}

#page_header {
	background: #0f0f0f;
	height: 112px;
}

#branding {
	width: 260px;
	height: 65px;
	padding-top: 20px;
}

#page_content {
	border-top: 1px solid #1d1d1d;
	background: url('../images/bg.gif') repeat left top;
}

#page_content .wrapper {
	padding: 30px 0;
	min-height: 900px;
}

#main_content {
	margin-left: 260px;
	width: 720px;
	min-height: 545px; 
}

#main_content article header {
	height: 214px;
	background-repeat: no-repeat;
	background-position: left top;
	position: relative;
	margin-bottom: 15px;
}

#main_content article header h1 {
	position: absolute;
	bottom: 0;
	left: 0;
	padding: 15px;
	width: 690px;
	height: 20px;
	line-height: 20px;
	background: url('../images/title_bg.png') repeat left top;
}

#main_content article header.HardStudioDefault {
	background-image: url('../images/home.jpg');
}

#main_content article header.HardStudio {
	background-image: url('../images/studio.jpg');
}

#main_content article header.HardNews {
	background-image: url('../images/news.jpg');
}

#main_content article header.HardPeople {
	background-image: url('../images/people.jpg');
}

#main_content article header.HardSound {
	background-image: url('../images/sound.jpg');
}

#main_content article header.HardWare {
	background-image: url('../images/hardware.jpg');
}

#main_content article header.HardLinks {
	background-image: url('../images/links.jpg');
}

#main_content div.page-inner {
	padding: 15px;
	position: relative;
}

#page_home #main_content {
	padding: 0;
	width: 720px;
}

#page_footer {
	color: #1b1b1b;
	background: #0f0f0f;
}

#address {
	position: absolute;
	top: 15px;
	right: 15px;
	color: #fff;
}

#address_additional {
	margin-top: 10px;
}

#sitemap {
	float: left;
	margin: 15px 0;
	width: auto;
}

#sitemap h1, 
#address h1 {
	color: #fff;
}

#search {
	position: absolute;
	right: 0;
	top: 38px;
	width: 234px;
}

#copyright {
	clear: both;
}

#copyright, #copyright * {
	color: #ccc;
	font-size: 10px;
	text-decoration: none;
	padding-bottom: 10px;
}

/******************************************************************************
 * Homepage
 *****************************************************************************/
 
#news,
#highlights {
	width: 690px;
	padding: 15px;
	margin-top: 20px;
}

#news article,
#highlights article {
	margin: 15px 15px 0 0;
}

#news h2,
#highlights h2 {
	padding: 0;
}

/******************************************************************************
 * Navigation Design
 *****************************************************************************/

/* Globalnavi */


#globalnavi a {
	text-decoration: none;
	font-family: "MuseoSans500", Trebuchet, sans-serif;
	text-transform: uppercase;
	display: block;
}


#globalnavi > ul > li {
 	-webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; 	border-bottom: 1px solid #070707;
 	border-top: 1px solid #181818;
 	position: relative;
}

#globalnavi > ul > li:last-child {
	border-bottom: 0;
}

#globalnavi > ul > li > a {
 	color: white;
 	font-size: 20px;
 	line-height: 20px;
 	height: 20px;
 	padding: 14px 0 14px 30px;
}

#globalnavi > ul > li > span {
	background-image: url('../images/navi_studios.png');
	background-position: 0 0;
	background-repeat: no-repeat;
	width: 10px;
	height: 10px;
	position: absolute;
	top: 19px;
	left: 10px;
	-webkit-transition: all 0.3s linear;
	-moz-transition: all 0.3s linear;
	-o-transition: all 0.3s linear;
	transition: all 0.3s linear;
}

#globalnavi > ul > li.navi-news > span {
	background-image: url('../images/navi_news.png');
}

#globalnavi > ul > li.navi-team > span {
	background-image: url('../images/navi_team.png');
}

#globalnavi > ul > li.navi-sound > span {
	background-image: url('../images/navi_sound.png');
}

#globalnavi > ul > li.navi-hardware > span {
	background-image: url('../images/navi_hardware.png');
}

#globalnavi > ul > li.navi-links > span {
	background-image: url('../images/navi_links.png');
}

#globalnavi ul.level0 li.active span,
#globalnavi ul.level0 li.open span, 
#globalnavi ul.level0 li:hover span {
 	-webkit-transform:rotate(45deg);
   	-moz-transform:rotate(45deg);
   	-ms-transform:rotate(45deg);
   	-o-transform:rotate(45deg);
  	 transform:rotate(45deg);
}

#globalnavi > ul > li.active.navi-studios > a, 
#globalnavi > ul > li.open.navi-studios > a,
#globalnavi > ul > li.navi-studios > a:hover {
	color: #dd0202;
}

#globalnavi > ul > li.active.navi-news > a, 
#globalnavi > ul > li.open.navi-news > a,
#globalnavi > ul > li.navi-news > a:hover {
	color: #ff6e0d;
}

#globalnavi > ul > li.active.navi-team > a, 
#globalnavi > ul > li.open.navi-team > a,
#globalnavi > ul > li.navi-team > a:hover {
	color: #fed42a;
}

#globalnavi > ul > li.active.navi-sound > a, 
#globalnavi > ul > li.open.navi-sound > a,
#globalnavi > ul > li.navi-sound > a:hover {
	color: #0da60d;
}

#globalnavi > ul > li.active.navi-hardware > a, 
#globalnavi > ul > li.open.navi-hardware > a,
#globalnavi > ul > li.navi-hardware > a:hover {
	color: #1371fe;
}

#globalnavi > ul > li.active.navi-links > a, 
#globalnavi > ul > li.open.navi-links > a,
#globalnavi > ul > li.navi-links > a:hover {
	color: #b325e2;
}

#globalnavi > ul > li > ul {
	background-color: #070707;
}

#globalnavi > ul > li > ul > li {
}

#globalnavi > ul > li > ul > li > a {
	color: white;
	font-size: 16px;
	padding: 10px 0 10px 30px;
	line-height: 16px;
}

#globalnavi > ul > li.navi-studios > ul > li:hover a, 
#globalnavi > ul > li.navi-studios > ul > li.active a, 
#globalnavi > ul > li.navi-studios > ul > li.open a  {
	color: #dd0202;
}

#globalnavi > ul > li.navi-news > ul > li:hover a, 
#globalnavi > ul > li.navi-news > ul > li.active a, 
#globalnavi > ul > li.navi-news > ul > li.open a  {
	color: #ff6e0d;
}

#globalnavi > ul > li.navi-team > ul > li:hover a, 
#globalnavi > ul > li.navi-team > ul > li.active a, 
#globalnavi > ul > li.navi-team > ul > li.open a  {
	color: #fed42a;
}

#globalnavi > ul > li.navi-sound > ul > li:hover a, 
#globalnavi > ul > li.navi-sound > ul > li.active a, 
#globalnavi > ul > li.navi-sound > ul > li.open a  {
	color: #0da60d;
}

#globalnavi > ul > li.navi-hardware > ul > li:hover a, 
#globalnavi > ul > li.navi-hardware > ul > li.active a, 
#globalnavi > ul > li.navi-hardware > ul > li.open a  {
	color: #1371fe;
}

#globalnavi > ul > li.navi-links > ul > li:hover a, 
#globalnavi > ul > li.navi-links > ul > li.active a, 
#globalnavi > ul > li.navi-links > ul > li.open a  {
	color: #b325e2;
}

#globalnavi > ul > li > ul > li > ul > li > a {
	padding: 3px 0 5px 40px;
	font-size: 14px;
	line-height: 14px;
}

/* Sidenavi */

#sidenavi li {
	display: inline;
	padding: 3px 10px;
}

#sidenavi a {
	color: #fff;
	text-transform: uppercase;
	text-decoration: none;
	font-size: 14px;
	font-family: "MuseoSans500", Trebuchet, sans-serif;
}

#sidenavi a:hover {
	color: #ccc;
}

#sidenavi li.navi-youtube span,
#sidenavi li.navi-facebook span {
	background-position: left bottom;
	background-repeat: no-repeat;
	background-image: url('../images/youtube.png');
	width: 18px;
	height: 18px;
	display: inline-block;
	padding-right: 5px;
	vertical-align: bottom;
}

#sidenavi li.navi-facebook span {
	background-image: url('../images/facebook.png');
}

/* Sitemap */

nav.sitemap ul.level0 {
	float: left;
}

nav.sitemap ul.level0 li {
	display: inline;
	float: left;
	width: 138px;
}

nav.sitemap > ul > li > ul > li > a {
	color: #d1d1d1;
}

nav.sitemap a {
	color: #eee;
	text-decoration: none;
	font-weight: bold;
}


nav.sitemap h2 {
	padding: 5px 0;
	font-size: 16px;
}

#sitemap_button {
	background: url(../images/ui-icon.png) no-repeat top left;
	padding-left: 25px;
}

nav.sitemap .current {
	background-position: 0 -20px;
}

nav.sitemap ul.level1 a {
	font-weight: normal;
}

nav.sitemap a:hover {
	color: #666;
	text-decoration: none;
}

nav.sitemap ul.level1 {
	padding: 5px 0;
}

nav.sitemap ul.level1 li {
	display: list-item;
	padding: 0 0 5px 0;
	width: auto;
	float: none;
}

nav.sitemap ul.level2 li {
	padding-left: 10px;
	padding-top: 5px;
	padding-bottom: 0;
}

/*****************************************************************
 * List Items
 *****************************************************************/
 
article.list-item,
article.detail-item {
	position: relative;
}
 
article.list-item {
 	padding-bottom: 20px;
 	clear: both;
}
 
article.list-item h1 {
 	font-size: 16px;
 	line-height: 100%;
 	overflow: hidden;
 	max-width: 400px;
 	padding-top: 3px;
}

article.list-item.news h1,
article.list-item.highlights h1 {
	color: #ff6e0d;
}

article.list-item.link h1 {
	color: #b325e2;
}

article.list-item.sound h1 {
	color: #0da60d;
}

article.list-item.hardware h1 {
	color: #1371fe;
}

article.list-item.team h1 {
	color: #fed42a;
}

section#soundsamples article.list-item h1 {
	font-size: 18px;
}

section#soundsamples article.list-item {
	width: 270px;
	background: none;
	box-shadow: none;
	margin-bottom: 0;
}

article.list-item header {
	position: relative;
	overflow: hidden;
}

article.list-item header span.date {
	position: absolute;
	right: 0;
	top: 0;
}
 
div.list-image {
	width: 228px;
	float: left;
	padding-bottom: 40px;
} 

div.list-image.samples {
	width: 90px;
} 
 
article.list-item img,
article div.gallery img {
 	margin: 0 10px 10px 0;
}
 
article.list-item p,
article.list-item div.lead {
 	overflow: hidden;
}

article.list-item div.gallery,
article.detail-item div.gallery {
	overflow: hidden;
	padding: 20px 0 40px;
}


article.list-item footer,
article.detail-item footer {
	text-align: right;
}


article.detail-item a.back {
	display: block;
	margin-top: 50px;
}

article.detail-item div.article-navi a {
	float: left;
	margin-right: 10px;
}


section#soundsamples article.list-item footer {
	bottom: 15px;
	right: 15px;
}
 
article.detail-item {
 	margin-bottom: 20px;
}


div.social {
	height: 30px;
	width: 300px;
	float: left;
	clear: both;
}

div.fb {
	float: left;
	margin-left: 10px;
}

div.plusone {
	float: left;
}

div.social.news {
	right: 140px;
}


object.youtubeplayer {
	margin-bottom: 20px;
	position: relative;
	z-index: 0;
}

/*****************************************************************
 * Page Browsing
 *****************************************************************/
.page-browser {
	overflow: hidden;
	margin: 20px 0;
}

.page-browser ul {
	padding: 0;
}

.page-browser ul > li  {
	float: left;
	border: 1px solid #444;
	margin-right: 10px;
	line-height: 100%;
	list-style: none;
}

.page-browser ul > li > a {
	text-decoration: none;
	display: block;
	padding: 5px;
}

.page-browser ul > li > a:hover {
	color: #fff;
}

.page-browser ul > li.active,
.page-browser ul > li > a:hover {
	background: #444;
}

.page-browser ul > li.active > a {
	color: #000;
}

.page-browser li.page-browser-spacer {
	padding: 5px;
	border: none;
}

/*****************************************************************
 * Page Content Attachments
 *****************************************************************/

section.page-attachments {
	margin-top: 10px;
}

section.page-attachments ul {
	padding: 0;
}

section.page-attachments ul li {
	list-style: none;
	background-repeat: no-repeat;
	margin-bottom: 10px;
}

section.page-attachments ul li a {
	display: block;
	padding-top: 4px;
}


/******************************************************************************
 * Additional Styling
 *****************************************************************************/
 
 .box {
 	margin-bottom: 15px;
 }
 
 .box h3 {
 	background: #0f0f0f;
 	color: #1b1b1b;
 	padding: 5px 10px;
 }
 
.box-content, .box-link {
 	background: #ccc;
 	padding: 5px 10px;
 }
 
 .box-content {
 	line-height: 150%;
 }