@charset "utf-8";
/* CSS-Datei für Global Contact*/

/* Befehl, dass alle Positionen  auf 0 gesetzt werden */
/* dadurch gibt es keine Verschiebungen bei den Browsern */
/* * steht für alle Elemente */
* {
margin: 0;
padding: 0;
}

/* alle Rahmen im Layout werden vorerst auf 0 gesetzt */
html, body {
border: 0 solid;
}

/* Grunddefinition für Schrift und Farbe */
body {
font: 11px Verdana, Arial, Helvetica, sans-serif;
color: #333;
background: #32568a url(../bilder/hintergrund-streifen-oben.jpg) 0 0 repeat-x;
text-align: center; /* der body wird zentriert - zentriertes Design */
}

/* Die Schriftgröße in einem Absatz ist generell 11px */
p {
font-size: 11px;
padding: 10px 10px 10px 5px;
}

hr {
width: 670px;
height: 2px;
background: #32568a;
text-align: center;
margin-top: 5px;
border: 0 none;
}

h1 {
font: 18px Verdana, Arial, Helvetica, sans-serif;
font-weight: bold;
color: #32568a;
padding: 5px 0 10px 3px; 
}

img {
border: 1px #32568a solid;
margin: 10px 0 0 0;
}

.ueberschrift {
font: 18px Verdana, Arial, Helvetica, sans-serif;
font-weight: bold;
color: #32568a;
padding: 5px 0 0px 25px; 
}

/* hier die normalen Links der Seite */
/* sie werden blau angezeigt - kein Unterstrich usw. */
a {
font-size: 11px;
font-weight: bold;
color: #32568a;
text-decoration: none;
}

/* sobald die Mouse darüber geht, werden sie fett - bleiben blau */
a:hover {
color: #fff;
font-weight: bold;
text-decoration: none;
background-color: #32568a;
}

.fett {
font-size: 11px;
font-weight: bold;
color: #32568a;
}

.klein {
font-size: 9px;
font-weight: normal;
padding: 0px 0px 0px 5px;
}

.fltrt {
float: right;
margin-left: 8px;
}

.fltlft {
float: left;
margin-right: 8px;
}

.clearfloat {
clear: both;
height: 0;
font-size: 1px;
line-height: 0px;
}


/* IDs */

/* website steht für den gesamten container, in dem alle divs liegen */
/* nicht mit dem body verwechseln - die Bereiche links und rechts, die sich je nach Browser vergrößern gehören nicht zur #website */
#website {
position: relative; /* dadurch wird das Layout zentriert - wichtig in Verbindung mit margin: 0 auto */
width: 980px;
margin: 0 auto; /* dadurch wird das Layout zentriert - wichtig in Verbindung mit position: relativ */
text-align: left; /* alles in der website soll aber linksbündig sein */
background: #415786 url(../bilder/hintergrund-weisser-inhalt.jpg) 0 0 repeat-y; /* das obere Hintergrundbild mit dem Streifen wiederholt sich horizontal */
}

/* das Element Kopf ist der gesamte Bereich oben, enthält das zwei Bilder quer über die Seite */
#kopf {
display: block;
width: 980px;
height: 227px;
background: transparent url(../bilder/kopf.jpg) 0 0 repeat-x; 
}

#kopf-rechts {
position: absolute;
top: 0px;
right: 0px;
width: 558px;
height: 227px;
z-index: 5;
background: transparent url(../bilder/kopf-rechts.jpg) no-repeat;
}

#link-deutsch {
	position: absolute;
	top: 192px;
	right: 200px;
	width: 20px;
	height: 14px;
	z-index: 8;
	background: transparent;
	visibility: visible;
}
#link-englisch {
	position: absolute;
	top: 192px;
	right: 175px;
	width: 20px;
	height: 14px;
	z-index: 8;
	background: transparent;
	visibility: visible;
}

#link-russisch {
	position: absolute;
	top: 192px;
	right: 150px;
	width: 20px;
	height: 14px;
	z-index: 8;
	background: transparent;
	visibility: visible;
}

#link-franz {
	position: absolute;
	top: 192px;
	right: 125px;
	width: 20px;
	height: 14px;
	z-index: 8;
	background: transparent;
	visibility: visible;
}

#kopf-links {
position: absolute;
top: 0px;
left: 0px;
width: 422px;
height: 227px;
z-index: 7;
background: transparent url(../bilder/kopf-links.jpg) no-repeat;
}

/* der Bereich inhalt enthält div-links und div-rechts */
#ueberschrift {
margin-left: 204px; /* er beginnt 204px von links (um für die Navigation Platz zu machen) */
width: 670px; /* der Div ist 670px breit */
color: #000; /* die normale Schriftfarbe ist dunkles Grau */
background: transparent;
line-height: 15px; /* um den peekaboo bug zu vermeiden */
}

