/**
 * Stylesheet for www.jugendbuch-couch.de
 *
 * @media       screen, projection
 * @author      Lars Schafft, lars [dot] schafft [at] literatur-couch [dot] de
 * @version     1.0 (2009-10-03)
 */
 
html, body
	{
		margin: 0;
		padding: 0;
	}

body
	{
		background: #333 url(/images/layout/bg.jpg) top left repeat-x fixed;
		text-align: center;
		font-size: 100.01%;
		font-family: Arial, Helvetica, sans-serif;
		color: #111;
	}
	
body.male #wrapper-outer
	{
		background: url(/images/layout/bg-male.jpg) top center no-repeat fixed;
		padding-top: 100px;
		
	}
	
body.female #wrapper-outer
	{
		background: url(/images/layout/bg-female.jpg) 50% 95px no-repeat fixed;
		padding-top: 100px;
	}
	
#wrapper-inner
	{
		position: relative;
		z-index: 1;
		width: 960px;
		margin: 0 auto 10px auto;
		padding: 0 0 10px 10px;
		text-align: left;
		font-size: .8em;
		line-height: 1.5;
	}
	
#container
	{
		width: 100%;
		margin: 97px 0 0 0;
		background: url(/images/layout/bg-container.gif) 0 200px no-repeat;
	}
	
#breadcrumbs
	{
			margin-left: 248px;
			background: url(/images/layout/bg-breadcrumbs.png) top right no-repeat;
			height: 30px;
			overflow: hidden;
	}
	
#breadcrumbs p
	{
		margin: 0;
		padding: 0 0 0 20px;
		line-height: 30px;
		color: #666;
		font-size: .85em;
	}
	
#breadcrumbs a,
#breadcrumbs a:visited
	{
		color: #333;
		text-decoration: none;
	}
	
#breadcrumbs a:hover
	{
		text-decoration: underline;
	}
	
#content
	{
		width: 672px;
		min-height: 300px;
		padding: 20px;
		float: right;
		display: inline;
		position: relative;
	}
	
#content-corner
	{
		display: block;
		width: 15px;
		height: 15px;
		background: url(/images/layout/bg-content-corner.png) no-repeat;
		position: absolute;
		top: 0;
		right: 0;
	}
	
#content-inner,
#edition
	{
		width: 432px;
		padding: 0 15px 0 0;
		float: left;
	}
	
#news-related
	{
		background: #E5E5E5;
		width: 170px;
		padding: 15px;
		float: right;
	}
	
#news-related h3.imr
	{
		position: relative;
		margin: 20px 0 0 0;
		padding: 0;
		width: 170px;
		height: 35px;
		left: -25px;
		font-size: 1em;
	}

#news-related h3.imr span
	{
		position: absolute;
		top: 0;
		left: 0;
		display: block;
		width: 100%;
		height: 100%;
		background: url(/images/layout/headlines/headlines.png) no-repeat;
	}
	
#news-related
	{
		margin-top: -8px;
		font-size: .85em;
	}
	
#news-related div#specials h3 span
	{
		background-position: 0 -70px
	}

#news-related div#specials h3
	{
		margin-top: -27px;
	}
	
#news-related div#specials h4
	{
		margin: 0;
		padding: 0;
	}
	
#news-related div#specials p
	{
		margin: 0;
		padding: 0;
	}
	
#news-related div#specials img
	{
		border: 1px solid #fff;
	}
	
#news-related div.drop-shadow
	{
		float:left;
		background: url(/images/layout/shadow-alpha.png) no-repeat bottom right;
		margin: 10px 0 0 10px !important;
		margin: 10px 0 0 5px;
	}

#news-related div.drop-shadow img
	{
		display: block;
		position: relative;
		margin: -6px 6px 6px -6px;
		max-width: 160px;
		height: auto;
	}
	
#news-related div#specials div.question
	{
		padding-bottom: 10px;
		border-bottom: 1px solid #ccc;
		margin-bottom: 10px;
	}
	
#nav
	{
		width: 218px;
		float: left;
		display: inline;
	}
	
