/*--------------------------------------------------------------------------------------*/
/*-----------------------MattHead Productions CSS---------------------------*/ 
/*--------------------------------------------------------------------------------------*/

html, body {
	height: 100%; 
	margin: 0; 
	padding: 0;
}

body {
     margin: 0 !important;
     padding: 0 !important;
     background:  #000;
     text-align: center;
     font: 11px "Lucida Grande", Arial, Verdana, sans-serif; 
     color: #ccc;
     line-height: 16px;
}

span {
	font-weight: bold;
	color: #fff;
	font-size: 11px;
	background-color: transparent;
}

.bigtext {
	font-weight: bold;
	color: #fff;
	font-size: 16px;
	line-height: 19px;
	background-color: transparent;
}

p {
	margin: 0px;
	padding: 2px 5px 8px 2px;
}

img {
	margin: 0;
	padding:0 5px 0 0;
	border: none;
	text-decoration: none;
}

.bio_stack img, .left_stack img {
	float: left;
	padding: 0 5px 0 0;
	clear: none;
}

.homepic {
	padding: 0 5px 10px 0;
}

a:link, a:visited {
	color: #3cc;
	font-size: 10px;
	text-decoration: none;
	background-color: transparent;
}

a:hover {
	color: #6ff;
	text-decoration: underline;
	background-color: transparent;
}

.divider {
	float: left;
	position: relative;
	border-bottom: 1px solid #666;
	height: 2px;
	width: 260px;
	margin: 0 0 10px;
	padding: 0;	
}

/*----------------------*/
/*---( top area )----------*/
/*----------------------*/

#top_wrap {
	position: relative;
	margin: 0 auto;
	padding:  0;
	width: 100%;
	height: 210px;
	background: url("../img/topbg.jpg") top center no-repeat;
}

/*----------------------*/
/*----- [ navigation ] -----*/
/*----------------------*/


/*---(mhp menu / navigation )----------*/

#mhp #navi { display: none; }

div#mphnavi_holder {
	position: relative;
	width: 530px;
	padding: 0;
	margin: 0 auto;
}

div#mhpnavi {
	float: left;
	height: 12px;
	width: 530px;
	margin: 0;
	padding: 0 0 2px;
	border: 0;
	}


div#mhpnavi ul#mhpmenu	{
	height: 12px;
	width: 530px;
	background:  url("../img/nav.jpg") 0 0 no-repeat;
	margin: 0;
	padding: 0;
	position: relative;
	}

div#mhpnavi ul#mhpmenu li {
	margin: 0;
	padding: 0;
	list-style: none;
	position: absolute;
	}
	
ul#mhpmenu li, ul#mhpmenu a {
	height: 12px;
	display: block;
	}
	
div#mhpnavi ul#mhpmenu li a {
	text-indent: -9999px;
	overflow: hidden;
	text-decoration: none;
	}
div#mhpnavi #mhp_home { left: 0px; width: 30px; }
div#mhpnavi #mhp_bio { left: 55px; width: 55px; }
div#mhpnavi #mhp_news { left: 135px; width: 75px; }
div#mhpnavi #mhp_production { left: 235px; width: 65px; }
div#mhpnavi #mhp_media { left: 325px; width: 80px; }
div#mhpnavi #mhp_links { left: 430px; width: 30px; }
div#mhpnavi #mhp_contact { left: 485px; width: 45px; }

div#mhpnavi #mhp_home a:hover { background: transparent url("../img/nav.jpg") 0px -13px no-repeat; }
div#mhpnavi #mhp_bio a:hover { background: transparent url("../img/nav.jpg")  -55px -13px no-repeat; }
div#mhpnavi #mhp_news a:hover { background: transparent url("../img/nav.jpg") -135px -13px no-repeat; }
div#mhpnavi #mhp_production a:hover { background: transparent url("../img/nav.jpg") -235px -13px no-repeat; }
div#mhpnavi #mhp_media a:hover { background: transparent url("../img/nav.jpg") -325px -13px no-repeat; }
div#mhpnavi #mhp_links a:hover { background: transparent url("../img/nav.jpg") -430px -13px no-repeat; }
div#mhpnavi #mhp_contact a:hover { background: transparent url("../img/nav.jpg") -485px -13px no-repeat; }


/*----------------------*/
/*----- [ wrapper ] -----*/
/*----------------------*/
#wrapper, #wrapper_bg0, #wrapper_bg1,  #wrapper_bg2,  #wrapper_bg3 {
	position: relative;
	margin: 0 auto;
	padding:  20px 0 0 0;
	width: 845px;
}

