/* starting  rules for all elements */

body 
{
	font-size: 80%;
	font-family: "Arial", "Helvetica", sans-serif;
	margin: 5px 10px 10px 10px;
	background-color: #000;
}

p
{
	font-size: 120%;
	color: #fff;
	line-height: 120%;
}

/* default headings */
h1
{
	font-family: Arial, sans-serif;
	font-size: 150%;
	font-weight: normal;
	color: #9A877E;
}

h2
{
	font-family: Arial, sans-serif;
	font-size: 125%;
	font-weight: normal;
	color: #FFF;
	text-align:center;
	margin: 3em 0 1em 0;
}

h3
{
	font-family: Arial, sans-serif;
	font-size: 120%; 
	font-weight: normal;
	color: #FFF;
	text-align:center;
	margin: 1em 0 1em 0;
}

h4
{
	font-family: Arial, sans-serif;
	font-size: 125%;
	font-weight: normal;
	color: #9A877E;
	text-align:center;
	margin: 1em 0 1em 0;

}

h6
{
	font-family: Arial, sans-serif;
	font-size: 95%;
	font-weight: normal;
	color: #9A877E;
	text-align:center;
	margin: 1em 0 1em 0;
}



/* default paragraphs */
p
{
	font-size: 100%;
	line-height: 120%;
}

/* default anchor */
a
{
	text-decoration:none;
	color: #9A877E;
}

a:link
{
	color: #9A877E;
}

a:visited
{
	color: #9A877E;
}

a:hover
{
	color: #CCCCFF;
}

a:active
{
	color: #FFFFFF;
}

/* default images - remove border in Mozilla */
img
{
	border: 0;
}

/* the navigation column */
#nav
{
	padding: 10px;
	width: 15em;
}

#nav ul
{
	list-style-type: none;
}

#nav li
{
	font-size: 100%;
	padding: 0;
	color: #9A877E;
	text-align:left;
}

#nav h3
{
	text-align:left;
}

/* the content column */
#content
{
	padding: 150px 10px 10px 10px;
}

#content li
{
	text-align:right;
	padding: 0;
	margin: 0 0 0 0;
	color:#FFFFFF;
}

/* the full size images */
div.full
{
	padding: 1em 0 0 0;
}

div.full ul
{
	list-style-type: none;
	padding: 0;
	margin: 0;
}

div.full li
{
	font-size: 105%;
	color: #FFFFFF;
	text-align: left;
}
full.ul 
{
	margin: 0.25em 0 0 0; 
	padding: 0;
	font: small Arial, sans-serif;
	list-style-type: none;
}

full.li 
{
	display: block;
	text-align: center;
}

/* the sidebar (vertical list of images) */
#sidebar
{
	margin: 100px 50px 10px 10px;
	padding: 0px;
	color: #9A877E;
}

#sidebar img
{
	padding: 0;
	margin: 0;
}

#sidebar p
{
	padding: 0;
	margin: 0 0 5px 0;
}

#sidebar a
{
	padding: 0;
	margin: 0 0 70px 0;
}

.thumb
{
	margin: 0 0 30px 0;
	text-align:center;
}

.thumb ul
{
	margin: 0.25em 0 0 0; 
	padding: 0;
	list-style-type: none;
}

.thumb li
{
	display: block;
	text-align:center;
	padding: 0;
	margin: 0;
	font-size: 8pt;
}

/* the slides to appear in artists' pages 
	note the width and height includes the IE5/5.5 bug fix hack
	followed by "be nice to Opera"
*/
div.slide
{
	float: left;
	padding: 0 33px;
	margin: 5px 3px;
	border: 1px solid #000; 
	text-align: center;
	
	width: 150px;
	height: 187px;
	voice-family: "\"}\"";
	voice-family: inherit;
	width: 130px;
	height: 180px; 
}
html > body div.slide
{
	width: 130px;
	height: 160px;
}

div.slide img 
{
	border: none; 
}

div.ls img 
{
	margin: 32px 0 0 0;
}

div.pt img 
{
	margin: 0 16px;
}

/* 
			These are the image widths for the artist's pages.
			
			The number of pixels is the MAXIMUM with for the image to be enclosed in it.
			
			For example, to ensure a regular grid, you could use the same width for all the 
			
			images by the same artist, but set the width to the largest image.
			
			The number of pixels is in the second width: item, i.e. for div.slim it's 60 pixels.
			The first width is 20 pixels to allow for a bug in Internet Explorer versions 5.0 and 5.5
			
			The widths are:
			
			slim		60px
			portrait	100px
			square		140px
			landscape	170px
			widescreen	250px
			panorama	300px
			imax		500px
*/
div.slim
{
	width: 80px;
	voice-family: "\"}\"";
	voice-family: inherit;
	width: 60px;
}
html > body div.slim
{
	width: 60px;
}

div.portrait
{
	width: 120px;
	voice-family: "\"}\"";
	voice-family: inherit;
	width: 100px;
}
html > body div.portrait
{
	width: 100px;
}

div.square
{
	width: 160px;
	voice-family: "\"}\"";
	voice-family: inherit;
	width: 140px;
}
html > body div.square
{
	width: 140px;
}

div.landscape
{
	width: 190px;
	voice-family: "\"}\"";
	voice-family: inherit;
	width: 170px;
}
html > body div.landscape
{
	width: 200px;
}

div.widescreen
{
	width: 270px;
	voice-family: "\"}\"";
	voice-family: inherit;
	width: 250px;
}
html > body div.widescreen
{
	width: 250px;
}

div.panorama
{
	width: 320px;
	voice-family: "\"}\"";
	voice-family: inherit;
	width: 300px;
}
html > body div.panorama
{
	width: 300px;
}

div.imax
{
	width: 520px;
	voice-family: "\"}\"";
	voice-family: inherit;
	width: 500px;
}
html > body div.imax
{
	width: 500px;
}

div.slide ul 
{
	margin: 0.25em 0 0 0; 
	padding: 0;
	font: small Arial, sans-serif;
	font-size: 8pt;
	list-style-type: none;
}

li 
{
	display: block;
	text-align: center;
	list-style-type: none;
}

li.title 
{
	font-weight: normal;
}

li.square
{
	width:60px;
}

div.artist
{
	padding: 5em 0 0 0;
}

div.slide li.catno 
{
	text-align: right;
	margin: 0 50% 0 0; 
	padding: 0 0.5em 0 0;
}
 
div.slide li.price 
{
	text-align: left; 
	font-style: italic;
	
	margin: -1.2em 0 0 50%;
	padding: 0 0 0 0.5em;
	border-left: 1px solid;
}

p.text
{
	margin: 0 5% 0 5%;
	padding: 0em 5em 1em 5em;
	font-size: 100%;
	color: #fff;
	line-height: 120%;
}

div#footer 
{
	clear: both; 
	padding-top: 3em;
	font: 85% Arial, sans-serif;
}

/* pure text pages such as square, contact and terms */
div#square
{
	margin: 10em 10em 10em 10em;
}

div#square td
{
	color: #fff;
}

div#square textarea
{
	font-family: "Arial", sans-serif;
}

div#footer
{
	margin: 2em 0 0 0; 
	padding: 0;
	text-align: right;
	font: small Arial, sans-serif;
	font-size: 8pt;
}

div#footer a
{
	color: #111111;
}