/* ====== 		  */
/*  Main areas  */
/* ====== 		  */
#LeftMenu
{
  /*height: 436px; /* <-- aangepast voor NPM */
  /*width: 218px;	/* <-- aangepast voor NPM */
  /*background-color: #ffcc66;
  /*padding: 0px;
  border:1px solid #ff6600;*/
  width:146px;
 /* padding-top:65px;*/
  padding-left:60px;
  padding-bottom:80px;
}

#MainArea
{
  width:564px;
  /*border-top:1px solid #ff6600;*/
  /*background-color: #FFFFFF; /* <-- aangepast voor NPM */
  padding-left: 25px;
  padding-bottom:140px;
  /*padding-right:140px;*/
}

/* ====== */
/*  Login */
/* ====== */

.login .loginHeader {
  color: #cc1010;
  font-weight: bold;
  text-align: center;
}

.login .loginLabel {
   font-family: Verdana;
   font-size: 8pt;
   width: 150px;
   padding-right: 5px;
}

.login .loginTextBox {
  width: 272px;
  margin-bottom: 5px;
}

.login .loginButton {
  margin-right: 5px;
}

.login .loginCheckBox {
  font-family: Verdana;
  font-size: 8pt;
  padding-left: 153px;
}

.loggedInUser {
  color: White;
  font-weight: bold;
}

/* ====== 				      */
/*  error messages     	*/
/* ====== 				      */

.errorMessage
{
  margin: 0px;
  padding: 0px;
  font-family: Arial, Helvetica, "Trebuchet MS";
  font-size: 11px;
  font-weight: bold;
  color: Red;
  text-decoration: none;
  text-transform: none;  
}

.requiredFieldError
{
  color: Red;
}

/* ====== 				      */
/*  Global formatting  	*/
/* ====== 				      */


body
{
  margin: 0; /* <-- aangepast voor NPM */
  padding: 0;
  font-family: Verdana, Arial, Helvetica,"Trebuchet MS"; /* <-- aangepast voor NPM */
  font-size: 11px;	 /* <-- aangepast voor NPM */
  font-weight: normal;
  text-decoration: none;
  text-transform: none;
				/* <-- aanpassing NPM2 */
	background-image:url(http://www.politiemuseum.nl/images/bg.jpg); /* <-- aanpassing NPM2 */
	background-position:top center;	/* <-- aanpassing NPM2 */
	background-repeat:repeat-y;	/* <-- aanpassing NPM2 */
	text-align:center;		/* < -- t.b.v. IE6 */
  line-height:20px;
}

html, body { height:100%; margin:0; padding:0; }

html { overflow-y: scroll; } /* to create a vertical dummy scrollbar in Firefox or Safari which would not have a scrollbar with height 100%. If you move to and from pages which don't have a vertical scrollbar to a page which does, it makes the page content jump sideways without a forced dummy scrollbar (works in Firefox and Safari but not in Opera; IE always shows a dummy scrollbar; Opera needs min-height and height: 101% in the container styles but it causes a standard scrollbar, not a dummy, and is less correct.)*/

#sitecontainer {
		font-size:1.1em;
		line-height:2em;
		width:950px;
		margin:0px auto;
		position:relative;
		min-height:100%;

}

#sitecontainer .introArea {
  width: 675px;
}

* html #sitecontainer { height: 100%; } /*IE browsers less than IE7*/

.sitecontainer {		/* <-- toevoeging  = aanpassing NPM2 */
	width:951px;
	margin:0px;
}
#footer {
	clear:both;
	margin:-85px auto 0 auto;
	height:85px;
	width:950px;
	background-image:url(http://www.politiemuseum.nl/images/fotobalk_onder.jpg);
	background-position:center;
	background-repeat:no-repeat;

	}


#fotobalk_boven {
	background-image:url(http://www.politiemuseum.nl/images/fotobalk_boven.jpg);
	background-position:top center;
	background-repeat:no-repeat;
	height:96px;
	width:950px;
}
#logo {
	margin: 14px 0px 0px 18px;
}

#navbar {
	background-image:url(http://www.politiemuseum.nl/images/bg_menu.gif);
	background-position:top center;
	background-repeat:no-repeat;

}
#navbar a { padding-left:20px; }
#navbar a:hover { font-weight:bold; }
#navbar td { line-height:10px; }

