/*  
Theme Name: Highway
Theme URI: http://bensite.net/
Description: An hommage to good ol' shiny web 2.0 design.
Version: 1.0
Author: Benedikt Müller
Author URI: http://bensite.net/
Created: April 24, 2008
Update History: 
* Apr, 2009
* Jul, 15 2009: imageList added
* Nov, 06 2009: removed ie warning styles 
* Nov, 16 2009: added numeric td styles
* Mar, 08 2010: fix ratings border
* May, 13 2010: removed Lakeshore Drive references
*/

/* --- Begin structure --- */
* { 
  margin: 0; 
  padding: 0;
}
body {
	font-family: Lucida Grande, Lucida Sans Unicode, sans-serif;
	font-size:13px;
	color:#222;
	padding-top:32px;
	background:#fff;
}
#wrapper {
	max-width:850px;
	min-width:760px;
	margin-left:auto;
	margin-right:auto;
	padding:0 15px;
}
#content {
	float:left;
	width:63%;
	padding:0 10px 0 10px;
}
#sidebar {
	float:right;	
	width:27%;
	padding:0 10px;
}
#sidebar p.long {
	font-size:11px;
	color:#444;
}

/* --- End structure --- */


/* --- Begin text elements --- */
h1, h2, h3, h4 {
	font-family: Impact, Arial, sans-serif;
	color: #999;
	font-weight:100;
	font-style:normal;
	padding:20px 0 0 0;
	line-height:20px;
	}
#sidebar h1, #sidebar h2, #sidebar h3, #sidebar h4 {
/*	color: #aaa;
*/
}
h1 a, h1 a:visited {
	color:#999;
	text-decoration:none;
	border-bottom:0;
}
h1 a:hover {
	border-bottom:1px solid #999;
}
h1 {
	font-size:20px;
	letter-spacing: 2px;
	word-spacing: 2px;
}
h2 {
	font-size:17px;
	letter-spacing: 1px;
	word-spacing:1px;
}
h3 {
	font-size:14px;
	letter-spacing: 1px;
	word-spacing:1px;
}
p.postInfo {
	font-size:11px;
	margin:-1px 0 1px 0;
	padding:0;
}
a {
	text-decoration:none;
	color:#f90; /*orignal: #f90;*/
	border-bottom:1px dotted #f90;
	
}
a:hover {
	border-bottom:1px solid #f90;
}
a:visited {
	color:#f90;
}
p {
	padding:20px 0 0 0;
	line-height:20px;
}
ul, ol, dl {
	padding:20px 0 0 50px;
}
li, dd, dt {
	line-height:20px;
}
dt {
	font-weight:bold;
	color:#777;
}
dd {
	padding: 0 0 0 20px;
}

table {
	margin:20px 0 0 0;
	border-collapse: collapse;
	font-size:11px;
	width:100%;
}
tr {
	line-height:20px;
}
th {
	background: #888;
	color:#fff;
	text-align: left;
	padding:0 10px;
}
td {
	padding:0 10px;
}
.e1 {
	background: #f2f2f2;
}
.e2 {

}
table.num th, tr.num th, table.num td, tr.num td, td.num {
	text-align: right;
}

blockquote:before {
	content:"»";
	/*margin-left:-7px;*/ /*Lyrics blockquote align*/
}
blockquote:after{
	content:"«";
}

blockquote {
	padding: 20px 50px 0 50px;
	color:#777;
	line-height:20px;

}
blockquote p:first-child {
	padding:0;
	margin:0;
	display:inline;
}
blockquote p:last-child {
	padding:0;
	margin:0;
	display:inline;
}
#content span.spoiler {
	color:#999;
	background:#999;
}
#content span.spoiler:hover {
	color:#fff;
	background:#999;
	cursor:help;
}

#content hr+ol {
	font-size:11px;
	color:#666;
}
/*
html>body hr {
	margin: 0;
	padding: 1.8em 0 0 0;
	border: 0;
	border-bottom: 1px solid #e8e8e8;
	clear: both;
}
hr {
	margin: 1.6em 0 -0.4em 0
	padding: 0;
	color: #e8e8e8;
	height: 1px;
	clear: both;
}
*/


