/* 
Stylesheet by Mediabyrån at Karolinska Institutet University Library 
Features: Scalable text, scalable width, DW & Contribute support, menus styled as lists 
Ulf Kronman. 2005-06-05/UK 
*/

/* 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;
	background: #FFFFFF;
	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 vertical-alignment top, for all table cells */

td, th {
   vertical-align: top;
   padding: 0px;
}

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

h2 {
	font-size: 1.2em;
}

h3 {
	font-size: 1.1em;
}

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 {
  text-decoration : none;
  color: #003366;
}

a:visited {
  	text-decoration : none;
}

a:active {}

a:hover {
    text-decoration : underline;
	color: #000099;
}

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

/* Table for two-column layout. Don't set width 100% here, because DW then will push it over right side */
table.two-column {
   width: 100%;
}

/* Settings common for both columns */ 
table.two-column td {
	width: 50%;
	padding-right: 10px;
}

/* This would have been a nice CSS2 method to address the first table cell, but no luck i IE :-( */
table.two-column td:first-child {
}

/* Right part of two-column layout, including separating border between columns */
td.column-right {
	padding-left: 10px;
   background-image:  url(../images/line_vertical_dotted.gif);
   background-repeat: repeat-y;
}

/* Right part of two-column layout, no separating border */
td.column-right-no-separator {
}

/* Set maximum width of body text for reability. CSS2. Only supported by Mozilla and Opera, not IE */
td#content-area p {
   max-width: 50em;  
}

/* Redesign all heading 1 with dotted underlining */
h1 {
	color: #333333;
   background-image: url(../images/dot.gif);
   background-repeat: repeat-x;
   background-position: bottom;
   line-height: 1.3em;
   padding-bottom: 4px;
   margin-bottom: 8px;
   margin-top: 14px;
	padding-top: 12px;
}

/* Can be used with HR (not for IE), P or DIV to get a dotted horizontal line */
div#content .line-horizontal-dotted {
   max-width: 100%; /* Reset max-width set for p above*/
	height: 1px;
   margin-top: 2px;
   margin-bottom: 6px;
   border: none;
   background-color: #ffffff;
   background-image: url(../images/dot.gif);
   background-repeat: repeat-x;
   background-position: bottom;
}

/* This should have been done with a DIV, but sorry; Contribute 3 don't handle DIVs for publishers */
table.news {
	font-size: 0.92em;
   color: #000000;
   padding: 6px;
   margin: 0px;
   width: 100%;
   margin-left : 0px;
   margin-top : 0px;
   margin-bottom : 10px;
   text-align: left;
}

table.news td {
	width: 50%;
	padding-right: 14px;
}

table.news p {
   padding-left : 1px;
   padding-top : 2px;
   padding-bottom : 2px;
   padding-left : 5px;
   padding-right : 5px;
}

table.news th {
   color: #000000;
   background-position : left;
   background-repeat : no-repeat;
   padding-left : 0px;
   padding-right : 10px;
   padding-bottom : 2px;
   white-space: nowrap;
   font-weight: bold;
}

table.news td a,
table.news th a,
table.news th a:visited {
   color: #336699;
}

table.news h1 {
	font-size: 1.1em;
	margin-top: 6px;
}

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

table.news h1 a:hover {
   color: #336699;
	text-decoration: underline;
}

table.news ul {
   list-style-type: none;
   list-style-position :outside;
   padding: 0px;
   padding-bottom : 10px;
   margin-left : 0px;
   margin-top : 5px;
   margin-bottom : 0px;
}

table.news ul li {
   padding-left : 1px;
   padding-top : 2px;
   padding-bottom : 2px;
   padding-left : 5px;
   padding-right : 5px;
}

table.news ul li a, 
table.news ul li a:visited {
   color : #cc3300;
   text-decoration: none;
}

table.news ul li a:hover {
   color : #cc3300;
   text-decoration: underline;   
}

/* Use to color news-date */
.news-date {
	color: #cc3300;
}

.photo-box {
   font-size: 70%;
   padding: 10px;
   width: 140px;
 	text-align: left;
}

.photo-legend {
   font-size: 0.8em;
}

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

/* Table-style shortcut link box. Should have been done with a div, but sorry, no work in Contribute */
table.shortcuts {
   font-size: 0.7em;
   color: #666;
	width: 200px;
   margin-top : 10px;
   margin-bottom : 0px;
	clear: right;
	float: right;
}

table.shortcuts th {
   color : #336666;
   background-image :   url(../images/squares_shortcuts.gif);
   background-repeat : no-repeat;
   background-color : #eeeeee;
   padding-left : 22px;
   padding-right : 8px;
   padding-top : 3px;
   padding-bottom : 3px;
   border: 1px solid #dddddd;
   font-weight: bold;
   vertical-align: top;
	text-align: left;
}

