/*

pinx. Buero fuer Mediendesign
fuer praesenz-verlag.de
im 08 2008

*/


/*****************************************************
* Normalisieren
*****************************************************/
body, div, ul, ol, li, h1, h2, h3, h4, h5, h6, form, fieldset, input, p {
margin: 0;
padding: 0;
}

h1, h2, h3, h4, h5, h6 {
font-size: 100%;
}

ul, ol {
list-style: none;
}

table {
border-collapse: collapse;
border-spacing: 0;
}

fieldset, img {
border: none;
}

a:focus {
-moz-outline: 0;
}

a {
text-decoration: none;
}

/******************************
 * Layout
******************************/
body {
color: #333;
background: #fff url(../i/ly/bg-body.png) repeat-x top left;
font: 12px/1.5 Verdana, Arial, Helvetica, sans-serif;
}

#container {
margin: 0 auto;
width: 974px;
text-align: left;
}

#head {
position: relative;
height: 145px;
background: transparent url(../i/ly/bg-head.png) no-repeat 0 124px;
}

#head h1 {
position: absolute;
width: 465px;
height: 89px;
top: 18px;
left: 46px;
background: transparent url(../i/ly/logo.png) no-repeat top left;
text-indent: -99999px;
}

#inhalt {
margin: 20px 0 0 0;
}

#inhaltHSundMS {
margin: 0 0 0 187px;
}

#hauptspalte {
width: 606px;
float: left;
}

#zweispalter {
position: relative;
}

#spalte1 {
width: 293px;
float: left;
}

#spalte2 {
width: 293px;
margin: 0 0 0 313px;
}

#marginalspalte {
margin: 0 0 0 616px;
}

form.suchbox {
position: relative;
width: 170px;
height: 96px;
background: transparent url(../i/ly/bg-suchbox.png) no-repeat top left;
padding: 0 0 25px 0;
}

form.suchbox input.tb {
position: absolute;
top: 10px;
left: 10px;
width: 146px;
border: 0;
text-align: center;
font-size: 13px;
color: #264897
}

form.suchbox input.cb {
position: absolute;
top: 40px;
left: 8px;
}

form.suchbox label {
position: absolute;
top: 37px;
left: 27px;
color: #fff;
}

#footer {
color: #666;
clear: both;
height: 25px;
line-height: 25px;
padding: 0;
border-top: 2px solid #6f89bf;
}

.clear {
clear: both;
}

/******************************
 * Typo
******************************/
h2 {
color: #264897; 
font: 20px/1.3 Times, serif;
margin: 0 0 10px 0;
}

h3 {
color: #264897;
margin: 0 0 5px 0;
}

#marginalspalte h3 {
font-size: 13px;
color: #264897;
border-bottom: 1px solid #264897;
margin: 0 0 10px 0;
padding: 0 0 3px 0;
text-shadow: #bebebe 1px 1px 2px;
}


h4 {
font-size: 12px;
}

p { margin: 0 0 15px 0;}

.trenner {
padding: 0 0 10px 0;
border-bottom: 2px solid #6f89bf;
margin: 0 0 25px 0;
}

p.angemeldet {
font-style: italic;
color: #666;
}

.datum {
font-style: italic;
color: #666;
margin: 0 0 2px 0;
}

p#achtung {
font-style: italic;
color: #666;
height: 38px;
background: transparent url(../i/ly/ausrufezeichen.png) no-repeat top left;
padding: 0 0 0 46px;
}

p#achtungEinzeiler {
font-style: italic;
color: #666;
height: 38px;
line-height: 38px;
background: transparent url(../i/ly/ausrufezeichen.png) no-repeat top left;
padding: 0 0 0 46px;
}

p#ok {
font-style: italic;
color: #666;
height: 38px;
line-height: 38px;
background: transparent url(../i/ly/ok.png) no-repeat top left;
padding: 0 0 0 46px;
}

span.searchpath {
color: #666;
font-size: 11px;
}

#marginalspalte p { margin: 0;}

p.foto {
text-align: right;
font-style: italic;
margin: 0 0 15px 0;
padding: 0 5px 0 0;
}


em {
font-style: italic;
color: #666;
}

/******************************
 * Links
******************************/

#hauptspalte a, #marginalspalte a, #footer a, td a {
color: #de7b00;
}