/* der Bereich inhalt enthält div-links und div-rechts */
#inhalt {
margin-left: 225px; /* er beginnt 204px von links (um für die Navigation Platz zu machen) */
width: 640px; /* der Div ist 670px breit */
color: #000; /* die normale Schriftfarbe ist dunkles Grau */
background: transparent;
line-height: 18px; /* um den peekaboo bug zu vermeiden */
}

/* die linke Spalte im Inhalt-Bereich */
#links {
float: left;
width: 420px;
background: transparent;
margin-right: 5px;
padding-bottom: 20px; /* 20px Abstand nach unten */
}

/* die rechte Spalte im Inhalt-Bereich */
#rechts {
float: left;
width: 200px;
margin-left: 5px;
background: transparent;
padding-bottom: 20px; /* 20px Abstand nach unten */
}


/* Untermenue Inhalt */
#menue-inhalt1 {
width: 100px;
float: left;
margin: 10px 15px 10px 5px;
padding: 5px 5px 5px 5px;
font: 11px Verdana, Arial, Helvetica, sans-serif;
color: #333;
text-align: center;
background: #4cc2ea;
}

#menue-inhalt2 {
width: 120px;
float: left;
margin: 10px 15px 10px 5px;
padding: 5px 5px 5px 5px;
font: 11px Verdana, Arial, Helvetica, sans-serif;
color: #333;
text-align: center;
background: #4cc2ea;
}

#menue-inhalt3 {
width: 100px;
float: left;
margin: 10px 15px 10px 5px;
padding: 5px 5px 5px 5px;
font: 11px Verdana, Arial, Helvetica, sans-serif;
color: #333;
text-align: center;
background: #4cc2ea;
}


#menue-inhalt4 {
width: 100px;
float: left;
margin: 10px 15px 10px 5px;
padding: 5px 5px 5px 5px;
font: 11px Verdana, Arial, Helvetica, sans-serif;
color: #333;
text-align: center;
background: #4cc2ea;
}

#menue-inhalt5 {
width: 40px;
float: left;
margin: 10px 15px 10px 5px;
padding: 5px 5px 5px 5px;
font: 11px Verdana, Arial, Helvetica, sans-serif;
color: #333;
text-align: center;
background: #4cc2ea;
}




/* der footer ist die Fußzeile und geht über die gesamte Inhalt-Breite */
#footer {
left: 0px;
width: 980px;
height: 71px;
background: #c2c0c1 url(../bilder/fuss.jpg) no-repeat; 
clear: both;
}

/* für den Text im Footer gilt diese Größe, Farbe und hat diesen Abstand im Footer */
#footer .footertext {
color: #fff;
padding: 53px 0px 0px 200px;
text-decoration: none;
}

/* hier die Definition für Links im Footerbereich */
#footer .footertext a {
font-size: 9px;
color: #fff;
font-weight: normal;
}

/* hier die Definition für Links im Footerbereich beim hovern */
#footer .footertext a:hover {
color: #fff;
font-weight: normal;
text-decoration: none;
border-bottom: 2px dotted #fff;
background: none;
margin: 0px 0px 4px 0px;
}

/* Navigation links */
/* diese ist absolut positioniert - richtet sich aber immer an dem website-bereich */
#navlinks {
	position: absolute;
	top: 224px;
	left: 59px;
	width: 137px;
	color: #000;
	z-index: 15;
	background: transparent url(../bilder/hintergrund-menue.jpg) 0 0 repeat-y;
}

/* Listen im Bereich navlinks */
#navlinks li {
display: inline;
margin: 0 0 0 0;
}

/* die Links der Klasse nav im Navlinks-Div */
#navlinks .nav a {
font-size: 11px;
display: block;
width: 137px;
wid\th: 117px;
text-decoration: none;
font-weight: normal;
padding: 6px 0 6px 40px;
}

/* Links wenn verlinkt - normale ansicht, wenn bereits besucht */
#navlinks .nav a:link, 
#navlinks .nav a:visited {
font-size: 11px;
color: #000;
text-decoration: none;
padding: 6px 0 6px 40px;
background: transparent url(../bilder/menue1.jpg) top left no-repeat;
}

/* Links wenn mouse darüber geht, wenn man klickt, wenn mit Tab-Taste gesprungen wird */
#navlinks .nav a:hover, 
#navlinks .nav a:active, 
#navlinks .nav a:focus {
color: #000;
font-weight: bold;
background: transparent url(../bilder/menue2.jpg) top left no-repeat;
text-decoration: none;
}

#navlinks-ru {
	position: absolute;
	top: 224px;
	left: 59px;
	width: 137px;
	height: 300px;
	color: #000;
	z-index: 15;
	background: transparent url(../bilder/hintergrund-menue.jpg) 0 0 repeat-y;
}