/* Funkt fast in IE7 - um einen Pixel ist's noch verschoben 
	siehe auch http://www.robertnyman.com/2007/03/09/a-hard-challenge-styling-an-hr-element/ für die seltsame 7-Pixel-Addition ...
4 */
/*
hr {
	margin: 23px 0 0 0;
	margin-bottom:3px; 
	border:0;
	border-bottom:1px solid #ccc;
	color:#fff; 

}
*/

hr {
	padding: 30px 0 0 0;
	margin-bottom:9px; 
	border:0;
	border-bottom:1px solid #bbb;
	color:#fff; /* leave no bad browser behind: IE7 - 1px height */
	clear:both;
}
hr.narrow {
	border-bottom:1px dotted #aaa;
	padding:10px 0 0 0;
	margin-bottom:-11px;
}
div.category {
	float:left;
	width:250px;
}
div.firstCat {
	padding-right:35px;
}


abbr, acronym {
	border-bottom:1px dashed #bbb;
	
}
a abbr, a acronym, a abbr:hover, a acronym:hover {
	border-bottom-color: inherit;
	
}
abbr:hover, acronym:hover {
	cursor:help;
	border-bottom:1px dashed #222;
}
em {
	letter-spacing: 1px;
	padding:0 2px 0 1px;
}
sup {
	line-height:0; /* Keine Ahnung warum aber line-height:0 sorgt dafür, dass die paragraph line-height eingehalten wird */
}
code {
	padding:0 15px;
	background:pub
	line-height:10px; /* Ansonsten respektieren Opera, FF, Safari die paragraph line-height bei Line-height nicht, Folgetext out-of-phase*/
	color:#777;
	font-family:Monaco, Courier New, Courier, monospace;
	font-size:12px;
	border:0;
	margin:0;
	margin-bottom:-1px 0 0 0;
	display:inline;
	overflow:scroll;
	
}
.code, .mail {
	margin: 0 5px 0 5px;
	font-family:Monaco, Courier New, Courier, monospace;
	font-size:12px;
	color: #777;
	line-height:normal;
}
dt.error {
	color:red;
}
#content #commentForm div.commentForm #commentArea dd.error input {
	border: 1px solid red;
}
ol li .code { /*normal font size in note descriptions */
	font-size:inherit;
}

#sidebar h2:first-child {
	padding:60px 0 0 0;
	
}
#sidebar h2#about  {
	padding-top:20px;
}
#sidebar h2#lastComment  {
	padding-top:80px;
}

#sidebar h2 {
	font-size:12px;
	padding:40px 0 0 0;
	clear:both; /*mainly to clear float after tag cloud on front page */
	text-transform: uppercase;
	/*letter-spacing:2px;
*/
}
#sidebar h3 {
	font-size:10px;
	padding: 3px 0 0 0;
	margin: 0 0 -3px 0;
	clear:both; /*mainly to clear float after tag cloud on front page */
	text-transform:uppercase;
	/*letter-spacing:2px;
*/
}
#sidebar p {
	line-height:20px;
	padding:0;
	margin:0;
}
#sidebar ul {
	padding:0 0 0 2px;
	margin: 0;
	color:#222;
	list-style-position: inside;
	list-style-type: square;
}
#sidebar ul li {
	margin:0;
	padding:0;
}

span.wide {
	padding:0 7px;
}

#sidebar h2#intro {
 /*Intro-Texte für Category-Seiten */
 padding-top:60px;

}

/* --- End text elements --- */



/* --- Begin special elements --- */
#jumpToContent {
	display:none;
}
.clear {
	clear:both;
}


#sidebar dl {
	padding:0;
}
#sidebar dl dt {
	font-weight:normal;
}
#sidebar dl dd {
	padding:0 0 0 20px;
	line-height:20px;
}
#sidebar dl#recentComments dt a:before {
	content:"»";
}
#sidebar dl#recentComments dt a:after{
	content:"«";
}





