/* 
	Stylesheet by Mediabyrån at Karolinska Institutet University Library 
	Features: Scalable text, scalable width, Dreamweaver templates and Contribute support, menus styled as lists 
	Ulf.Kronman@kib.ki.se. 2005-08-06 -- 2006-03-19 /UK 
   TODO:
*/

/* 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;
}

/* 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: #03c;
   text-decoration : none;
}

a:visited {
   color: #039;
   text-decoration : none;
}

a:active {}

a:hover {
    text-decoration : underline;
}

/* Content area styling for editors. Should be classes to vork well with Contribute */ 
/* -------------------------------------------------------------------------------- */

/* Table for single-column layout. Just put in 100% to keep any centered objects in the middle */
table.one-column {
	width: 100%;
}

/* Table for two-column layout. */ 
table.two-column {
	width: 100%;
   margin-top: 20px;
}

/* Settings common for both columns */ 
table.two-column td {
	padding-right: 24px;
	padding-left: 0px;
   width: 50%;
}
table.two-column a {
   text-decoration: none;      
} 

table.two-column a:hover {
	color: #03c;
   text-decoration: underline;
}

table.two-column th a, 
table.two-column th a:visited {
   color: #7f004d;
}

/* Right part of two-column layout */
table.two-column td.column-right {
}

/* Images in left column */
td.column-left img {
   float: left;
   margin-right: 10px;
   margin-top: 4px;
   margin-bottom: 6px;
}

/* 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: 14px;
	padding-top: 12px;
}

/* Special class for page title */
h1.page-title {
   background: transparent url(../images/bg_dotted_horizontal.gif) repeat-x bottom;
   height: 22px;
   margin-left: -20px;
   padding-left: 20px;
   color: #000;
}

/* Special classes for frontpage */
/* ------------------------------------------------ */

/* Styling for frontpage image in left margin */
td#left-margin img {
   padding-left: 30px;
   padding-top: 10px;
   padding-bottom: 20px;   
}

/* Table-style news box */
table.news {
   width: 100%;
}

table.news th {
   font-size: 0.92em;
	text-align: left;
   padding-bottom: 8px;
}

table.news h1 {
   font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
   font-size: 1em;
   margin-top: 8px;
   margin-bottom: 1px;
   padding: 0;
}

table.news p {
   margin: 0;   
   padding-top: 1px;
}

table.news a {
   text-decoration: none;      
} 

table.news a:hover {
	color: #03c;
   text-decoration: underline;
}

table.news th a, 
table.news th a:visited {
   color: #7f004d;
}

table.news h1 a, 
table.news h1 a:visited {
   color: #000;
}


/* Table-style shortcut link box. Should have been done with a div, but sorry, no work in Contribute */
table.shortcuts {
   width: 100%;
   background: #F4F4F4 url(../images/bg_shortcuts.gif) repeat-x;
   clear: both;
   margin-top: 20px;
   border-left: 1px solid #eee;
   border-right: 1px solid #eee;
}

table.shortcuts th {
   vertical-align: middle;
	text-align: left;
   height: 36px;
   padding: 0;
}

table.shortcuts th div {
   font-size: 0.92em;
   background: transparent url(../images/bg_arrow_right_purple.gif) no-repeat left;
   margin-left: 10px;
   padding: 3px;
   padding-left: 24px;
   vertical-align: middle;
}

table.shortcuts td {
   padding-left: 0px;
   padding-right: 0px;
   padding-bottom: 2px;
   background: transparent url(../images/bg_shortcuts_bottom.gif) repeat-x bottom;
}

table.shortcuts ul {
   list-style-type: none;
   margin-left : 12px;
   padding-left : 0px;
   margin-top : 8px;
   margin-bottom : 8px;
}

table.shortcuts ul li {
   padding-top: 4px;
   padding-bottom: 6px;
   padding-left: 12px;
   padding-right: 2px;
   background: transparent url(../images/bg_arrow_right_small_purple16px.gif) no-repeat top left;
}

table.shortcuts a, 
table.shortcuts a:visited {
   color: #000;
   text-decoration: none;   
}

table.shortcuts a:hover {
	color: #03c;
   text-decoration: underline;
}

/* Special classes for staff pages */
/* ------------------------------------------------ */
table.staff-box,
table.staff-box-grey {
   width: 100%;
   background: transparent url(../images/bg_dotted_horizontal.gif) repeat-x bottom;
   margin-left: -20px;
}

table.staff-box-grey {
   background: #f6f6f6 url(../images/bg_dotted_horizontal.gif) repeat-x bottom;
}

