/* 
	Stylesheet by Mediabyrån at Karolinska Institutet University Library 
	Sofia Samuelsson  2008-03-12

   ToDo:
 * Include directives for neat printing
 * Clean up - put menu directives together
 
*/

/* General styling for all areas */
/* ---------------------------------------------------------------------------- */

/* Don't set font size in body. Set it in content area. Otherwise everything else will be relative to this */
body {
   margin: 0px 0px 0px 0px;
   padding: 0px 0px 0px 0px;
   font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
   text-align: center;
   background-color:#EAE5DF;
   min-width: 945px;
}
#body-color{
	background-color:#fff;
	width:100%;
    text-align: left;
}

/* Set Internet Explorer to inherit fontsize in tables from surrounding element */
table {
    font-size: 100%;
}

/* Set browsers with proper CSS2 support (Mozilla, Opera) to inherit fontsize in tables from surrounding element */
* > table {
	font-size: inherit;
}

/* Set no cellpadding and align top as default for all table cells */
td, th {
   padding: 0px;
	margin: 0px;
   vertical-align: top;
}

/* Set margins to avoid excessive spacing between headers and text */
p, td, th, ul, ol, dl, pre {
	margin-top: 0px;
	margin-bottom: 6px;
}

/* Font family for all headings */
h1, h2, h3, h4, h5 {
	font-family: Arial, Helvetica, sans-serif;
	color: #333333;
	margin-top: 10px;
	margin-bottom: 2px;
}

h1 {
	font-size: 1.3em;
}

h2 {
	font-size: 1.1em;
}

h3 {
	font-size: 0.9em;
}

li {
	margin-top : 6px;
   margin-bottom: 0px;
}

dt {
	font-weight: bold;	
	margin-top : 6px;
   margin-bottom: 0px;
}

hr {
    height: 1px;
    border: none;
    background-color: #666666;
}

/* General link styling */
a:link {
   color: #0473b9;
   text-decoration : none;
  
}

a:visited {
   color: #0473b9;
   text-decoration : none;
}

a:active {}

a:hover {
    text-decoration : underline;
}

/* Content area styling for editors. Should be classes to vork well with Contribute */ 
/* -------------------------------------------------------------------------------- */

/* Set maximum width of body text for readability. CSS2. Only supported by Mozilla and Opera, not IE */
td#content-area p {
   max-width: 50em;  
}

/* Redesign all heading 1  */
h1 {
	color: #333333;
   line-height: 1.1em;
   padding-bottom: 4px;
   margin-bottom: 8px;
   margin-top: 8px;
   padding-top: 12px;
}
h2 {
   color: #333333;
   line-height: 1.0em;
   padding-bottom: 2px;
   margin-bottom: 4px;
   margin-top: 4px;
   padding-top: 6px;
}

/* Table for single-column layout. Just put in 100% to keep any centered objects in the middle */
table.one-column {
	width: 100%;
}
table.one-column td{
	padding-left: 30px;
	padding-right: 30px;
	padding-bottom: 10px;
	line-height: 1.3em;
}
table.one-column img{
	padding-left: 15px;
	padding-top: 5px;
	padding-bottom: 5px;

}
table.one-column div.imgText{
	padding-left: 0px;
	margin-top:0px;
	font-size: 0.82em;

}

table.one-column hr{
   color: #e2e1dc;
   background-color: #e2e1dc; 
   height: 2px;
   padding:0px;

}

/* Table for two-column layout. */ 
table.two-column {
	width: 100%;
   margin-top: 0px;
}

/* Settings common for both columns */ 
table.two-column td {
	width:50%;
	padding-right: 0px;
	padding-left: 0px;


}

/* Right part of two-column layout, including separating border between columns */
table.two-column td.column-right {
   width:50%;
   padding-left: 0px;
   border-left: 2px solid #d2d2d0;
    
}
table.two-column hr{
   color: #e2e1dc;
   background-color: #e2e1dc; 
   height: 2px;
   padding:0px;
}
/* Right part of two-column layout, no separating border */
td.column-right-no-separator {
}