#marginalspalte a {
background: transparent url(../i/ly/linkpfeil.png) no-repeat 34px 5px;
padding: 0 12px 0 0;
}

#hauptspalte a:hover, #marginalspalte a:hover, #footer a:hover, td a:hover, #hauptspalte a.hi {
color: #264897;
}

a#impressum {margin: 0 0 0 387px;}

/******************************
 * Listen
******************************/
#marginalspalte li {
background: transparent url(../i/ly/dot-linie-blau.png) repeat-x bottom left;
padding: 0 0 10px 0;
margin: 0 0 10px 0;
}

#marginalspalte li.last {
background: none;
margin: 0;
}

/* Bild in Marginalspalte */

#marginalspalte li img {
margin: 10px 0 0 0;
}


/* Adress Listen */
#hauptspalte ul, #hauptspalte ul.adresse {
margin: 0 0 15px 0;
}

#hauptspalte ul.adresse li {
margin: 0 0 2px 0;
padding: 0;
background: none;
}

.adresse {
margin: 0 0 2px 0;
padding: 0;
background: none;
}

#hauptspalte ul li {
margin: 0 0 2px 0;
background: transparent url(../i/ly/bullet.png) no-repeat 0 6px;
padding: 0 0 0 11px;
}

#hauptspalte ul.kurzinfo li, #hauptspalte form li, #hauptspalte td li, #hauptspalte div.vita li, #hauptspalte #beschreibung li, #hauptspalte ul.presse li.bild, #hauptspalte ul.presse li.text, #hauptspalte div.order ul li {
background: none;
padding: 0;
}


/******************************
 * Bilder Content
******************************/
#hauptspalte img {
padding: 1px;
border: 1px solid #ccc;
margin: 0 0 20px 0;
}

#hauptspalte img.bildunterschrift {
padding: 1px;
border: 1px solid #ccc;
margin: 0 0 5px 0;
}


/******************************
 * Slideshow Content
******************************/
#hauptspalte #flash {
padding: 1px;
border: 1px solid #ccc;
margin: 0 0 15px 0;
}


/******************************
 * Mitarbeiter / Autoren
******************************/
#hauptspalte .mitarbeiter {
position: relative;
width: 580px;
height: 154px;
background: #f1f1f1;
border: 1px solid #C5C5C5;
margin: 0 0 20px 0;
}

#hauptspalte .vita {
margin: 0 0 40px 0;
}


#hauptspalte .mitarbeiter img.bildMa {
position: absolute;
top: 15px;
left: 15px;
padding: 1px;
border: 1px solid #ccc;
}

#hauptspalte .mitarbeiter ul.kurzinfo {
position: absolute;
top: 15px;
left: 154px;
}


/******************************
 * Tabellen Uebersicht
******************************/
#uebersicht {
position: relative;
height: 28px;
color: #333;
padding: 0 0 0 10px;
font: normal 14px/28px Verdana;
background: transparent url(../i/ly/bg-tabelle-uebersicht.png) no-repeat 0 0;
}

#uebersicht a {
color: #333;
font-size: 12px;
position: absolute;
top: 0;
left: 495px;
line-height: 28px;
height: 28px;
background: transparent url(../i/ly/cart.png) no-repeat 75px 0;
padding: 0 40px 0 0;
overflow: hidden;
}

#uebersicht a.cartNotEmpty {
background: transparent url(../i/ly/cart.png) no-repeat 75px -28px;
}

#uebersicht a:hover {
color: #264897;
}

table.artikeluebersicht {
width: 606px;
margin: 0 0 25px 0;
}

table.artikeluebersicht td {
border: 1px solid #d5d5d5;
padding: 5px;
vertical-align: top;
text-align: center;
width: 202px;
}

table.uebersicht th {
height: 27px;
color: #333;
padding: 0 0 0 10px;
font: normal 14px/27px Verdana;
background: transparent url(../i/ly/bg-tabelle-uebersicht.png) no-repeat 0 0;
}

th a {
color: #333;
font-size: 12px;
position: absolute;
top: 0;
left: 500px;
line-height: 28px;
}

th a:hover {
color: #264897;
}

