/*
-----------------------------------------------
Style Sheet

Site: tattooroyale.com
Author:   www.aaryn.com
Version:  2007.5
----------------------------------------------- */


/* undo some default styling of common (X)HTML browsers
 * ------------------------------------------------------------------------- */

/* No list-markers by default - must redefine bullets w/ bg graphics */
ul,ol { list-style:none; }

/* Avoid browser default inconsistent heading font-sizes and pre/code */
h1,h2,h3,h4,h5,h6,pre,code { font-size:1em; }


/* prevent blue linked image borders */
a img, :link img, :visited img, fieldset { border:none; }

/* reset margin and padding for all elements to 0 */
ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,body,html,p,blockquote,fieldset,input,label,div,dd,dt,dl{ margin:0; padding:0; }



/* global elements
 * ------------------------------------------------------------------------- */

/* Default font size in IE and FireFox is 16px. Default for Safari is 14px. */
html {
	font-size:100% /* IE has problems scaling text in ems. Using a percentage makes for better text rendering when scaled. */
	}

body {
	background:url(../images/bg2.gif) repeat;
	font-size:.75em; /* Read by IE only. - 75% of 16px = 12px */
	font-family:Arial, Helvetica, sans-serif;
	text-align:left;
	color:#ceb579;
	}

html>body {
	font-size:12px; /* overrides the font-size above in all browsers except IE. These browsers can resize text that is specified in px so this is ok. */
	}

a:link, a:visited {
	color:#9c480e;
	}
	
a:hover, a:active {
	color:#be6528;
	}

	

/* Classes
 * ------------------------------------------------------------------------- */

.clear {
	clear:both;
	height:.01em;
	overflow:hidden;
	}

.pic_left {
	margin:0 10px 2px 0;
	float:left;
	}

.pic_right {
	margin:0 0px 2px 10px;
	float:right;
	}

.times_text {
	
	font-size:.92em;
	font-weight:bold;
	}

.hr {
	height:1px;
	overflow:hidden;
	border:none;
	color:#290a01;
	background-color:#290a01;
	width:500px;
	margin:10px 0;
	}

.artist_sidebar_pic {
	padding:0 1px 1px 1px;
	border-left: 1px solid #ad8c6b;
	border-right: 1px solid #ad8c6b;
	border-bottom: 1px solid #ad8c6b;
	}
	
/* Layout
 * ------------------------------------------------------------------------- */
 
#container {
	background:url(../images/page_bg.jpg) repeat-y bottom #492c0a;
	width:788px;
	margin:0 auto;
	}

#title {
	background:url(../images/title.jpg) no-repeat;
	width:788px;
	height:154px;
	}
	
	#title span {
		display:none;
		}
		
#home_link {
	width:150px;
	height:144px;
	margin-left:320px;
	display:block;
	}
	
	#home_link span {
		display:none;
		}

#additional_homepage_content {
	width:688px;
	padding:0px 50px 0px 50px;
	}
	
	#additional_homepage_content p {
		margin-top:15px;
		}

#skull_bottom {
	background:url(../images/skull_bottom.gif) no-repeat;
	width:788px;
	overflow:hidden;
	}

#watermark {
	background:url(../images/watermark.gif) no-repeat 14px 0px;
	}

#home_column_left {
	margin:15px 25px 0 47px;
	width:325px;
	float:left;
	display:inline;
	}

#address {
	width:320px;
	height:259px;
	background:url(../images/address2.gif) no-repeat;
	}
	
	#address span {
		display:none;
		}
		
		
#address #myspace {
		width:192px;
		height:20px;
		margin:218px 0 0 60px;
		display:block;
		position:absolute;
		}

#home_column_right {
	margin:15px 47px 0 0px;
	width:344px;
	float:left;
	display:inline;
	}

#artist_column_left {
	width:191px;
	float:left;
	margin:25px 16px 0 24px;
	display:inline;
	text-align:center;
	}

#artist_column_right{
	width:514px;
	float:left;
	display:inline;
	margin-top:25px;
	line-height:1.4em;
	}

#single_col {
	width:721px;
	margin:25px 25px 0 25px;
	}

table#gallery img {
	padding:1px;
	border:1px solid #a88d6e;
	} 
	
table#link_thumbs img {
	padding:1px;
	border:1px solid #a88d6e;
	margin-bottom:5px;
	} 

#baseline {
	background:url(../images/footer.jpg) no-repeat;
	height:21px;
	width:788px;
	margin:0 auto;
	}

#footer {
	margin:6px auto;
	text-align:center;
	}

#footer li {
	margin: 0;
	padding: 0 7px 0 10px;
	display: inline;
	border-left: 1px solid #3e2700;
	background: none;
	font-size:.92em;
	color:#3e2700;
    }

	#footer li.first { 
    	border: none;
    	}



/* --------------------------- Form --------------------------------- */
form {
	margin: 0 auto;
	width:500px;
	}