p.rating strong {
	font-weight:bold;
	padding-right:58px;
}
p.one strong {
	background:url(images/stars_1of5.png) right 4px  no-repeat;
}
p.oneandahalf strong {
	background:url(images/stars_1.5of5.png) right 4px  no-repeat;
}
p.two strong {
	background:url(images/stars_2of5.png) right 4px  no-repeat;
}
p.twoandahalf strong {
	background:url(images/stars_2.5of5.png) right 4px  no-repeat;
}
p.three strong {
	background:url(images/stars_3of5.png) right 4px  no-repeat;
}
p.threeandahalf strong {
	background:url(images/stars_3.5of5.png) right 4px  no-repeat;
}
p.four strong {
	background:url(images/stars_4of5.png) right 4px  no-repeat;
}
p.fourandahalf strong {
	background:url(images/stars_4.5of5.png) right 4px  no-repeat;
}
p.five strong {
	background:url(images/stars_5of5.png) right 4px  no-repeat;
}
p.rating strong span {
	display:none;
}
ul.archiveList a img {
	border:none;
}




p.tagcloud {
	line-height:20px;
	margin:0;
	padding:0 80px 0 0; /*trick to float in last line and not next to tag cloud */
	float:left;
}


#content ul.wp-tag-cloud, #sidebar ul.wp-tag-cloud { /* #sidebar ... to ovverride standard sidebar-css*/
	margin:0;
	padding:0;
}

#content ul.wp-tag-cloud li, #sidebar ul.wp-tag-cloud li { /* #sideber ... to ovverride standard sidebar-css*/
	float:left;
	list-style:none;
	margin:0;
	padding: 0 5px 0 0;
	height:20px;
	display:block;
}

h2#alltags {
	margin-bottom:20px;
}
#sidebar p.flickr a img {
	margin:0 0 8px 0;
	padding:8px;
	border:1px solid #ccc;
}
#sidebar p.flickr a img:last-child {
	margin:0 0 2px 0;
}
#sidebar p.flickr a {
	border:0;
	display:block;
	
}

#content dl.captionedImageLeft {
	margin: 20px 15px 20px 0;
	padding: 0;
	float: left;
}
#content dl.captionedImageRight {
	margin: 20px 0 20px 15px;
	padding: 0;
	float: right;
}
#content dl.captionedImageCenter {
	margin:0;
	padding:20px 0 0 0;
}
#content dl.captionedImageLeft dt a, #content dl.captionedImageRight dt a, #content dl.captionedImageCenter dt a{
	margin: 0;
	padding: 0;
	text-decoration: none;
	border:0;
	display: block;
}
#content dl.captionedImageLeft dt img, #content dl.captionedImageRight dt img,#content dl.captionedImageCenter dt img {
	margin: 0 0 5px 0;
	padding: 9px;
	text-decoration: none;
	border: 1px #e8e8e8 solid;
	display: block;
}
#content dl.captionedImageCenter dt img {
	margin-left: auto;
	margin-right: auto;
}
#content dl.captionedImageLeft dd, #content dl.captionedImageRight dd, #content dl.captionedImageCenter dd, #content .imageList dl dd {
	margin: -3px 0 -2px 0;
	padding: 0;
	border: 0;
	color:#666;
	font-size:11px;
	text-align: center;
}
#content img.right {
	margin: 5px 0 5px 5px;
	padding: 5px;
	border: 1px  #e8e8e8 solid;
	float: right;
}
#content img.left {
	margin: 5px 5px 5px 0;
	padding: 5px;
	border: 1px  #e8e8e8 solid;
	float: left;
}
#content img.center {
	margin-left: auto;
	margin-right: auto;
	margin-top: 15px;
	padding: 5px;
	border: 1px  #e8e8e8 solid;
	display: block;
}


#content .imageList {
	margin:0;
	padding:20px 0 0 0;
}
#content .imageList a {
	text-decoration:none;
	border-bottom:0;
}
#content .imageList dl {
	margin: 0;
	padding: 0;
	float: left;
 	display: inline; /* correct ie's doubled margin bug */
}
#content .imageList.w100 dl {
	padding-right:10px;
}
#content .imageList.w240 dl {
	padding-right:15px;
}
#content .imageList.w100 dl:last-child,
#content .imageList.w240 dl:last-child { /* use last-child (css3) for 2 or more rows of images (when reducing size, for example) */
	padding-right:0;
}



#content .imageList dl dt {
	margin: 0;
	padding: 0;
}
#content .imageList dl dt img {
	padding: 0;
	margin: 0;
	border: 1px  #e8e8e8 solid;
}










