/***************************************
##########################
	main stylesheet for the Resource Conflict Monitor
	this stylesheet draws major inspiration from http://stopdesign.com and http://www.alistapart.com
	as well as some other sites. thanks a bunch for providing some very good ideas
##########################
****************************************/
	
/***************************************
##########################
	Body background:					#777B7F
	Container background:			#DDCFC0
	Navigation background:			#7DAA9A
	Link color							#27323C
	Right Navigation Border			#BDC596
	Right Background Color			#f1d8bd
	
##########################
****************************************/
	
/***************************************
##########################
	imported styles
##########################
****************************************/

/***************************************
##########################
	central elements
##########################
****************************************/

body { 
	font: 0.75em Verdana, Arial, Helvetica, Geneva, sans-serif; 
	line-height: 1.3em;
	text-align: justify;
	color: #000;
	background: #777B7F;
	margin: 0;
	padding: 0;
}

p {
	margin: 0;
	padding: 0;
	}

h1, h2, h3 {
	margin: 0;
	padding: 0;
  font-weight: normal;
  }
	
h1 {
  font-size: 170%;
  }
	
h2 {
  font-size: 135%;
  }
	
h3 {
  font-size: 120%;
  }

.centered {
	text-align: center;
	}
	
strong, .bold {
	font-weight:bold;
	}

em, .italic {
	font-style:italic;
	}

a {
	color: #27323C;
	font-weight: bold;
	text-decoration: underline;
	text-align: left;
	}

a:hover {
	color: #9DA9B5;
	}

.smaller {
	font-size:85%;
	}


/***************************************
##########################
	content wrapper inside body tag 
##########################
****************************************/

#container {
	margin: 1em auto;
	padding: 0 0 8px 0;
	width: 700px;
	background: #DDCFC0;	
}	
	
/***************************************
##########################
	header
##########################
****************************************/

#header {
	background: url("../img/logo_top.png");
	width: auto;
	height: 104px;
	padding: 0;
	margin: 0;
	border: 0;
}

#header img {
	float: right;
	margin: 10px 10px 0 0;
	border: 0;
	}

#header a:hover {
	text-decoration: none;
	}

/***************************************
##########################
	navigation
##########################
****************************************/

#navigation {
	background-color: #7DAA9A;
	color: #fff;
	margin: 0;
	padding: 5px 0 5px 0;
	font-weight: bold;
	font-size: 0.9em;
	border-right: 170px solid #bdc596;
  }

#navigation ul {
  margin: 0 0 0 15px;
  padding: 0;
  list-style: none;
	line-height: normal;
	border-left: 2px solid #DDCFC0;
  }

#navigation li {
	display: inline;
  margin: 0;
  padding: 0 5px;
	border-right: 2px solid #DDCFC0;
  }
	
#navigation a, #navigation span {
  text-decoration: none;
  }
	
#navigation #current {
	text-decoration: underline;
	color: #fff;
	}

#navigation a {
  color: #fff;
	}

#navigation a:hover {
	text-decoration: underline;
	}

/***************************************
##########################
	right column
##########################
****************************************/
	
#right {
	float: right;
	width: 170px;
	margin: 25px 0 0 0;
	padding-left: 15px;
	}
	
#right h3 {
	color: #7DAA9A;
	font-weight: bold;
	margin-left: 15px;
	}

#right ul {
	line-height: 135%;
	list-style-type: none;
	margin-left: 15px;
	margin-right: 4px;
	padding: 0;
	text-align: left;
	font-size: 0.85em;
	}

#right ul li {
	margin: 8px 2px 0 8px;
	}
	
#right a {
	font-weight: normal;
	}
	
#right img {
	margin: 0;
	padding: 0;
	border: 0;
	}
	
#right form {
  padding: 10px 10px 10px 22px;
	margin: 0;
	}
	
#right form select {
	font-weight:bold;
	background-color:#7DAA9A;
	color: #fff;
	font-size: 1em;
}

#right #r_current {
	list-style-type: disc;
	}
	
/***************************************
##########################
	contents
##########################
****************************************/

#contents  {
	width: 650px;
	margin: 25px 25px 5px 25px;
	position: relative;
	}
	