#wrapper {
		background:  url("../img/mattbgf.jpg") top center no-repeat;
}

#wrapper_bg0 {
		background:  url("../img/mattbgf_0.jpg") top center no-repeat;
}

#wrapper_bg1 {
		background:  url("../img/mattbgf_1.jpg") top center no-repeat;
}

#wrapper_bg2 {
		background:  url("../img/mattbgf_2.jpg") top center no-repeat;
}

#wrapper_bg3 {
		background:  url("../img/mattbgf_3.jpg") top center no-repeat;
}

.box {
	min-height: 415px;
}


/* for Internet Explorer */
/*\*/
* html  .box {
height: 415px;
}


#wrapper_wrapper {
	position: relative;
	margin: 0 auto;
	width: 555px;
	height: 415px;
	background:  url("../img/contentbg.jpg") 0 0 no-repeat;
}


.container {
	min-height: 200px;
}


/* for Internet Explorer */
/*\*/
* html  .container {
height: 200px;
}

.right_stack, .pop_right_stack  {
	position: relative;
	float: left;
	margin: 0;
	padding-top: 10px;
	width: 260px; 
	text-align: left;
}

.pop_right_stack {
	width: 370px;
	height: 370px;

}
.left_stack, .pop_left_stack {
	position: relative;
	float: left;
	margin: 0 7px;
	padding-top: 10px;
	width: 260px !important;
	text-align: left;
}

.pop_left_stack {
	width: 178px;
	height: 370px;

}
.pop_right_stack span {
	font-size: 125%;
}

#pop_link_links {
	width: 170px !important;
}

.popbg {
	background: url("../img/pop_bg.jpg") 0 0 repeat;
	margin: 15px 0 0 0;
	padding: 0;
}

.artistbg {
	background: url("../img/artist_bg.jpg") 0 0 repeat;
	margin: 15px 0 0 0;
	padding: 0;
}

.pop_submissions {
	position: relative;
	float: left;
	width: 590px;
	height: 200px;
	margin: 10px 10px;
	padding: 10px;
	text-align: left;
	background: url("../img/pop_bg_btm.jpg") top center no-repeat;
}
	
.bio_stack {
	position: relative;
	float: left;
	margin: 5px 0 0 10px;
	padding: 2px 5px;
	width: 540px;
	height: 375px;
	text-align: left;
	overflow: auto;
}

.pic_container {
	float: left;
	width: 520px;
	height: 110px;
	position: relative;
	margin: 10px 0 0 0;
	padding: 0;

}

.pic_container a img, .pic_container a:visited img, .pic_container a, .pic_container a:visited {
	float: left;
	margin: 0 10px 0 0;
	padding: 0;

}

.pic_container a img, .pic_container a:visited img {
	border: 1px solid #fff;
}

.pic_stack {
	text-align: center;
	margin: 0 auto;

}

.pic_stack img {
	border: 4px solid #000;
	padding: 0px;
	margin: 5px;
}

/*----------------------*/
/*----- [ content ] -----*/
/*----------------------*/

#flashplayer {
	position: relative;
	float: left;
	margin: 5px 10px 5px 5px;
	padding: 0;
	width: 270px;
	text-align: left;
}

.content_pod {
	position: relative;
	float: left;
	width: 600px;
	margin: 5px 0;
	padding-bottom: 15px;
	background:  url("../img/hs_bg.jpg") top center repeat-x;
}

.video_container {
	margin: 0 0 0 60px;
	padding: 0;
}






/*----------------------*/
/*----- [ footer ] -----*/
/*----------------------*/

#footer_wrap {
	position: relative;
	float: left;
	padding: 0;
	margin: 0;
	width: 100%;
	height: 15px;
	background:    url("../img/footerbg.jpg") top center no-repeat;
}

#footer_holder {
	position: relative;
	margin: 0 auto;
	width: 800px;
}

#footer_wrap p {
	color: #399;
	background-color: transparent;
}