label {
	float:left;
	width:170px;
	text-align:right;
	margin-right:10px;
	margin-top:-4px; /* to align label with the top of input area */
	}
	
input, textarea {
	width:150px;
	border:1px solid #3b1f16;
	float:left;
	margin-bottom:8px;
	background-color:#d2be93;
	}
	
textarea {
	width:250px;
	overflow:hidden;
	}


	form br {
		line-height:0.0;  /* defaults vertical spacing between fields */
		clear:left;
		}

#submit {
	margin-left:180px;
	float:none;
	background:none;
	width:90px;
	height:24px;
	border:none;
	}



/* Lightbox
 * ------------------------------------------------------------------------- */
#lightbox{
	background-color:#eee;
	padding: 10px;
	border-bottom: 2px solid #666;
	border-right: 2px solid #666;
	color:#666;
	}
#lightboxDetails{
	font-size: 0.8em;
	padding-top: 0.4em;
	}	
#lightboxCaption{ float: left; }
#keyboardMsg{ float: right; }
#closeButton{ top: 5px; right: 5px; }

#lightbox img{ border: none; clear: both;} 
#overlay img{ border: none; }

#overlay{ background-image: url(../images/overlay.png); }

* html #overlay{
	background-color: #333;
	back\ground-color: transparent;
	background-image: url(blank.gif);
	filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="images/overlay.png", sizingMethod="scale");   /* Path to overlay.png must be relative to HTML page, not the CSS file */
	}




/* artist navigation
 * ------------------------------------------------------------------------- */

#artist_nav { background:url("../images/artists2.gif") no-repeat; width:344px; height:395px; position:relative; }
#artist_nav li { position:absolute; top: 0; }
#artist_nav li, #artist_nav a { height:121px; display:block; top:239px; }
#artist_nav span { display:none; }

#artist_nav-01 { width: 75px; left:41px; }
#artist_nav-02 { width:75px; left: 136px; }
#artist_nav-03 { width: 75px; left: 230px; }




/* Sprite Navigation
 * ------------------------------------------------------------------------- */
#nav {
	background: url(../images/nav.jpg) top left no-repeat;					
	width: 788px;		/* Width of buttons, not entite image (or half of entire image) */
	height: 55px;		/* Height of entire image */
	}
		
#nav span { display: none; }
#nav li { 
	position: relative;
	float: left;
	list-style: none;
	z-index:11;
}
#nav li, #nav a { 
	height: 55px;			/* Each button must have the same height, define it here */
	display: block;
}

/* left - defines offset from left edge, will most likely just be 0 */
/* width - width of each button, they will each most likely be unique */
#nav-01 {left:151px; width: 74px;}
#nav-02 {left:190px; width: 110px;}
#nav-03 {left:230px; width: 117px;}
#nav-04 {left:271px; width: 75px;}

/* Changed values should match "width" numbers specified above */
#nav-01 a:hover {background: transparent url(../images/nav.jpg)   -151px  -55px no-repeat;}
#nav-02 a:hover {cursor:default;}
#nav-03 a:hover {background: transparent url(../images/nav.jpg)  -414px -55px no-repeat;}
#nav-04 a:hover {background: transparent url(../images/nav.jpg)  -572px -55px no-repeat;}


/* SON OF SUCKERFISH */

#nav li ul {
	position: absolute;
	left: -9999px;
	margin-top:-2px;
}

#nav li ul li {
	height: 20px;				/* Height of each drop down menu item */
	border-bottom:1px solid #2a1b08; 
	border-left:1px solid #2a1b08;
	border-right:1px solid #2a1b08;
	background:url(../images/dropdown2.jpg) no-repeat;
	background-color: #6f5545;	/* Background color of drop down menu - add more styles (i.e. background image) if you want */
}
#nav li ul li a {
	width: 100%;
	height: 20px;				/* Height of each drop down menu item, should match above */
	line-height: 20px;			/* Height of each drop down menu item again, should match above */
	
}
#nav li ul li a span {
	display: block;
	padding-left: 5px;
	float:left;
}

/* Drop down link styles */
#nav li ul li a:link, #nav li ul li a:visited {
	font-size: .92em;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-weight:bold;
	color: #ffe69c;
	text-decoration: none;
	text-align:left;

}

#nav li ul li a:hover, #nav li ul li a:active {
	font-size: .92em;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-weight:bold;
	color: #dda510;
	text-decoration: none;
	text-align:left;

}

#nav li:hover ul, #nav li.sfhover ul { left: auto; background-position: 0 0; }

/* Hover styles for drop down items */
#nav-02 ul a:hover { 
	background:url(../images/dropdown2.jpg) 0px -30px no-repeat;
	cursor:pointer; 
}

/* width of drop down menu - choose width that allows items to display on one line */	
#nav-02 ul, #nav-02 li{ width: 100px;  }