/* Start of CMSMS style sheet 'BICC Layout Standard' */
/*****************
Stylesheet modifiziert von Layout: Top menu + 2 columns
*****************/
/*****************
browsers interpret margin and padding a little differently, 
we'll remove all default padding and margins and
set them later on
******************/
* {
margin:0;
padding:0;
}

/*
Set initial font styles
*/
body {
 text-align: justify;
 font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
 font-size: 75.01%;
 line-height: 1em;
}

/*
set font size for all divs,
this overrides some body rules
*/
div {
 font-size: 1em;
}

/*
if img is inside "a" it would have 
borders, we don't want that
*/
img {
 border: 0;
}

/*
default link styles
*/
/* set all links to have underline and bluish color */
a,
a:link 
a:active {
 text-decoration: underline;
/* css validation will give a warning if color is set without background color. this will explicitly tell this element to inherit bg colour from parent element */
 background-color: inherit; 
/* color: #18507C; 
 color: #596780;*/
color: #5C6180;
}

a:visited {
 text-decoration: underline;
 background-color: inherit;
 color: #5C6180; /* a different color can be used for visited links */
}


/* remove underline on hover and change color */
a:hover {
 text-decoration: underline;
/* background-color: #CFE6D7;*/
 color: #18507C;
}

.caps {
/*font-variant: small-caps;*/
}

a.external span {
 position: absolute;
 left: -5000px;
 width: 4000px;
}

a.external {
 padding: 0 12px 0 0
}

a.external:link {
 color: #5C6180; 
 background: url(/images/External.gif) no-repeat 100% 0;
}

a.external:visited {
color: #5C6180; 
 background: url(/images/External.gif) no-repeat 100% -100px;
}

a.external:hover {
 color: #18507C;
 background: url(/images/External.gif) no-repeat 100% -200px;
}




/*****************
basic layout 
*****************/
body {
 /*background-color: #e2dacb;*/
 background: #e2dacb url(images/cms/background.png) repeat 0 0;
 color: #000;
 /*margin:1em; /* gives some air for the pagewrapper */
}

/* center wrapper, min max width */
div#pagewrapper {
 margin: 2em auto; /* this centers wrapper */
 padding: 0 25px;
/* max-width: 80em; /* IE wont understand these, so we will use javascript magick */
/* min-width: 60em;*/
 width: 800px;
 background: transparent url(images/cms/logo_header_spot.png) no-repeat 108px 20px;
 color: black;
}


/*** header ***
we will hide text and replace it with a image
we need to assign a height for it
*/

/*div#header {
 height: 130px; /* adjust according your image size 
}*/

h1#spotlight_head {
color:#CC0021;
font-size:90%;
font-variant: small-caps;
height:14px;
letter-spacing:0.2em;
margin-left:98px;
padding-top:6px;
}

/* Bottom Wrapper mit grünem Hintergrundbild */
div#bottom_wrap {
 background: transparent url(images/cms/logo_bottom_wrap.png) no-repeat 0px 0px;
 padding-left: 25px;
 margin-left: -25px;
}

div#print {
 float: right;
/* margin: 0.4em 10px 0 0; */
 padding: 0.5em 0;
}

div#search {
 float:right;
 padding: 2px 4px 0 0;
}

div#search p {
 font-size: 0.8em;
 padding-right: 2px;
 text-align:right;
}

#cntnt01searchinput {
 width: 130px;
}

div.breadcrumbs {
 width: 550px;
 padding: 1em 0 1em 68px; /* CSS short hand rule first value is top then right, bottom and left */
 font-size: 90%; /* its good to set fontsizes to be relative, this way viewer can change his/her fontsize */
 margin: 30px 1em 0.5em ; /* css shorthand rule will be opened to be "0 1em 0 1em" */
 /* border-bottom: 1px dotted #000;*/
 float: left;
 background: transparent url(images/cms/bicc_logo_notext_small.png) no-repeat left center;
 text-align: left;
}

 div.breadcrumbs span.lastitem { 
 font-weight:bold; 
 } 

