/*------------------------------------*\
	RESET
\*------------------------------------*/
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td{
	margin:0;
	padding:0;
}
table{
	border-collapse:collapse;
	border-spacing:0;
}
fieldset,img{
	border:0;
}
address,caption,cite,code,dfn,th,var{
	font-style:normal;
	font-weight:normal;
}
caption,th{
	text-align:left;
}
h1,h2,h3,h4,h5,h6{
	font-size:100%;
	font-weight:normal;
}
q:before,q:after{
	content:'';
}
abbr,acronym{
	border:0;
}





/*------------------------------------*\
	MAIN
\*------------------------------------*/
/* html{ */
/* 	height:101%;  */
/* 	background:#000;  url(/img/css/bg.gif) top left repeat-x; */
/* }  */
body{
	font-family:Bookman,serif;
/*	font-family:Arial,Verdana,sans-serif; */
	font-size:1.50em;
/*	font-size:0.75em; */
	color:#333;
	width:960px;
	margin:0 auto;
	padding:10px;
}

#bg { position: fixed; top: 0; left: 0; }
.bgwidth { width: 100%; }
.bgheight { height: 100%; }


/*------------------------------------*\
	NAV
\*------------------------------------*/
#nav{
	list-style:none;
	font-weight:normal;  /* font-weight:bold;  */
	margin-bottom:10px;
	/* Clear floats */
	float:left;
	width:100%;
	position:relative;   /* Bring the nav above everything else--uncomment if needed. */
	z-index:5;           /* Bring the nav above everything else--uncomment if needed. */
}
#nav li{
	float:left;
	margin-right:10px;
	position:relative;
}
#nav a{
	display:block;
	padding: 10px 30px; /* padding:5px; */
	color:#fff;
	background:#333;
	background:rgba(255,255,255,0); /* Make the background fully transparent */
	text-decoration:none;
}
#nav a:hover{
	color:#fff;
	background:#6b0c36;
	text-decoration:underline;
}

/*--- DROPDOWN ---*/
#nav ul{
	background:#fff; /* Adding a background makes the dropdown work properly in IE7+. Make this as close to your page's background as possible (i.e. white page == white background). */
	background:rgba(255,255,255,0); /* But! Let's make the background fully transparent where we can, we don't actually want to see it if we can help it... */
	list-style:none;
	position:absolute;
	left:-9999px; /* Hide off-screen when not needed (this is more accessible than display:none;) */
}
#nav ul li{
	padding-top:1px; /* Introducing a padding between the li and the a give the illusion spaced items */
	float:none;
}
#nav ul a{
	white-space:nowrap; /* Stop text wrapping and creating multi-line dropdown items */
}
#nav li:hover ul{ /* Display the dropdown on hover */
	left:0; /* Bring back on-screen when needed */
}
#nav li:hover a{ /* These create persistent hover states, meaning the top-most link stays 'hovered' even when your cursor has moved down the list. */
	background:#6b0c36;
	text-decoration:underline;
}
#nav li:hover ul a{ /* The persistent hover state does however create a global style for links even before they're hovered. Here we undo these effects. */
	text-decoration:none;
}
#nav li:hover ul li a:hover{ /* Here we define the most explicit hover states--what happens when you hover each individual link. */
	background:#333;
}

#title_line { color:white; }
#description_line { color:white; }
#dimensions_line { color:white; font-size:80%; }
#status_line { color:white; font-size:80%; }
#provenance_line { color:white; font-size:80%; width:50%; }


/*------------------------------------*\
	TYPE
\*------------------------------------*/
h1{
	font-family:Bookman, serif;
/*	font-family:Calibri, Arial, Verdana, sans-serif;  */
	font-size:2em;
	width:520px;
}

/*------------------------------------*\
	THUMBNAILS
\*------------------------------------*/
<style>
.SML11x14          {width:117px; height:150px; z-index:2; }
.MED11x14          {width:314px; height:400px; z-index:2; }
.SML12x16          {width:112px; height:150px; z-index:2; }
.MED12x16          {width:300px; height:400px; z-index:2; }
.SML12x18          {width:100px; height:150px; z-index:2; }
.MED12x18          {width:266px; height:400px; z-index:2; }
.SML12x24          {width:75px; height:150px; z-index:2; }
.MED12x24          {width:200px; height:400px; z-index:2; }
.SML14x11          {width:190px; height:150px; z-index:2; }
.MED14x11          {width:509px; height:400px; z-index:2; }
.SML14x18          {width:116px; height:150px; z-index:2; }
.MED14x18          {width:311px; height:400px; z-index:2; }
.SML16x12          {width:200px; height:150px; z-index:2; }
.MED16x12          {width:533px; height:400px; z-index:2; }
.SML16x20          {width:120px; height:150px; z-index:2; }
.MED16x20          {width:320px; height:400px; z-index:2; }
.SML18x12          {width:225px; height:150px; z-index:2; }
.MED18x12          {width:600px; height:400px; z-index:2; }
.SML18x24          {width:112px; height:150px; z-index:2; }
.MED18x24          {width:300px; height:400px; z-index:2; }
.SML20x16          {width:187px; height:150px; z-index:2; }
.MED20x16          {width:500px; height:400px; z-index:2; }
.SML24x12          {width:300px; height:150px; z-index:2; }
.MED24x12          {width:800px; height:400px; z-index:2; }
.SML24x16          {width:225px; height:150px; z-index:2; }
.MED24x16          {width:600px; height:400px; z-index:2; }
.SML24x18          {width:200px; height:150px; z-index:2; }
.MED24x18          {width:533px; height:400px; z-index:2; }
.SML24x24          {width:150px; height:150px; z-index:2; }
.MED24x24          {width:400px; height:400px; z-index:2; }
.SML30x20          {width:225px; height:150px; z-index:2; }
.MED30x20          {width:600px; height:400px; z-index:2; }
</style>