table.shortcuts td {
   padding-left : 6px;
   padding-right : 4px;
   padding-bottom : 2px;
   border: 1px solid #dddddd;
   vertical-align: top;
}

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

table.shortcuts ul li {
   padding-top : 0px;
   padding-bottom : 0px;
   padding-left : 0px;
   padding-right : 0px;
}

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

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

table.shortcuts-head {
    width: 90%;
   margin-top : 10px;
   margin-bottom : 0px;
   margin-left: 6px;
   margin-right: 10px;
}

table.shortcuts-head td {
   color: #666;
   background-image:  url(../images/line_horizontal_dark_gray.gif);
   background-repeat: repeat-x;
   background-position: bottom;
}

table.shortcuts-head strong {
	color : #333333;
	background-image :   url(../images/squares_activities.gif);
	background-repeat : no-repeat;
	padding-left : 21px;
	padding-right : 12px;
	padding-top : 0px;
	padding-bottom : 2px;
	font-weight: bold;
	vertical-align: top;
	text-align: left;
	background-color: #eeeeee;
} 


table.news-head {
   width: 98%;
   margin-top : 20px;
   margin-bottom : 6px;
   margin-left: 0px;
   margin-right: 0px;
}

table.news-head td {
   color: #666;
   background-image:  url(../images/line_horizontal_dark_gray.gif);
   background-repeat: repeat-x;
   background-position: bottom;
   line-height: 1.1em;
}

table.news-head strong {
   color : #5C5B5B;
   background-repeat : no-repeat;
   background-color: #ffffff;
   padding-left : 0px;
   padding-right : 12px;
   padding-top : 0px;
   padding-bottom : 2px;
   font-weight: bold;
   vertical-align: top;
	text-align: left;
}


td#right-margin p,
td#right-margin h1,
td#right-margin img  {
   margin-left: 10px;
   margin-right: 10px;
}

td#right-margin h1 {
	font-size: 1em;
   background-image: none;
   margin-top: 10px;
   margin-bottom: 2px;
   padding-top: 0px;
   padding-bottom: 0px;
}


td#right-margin hr {
   color: #fff;
   background-color: #fff;
   height: 1px;
   margin-top: 0px;
}

/* 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.77em;
	line-height: 1.36em;	
   padding-top: 0px;
   padding-left: 16px;
   padding-right: 10px;
   padding-bottom: 10px;
   background-image:  url(../images/line_vertical_gray_toned.gif);
   background-repeat: no-repeat; 
}

/* Left margin area */
td#left-margin {
   width: 180px;
}


/* Right margin area */
td#right-margin {
   width: 220px;
   font-size: 0.7em;
	padding-left: 0px;
	padding-right: 0px;
	margin: 0px;
   /* background-image: url("../images/line_vertical_gray_toned.gif");
   background-repeat: no-repeat; */
   background-color: #eeeeee;
}

td#right-margin h1 a,
table.news h1 a:visited {
   /*color: #20898D;*/
}

td#right-margin h1 a:hover {
   color: #2CA9AE;
}
/* Hide left menu and right margin to save space when printing */
@media print {
	td#left-margin {
		display: none;
	}
	td#right-margin {
		display: none;
	}
}

/*Logos tabell*/

table.logos {
   padding-left : 20px;
   padding-right : 0px;
   padding-top : 3px;
   padding-bottom : 3px;
   vertical-align: top;
   text-align: left;
}

/*highlight members*/
table.highlight-members {
   background-color:#FCF697;
   vertical-align: top;
   text-align: left;
}


/* 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 {
	margin-left: 0px;
	background-image: url(../images/sgem_headerBg.jpg);
	background-repeat: repeat;
}

/* Logotype image */
div#head-banner img {
	border: 0; 
	height: 92px; 
	width: 676px;
}

/* KI logo positioned to the right */
div#ki-logo-holder {
	position: absolute;
	right: 0px;
	top: 0px;
	width: 70px;
	margin-right: 10px;
}

/* Actual dimensions of KI logo */
div#ki-logo-holder img  {
	width: 70px;
	height: 92px;	
	border: 0px;
}

/* Tools box, floating freely at right end of banner */
div#tools-holder {
	position: absolute;
	right: 0px;
	top: 8px;
	width: 160px;
	text-align: right;
	padding-right: 8px;
	font-size: 0.7em;
	line-height: 18px;
	white-space: nowrap;
}

/* Hide toolbox when printing, because it looks ugly without background colors */
@media print {
	div#tools-holder {
		display: none;
	}
}

