/*

---------------------------------------------------------------------------------------------------

STYLES.CSS

Last Edit: 19.10.2012 |  DR

---------------------------------------------------------------------------------------------------

*/

html { background: #d9d9d9; }

body { background: #fff; font: normal 13px/1.4 Arial, "Helvetica Neue", Helvetica, sans-serif; color: #333; width: 900px; margin: 0 auto; box-shadow: 0 0 7px rgba(0,0,0,0.3); }

h1, h2, h3, h4, h5, h6, p, small, blockquote, ul, ol, dl, pre, address, table, form, hr, audio, video { margin-bottom: 10px; }


/* Typo ------------------- */

h1 { font-size: 18px; line-height: 1.4; margin-bottom: 6px; }
h2 { font-size: 18px; line-height: 1.4; margin-bottom: 0.33em; }
h3 { font-size: 14px; margin-bottom: 6px }
h4 { font-size: 14px; margin-bottom: 6px }
h5 { font-size: 1em; }
h6 { font-size: 1em; }

h2.bluebg { font-size: 14px; background: #D9E4EC; margin-bottom: 10px; padding: 5px; }

::-webkit-selection { background: #002d4f; color: #fff; }
::-moz-selection { background: #002d4f; color: #fff; }
::selection { background: #002d4f; color: #fff; }


/* Links ------------------- */

a { color: #369; text-decoration: none; }
a:visited { color: #369; text-decoration: none; }
a:hover { color: #369; text-decoration: underline; }
a:active { color: #369; text-decoration: underline; }

a.more, .sidebarnormtext a { background: url(../images/icons/arrow-blue.png) no-repeat 0 3px; font-weight: bold; padding-left: 15px; }
.sidebarnormtext a.imagelink { background: none; padding-left: 0; }
a.more.back { background: url(../images/icons/arrow-blue-back.png) no-repeat 100% 3px; font-weight: bold; padding-right: 15px; }
a.print { background: url(../images/bg/bg-printer.gif) no-repeat 0 0; padding: 1px 0 1px 22px; }
small a.delete { background: url(../images/bg/bg-cross.gif) no-repeat 9px 5px #EFF3F7; display: inline-block; margin-top: 3px; padding: 1px 10px 1px 21px; border-radius: 20px; }
a[href="#home"], a.anker { background: #ECF1F5 url(../images/icons/top.png) no-repeat 7px; display: inline-block; border: 1px solid #c0c7cc; border-radius: 3px; margin: 0 0 30px; padding: 3px 7px 2px 19px; }
a[href="#home"]:hover, a.anker:hover { background-color: #d9e4ec; text-decoration: none; }


/* Forms ------------------- */

form {  }
fieldset {  }
legend {  }
label {  }
textarea { resize: none; }
input[type=text], input[type=password], input[type=search], input[type=email], input[type=url], input[type=tel], textarea { width: 100%; padding: 4px; }
input[type=text]:focus, input[type=password]:focus, input[type=search]:focus, input[type=email]:focus, input[type=url]:focus, input[type=tel]:focus, textarea:focus {  }

button, .btn { text-indent: -9999px; border: 0 none; margin: 0; padding: 0; }

::-webkit-input-placeholder { color: #999; }
:-moz-placeholder { color: #999; }


/* Error Styling */

label.error { font-weight: bold; color: #c00; }
input.error, textarea.error { border-color: #c00; }

.error::-webkit-input-placeholder { color: #c00; }
.error:-moz-placeholder { color: #c00; }


/* Tables ------------------- */

th, td { padding: 4px 10px; }
th { background: #333; color: #fff; }
tr:nth-child(even) td { background: url(../images/bg/black-10.png); }


/* Images ------------------- */

figure {  }
figcaption { font-size: 11px; }

.pdf_file { background: url(../images/icons/pdf.png) no-repeat 0 0px; padding: 1px 0 1px 20px; white-space: nowrap; }
.zip_file { background: url(../images/icons/zip.png) no-repeat 0 0px; padding: 1px 0 1px 20px; white-space: nowrap; }
.document_file { background: url(../images/icons/doc.png) no-repeat 0 0px; padding: 1px 0 1px 20px; white-space: nowrap; }
.right p { text-align: right; }
.right p.lefttext { text-align:left; }


/* Colors ------------------- */

.red { color: #c00; }



/*  B O D Y
--------------------------------------------------------------------------------------------------- */

hr { background: url(../images/bg/dotted-line.png) repeat-x; display: block; height: 1px; border: 0 none; margin: 10px 0; padding: 0; }
.ie7 hr { background-image: url(../images/bg/dotted-line-ie7.png) repeat-x; height: 4px; zoom: 25%; }


/*  H E A D E R
--------------------------------------------------------------------------------------------------- */

#pagehead { background: url(../images/bg/header.jpg) no-repeat; border-bottom: 1px solid #000; padding: 7px 10px 20px; }

#pagehead li { background: url(../images/icons/pagehead-nav.png) no-repeat 0 50%; color: #c6dcec; display: inline; margin-right: 5px; padding-left: 8px }
#pagehead ul li:first-of-type { background: none; padding-left: 0 }

#pagehead nav a { color: #c6dcec; }
#pagehead nav a:hover { color: #fff; text-decoration: none; }

a#logo { float: left; width: 365px; height: 28px; margin-top: 30px }
a#logo img {  }

#searchform { float: right; width: 270px; margin: 35px 0 0; position:relative; }
#searchform input { float: left; width: 236px; height: 23px; border: 0 none; padding: 0 5px; }
.ie7 #searchform input { width: 226px; height: 23px; }
#searchform button { background: url(../images/btn/search.png); float: left; width: 34px; height: 23px; }
#searchform button:hover { background-position: 0 -23px; }
#searchform button:active { background-position: 0 -46px; }

#autocomplete { position:absolute; top:24px; left:0px; background:#FFF; z-index:1000; width:271px; box-shadow: 0 2px 1px rgba(0, 0, 0, .5) }
#autocomplete a { display:block; float:none; padding:7px 10px 6px; text-transform: none; background: url(http://www.hanser-fachbuch.de/images/bg/dotted-line.png) repeat-x 0 0; }
#autocomplete a:hover,
#autocomplete a.active { background-color:#dae5ed; text-decoration: none; }
#autocomplete a:first-child { background-image:none; }


.highlight{ background-color: yellow; }

/*  N A V
--------------------------------------------------------------------------------------------------- */

#mainnav { background: #eef2f6 url(../images/bg/mainnav.png) repeat-x 0 100%; position: relative; }
#mainnav ul { font-weight: bold; float: left; padding: 0 10px; }
#mainnav li { display: inline; float: left }
#mainnav li a { color: #002d4f; text-transform: uppercase; float: left; padding: 8px 10px; text-shadow: 0 1px 0 #fff; }
#mainnav li:first-of-type a { padding: 8px 0; margin-right: 10px; }
#mainnav li a:hover, #mainnav li.current a { background: url(../images/bg/mainnav-marker.png) no-repeat 50% 100%; text-decoration: none; }

#mainnav a#shoppingcart { background: url(../images/icons/shoppingcart.png) no-repeat 0 50%; font-weight: bold; font-size: 11px; color: #002d4f; text-decoration: none; float: right; margin: 1px 10px 0 0; padding: 9px 0 8px 21px; text-shadow: 0 1px 0 #fff; }
#mainnav a#shoppingcart span { background: #fff; margin-left: 2px; padding: 2px 10px; border-radius: 10px; }

#mainnav ul.secondlevel { background: url(../images/bg/subnav.png) repeat-x 0 100% !important; font-weight: normal; font-size: 12px; float: none; clear: both; width: 880px; position: absolute; top: 34px; left: 0; margin: 0; padding: 0 10px; }
#mainnav ul.secondlevel li { display: inline; }
#mainnav ul.secondlevel li a { background: url(../images/icons/pagehead-nav.png) no-repeat 0 16px; color: #369; text-transform: none !important; margin-right: 11px; padding-bottom: 13px; padding-left: 12px; padding-right: 0; }
#mainnav ul.secondlevel li a:hover { text-decoration: underline; }
#mainnav ul.secondlevel li.current a { color: #555; font-weight: bold; text-decoration: none; cursor: default; }
#mainnav ul.secondlevel li:first-child a { background: none; padding-left: 0; }

#mainnav ul.secondlevel { top: -9999px; }
body:not(#home) #mainnav li.current ul.secondlevel { display: block !important; top: 34px; z-index: 1; }
#mainnav li:hover ul.secondlevel { display: block !important; z-index: 100; top: 34px; }
#mainnav li:hover > a { background: url(../images/bg/mainnav-marker.png) no-repeat 50% 100%; }

.navebookshop {  background: url(../images/bg/bg-ebooknav.gif) no-repeat 0 50%; margin-left: 10px; }
.navebookshop a { padding-left: 18px !important; }


/*  M A I N
--------------------------------------------------------------------------------------------------- */

#main { padding: 44px 10px 12px 10px; }
body#home #main { padding-top: 12px; }


/* Content ------------------- */

#content { float: left; width: 590px; margin-bottom: 10px; }

#content img.left { margin: 0 15px 15px 0; }
#content img.right { margin: 0 0 15px 15px; }
#content img.imgClassforSubtitle { margin-bottom: 8px; }

.breadcrumb { background: url(../images/bg/dotted-line.png) repeat-x 0 100%; font-size: 11px; margin-bottom: 10px; padding-bottom: 8px; }


/* Slider ------------------- */

#slider { margin-bottom: 10px; position: relative; }
#slides { width: 590px; height: 220px; overflow: hidden; }
.slide { display: none; }
.slide.dark { color: #fff; }
.slide.light { color: #333; }
.slidetext { font-size: 14px; position: absolute; top: 40px; left: 20px; width: 380px; height: 140px; z-index: 2 }

.slide .author { font-size: 12px; margin-bottom: 3px; }
.slide .title { margin-bottom: 4px; }

#slider a.more { background: url(../images/icons/arrow-white.png) no-repeat 0 3px; color: #fff; margin-left: 5px; padding-left: 14px; }

#slider nav { overflow: hidden; position: absolute; bottom: 25px; left: 20px; z-index: 999; margin: 0 }
#slider nav a { background: url(../images/icons/slider-nav.png); float: left; width: 11px; height: 11px; text-indent: -9999px; margin-right: 4px; }
#slider nav a.activeSlide { background-position: 0 -11px; }

.slidercoverlink { position: absolute; background: transparent; top: 0; right: 0; width: 590px; height: 220px; text-indent: -9999px; z-index: 10; }
.ie7 .slidercoverlink { background: #fff; filter: alpha(opacity=0); }
.ie8 .slidercoverlink { background: #fff; -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; }




/* Books ------------------- */

.bookbox { background: url(../images/bg/dotted-line.png) repeat-x 0 100%; position: relative; overflow: hidden; margin-bottom: 10px; padding: 5px 0; }
.bookbox.small, .bookbox.pic { background: url(../images/bg/dotted-line.png) repeat-x 0 0; float: left; width: 285px; min-height: 240px; margin-left: 20px; padding: 10px 0 0; }

.bookbox.pic { position: relative; padding: 15px 0 5px }
.bookbox:nth-of-type(2n) { clear: both; margin-left: 0; }
.bookbox.small header { padding-bottom: 10px; }
.bookbox > div, .bookbox header + a + p { overflow: hidden; }

.bookbox h2, .bookbox p { margin-bottom: 2px; }

.noslider .bookbox.small, .noslider .bookbox.pic { background: none; margin-left: 0 !important; }
.noslider .bookbox.small:nth-of-type(2n) { margin-left: 20px !important; }
.noslider .bookbox.small:nth-of-type(n+3) { background: url(../images/bg/dotted-line.png) repeat-x 0 0 !important; }


/* Meta */

.bookbox .cat { background: url(../images/icons/arrow-orange.png) no-repeat 0 4px; font-weight: bold; font-size: 12px; color: #e67300; margin-bottom: 2px; padding-left: 14px; }
.bookbox .cat a { color: #e67300; text-decoration: none; }
.author { font-size: 11px; padding-right: 80px; }
.bookbox.small .author, aside .bookbox .author { padding-right: 0; }
.bookbox h2.title { font-size: 16px; line-height: 1.2; padding-right: 70px; }
.bookbox.small h2.title { padding-right: 0; }
.bookbox h2.title a { text-decoration: none; }

/* Cover */

.bookbox img { background: url(../images/no-cover-small.jpg) no-repeat 50%; float: left; width: 60px; min-height: 51px; margin: 0 15px 15px 0; }
.bookbox img.cover.xs { width: 60px; height: auto; }
.bookbox.small img { margin-right: 10px; }

.bookbox.pic .text { background: url(../images/alpha/white-80.png); width: 245px; position: absolute; bottom: 0; left: 0; z-index: 5; padding: 20px 20px 15px; }
.bookbox.pic .text h2 { font-size: 18px; }
.bookbox.pic .text a.more { display: block; overflow: hidden; }
.bookbox.pic img { width: 100%; box-shadow: none; margin: 0; position: absolute; top: 15px; left: 0; }

/* Normblock */
#content .normblock { overflow: hidden; }
#content .normblock div.right,
#content .normblock div.left { max-width: 33.33334%; }
#content .normblock div.left { margin: 0 10px 0 0; }
#content .normblock div.right { margin: 0 0 0 10px; }
#content .normblock div.right img,
#content .normblock div.left img { max-width: 100%; height: auto; }
#content .normblock div.right img + p,
#content .normblock div.left img + p { clear: both; font-size: 11px; color: #808080; margin-bottom: 16px; }

/* Buy */

.buy { font-weight: bold; overflow: hidden; margin-bottom: 7px !important; padding-top: 5px; padding-right: 10px; }
.bookbox.small .buy { clear: both; margin-bottom: 2px; padding-top: 0; }
a.cart { background: url(../images/icons/shoppingcart-grau.png) no-repeat 0 50%; padding: 1px 0 1px 21px; font-weight: bold; }
a.removeBasket { color: #390; }

/* Erscheinungsdatum */

.due { font-style: italic; color: #999; }
#content .due { position: absolute; top: 5px; right: 10px; }


/* Pagination */

.pagination { background: url(../images/bg/dotted-line.png) repeat-x 0 100%; font-size: 12px; overflow: hidden; margin-bottom: 10px; padding-bottom: 10px; }
.bookbox + .pagination { background: none; padding-bottom: 0; }
.pagination > span.left { padding: 4px 0 0; }
.pagination > span.right > * { text-align: center; float: left; margin-left: 3px; padding: 3px 0 2px; }
.pagination a { width: 20px; border: 1px solid #ccc; }
.pagination a:hover { background: #002d4f; font-weight: bold; color: #fff; text-decoration: none; border: 1px solid #002d4f; }
.pagination > span > span { width: 24px; }
.pagination .disabled { background: #eee; color: #ccc; width: 20px; border: 1px solid #ccc; }
.pagination .current { background: #e67300 !important; font-weight: bold; color: #FFF; border-color: #e67300 !important; cursor: pointer; }


/* Book Details */

.book { overflow: hidden; margin-bottom: 30px; padding-top: 20px; }
.book h1 { margin-bottom: 0; }
.book-details { float: left; overflow: hidden; max-width: 390px; width: 100%; }
.book figure { float: left; margin: 0 20px; }
.book figure img { background: url(/images/no-cover-big.jpg) 50%; display: block; min-height: 102px; width: 120px;  }
.book figcaption { text-align: center; padding-top: 8px }
.book figcaption a { background: url(../images/icons/zoom.png) 0 2px no-repeat; font-size: 11px; padding-left: 15px;  }
.book .author { margin-bottom: 6px; padding-right: 0; }

.price { float: left; width: 150px; margin-left: 0; padding-left: 0; }
.price ~ .price { background: none; margin-left: 20px; padding-left: 20px; background: url(../images/bg/dotted-line.png) repeat-y 0 0; }
.price em.red { color: #c00; display: block; font-style: normal; padding: 6px 0; }
.price em.red strong { display: block; }
.price em.red span { display: inline; font-size: 11px; }
.price span { font-size: 11px; line-height: 1.3; display: block; }
.price span.light { color: #777; }
.ebookinside { color: #E67300; margin-bottom: 3px; }


/* Tab Box */

.tabbox { background: url(../images/bg/dotted-line.png) repeat-x 0 100%; overflow: hidden; padding-bottom: 10px; margin-bottom: 30px; }
.tabnav { background: url(../images/bg/bg-tabnav-border.gif) repeat-x left bottom; overflow: hidden; margin: 0 0 10px; padding: 0; }
.tabnav li { display: inline; }
.tabnav a { background: #ecf1f5; font-weight: bold; text-decoration: none; display: inline-block; border: 1px solid #d3dbe1; padding: 5px 10px; -moz-border-radius: 3px 3px 0 0; -webkit-border-radius: 3px 3px 0 0; -o-border-radius: 3px 3px 0 0; border-radius: 3px 3px 0 0; }
.tabnav a.selected { background: #002d4f !important; font-weight: bold; color: #fff; cursor: default; border-bottom-color: #002d4f; }
.tabnav a:hover { background: #d9e4ec; }

.tabnav .news a { background: #f8deca; color:#e4731f; }
.tabnav .news a.selected { background: #e4731f !important; color: #fff; border-bottom-color: #e4731f; }
.tabnav .news a:hover { background: #fcc59c; color:#e4731f; }

.tabbox > div .features { border: 1px solid #ddd; overflow: hidden; margin-bottom: 10px; padding: 10px 10px 6px; }
.tabbox > div .features a { float: left; margin: 0 16px 4px 0; }


/* Tab Box Autoren */

#autoren h2 { font-size: 12px; padding-top: 15px; }
#autoren h2:first-of-type { padding-top: 0px; }


/* Tab Box Rezensionen */

#rezensionen h2 { font-size: 12px; }
#rezensionen h3 { margin-top: 20px; }
#rezensionen .bookrating { margin: 0 5px 5px 0; }


/* Filter */

#filter { background: #d9e4ec; font-size: 11px; padding: 10px 15px; margin-bottom: 15px; }
#filter > div { float: left; width: 200px; }
#filter strong, #filter label { display: block; }
#filter label { width: auto; }
#filter strong { margin-bottom: 4px; }
#filter select { width: 190px; }
.ie7 #filter select { margin-bottom: 10px; }

#filter button { background: url(../images/btn/search-books.png); float: left; width: 110px; height: 27px; margin-top: 20px; }
#filter button:hover { background-position: 0 -27px; }
#filter button:active { background-position: 0 -54px; }


/* Suche */

#categorysearch { background: url("../images/bg/dotted-line.png") repeat-x scroll 0 100% transparent; margin: 0 0 15px; padding: 0 20px 15px; }


/* Bottom ------------------- */

#bottom { background: #eff3f7; font-size: 11px; clear: both; margin-bottom: 10px; padding: 10px; }
#bottom > div { float: left; width: 23%; padding-right: 2%; }
#bottom > div a { background: url(../images/icons/bullet.png) no-repeat 0 4px; display: block; padding-left: 10px; }


/* Contact ------------------- */

#contact { text-align: center; border: 1px solid #ccc; border-width: 1px 0; padding: 20px 10px 10px; }
#contact span { margin: 0 5px; }
#contact-submit { background: url(../images/btn/send.png); text-indent: -9999px; display: block; width: 149px; height: 27px; margin: 0 0 30px 160px; }
#contact-submit:hover { background-position: 0 -27px; }
#contact-submit:active { background-position: 0 -54px; position: relative; top: 1px; }

#button-submit {
    font-size: 14px;
    color: #fff;
    font-weight: bold;
    text-indent: 0;
    display: inline-block;
    height: 27px;
    margin: 10px 0 30px 160px;
    background: #e67300;
    padding: 5px;
}

form input.formerror {
    border-color: #c00!important;
}

.stillshow {
    display: block!important;
}

/* Management Letter ------------------- */

.nl_management label { width: auto; margin-left: 160px; }
#management-submit { background: url(../images/btn/order-nl.png); text-indent: -9999px; display: block; width: 165px; height: 27px; margin: 0 0 30px 160px; }
#management-submit:hover { background-position: 0 -27px; }
#management-submit:active { background-position: 0 -54px; }


/* Sidebar ------------------- */

aside { background: #dae5ed url(../images/bg/aside.png) repeat-x 0 100%; font-size: 12px; float: right; width: 260px; margin-bottom: 10px; padding: 0 10px 10px; }

aside > section { background: #fff; overflow: hidden; margin-top: 10px; padding: 10px 10px 5px; }

aside h3 { background: url(../images/bg/dotted-line.png) repeat-x 0 100%; font-size: 14px; margin-bottom: 10px; padding-bottom: 6px; }
aside a.more { background-position: 0 2px; }

aside a.ad img { display: block; margin: 0 auto 5px; }

aside ul { list-style: none; margin: 0 0 10px; padding: 0; }

aside .bookbox { background-position: 0 100%; float: none; width: auto; height: auto; overflow: hidden; margin: 0 0 10px 0; padding: 0 0 10px 0; }
aside .bookbox img { width: 60px; height: auto; margin: 0 10px 0 0; }
aside .bookbox h4, aside .bookbox p, aside .bookbox a { font-size: 12px !important; margin: 0 !important; }
aside .bookbox .title { padding-right: 0 !important; }


/* Services */

ul#services li { margin-bottom: 6px; }
ul#services a { background-repeat: no-repeat; background-position: 0 50%; padding: 2px 0 2px 20px; }
ul#services li.news a { background-image: url(../images/icons/news.png) }
ul#services li.youtube a { background-image: url(../images/icons/youtube.png) }
ul#services li.newsletter a { background-image: url(../images/icons/newsletter.png) }
ul#services li.dozenten a { background-image: url(../images/icons/dozent.png); background-position: 0 20%; }
ul#services li.rss2 a { background-image: url(../images/icons/rss2.png); background-position: 0 20%; }
ul#services li.elearning a { background-image: url(../images/icons/elearning.png); background-position: 0 20%; }


/* Themen */

ul#themen li { background: url(../images/bg/dotted-line.png) repeat-x 0 100%; padding-bottom: 10px; margin-bottom: 10px; }
ul#themen li:last-of-type { background: none; padding-bottom: 0; margin-bottom: 0; }
ul#themen li a { background-repeat: no-repeat; background-position: 0 50%; color: #333; text-decoration: none; display: block; height: 66px; padding-left: 76px; }
ul#themen li.computer a { background-image: url(../images/icons/computer.png) }
ul#themen li.wirtschaft a { background-image: url(../images/icons/wirtschaft.png) }
ul#themen li.technik a { background-image: url(../images/icons/technik.png) }
ul#themen li.wissen a { background-image: url(../images/icons/wissen.png) }
ul#themen li.ebooks a { background-image: url(../images/icons/ebooks.png) }
ul#themen li a .cat { display: block; }
ul#themen li a strong { background: url(../images/icons/arrow-orange.png) no-repeat 0 4px; font-weight: bold; font-size: 12px; color: #e67300; padding-left: 14px; }

/* Tags */

ul#tags {  }
ul#tags li { display: inline; }
ul#tags a { font-weight: bold; line-height: 22px; text-decoration: none; margin: 0 4px 8px 0; padding: 3px 5px; white-space: nowrap; }
ul#tags a:hover { background: #002d4f; color: #fff; }

ul#tags li.s a { font-size: 11px; }
ul#tags li.m a { font-size: 12px; }
ul#tags li.l a { font-size: 13px; }
ul#tags li.xl a { font-size: 14px; }
ul#tags li.xxl a { font-size: 15px; }


/* News */

.rss { background: url(../images/icons/rss.png) no-repeat 0 50%; text-indent: -9999px; display: inline-block; width: 15px; height: 15px; position: relative; top: 2px; }

.newsline { background: url(../images/bg/dotted-line.png) repeat-x 0 100%; padding: 0 0 6px; margin-bottom: 6px; }
.newsline:last-of-type { background: none; }
.newsline a { background: url(../images/icons/arrow-blue.png) no-repeat 0 3px; font-weight: bold; display: inline-block; padding: 0 0 0 15px; }
.newsline + p:not(.newsline) { padding-top: 15px; }

#content .newsline a.heading { background: none; font-weight: bold; padding: 0; }

.news-element { background: url(../images/bg/dotted-line.png) repeat-x bottom; overflow: hidden; zoom: 1; margin-bottom: 10px; }


/* Events */

.event-element { background: url(../images/bg/dotted-line.png) repeat-x bottom; margin-bottom: 10px; background: #ecf1f5; }
.event-element img { float: left; margin-bottom: 10px; }
.event-element .text { margin-left: 95px; }


/* Videos */

#videos > div { float: left; width: 285px; margin: 0 0 20px 10px; padding-top: 5px; }
#videos > div:nth-child(2n+1) { margin-left: 0; }
#videos > div h3 { margin-left: 0; line-height: 1.3; }



/* Basket */

.steps { list-style: none; margin: 0 0 20px; background: #ebf1f5; }
.steps li { float: left; width: 196px; text-align: center; }
.steps li span { display: block; padding: 10px; }
.steps li.current span { font-weight: bold; }

.steps li { background: #ced6db url(../images/bg/bg-steps2.png) 100% 50% no-repeat; }
.steps li.current { background: #ced6db url(../images/bg/bg-steps.png) 100% 50% no-repeat; }
.steps li.current ~ li { background-color: #ebf1f5; background-image: url(../images/bg/bg-steps3.png); }
.steps li:last-of-type { background-image: none !important; }

#basket { width: 100%; }
#basket thead th, #basket thead td { padding: 5px 5px;  }
#basket thead th { font-weight: bold; color: #369; background: #ecf1f5; border-color: #D3DBE1; border-width: 1px 0; border-style: solid; }
#basket thead th:first-child { border-left-width: 1px; }
#basket thead th:last-child { border-right-width: 1px; }
#basket tbody td { border-bottom: 1px solid #ccc; padding: 10px 5px; }
#basket tbody td input[type="text"] { width: 35px; border-color: #ccc; text-align: right; }
#basket tbody td img { display: block; }
/*
#basket tbody td:nth-child(1) { width: 50px; }
#basket tbody td:nth-child(2) { width: 300px; }
*/
#basket tbody td:nth-child(1) { width: 350px; }
#basket tbody td:nth-child(3), #basket tbody td:nth-child(4), #basket tbody td:nth-child(5), #basket thead th:nth-child(3), #basket thead th:nth-child(4), #basket thead th:nth-child(5) { text-align: right; }
#basket tbody tr.tablefooter td { font-weight: bold; border-bottom: 0; text-align: right; }
#basket tbody tr.tablefooter td:first-child {  }
#basket tbody tr.tablefooter td:last-child { width: auto; }

#basket .deliverytime { font-size: 11px; display: inline-block; margin-bottom: 6px; color: #999; }

#btn-refresh { float: left; background: url(../images/btn/btn-refresh-basket.gif) no-repeat 0 0; width: 172px; height: 22px; border: 0 none; text-indent: -9999px; cursor: pointer; }
#btn-refresh:hover { background-position: 0 -22px; }
#btn-refresh:active { background-position: 0 -44px; }
.ie7 #btn-refresh { display: block; line-height: 0; font-size: 0; }

#link-next { float: right; margin-top: 2px; background: url(../images/btn/link-next.gif) no-repeat 0 0; width: 128px; height: 22px; text-indent: -9999px; }
#link-next:hover { background-position: 0 -22px; }
#link-next:active { background-position: 0 -44px; }
#link-prev { float: left; margin-top: 2px; background: url(../images/btn/link-prev.gif) no-repeat 0 0; width: 135px; height: 22px; text-indent: -9999px; }
#link-prev:hover { background-position: 0 -22px; }
#link-prev:active { background-position: 0 -44px; }
#btn-basket-submit { float: right; background: url(../images/btn/btn-basket-submit.gif) no-repeat 0 0; width: 136px; height: 26px; border: 0 none; text-indent: -9999px; cursor: pointer; }
#btn-basket-submit:hover { background-position: 0 -26px; }
#btn-basket-submit:active { background-position: 0 -52px; }

form label { float: left; width: 140px; margin: 2px 20px 0 0; cursor: pointer; }
form .right label { float: left; width: 100%; margin: 2px 20px 0 0; cursor: pointer; }
form input[type="text"],
form textarea { font-size: 13px; border: 1px solid #ccc; padding: 5px; float: left; width: 350px; }
form input.street { width: 305px; margin-right: 5px; }
form input.streetnr { width: 40px; }
form input.zip { width: 75px; margin-right: 5px; }
form input.city { width: 270px; }
form .cf { margin-bottom: 10px; }
table#basket + .box { margin-bottom: 20px; }
form .box { background: #ECF1F5; padding: 10px; }
form .box label { float: none; }
form .box span { display: block; margin-top: 5px; font-size: 12px; color: #666; }
form .box .payfield { margin: 10px 0 0; }
form .box .payfield label { float: left; margin-top: 3px; }
form .box .payfield input[type="text"] { width: 230px; }
form .basketcol { float: left; width: 195px; }
.ie7 form input.street { width: 293px; }
.ie7 form input.city { width: 258px; }

.besteller p { float: left; width: 140px; margin: 0 20px 0 0; }
.besteller label { margin: 0 10px 0 0; width: auto; }


#rechnung-privat, #anschrift-privat { display: block; }
#rechnung-firma, #anschrift-firma { display: none; }

input#firma2, input#ext_firma2 { margin: 10px 0 0 160px; }
textarea#firm + p, textarea#ext_firm + p { clear: left; color: #777; display: block; font-size: 11px; font-style: italic; margin: 0 0 0 160px; padding-top: 5px; }

label.widelabel { font-size: 12px; float: none; width: auto; clear: left; display: block; overflow: hidden; margin: 0 0 6px; }
label.widelabel:first-of-type { border-top: 1px solid #ccc; padding-top: 10px; }
label.widelabel:last-of-type { border-bottom: 1px solid #ccc; margin-bottom: -20px; padding-bottom: 10px; }
label.widelabel input { float: left; margin: 2px 5px 0 0 }
label.widelabel span { float: left; width: 90% }

form #basketlast {  }
form #basketlast th { font-weight: bold; }
form #basketlast td:nth-child(1n+2) { text-align: right; }
form #basketlast td { border-bottom: 1px solid #333; }
form #basketlast .tablefooter td { text-align: right; font-weight: bold; border-bottom: 0; }

#btn-send { float: left; background: url(../images/btn/btn-send.gif) no-repeat 0 0; width: 137px; height: 23px; border: 0 none; text-indent: -9999px; margin-left: 160px; }
#btn-send:hover { background-position: 0 -23px; }
#btn-send:active { background-position: 0 -46px; }

.basketpages { margin-top: 40px; }

.errorsummary { border: 2px solid #c00; background: #fcf2f2; padding: 10px 10px 4px; margin-bottom: 20px; }
.error label { color: #c00; font-weight: bold; }
.error input[type="text"],
.error input[type="passwort"],
.error textarea { border-color: #c00; }

.success { border: 2px solid #557f00; background: #f6f8f2; padding: 10px 10px 4px; margin-bottom: 20px; }

.recommend { height: 20px; position: absolute; }
.recommend + .book { clear: left; padding-top: 55px; }
.ie7 .recommend ~ .book { clear: left; padding-top: 40px; }
.infobox {  position: relative; float: left; }
.infobox img { margin: 0 0 0 5px !important; }
.infobox .text { display: none; position: absolute; font-size: 11px; left: -165px; bottom: 23px; width: 330px; padding: 7px 12px; background: #ECF1F5; border: 1px solid #ccc; }
.note-privacy { font-size: 11px; margin-left: 5px; }


/* Rezension */

#rezensionen { padding-top: 10px; }
#rezensionen .rez { border-bottom: 1px solid #ccc; margin-bottom: 15px; }
#rezensionen .rez:last-child { border-bottom: 0; }
#rezensionen .rez .bookrating { display: inline-block; }
#rezensionen h2 ~ h2 { padding-top: 10px; }
#rezensionen small { color: #666; display: inline; vertical-align: 3px; }
#rezensionen blockquote { border-left: 2px solid #d6dde3; margin-left: 15px; padding-left: 18px; }
#rezensionen blockquote p { font-style: italic; color: #999;  }
#rezensionen blockquote h3 { color: #369; }


/* Ads */

a.banner img { clear: left; display: block; }
p.breadcrumb + a.banner { background: url(../images/bg/dotted-line.png) repeat-x 0 100%; display: block; margin-bottom: 8px; padding-bottom: 10px; }


/* Bilderstrecke */

#bilderstrecke { position: relative; margin-bottom: 10px; }
#bilder > img { display: none; }
#nextpic, #prevpic { display: block; width: 40px; height: 41px; position: absolute; top: 50%; z-index: 999; text-indent: 100%; white-space: nowrap; overflow: hidden; margin-top: -20px; }
#nextpic { background: url(../images/nextpic.png); right: 0; }
#prevpic { background: url(../images/prevpic.png); left: 0; }



/*  P L U G I N S
--------------------------------------------------------------------------------------------------- */

/* Bewertungen */

.bookbox .bookrating.small { margin: 4px 0; }
.bookbox .bookrating.small .rating {  background-image:url("../images/icons/star_small.png"); background-position: 0 13px; width: 13px;height: 13px; }
.bookbox .bookrating.small .rating.checked { background-position: 0 0; }
.bookbox .bookrating.small small { font-size: 0.8em; margin: 0 0 0 90px; }

aside .bookbox .bookrating.small small { margin :0 0 0 160px; padding-top: 1px; }

/* Buecherdetailseite / Kommentieren */

#commentform { padding-top: 10px; }

#commentform input[type="text"], #commentform textarea, #commentform select { background: #FFF; font: 11px Verdana, Arial, sans-serif; color: #333537; vertical-align: middle; width: 400px; border: 1px solid #ccc; margin-bottom: 1em; padding: 3px; }
#commentform textarea { resize: none; float: none; }
#commentform input { float: none; margin: 0; }
#commentform label { width: 100%; float: none; }
#commentform div { float: none !important; }
#commentform label { display: block; margin-bottom: 2px; cursor: pointer; }
#commenttext { height: 70px }

p.bookrating { margin: 0 0 14px 0; }
.bookrating { margin: 0 0 4px 0; }
.bookrating .rating,
#commentform .rating { background-image:url("../images/icons/star.png"); background-position: 0 16px; width: 16px;height: 16px; display: block; float: left;  }
li.bookrating { margin-right: 4px; }

.rating, .bookratingcount { display: block; margin-right: 4px; }

.bookrating .rating.checked,
#commentform .rating.checked { background-position: 0 0; }
#commentform .hint { color: #8F8F8F; font-style: italic; margin-left: 2px; }
#commentform ul { display: inline; margin: 0; }

#btn-commentsend { background-image: url("../images/btn/btn-commentsend.jpg"); float: left; width: 109px; height: 22px; margin-top: 12px; }
#btn-commentsend:hover { background-position: 0 -22px }
#btn-commentsend:active { background-position: 0 -44px }

#TB_closeWindow, #TB_closeAjaxWindow { position: absolute; top: 2px; right: 2px; background: url(../images/bg/bg-lightbox-close.gif) no-repeat 0 0; width: 12px; height: 12px !important; padding: 0 !important; overflow: hidden; text-indent: -9999px; text-align: left !important; float: none !important; }
#TB_closeWindow a, #TB_closeAjaxWindow a { display: block; }
#TB_closeAjaxWindow { top: 5px; right: 5px; }


/* Newsletter - Registrierung */

form#newsletterreg { overflow: hidden; }
form#newsletterreg>fieldset { float: left; width: 49%; min-height: 120px; margin: 0 0 10px 2%; padding-bottom: 10px }
form#newsletterreg>fieldset.newsletter-www { width: 100%; padding: 0 0 15px 22px; min-height: 0; }
form#newsletterreg>fieldset:nth-of-type(2n+1) { margin-left: 0; }
form#newsletterreg>fieldset input { float: left; margin-right: 5px }
form#newsletterreg>fieldset label {  float: left; width: 80%; }
form#newsletterreg>fieldset label strong { font-weight: bold; display: block; color: #E67300; }
form#newsletterreg fieldset.line { border-bottom: 1px dotted #999999; border-top: 1px dotted #999999; padding-top: 10px; }


/*form#newsletterreg>fieldset:last-of-type { width: 100%; float: none; min-height: 0; }*/
.contactdata { clear: left; padding-top: 10px; }
.contactdata fieldset { margin-bottom: 10px; }
.contactdata fieldset div { overflow: hidden; margin-bottom: 10px; }
.contactdata fieldset div:last-of-type { padding-top: 10px; }
.contactdata label { width: 540px; }

.contactdata input[type="checkbox"] { float: left; margin-right: 10px; }
.contactdata div label { width: 105px; }
.contactdata input[type="checkbox"] + label { width: 540px; }

form#newsletterreg button { background: url(../images/btn/order-nl.png); display: block; width: 165px; height: 27px; }

/* Formgen */

.formgen_form input, .formgen_form select, .formgen_form textarea { margin-bottom: 10px; }
.formgen_form br { clear: left; }
.formgen_form legend { font-weight: bold; font-size: 18px; line-height: 1.4; margin-bottom: 6px; }
.formgen_form label + label { width: 350px; }
.formgen_form label + label input { margin-bottom: 0; }

.formgen_form button { background: url("../images/btn/formgen-right.png") no-repeat scroll 100% 0; font-size: 14px; color: #fff; font-weight: bold; text-indent: 0; display: inline-block; height: 27px; margin: 10px 0 30px 160px; padding-right: 3px; }
.formgen_form button span { background: url("../images/btn/formgen-left.png") no-repeat 0 0; line-height: 21px; display: inline-block; padding: 3px 7px 3px 10px; }
.formgen_form button:hover { background-position: 100% -27px; }
.formgen_form button:hover span { background-position: 0 -27px; }

.formgen_submit_success { font-weight: bold; font-size: 14px; background: #F6F8F2; border: 2px solid #557F00; margin-bottom: 20px; padding: 10px; }
.formgen_submit_success p { margin: 0; }

.formgen_form form label { margin: 2px 20px 10px 0; }
.formgen_form form > div.right,.formgen_form form > div.left { float: none !important; overflow: hidden; }
.formgen_form form > div label { margin-bottom: 0; }

.formsuccess { font-weight: bold; font-size: 14px; background: #F6F8F2; border: 2px solid #557F00; margin-bottom: 20px; padding: 10px; }
div.formerror { background: #FCF2F2; color: #333; border: 2px solid #c00; margin-bottom: 20px; padding: 10px 10px 0; }
div.formerror p { font-weight: bold; font-size: 14px; }


form#hanser_lehrbuecher div.right label[for="element0"] { width: auto; text-indent: -19px; padding-left: 19px; margin-bottom: 6px; }
form#hanser_lehrbuecher div.right label[for="element0"] input[type="radio"] { margin-bottom: 0; }

/*  F O O T E R
--------------------------------------------------------------------------------------------------- */

footer { font-size: 11px; padding: 0 10px 30px; }

footer p { float: left; margin: 0; }

footer nav { float: right; }
footer nav ul li { display: inline; }
footer nav ul li:before { content: " | "; }
footer nav ul li:first-child:before { content: ""; }

.ie7 footer nav ul li { margin-left: 10px; }


/*  M E D I A   Q U E R I E S
--------------------------------------------------------------------------------------------------- */


@media print {

	* { background: transparent !important; color: black !important; text-shadow: none !important; filter: none !important; -ms-filter: none !important; }
	@page { margin : 0.5cm; }
	body { box-shadow: none; width: auto !important; }
	a, a:visited { color: black !important; text-decoration: underline; }
	pre, blockquote { page-break-inside: avoid; }
	tr, img { page-break-inside: avoid; }
	td { border-top: 1px solid black; }
	p, h2, h3 { orphans: 3; widows: 3; }
	h2, h3 { page-break-after: avoid; }
	ul { list-style: disc inside; padding: 0 1em }
	ol { list-style: decimal inside; padding: 0 1em }

	#pagehead, #mainnav, #main aside, .breadcrumb, #bottom, #contact, a.banner, .recommend, .tabnav, .addBasket, a.more, figcaption, #inhalt .features, #basketForm .widelabel, #basketNav, table#basket + .box, footer nav { display: none !important; }
	#basketForm .basketcol { float: none; width: auto !important; }
	#basket a { text-decoration: none !important; }

	#basket thead th { background: #eee !important; border-color: #ddd !important; }
	#basket thead th:first-child { border-left-width: 0; }
	#basket thead th:last-child { border-right-width: 0; }


	#content { float: none; margin-bottom: 10px; width: auto; }

	.tabbox { background: none; }
	.tabbox > div { display: block !important; }

	#main:before { content: "Hanser Fachbuchverlag"; font-size: 18px; font-weight: bold; display: block; border-bottom: 1px solid #333; margin-bottom: 20px; padding-bottom: 10px; }
	.book { border-bottom: 1px solid #333; margin-bottom: 10px; padding-bottom: 10px; }
	footer { border-top: 1px solid #333; padding-top: 10px; }
}

.book-modalbox {
    position: fixed;
    top: 0;
    left: 0;
    background: rgba(0,0,0,0.3);
    height: 100vh;
    width: 100vw;
}

.book-modalbox div {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    max-height: 80vh;
    max-width: 80vw;
    height: auto;
    width: auto;
    padding: 20px;
    background: white;
}

.book-modalbox .close {
    display: block;
    position: absolute;
    right: -10px;
    top: -10px;
    border: 2px solid white;
    border-radius: 50%;
    background: black;
    color: white;
    font-size: 16px;
    text-transform: uppercase;
    cursor: pointer;
    z-index: 100;
    width: 24px;
    height: 24px;
    line-height: 25px;
    text-align: center;
}

.book-modalbox img {
    max-width: 80vw;
    max-height: 80vh;
    height: 100%;
    width: auto;
}