/* misc global styles */

body {
	background-color: #F2F0E9;
	margin:0px;
	padding:0px;
	color:#000000;
	line-height:1.4em;
	font-family: Arial, sans-serif;
	font-size:12px;
}

#header{
	width:900px;
	margin: 25px auto 0px auto;
	padding:0px;
}
#logo{
	float:left;
	width:243px;
	margin:0px;
	padding:0px;
}
#searchForm{
	float:right;
	margin-top:20px;
	height:25px;
}
.headerSearch{
	border: 1px solid #000000;
	font-size:10px;
	font-family: Arial, sans-serif;
	font-weight: normal;
	margin: 0px 0px 0px 0px;
	padding:2px;
	width:125px;
}
#navBar{
	float:right;
	width:435px;
	height: 25px;
	margin:20px 0px 0px 0px;
}
#navBar img.navLink{
	margin-right:20px;
	border-bottom:1px solid #F2F0E9;
}
#navBar img.navLink:hover{
	border-bottom:1px solid #6D6C6A;
}
#subnav img{
	float:right;
	margin: 5px 15px 0px 25px;
	border-bottom:1px solid #683343;
}
#subnav img:hover{
	border-bottom:1px solid #EDEDED;
}

.textArea {
	padding:0px 15px 15px 15px;
}

.globalContainer {
	clear:both;
	margin-top: 0px;
	margin-left: auto;
	margin-right: auto;
	width: 900px;
	background-color: white;
	border:1px solid #000000;
}

#globalDiv {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	text-align: justify;
}

#globalDiv a		{ color:#000000; text-decoration:underline; }
/*#globalDiv a:visited	{ color:#000000; text-decoration:underline; }
#globalDiv a:focus		{ color:#000000; text-decoration:underline; }
#globalDiv a:hover		{ color:#000000; text-decoration:underline; }
#globalDiv a:active		{ color:#000000; text-decoration:underline; }*/

#footerBg{
	margin: 40px 0px 100px 0px;
	background-color: #352905;
	padding: 5px 0px 5px 0px;
	text-align:center;
}
#footer {
	width:900px;
	margin:auto;
	text-align: left;
	font-family: Arial, sans-serif;
	font-size:11px;
	color: #FFFFFF;
}

#login {
	width:900px;
	margin:auto;
	text-align: right;
	padding-top:3px;
}

/* Home Page */
.redStripe{
	padding: 3px 0px 0px 0px;
	background-color:#683343;
	height:32px;
	clear:both;
}

.grayStripe{
	padding: 5px 0px 0px 0px;
	background-color:#6D6C6A;
	height:20px;
	clear:both;
}
#hpImages{
	margin:15px 0px 15px 0px;
	height:235px;
	clear: both;
}
.hpColumn{
	float:left;
	width:280px;
	padding-left: 15px;
	margin:0px;
}
.hpTextCol{
	float:left;
	width:417px;
}
.hpLineCol{
	float:left;
	width:2px;
	height:250px;
	background-image: url(../gfx/hp_vert_line.gif);
	margin:0px 15px 15px 15px;
}

/* faceted browser format styles */

.singleFacetContainer {
	margin-top: 15px;
}

.singleFacetHead {
	padding: 5px 0px 0px 15px;
	background-color:#6D6C6A;
	height:20px;
	color:#FFFFFF;
	font-weight:bold;
}

.stepcarousel {
	position: relative; /*leave this value alone*/
	overflow: scroll; /*leave this value alone*/
	margin: auto;
	height: 200px; /*Height should enough to fit largest content's height*/
	margin-left:auto;
	margin-right:auto;
}

.stepcarousel .belt{
	position: absolute; /*leave this value alone*/
	left: 0;
	top: 0;
}

.stepcarousel .panel{
	float: left; /*leave this value alone*/
	overflow: hidden; /*clip content that go outside dimensions of holding panel DIV*/
	font-size:11px;
	margin-top: 10px;
	margin-left: 30px;
	margin-right: 30px;
	width: 140px; /* Width of each panel holding each content. If removed, widths should be individually defined on each content DIV then. */
}

