body { height: 100%; width: 100%; margin: 0px; text-align:center}

td { font-family:Arial, Helvetica, sans-serif; font-size:12px; color:#505050; }

a { color:#505050; text-decoration:none; }
a:hover { color:#000000; text-decoration:none; }
a.blue { color:#658398; text-decoration:none; }
a.blue:hover { color:#325771; text-decoration:none; }



img.arrowButton	{ border:0px; filter:Alpha(opacity=20); }
a img.arrowButton	{ border:0px; filter:Alpha(opacity=20); }
a:hover img.arrowButton	{ border:0px; filter:Alpha(opacity=100); }

.search2 .arrowButton {	filter:Alpha(opacity=70); }

.highlight { color:#F18F39; }
.small { font-size:10px; }

.main {
	font-family:Arial, Helvetica, sans-serif; 
	font-size:12px; 
	color:#505050;
	width:557px;
	text-align: center;
	padding: 0px;
}

.disabled {
	color: #FFFFFF;
}

/* Styles for site elements */

.headerContent {
	background-color:#FFFFFF;
	height:20px;
	width: 100%;
	float: left;
	margin-bottom: 5px;
	} 

.headerContent	td.moduleContext { font-size:30px; color:#FFFFFF; padding:10px; vertical-align:top; text-align:left; }

.headerContent	td.siteFunctions { font-size:10px; color:#E3E3E8; padding:10px; float:right; text-align: right; }
.headerContent	td.siteFunctions a { font-size:10px; color:#E3E3E8; text-decoration:none; }
.headerContent	td.siteFunctions a:hover { color:#FFFFFF; text-decoration:none; }
.headerContent td.siteFunctions table.siteFunctionBarTable {float: right;}
.headerContent td.siteFunctions .menuContainer  { margin-right: 10px; }
.headerContent td.siteFunctions .siteSearchFunction input {width: 12em; }

.headerContent	td.moduleFunctionBar { padding-bottom:3px;padding-top:0px; }
.headerContent	td.moduleFunctionBar a { color:#000000; text-decoration:none; margin-left:10px; }
.headerContent	td.moduleFunctionBar a:hover { color:#000000; text-decoration:none; }
.headerContent	td.moduleFunctionBar a.active { color:#000000; text-decoration:none; font-weight:bold; }

/* Render the reference module function link invisible on the far left end */
.headerContent	td.moduleFunctionBar .reference {	position: absolute; left: -999em; }


.headerLogo {
	width: 110px; 
	height: 110px;
	background-color:#6B6B6B; 	
	float: right;
	margin-bottom:5px;
}

.headerLogo img {float: left; width:102px; height:110px; }


/* Place to define the content and module selection bar hight! bodyArea contains 'content' and 'moduleSelectionBar' class*/
.bodyArea {
	float:left;
	width:100%;
	height:557px;
}

.bodyArea .menuContainer {
	float:right;
	color:#505050;
	padding: 0;
}

.elementNavigator{float: left;}

/* Styles for module selection bar -- may be used to control positioning */
.moduleSelectionBar { 
	background-color:#61637F; 
	line-height:16px; 
	width: 110px; 
	height: 100%; 
	float: right;
	text-align: left;
}

.moduleSelectionBar a { color:#FFFFFF; text-decoration:none; padding-left: 7px;}
.moduleSelectionBar a:hover { color:#FFC771; text-decoration:none; }
.moduleSelectionBar a.active { color:#FFB848; text-decoration:none; }

.moduleSelectionBar .externalReferenceLinks { padding-top: 25px; }
.moduleSelectionBar .moduleLinks { padding-top: 25px; }

.elementNavigator .firstElementLink {
	padding-top: 6px;
	border-top: 1px solid #ABABAB;
}

/*
 * Styles for top level module function content (class "content")
 *
 * Note: Styles can be customized for individual modules by prefixing the standard style with '.<ModuleName>'.
 *       Example: The detail image size should be different for the Artist module function:
 *                .artist table.detail td.image img {	height:200px}
 */
.content { 
	background-color:#EBEBEB; 
	float: left;
	width: 557px;
	height: 100%;
}

.content table.contentmenu { margin-top:5px;}	
.content table.contentmenu td { font-size:10px; color:#505050; padding:6px; }
.content table.contentmenu td a { font-size:10px; color:#505050; text-decoration:none; }
.content table.contentmenu td a:hover { color:#000000; text-decoration:none; }
.content table.contentmenu td.result { font-size:11px; font-weight: bolder; color:#505050; padding:6px;  white-space:nowrap; }

.content table.list { border-bottom: 2px solid #FFFFFF; }
.content table.list td { padding: 6px; vertical-align:top; }
.content table.list td img { width: 140px;}

.content table.lightbox tr.images td.lightbox_1x1 { height:350px; background-color:#F4F4F4; border-right: 2px solid #FFFFFF; vertical-align:middle; padding: 2px}
.content table.lightbox tr.images td.lightbox_1x1 img { width:350px;  }
.content table.lightbox tr.images td.lightbox_1x2 { height:300px; background-color:#F4F4F4; border-right: 2px solid #FFFFFF; vertical-align:middle; padding: 2px}
.content table.lightbox tr.images td.lightbox_1x2 img { width:250px; }
.content table.lightbox tr.images td.lightbox_2x3 { height:220px; background-color:#F4F4F4; border-right: 2px solid #FFFFFF; vertical-align:middle; padding: 2px}
.content table.lightbox tr.images td.lightbox_2x3 img { width:180px; }
.content table.lightbox tr.images td.lightbox_3x4 { height:180px; background-color:#F4F4F4; border-right: 2px solid #FFFFFF; vertical-align:middle; padding: 2px}
.content table.lightbox tr.images td.lightbox_3x4 img { width:130px; }
.content table.lightbox tr.images td.lightbox_4x5 { height:150px; background-color:#F4F4F4; border-right: 2px solid #FFFFFF; vertical-align:middle; padding: 2px}
.content table.lightbox tr.images td.lightbox_4x5 img { width:100px; }
.content table.lightbox tr.text td { font-size:10px; color:#505050; padding: 6px; border-bottom: 2px solid #FFFFFF; border-right: 2px solid #FFFFFF; vertical-align:top; text-align:center;}

.content table.detail { height: 95%; }
.content table.detail tr.imageBlock { height: 80px; }
.content table.detail tr.captionBlock { height: 100%; }

.content table.detail td.image { padding: 6px; vertical-align:top; text-align:left; padding-bottom:15px;  }
.content table.detail td.image img { height:250px; }
.content table.detail td.nav td { padding: 1px 10px 1px 10px; border-bottom: 2px solid #FFFFFF; width:1%; background-color:#EBEBEB; }
.content table.detail td.nav .active { border-bottom: 2px solid #DBDBDB; background-color:#DBDBDB; color:#F18F39; }
.content table.detail td.nav .rest { border-bottom: 2px solid #FFFFFF; width:99%; }
.content table.detail td.nav a { font-size:10px; }
.content table.detail td.nav a:hover { color:#F18F39; }
.content table.detail td.text { background-color:#DBDBDB; padding: 10px; vertical-align:top; padding-top:15px; }
.content table.detail td.text p { margin:0px; margin-bottom:9px; }
.content table.detail td.search1 { padding: 6px; background-color:#EBEBEB; border-bottom: 2px solid #FFFFFF; }
.content table.detail td.search2 { padding: 6px; background-color:#EBEBEB; vertical-align:top;}
.content table.detail input, textarea, select { background-color:#FFFFFF; border:0px; width:315px; font-family:Arial, Helvetica, sans-serif; font-size:12px; color:#505050; }

.content .artist table.detail td.image img { height:200px; }
.content .artist table.list td img { width: 130px;}


/* 
 * Styles for inline module function content  
 *
 * Note: Styles can be customized for individual modules by prefixing the standard style with '.<ModuleName>'.
 *       Example: The detail image size should be different for the Artist module inline function:
 *                .artist .inline table.detail td.image img {	height:180px}
 *     
 */
 
/* General definition for inline module content */
.content .inline .content { background-color:#DBDBDB; width:100%; height:100% } 

.content .inline table.contentmenu td.result { font-size:10px; font-weight: normal; color:#505050; padding:6px;  }

.content .inline table.list td img { width: 100px;}

/* Inline module content in the detail view type */
.content .inline table.detail td.image {	padding: 6px 6px 15px;	vertical-align:top; text-align:left; width: 1%; }
.content .inline table.detail td.image img { height:150px}
.content .inline table.detail td.text {	background-color:#DBDBDB; padding: 15px 10px 10px;	vertical-align:top;	width: 99%; }

/* Inline module content in the lightbox view type */
.content .inline table.lightbox tr.images td.lightbox_1x1 { height:250px; background-color:#F4F4F4; border-right: 2px solid #FFFFFF; vertical-align:middle; padding: 2px}
.content .inline table.lightbox tr.images td.lightbox_1x1 img { width:300px;  }
.content .inline table.lightbox tr.images td.lightbox_1x2 { height:200px; background-color:#F4F4F4; border-right: 2px solid #FFFFFF; vertical-align:middle; padding: 2px}
.content .inline table.lightbox tr.images td.lightbox_1x2 img { width:250px; }
.content .inline table.lightbox tr.images td.lightbox_2x3 { height:180px; background-color:#F4F4F4; border-right: 2px solid #FFFFFF; vertical-align:middle; padding: 2px}
.content .inline table.lightbox tr.images td.lightbox_2x3 img { width:180px; }
.content .inline table.lightbox tr.images td.lightbox_3x4 { height:160px; background-color:#F4F4F4; border-right: 2px solid #FFFFFF; vertical-align:middle; padding: 2px}
.content .inline table.lightbox tr.images td.lightbox_3x4 img { width:130px; }
.content .inline table.lightbox tr.images td.lightbox_4x5 { height:130px; background-color:#F4F4F4; border-right: 2px solid #FFFFFF; vertical-align:middle; padding: 2px}
.content .inline table.lightbox tr.images td.lightbox_4x5 img { width:100px; }
.content .inline table.lightbox tr.text td { font-size:10px; color:#505050; padding: 6px; border-bottom: 2px solid #FFFFFF; border-right: 2px solid #FFFFFF; vertical-align:top; text-align:center;}

/* Style for ExternalReference page - The page is using IFrame element to display content from external URL */
.externalReferenceFrame {height: 650px;width: 100%;}

/* Style elements concerned with form handling */
form { padding:0px; margin:0px; display:inline; }
	input.search { border:0px; filter:Alpha(opacity=20); font-size:10px; width:80px; }
	/* Submit search button is rendered invisible but still active*/
   table.detail td.submitSearch input { background-color: transparent; border:0px; width:0px; font-size:0px;  }
	

.highResImage {
	text-align: center;
	vertical-align: middle;
}
.highResImage img { 
	width: 100%; /* allows automatic resize of the image */
}

/* Template Support Stuff */
.tspTitleLink {
	font-weight: bold;
}
.tspReferenceLink {
}

/*
 * Area that defines additional or modified menu settings.
 * The original menu settings are defined in menu.css, which needs to included
 * first into the resulting HTML page.
 *
 * Currently, 2 menu classses are available:
 *   * 'menu1': Language selection drop down menu
 *   * 'menu2': Context function bar drop down menus
 * 
 * Alle menus can be modified when used as inline module by prefixing the selector with 
 * '.inline'.
 * 
 */

/* --- Menu 1 - Language Selection -- */
.menu1 {
}

.menu1 ul {	filter:Alpha(opacity=90); }

.menu1 li a {
	color: #E3E3E8;
}

.menu1 ul li {
	background-color:#ABADBB;
}

.menu1 li li a:hover,
.menu1 li li a:active {
	color: #000;
	background: #82849A;
}

.menu1 li li li a:hover,
.menu1 li li li a:active {
	color: #000;
	background: #82849A;
}


/* ----- Module Context Menue --------- */

.menu2 li{
	font-size:10px;
}

.menu2 ul {	
filter:Alpha(opacity=90); 
}

.menu2 li a {
	color: #444;
}

.menu2 ul li {
	font-size:10px;
}

.menu2 ul li {
	background-color:#E2E2E2; 
}

.menu2 li li a:hover,
.menu2 li li a:active {
	color: #000;
	background: #B6B6B6;
	filter:Alpha(opacity=100); 
}

.menu2 li li li a:hover,
.menu2 li li li a:active {
	color: #000;
	background: #B6B6B6;
}

.inline .menu2 ul li { background-color:#EBEBEB; filter:Alpha(opacity=90); }
.inline .menu2 ul li a:hover,
.inline .menu2 ul li a:active { background-color:#B6B6B6; filter:Alpha(opacity=100); }