#home
{
  display: block;
  width: 69px;
  height: 25px;
  background: url("images/home_1.gif") no-repeat 0 0;

}

#home:hover
{ 
  background-position: 0 -23px;
}

#home span
{
  position: absolute;
  top: -999em;
}

#artists
{
  display: block;
  width: 69px;
  height: 25px;
  background: url("images/artists_1.gif") no-repeat 0 0;

}

#artists:hover
{ 
  background-position: 0 -23px;
}

#artists span
{
  position: absolute;
  top: -999em;
}
#studio
{
  display: block;
  width: 69px;
  height: 25px;
  background: url("images/studio_1.gif") no-repeat 0 0;

}

#studio:hover
{ 
  background-position: 0 -23px;
}

#studio span
{
  position: absolute;
  top: -999em;
}
#dick
{
  display: block;
  width: 185px;
  height: 25px;
  background: url("images/dick_1.gif") no-repeat 0 0;

}

#dick:hover
{ 
  background-position: 0 -23px;
}

#dick span
{
  position: absolute;
  top: -999em;
}
#frankies
{
  display: block;
  width: 142px;
  height: 25px;
  background: url("images/frankies_1.gif") no-repeat 0 0;

}

#frankies:hover
{ 
  background-position: 0 -23px;
}

#frankies span
{
  position: absolute;
  top: -999em;
}
#merch
{
  display: block;
  width: 117px;
  height: 25px;
  background: url("images/merch_1.gif") no-repeat 0 0;

}

#merch:hover
{ 
  background-position: 0 -23px;
}

#merch span
{
  position: absolute;
  top: -999em;
}
#faq
{
  display: block;
  width: 61px;
  height: 25px;
  background: url("images/faq_1.gif") no-repeat 0 0;

}

#faq:hover
{ 
  background-position: 0 -23px;
}

#faq span
{
  position: absolute;
  top: -999em;
}
#contact
{
  display: block;
  width: 83px;
  height: 25px;
  background: url("images/contact_1.gif") no-repeat 0 0;

}

#contact:hover
{ 
  background-position: 0 -23px;
}

#contact span
{
  position: absolute;
  top: -999em;
}
html, body{ 
 margin:0; 
 padding:0; 
 text-align:center; 
 	background: #000000;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #E7E7E7;
} 
 
 a {
	color: #FE4E00;
	text-decoration:none;
}

a:hover {
color:#00FF00;
	text-decoration:underline;
}

