@font-face { font-family: 'Eigenes'; src:url('fonts/Invitation.ttf') format('truetype'); }

body { background-color:grey; color:black; font-family:Eigenes, comic sans ms, cursive; }

a:link    { color:#f03232; }
a:visited { color:#f03232; }
a:hover   { color:darkred; }
a:focus   { color:darkred; }
a:active  { color:silver; }

h1 { color:#f03232; }
h2 { color:#f03232; }
h3 { color:#f03232; }
h4 { color:#f03232; }
h5 { color:#f03232; }
h6 { color:#f03232; }

hr { color:#f03232; background-color:#f03232; }

div.hauptseite { width:1000px; position:relative; background-color:white; text-align:left; } 
/* Änderungen an width haben Auswirkung auf div.menue und div.seite! */

div.hauptbild  { position:absolute; top:0px; right:0px; border:3px solid #f03232; z-index:999; }

div.kopf       { background:url(bilder/kopf.jpg) repeat-y top right; height:120px; position:relative; }
div.spruch     { position:absolute; top:40px; left:50px; width:600px; font-weight:bold; font-size:large; }
div.autor      { position:absolute; bottom:25px; right:150px; width:200px; }

div.hlinie     { background:url(bilder/hlinie.jpg) repeat-y; position:relative; top:0px; left:0px; height:5px; width:100%; }
div.ulinie     { background:url(bilder/ulinie.jpg) no-repeat top right; height:250px; width:100%; }

div.rumpf      { position:relative; }

div.bild       { position:relative; float:right; }
div.text       { position:relative; }
div.agb        { position:relative; font-family:Arial; font-size:10pt; margin-right:1cm; }

div.menue      { background:url(bilder/menuegrund.jpg) no-repeat; position:relative; width:200px; }
div.menuerumpf { background:url(bilder/vlinie.gif) repeat-y top right; width:100%; }

div.seite      { position:relative; padding:20px; width:760px; float:right; min-height:400px; }
/* padding * 2 + width = Gesamtbreite */

div.pseiten    { position:absolute; top:0px; left:0px; }
div.panzahl    { position:absolute; top:0px; right:0px; }

div.produkt    { position:relative; padding:10px; }
div.pbesch     { position:relative; min-height:100px; float:right; width:600px; }
div.pbild      { position:relative; height:100px; width:100px; }
div.pende      { position:relative; height:20px; clear:both; }
div.ppreis     { position:absolute; bottom:0px; right:0px; }
div.pnr        { position:absolute; bottom:0px; left:0px; }

div.pzurueck   { position:absolute; bottom:0px; right:0px; }
div.pdetails   { position:relative; float:left; }

div.fuss       {  }

div.ende       { clear:both; }

div.fusslinks  { position:relative; width:100%; text-align:center; }

div.menuepunkt        { background:url(bilder/menuepunkt.png) no-repeat; background-position:10px bottom; font-size:large; font-weight:bold; text-decoration:none; width:200px; height:50px; vertical-align:middle; display:table-cell; padding-left:30px; }
div.menuepunkt:hover  { background:url(bilder/menuepunkt_sel.png) no-repeat; background-position:10px bottom; }
div.menuepunkt:focus  { background:url(bilder/menuepunkt_sel.png) no-repeat; background-position:10px bottom; }
div.menuepunkt:active { background:url(bilder/menuepunkt_akt.png) no-repeat; background-position:10px bottom; }
div.menuepunkt_akt    { background:url(bilder/menuepunkt_akt.png) no-repeat; background-position:50px center; font-size:large; font-weight:bold; text-decoration:none; width:200px; height:50px; vertical-align:middle; display:table-cell; padding-left:30px; }

a.menuepunkt { color:black; }

a.bildlink { text-decoration:none; }

a.fuss { position:relative; width:19%; text-align:center; }

.fett { font-weight:bold; }
.kursiv { font-style:italic; }
.unterstrichen { text-decoration:underline; }
.farbe { color:#f03232; }

hr.grosz { height:5px; }