.stepcarousel .panelwide {
	float: left; /*leave this value alone*/
	overflow: hidden; /*clip content that go outside dimensions of holding panel DIV*/
	font-size:11px;
	margin-top: 10px;
	margin-left: 30px;
	margin-right: 30px;
	width: 320px; /* Width of each panel holding each content. If removed, widths should be individually defined on each content DIV then. */

}

.stepcarouselSmall {
	position: relative; /*leave this value alone*/
	overflow: scroll; /*leave this value alone*/
	margin: auto;
	height: 85px; /*Height should enough to fit largest content's height*/
	margin-left:auto;
	margin-right:auto;
}

.stepcarouselSmall .belt{
	position: absolute; /*leave this value alone*/
	left: 0;
	top: 0;
}

.stepcarouselSmall .panel{
	float: left; /*leave this value alone*/
	overflow: hidden; /*clip content that go outside dimensions of holding panel DIV*/
	font-size:11px;
	margin-top: 10px;
	margin-left: 30px;
	margin-right: 30px;
	width: 160px; /* Width of each panel holding each content. If removed, widths should be individually defined on each content DIV then. */
}

.stepcarouselSmall .panelwide {
	float: left; /*leave this value alone*/
	overflow: hidden; /*clip content that go outside dimensions of holding panel DIV*/
	font-size:11px;
	margin-top: 10px;
	margin-left: 30px;
	margin-right: 30px;
	width: 320px; /* Width of each panel holding each content. If removed, widths should be individually defined on each content DIV then. */
}

.stepcarouselSearch {
	position: relative; /*leave this value alone*/
	overflow: scroll; /*leave this value alone*/
	margin: auto;
	height: 82px; /*Height should enough to fit largest content's height*/
	margin-left:auto;
	margin-right:auto;
}

.stepcarouselSearch .belt{
	position: absolute; /*leave this value alone*/
	left: 0;
	top: 0;
}


.stepcarouselSearch .panel{
	float: left; /*leave this value alone*/
	overflow: hidden; /*clip content that go outside dimensions of holding panel DIV*/
	font-size:11px;
	margin:0px;
	width: 82px; /* Width of each panel holding each content. If removed, widths should be individually defined on each content DIV then. */
}
.stepcarouselFilmDetail {
	position: relative; /*leave this value alone*/
	overflow: scroll; /*leave this value alone*/
	margin: auto;
	height: 90px; /*Height should enough to fit largest content's height*/
	margin-left:auto;
	margin-right:auto;
}

.stepcarouselFilmDetail .belt{
	position: absolute; /*leave this value alone*/
	left: 0;
	top: 0;
}


.stepcarouselFilmDetail .panel{
	float: left; /*leave this value alone*/
	overflow: hidden; /*clip content that go outside dimensions of holding panel DIV*/
	font-size:11px;
	margin:0px;
	width: 82px; /* Width of each panel holding each content. If removed, widths should be individually defined on each content DIV then. */
}



/* result set display pagination control styles and results formatting */
.paginationControl {
	float:right;
	text-align: right;
	font-size: 12px;
	color:#FFFFFF;
	margin-top:0px;
	margin-right:15px;
	background-color:#683343;
}

#globalDiv a.actionbutton {
	color:#FFFFFF;
}

#globalDiv a.actionbutton:hover{
	color:#DEDEDE;
	text-decoration: underline;
}

div.facetResultsContainer{
	margin: 10px 0px 10px 15px;
}
div.facetResult{
	margin-bottom:5px;
	padding:5px;
}
div.facetResultBg{
	background-color:#EDEDED;
}

#globalDiv div.facetResult a{
	color:#683343;
	font-size:14px;
	font-weight:bold;
	text-decoration:none;
}
#globalDiv div.facetResult a:hover{
	color:#6D6C6A;
	text-decoration:underline;
}

div.resetFacets{
	float:right;
	margin-top:5px;
	margin-right:10px;
	color:#FFFFFF;
	font-size:14px;
}
#globalDiv div.resetFacets a {
	color:#FFFFFF;
	text-decoration: none;
}