#content div.heavyrotation {
	padding-left:0;
	margin-left:0;
	float:left;
}
#content div.heavyrotation dl {
	margin: 0 30px 0 0;
	padding:0;
	display:block;
	float:left;
}

#content div.heavyrotation dl dt {
	margin-top:20px;
}
#content div.heavyrotation dl dd {
	margin:0;
	padding:0;
}



#content ul.archiveList {
	margin: 20px 0 0 0;
	padding:0;
}
#content ul.archiveList li {
	list-style: none;
	padding-left:6px;
}
#content ul.archiveList a {
	text-decoration: none;
	border-bottom: 0;
}
#content ul.archiveList a:hover {
	text-decoration: underline;
	border-bottom: 0;
}
.symbolArtikel {
	background: url(images/symbol-artikel-small.png) center left no-repeat; 
}
.symbolPodcast {
	background: url(images/symbol-podcasts-small.png) center left no-repeat; 
}
.symbolFilmkritik {
	background: url(images/symbol-filmkritiken-small.png) center left no-repeat;  
}
.symbolHeavyRotation {
	background: url(images/symbol-heavyrotations-small.png) center left no-repeat; 
}
.symbolEmpfehlung {
	background: url(images/symbol-empfehlungen-small.png) center left no-repeat; 
}






#content dl#commentsList {
	margin-left:0;
	padding-left:0;
}
#content dl#commentsList dt {
	margin:20px 0 0 0;
	padding: 19px 0 0 0;
	border-top:1px dotted #aaa;
}
#content dl#commentsList dt:first-child {
	margin: 0;
	padding: 0;
	border-top:0;
}
#content dl#commentsList dd {
	margin-left:20px;
	padding-left:0;
	}
#content dl#commentsList dd p {
}

#content p.subscribe-to-comments {

}
#content p.subscribe-to-comments input {
	
}
#content p.subscribe-to-comments label {

}

#content div.commentForm {
	padding-left:0;
	margin-left:0;
	float:left;
}
#content div .commentArea {
	
	clear:both;
}
#content div.commentForm dl {
	margin: 0 48px 0 0;
	padding:0;
	display:block;
	float:left;
}
#content div.commentForm dl:last-child {
	margin: 0;
}
#content div.commentForm dl dt {
	margin-top:20px;
}
#content div.commentForm dl dd {
	margin:0;
	padding:0;
}
#content div.commentForm #author, #content div.commentForm #email, #content div.commentForm #url, #content div.commentForm #test {
	height:18px;
	width:144px;
	margin:0;
	padding:0;
	line-height:18px;
	font-family: Lucida Grande, Lucida Sans Unicode, sans-serif;
	font-size:11px;
	border:1px solid #999;
	float:left; /* pixel-perfect line grid in Safari, Oper, FF3 */
}
#content div.commentForm #url {
	width:145px; /* pixel-perfect right comment form rim in Safari, Oper, FF3 */
}

#content div.commentForm #comment {
	font-family: Lucida Grande, Lucida Sans Unicode, sans-serif;
	font-size:13px;
	color:#222;
	line-height:20px;
	width: 533px;
	height:138px;
	margin:0;
	padding:0;
	border:1px solid #999;
	float:left;/* pixel-perfect line grid in Safari, Oper, FF3 */
}

#content #submit {
	margin:20px 0 0 0;
	line-height:20px;
	padding:0;
	width:120px;
	height:20px;
	border:1;
}




/* --- End special elements --- */



















/* --- Begin header & nav --- */

#navLevel01 {
	background: url(images/nav01-bg-left.jpg) top left no-repeat;
	height:56px;
	width:100%;
	padding-bottom:11px;
}

#navLevel01 div {
	background: url(images/nav01-bg-right.jpg) top right no-repeat;
	height:56px;
}