/* {{{ */

#header
	{
		background: #333;
	}
	
#header h1,
#header h2
	{
		margin: 0;
		padding: 0;
		width: 368px;
		height: 70px;
		position: relative;
	}
	
#header h1 span,
#header h2 span
	{
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background: url(/images/layout/logo.jpg) no-repeat;
	}
	
#header p
	{
		color: #fff;
		font-size: .85em;
		position: absolute;
		top: -32px;
		left: 10px;
		background: #333;
		width: 200px;
		line-height: 32px;
		height: 32px;
		padding: 0 0 0 20px;
		margin: 0;
	}
	
#content
	{
		background: #fff url(/images/layout/bg-content.jpg) repeat-y;
	}
	
#content h1
	{
		margin-top: 0;
		padding-top: 0;
		font-size: 1.4em;
	}
	
#content h2
	{
		font-size: 1.2em;
	}
	
#content h3
	{
		font-size: 1.1em;
	}
	
#content h4
	{
		font-size: 1em;
	}
	
#content a:link
	{
		color: #267180;
	}
	
#content a:visited
	{
		color: #000;
	}
	
#content a:hover
	{
		color: #CC0066;
	}
	
#content address
	{
		font-style: normal;
		padding-left: 1em;
		border-left: 4px solid #0095B3;
	}
	
/* {{{ */

#nav
	{
		background: #666;
		color: #fff;
	}
	
#nav ul
	{
		list-style: none;
		padding: 0;
		margin: 0 0 20px 0;
	}
	
#nav ul li a
	{
		padding-left: 20px;
	}
	
#nav ul li li a,
#nav ul li li span
	{
		font-size: .85em;
		padding-left: 28px;
	}
	
#nav a
	{
		color: #fff;
		text-decoration: none;
	}
	
#nav a:visited
	{
		color: #eee;	
	}
	
#nav a:hover
	{
		color: #fff;
		text-decoration: underline;
	}
	
#nav h2
	{
		position: relative;
		left: -10px;
		font-size: 1em;
		width: 218px;
		height: 59px;
		margin: 0;
		padding: 0;
	}
	
#nav h2 span
	{
		position: absolute;
		top: 0;
		left: 0;
		display: block;
		width: 100%;
		height: 100%;
		background: url(/images/layout/headlines/subnav.png) no-repeat;
	}
	
#nav h2.topics span
	{
		background-position: 0 -59px !important;
	}
	
#nav h2.ueber-uns span
	{
		background-position: 0 -236px !important;
	}
	
#nav h2.specials span
	{
		background-position: 0 -295px !important;
	}
	
#nav h2.verlage span
	{
		background-position: 0 -354px !important;
	}
	
#nav h2.meine span
	{
		background-position: 0 -413px !important;
	}
	
#nav h2.age span,
body.alter #nav h2.topics span
	{
		background-position: 0 -118px !important;
	}
		
#nav h2.authors span,
body.autoren #nav h2.topics span
	{
		background-position: 0 -177px !important;
	}
	
ul.authors
	{
		padding-left: 17px !important;
		width: 80px !important;
	}

ul.authors li a
	{
		padding: 0 !important;
		width: 15px;
		display: block;
		text-align: center;
		float: left;
	}
	
#nav div.authors
	{
		margin-bottom: 20px;
	}

body.autoren h2.authors,
body.autoren ul.authors,	
body.alter h2.age,
body.alter ul.age
	{
		display: none;
	}
	
#nav ul li .x
	{
		font-weight: bold;
		color: #fff important;
		border-bottom: 1px solid #40B0C6;
		background: #0095B3;
		padding: 5px 20px;
	}
	
body.autoren #nav ul li .x
	{
		background: #CCCC29;
		border-color: #A3A321;
	}
	
body.alter #nav ul li .x
	{
		background: #F98305;
		border: 0;
	}
	
#nav li.x ul
	{
		background: #0095B3;
		margin: 4px 0 0 0;
	}