table#image-holder{
	padding: 0px;
	margin: 0px;
}
table#image-holder td{
	padding-right: 10px;
	padding-left:0px;
	margin: 0px;

}

table#image-holder img{
  	padding:0px;
	margin: 0px;
	

}
table#image-holder div.imgText{
	padding-left: 0px;
	margin-top:0px;
	font-size: 0.82em;

}

/* Special classes for frontpage */
/* ------------------------------------------------ */

/* Table for text block in frontpage columns */
#content-area .textbox {
   margin-top: 0px;
   line-height: 1.3em;
}

#content-area .textbox td {
   padding-left: 20px;
   padding-right: 20px;
   text-align:left;
   padding-bottom:0px;
   
}

.textbox h1,
.textbox h2 {
   font-size: 1em;
   font-weight: bold;
   color: #000;
   margin-top: 8px;
   margin-bottom: 0px;
}
.textbox img{
	padding-left: 10px;
	padding-right: 0px;
	margin-top:2px;
}
.textbox a,
.textbox a:visited{
 color:#a60900;
}

textbox a:hover{
 text-decoration:underline;
}
/* Head above text block in columns. Negative margin to point our to the left. */
.texthead {
  margin-left: -20px;
  margin-bottom: 6px;
 
}

.texthead div {
   margin-left: 10px;
   padding-left: 8px;
   padding-bottom:5px;
   padding-top: 2px;
   text-align: left;
   background-image:url(../images/texthead_line.jpg);
   background-repeat:repeat-x;
   font-weight: bold;
   color: #545454;
   font-size: 0.86em;
}
div#open-hours{
	border : 1px solid #a30504;
 	padding: 15px;
	width: 350px;
	background-image:url(../../images/openHours.jpg);
	background-position:top right;
	background-repeat:no-repeat;

}

/* Right margin elements */ 
/* ----------------------------------------------------------------------------------- */

/* Table-style shortcut link box. Should have been done with a div, but sorry, no work in Contribute */
table.shortcuts,  
table.shortcuts-start {
   width: 197px;
   margin:0px;
   text-align:left;
}
table.shortcuts-start{
 background-color:#a30504;
 border-bottom: 1px solid #555756;
}

table.shortcuts div.head div,
table.shortcuts-start div.head div {
   font-size: 0.92em;
   padding: 0px;
   padding-bottom:4px;
   color: #333;
   background-image:url(../images/shortcutHead.gif);
   background-position:left;
   background-repeat:no-repeat;
   margin-bottom:4px;
   margin-top:8px;
   margin-left: 10px;
}
table.shortcuts-start div.head div {
   color: #fff;
   background-image:url(../images/shortcutHeadStart.gif);
   background-position:left;
   background-repeat:no-repeat;


}
table.shortcuts th,
table.shortcuts-start th {
   font-weight: bold;
   vertical-align: top;
   text-align: left;
}

table.shortcuts td,
table.shortcuts-start td {
   margin: 0px;
   padding: 0px;
   padding-left:10px;
   
}
table.shortcuts-start p{
   color: #fff;
   line-height:1.3em;
  
}

table.shortcuts ul,
table.shortcuts-start ul {
   list-style-type: none;
   margin-left : 0px;
   padding-left : 0px;
   margin-top : 0px;
   margin-bottom : 7px;
}

table.shortcuts ul li,
table.shortcuts-start ul li {
   padding-top : 0px;
   padding-bottom : 0px;
   padding-left : 0px;
   padding-right : 0px;
}

table.shortcuts-start ul li#top{
   padding-top:4px;
}

table.shortcuts a, 
table.shortcuts a:visited {
   color: #a30504;
   
}
table.shortcuts-start a,
table.shortcuts-start a:visited{
	color: #fff;
}

table.shortcuts a:hover,
table.shortcuts-start a:hover {
}