#navLevel01 ul {
	list-style:none;
	margin:0;
	padding:0;
}
#navLevel01 ul li { /* leave no bad browser behind: IE7 */
	float:left;
}
#navLevel01 ul li a {
	display:block;
	height:56px;
	float:left;
	border:0;
}
#navLevel01 ul li a#home {
	background: url(images/nav01-buttons.jpg) 0 0;
	width:214px;
}
#navLevel01 ul li a#uebersicht {
	background: url(images/nav01-buttons.jpg) -214px 0;
	width:115px;
}
#navLevel01 ul li a#portfolio {
	background: url(images/nav01-buttons.jpg) -329px 0;
	width:109px;
}
#navLevel01 ul li a#kontakt {
	background: url(images/nav01-buttons.jpg) -438px 0;
	width:95px;
}
#navLevel01 ul li a#ueber {
	background: url(images/nav01-buttons.jpg) -533px 0;
	width:74px;
}




#navLevel01 ul li a#suche {
	background: url(images/nav01-searchbox.png);
	width:74px;
}

#navLevel01 ul li a#home:hover, #navLevel01 ul li a#home.active {
	background: url(images/nav01-buttons.jpg) 0 -56px;

	width:214px;
}
#navLevel01 ul li a#uebersicht:hover, #navLevel01 ul li a#uebersicht.active  {
	background: url(images/nav01-buttons.jpg) -214px -56px;
	width:115px;
}
#navLevel01 ul li a#portfolio:hover, #navLevel01 ul li a#portfolio.active {
	background: url(images/nav01-buttons.jpg) -329px -56px;
	width:109px;
}
#navLevel01 ul li a#kontakt:hover, #navLevel01 ul li a#kontakt.active {
	background: url(images/nav01-buttons.jpg) -438px -56px;
	width:95px;
}
#navLevel01 ul li a#ueber:hover, #navLevel01 ul li a#ueber.active {
	background: url(images/nav01-buttons.jpg) -533px -56px;
	width:74px;
}


#navLevel01 ul li a#home:active {
	background: url(images/nav01-buttons.jpg) 0 -112px;
	width:214px;	
}
#navLevel01 ul li a#uebersicht:active {
	background: url(images/nav01-buttons.jpg) -214px -112px;
	width:115px;
}
#navLevel01 ul li a#portfolio:active {
	background: url(images/nav01-buttons.jpg) -329px -112px;
	width:109px;
}
#navLevel01 ul li a#kontakt:active {
	background: url(images/nav01-buttons.jpg) -438px -112px;
	width:95px;
}
#navLevel01 ul li a#ueber:active {
	background: url(images/nav01-buttons.jpg) -533px -112px;
	width:74px;
}

#navLevel01 ul li a span {
	display:none;
}



#navLevel01 ul#suche li  {
	float:right;
}

#navLevel01 ul#suche li input#suchbox {
	background: url(images/nav01-searchbox.png);
	width:81px;
	height:26px;
	border:0;
	margin:15px 3px 0 0;
	padding:0 5px;
	float:left;
	color: #999;
	font-size: 13px;
}

#navLevel01 ul#suche li input#suchbox:focus {
	outline: none;
}
	/*Anmerkung: Wenn Safari input type="image", dann muss image mit Attribut src angeben werden, sonst malt Safar eine graue Border ums background-image -> ich nehme an Sicherheitsfeature, fall Background-Image leer)*/
#navLevel01 ul#suche li a#suchButton {
	background: url(images/search-buttons.png) 0 0;
	width:30px;
	height:30px;
	border:0;
	display:block;
	margin:14px 15px 0 0;
	padding:0;
	float:left;
}
#navLevel01 ul#suche li a#suchButton:hover {
	background: url(images/search-buttons.png) 0 -30px;
}
#navLevel01 ul#suche li a#suchButton:active {
	background: url(images/search-buttons.png) 0 -60px;
}

#navLevel01 ul#suche li a#suchbutton span {
	color:red;
}

#navLevel01 ul#suche li input#suchbutton:visited {
	border:0;
}
#navLevel01 ul#suche li input#suchbutton:active {
	border:0;
}






	/* --- Begin navLevel02 --- */

#navLevel02 {
	margin:0 10px;
	background: url(images/nav02-bg-left.jpg) top left no-repeat;
	height:30px;
	margin-top:-4px;
	padding-bottom:14px;

}

#navLevel02 div {
	background: url(images/nav02-bg-right.jpg) top right no-repeat;
	height:40px;
}


#navLevel02 ul {
	list-style:none;
	margin:0;
	padding:0;
}
#navLevel02 ul li { /* leave no bad browser behind: IE7 */
	float:left;
}
#navLevel02 ul li a {
	display:block;
	height:30px;
	float:left;
	border:0;
}


