/* --- The stylesheet of addcontents gmbh --- */
/* --- font-size doch mit em definieren, damit die schrift vom nutzer gesteuert werden kann --- */

/*
*/

/* -------------- */
/* --- COMMON --- */
/* -------------- */
body {
  color: black;
  margin: 0;
  padding: 1em; /* phuong: 0.5em, khanh: 1% */
  min-width: 640px;
  font-size: 100.01%;
  font-family: arial, sans-serif;
  text-align: left;
  background-color: #FAFAFA; /*#E5E5E5;*/
}
a { color: blue; text-decoration: underline; } /* khanh: #0B4D8C */
a:visited { color: blue; }
.skip {
  position: absolute;
  margin-left: -999px;
  width: 990px;
}
h1 {
  font-size: 2.5em;
  font-weight: normal;
  line-height: 1.8em;
  /* khanh: padding: 0.6em 0 0.2em 2%; */
  margin: 0;
  text-align: left;
  border-bottom: 1px dotted #aaa;
}
h2, h3, h4 {
  font-weight: normal;
  text-align: left;
}
h1, h2, h3, h4, h5, h6 {
  color: #084178;
}
img {
  max-width: 95%;
}
hr {
  color: blue;
}

.fleft {
  border: solid 1px #aaa;
  padding: 1px;
  float: left;
  margin: 0 1em 0.2em 0;
}
.fright {
  border: solid 1px #aaa;
  padding: 1px;
  float: right;
  margin: 0 0 0.2em 1em;
  padding: 1px;
}



/* ---------------- */
/* --- HOMEPAGE --- */
/* ---------------- */
#header { /* Ist dafuer gedacht dass die viele Formatierungen einfacher werden, und auch ein gemeinsammer Rand entstehen kann, der nicht ganz außen am Fenster ist. */
  font-size: 0.8em; /* Ein Kompromiss ueber den man sicherlich streiten kann, aber viele Leute empfinden die von Ihnen selbst eingestellte Textgroeße fuer zu groß, wissen aber nicht wie man das aendert. */
  max-width: 70em; /* Eine Begrenzung der Breite auf hoehstens 70em. Fuer den IE gibt es in ielte6.css einen Woraround. */
  margin: auto; /* Hiermit zentrieren wir unsere Seite. */
  border: 1px solid #aaa; /* Eine kleine optische Abgrenzung. */
  border-top: 0; /* Ganz oben allerdings wuerde es mit dem grauen komisch aussehen, deshalb weg damit. */
  background: white;
}

/* - Logo bzw. Kopf - */
#logo {
  background: url(../img/AddContents_Logo.jpg) 0 0 no-repeat #FFFFFF; /* #084178; */
  height: 64px; /* Das Bild ist 64px hoch also waehlen wir das auch als hoehe fuer unseren Kopf. */
  padding: 0 20px;
  text-align: right;
  line-height: 54px;
  font-size: 54px; /* Das Logo soll auch in unseren Kopf passen deswegen ist es ein wenig kleiner. Durch die Angabe der Textgroeße in px verhindern wir im IE die Vergroeßerung und zerstoerung des Layouts durch den Benutzer. Der Opera vergroeßert das Bild proportional mit also kann da auch nichts passieren. */
  overflow: hidden; /* Einzig der Mozilla koennte den Text unverhaeltnissmaeßig zum Hintergrund veraendern. Damit dann wenigstens das Menue benutzbar bleibt schneiden wir alles was herausragt ab. */
  letter-spacing: -3px; /* Wieder ein wenig Typografie damit das Logo besser aussieht. */
  margin: 0; /* Manche Browser haben das schon voreingestellt aber nicht alle, deshalb vereinheitlichen wir das. */
}
#logo a {
  color: white; /* Die vorher eingestellte Farbe passt nicht um auch als Logofarbe zu dienen, deshalb waehlen wir hier weiß. */
  text-decoration: none;
}
#logo a span { /* Der letzte Buchstabe soll invertiert dargestellt werden. */
  color: black;
  background: white;
  padding-right: 0.1em; /* Ein Hack, damit das weiße rechts und links genau so breit ist. */
  font-weight: bold;
}