/* Decoration image in shortcuts box. Should be aligned at right bottom */
table.shortcuts img,
table.shortcuts-start img {
   margin-right: 0px;
   margin-top: 10px;
   margin-bottom:0px;
   float: right;
}

table#form-holder{
	text-align:left;
	padding-left:0px;
	margin-left:0px;
	margin: 10px;
	margin-top: 0px;
	font-size: 0.7em;
}
table#form-holder a{
	text-decoration:none;
}


td#right-margin hr {
   color: #fff;
   background-color: #fff;
   height: 2px;
   margin-top: 16px;
}

td#right-margin form {
   margin-top: 0px;
}

/* Table-style login box */
table#loginbox {
	width: 190px;
   margin-right: 20px;
   margin-top: 8px;
   border: 1px solid #38695D;
}

table#loginbox div.head {
   margin: 0;
   padding-right: 10px;
}

table#loginbox div.head div {
   color: #206859;
   padding: 4px;
   padding-left: 8px;
   margin: 0;
}

table#loginbox th {
   font-weight: bold;
   vertical-align: top;
	text-align: left;
}

table#loginbox td {
   padding-left: 8px;
   color: #fff;
   background-color: #38695D;
   vertical-align: middle;
   height: 80px;
}

table#loginbox input {
   font-size: 0.9em;
   width: 120px;
}

table#loginbox td#go-button {
   background-image: url(../images/bg_form_go_dot.jpg);
   background-repeat: no-repeat;
   width: 36px;
   padding-left: 12px;
}

table#loginbox td#go-button input {
   width: 24px;
}

/* End of editor-accessible classes - the rest of CSS is design IDs and classes */
/* =============================================================================== */

/* Page and margin layout */
/* ------------------------------------------------------------------------------- */
div#body-holder{
     
	width: 945px;
	background-color:#fff;
	border : 2px solid #c3c2be;
	margin:0 auto;
	margin-bottom:5px;
	margin-top:5px;
	text-align:left;
	
	
}
/* Content holder table */
table#content-holder {
   width: 100%; 
}

/* Actual content area. Set font style and size in relative values (em) to make it scalable in IE */
td#content-area {
   font-size: 0.70em;
   padding-top: 0px;
   padding-left: 0px;
   padding-right: 0px;
   padding-bottom: 0px;
   
}

td#content-area.false{
  font-size: 0.70em;
   padding-top: 0px;
   padding-left: 10px;
   padding-right: 10px;
   padding-bottom: 0px;

}
/* Left margin area */
td#left-margin {
   width: 135px;   
   border-right: 2px solid #e2e1dc;
}

/* Used from DW template property to hide left margin. Used on frontpage. */
td#left-margin.false {
   display: none;
}
td#left-margin img {
  
}

/* Right margin area */
td#right-margin {
   width: 197px;
   font-size: 0.66em;
   padding: 0px;
   margin-top: 0px;
   margin-right: 0px;
   background-color:#ebeae8;
   border-left: 1px solid #bdbcba;

}

/* Use to hide border on right margin on front page */
td#right-margin.false {
   display: none;
}

/* Use this class as a DW template property for hiding right margin, if needed */
/*
td#right-margin.false {
   display: none;
}
*/

/* Hide left menu and right margin to save space when printing, if needed */
/*
@media print {
	td#left-margin {
		display: none;
	}
	td#right-margin {
		display: none;
	}
}
*/

/* Design elements for head */
/* ---------------------------------------------------------------------------- */

/* This object is here just in case it should be needed for coloring purposes */
div#head-holder {
 white-space:nowrap;
}

/* Image banner streching over head to right end */
div#head-banner {
	background-color:#fff;
	margin-left: 0px;
	white-space:nowrap;
	
}

/* Banner image */
div#head-banner img {
	border: 0px; 

}

/* Actual logotype */
div#head-banner img#logo {
	border: 0;

	
}


/* Design elements for horizontal menus */
/* ---------------------------------------------------------------------------- */