table.artikel a.warenkorbklein {
background: transparent url(../i/ly/in-den-korb-klein.png) no-repeat 0 0px;
padding: 0 0 0 20px;
}

table.artikel a.warenkorbklein:hover {
margin: 4px 0 0 0;
background: transparent url(../i/ly/in-den-korb-klein.png) no-repeat 0 -15px;
padding: 0 0 0 20px;
}

table.artikel td {
border: none;
text-align: center;
vertical-align: top;
padding: 10px 0 10px 0;
}

table.artikel td.artikelimage {
height: 160px;
}

#hauptspalte table.artikel td.artikelimage img {
padding: 0;
margin: 0;
border: none;
}

table.artikel li {
margin: 0 0 3px 0;
background: none;
}

p.paging {
text-align: center;
margin: 0 0 25px 0;
}

p.paging span {
color: #3656AB;
}

/******************************
 * Bestseller
******************************/
#bestseller {
width: 606px;
height: 177px;
position: relative;
margin: 0 0 25px 0;
}

#bestseller h3 {
position: absolute;
top: 0;
left: 0;
width: 606px;
height: 28px;
color: #333;
background: transparent url(../i/ly/bg-tabelle-bestseller.png) no-repeat top left;
padding: 0 0 0 10px;
margin: 0;
font: normal 14px/28px Verdana;
}

#bestseller div {
position: absolute;
top: 28px;
height: 150px;
width: 200px;
border-bottom: 1px solid #d5d5d5;
border-left: 1px solid #d5d5d5;
text-align: center;
}

#bs01 {left: 0;}
#bs02 {left: 202px;}
#bs03 {left: 404px; border-right: 1px solid #d5d5d5;}

#bestseller div p {
margin: 5px 0 5px 0;
width: 180px;
line-height: 16px;
}

#hauptspalte #bestseller img {
margin: 0;
padding: 0;
border: none;
}

/******************************
 * Artikeldetailansicht
******************************/
#detailansicht {
position: relative;
margin: 0 0 25px 0;
}

#artikelname {
position: relative;
height: 28px;
color: #333;
padding: 0 0 0 10px;
font: normal 14px/28px Verdana;
background: transparent url(../i/ly/bg-tabelle-uebersicht.png) no-repeat 0 0;
}

#artikelname a {
color: #333;
font-size: 12px;
position: absolute;
top: 0;
left: 495px;
line-height: 28px;
height: 28px;
background: transparent url(../i/ly/cart.png) no-repeat 75px 0;
padding: 0 40px 0 0;
overflow: hidden;
}

#artikelname a.cartNotEmpty {
background: transparent url(../i/ly/cart.png) no-repeat 75px -28px;
}

#artikelname a:hover {
color: #264897;
}

#artikeldetails {
position: relative;
height: 310px;
border-bottom: 1px solid #d5d5d5;
border-left: 1px solid #d5d5d5;
border-right: 1px solid #d5d5d5;
background: transparent url(../i/ly/bg-artikeldetail.png) repeat-y top left;
}

#hauptspalte #detailansicht img {
margin: 0;
padding: 0;
border: none;
}

img#bildansicht {
position: absolute;
top: 21px;
left: 32px;
}

p#weitereAnsichten {
position: absolute;
top: 16px;
left: 280px;
}

div.artikelthumb {
position: absolute;
left: 280px;
}

#at01 {top: 38px; }
#at02 {top: 122px; }
#at03 {top: 206px; }

div.artikelthumb a {
display: block;
border: 1px solid #d5d5d5;
width: 80px;
height: 80px;
}

div.artikelthumb a:hover {
border: 1px solid #b1b1b1;
}

#artikeldetails p#preis {
position: absolute;
top: 21px;
left: 420px;
}

#artikeldetails div#success {
position: absolute;
top: 210px;
left: 420px;
color: #3656AB;
background: transparent url(../i/ly/haken.png) no-repeat top left;
padding: 0 0 0 28px;
}

#artikeldetails a.hinzufuegen {
position: absolute;
top: 257px;
left: 415px;
background: transparent url(../i/ly/hinzufuegen.png) no-repeat 0 0;
display: block;
width: 177px;
height: 30px;
text-indent: -99999px;
}

#artikeldetails a.hinzufuegen:hover {
background: transparent url(../i/ly/hinzufuegen.png) no-repeat 0 -30px;
}