#menu2 ul {margin:0; padding:0px; padding-left:350px; list-style-type:none;}
#menu2 li {float:left;}
/* Step 5 - Adding the initial images */
#menu2 li.list1 {background:transparent url(navs/home_off.jpg); width:54px;}
#menu2 li.list2 {background:transparent url(navs/about_us_off.jpg); width:90px;}
#menu2 li.list3 {background:transparent url(navs/studio_off.jpg); width:69px;}
#menu2 li.list4 {background:transparent url(navs/artists_off.jpg); width:77px;}
#menu2 li.list5 {background:transparent url(navs/services_off.jpg); width:87px;}
#menu2 li.list6 {background:transparent url(navs/aftercare_off.jpg); width:100px;}
#menu2 li.list7 {background:transparent url(navs/gallery_off.jpg); width:79px;}
#menu2 li.list8 {background:transparent url(navs/blog_off.jpg); width:53px;}
#menu2 li.list9 {background:transparent url(navs/links_off.jpg); width:60px;}
#menu2 li.list10 {background:transparent url(navs/contact_off.jpg); width:78px;}
/* Step 6 - General link styling */
#menu2 a {display:block; width:100px; height:0; padding-top:45px; color:#041e02; overflow:hidden;}
/* hack for older versions of IE with incorrect box model */
* html #menu2 a:link, * html #menu2 a:visited {height:45px; height:0;}
/* Step 7 - Separating the images */
#menu2 li {float:left; margin-right:1px;}
/* Step 8 - Adding the hover images */
#menu2 a#item1 {background:transparent url(navs/home_over.jpg) -130px -90px no-repeat;}
#menu2 a#item2 {background:transparent url(navs/about_us_over.jpg) -130px -90px no-repeat;}
#menu2 a#item3 {background:transparent url(navs/studio_over.jpg) -130px -90px no-repeat;}
#menu2 a#item4 {background:transparent url(navs/artists_over.jpg) -130px -90px no-repeat;}
#menu2 a#item5 {background:transparent url(navs/services_over.jpg) -130px -90px no-repeat;}
#menu2 a#item6 {background:transparent url(navs/aftercare_over.jpg) -130px -90px no-repeat;}
#menu2 a#item7 {background:transparent url(navs/gallery_over.jpg) -130px -90px no-repeat;}
#menu2 a#item8 {background:transparent url(navs/blog_over.jpg) -130px -90px no-repeat;}
#menu2 a#item9 {background:transparent url(navs/links_over.jpg) -130px -90px no-repeat;}
#menu2 a#item10 {background:transparent url(navs/contact_over.jpg) -130px -90px no-repeat;}
/* Step 9 - Adding the :hover style */
#menu2 a#item1:hover {background-position:0 0; z-index:50;}
#menu2 a#item2:hover {background-position:0 0; z-index:50;}
#menu2 a#item3:hover {background-position:0 0; z-index:50;}
#menu2 a#item4:hover {background-position:0 0; z-index:50;}
#menu2 a#item5:hover {background-position:0 0; z-index:50;}
#menu2 a#item6:hover {background-position:0 0; z-index:50;}
#menu2 a#item7:hover {background-position:0 0; z-index:50;}
#menu2 a#item8:hover {background-position:0 0; z-index:50;}
#menu2 a#item9:hover {background-position:0 0; z-index:50;}
#menu2 a#item10:hover {background-position:0 0; z-index:50;}
* html #menu2 a:hover {height:45px; he\ight:0;}
/* Step 10 - Clearing the float */
#menu2 {display:block; width:430px; height:90px;}
/* Step 11 - Adding the active images */
#menu2 a#item1 {background:transparent url(navs/home_hit.jpg) -130px -90px no-repeat;}
#menu2 a#item2 {background:transparent url(navs/about_us_hit.jpg) -130px -90px no-repeat;}
#menu2 a#item3 {background:transparent url(navs/studio_over.jpg) -130px -90px no-repeat;}
#menu2 a#item4 {background:transparent url(navs/artists_over.jpg) -130px -90px no-repeat;}
#menu2 a#item5 {background:transparent url(navs/services_over.jpg) -130px -90px no-repeat;}
#menu2 a#item6 {background:transparent url(navs/aftercare_over.jpg) -130px -90px no-repeat;}
#menu2 a#item7 {background:transparent url(navs/gallery_over.jpg) -130px -90px no-repeat;}
#menu2 a#item8 {background:transparent url(navs/blog_over.jpg) -130px -90px no-repeat;}
#menu2 a#item9 {background:transparent url(navs/links_over.jpg) -130px -90px no-repeat;}
#menu2 a#item10 {background:transparent url(navs/contact_over.jpg) -130px -90px no-repeat;}
/* Step 12 - Adding the :active style */
#menu2 a#item1:active {background-position:0 0; z-index:50;}
#menu2 a#item2:hover {background-position:0 0; z-index:50;}
#menu2 a#item3:hover {background-position:0 0; z-index:50;}
#menu2 a#item4:hover {background-position:0 0; z-index:50;}
#menu2 a#item5:hover {background-position:0 0; z-index:50;}
#menu2 a#item6:hover {background-position:0 0; z-index:50;}
#menu2 a#item7:hover {background-position:0 0; z-index:50;}
#menu2 a#item8:hover {background-position:0 0; z-index:50;}
#menu2 a#item9:hover {background-position:0 0; z-index:50;}
#menu2 a#item10:hover {background-position:0 0; z-index:50;}
* html #menu2 a:active {height:45px; height:0;}


#pagewidth{ 
 width:800px; 
 text-align:left;  
margin-left:auto; 
 margin-right:auto;  
} 
 
#header{
 position:relative; 
 height:115px; 
 background-color:#8E1111; 
 width:800;
} 
 
#leftcol{
	width: 320px;
	height: 925px;
	float:left;
	position:absolute;
	margin-top:50px;
	background-color:#8E1111;
	left: 105x;
	top: 65px;
 }
 
 #leftcol2{
	width: 320px;
	height: 575px;
	float:left;
	position:absolute;
	margin-top:50px;
	background-color:#8E1111;
	left: 105x;
	top: 65px;
 }
 
  #leftcol3{
	width: 320px;
	height: 1050px;
	float:left;
	position:absolute;
	margin-top:50px;
	background-color:#8E1111;
	left: 105x;
	top: 65px;
 }
   #leftcol4{
	width: 320px;
	height: 2675px;
	float:left;
	position:absolute;
	margin-top:50px;
	background-color:#8E1111;
	left: 105x;
	top: 65px;
 }
    #leftcol5{
	width: 320px;
	height: 1600px;
	float:left;
	position:absolute;
	margin-top:50px;
	background-color:#8E1111;
	left: 105x;
	top: 65px;
 }
     #leftcol6{
	width: 320px;
	height: 525px;
	float:left;
	position:absolute;
	margin-top:50px;
	background-color:#8E1111;
	left: 105x;
	top: 65px;
 }
      #leftcol7{
	width: 320px;
	height: 935px;
	float:left;
	position:absolute;
	margin-top:50px;
	background-color:#8E1111;
	left: 105x;
	top: 65px;
 }
 
#maincol{ 
 float: right; 
 display:inline; 
 position: relative; 
 width:420px;
 padding-right:10px;
 }
 
 #menu{ 
 float: right; 
 display:inline; 
 position:relative; 
 width:420px;
 padding-right:50px;
 font-family:Verdana, Arial, Helvetica, sans-serif;
 font-size:12px;
 font-style:oblique;
 }
 #nav_bottom{ 
 float: right; 
 display:inline; 
 position: relative;
 width:800px;
 font-family:Verdana, Arial, Helvetica, sans-serif;
 font-size:12px;
 font-style:oblique;
 }
 