div#content {
/* margin: 1.5em auto 0 0; some air above and under menu and content */
 background: #FFFAF2;
 clear: both;
}

div#main {
 background: inherit;
 margin-left: 1em; 
 width: 600px;
 float: left;
}


div#sidebar {
 width: 150px;
 float: right;
 padding: 0.5em 0 0.5em 0.5em;
 font-size: 0.9em;
}

div#sidebar img {
 margin: 4px;
 border: 1px solid #9E998E;
}

/* if sidebar doesnt include menu but content add class="hascontent" 
div#sidebar.hascontent {
 padding: 0 1%;
 width: 24%; /* make width smaller if there's padding, or it will get too wide for the floated divs in IE */
}*/

div#footer {
 clear:both; /* keep footer below content and menu */
 color: #000;
}

div#footer p {
 background: #9E998E;
 padding: 1em; /* some air for footer */
 text-align: center; /* centered text */
 margin: 0 0 1em 0;
}

div#footer p a {
 color: #000; /* needed becouse footer link would be same color as background otherwise */
}

/* as we hid all hr for accessibility we create new hr with extra div element */
div.hr {
 height: 1px;
 margin: 1em;
 border-bottom: 2px solid black;
}

/* relational links under content */
div.left49 {
 float: left;
 width: 49%; /* 50% for both left and right might lead to rounding error on some browser */
}

div.right49 {
 float: right;
 width: 49%;
 text-align: right;
}

div.top {
 text-align: right;
 padding: 0.1em 0;
 clear: both;
 width: 628px;
}

/* add img border for certain images, float them left or right*/
img.img_border_r, img.img_border_l {
 border: 1px solid #000;
 margin: 0.5em 0 0.5em 1em;
 float: right;
}

img.img_border_l {
 float: left;
 margin: 0.5em 1em 0.5em 0;
 }

/* if multiple images or images with text below are needed in a vertical row, use this div */
div.box_r, div.box_l {
 float: right;

}

div.box_l {
 float: left;
}

div.box_r img, div.box_l img {
 border: 1px solid #000;
 margin: 0.5em 0 0.5em 1em;
}

div.box_l img {
 margin: 0.5em 1em 0.5em 0;
}

div.box_r a:hover, div.box_l a:hover {
 border: 0;
 text-decoration: none;
 background: transparent;
}

div.box_r p {
 margin: 0 0 0.5em 1em;
}


/********************
CONTENT STYLING
*********************/

/* Flash Intro */

#mssHolder {
 float: right;

 padding-left: 1em;
}

/* What's New Überschrift auf index seite formatieren */

div#content h4.sect_header {
 font-weight: bold;
/* border-top: 2px solid #294B5F; 
 border-bottom: 1px dotted #294B5F;*/
 padding: 3em 0 0.5em 0;
 }

/* HEADINGS */
div#content h1 {
 font-size: 2em; /* font size for h1 */
 line-height: 1em;
 margin: 0;
 text-align: left; 
}

div#content h2, div#content h3, div#content h4, div#content h5, div#content h6 {
/* color: #294B5F;*/ 
 color: #6F6B63;
 text-align: left;
}

div#content h2 {
 background: transparent;
 font-size: 1.5em; 
/* some air around the text 
 padding-left: 0.5em;*/
 padding-bottom: 1px;
/* set borders around header 
 border-bottom: 2px solid #294B5F; */
 line-height: 1.5em;
/* and some air under the border */
 margin: 0 0 0.5em 0;
}

div#content h3 {
 font-size: 1.3em;
 line-height: 1.3em;
 margin: 0 0 0.5em 0;
}

div#content h4 {
 font-size: 1.2em;
 line-height: 1.3em;
 margin: 0 0 0.25em 0;
}

div#content h5 {
 font-size: 1.1em;
 line-height: 1.3em;
 margin: 0 0 0.25em 0;
}