#globalDiv div.resetFacets a:hover {
	color:#DEDEDE;
	text-decoration: underline;
}

.singleFacetContent{
	float:left;
	margin-right:20px;
}
#globalDiv a.removeFacet{
	color: #683343;
	font-size:14px;
	font-weight:bold;
	text-decoration:none;
}
#globalDiv a.removeFacet:hover{
	color: #DEDEDE;
}
#globalDiv a.removeAllFacet{
	color: #683343;
	font-size:14px;
	font-weight:bold;
	text-decoration:none;
}
#globalDiv a.removeAllFacet:hover{
	color: #DEDEDE;
}

/* register form style */

#registerFormTable {
	margin: auto;
	text-align: left;
}

/* film detail styles (used for object display as well - sorry) */

#filmDetailTable {
	width: 100%;
	margin:10px 0px 0px 0px;
}

#filmFieldColumn {
	vertical-align: top;
	padding: 5px 0px 0px 15px;
}

#filmObjectColumn {
	vertical-align: top;
	padding-left:30px;
	width: 432px;
}

.objectReps {
	display: none;
	padding: 5px;
	border: 1px solid black;
	background-color: white;
}

.typeLabel {
	background-color: #808080;
	color: white;
	font-weight: bold;
	cursor: pointer;
	width:100%; /* safari suxx */
}
#filmPageBar{
	float:right;
	text-align:right;
	margin: 5px 15px 0px 0px;
}

.objWrap {
	width: 100%; /* safari suxx */
}

.comment_disclaimer{
	margin:20px 15px 5px 0px;
	line-height:1.1em;
	color:#666666;
	font-size:10px;
}
/* --- search detail --- */

.detail_text {
	font-family: Arial, sans-serif;
	color: #000000;
	margin: 0px 0px 20px 0px;
	line-height:1.3em;
	
}
div.detail_text {
	padding: 3px 0px 0px 0px;
}

.detail_label {
	color: #000000;
	font-weight: bold;
}
.titleRed{
	color: #683343;
	font-size:20px;
	margin-bottom:10px;
	text-align:left;
}
.titleRedSmall{
	color: #683343;
	font-size:14px;
}
.titleBlackSmall{
	color: #000000;
	font-size:14px;
	font-weight:bold;
}
.titleWhiteSmall{
	color: #FFFFFF;
	font-size:12px;
	font-weight:bold;
}
#globalDiv a.titleRed{
	color: #683343;
	font-size:20px;
	margin-bottom:10px;
	text-decoration:none;
	text-align:left;
}
#globalDiv a.titleRed:hover{
	text-decoration:underline;
}
#globalDiv a.titleRedSmall{
	color: #683343;
	font-size:14px;
	margin-bottom:10px;
	text-decoration:none;
	text-align:left;
}
#globalDiv a.titleRedSmall:hover{
	text-decoration:underline;
}
#globalDiv a.titleBlackSmall{
	color: #000000;
	font-weight:bold;
	font-size:14px;
	margin-bottom:10px;
	text-decoration:none;
	text-align:left;
}
#globalDiv a.titleBlackSmall:hover{
	text-decoration:underline;
}
.source{
	font-style:italic;
	font-size:11px;
	margin: 3px 0px 0px 10px;
}
/* search result */
#resultCount{
	clear:both;
	float:right;
	margin: 5px 10px 5px 5px;
}
#searchPageBar{
	float:right;
	text-align:right;
	margin: 5px 15px 0px 0px;
}
.subtitleWhite{
	font-style:italic;
	font-size:12px;
	color:#FFFFFF;
	padding-left:15px;
}

/* object representation scroll window */
.authBgImage{
	width:400px;
	background-color:#FFFFFF;
	text-align:center;
	padding: 15px;
}
.imageScrollerContainer {
	position: relative;
	overflow: hidden;
	width: 400px;
	height: 400px;
}

.imageScrollerImageContainer {
	position: absolute;
	width: 400px;
}

.imageScrollerImage {
	position: absolute;
}