#nav li.x ul li a.x,
#nav li.x ul li span.x
	{
		background: #40B0C6 !important;
		font-weight: normal !important;
		padding: 0 3px !important;
		margin: 0 25px;
		border: 0 !important;
		width: 150px !important;
		display: block;
	}
	
body.autoren #nav li.x ul
	{
		background: #CCCC29;
	}
	
body.autoren #nav li.x ul li a.x,
body.autoren #nav li.x ul li span.x
	{
		background: #A3A321 !important;
	}
		
#nav #search
	{
		position: relative;
		border-bottom: 13px solid #808080;
	}
	
#nav #search h3,
#nav #search label
	{
		position: absolute;
		left: -999em;
	}
	
#nav #search fieldset
	{
		border: 0;
		padding: 0;
		margin: 0;
		background: #fff;
	}
	
#nav #search legend
	{
		display: none;
	}
	
#nav #search p
	{
		margin: 0;
		padding: 0;
		height: 40px;
	}
	
#nav #search input.text
	{
		width: 118px;
		padding: 15px 0 15px 20px;
		float: left;
		font-size: .85em;
		border: 0 !important;
	}
	
#nav #search input.imgsubmit
	{
		position: absolute;
		right: -10px;
		bottom: -13px;
	}
	
#nav #footer
	{
		color: #B3B3B3;
		background: #333;
		font-size: .85em;
	}
	
#nav #social-bookmarks h3
	{
		color: #fff;
		font-size: 1em;
		margin: 10px 0 0 5px;
		padding: 0;
	}
		
#nav #footer p
	{
		margin: 0;
		padding: 0;
	}

#nav #social-bookmarks ul
	{
		margin: 0;
		padding: 0 0 0 5px;
		width: 160px;
	}	
	
a#go-to-top
	{
		display: block;
		position: absolute;
		left: 278px;
		margin-top: -15px;
		width: 104px;
		height: 25px;
		text-indent: -999em;
		background: url(/images/layout/buttons/nach-oben.gif) no-repeat;
	}
	
	
/* {{{ */

#top-nav
	{
		position: absolute;
		top: 130px;
		right: 0;
		width: 712px;
	}
	
#top-nav ul
	{
		margin: 0;
		padding: 0;
		list-style: none;
	}
	
#top-nav ul li
	{
		display: block;
		position: relative;
		float: left;
		width: 69px;
		height: 37px;
		overflow: hidden;
	}
	
#top-nav ul li
	{
		text-indent: -999em;
	}
	
#top-nav ul li a span,
#top-nav ul li span.x span
	{
		display: block;
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background: url(/images/layout/buttons/topnav.png) 0 -296px no-repeat;
	}
	
body.home #top-nav ul li.index a span,
body.home #top-nav ul li.index span.x span
	{
		background-position: 0 0;
	}
	
#top-nav ul li.index a:hover span
	{
		background-position: 0 0 !important;
	}

#top-nav ul li.themen
	{
		width: 77px;
	}
	
#top-nav ul li.themen a span
	{
		background-position: -69px 0;
	}
	
#top-nav ul li.themen span.x span,
body.themen #top-nav ul li.themen a span,
#top-nav ul li.themen a:hover span
	{
		background-position: -69px -37px;
	}
	
#top-nav ul li.alter
	{
		width: 66px;
	}
	
#top-nav ul li.alter a span
	{
		background-position: -146px 0;
	}
	
#top-nav ul li.alter span.x span,
body.alter #top-nav ul li.alter a span,
#top-nav ul li.alter a:hover span
	{
		background-position: -146px -74px;
	}

#top-nav ul li.autoren 
	{
		width: 116px;	
	}
	
#top-nav ul li.autoren a span
	{
		background-position: -212px 0;
	}
	
#top-nav ul li.autoren span.x span,
body.autoren #top-nav ul li.autoren a span,
#top-nav ul li.autoren a:hover span
	{
		background-position: -212px -111px;
	}	
	
#top-nav ul li.verlage
	{
		width: 114px;
	}
	
#top-nav ul li.verlage a span
	{
		background-position: -328px 0;
	}
	