#beschreibung {
position: relative;
border: 1px solid #d5d5d5;
padding: 10px;
margin: 0 0 25px 0;
}

#beschreibung h3 {
color: #264897;
margin: 0 0 5px 0;
font-size: 14px;
font-weight: normal;
}


#beschreibung p {
width: 385px;
}

#beschreibung ul {
position: absolute;
width: 177px;
top: 35px;
left: 415px;
}

/******************************
 * Warenkorb
******************************/
#warenkorb {
margin: 25px 0 0 0;
}

#warenkorb table {
position: relative;
margin: 0 0 25px 0;
width: 606px;
font: normal 12px/12px Verdana, Arial, sans-serif;
}

#warenkorb table td, #warenkorb table th  {
border: 1px solid #d5d5d5;
padding: 5px;
vertical-align: top;
}

#warenkorb table th {
font-weight: normal;
background: #f1f1f1;
}

#warenkorb table.summe {
width: 250px;
margin: 0;
}

#warenkorb table.summe td {
text-align: right;
border: none;
}

th.anzahl {width: 80px;}
th.einzelpreis {width: 80px; }
th.summe {width: 80px; }

#warenkorb h3 {
height: 27px;
color: #333;
padding: 0 0 0 10px;
margin: 0;
font: normal 14px/27px Verdana;
background: transparent url(../i/ly/bg-tabelle-bestseller.png) no-repeat 0 0;
}

#warenkorb h4 {
margin: 0 0 5px 0;
font: normal 12px Verdana;
}

#warenkorb th a {
color: #333;
font-size: 12px;
position: absolute;
top: 0;
left: 500px;
line-height: 28px;
}

#warenkorb th a:hover {
color: #264897;
}

#hauptspalte #warenkorb table img {
padding: 0;
margin: 0;
border: none;
}

#warenkorb ul {
position: relative;
}

#warenkorb ul li {
position: absolute;
top: 0px;
}


li#loeschen {left: 40px;}

input.anzahl {
border: 1px solid #ababab;
width: 32px;
height: 15px;
color: #3656AB;
}

.loeschen {
background: transparent url(../i/ly/cart-controls.png) no-repeat 0 -29px;
text-indent: -99999px;
display: block;
width: 15px;
height: 17px;
overflow: hidden;
}

a.loeschen:hover {background: transparent url(../i/ly/cart-controls.png) no-repeat -15px -29px;}

#buttons {
position: relative;
height: 30px;
margin: 0 0 25px 0;
}

#aktualisieren {
position: absolute;
top: 0;
left: 230px;
width: 177px;
height: 30px;
}

.cartAktualisieren {
background: transparent url(../i/ly/cartAktualisieren.png) no-repeat 0 0px;
text-indent: -99999px;
display: block;
width: 177px;
height: 30px;
overflow: hidden;
}

.cartAktualisieren:hover {
background: transparent url(../i/ly/cartAktualisieren.png) no-repeat 0 -30px;
}

#kasse {
position: absolute;
top: 0;
left: 420px;
width: 177px;
height: 30px;
}

a.kasse {
display: block;
width: 177px;
height: 30px;
overflow: hidden;
text-indent: -99999px;
background: transparent url(../i/ly/kasse.png) no-repeat 0 0;
}

a.kasse:hover {
background: transparent url(../i/ly/kasse.png) no-repeat 0 -30px;
}

#hinweis {
padding: 0 0 0 0px; 
margin: 0 0 25px 0;
background: transparent url(../i/ly/hinweis.png) no-repeat 420px 3px;
height: 33px;
overflow: hidden;
}

/******************************
 * Formulare
******************************/
.content {
margin: 0 0 25px 0;
}

.content fieldset {
margin: 0;
padding: 0;
}

.content label {
display: block;
float: left;
width: 120px;
line-height: 20px;
}

.content input {
border: 1px solid #d5d5d5;
height: 16px;
width: 200px;
}

.content input.check {
width: auto;
border: none;
}

.content select {
width: 200px;
}

.content textarea {
width: 200px;
height: 80px;
}

.content input.einloggen, .content input.bestellen, .content input.aktualisieren, .content input.absenden {
width: 177px;
height: 30px;
border: none;
}

