/* Allgemeine Einstellungen für jede Seite */
* {
margin:0;
padding:0;
}

/* Höhe und Breite der Html Datei */
html {
height:98%;
width:100%;
}

/* Allgemeine Darstellung des Anzeigeteils */
body {
background-color:#A2B5CD;
color:#FFF;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:small;
height:100%;
width:100%;
}

/* Eigenschaften für alle Links */
a {
outline:none;
text-decoration:none;
}

/* Eigenschaften für die Überschfrift H1 --> Verwendung nochmal prüfen ... */
h1 {
font-size:170%;
text-align:center;
}

/* Nochmals funktionalität prüfen */
p,ul {
margin-bottom:1em;
}

/* Eine Art Übercontainer für den restlichen Inhalt */
#wrapper {
background-attachment:fixed;
background-image:url(../bilder/gradient5.jpg);
color:#000;
margin:auto auto auto 5.8%;
width:880px;
}

/* Uberkopfbereich */
/* Logo und Kopf des Dokumentes */
#ueberkopfbereich {
height:12px;
}
/* Ende Überkopfbereich */

/* Navibereich */
/* Allgemeine  Eigenschaften der Navigation */
#navibereich {
height:1px;
padding-bottom:1px;
padding-left:11px;
padding-right:13px;
position:relative;
z-index:2;
}

/* Eigenschaften der Links im Menü, oder auch des zu sehenden Textes im Menü */
#navibereich a {
border-bottom:0;
color:#FFF;
display:block;
font-weight:700;
margin-left:-13px;
padding:4px;
text-decoration:none;
}

/* Eigenschaften beim Klick auf ein Menüpunkt */
#navibereich a:active {
background-image:url(../bilder/menuehintergrund3.jpg);
}

/* Allgemeine Eigenschaften des Hauptmenüs */
#navibereich ul.hm1, ul.hm2, ul.hm3, ul.hm4, ul.hm5, ul.hm6 {
background:#003ea4;
border-bottom:1px ridge #B4B8B9;
border-right:1px ridge #B4B8B9;
color:#000;
display:inline;
letter-spacing: 0.10em;
float:left;
height:25px;
list-style-type:none;
width:141px;
}

/* Nur das Linke Hauptmenü bekommt einen Linken Rand, da ansonsten zwischen "hm1" und "hm2" ein doppelte Rand enstehen würde */
#navibereich ul.hm6 {
width: 145px;
}


/* Mouseover beim Hauptmenü */
#navibereich ul.hm1:hover, ul.hm2:hover, ul.hm3:hover, ul.hm4:hover, ul.hm5:hover, ul.hm6:hover {
background-image:url(../bilder/menuehintergrund2.jpg);
color:#000;
display:block;
}

/* Eigenschaften des ersten Untermenüs */
#navibereich ul.um {
background-image:url(../bilder/menuehintergrund.jpg);
border-right:1px outset darkblue;
border-bottom: 2px outset darkblue;
border-top: 1px outset darkblue;
color:#000;
display:none;
left:-14px;
letter-spacing:0;
list-style-type:none;
position:absolute;
top:24px;
width:171px;
}

/* Eigenschaften des zweiten Untermenüs */
#navibereich ul.uum {
background-image:url(../bilder/menuehintergrund.jpg);
border-top: 1px outset darkblue;
border-right:2px outset darkblue;
border-bottom: 2px outset darkblue;
color:#000;
display:none;
left:171px;
letter-spacing:0;
list-style-type:none;
position:absolute;
top:-1px;
width:170px;
}

/* Position des Menütextes */
#navibereich li.um, #navibereich li.uum {
margin-left: 12px;
}

/* Mouseover beim ersten und zweiten Untermenü */
#navibereich li.um:hover, #navibereich li.uum:hover {
background-image:url(../bilder/menuehintergrund2.jpg);
color:#000;
display:block;
margin-left:0px;
padding-left:12px;
}

/* positioniert das Untermenü unter dem Hauptmenü */
#navibereich li.hm,li.um {
position:relative;
}

/* ermöglicht das aufklappen des Menüs */
#navibereich li.hm:hover ul.um,#navibereich li.um:hover ul.uum {
display:block;
}