/* über - h 0-121-275-325-439 */

#navLevel02 ul li a#bensitenet {
	background: url(images/nav02-ueber-buttons.jpg) 0 0;
	width:121px;
}
#navLevel02 ul li a#benediktmueller {
	background: url(images/nav02-ueber-buttons.jpg) -121px 0;
	width:154px;
}
#navLevel02 ul li a#webstandards {
	background: url(images/nav02-ueber-buttons.jpg) -275px 0;
	width:138px;
}
#navLevel02 ul li a#rss {
	background: url(images/nav02-ueber-buttons.jpg) -413px 0;
	width:64px;
}
#navLevel02 ul li a#trackback {
	background: url(images/nav02-ueber-buttons.jpg) -477px 0;
	width:110px;
}
#navLevel02 ul li a#rechtliches {
	background: url(images/nav02-ueber-buttons.jpg) -587px 0;
	width:124px;
}


#navLevel02 ul li a#bensitenet:hover, #navLevel02 ul li a#bensitenet.active {
	background: url(images/nav02-ueber-buttons.jpg) 0 -30px;
}
#navLevel02 ul li a#benediktmueller:hover, #navLevel02 ul li a#benediktmueller.active {
	background: url(images/nav02-ueber-buttons.jpg) -121px -30px;
}
#navLevel02 ul li a#webstandards:hover, #navLevel02 ul li a#webstandards.active {
	background: url(images/nav02-ueber-buttons.jpg) -275px -30px;
}
#navLevel02 ul li a#rss:hover, #navLevel02 ul li a#rss.active {
	background: url(images/nav02-ueber-buttons.jpg) -413px -30px;
}
#navLevel02 ul li a#trackback:hover, #navLevel02 ul li a#trackback.active {
	background: url(images/nav02-ueber-buttons.jpg) -477px -30px;
}
#navLevel02 ul li a#rechtliches:hover, #navLevel02 ul li a#rechtliches.active {
	background: url(images/nav02-ueber-buttons.jpg) -587px -30px;
}



#navLevel02 ul li a#bensitenet:active {
	background: url(images/nav02-ueber-buttons.jpg) 0 -60px;
}
#navLevel02 ul li a#benediktmueller:active {
	background: url(images/nav02-ueber-buttons.jpg) -121px -60px;
}
#navLevel02 ul li a#webstandards:active {
	background: url(images/nav02-ueber-buttons.jpg) -275px -60px;
}
#navLevel02 ul li a#rss:active {
	background: url(images/nav02-ueber-buttons.jpg) -413px -60px;
}
#navLevel02 ul li a#trackback:active {
	background: url(images/nav02-ueber-buttons.jpg) -477px -60px;
}
#navLevel02 ul li a#rechtliches:active {
	background: url(images/nav02-ueber-buttons.jpg) -587px -60px;
}










#navLevel02 ul li a span {
	display:none;
}



	/* --- End navLevel02 --- */


/* --- End header & nav --- */




/* --- Begin footer --- */

#footer {
	clear:both;
	padding-top:60px;
}

div#footer {
	background:url(images/footer-bg.jpg) 11px 60px repeat-x;
	
}
div#footer div {
	background:url(images/footer-bg-left.jpg) top left no-repeat;
}
div#footer div p {
	background:url(images/footer-bg-right.jpg) top right no-repeat;
	font-size:10px;
	color:#000;
	text-shadow:#fff 1px 1px;
	padding:2px 0 24px 0;
	text-align:center;
}



div#footer div p a, div#footer div p a:visited {
	color:#444;
	border-bottom:1px dotted #444;
}
div#footer div p a:hover {
	border-bottom:1px solid #444;
}
/* --- End footer --- */



/* --- Begin helper grid --- */
.grid {
	position:fixed;
	bottom:0;
	right:5px;
	color:#ccc;
	font-size:8px;
	font-family:sans-serif;
	margin:0;
	padding:0;
}
.grid a {
	text-decoration:none;
	color:#666;
}
.grid a:hover {
	text-decoration:none;
	background:#666;
	color:#fff;
	border-bottom:1px dotted #666;
}
/* --- End helper grid ---- */