/*----------------------*/
/*----- [ lists ] -----*/
/*----------------------*/
 ul.links_links {
 	margin: 0 10px 5px;
 	padding: 2px;
 	position: relative;
 	float: left;
 	text-align: left;
 	list-style-position: inside;
 	list-style-type: square;
 	width: 210px;
 	height: 80px;
 }

 .links_links li, .links_links li a, .links_links a:visited {
 	line-height: 18px;
 }
 	
 .header {
	font-size: 14px;
	color: #fff;
	font-weight: bold;
	line-height: 60px;
	list-style: none;
}

 ul.artists {
 	margin: 0 10px 5px;
 	padding: 2px;
 	position: relative;
 	float: left;
 	text-align: left;
	 list-style: none;
 	width: 210px;
 	height: 100px;
 }

  ul.campaign {
 	margin: 0 10px 5px 25px;
 	padding: 2px;
 	float: left;
 	position: relative;
 	text-align: left;
	 list-style: none;
 	width: 220px;
 	height: 100px;
 }

  ul.creatorslist {
 	margin: 0 10px 5px;
 	padding: 2px;
 	position: relative;
 	float: left;
 	text-align: left;
	 list-style: none;
 	width: 230px;
 	height: 100px;
 }


 ul.artists img, ul.creatorslist img {
 	float: left;
 	margin: 2px;
 }

 .artists li, .artists li a, .artists a:visited, .creatorslist li, .campaign li {
 	line-height: 18px;
 }

.largelinks a, .largelinks li a:visited {
	font-size: 16px;
}
 
 	

/*----------------------*/
/*----- [ H'S ] -----*/
/*----------------------*/


h1, h2, h3, h4 {
	height: 20px;
	float: left;
	position: relative;
	margin:  0 0 15px;
	padding:  0 0 3px;
	border-bottom: 1px solid #999;
	text-indent: -12000px !important;
}

h1 {
	width: 260px;
}

h2 {
	width: 510px; 
}

h3 {
	width: 535px;
	margin: 0;
	clear: right;
}

h4 {
	width: 520px; 
	margin: 0;
	clear: right;
}

h1.welcome {
	background: url("../img/h1_welcome.png") 5px 3px no-repeat;
	border-top: 0 !important;
	}

h1.production {
	background: url("../img/h1_production.png") 5px 3px no-repeat;
	display: block;
	border-top: 0 !important;
	}
	
h1.news {
	background: url("../img/h1_news.png") 5px 3px no-repeat;
	}
h1.news2 {
	background: url("../img/h1_news2.png") 5px 3px no-repeat;
	}
	
h1.events {
	background: url("../img/h1_events.png") 5px 3px no-repeat;
	}
	
h3.production {
	background: url("../img/h1_production.png") 5px 3px no-repeat;
	display: block;
	border-top: 0 !important;
	}
	
h1.contact {
	background: url("../img/h1_contact.png") 5px 3px no-repeat;
	border-top: 0 !important;
	}
	
h1.feedback {
	background: url("../img/h1_feedback.png") 5px 3px no-repeat;
	border-top: 0 !important;
	}

h2.bio {
	background: url("../img/h2_bio.png") 5px 3px no-repeat;
	border-top: 0 !important;
	}

h2.contact {
	background: url("../img/h1_contact.png") 5px 3px no-repeat;
	border-top: 0 !important;
	}


h3.filmscore {
	background: url("../img/h1_p_film.png") 5px 3px no-repeat;
	border-top: 0 !important;
	width: 525px;
	margin: 0;
	clear: right;
	}
	
h3.mixtape {
	background: url("../img/h1_p_mixtape.png") 5px 3px no-repeat;
	border-top: 0 !important;
	}

	
h3.audiobooks {
	background: url("../img/h1_p_abooks.png") 5px 3px no-repeat;
	border-top: 0 !important;
	}

h3.artists {
	background: url("../img/h1_p_artists.png") 5px 3px no-repeat;
	border-top: 0 !important;
	}


h3.media {
	background: url("../img/h1_p_media.png") 5px 3px no-repeat;
	border-top: 0 !important;
	}

h3.linkspage {
	background: url("../img/h2_links.png") 5px 3px no-repeat;
	border-top: 0 !important;
	}

h3.making{
	background: url("../img/h1_m_making.png") 5px 3px no-repeat;
	border-top: 0 !important;
	}

h3.robots{
	background: url("../img/h1_m_robots.png") 5px 3px no-repeat;
	border-top: 0 !important;
	}

h3.creators{
	background: url("../img/h1_creators.png") 5px 3px no-repeat;
	border-top: 0 !important;
	}

h4.sketches{
	background: url("../img/h1_sketches.png") 5px 3px no-repeat;
	border-top: 0 !important;
	}