div#menu-holder {
	clear: both;
	margin-left: 0px;
    border-left : 1px solid #666;
    border-right : 1px solid #666;
  
   
}

/* Hide menu when printing, because it looks ugly without background colors */
@media print {
	div#menu-holder {
		display: none;
	}
}

/* Class to hide (doubled) bottom border on pages without second level menu */
div.false#menu-holder {
	border-bottom : 0px;
	white-space: nowrap;
	
}

/* Common properties for both menu level containers */
div#menu-holder div {
	white-space: nowrap;
	text-align:left;
	padding-top: 5px;
    padding-bottom: 4px;
	padding-left: 0px;
	background-image:url(../images/bg_menu.jpg);
	background-repeat:repeat-x;
	}

/* Common properties for both menu level links */
div#menu-holder a {
    padding-top : 1px;
    padding-bottom : 1px;
	margin-left: 0px;
	margin-right: 0px;
}

/* Background image in bottom of menu level 1 puts border between menus */
div#menu-level1 {
	font-size: 0.67em;
    border-top : 1px solid #a30506;
    border-bottom : 1px solid #a30506;
    font-weight: bold;
	
}

div#menu-level1 a {
   /*padding-left: 35px;
   padding-right: 32px;*/
   padding-left: 24px;
   padding-right: 23px;
   text-decoration: none;
   padding-top: 6px;
   padding-bottom: 6px;
 	color: #fff;
   background-image: url(../images/menu-bar.gif);
   background-position:left;
   background-repeat:no-repeat;
}

/* Special ID to remove extra border in leftmost menu link */
div#menu-level1 a#menu-edge {
   padding-right: 25px;

}

div#menu-level1 a:hover {
	background-image:url(../images/bg_menuHover.jpg);
   background-repeat:repeat-x;
	border-top: 1px solid #a30506;
	border-bottom: 1px solid #a30506;
	padding-top: 5px;
    padding-bottom: 4px;
}

/* Background image in link overwrites and thus "removes" default background border from outer td */
div#menu-level1 a.true, 
div#menu-level1 a.true:hover, 
div#menu-level1 a.true:visited {
   background-image:url(../images/bg_menuDown.jpg);
   background-repeat:repeat-x;
   padding-top: 5px;
   padding-bottom: 4px;
   background-image: none;
}
div#menu-level1 a.true,
div#menu-level1 a.true:visited{
  background-image:url(../images/bg_menuDown.jpg);
  background-repeat:repeat-x;
}
/*Remove background image on link after the selected one - will not work in IE5-6 */
/*div#menu-level1 a.true + a {
    background-image: none;  
   text-decoration: none;
}*/

span#language-switcher{
	text-align:right;
	font-size: 0.80em;
	/* display: none; Change to "none" here if language switcher is not desired on site */
}
span#language-switcher a{
	color:#fff;

}
span#language-switcher img{
	border: 0px;

}
#language-switcher a, 
#language-switcher a:hover{

	font-variant: normal;
}

#language-switcher a:hover
{

}

div#menu-level2 {
	font-size: 0.7em;
	background-color : #D3D3D5;
}

div#menu-level2 a {
	padding-left: 18px;
    padding-top: 3px;
   padding-bottom: 3px;
   margin:0px;
   line-height: 0.9em;
   color: #b40406;
   text-decoration: none;
   font-weight: normal;
   display: block;
   width: 170px;
}

div#menu-level2 a:hover {
 	color: #3399CC;
}

div#menu-level2 a.true, 
div#menu-level2 a.true:hover, 
div#menu-level2 a.true:visited {
 	color: #003366;
	font-weight: bold;
	background-color : #D3D3D5;
}