table.staff-box td,
table.staff-box th,
table.staff-box-grey td,
table.staff-box-grey th {
   padding: 20px;
}

table.staff-box th, 
table.staff-box-grey th {
   text-align: left;
   width: 140px;
}

/* Classes for course catalog system Delta */
/* ------------------------------------------------ */
div.headerRed {
	font-family : Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size : 10px;
	line-height : 10px;
	margin: 0px;
	margin-top : 0px;
	margin-bottom : 2px;
	font-weight : bold;
	color : #7f004d;
	max-width: 30em;
	padding : 2px 8px 0px 8px;
}

div.headerRed a {
	color : #7f004d;
	text-decoration:none;
}

div.headerRed a:visited {
	color : #7f004d;
}

div.headerRed a:active {
	text-decoration:none;
}

div.headerRed a:hover {
	color : #03c;
    text-decoration : underline;
}

div.greyLine {
    background-image : url(../images/grey_line_horisontal.gif);
    height : 1px;
    background-repeat : repeat-x;
    line-height : 1px;
    font-size : 1px;
	margin: 0px;
	margin-top: 0px;
	margin-bottom: 0px;
	margin-left: 4px;
	margin-right: 4px;
	padding: 0px;
    padding-bottom :0px;
    padding-top :0 px;	
}

/* End of editor-accessible classes - the rest of CSS is design IDs and classes */
/* =============================================================================== */

/* Page and margin layout */
/* ------------------------------------------------------------------------------- */

/* 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.72em;
   padding-top: 0px;
   padding-left: 20px;
   padding-right: 10px;
   padding-bottom: 10px;
}

/* Left margin area */
td#left-margin {
   width: 183px;
   background: transparent url(../images/bg_dotted_vertical.gif) repeat-y right;
}

/* Used from DW template property to hide left margin. Used on frontpage. */
td#left-margin.false {
   display: none;
}

/* Right margin elements */ 
/* ----------------------------------------------------------------------------------- */

/* Right margin area */
td#right-margin {
   width: 240px;
   border-left: 1px solid #6D6D6D;
   background: #f3f3f4 url(../images/bg_margin_right.gif) repeat-x;
   font-size: 0.64em;
   padding-left: 12px;
}


/* Use this class as a DW template property for hiding right margin, if needed */
td#right-margin.false {
   display: none;
}

/* Forms in right margin */
td#right-margin form {
   margin-top: 0px;
   margin-bottom: 40px;
}

td#right-margin input,
td#right-margin select {
   font-size: 1em;
   margin-top: 2px;
}

td#right-margin input {
   border: 1px solid #6E6F67;
}

td#right-margin div#form-head {
   padding-left: 26px;
   background-image: url(../images/bg_arrow_right_purple.gif);
   background-repeat: no-repeat;
   margin-top: 8px;
   margin-bottom: 20px;
   padding-top: 2px;
   padding-bottom: 4px;
}

/* Design elements for head */
/* ---------------------------------------------------------------------------- */

/* This object is here just in case it should be needed for coloring purposes */
div#head-holder {
}

/* Image banner streching over head to right end */
div#head-banner {
   background: transparent url(../images/bg_head.jpg) repeat-x;
   margin-left: 0px;
   height: 93px;
}

/* Banner image */
div#head-banner img {
	border: 0px; 
	height: 93px; 
	width: 892px;
}


/* Design elements for horizontal menus */
/* ---------------------------------------------------------------------------- */

div#menu-holder {
	clear: both;
	margin-left: 0px;
   border-left : 1px solid #666;
   border-right : 1px solid #666;
   background: transparent url(../images/bg_menu.gif);
}

/* Class to hide (doubled) bottom border on pages without second level menu */
div.false#menu-holder {
	border-bottom : 0px;
}

/* Common properties for both menu level containers */
div#menu-holder div {
	white-space: nowrap;
	padding-top: 3px;
   padding-bottom: 3px;
	padding-left: 0px;
}

/* Common properties for both menu level links */
div#menu-holder a {
   padding-top : 3px;
   padding-bottom : 3px;
	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 #000;
   border-bottom: 1px solid #000;
   font-weight: bold;
}

div#menu-level1 a {
   padding-left: 10px;
   padding-right: 10px;
   text-decoration: none;
   color: #333;
}

/* Special link for home page */
div#menu-level1 a#home-link {
	position: absolute;
	left: 8px;
	top: 94px;
   background-image: url(../images/bg_arrow_home.gif);
   background-repeat: no-repeat;
   padding-left: 18px;
}