.content input.einloggen {background: transparent url(../i/ly/einloggen.png) no-repeat 0 0;}
.content input.bestellen {background: transparent url(../i/ly/bestellen.png) no-repeat 0 0;}
.content input.aktualisieren {background: transparent url(../i/ly/aktualisieren.png) no-repeat 0 0;}
.content input.absenden {background: transparent url(../i/ly/absenden.png) no-repeat 0 0;}


.content input.einloggen:hover {background: transparent url(../i/ly/einloggen.png) no-repeat 0 -30px;}
.content input.bestellen:hover {background: transparent url(../i/ly/bestellen.png) no-repeat 0 -30px;}
.content input.aktualisieren:hover {background: transparent url(../i/ly/aktualisieren.png) no-repeat 0 -30px;}
.content input.absenden:hover {background: transparent url(../i/ly/absenden.png) no-repeat 0 -30px;}

.content ul {
margin: 15px 0 0 0;
}

#hauptspalte .content ul li {
background: none;
margin: 0 0 10px 0;
}

span {
color: #de7b00;
}

#hauptspalte .content li#lieferadresseHeadline {
margin: 25px 0 0 0;
}

/******************************
 * Mein Konto
******************************/
div.order {
border: 1px solid #ababab;
margin: 0 0 15px 0;
padding: 5px;
background: #f1f1f1;
}


/******************************
 * Thumbnails Fotos
******************************/

ul.presse {
position: relative;
border: 1px solid #ccc;
background: #f1f1f1;
margin: 0 0 15px 0;
height: 175px;
width: 590px;
}

ul.presse li {
background: none;
padding: 0;
}

ul.presse li.bild {
position: absolute;
width: 225px;
height: 150px;
top: 10px;
left: 10px;
text-align: right;
}

ul.presse li.text {
position: absolute;
width: 320px;
top: 10px;
left: 250px;
}

ul.presse li.bild img {
margin: 0;
padding: 2px;
background: #fff;
}

/******************************
 * Obere Navigation
******************************/
#head ul {
position: absolute;
top: 124px;
height: 20px;
}

#head li {
position: absolute;
line-height: 21px;
text-align: center;
background: transparent url(../i/ly/buttons-oben-bg.png) no-repeat top left;
}


li#leseprobe {left: 640px; width: 84px;}
li#konto {left: 724px; width: 84px;}
li#magazin {left: 808px; width: 76px;}
li#links {left: 882px; width: 46px;}
li#agb {left: 928px; width: 46px; background: transparent url(../i/ly/buttons-oben-links-bg.png) no-repeat top left;}

/* ALT */
li#kontakt {left: 762px; width: 62px;}
li#presse {left: 826px; width: 56px;}

#head li a {
display: block;
color: #19418C;
text-decoration: none;
}

#head li a:hover, #head li a.hi {
color: #fff;
text-decoration: none;
}

/******************************
 * Hauptnavigation
******************************/
#navlinks {
width: 177px;
float: left;
}

#navlinks a {
width: 177px;
display: block;
height: 20px;
color: #333;
background: transparent url(../i/ly/subnav1-bg.png) no-repeat 1px 0px;
padding: 0 0 0 28px;
text-decoration: none;
voice-family: "\"}\"";
voice-family: inherit;
width: 149px;
}

#navlinks a:hover, #navlinks a.hi  {
color: #3656AB;
background: transparent url(../i/ly/subnav1-bg-hi.png) no-repeat 1px 0px;
}

#navlinks a.sub {
color: #3656AB;
background: transparent url(../i/ly/subnav2-bg.png) no-repeat 1px 0px;
}

#navlinks a.sub:hover, #navlinks a.subhi:hover, #navlinks a.subhi {
color: #3656AB;
background: transparent url(../i/ly/subnav2-bg-hi.png) no-repeat 1px 0px;
}


#navlinks a.subsub {
color: #5b8ef1;
background: transparent url(../i/ly/subnav3-bg.png) no-repeat 1px 0px;
}

#navlinks a.subsubhi, #navlinks a.subsub:hover {
color: #5b8ef1;
background: transparent url(../i/ly/subnav3-bg-hi.png) no-repeat 1px 0px;
}