/* Holly hack (http://www.communitymx.com/content/article.cfm?page=2&cid=C37E0) in order to make IE/win display the floated elements correctly */

/* Hides from IE5-mac \*/
* html #contents {height: 1%;}
/* End hide from IE5-mac */

/* genereller Text */

#contents p, #contents .para {
	margin-bottom: 1.8em;
	}

#contents h3 {
	margin-bottom: 0.4em;
	font-weight: bold;
	}
	
/* Bilder im Textfluss */

#contents .fl_right, #contents .fl_left {
	float: right;
	margin: 0 8px 8px 8px;
	border: 1px dashed #7DAA9A;
	}
	
#contents img.fl_left {
	float: left;
	}


/* Hervorhebungsboxen */

#contents .emphasize, #contents .emphasize_small {
	color: #fff;
	background: #7DAA9A;
	padding: 1em;
	margin-bottom: 1.8em;
	border: 2px dashed #fff;
	}

#contents .emphasize_small {
	padding: 0.7em;
	border: 1px dashed #fff;
	}

#contents .dashed, #contents .dashed_small {
	padding: 1em;
	margin-bottom: 1.8em;
	border: 2px dashed #7DAA9A;
	height: 100%;
	}
	
#contents .dashed_small {
	padding: 0.7em;
	border: 1px dashed #7DAA9A;
	}
	
#contents .emphasize a {
	color: #fff;
	}

#contents h3.listheader {
	color: #fff;
	background: #7DAA9A;
	margin: 0 300px 1em 0;
	padding: 5px 0;
	border: 2px dashed #fff;
	text-align: center;
	}
	
#contents .boxed {
	margin: 0;
	padding: 0;
	list-style-type: none;
	}

#contents .boxed li {
	padding: 1em;
	margin-bottom: 1em;
	border: 2px dashed #7DAA9A;
	text-align: left;
	}
	
#contents .boxed li p {
	margin-bottom: 0;
	margin-top: 1em;
	}
	
/* normale Listen innerhalb der umrandeten Listen */

#contents ul.normal li {
	padding: 0.4em;
	margin: 0.4em 0;
	border: none;
	list-style-type: square;
	}
	
/* Dropdown Auswahlboxen für Datenbank */

#db_select {
	margin-bottom: 1em;
	}

#db_select form {
  padding: 5px 10px 6px;
	margin-top: 0.2em;
	border: 1px solid #7DAA9A;
  }

#db_select form select, #db_select form input {
	font-weight: bold;
	background-color: #7DAA9A;
	color: #fff;
	font-size: 1em;
	margin-right: 1em;
	}

/* Datenausgabe für Ressource Conflict Database */

#year_nav {
	height: 4em;
	border: 1px solid #7DAA9A;
	padding: 0.7em;
	clear: both;
	}
	
#year_nav #year_nav_header {
	float: left;
	margin-top: 0.5em;
	}
#year_nav #year_nav_header span {	
	font-size: 80%;
	}
	
#year_nav #year_nav_images {
	float: right;
	}

#year_nav #year_nav_images img {
	border: 0;
	}

#chart_box {
	}

#chart_box .charts {
	width: 440px;
	height: 280px;
	float: left;
	margin-bottom: 2em;
	}

#chart_box .annotation {
	border: 1px solid #7DAA9A;
	padding: 0.7em;
	font-size: 80%;
	width: 160px;
	float: right;
	}

.db_intro_graph {
	}
	
.charts {
	float: left;
	width: 340px;
	height: 210px;
	padding-bottom: 1em;
	margin-right: 1em;
	}
	
#contents td.res_gov_header, #contents td.res_gov_body {
	width: 60%;
	font-size: 1em;
	font-weight: bold;
	}	

#contents td.res_gov_body {
	font-weight: normal;
	padding-left: 3em;
	}
	
/* Datenausgabe für Countryprofile */

.conf {
	color: red;
	font-weight: bold;
	}
	
#contents p img {
	margin: 10px 0;
	}

#contents img.left {
	margin: 10px 50px 10px 80px;
	float: left;
	}