.footer {
	width: 320px;
	height:100px;
float:left;
position: relative;
margin-top: 230px;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:9px;
}
.mailinglist {
	width: 320px;
	height:100px;
float:left;
position: relative;
margin-top: 25px;
margin-left: 0px;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:11px;
}
.privacy {
	width: 320px;
	height:0px;
float:left;
position: relative;
margin-top: -40px;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:9px;
}
  
ul {
list-style-type: none;
width: 100%; /* precision for Opera */
}

.menu li {
float: left;
}

.menu a {
margin: 0 2px;
width: 75px;
height: 15px;
display: block;
text-align: center;
text-decoration: none;
color: #FFFF00;
}

.menu a:hover {
color: #ff0000; 
}

.menu a:active {
color: #ff0000;
}
.mentions {
font-family: verdana, arial, sans-serif;
position: absolute;
bottom : 300px;
left : 10px;
color: #000;
background-color: #ddd;
}
a.test {text-decoration: none;
color: #222;
}
a.test:hover{text-decoration: underline;
}

.links {
float:left;
position: relative;
margin-top: 0px;
margin-left: 0px;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:13px;
width:150px;
}
.links2 {
float:left;
position: relative;
margin-left:175px;
margin-top:: 0px;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:13px;
width:250px;
}
.services1 {
float:left;
position: relative;
margin-left: 100px;
margin-top:0px;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:13px;
}
.services2 {
float:left;
position: relative;
margin-left:25px;
margin-top:0px;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:13px;
}
.services3 {
float:left;
position:absolute;
margin-top:150px;
margin-left:0px;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:13px;
width:400px;
}

h1 {
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:24px;
color:#FFFF00;
}

h2 {
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:11px;
color:#FFFF00;
}

h3 {
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:13px;
color:#FFFF00;
}

.floatright {
float: right;
margin: 0 0 10px 10px;
border: 2px solid #8E1111;
padding: 2px;
}
.floatleft {
float: left;
margin: 10px 10px 0px 0px;
border: 2px solid #8E1111;
padding: 2px;
}
.floatmiddle {
float: middle;
margin: 10px 10px 0px 0px;
border: 2px solid #8E1111;
padding: 2px;
}
.emailfloat {
float: right;
margin-top:-40px;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:16px;
padding: 2px;
}

form {  /* set width in form, not fieldset (still takes up more room w/ fieldset width */
  font:100% verdana,arial,sans-serif;
  margin: 0;
  padding: 0;
  min-width: 300px;
  max-width: 400px;
  width: 400px; 
}

form fieldset {
  /* clear: both; note that this clear causes inputs to break to left in ie5.x mac, commented out */
  border-color: #000;
  border-width: 1px;
  border-style: solid;
  padding: 10px;        /* padding in fieldset support spotty in IE */
  margin: 0;
}

form fieldset legend {
	font-size:1.1em; /* bump up legend font size, not too large or it'll overwrite border on left */
                       /* be careful with padding, it'll shift the nice offset on top of border  */
					   padding-top:5px;
					   
}

form label { 
	display: block;  /* block float the labels to left column, set a width */
	float: left; 
	width: 75px; 
	padding: 0; 
	margin: 5px 0 0; /* set top margin same as form input - textarea etc. elements */
	text-align: right; 
}

form fieldset label:first-letter { /* use first-letter pseudo-class to underline accesskey, note that */
	text-decoration:underline;    /* Firefox 1.07 WIN and Explorer 5.2 Mac don't support first-letter */
                                    /* pseudo-class on legend elements, but do support it on label elements */
                                    /* we instead underline first letter on each label element and accesskey */
                                    /* each input. doing only legends would  lessens cognitive load */
                                   /* opera breaks after first letter underlined legends but not labels */
}

form input, form textarea {
	/* display: inline; inline display must not be set or will hide submit buttons in IE 5x mac */
	width:auto;      /* set width of form elements to auto-size, otherwise watch for wrap on resize */
	margin:5px 0 0 10px; /* set margin on left of form elements rather than right of
                              label aligns textarea better in IE */
}

form input#reset {
	margin-left:0px; /* set margin-left back to zero on reset button (set above) */
}

textarea { overflow: auto; }

form small {
	display: block;
	margin: 0 0 5px 85px; /* instructions/comments left margin set to align w/ right column inputs */
	padding: 1px 3px;
	font-size: 88%;
}

form .required{font-weight:bold;} /* uses class instead of div, more efficient */

form br {
	clear:left; /* setting clear on inputs didn't work consistently, so brs added for degrade */
}



 
 /* *** Float containers fix:
 http://www.csscreator.com/attributes/containedfloat.php *** */ 
.clearfix:after {
 content: "."; 
 display: block; 
height: 0; 
 clear: both; 
 visibility: hidden;
 }
 
.clearfix{
display:inline;
display:block;
}

/* Hides from IE-mac \*/
* html .clearfix{height: 1%;}
.clearfix{display: block;}
/* End hide from IE-mac */  


 
 /*printer styles*/ 
 @media print{ 
/*hide the left column when printing*/ 
#leftcol{display:none;} 
#twocols, #maincol{width:100%; float:none;}
}