#imageZoomLink{
	float:left;
}
#scrollingImageCounter{
	float:right;
	color:#FFFFFF;
	margin: 0px 15px 0px 15px;
}
#objImageNav{
	clear:both;
	height:18px;
	margin:0px 15px 15px 15px;
}
#relatedDocsCounter{
	float:right;
	color:#FFFFFF;
	margin: 0px 15px 0px 15px;
}


/*
 * note that the .stepcarousel styles are overridden in the view script (the class is hardcoded
 * and I set the styles for the faceted browsers, but needed the plugin for another thing)
 */

.stepcarousel .repbelt{
	position: absolute; /*leave this value alone*/
	left: 0;
	top: 0;
}

.stepcarousel .reppanel{
	float: left; /*leave this value alone*/
	overflow: hidden; /*clip content that go outside dimensions of holding panel DIV*/
	width: 400px; /* Width of each panel holding each content. If removed, widths should be individually defined on each content DIV then. */
	text-align:center;
	vertical-align:middle;
}


/* film object pic scrolling */

.pics {
    height:  270px;
    width:   270px;
    padding: 0;
    margin:  auto;
    margin-top: 15px;
    overflow: hidden;
}

.pics img {
    padding: 15px;
    border:  1px solid #ccc;
    background-color: #eee;
    margin: auto;
}

/* took the following from OpenCollectionAccess */


/* --- form elements --- */
form {
	display: inline;
	margin:0px;
	padding:0px;
}
input[type="text"] {
	border: 1px solid #6D6C6A;
	font-size:11px;
	font-family: Arial, Helvetica, sans-serif;
	font-weight: normal;
	margin: 0px;
	padding:2px;
}
input[type="password"] {
	border: 1px solid #6D6C6A;
	font-size:11px;
	font-family: Arial, Helvetica, sans-serif;
	font-weight: normal;
	margin: 0px;
	padding:2px;
}
input[type="file"] {
	font-size:11px;
	font-family: Arial, Helvetica, sans-serif;
	font-weight: normal;
	margin: 0px;
	padding:0px;
}

input[type="textarea"] {
	border: 1px solid #6D6C6A;
	font-size:11px;
	font-family: Arial, Helvetica, sans-serif;
	font-weight: normal;
	margin: 0px;
	padding:2px;
}
textarea {
	border:1px solid #6D6C6A;
	font-size:11px;
	font-family: Arial, Helvetica, sans-serif;
	font-weight: normal;
	margin: 0px;
	padding:2px;
}
.error{
	font-weight:bold;
	font-size: 14px;
	color: #683343;
}

.formLabel{
	margin: 10px 0px 0px 0px;
	font-weight:bold;
	text-align:left;
}


# --- old styles
.docheader {
	text-align: center;
	margin: auto;
	width: 900px;
	height: 95px;
	background-image: url(../gfx/header.gif);
}

.navbar {
	margin: auto;
	width: 900px;
	height: 30px;
	background-color: white;
}


/* ----------------------------------------------------------------------- */
/* --- Styles for image rollovers aka 'tooltips'					   --- */
/* ----------------------------------------------------------------------- */
#tooltip {
	position: absolute;
	z-index: 3000;
	border: 1px solid #1C2B4D;
	background-color: #FFFFFF;
	padding: 10px 10px 10px 10px;
	opacity: 0.9;
	text-align: center;
}
#tooltip h3, #tooltip div {
	margin: 0;
	color: #000000;
}
#tooltip .rolloverTitle{
	margin: 5px 0px 0px 0px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-weight:bold;
	color: #000000;
	width:300px;
}
#tooltip .rolloverTitleNarrow{
	margin: 0px;
	padding:0px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight:bold;
	color: #000000;
}

/* LIST STYLES */
ul{
	list-style-image: url(../gfx/arrow.gif);
	margin: 10px 0px 5px 40px;
	padding: 0px;
	font-size: 12px;
	list-style-position: outside;
}
ul li{
	margin: 15px 0px 0px 0px;
}

/* Identify */
#identify_gallery td{
	width:140px;
	height:140px;
	background-color:#F2F0E9;
}
.gray{
	color:#6D6C6A;
}