#kruimelbalk {
	background-image:url(http://www.politiemuseum.nl/images/bg_adlib_coll.gif);
	background-position:right;
	background-repeat:repeat-y;
	height:80px;
	padding:40px 0px 0px 128px;
	color:#f7a990;

}
#kruimelbalk a {
	color:#f7a990;
	text-decoration:none;
}
#kruimelbalk a:hover {
	color:#F05422;
}
.titelbalk {
	padding:30px 0px 0px 15px;
}

#fotobalk_onder {
	width:950px;
	height:85px;
	margin:-85px auto 0 auto;
	background-image:url(http://www.politiemuseum.nl/images/fotobalk_onder.jpg);
	background-position:bottom center;
	background-repeat:no-repeat;

}

#content {	/* marge tot fotobalk_boven */
	padding-top:16px;
}

TD
{
  font-size: 11px;   /* <-- aangepast voor NPM */
 line-height:20px;
}

.lightLabel a
{
  font-size: 11px; /* Font deliberately specified in px because IE needs this to be a fixed value or it expands the tabCenter div, leaving little white lines under the tabs... don't change this unless you're prepared to redo all the tab layout as well (works fine in Mozilla/Opera, though...) */
  font-weight: normal;
  text-decoration: none;  
  color: #000000; 
}

.lightLabel a:hover
{
  font-size: 11px; /* Font deliberately specified in px because IE needs this to be a fixed value or it expands the tabCenter div, leaving little white lines under the tabs... don't change this unless you're prepared to redo all the tab layout as well (works fine in Mozilla/Opera, though...) */  
  font-weight: normal;
  text-decoration: none;
  color: #000000;
  background-color:#FFFFFF;
}

.button a
{
  width: 135px;
  font-size: 11px; /* Font deliberately specified in px because IE needs this to be a fixed value or it expands the tabCenter div, leaving little white lines under the tabs... don't change this unless you're prepared to redo all the tab layout as well (works fine in Mozilla/Opera, though...) */  
  color: #000000;
}
.activebutton a
{
  width: 135px;
  font-size: 11px; /* Font deliberately specified in px because IE needs this to be a fixed value or it expands the tabCenter div, leaving little white lines under the tabs... don't change this unless you're prepared to redo all the tab layout as well (works fine in Mozilla/Opera, though...) */  
  color: #ff6600;
}

.activebutton a:hover, .button a:hover
{
  width: 135px;
  font-size: 11px; /* Font deliberately specified in px because IE needs this to be a fixed value or it expands the tabCenter div, leaving little white lines under the tabs... don't change this unless you're prepared to redo all the tab layout as well (works fine in Mozilla/Opera, though...) */  
  color: #ff6600;
}


a
{
  font-size: 11px; /* Font deliberately specified in px because IE needs this to be a fixed value or it expands the tabCenter div, leaving little white lines under the tabs... don't change this unless you're prepared to redo all the tab layout as well (works fine in Mozilla/Opera, though...) */
  font-weight: normal;
  text-decoration: none;  
  color: black;  
}



a:hover
{
  font-size: 11px; /* Font deliberately specified in px because IE needs this to be a fixed value or it expands the tabCenter div, leaving little white lines under the tabs... don't change this unless you're prepared to redo all the tab layout as well (works fine in Mozilla/Opera, though...) */  
  font-weight: normal;
  text-decoration: none;
  color: #FF6600;	
}

H1
{
	font-size:130%;
	margin:0;
	padding:0;
	margin-bottom:2em;
	color:#233c7a;
/*  font-family: Arial, Helvetica, "Trebuchet MS"; /*  font-size: 1em; */ /* <-- aangepast voor NPM */
  /*font-size: 1.3em;
  font-weight: bold;
  color: #ff6600;
  text-decoration: none;*/
}

H2
{
  font-size:100%;
	margin:0;
	padding:0;
	color:#000;
	/*padding-top: 3px;
  padding-bottom: 8px;
  font-weight: bold;
  font-size: 1em;
  margin: 0px;
  color: #ffcc66;
  font-family: Arial, Helvetica, "Trebuchet MS"; /* <-- aangepast voor NPM */
  /*text-decoration: none;*/
}

UL
{
  list-style-type: none;
}