/* - Der Hauptinhaltsteil - */
#main { 
  padding: 0 31% 0 20px; /* Der rechte Abstand (31%) */
  line-height: 1.5em; 
  text-align: left;
}

/* - Menue - */
#menu {
  background: url(../img/wechselschatten.png)  #084178; 
  padding: 5px 5%; /* Je kleiner das Fenster desto kleiner soll auch der Abstand des Menues rechts und links sein. */
  margin: 0;
  text-align: right;
  color: yellow; /* Hier definieren wir die Farbe des Menuepunktes, der kein Link ist, also den Menuepunkt der Seite auf der wir uns gerade befinden. */
}
#menu li {
  font-size: 1.0em;
  display: inline; /* Damit die Menuepunkte nebeneinander und nicht untereinander erscheinen. */
  list-style-type: none; /* Die Bullets vor den Menuepunkten schalten wir ab. */
  border-left: 1px solid white; /* Ein optischer Trennungsstrich */
  padding: 0 10px 0 15px;
  /*font-weight: bold;*/
}
#menu li a {
  color: white; /* Hier ist das mit der Linkfarbe genau so, sie soll weiß sein. */
  text-decoration: none;
}
#menu2 {
  /*background: url(../img/wechselschatten.png) #084178;*/
  background-color: #63B6EC;
  padding: 2px 2%; /* Je kleiner das Fenster desto kleiner soll auch der Abstand des Menues rechts und links sein. */
  margin: 0;
  text-align: right;
  color: yellow; /* Hier definieren wir die Farbe des Menuepunktes, der kein Link ist, also den Menuepunkt der Seite auf der wir uns gerade befinden. */
}
#menu2 li {
  font-size: 0.9em;
  display: inline; /* Damit die Menuepunkte nebeneinander und nicht untereinander erscheinen. */
  list-style-type: none; /* Die Bullets vor den Menuepunkten schalten wir ab. */
  border-left: 1px solid white; /* Ein optischer Trennungsstrich */
  padding: 0 8px 0 12px;
  /*font-weight: bold;*/
}
#menu2 li a {
  color: white; /* Hier ist das mit der Linkfarbe genau so, sie soll weiß sein. */
  text-decoration: none;
}

/* - Subnavigation, Rechte Spalte - */
#subnav {
  width: 26%; 
  min-width: 10em; /* Damit uns die Subnavigarion nicht zu sehr zusammengeschoben wird. */
  float: right; 
  padding: 0px 1% 1em 1%; /* die erste zahl besagt: padding top*/
  margin: 1em 1% 0 1%;
  border-left: 1px dotted #aaa; /* Hiermit trennen wir optisch die Subnavigation vom eigentlichen Inhalt ab. */
  font-size: 0.8em; /* Die Schriftgroeße setzen wir hier ein wenig herunter damit erkennbar wird dass das Informationen zweiter Rangordnung sind. */
}
#subnav dt { /* Die einzelnen ueberschriften in der Subnavigation */
  color: #084178; /*#6699CC*/
  font-size: 1.2em;
  padding: 0.5em;
  margin-top: 1em;
  border-bottom: 1px dotted #aaa; /* Hier eine optische Trennungslinie zwischen den einzelnen Bereichen der Subnavigation. */
  text-align: left;
}
#subnav dd { /* Die Unterpunkte der Subnavigation. */
  padding: 0;
  font-size: 1.2em;
  margin: 0.2em 0;
  text-align: left;
}

/* - footer - */
#footer {
  font-size: 0.8em;
  clear: both;
  padding: 0 20px;
  text-align: right;
}