h6 {
 font-size: 1em;
 line-height: 1.3em;
 margin: 0 0 0.25em 0;
}

/* END HEADINGS */

/* TEXT */
p {
 font-size: 1em;
 margin: 0 0 1.5em 0; /* some air around p elements */
 line-height:1.4em;
 padding: 0;
}
blockquote {
 border-left: 10px solid #ddd;
 margin-left: 10px;
}
pre {
 font-family: monospace;
 font-size: 1.0em;
}
strong, b {
/* explicit setting for these */
 font-weight: bold;
}
em, i {
/* explicit setting for these */
 font-style:italic;
}

/* Wrapping text in <code> tags. Makes CSS not validate */
code, pre {
 white-space: pre-wrap; /* css-3 */
 white-space: -moz-pre-wrap; /* Mozilla, since 1999 */
 white-space: -pre-wrap; /* Opera 4-6 */
 white-space: -o-pre-wrap; /* Opera 7 */
 word-wrap: break-word; /* Internet Explorer 5.5+ */
 font-family: "Courier New", Courier, monospace;
 font-size: 1em;
}

pre {
 border: 1px solid #000; /* black border for pre blocks */
 background-color: #ddd;
 margin: 0 1em 1em 1em;
 padding: 0.5em;
 line-height: 1.5em;
 font-size: 90%; /* smaller font size, as these are usually not so important data */
}

.red {
color: red;
}

.small {
font-size: 0.8em;
}

/* END TEXT */

/* TABLES */

table {
border-collapse: collapse;
margin: 0 0 1.5em;
}

td {
border:1px solid #000;
padding: 0.3em;
}

/* Special settings for event program tables */

/* resconf program */

.event_program {
	border: 1px solid #6d6d6d;
	margin: 10px;
	width: 100%;
	}

.event_program td, .event_program th {
	border: 1px solid #6d6d6d;
	padding: 8px;
	vertical-align: top;
	}
	
.event_program th {
	color: black;
	background-color: #CACACA;
	font-weight: bold;
	text-align: center;
	vertical-align: middle;
	}
	
.event_program td, .event_program td p, .event_program td ul, .event_program td ol, .event_program td li {
	font-size: 11px;
}

.event_program_left {
	width: 18%;
	}

.event_program_right {
	width: 82%;
	}


/* END TABLES */

/* LISTS */
div#main ul,
div#main ol,
div#main dl {
 font-size: 1.0em;
 line-height:1.4em;
 margin: 0 0 1.5em 0;
}

div#main ul li {
list-style: none url(images/cms/arrow-right_red.gif);
}

div#main ul li,
div#main ol li {
 margin: 0 0 1.3em 3em;
 text-align: left;
}

div#dl dt {
 font-weight: bold;
 margin: 0 0 0.25em 3em;
}
div#dl dd {
 margin: 0 0 0 3em;
}

ul.no_dot li {
list-style: none;
}


/* formattierung für publikationsseite und news liste */
div#main ul#page_news {

}

div#main ul#page_news li {
/* 100% Höhe verhindert, dass im IE6 die Bilder unten aus den li rausragen */
height: 100%;
list-style-image: none;
list-style: none;
margin: 0 0 1em 0.75em;
padding-bottom: 1em;
/* border-bottom: 2px dashed #596780;*/
border-bottom: 1px dotted #000;
}

/* pseudoklasse für moz/opera, damit die Bilder unten aus den li nicht rausragen
 Angeregt durch http://www.cs.hmc.edu/~mbrubeck/clear-after/ */
div#main ul#page_news li:after {
content: "";
display: block;
height: 0;
clear: right;
}

div#main ul#page_news li ul {
border: 0;
margin: 0 0 0 110px;
padding: 0;
}

div#main ul#page_news li ul {
margin: 0;
}

/* \*/
* html div#main ul#page_news div.holly {
	height: 1%;
}
/* */

div#main ul#page_news li ul li {
list-style-image: url(images/cms/arrow-right_red.gif);
border: 0;
margin: 1em 0 0 2em;
padding: 0;
}