/*table#menu-level2 {
    font-weight: bold;
   margin: 0px;
   padding: 0px;
   font-weight:normal;
}
table#menu-level2 td {
   margin: 0px;
}


table#menu-level2 h1{
 	font-family: Verdana, Arial, Helvetica;
	font-size: 1.0em;
	padding-left: 8px;
	color: #333;
	margin-top: 0px;
	margin-bottom: 0px;


}
table#menu-level2 a  {
   padding-left: 18px;
    padding-top: 3px;
   padding-bottom: 3px;
   margin:0px;
   line-height: 0.9em;
   color: #b40406;
   text-decoration: none;
   font-weight: normal;
   display: block;
   width: 170px;
  
}
*/
/* Special ID to remove extra border in leftmost menu link */

table#menu-level2 a#menu-edge {
   padding-right: 11px;
}

table#menu-level2 a:hover {
	background-color:#e0dedf;
	/*background-image:url(../images/menu_arrow.gif);
	background-repeat:no-repeat;*/
	margin-top: 0px;
	margin-bottom:0px;
}


/* Background image in link overwrites and thus "removes" default background border from outer td */
table#menu-level2 a.true, 
table#menu-level2 a.true:hover, 
table#menu-level2 a.true:visited {
   	background-color:#e0dedf;
	/*background-image:url(../images/menu_arrow.gif);
	background-repeat:no-repeat;*/
	margin-top: 0px;
	margin-bottom:0px;
		
   
}

/* Remove background image on link after the selected one - will not work in IE5-6 */
table#menu-level2 a.true + a {
    background-image: none;  
   text-decoration: none;
}
table#menu-level2 td.heading{
	padding-left: 16px;
	padding-bottom: 2px;
	background-image:url(../images/menuSquare.gif);
	background-repeat:no-repeat;
	background-position:left top;
	margin-top: 6px;


}
table#menu-level2 a.heading:hover{
	background-image:url(../images/menuSquareHover.gif);
	background-repeat:no-repeat;
	background-position:left top;


}
td#menu-bottom{
	height: 0px;
}


/* Structure marker */
/* ------------------------------------------------------------ */

div#structure-marker {
	clear: both;
	margin-left: 150px;
	font-size: 60%;
	border-left: 1px solid #cccccc; 
	border-right: 1px solid #eeeeee; 
	border-bottom: 1px solid #eeeeee;
	padding-left: 2px;
	padding-top: 4px;
	padding-bottom: 4px;
	padding-left: 4px;
	white-space: nowrap;
	font-weight: bold;
	color: #666666;
}

div#structure-marker a {
	color: #333355;
	font-weight: normal;	
}

/* Vertical menus */
/* ---------------------------------------------------------------- */

div#menu-left,
div#menu-left-start {
   font-size: 0.70em;
   line-height: 1.1em;
   margin-top: 0px;
   margin-left:0px;
   width: 192px;
   vertical-align:top;

}
div#menu-left-start{
	width: 135px;
	margin:0px;
	padding:0px;
}
div#menu-left-start img{
	padding: 0px;
	margin-bottom:0px;

}

div#menu-left h2{
	font-size: 0.62em;
}
/* If image is used instead of menu, position it neat */
/*div#menu-left img {
	padding-top: 14px;
	padding-left: 30px;
}*/

/* Menu heading for verical menu */
div#menu-left div.menu-head {
   padding: 3px;
   padding-left: 15px;
   margin-top: 15px;
   margin-bottom:0px;
   font-size: 0.92em;
   font-weight: bold;
   color: #b60404;
   border-top: 2px solid #e2e1dc;
   border-bottom: 2px solid #e2e1dc;
   height: 14px;
 
}

/* List for menu levels 3 and 4 */
div#menu-left ul {
    margin-top: 10px;
	list-style: none;
	padding-left: 0px;
	margin-left: 0px;
}

/* Menu level 3 */
div#menu-left ul li {
   padding-left: 0px;
   margin-bottom: 0px;
   margin-left: 0px;
   margin-right: 8px;
   font-weight: normal;
   padding-top: 0px;
   padding-bottom: 0px;
  
   
}
div#menu-left ul li img{
   background-position:left top;
   padding-left:2px;

}