/* ------------------ */
/* --- INPUT MASK --- */
/* ------------------ */
.errfield {
  color: red;
}
.buttonMedium {
  background-image:url(../img/button_layer.gif);
  background-position:center;
  border:1px solid #7E7E72;
  font-size:12px;
  text-decoration:none;
  color:#000000;
  padding:1px 11px 1px 11px;
  line-height:16px;
  width: 100px;
}
.buttonMedium:hover {
  color:#990033;
}
.buttonLarge {
  background-image:url(../img/button_layer.gif);
  background-position:center;
  border:1px solid #7E7E72;
  font-size:12px;
  text-decoration:none;
  color:#000000;
  padding:1px 11px 1px 11px;
  line-height:16px;
  width: 150px;
}
.buttonLarge:hover {
  color:#990033;
}
.buttonExtralarge {
  background-image:url(../img/button_layer.gif);
  background-position:center;
  border:1px solid #7E7E72;
  font-size:12px;
  text-decoration:none;
  color:#000000;
  padding:1px 11px 1px 11px;
  line-height:16px;
  width: 200px;
}
.buttonExtralarge:hover {
  color:#990033;
}
.supplierTitle {
  background-color:#B4D0E6;
}

.databaseTitle1 {
  background-color:#DDEFFD;
}

.databaseTitle2 {
  background-color:#F1F3F9;
}



/* ------------------------------- */
/* --- SEARCH GUI / RESULTLIST --- */
/* ------------------------------- */
/* - cluster left - */
#cluster {
  color: #000000;
  font-size: 0.9em;
  /*line-height: 1.5em;*/ /* Zur besseren Lesbarkeit erhoehen wir die Zeilenhoehe. */
  /*float: left; width: 200px;*//* links */
  margin: 0; padding: 1em 1em 1em 0;
  border: 1px dashed #B0C4DE;
}
.clustertbl {
  color: #000000;
  font-size: 0.9em;
  /* font-family: arial, sans-serif; */
}

/* - Der Hauptinhaltsteil - */
#mainsearch {
  /* background: url(../img/blaue-blume.png) no-repeat 100% 0 white;  Die kleine, blaue, halbdurchsichtige Blume wird als Hintergrundbild, welches rechts oben in der Ecke steht, definiert. */
  /*margin: 0 210px 0 200px;*/ /* mit cluster links */
  margin: 0 210px 0 0; /* mit cluster oben */
  padding: 0;
  /* border-right: 1px dashed silver; */
  font-size: 1.0em;
  min-width: 200px;
}

/* - ontology right - */
#ontology {
  color: #000000;
  font-size: 0.9em;
  float: right; width: 210px;
  margin: 0; padding: 1em 0 1em 1em;
  /*border: 1px dashed silver;*/
}
.ontologybar {
  BACKGROUND-COLOR: #FF9933;
}
.ontologytbl {
  color: #000000;
  font-size: 0.9em;
}

/* - search status - */
.statustbl {
  padding: 0;
  spacing: 0;
  border: 1px solid #000066;
  line-height: 10px;
}
.statusbar {
  BACKGROUND-COLOR: #0033CC;
}

/* - ergebnis zusammenfassung - */
#resultsummary {
  color: #000000;
  font-size: 1.0em;
  background: #B0C4DE;
  vertical-align: text-bottom;
  text-align: right;
  padding: 0;
}

/* - links zu next pages - */
#nexturl {
  font-size: 1.0em;
  vertical-align: text-bottom;
  text-align: center;
  font-weight: bold;
}

.resultTitle {
  font-size: 1.0em;
}
.resultInfo {
  font-size: 0.8em;
}
.resultAddon {
  font-size: 0.8em;
  color: green;
}

.fn1 {
  font-size: 0.8em;
  padding: 0 20px;
  text-align: right;
  margin-top:-5px;
}



/* ---------------- */
/* --- FULLTEXT --- */
/* ---------------- */
/* Headline im Dokument */
.dstitle {
  font-size: 1.0em;
  font-weight: bold;
}
/* Fusszeile */
.dsfooter {
  font-size: 0.8em;
}
/* Highlights in Ergebnisliste und Volltext */
.active {
  color: #CC0000;
}
/* Highlights in Ergebnisliste und Volltext */
.t6 {
  color: #990033;
}
/* VOLLTEXTANZEIGE Kleinueberschrift */
.u8 {
  color: #990033;
  font-size: 1.0em;
  font-family: verdana, arial, Helvetica, sans-serif ;
}
/* VOLLTEXTANZEIGE Texte */
.t8 {
  color: #000000;
  font-size: 1.0em;
  font-family: verdana, arial, Helvetica, sans-serif ;
}