div#tools-holder a {
	color: #FFFFFF;
	text-decoration: none;
}

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


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

div#menu-holder {
	clear: both;
	margin-left: 0px;
   border-top : 1px solid #20898D;
	border-bottom : 1px solid #666666;
   border-left : 1px solid #666666;
   border-right : 1px solid #666666;
}

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

/* Common properties for both menu level containers */
div#menu-holder div {
	white-space: nowrap;
	padding-top: 3px;
   padding-bottom: 4px;
	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.7em;
	background-color : #20898D;
	background-position: bottom;
}

div#menu-level1 a {
	padding-left: 12px;
	padding-right: 12px;
  	text-decoration: none;
	border-left: 1px solid #eff0f0;
 	color: #ffffff;
}

/* Special ID to remove extra border in leftmost menu link */
div#menu-level1 a#menu-edge {
	border-left: none;
}

div#menu-level1 a:hover {
 	color: #003366;
	background-color: #AEF2F9;
  	border: 1px solid #666666;
}

/* 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-color: #AEF2F9;
	font-weight: bold;
	color:#003333;
	border-left: 1px solid #666666;
	border-bottom: none;
	border-top: none;
   padding-bottom : 3px;
}

div#language-switcher {
	position: absolute;
	right: 0px;
	top: 94px;
	text-align: right;
	width: 100px;
	display: block; /* 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;
	background-color: transparent;
}

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

div#menu-level2 {
	font-size: 0.7em;
	background-color : #D3D3D5;
}

div#menu-level2 a {
	padding-left: 12px;
	padding-right: 16px;
	text-decoration: none;
 	color: #003366;
	background-image: url(../images/line_vertical_gray.gif);
	background-position: right;
	background-repeat: no-repeat;
}

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


/* 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 {
	font-size: 0.74em;
   vertical-align : top;
   margin-top: 20px;
}

/* 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 {
	font-size: 0.80em;
	border-top:  1px solid #cccccc;
	border-bottom: 1px solid #cccccc;
	padding: 3px;
   padding-left: 7px;
   margin-right: 4px;
}

/* List for menu levels 3 and 4 */
div#menu-left ul {
	list-style: none;
	padding-left: 0px;
	margin-left: 0px;
	margin-right: 4px;
}

/* Menu level 3 */
div#menu-left ul li {
	margin-top: 4px;
	margin-bottom: 2px;
	margin-left: 8px;
   line-height: 1.2em;
}

/* Menu level 4 */
div#menu-left ul li.submenu {
	margin-left: 10px;
	padding-left: 10px;
   margin-top: 3px;
   padding-top: 1px;
	font-variant: normal;
	font-weight: normal;
	background-image: url(../images/arrow_submenu.gif);
	background-repeat: no-repeat;
}

div#menu-left a {
	font-size: 0.90em;
	color: #003366;
	text-decoration: none;
}

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

/* Class to set selected item in vertical menu, if needed */
div#menu-left a.true {
	color: #000000;
	font-weight: bold;
}

/* Foot elements */
/* ---------------------------------------------------------------------------- */

hr#foot-divider {
    border-color:#00BFF3;
	height: 15px;
	margin-top: 5px;
	background-image: url(../images/footBg.gif);
	background-repeat: repeat;
}

table.sponsorFoot  {
    color: #666666;
	font-size: 0.7em;
}



/* Sorry, Dreamweaver don't handle margins properly in combination with clear :-( */
div#foot-holder {
	margin-top: 10px;
	margin-right: 10px;
	color: #999999;
	font-size: 0.8em;
}
	
div#updated {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 0.8em;
	color: #666666;
	font-size: 0.7em;
	text-align: center;
   margin-top: 10px;
   margin-bottom: 0px;
}

div#updated a {
	color: #333366;
	
}

div#foot {
	font-size : 0.7em;
	color: #333333;
   text-align : center;
	padding: 3px;
}

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.7em;
	color: #666666;
	text-align: right;
	margin-top: 4px;
}

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

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

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

/* End of stylesheet */
/* =============================================================== */
.sponsorFoot {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 0.8em;
	color: #666666;
}

/*Martins stilar*/
.schedule {
	text-indent : -3em;
	margin-left: 3em;
	margin-bottom: 1em;
}
.caption {
	text-align: left;
	padding-right: 10px;
	padding-left: 10px;
	font-style: italic;
}
.image {
	margin-right: 10px;
	margin-left: 10px;
	margin-top: 10px;
	margin-bottom: 10px;
}
br.clear {
	margin: 0px;
	clear: both;
}
.quote {
	padding-top: 5px;
	padding-right: 15%;
	padding-bottom: 10px;
	padding-left: 25%;
	font-style: italic;
}