.hilite
{
  font-weight: bold;
  color: #ff6600;
}

.highlight
{
  font-weight: bold;
  color: #ff6600;
}

/* Special Area's */
/*
#languageFlags
{
  position: absolute;
  top: 40px;
  right: 0px;
}

#innerFlags
{
  background-color: #eeeeee;
  padding-right: 10px;
  padding-left: 5px;
}

.flag
{
  position: relative;
  top: 2px;
}
*/

/* ====== */
/*  TABS  */
/* ====== */
/*
.tabUnderlay
{
	border-bottom: 0px solid maroon;
}
*/
/*
#tabRightSpacer
{
	height: 15px;
	border-bottom: 0px solid maroon;
}

*>#tabRightSpacer
{
	height: 15px;
}


#tabLeftSpacer
{
	border-bottom: 0px solid maroon;
}
*/
.tab, .activetab
{
   	position: relative;
	float: left;
	top: 0;
	left: 0; /* controls the horizontal position of the tabs */
	height: 15px;
	width: 146px;
	min-width: 146px;
	margin: 0; /* adjust these left and right margin values to change how much the tabs overlap or are seperated */
	border-collapse: collapse;
	padding: 0; /* these paddings need to be the same width as the tab end images */
	text-align: left;
	z-index: 2;
}

.tab a, .activetab a
{
  font-size: 11px; /* Font deliberately specified in px because IE needs this to be a fixed value or it expands the tabCenter div, leaving little white lines under the tabs... don't change this unless you're prepared to redo all the tab layout as well (works fine in Mozilla/Opera, though...) */
  font-weight: bold;
  text-decoration: none;  
  color: white;
  padding-left:20px; 
}

.tab a:hover, .activetab a:hover
{
  font-size: 11px; /* Font deliberately specified in px because IE needs this to be a fixed value or it expands the tabCenter div, leaving little white lines under the tabs... don't change this unless you're prepared to redo all the tab layout as well (works fine in Mozilla/Opera, though...) */  
  /*font-weight: bold;*/
  text-decoration: none;
  color: white;
}

*>.tab, *>.activetab
{
	width: auto;
}

.activetab
{
  z-index: 3;
}



.tab, .tab a
{
  font-size: 11px; /* Font deliberately specified in px because IE needs this to be a fixed value or it expands the tabCenter div, leaving little white lines under the tabs... don't change this unless you're prepared to redo all the tab layout as well (works fine in Mozilla/Opera, though...) */
  font-weight: bold;
  text-decoration: none;  
  color: white;  
  line-height:15px;

}

.activetab, .activetab a, 
{
  font-size: 11px; /* Font deliberately specified in px because IE needs this to be a fixed value or it expands the tabCenter div, leaving little white lines under the tabs... don't change this unless you're prepared to redo all the tab layout as well (works fine in Mozilla/Opera, though...) */  
  font-weight: bold;
  text-decoration: none;
  color: #ffffff; /*#ff6600;*/
  line-height:15px;
}

.activetab a:hover {
	color:#ffffff;
	font-weight:bold;
}

.tab a:hover
{
  	color: #fff;
	font-weight:bold;
}

.tabCenter
{
  height: 15px;
  /*border-top: 1px solid #ff6600;*/
  /*background: #dee2eb;*/
  /*border-bottom: 1px solid maroon;*/
  padding:0px 0px;
}

*>.tabCenter
{
	height: 15px;
}

.activetab .tabCenter
{
 	/*background: #ff6600; /*#eeeeee;*/
	height: 15px;
	line-height:15px;
}


.tabEndLeft, .tabEndRight
{
	position: absolute;
	top: 0;
	height: 15px;
	/*width: 17px;*/
	margin: 0;
}

*>.tabEndLeft, *>.tabEndRight
{
	height: 15px;
}

.activetab .tabEndLeft, .activeTab .tabEndRight
{
	/*border-bottom: 1px solid #ffe5b1;*/
}


.tabEndLeft
{
	/*border-left:1px solid #ff6600;	/* <-- aangepast voor NPM */
	left: 0px;
}

.tabEndRight
{
	/*border-right:1px solid #ff6600;	/* <-- aangepast voor NPM */
	right: 0px;
}