div#main dt {
margin-top: 1em;
}

div#main dd {
margin: 0.1em 0 0.1em 1.5em;
}

/* Pseudoklasse für moz/opera für die tiefer liegenden li wieder aufheben */
div#main ul#page_news li ul li:after {
clear:none;
}

/* END LISTS */

/* STAFF TABLE & GMI TABLE*/

#staff_table, #gmi_table {
	border-collapse: collapse;
	border-color: #9E998E;
	border-style: solid;
	border-width: 0 1px 0 1px;
	width: 600px;
	}

#staff_table #t_left {
	width: 30%;
	}

#staff_table #t_middle {
	width: 40%;
	}
	
#staff_table #t_right {
	width: 30%;
	}

#staff_table td, #gmi_table td, #gmi_table th {
	border-color: #6d6d6d;
	border-style: solid;
	border-width: 1px 0 1px 0;
	font-size: 11px;
	padding: 4px 0 8px 6px;
	vertical-align: top;
	}

#gmi_table .t_1 {
	width: 9.5%;
	}

#gmi_table .t_2 {
	width: 32%;
	}

#gmi_table .t_3 {
	width: 7.5%%;
	}

#gmi_table .t_space {
	width: 2%;
 background-color: #6e6657;
	}



/* Galleria settings */
.galleria{list-style:none;width:200px}
.galleria li{display:block;width:80px;height:80px;overflow:hidden;float:left;margin:0 10px 10px 0}
.galleria li a{display:none}
.galleria li div{position:absolute;display:none;top:0;left:180px}
.galleria li div img{cursor:pointer}
.galleria li.active div img,.galleria li.active div{display:block}
.galleria li img.thumb{cursor:pointer;top:auto;left:auto;display:block;width:auto;height:auto}
.galleria li .caption{display:block;padding-top:.5em}
* html .galleria li div span{width:400px} /* MSIE bug */


	/* BEGIN DEMO STYLE 
	*{margin:0;padding:0}
	body{padding:20px;background:white;text-align:center;background:black;color:#bba;font:80%/140% georgia,serif;}
	h1,h2{font:bold 80% 'helvetica neue',sans-serif;letter-spacing:3px;text-transform:uppercase;}*/
	div#main .demo{position:relative;margin-top:2em;text-align:center;font:80%/140% Verdana, Arial, Helvetica, Geneva, sans-serif;width: 601px;}
	div#main .demo a{color:#6D6D6D;text-decoration:none;outline:none;}
	div#main .demo a:hover{color:#000;}
	div#main .demo .caption{font-style:italic;}
 div#main .galleria_container{height: 520px;}
	div#main .demo .gallery_demo{width:550px;margin:0 auto;}
	div#main .demo .gallery_demo li{width:68px;height:50px;border:1px solid #111;margin: 2px;background:transparent;text-align:center;}
	div#main .demo .gallery_demo li div{left:240px}
	div#main .demo .gallery_demo li div .caption{font:italic 0.7em/1.4 Verdana, Arial, Helvetica, Geneva, sans-serif;}
	
	div#main .demo #main_image{margin:0 auto 20px auto;width:600px;height: 520px;background:transparent;}
	div#main .demo #main_image img{margin-bottom:10px;border: 1px solid #6D6D6D;}
	
	div#main .demo .nav{padding-top:15px;clear:both;font:80% Verdana, Arial, Helvetica, Geneva, sans-serif;letter-spacing:3px;text-transform:uppercase;width:600px;}
	
	div#main .demo .info{text-align:left;width:600px;margin:30px auto;border-top:1px dotted #221;padding-top:30px;}
	div#main .demo .info p{margin-top:1.6em;}

div#rssLink {margin-bottom: 20px; border: 0;}
div#rssLink img, div#rssLink a {border: 0; text-align: center; display: block; margin: 0 auto}
/* End of 'BICC Layout Standard' */