@charset "UTF-8";

/* basic.css von www.hellgold.de. Copyright 2011 */

/* COLORS:

Grau = 5C5C5C
Mittelgrau = 666
Gelb = FC0
Hellgelb = FFCC47
Blassgelb = FE9
Orange = ff9000
Schrift = 222
Hintergrund = DDD

*/


/* --------------------------------- */
/* ----------- CSS RESET ----------- */

* {
	padding: 0; /* Innenabstand */
	margin: 0; /* Aussenabstand */
	font-size: 100%; /* relativer Wert = wichtig! */
	font-weight: normal;
	border: 0;
}

ul, ol {
	list-style: none;
}

b, strong, em {
	font-weight: bold;
}

img, a:link img, a:hover img {
	border:none;
	text-decoration:none;
}

hr {
	color:#FC0;
	margin-top: 6px;
	margin-bottom: 10px;
	width: 98%;
}

/* ---------------------------------------- */
/* ----------- SCHRIFT / GROESSE ----------- */

html {
	font: 70%/1.2em Tahoma, Verdana, Arial, Helvetica, sans-serif;
}

body {
	background-color: #ddd;
	background-image: url(../images/hellgold_body_bg.gif);
	color: #222;
}

p {
	padding-bottom: 9px; /* Abstand nach Absatz */
}

h2, h3, h4, h5, h6,
h2 a, h3 a, h4 a, h5 a, h6 a {
	font-weight: bold;
}

h2 {
	font-size: 1.2em;
	color: #ff9000;
	margin-bottom: 0.65em; /* Abstand nach h2 */
}

h2 a {
	text-decoration:underline;
}

h3 {
	font-size: 1.1em;
	color: #5c5c5c;
	margin-bottom: 0.5em; /* Abstand nach h3: verändert sich in Abhängigkeit von der Schriftgröße, da in em angegeben (kann mit firebug eingesehen werden) */
}

h4, h5, h6 {
	margin-bottom: 0.3em; /* Abstand nach Absatz */
}

/* ------------------------------------------ */
/* ----------- PSEUDOKLASSE LINKS ----------- */

a:link, a:visited {
	color: #000;
	text-decoration:none;
}

a:hover, a:active, a:focus {
	background-color: #FFCC47; /* Farbliche Hinterlegung eines Links */
	color: #000;
	text-decoration:none;
}

p a:hover, p a:active {
	background-color: #ffcc00; /* Farbliche Hinterlegung von Links im Fliesstext */
}


div#mainbar h3 a {
	color: #5c5c5c;
	text-decoration: underline;
}

/* ---------------------------------------------------- */
/* ----------- PSEUDOKLASSE LINKS GELB ---------------- */

a.speziell:link, a.speziell:visited {
  background-color: #FFF;
  color: #000;
  text-decoration:underline
}

a.speziell:hover, a.speziell:active, a.speziell:focus {
  background-color: #FFCC47;
  color: #000;
  text-decoration:underline
}


/* ---------------------------------------- */
/* ----------- LISTEN ALLGEMEIN ----------- */

ul {
	list-style-position:inside;
	padding-left: 10px; /* Globale Einrückung einer Liste von links aus (2) */
}

li {
	list-style: none;
	padding-bottom: 3px; /* Abstand der Listenelemente zueinander */
}

/* -------------------------------------------------------------- */
/* ----------- LINKS IN LISTEN FARBLICHE HERVORHEBUNG ----------- */

.standardliste {
	background-color: #FFF;
	color:#000
}

.standardliste a:link, .standardliste a:visited {
  background-color: #FFF;
  color: #000;
  text-decoration:underline
}

.standardliste a:hover, .standardliste a:active, .standardliste a:focus {
  background-color: #FFCC47;
  color: #000;
  text-decoration:underline
}


/* ------------------------------------- */
/* ----------- TOPNAVIGATION ----------- */

div#navTop {
	position: relative;
	height: 0; /* = Trick, um den Container der Navigation so flach zu machen, dass das Layout oben bündig abschließt */
	top: -26px;
	left: 675px; /* verschiebt Position der Liste von links aus (war 700px) */
	letter-spacing: 0.05em;
}

div#navTop ul li {
	display:inline; /* stellt Listenelemente nebeneinander */
	padding-left: 10px;
	font-family:Tahoma, Arial, Helvetica, sans-serif;
	font-size: 0.9em;
	text-transform:uppercase;
}

/* ---------------------------------------------------- */
/* ------- TOPNAVIGATION (Gestaltung der Links) ------- */

div#navTop a:link, a:visited {
	color: #333;
	text-decoration: none;
	background-color:#CCC;
}

div#navTop a:hover, a:active, a:focus {
	color: #333;
	text-decoration:none;
	background-color: #F9F9F9;
}

/* --------------------------------------- */
/* ----------- HAUPTNAVIGATION ----------- */

div#navMenu {
	background-color:#ffcc00;
	list-style-type:none;
	list-style-position:outside;
	float:right;
	width: 534px; /* Breite der Navigationsliste */
	height: 138px; /* Wert = 146px - 8px wegen padding oben/unten ! */
	padding: 4px 10px ; /* rückt Navigationslinks ein */
	/* text-transform:uppercase; */
	letter-spacing: 0.05em;
}