#top-nav ul li.verlage span.x span,
body.verlage #top-nav ul li.verlage a span,
#top-nav ul li.verlage a:hover span
	{
		background-position: -328px -148px;
	}	
	
#top-nav ul li.specials
	{
		width: 88px;
	}
	
#top-nav ul li.specials a span
	{
		background-position: -442px 0;
	}
	
#top-nav ul li.specials span.x span,
body.specials #top-nav ul li.specials a span,
#top-nav ul li.specials a:hover span
	{
		background-position: -442px -185px;
	}
	
#top-nav ul li.termine
	{
		width: 82px;
	}
	
#top-nav ul li.termine a span
	{
		background-position: -530px 0;
	}
	
#top-nav ul li.termine span.x span,
body.termine #top-nav ul li.termine a span,
#top-nav ul li.termine a:hover span
	{
		background-position: -530px -222px;
	}
	
#top-nav ul li.neuheiten
	{
		width: 100px;
	}
	
#top-nav ul li.neuheiten a span
	{
		background-position: -612px 0;
	}
	
#top-nav ul li.neuheiten span.x span,
body.neuheiten #top-nav ul li.neuheiten a span,
#top-nav ul li.neuheiten a:hover span
	{
		background-position: -612px -259px;
	}
	
#media-interactive
	{
		font-size: .9em;
	}

#media-interactive,
#interactive
	{
		position: absolute;
		top: 70px;
		left: 10px;
		width: 960px;
		height: 40px;
		background: #efedfa url(/images/layout/media-interactive-bg.gif) repeat-x;
	}
	
#interactive
	{
		top: 0;
		left: auto;
		right: 20px;
		width: auto;
	}

#media-interactive ul
	{
		list-style: none;
		margin: 0;
		padding: 0;
	}
	
#media-interactive ul li
	{
		float: left;
		margin-left: 20px;
		padding-top: 10px;
	}
	
#media-interactive ul li a
	{
		text-decoration: none !important;
		color: #333 !important;
		padding-left: 25px;
		height: 20px;
		display: block;
		background: url(/images/layout/media-interactive-icons.gif) 0 0 no-repeat;
	}
	
#media-interactive ul li.blog a
	{
		background-position: 0 -40px;
	}	
	
#media-interactive ul li.meine a
	{
		background-position: 0 -60px;
	}
	
#media-interactive ul li.board a
	{
		background-position: 0 -80px;
	}
	
#media-interactive ul li.guestbook a
	{
		background-position: 0 -100px;
	}	
	
#media-interactive ul li.newsletter a
	{
		background-position: 0 -120px;
		padding-left: 35px;
	}
	
#media-interactive ul li.facebook a
	{
		background-position: 0 -140px;
	}	

#media-interactive ul li.twitter a
	{
		background-position: 0 -160px;
		padding-left: 35px;
	}
	
#media-interactive ul li.specials a
	{
		background-position: 0 -180px;
	}		
	
#search
	{
		position: absolute;
		top: 15px;
		right: 20px;
	}

#search fieldset, #search form
	{
		border: 0;
		margin: 0;
		padding: 0;
	}

#search input.text
	{
		position: relative;
		top: -.2em;
		font-size: 1.2em;
		width: 270px;
		font-family: Arial, Helvetica, sans-serif;
		border: 1px solid #273375;
		padding: .3em;
	}

#search .imgsubmit
	{
		margin-left: 19px;
	}


#search legend
	{
		display: none;
	}
	
#about
	{
		position: absolute;
		top: -90px;
		left: 10px;
		width: 160px;
		color: #fff;
		font-size: .85em;
		z-index: 498;
	}
	
#about h2
	{
		position: absolute;
		left: -999em;
	}
	
#about ul
	{
		list-style: none;
		margin: 0;
		padding: 0;
		z-index: 499;
	}
	
#about li
	{
		display: inline;
		padding-left: 3px;
	}
	
#about a
	{
		color: #fff;
		text-decoration: none;
	}
	
#about ul li#couch-hopper
	{
		position: relative;
		color: #fff;
		z-index: 500;
		display: block;
	}
	
#about ul li#couch-hopper span
	{
		cursor: pointer;	
	}
	