/* Menu level 4 */
div#menu-left ul li.submenu {
   margin-left: 0px;
   padding-left: 0px;
   margin-top: 0px;
   margin-bottom: 0px;
   padding-top: 0px;
   padding-bottom: 2px;
   font-weight: normal;
   
}

div#menu-left a {
   color: #b40406;
   text-decoration: none;
   display: block;
   /*width: 100%;*/
   padding-top: 6px;
   padding-left: 14px;
   padding-bottom: 7px;
   padding-right: 0px;
   margin:0px;
   background-image: url(../images/menuSquare.gif);
   background-position:left;
   background-repeat:no-repeat;
  

}


div#menu-left ul li#menu-top a {
   border: 0;
}

div#menu-left ul li.submenu a {
   border-top: 0px;
   padding-top: 2px;
   padding-bottom: 2px;
   margin:0px;
   background-image:none;
}
div#menu-left ul li.submenu a:hover {
   margin-right:-8px;
   
}

div#menu-left ul li#menu-bottom a {
   border-bottom: 1px solid #ccc;
}

div#menu-left a:hover {
	background-color : #e0dedf;
	margin:0px;
	margin-right: -8px;

}

/* Class to set selected item in vertical menu, if needed */
div#menu-left ul li a.true {
   font-weight: bold;
   background-image:url(../images/menuArrow.gif);
   background-position:left;
   background-repeat:no-repeat;
   /*background-color : #e0dedf;
   margin-right:-10px;*/ 
}
div#menu-left ul li.submenu a.true{
  background-color : #e0dedf;
  background-image:none;
  margin-right:-10px;
  font-weight: normal;

}

/* Class to set selected item in submenus, if needed */
div#menu-left a.true {
	font-weight: bold;
	
}

/* Foot elements */
/* ---------------------------------------------------------------------------- */

hr#foot-divider {
}

/* Sorry, Dreamweaver don't handle margins properly in combination with clear :-( */



div#foot-holder {
	margin-top: 0px;
	margin-left: 0px;
	margin-right: 0px;
	width:100%;

}
	

div#foot {
   font-size: 0.62em;
   color: #000;
   
}

div#foot p {
   margin-top: 7px;
}

div#foot a,
div#foot a:visited {
   text-decoration : none;
	color: #a20800;
}

div#foot a:hover {
   text-decoration : underline;
	color: #a20800;
}
#footMarginSpacerLeft {
   background-image:url(../images/footLeftStart.jpg);
   background-position:left;
   background-repeat:no-repeat;
   width : 145px;
   /*border-bottom : 2px solid #e2e1dc;*/
}

#footMarginSpacerLeft.false {
   background-image:url(../images/footLeft.jpg);
   background-position:left;
   background-repeat:no-repeat;
}

#footMarginSpacerRight {
   text-align:left;
   border-top : 2px solid #e2e1dc;
}
	
#footMarginSpacerLeft.false img{
   width : 195px;
   height: 1px;
}
#footMarginSpacerLeft  img{
   width : 135px;
   height: 1px;
}

#footMarginSpacerRight  img{
	width: 200px;
	height: 1px;
}

#footMiddle {
    width : 100%;
    text-align : center;
	color: #333;
	background-color:#fff;
    border-top : 2px solid #e2e1dc;
    /*border-bottom : 2px solid #e2e1dc;*/
	padding-top: 4px;
	padding-bottom: 5px;
}

div#updated {
	color: #666;
	text-align: right;
	padding-right:5px;
}

div#updated.false {
   display: none;
}

div#credits {
	font-size: 0.56em;
	color: #938e8a;
	text-align: right;
	margin-top: 6px;
	margin-right: 4px;
	width: 945px;
	margin:0 auto;
}

div#credits a,
div#credits a:visited {
   text-decoration : none;
	color: #8d8986;
}

div#credits a:hover {
	text-decoration : underline;
}

/* Hide credits when printing */
@media print {
	div#credits {
		display: none;
	}
}

/* End of stylesheet */
/* =============================================================== */