a#shop {height: 31px; background: transparent url(../i/ly/b-shop.png) no-repeat 0 0; text-indent: -99999px; overflow: hidden;}
a#shop.hi, a#shop.hi:hover {background: transparent url(../i/ly/b-shop.png) no-repeat 0 -62px;}
a#shop:hover {background: transparent url(../i/ly/b-shop.png) no-repeat 0 -31px;}

a#verlag {height: 31px; background: transparent url(../i/ly/b-verlag.png) no-repeat 0 0; text-indent: -99999px; overflow: hidden;}
a#verlag.hi, a#verlag.hi:hover {background: transparent url(../i/ly/b-verlag.png) no-repeat 0 -31px;}
a#verlag:hover {background: transparent url(../i/ly/b-verlag.png) no-repeat 0 -31px;}

a#galerie {height: 31px; background: transparent url(../i/ly/b-galerie.png) no-repeat 0 0; text-indent: -99999px; overflow: hidden;}
a#galerie.hi, a#galerie.hi:hover {background: transparent url(../i/ly/b-galerie.png) no-repeat 0 -31px;}
a#galerie:hover {background: transparent url(../i/ly/b-galerie.png) no-repeat 0 -31px;}

a#buchhandlung {height: 31px; background: transparent url(../i/ly/b-buchhandlung.png) no-repeat 0 0; text-indent: -99999px; overflow: hidden;}
a#buchhandlung.hi, a#buchhandlung.hi:hover {background: transparent url(../i/ly/b-buchhandlung.png) no-repeat 0 -31px;}
a#buchhandlung:hover {background: transparent url(../i/ly/b-buchhandlung.png) no-repeat 0 -31px;}

a#medien {height: 31px; background: transparent url(../i/ly/b-medien.png) no-repeat 0 0; text-indent: -99999px; overflow: hidden;}
a#medien.hi, a#medien.hi:hover {background: transparent url(../i/ly/b-medien.png) no-repeat 0 -62px;}
a#medien:hover {background: transparent url(../i/ly/b-medien.png) no-repeat 0 -31px;}

a#schreibkultur {height: 31px; background: transparent url(../i/ly/b-schreibkultur.png) no-repeat 0 0; text-indent: -99999px; overflow: hidden;}
a#schreibkultur.hi, a#schreibkultur.hi:hover {background: transparent url(../i/ly/b-schreibkultur.png) no-repeat 0 -62px;}
a#schreibkultur:hover {background: transparent url(../i/ly/b-schreibkultur.png) no-repeat 0 -31px;}

a#betrachtungen {height: 31px; background: transparent url(../i/ly/b-betrachtungen.png) no-repeat 0 0; text-indent: -99999px; overflow: hidden;}
a#betrachtungen.hi, a#betrachtungen.hi:hover {background: transparent url(../i/ly/b-betrachtungen.png) no-repeat 0 -62px;}
a#betrachtungen:hover {background: transparent url(../i/ly/b-betrachtungen.png) no-repeat 0 -31px;}

a#gnadenthal {height: 31px; background: transparent url(../i/ly/b-gnadenthal.png) no-repeat 0 0; text-indent: -99999px; overflow: hidden;}
a#gnadenthal.hi, a#gnadenthal.hi:hover {background: transparent url(../i/ly/b-gnadenthal.png) no-repeat 0 -31px;}
a#gnadenthal:hover {background: transparent url(../i/ly/b-gnadenthal.png) no-repeat 0 -31px;}

/* ERWEITERUNG PRESSE KONTAKT */
a#presse {height: 31px; background: transparent url(../i/ly/b-presse.png) no-repeat 0 0; text-indent: -99999px; overflow: hidden;}
a#presse.hi, a#presse.hi:hover {background: transparent url(../i/ly/b-presse.png) no-repeat 0 -31px;}
a#presse:hover {background: transparent url(../i/ly/b-presse.png) no-repeat 0 -31px;}

a#kontakt {height: 31px; background: transparent url(../i/ly/b-kontakt.png) no-repeat 0 0; text-indent: -99999px; overflow: hidden;}
a#kontakt.hi, a#kontakt.hi:hover {background: transparent url(../i/ly/b-kontakt.png) no-repeat 0 -31px;}
a#kontakt:hover {background: transparent url(../i/ly/b-kontakt.png) no-repeat 0 -31px;}