/* Hinterlegt das entsprechende Hauptmenü von der aktuellen Seite */
#unternehmen #navi01 a,#firmenprofil #navi01 a,#hauptseite #navi02 a,#anfahrt #navi02 a,#mitarbeiter #navi02 a,#laden #navi02 a,#anfahrtladen #navi02 a,#buero #navi03 a,#netzwerk #navi03 a,#praesentation #navi03 a,#medizin #navi03 a,#it #navi03 a,#bws #navi03 a,#partner #navi04 a,#toshiba #navi04 a,#oki #navi04 a,#hp #navi04 a,#canon #navi04 a,#kyocera #navi04 a,#epson #navi04 a,#brother #navi04 a,#sharp #navi04 a,#samsung #navi04 a,#benq #navi04 a,#acer #navi04 a,#supermicro #navi04 a,#tyan #navi04 a,#amd #navi04 a,#intel #navi04 a,#microsoft #navi04 a,#nec #navi04 a,#optoma #navi04 a,#kindermann #navi04 a,#medium #navi04 a,#infoterminals #navi04 a,#rau #navi04 a,#richardson #navi04 a,#iteam #navi04 a,#tobit #navi04 a,#gdata #navi04 a,#novell #navi04 a,#softengine #navi04 a,#notebooks #navi05 a,#pwindex #navi05 a,#pcs #navi05 a,#support #navi06 a,#angneu #navi05 a,#angbear #navi05 a,#angloes #navi05 a{
background-image:url(../bilder/menuehintergrund2.jpg);
color:#000;
}
/*Ende Navibereich */

/* Vortextbereich */
/* Stellt die Bilder direkt unter der Navigation dar */
#vortextbereich {
margin-right:68px;
padding-left:11px;
padding-right:13px;
position:absolute;
top:106px;
z-index:1;
}
/* Ende Vortextbereich */

/* Textbereich */
/* Der eigentliche Inhalt von den jeweiligen Seiten */
#textbereich {
margin-bottom:150px;
margin-top:20px;
min-height:270px;
padding:5px 10px 60px 20px;
position:relative;
top:205px;
left: 0px;
}

/* Darstellung eines Links (Textbereich & Fussbereich) */
#textbereich a:link, #fussbereich a:link {
color: #d90000;
border:0;
}

/* Links die schon einmal besucht wurden sind (Textbereich & Fussbereich) */
#textbereich a:visited , #fussbereich a:visited {
color: #c66;
border:0;
}

/* Mouseover für Links die schon mal besucht wurden sind (Textbereich & Fussbereich) */
#textbereich a:visited:hover, #fussbereich a:visited:hover {
border-bottom: 1px solid white;
color: white;
}

/* Allgemeiner Mouseover für Links (Textbereich & Fussbereich) */
#textbereich a:hover, #textbereich a:focus, #fussbereich a:hover p, #fussbereich a:focus {
color: white;
border-bottom: 1px solid white;
}

/* Beim Klick auf den Link */
#textbereich a:active , #fussbereich a:active {
color: white;
background: #d90000;
border:0;
}

/* Für einige Seiten als Überschrift gedacht */
#hauptseite #textbereich p, #laden #textbereich p, #anfahrt #textbereich p, #anfahrtladen #textbereich p, #mitarbeiter #textbereich p {
color:red;
font-weight:700;
font-size: 11pt;
}
/* Ende Textbereich */

/* Fussbereich */
/* Fussbereich, dort steht der Adressteil und der Impressums-Link */
#fussbereich {
background-color:#003da4;

color:#fff;
font-weight:700;
margin-top:0px;
padding:0px 20px 5px;
margin-top: 30px;
position:relative;
top: -30px;
z-index:1;
background-color:transparent;
}

/* Position und Eigenschaften für den Impressums-Link */
#fussbereich p {
font-size:87%;
padding-top:12px;
text-align:right;
position: relative;
top: 12px;
}

#fussbereich a:hover {
color: white;
border-bottom: 1px solid fff;
}
/*Darsetllung der Anschrift im Fussbereich */
#fussbereich address {
font-size:80%;
font-style:normal;
font-weight:700;
letter-spacing:2px;
line-height:1.17em;
text-align:center;
}
/* Ende Fussbereich */

/* liegt in wirklichkeit auf dem Fussbereich, stellt wie im Kopfbereich den Farbübergang und die Rundungen dar */
#unterfussbereich {
height:0px;
border-top:2px ridge white;
top:-90px;
position:relative;
z-index:0;
}
/* Ende Unterfussbereich */
/* Ende der allgemeinen Eigenschaften */