div#menu-level1 a#home-link:hover {
   background-color: transparent;
   text-decoration: underline;
	color: #03c;
}

/* Special ID to remove extra border in leftmost menu link */
div#menu-level1 a#menu-edge {
   margin-left: 180px;
   padding-right: 11px;
}

div#menu-level1 a:hover {
 	color: #000;
	background-color: #fff;
}

/* 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 {
 	color: #fff;
	background-color: #666;
}

/* 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;
}

div#language-switcher {
	position: absolute;
	right: 30px;
	top: 94px;
	text-align: right;
	width: 100px;
	/* display: none; Change to "none" here if language switcher is not desired on site */
}

div#language-switcher a,
div#language-switcher a:hover {
	border: none;
	font-variant: normal;
}

div#language-switcher a:hover {
	color: #03c;
	text-decoration: underline;
   background-color: transparent;
}


/* Vertical menus */
/* ---------------------------------------------------------------- */

div#menu-left {
	font-size: 0.66em;
   line-height: 1.1em;
   vertical-align : top;
   margin-top: 50px;
}

/* If image is used instead of menu, position it neat */
div#menu-left img {
	padding-top: 14px;
	padding-left: 30px;
}

/* Menu heading for vertical menu */
div#menu-left div.menu-head {
   background-color: #FDFBC7;
	border-top:  1px solid #ccc;
	border-bottom: 1px solid #ccc;
	padding: 3px;
   padding-left: 24px;
   font-weight: bold;
   color: #666;
   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;
   background: transparent url(../images/bg_dotted_horizontal.gif) repeat-x bottom;
}

/* Menu level 3 */
div#menu-left ul li {
   padding-left: 14px;
   padding-top: 18px;
   padding-bottom: 18px;
   margin: 0px;
   padding-right: 4px;
   background: transparent url(../images/bg_dotted_horizontal.gif) repeat-x top;
}

/* Menu level 4 */
div#menu-left ul li.submenu {
   margin-left: 20px;
   padding-left: 12px;
   margin-top: 0px;
   margin-bottom: 2px;
   padding-top: 0px;
   padding-bottom: 0px;
   font-weight: normal;
   background-image: none;
}

div#menu-left a {
	color: #333;
	text-decoration: none;
}

div#menu-left ul li#menu-top a {
   border: 0;
}

div#menu-left ul li.submenu a {
   border-top: 0px;
   padding-top: 1px;
   padding-bottom: 1px;
   margin: 0;
}

div#menu-left ul li#menu-bottom a {
   /* border-bottom: 1px solid #ccc; */
}

div#menu-left a:hover {
	color: #03c;
	text-decoration: underline;
}

/* Class to set selected item in vertical menu, if needed */
div#menu-left ul li.true {
  	font-weight: bold;
   color: #000;
   background-color: #eee;
}

/* 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 {
   padding: 1px; 
   border: 1px solid #121212;
}
	
div#updated {
	font-size: 0.62em;
	color: #333333;
	text-align: center;
   padding-top: 8px;
}

td#updated a {
	color: #333366;
}

div#updated.false {
   display: none;
}

div#foot {
   font-size: 0.60em;
   color: #111;
   padding-top: 7px;
   padding-bottom: 5px;
   background-color: #EEEEEE;
   border-top: 1px solid #A4A4A4;
   border-bottom: 1px solid #A4A4A4;
   text-align: center;
}

div#foot a,
div#foot a:visited {
   text-decoration : none;
	color: #666666;
}

div#foot a:hover {
   text-decoration : underline;
	color: #666666;
}

div#credits {
	font-size: 0.62em;
	color: #aaa;
	text-align: right;
	margin-right: 8px;
   margin-top: -14px;
}

div#credits a,
div#credits a:visited {
   text-decoration : none;
	color: #bbbbbb;
}

div#credits a:hover {
	text-decoration : underline;
}

/* Styling for printing */
/* ----------------------------------------------------------------- */

@media print {

	/* Hide horizontal menu when printing, because it looks ugly without background colors */
	div#menu-holder {
		display: none;
	}

	/* Hide left menu and right margin to save space when printing, if needed */
	td#left-margin {
		display: none;
	}
	td#right-margin {
		display: none;
	}

	/* Hide borders on shortcut box when printing without background */
	table.shortcuts {
	   border-left: 0px solid #eee;
	   border-right: 0px solid #eee;
	}

	/* Hide credits when printing */
	div#credits {
		display: none;
	}

}

/* End of stylesheet */
/* =============================================================== */