.activetab .tabEndLeft
{
	/*border-left:1px solid #ff6600;	/* <-- aangepast voor NPM */
}

.activetab .tabEndRight
{
	/*border-right:1px solid #ff6600;	/* <-- aangepast voor NPM */
}



/* ======           */
/* Leftnav Buttons  */
/* ======           */

.button
{
  text-align: left;
 /* background-color: #FFE5B1;*/
  padding: 5px 0px 5px 5px;
  background-color:#e9ebf1;
  border-bottom:1px solid #fff;
}

.activebutton
{
  text-align: left;
  /*background-color: #ffffff;*/
  padding: 5px 0px 5px 5px;
  background-color:#FDEDE8;
  border-bottom:1px solid #fff;
}


.checkBox
{
  border: 0px;
  padding-top: 2px; 
}

.dark
{
  background: #e9ebf1;
  vertical-align: top;
}

.light
{
  vertical-align: top;    
}

/*
.navButton {
	width:218px;
	text-align:right;
	padding:2px 0px 2px 0px;
	margin:0px 0px 0px 0px;
}

.navButton:hover{
  /*background-color: #ffffff;*/
}

.navButton a {
	font-weight:normal;
}

/* ------------ */
/* Search form  */
/* ------------ */


.darkLabel
{
	background: #e9ebf1;
	vertical-align: middle;
  	padding-left: 5px;	
  	height: 25px;
	font-weight:bold;
}

.lightLabel
{
	padding-right: 10px;
	padding-left: 5px;
	background: #e9ebf1;
	vertical-align: middle;
	height: 25px;
}	

.searchFormDropdown, .searchFormTextbox, .listButton
{
  padding-left: 5px;
  padding-right: 10px;  
}

.dualPanelSeparator
{
  text-align: center; 
}

.checkBoxCol
{
  padding-left: 1px;
  padding-right: 5px;
  width: 0px;
}

/* =============== */
/* Brief results   */
/* =============== */

.briefResultsTable
{
  width: 675px; /*430px;*/
  border-collapse: collapse;
margin:10px 0px;
  
}

.briefResultsTable td
{
	padding: 5px;	
	vertical-align: top;
line-height:20px;
}

.briefThumbnailCell
{
	text-align: right;
}

.briefOptionControl
{
  border: 1px solid #000000;
  /*width: 600px;*/
  padding: 2px; 
}

/* =============== */
/* Archive results   */
/* =============== */


.ArchiveResultsTable
{
  border-collapse: collapse;
width:80%;
}

.ArchiveResultsTable td
{
	padding: 0px;	
}

.ArchiveThumbnailCell
{
	text-align: right;
}

.archivedetailTable
{
	width: 600px;
	border: none;
	border-collapse: collapse;
	text-align: left;
	background: #e9ebf1;
}

.active, .active a
{
  background: #cccccc;
  font-weight: bold;
  color: #ff6600;  
}

/* ---------------- */
/* Detail display   */
/* ---------------- */

#detailNav
{
	margin-bottom: 20px;
}	

#detailNav span
{
	vertical-align: top;
}

.detailTable
{
	width: 500px;
	border: none;
	border-collapse: collapse;
	background: none;
	text-align: left;
}

.area
{
	width: 675px;
	border: none;
	border-collapse: collapse;
	background: none;
	text-align: left;
}

.detailTable th
{
	padding-left: 10px;
	background: #e9ebf1;
	text-align: left;
	color: #000000;
	font-size: 1em;
}

.detailTable td
{
	padding-left: 10px;
	vertical-align: top;
	background-color: #e9ebf1;
line-height:20px;
}

.detailSelectionRecordSeperator
{
	height: 2px;
	width: 80%; /*500px; /*100%;*/
	margin: 0;
	border: none;
	padding: 0;
	background: #aaaaaa;
	background-color: #aaaaaa;
	color: #aaaaaa;	
}

*>.detailSelectionRecordSeperator
{
	margin: 10px 0 10px 0;
}

/* ---------------- */
/* Comments   */
/* ---------------- */
.showLinkedData, .addComment {
  
  padding-top: 25px;
  padding-left: -10px;
}

#detailComment {
  width: 600px;
}

.addComment td, #detailComment td {
  padding-left: 10px;
}

.showLinkedData table, .addComment table {  
  width: 500px;
}