/* Seiten spezifische Eigenschaften */
/* Nimmt beim OnClick ereigniss, bei den Firmenlogos, den Hintergrund weg */
#partner a:active,#toshiba a:active,#oki a:active,#hp a:active,#canon a:active,#kyocera a:active,#epson a:active,#brother a:active,#sharp a:active,#samsung a:active,#benq a:active,#acer a:active,#supermicro a:active,#tyan a:active,#amd a:active,#intel a:active,#microsoft a:active,#nec a:active,#optoma a:active,#kindermann a:active,#medium a:active,#infoterminals a:active,#rau a:active,#richardson a:active,#tobit a:active,#gdata a:active,#novell a:active,#softengine a:active,#support img.pdf,#startseite a:active {
background-color:transparent;
}

/* Nimmt für die Firmenlogos den Unterstrich beim Mouseover weg */
#partner #textbereich a:hover, #partner #textbereich a:focus, #toshiba #textbereich a:hover, #toshiba #textbereich a:focus, #oki #textbereich a:hover, #oki #textbereich a:focus, #hp #textbereich a:hover, #hp #textbereich a:focus, #canon #textbereich a:hover, #canon #textbereich a:focus, #kyocera #textbereich a:hover, #kyocera #textbereich a:focus, #epson #textbereich a:hover, #epson #textbereich a:focus, #brother #textbereich a:hover, #brother #textbereich a:focus, #sharp #textbereich a:hover, #sharp #textbereich a:focus, #samsung #textbereich a:hover, #samsung #textbereich a:focus, #benq #textbereich a:hover, #benq #textbereich a:focus, #acer #textbereich a:hover, #acer #textbereich a:focus, #supermicro #textbereich a:hover, #supermicro #textbereich a:focus, #tyan #textbereich a:hover, #tyan #textbereich a:focus, #amd #textbereich a:hover, #amd #textbereich a:focus, #intel #textbereich a:hover, #intel #textbereich a:focus, #microsoft #textbereich a:hover, #microsoft #textbereich a:focus, #nec #textbereich a:hover, #nec #textbereich a:focus, #optoma #textbereich a:hover, #optoma #textbereich a:focus, #kindermann #textbereich a:hover, #kindermann #textbereich a:focus, #medium #textbereich a:hover, #medium #textbereich a:focus, #infoterminals #textbereich a:hover, #infoterminals #textbereich a:focus, #rau #textbereich a:hover, #rau #textbereich a:focus, #richardson #textbereich a:hover, #richardson #textbereich a:focus, #tobit #textbereich a:hover, #tobit #textbereich a:focus, #novell #textbereich a:hover, #novell #textbereich  a:focus, #gdata #textbereich a:hover, #gdata #textbereich a:focus, #softengine #textbereich a:hover, #softengine #textbereich a:focus, #startseite #textbereich a:hover, #startseite #textbereich a:focus, #iteam #textbereich a:hover, #iteam #textbereich a:focus{
  border-bottom:0;
}

/* "umweg" ist eine Klasse, die verhindert das die Logos (links) einen Unterstrich bekommen */
#textbereich #umweg {
font-size:7pt;
letter-spacing:1px;
text-align:center;
}

/* da bei den Partnerseiten alles auser das Logo sich in der "umweg" klasse befindet, wird auch nur der text als link gekennzeichnet */
#textbereich #umweg a:hover, #textbereich #umweg a:focus {
border-bottom: 1px solid white;
}
#textbereich #umweg a:active {
background-color:#d90000;
color:#FFF;
}

/* selbst erklärend */
#iteam #textbereich,#impressum #textbereich {
font-size:10pt;
}

#iteam #textbereich {
padding-bottom:85px;
}
/* Eigenschaften für den Impressumsteil */
#impressum #textbereich p {
color:#000;
font-size:7pt;
font-weight:100;
letter-spacing:0.1px;
}

/* Eigenschaften für den Unternehmensteil */
#firmenprofil #textbereich{
left: 30px;
position: relative;
top: 140px;
font-size: 10pt;
}
#unternehmen #textbereich b {
position: relative;
left: -18px;
top: -15px;
font-size: 10pt;
}
#unternehmen #textbereich {
position: relative;
left: 27px;
top: 165px;
}