#contents table {
	margin: 5px 0 0 0;
	width: 100%;
	font-weight: normal;
	border-collapse: collapse;
	}

#contents tr {
	height: 2em;
	}

#contents tr.alternate {
	background-color: #c4d5de;
	}

#contents td {
	padding: 0.2em 0.5em;
	border: 1px solid #7DAA9A;
	vertical-align: top;
	text-align: left;
	}

#contents table.c_profile a {
	font-weight: normal;
	}

#contents  td.res_gov_header a {
	font-weight: bold;
	}

#contents td.header {
	width: 25%;
	font-size: 1em;
	font-weight: bold;
	}	

#contents table.c_profile ul, #contents table.c_profile_ft ul {
	padding-left: 1.5em;
	}

#contents table.c_profile li, #contents table.c_profile_ft li {
	margin-bottom: 1em;
	text-align: left;
	}


	
/* Popupboxen für Detailerklärungen */

.blurb a {
	position: relative;
	}

/* langen blurb verstecken */	
.blurb a span {
	display: none;
	text-decoration: none;
	text-align: left;
	font-weight: normal;
	font-size: 0.9em;
	}
	
/* wichtig, damit der IE 6 den langen popup blurb anzeigt */	
.blurb a:hover {
	font-size: 100%;
}

/* zeigt den langen popup blurb */
.blurb a:hover span {
	display: block;
	background: #777B7F;
	color: #f1d8bd;
	padding: 1em;
	border: 2px solid #000;
	position: absolute;
	left: 4em;
	top: 1em;
	width: 300px;
	z-index: 20;
	}

/* alternative lange Popupboxen, basierend auf http://textsnippets.com/posts/show/708 */

.popupper, .imgpopupper {
	display: none;
	background: #777B7F;
	color: #f1d8bd;
	padding: 1em;
	border: 2px solid #000;
	position: absolute;
	left: 4em;
	top: 6em;
	width: 400px;
	font-size: 0.9em;
	}

.popupper a, .imgpopupper a {
	color: #fff;
	}

.popupper div , .imgpopupper div {
	text-align: center;
	}
	
#PopUp p, #PopUp2 p, #PopUp3 p, #PopUp4 p {
	margin-bottom: 1em;
	}

/* Filmstreifen für Fotos */

.filmstrip {
	background: #000 url("../../../fataltransactions/img/filmstrip.png") repeat-x;
	padding: 0;
	margin: 10px 0 0 35px;
	line-height: 0;
	font-size: 0;
	width: 400px;
	position: relative;
	}
	
.filmstrip img {
	border: 0;
	margin: 19px 0 19px 8px;
	padding: 0;
	}
 
/* Positionierung der Bilder relativ zum Listeneintrag mit dem Filmstrip */

.img_pos {
	position: relative;
	}
	
	
/***************************************
##########################
	footer
##########################
****************************************/

#footer {
	width: auto;
	background-color: #7DAA9A;
	text-align: center;
	color: #fff;
	padding: 0.3em;
	font-size: 0.85em;
	}

/* Anpassung für footer IE/win */

/* Hides from IE5-mac \*/
* html #footer {width: 100%;}
/* End hide from IE5-mac */

	
#footer a {
	color: #fff;
	font-weight: bold;
	text-decoration: none;
	}

#footer a:hover {
	text-decoration: underline;
	}
	
#footer p {
	padding: 0 10em;
	}
	
	
#tmp_contain {
	width: 700px;
	margin: 10px auto;
	}
	
#tmp_contain h3 {
	text-align: center;
	color: #fff;
	margin-bottom: 1em;
	font-weight: bold;
	}

#tmp_contain a {
	color: #fff;
	}

#tmp_contain a:hover {
	color: #27323C;
	}

#rcm_img, #ft_img {
	width: 280px;
	float: left;
	background: #7DAA9A; 
	padding: 20px;
	margin: 150px 10px 10px 10px;
	border: 2px dashed #fff;
	}

#rcm_img img, #ft_img img {
	border: 1px solid #000;
	margin-left: 16px;
	}
	
#ft_img {
	background: #cb0000;
	}
	
.clear {
	clear:both;
	}