.showLinkedData .detailCommentsTable {
  border: none;
  background: none;
  text-align: left;
}

.showLinkedData .detailCommentsTable th, .addComment .addCommentTable th, #detailComment th {
  padding-left: 10px;
  text-align: left;
  vertical-align: top;
  background-color: #EF5121;
  color: White;
  height: 25px;
}

.showLinkedData .detailCommentsTable .loginLogoutButton {
  position:absolute;
  width: 30px;
}

.showLinkedData .detailCommentsTable .header {
  margin:3px 0 0 40px;
  position:absolute;
}

.showLinkedData .detailCommentsTable tr {
  vertical-align: top;
}

.showLinkedData .detailCommentsTable .evenRow {
  background-color: White;
}

.showLinkedData .detailCommentsTable tr .date {
  padding-left: 10px;
  width: 75px;
}

.showLinkedData .detailCommentsTable tr .name {
  width: 93px;
}

.showLinkedData .detailCommentsTable tr .comments {
}

.addComment #showFormImage {
  position: absolute;
}

.addComment #showFormLink {
  position: absolute;
  margin-left: 20px;
}

.addComment .addCommentTable td.label {
  vertical-align: top;
  text-align: left;
  width: 183px;
}

.addComment .addCommentTable input {
  width: 401px;
}

.addComment .addCommentTable textarea {
  width: 401px;
  height: 136px;
}

/* ------------- */
/* COPYINFO WINDOW  */
/* ------------- */
body#copyInfo
{
  background-color: #e9ebf1;
  color: #000000;  
  text-align: left; 
  padding: 15px;

}

body#copyInfo td
{
  text-align: left;  
  border: solid 1px black; 
}

body#copyInfo .header
{ 
  font-weight: bold; 
}

/* ------------- */
/*  PHOTO WINDOW */
/* ------------- */

body#photoInfo
{
  background-color: #e9ebf1;
  color: #000000;
  padding: 20px;
}


/* ------------- */
/*  HELP WINDOW  */
/* ------------- */

body#helpContent {
  background-color: #e9ebf1;
  color: #000000;
  padding: 20px;
  text-align:left;
}

.helpDiv
{
  border-left: 2px solid #cccccc;
  padding: 10px;
}

.perkament .tdTop
{
  background-image: url(../images/perkament-top.gif);
  width:600px;  
  height: 78px;
}

.perkament .tdMiddle
{
  background-image: url(../images/perkament-middle.gif);
  width:400px;
  background-repeat: repeat-y;
  text-align: justify;  
}

.perkament .tdBottom
{
  background-image: url(../images/perkament-bottom.gif);
  width:600px;
  height: 202px;
}


/* ------------- */
/* CART WINDOW   */
/* ------------- */
.listContent
{   
  background:#e9ebf1;     
  border-left: solid 10 #e9ebf1;
}

/* ------------- */
/* CART WINDOW   */
/* ------------- */

.reserveButton a
{
  font-weight:bold;
  color: #000000;
}

.reserveButton a:hover
{
  font-weight:bold;
  color: #ff6600;
}

.termsAndConditionsDownloadButton
{
  text-align: center;
  background-color: #e9ebf1;
  border-top: 2px solid #999999;
  border-bottom: 2px solid #000000;
  border-right: 2px solid #555555;
  border-left: 2px solid #777777;
  padding-left: 5px;
  padding-right: 5px;
  padding-top: 1px;
  padding-bottom: 1px;
}


/* -------------      */
/* CALENDAR WINDOW    */
/* -------------      */

.CalenderBody
{   
  background:#e9ebf1; 
}

.calendar table td a,.calendar table td 
{   
  font-family: Arial, Helvetica, "Trebuchet MS";
  
  font-size: 11px;
  margin-left:0px;  
  background-color:#e9ebf1; 
  color : #000000;
}

.calendar table .DayHeader
{   
  background-color: #c33030; 
  color : #FFFFFF;
}

.calendar table td a .SelectedDay
{   
  background-color:#e9ebf1; 
  color:black;
}

.calendar table .TodayDay a
{   
  background-color: #c33030; 
}

.calendar table .Selector
{   
  background-color:#e9ebf1; 
}

.calendar table .NextPrev, .calendar table .Title
{   
  background-color:#e9ebf1;  
}