#about ul li#couch-hopper ul
	{
		position: absolute;
		left: -.2em;
		top: 1.5em;
		display: none;
		margin: 0;
		padding: 0;
		z-index: 1000;		
		width: 13em;
		background: #48B7CA;
		font-size: .8em;
		text-align: left;
	}
	
#about ul li#couch-hopper:hover,
#about ul li#couch-hopper.hover
	{
		color: #E88400;
	}	
	
#about ul li#couch-hopper:hover ul,
#about ul li#couch-hopper.hover ul
	{		
		display: block;
	}
	
#about ul li#couch-hopper ul li
	{
		display: block;
		float: none;
		padding: .1em;
		margin: 0;
		font-size: 1.2em;
		background: url(/images/layout/line-horiz-dotted.gif) bottom left repeat-x;
	}
	
#about ul li#couch-hopper ul li.l
	{
		background: none;
	}
	
/* {{{ */

#tags
	{
		position: relative;
		margin: 0 0 20px 0;
		padding: 10px 20px 30px 20px;
		background: #808080;
	}
	
#tags h3
	{
		margin: 0;
		padding: 0;
		position: absolute;
		left: 0;
		bottom: 0px;
	}
	
#tags h3 a
	{
		display: block;
		position: relative;
		width: 228px;
		height: 25px;
	}
	
#tags h3 a span
	{
		position: absolute;
		top: 0;
		left: 0;
		display: block;
		width: 100%;
		height: 100%;
		background: url(/images/layout/buttons/schlagwortsuche.gif) no-repeat;
	}
	
#tags a
	{
		color: #D9D9D9;
	}
	
div.a-skyscraper
	{
		padding: 20px 0;
		text-align: center;
		border-top: 1px solid #333;
		background: #4D4D4D;
	}
	
#news-related div.a-skyscraper
	{
		border: 0;
		background: none;
	}
	
div.a-skyscraper img
	{
		display: block;
		margin: 0 auto;
		border: 1px solid #333;
	}
	
div.a-skyscraper p.adv
	{
		font-size: 9px !important;
		padding: 0;
		margin: 0;
	}
	
div.adv-fullsize
	{
		position: absolute;
		top: -100px;
		right: 0;
	}
	
div.adv-fullsize img
	{
		border: 1px solid #CCCCCC;
	}
	
/* {{{ */

.cb
	{
		clear: both;
	}
	
.nb
	{
		border: 0;
	}
	
.fl
	{
		float: left;
	}
	
.tac
	{
		text-align: center;
	}
	
a:active 
	{
		outline:none;
	}
	
img.b
	{
		border: 1px solid #333;
	}
	
img.l
	{
		float: left;
		margin-right: 15px;
	}
	
img.r
	{
		float: right;
		margin-left: 15px;
	}	

	
.jubu
	{
		text-transform: uppercase;
		font-weight: bold;
	}
	
.hr
	{
		width: 100%;
	}

.skip, 
.rem,
hr
	{
		position: absolute;
		left: -999em;
	}
	
footer
	{
		background: #666;
		color: #E5E5E5;
		text-align: center;
		font-size: .85em;
		padding: 3px 10px 10px 10px;
		margin-top: 2em;
	}
	
footer ul.couches
	{
		display: -webkit-box;
		display: -moz-box;
		display: -ms-flexbox;
		display: -webkit-flex;
		display: flex;
		margin: 0;
		padding: 0;
		list-style: none;
		width: 100%;
	}

footer ul.couches > li
	{
		-webkit-box-flex:1;
		-moz-box-flex:1;
		-webkit-flex:1;
		-ms-flex:1;
		flex:1;
		min-width: 1px;
		padding: 0 1em .75em 1em;
		text-align: center;
		align-self: baseline;
	}
		
footer ul.couches > li:first-of-type
	{
		padding-left: 0;
	}
	
footer ul.couches > li:last-of-type
	{
		padding-right: 0;
	}
		
footer ul.couches img
	{
		width: 100%;
		max-width: 100%;
		height: auto;
	}