div#navMenu ul { /* hebt globale CSS-Listendefinition (s.o.) für Navigationsliste auf */
	list-style-position:outside;
	padding-left: 12px; /* regelt Einrückung der Liste nach links (2) */
}

div#navMenu ul li { /* hebt globale CSS-Listendefinition (s.o.) für Navigationsliste auf */
	list-style-type:none; /* entfernt Listenbullet */
	padding: 3px 0; /* Abstand der Links zueinander */
}

/* div#navMenu ul li a:hover {
background-color:#FF9;} */

/* ---------------------------------------------------- */
/* ----------- HAUPTNAVIGATION PSEUDOKLASSE LINKS----------- */

.navigation {
	width:98%;
}

.navigation a:link, .navigation a:visited {
background-color: #FC0;
  color: #000;
  text-decoration:none;
}

.navigation a:hover, .navigation a:active, .navigation a:focus {
	background-color: #FE9;
	color:#000;
}


/* ---------------------------------------------------- */
/* ----------- LAYOUT ----------- */

div#wrapper {
	background-color:#FFF;
	width: 924px; /* Sichtbare Breite = width + border left/right + padding left/right = 940px */
	border: 2px solid #FC0;
	padding: 6px;
	margin: 42px auto; /* Abstand nach oben, mittige Zentrierung */
}

div#header {
	height: 146px; /* war 124px */
	width: 924px;
	margin-bottom: 6px;
}

/* -------------------------------------------- */
/* ---------- PHARK IMAGE REPLACEMENT --------- */

div#logo {
	background-color:#FFF;
	width: 364px;
	height:146px;
	float:left;
}

h1 {
}

h1 a {
	text-decoration: none;
	text-indent: -999em;
	display: block;
	height: 146px;
	width: 364px;
	background-image:url(../images/hellgold_logo.png);
	background-repeat:no-repeat;
}

h1 a:hover {
	background-image:url(../images/hellgold_logo_hover.png);
}

/* ---------------------------------------------------- */
/* ----------- CONTENT ----------- */

div#content {
	clear:both; /* hebt floating auf, notwendig weil Headerlogo floatet */
	height:auto; /* war 380px */
	margin-bottom:6px;
}

div#content ul {
	list-style-position:inside;
	padding-left: 16px; /* linke Einrückung der Liste */
}

div#content li {
	list-style-image: url(../images/list_style_bullet2.gif);
	line-height:1.4em;
}

div#content ul li a:link, ul li a:visited {
	text-decoration:underline;
}

div#content ul li a:focus, ul li a:hover, ul li a:active {
	background-color: #FC0;
}


/* ---------------------------------------------------- */
/* ----------- SIDEBAR LEFT ----------- */

div#sidebarLeft {
	/* background-color: #ffcc00; */
	width:364px;
	height:380px; /* orig = 330px, 364px */
	float:left;
	margin-bottom: 6px; /* kleiner Aussenabstand am unteren Rand des linken Grafik */
}


/* ---------------------------------------------------- */
/* ----------- MAINBAR ----------- */

div#mainbar {
	margin-left: 370px; /* hierdurch wird verhindert, dass sidebarLeft mainbar überlappt (1) */
	height: auto; /* Gesamthöhe = 380px + 2x10px padding (siehe unten) */
	margin-bottom: 6px;
	padding: 6px 10px 10px 20px; /* rückt den Text ein */
	width: 524px;
}

div#mainbar a:link, a:visited  {
	text-decoration: underline;
}

div#mainbar a:focus, a:hover, a:active {
	background-color: #FFCC47;
}

.clearfloat { /* Ausgleich der Höhe Mainbar */
	clear:both;
}

/* ---------------------------------------------------- */
/* ----------- FOOTER ----------- */

div#footer {
	clear: both;
	background-color:#FC0;
	height: 36px;
	text-align:center;
	font-size: 0.9em;
	color:#000;
}

div#footer ul {
	padding-top: 9px;
}

div#footer li {
	display:inline;
	margin-right: 5px; /* Abstand der Listenelemente von oben und zueinander */
	letter-spacing: 0.04em;
}

/* ---------------------------------------------------- */
/* ----------- FOOTER LINKS----------- */

div#footer li a {
	text-decoration: none;
}

div#footer li a:link, a:visited {
	color:#000;
	background-color: transparent;
}

div#footer li a:hover, a:active, a:focus {
	background-color: #FF9;
}

/* ---------------------------------------------------- */
/* ----------- KLASSEN ----------- */

.unterstrichen {
	text-decoration:underline;
	color: #ff9000;
}

.ausgezeichnet {
	font-weight:bold;
	color: #000;
}

.achtung {
	font-weight:bold;
	color:#C03;
}

.bild_fliesstext {
	margin: 2px 0 4px 0;
	padding-left: 6px; /* rückt Bild ein */
}

.kundenstimme a {
	color:#000;
	font-weight:bold;
	line-height:1.4em;
}

div#callback {
	border: 2px solid #fc0;
	background-color:#ffc;
	padding: 2px;
}