/* Positionierung und Formatierung verschiedener textbereiche */
#laden #textbereich, #anfahrt #textbereich, #anfahrtladen #textbereich, #buero #textbereich, #netzwerk #textbereich, #praesentation #textbereich, #medizin #textbereich, #it #textbereich, #bws #textbereich, #partner #textbereich, #mitarbeiter #textbereich , #hauptseite #textbereich,#iteam #textbereich{
left: -858px;
position: relative;
top: 200px;
}
#notebooks #textbereich,#pwindex #textbereich,#beamer #textbereich, #pcs #textbereich, #drucker #textbereich , #multifunktion #textbereich {
top: 150px
}
#support #textbereich {
position: relative;
top: 140px;
left:10px;
}
#support #textbereich p {
position: relative;
top: 0px;
left: 20px;
}
#impressum #textbereich {
position: relative;
top: 160px;
left: 10px;
}
#impressum #textbereich p {
  position: relative;
  left: 20px;
}

/* Positionierung der Partner Textbereich*/
#acer #textbereich, #microsoft #textbereich, #hp #textbereich, #epson #textbereich, #toshiba #textbereich, #nec #textbereich, #oki #textbereich, #canon #textbereich, #sharp #textbereich, #benq #textbereich, #samsung #textbereich, #supermicro #textbereich, #tobit #textbereich, #amd #textbereich, #brother #textbereich, #gdata #textbereich, #novell #textbereich, #tyan #textbereich, #kyocera #textbereich, #intel #textbereich, #kindermann #textbereich, #medium #textbereich, #optoma #textbereich, #rau #textbereich, #richardson #textbereich, #infoterminals #textbereich, #softengine #textbereich {
position: relative;
top:155px;
left: 0;
}
#hauptseite #textbereich b, #hauptseite #textbereich, #anfahrt #textbereich b, #anfahrt #textbereich, #mitarbeiter #textbereich b, #laden #textbereich b, #laden #textbereich, #anfahrtladen #textbereich b, #anfahrtladen #textbereich {
  font-size: 8pt;
}
#notebooks #textbereich, #pcs #textbereich, #drucker #textbereich, #multifunktion #textbereich, #beamer #textbereich {
padding-bottom: 30px;
font-size: 14pt;
text-decoration: underline;
}
#pwindex #textbereich {
padding-bottom: 30px;
font-size: 11pt;
text-decoration: none;
}
/* Eigenschaften der Startseite (mögliche löschung, da die startseite bald rausgenommen wird?!) */
#startseite #textbereich {
left:60px;
position:relative;
top:30px;
}
#startseite #fussbereich {
margin-top:-180px;
}
#startseite #textbereich p a:hover{
border-bottom:1px solid white;
color: white;
}
#startseite #textbereich p {
color: black;
font-size:12px;
}
#startseite #kopfbereich h1{
  color: black;
  text-decoration: underline;
}
#startseite #kopfbereich {
  padding-top: 6px;
}
#startseite #textbereich {
  position: relative;
  top: 5px;
  left: 65px;
}

/* Trennlinien und andere kleinere formatierungen (klassen / ids) */
.str {
text-align:right;
}

#plogo,.plogo,#start {
border:0;
}
.hr {
margin-left: 0px;
}
li {
margin-left:1em;
}


/* Positionierung des Kontaktformulares */
#kontaktformular #textbereich {
position: relative;
top: 220px;
left:-850px;
padding-bottom: 100px;
}

/* Textbereich der Bestätigungsmeldung */
#best #textbereich {
text-align: center;
}

/* Formatierung der Klasse Fehler für das Kontaktformular (Fehlermeldungen) */
.fehler {
font-size: 8pt;
color: red;
}

#lo {
position: relative;
top: -12px;
}

#ro {
position: relative;
top: -12px;
left: 850px;
}
.name {
font-weight: bold;
font-size: 13pt;
}
.preis {
font-weight: bold;
font-size: 11pt;
}
.ink {
color: #191970;
font-size: 7pt;
}
.info {
font-size: 10pt;
}
.link {
font-size: 8pt;
}
.ubild {
font-size: 7pt;
}
#update {
position: relative;
left: 710px;
top: 37px;
font-size: 7pt;
font-family: Helvetica;
}
.av {
font-weight: bold;
display:block;
padding-left: 110px;
font-size: 10pt;
}
#angneu #textbereich {
position: relative;
top: 220px;
left: -850px;
padding-bottom: 100px;
}

#angloes #textbereich, #angbear #textbereich {
position: relative;
top: 160px;
left: 0px;
padding-bottom: 50px;
}
.angbil {
width: 155px;
height: 135px;
}
.mright {
position: relative;
left: 847px;
}