/*
Theme Name: Design Journal
Theme URI: http://designjournal.org
Description: Design Journal theme - from scratch with LUV
Version: 2.3 – 01/2012
Author: Jan Hendrik Weiss
Author URI: http://imin.de

*/


/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
MAIN
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/

* { margin: 0; padding: 0; outline: none;}

body {
	font-size: 62.5%; /* 1em = 10px */
	font-family: Arial, Helvetica, sans-serif;
	background: #fff url('images/top-bg.jpg') repeat-x;
	color: #333;}

#page { display: block; width: 920px; margin: 0px auto;}

#header { display: block; width: 900px; height: 84px; background: #111; overflow: hidden;}

#wrapper { display: block; width: 920px; margin: 30px 0 10px 0; padding: 10px 0;}

#content, #content-single { 
	display: block; 
	float: left;
	width: 600px;
	padding: 0;
	background: #fff;
	font-size: 13px;
	border-right: 1px dotted #ddd;
}

#content-single { font-size: 13px; }

#sidebar {
	display: block; 
	float: right;
	width: 310px;
	margin-right: 6px;
	padding: 0px;
	background: #fff;
	font-size: 12px; 
}

#footer { 
	display: block;
	clear: both;
	border-top: 1px solid #ddd;
	background: #222;
	padding-bottom: 0px;
}


a:link, a:visited { text-decoration: none; color: #cc0000;}

a:hover { color: #2a407a; }

.clear { clear: both;}

img { border: none;}

ul { list-style: none}

/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
HEADER
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/

#title { display: block; height: 40px; padding: 0px 0 20px 0px; }

#title h1 {}

#logo { display: block; margin: 0; float: left; width: 86px; border-right: 1px dotted #222; }

#nav { display: block; float: right; margin: 42px 10px 0 0;}

ul#menu { display: block; height: 12px; list-style: none; float: right; margin: 0;}

ul#menu li { display: block; float: left; margin-right: 0px; }

ul#menu li a { display: block; float: left; margin: 0 18px 0 8px; height: 14px; padding: 1px 0 0 0; color: #777; font-size: 11px; font-weight: bold; border-bottom: 1px solid #111;}

ul#menu li a:hover, ul#menu li a.on { color: #eee; border-bottom: 1px solid #666;}
ul#menu li a:active {color: #fff;}

ul#menu li a.header-button { display: block; float: left; margin: 0 6px 0 0; opacity: .6; padding: 0;}
ul#menu li a:hover.header-button { opacity: 1.0;}


#aktuell { display: block; clear:both; height: 113px; margin: 20px 0 30px 0; border: 8px solid #eee; text-align: center;}

h1#inhalt {display: none;}

/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
SUCHE
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/

#suche { display: block; margin: 5px 0 0 0; height: 100px;}

#search_form { display: block;  }

#search_form .search_input { 
	display: block;
	width: 450px; 
	margin: 5px 4px;
	padding: 5px; 
	color: #777; 
	font-family: Arial, Helvetica, sans-serif; 
	font-size: 24px;
	border: 1px solid #ddd; 
	background: #eee;
}

#search_form .search_input:hover { 
	color: #444; opacity: 1.0; border: 1px solid #ccc;
}

	
/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
HEADLINES
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/

h2, h3, #content-single h2  { font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;  font-weight: bold; letter-spacing: -1px; font-size: 22px;}

h3 { font-size: 20px;}

h4 { display: inline; background: #888; color: #fff; padding: 4px 8px 4px 4px; font-size: 11px; font-weight: bold; text-transform: uppercase; -moz-border-radius: 2px; border-radius: 2px; -webkit-border-radius: 2px;}


/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
POSTS
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/

.teaserimage, .teaservideo, .entry img, .entry .video { display: block; width: 520px; height: 342px; margin: 0 0 20px 0; background: #ddd; border: 8px solid #eee; overflow: hidden;}

.entry .video { height: 390px; margin: 20px 0;}

.entry img { margin: 10px 0 0 0; height: auto;}

#slice { display: block; width: 520px; background: #ddd; border: 8px solid #eee; margin: 30px 0; padding-top: 25px;}

#slice img { border: none; margin: -25px 0 0 0; padding: 0; height: auto;}

small { display: block; margin: 5px 0 8px 1px; font-family: Arial, Helvetica, sans-serif; font-weight: bold; color: #333; text-transform: uppercase; font-size: 11px;}

small a { color: #d00;}

.entry {
	display: block;
	width: 534px;
	margin: 0px 2px 25px 0;
	line-height: 1.7em;
	text-align: justify;
	font-family: 'Droid Sans', Arial, Helvetica, sans-serif;
}

.entry p { display: block; line-height: 1.7em; padding: 0 2px; margin-bottom: 40px; }

p.text2, p.text3 { margin-top: 1.5em; margin: 25px 0 25px 0;}

ul.textliste {display: block; margin: 0px 0 30px 0;}
ul.textliste li { padding: 0 0 0 15px; background: url('images/circle.gif') no-repeat;}

p.text3 { margin-top: -30px; padding-bottom: 35px; border-bottom: 1px dotted #ddd; }

p.update, .update { background: #fbf6db; font-size: 12px; padding: 10px 5px; margin: 10px 0 10px 0; border: 1px solid #fdf4bf;}

p.zitat { background: #fafafa; padding: 20px; margin: 30px 0; font-family: 'Droid Serif', Georgia, "Times New Roman", Times, serif; font-size: 13px; font-style: italic; border: 2px solid #ddd; -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px; color: #444; line-height: 20px;}
p.zitat b {font-weight: normal; display: block; margin-top: 8px; color: #888; font-size: 10px;}

.entry a { background: #f8f8f8; color: #000; border-bottom: 1px dotted #d4d4d4; }

p.update a { background: #fbf6db; border-bottom: 1px dotted #888;} 

.entry a:hover { color: #cc0000;}

a.more-link, a.vialink, a.finallink { display: inline; padding: 4px 6px; line-height: 4.2em; background: #444; font-size: 11px; color: #eee; text-align: center; -moz-border-radius: 2px; border-radius: 2px; -webkit-border-radius: 2px; border: none; letter-spacing: 0px; font-family: Arial, Helvetica, sans-serif;}

a.finallink { margin: 0px 0 10px 0; border: none; font-weight: normal; font-size: 11px; background: #444; color: #eee;}

a:hover.more-link, a:hover.vialink, a:hover.finallink { background: #666; color: #fff;}

img.top { border: 8px solid #eee; }

.divide { display: block; width: 536px; height: 20px; margin: 10px 0; border-top: 1px dotted #ddd; }

#comments h3 { padding: 2px 0;}

#share { display: block; margin: 0 0 40px 2px;}

.tags { display: block; width: 532px; height: 20px; padding: 1px; background: #e8e8e8; border: 1px solid #d4d4d4; font-size: 11px; text-align: left; }

.tags em { display: block; float: left; padding: 4px 8px 4px 2px; color: #444; text-decoration: none; font-style: normal; font-weight: bold; border-right: 1px solid #ccc; }

.tags a { display: block; float: left; padding: 4px 6px; color: #666; border-right: 1px solid #ccc; }

.tags a:hover { background: #ddd; color: #444;}

a.headlink { display: block; background: #fff; margin: 2px 0 0 0; font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; font-size: 22px; font-weight: bold; letter-spacing: -1px; border: none;}

.post-navigation { clear: both; display: block; width: 534px; height: 20px; margin: 20px 0; padding: 1px 0px; background: #e8e8e8; border: 1px solid #d4d4d4; overflow: hidden; line-height: 1.1em;}

.post-navigation-prev a, .post-navigation-next a { display: block; float: left; width: 243px; margin: 0; font-size: 11px; color: #666; border-right: 1px solid #ddd;}

.post-navigation-next a { background: url('images/next-post.gif') top left no-repeat; padding: 4px 5px 4px 18px; border-right: 1px solid #ccc;}

.post-navigation-prev a { background: url('images/prev-post.gif') top right no-repeat; text-align: right;  padding: 4px 18px 4px 5px; border: none; float: right;}

.post-navigation-next a:hover { background: #ddd url('images/next-post.gif') no-repeat; color: #444;}

.post-navigation-prev a:hover { background: #ddd url('images/prev-post.gif') top right no-repeat; color: #444;}

h2 a:link, h2 a:visited { color: #333; font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;}
h2 a:hover { color: #555;}


/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
SIDEBAR
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/

.box, .box2, .box3, .box-google { display: block; width: 270px; margin: 0px 10px 40px 30px; padding: 0 0 20px 0; border-bottom: 1px dotted #ddd;}

.box2, .box-big, .box3 { border: none;}

.box img, .box2 img, .box3 img { display: block; width: 250px; margin: 0 0 20px 0; border: 8px solid #eee;}

.box img:hover, .box2 img:hover, .box3 img:hover { border: 8px solid #e4e4e4;}

.box3 img { margin: 0 0 5px 0;}

.box-big img { display: block; float: left; margin: 0 20px 20px 0; border: 8px solid #eee;}

.box-google { border: 8px solid #eee; width: 250px; padding: 0;}

#sidebar h4 { display: block; margin: 10px 0; padding: 0px; line-height: 2em; font-family: Arial, Helvetica, sans-serif; font-size: 12px; font-weight: bold; color: #555; zztext-transform: uppercase;}
#sidebar h3 { font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; font-size: 12px; font-weight: bold; color: #333; letter-spacing: 0px; zztext-transform: uppercase;}

#features-single { display: block; height: 210px; overflow: hidden;}

.interessant { display: block; margin: 0 0 20px 0;}

.box #features, .box-big #features2, .box #features-single { text-transform: uppercase; font-weight: bold; color: #222; line-height: 1.8em; font-size: 11px;}

.box #features img, .box-big #features2 img, .box #features-single img { margin-bottom: 5px;}

.box-big #features2 li { display: block; float: left; width: 270px; height: 240px; margin-right: 10px;}

/* twitter */

.aktt_tweets ul li { 
	display: block;
	width: 234px;
	margin: 0px 0px 15px 0px;
	padding: 10px;
	background: #f8f8f8;
	font-size: 11px;
	color: #444;
	line-height: 1.5em;
	list-style: none;
	border: 4px solid #eee;
}

.aktt_tweets ul li.aktt_more_updates { display: none;}

.aktt_tweets ul li a {  font-weight: normal; font-size: 10px;}

.aktt_tweets a { display: inline; font-weight: bold; text-decoration: underline; }

.aktt_tweets a:hover { color: #2a407a; text-decoration: none;}

a.follow-link, a.blogroll-link { 
	display: block;
	width: 75px;
	padding: 4px 3px; 
	margin: 15px 0px 20px 0px; 
	background: #444; 
	color: #eee; 
	font-size: 11px;
	text-align: center;
	-moz-border-radius: 2px; border-radius: 2px; -webkit-border-radius: 2px;
	font-family: Arial, Helvetica, sans-serif;
	letter-spacing: 0px;
}

a.blogroll-link { width: 50px;}

a:hover.follow-link, a:hover.blogroll-link { color: #fff; background: #666; }

a.aktt_tweet_time { display: none;}

/* Listen */

ul.boxlist, ul.boxlist2 { display: block; margin: 10px 0 0 0; padding: 0;}

ul.boxlist li, ul.boxlist2 li { display: block; padding: 5px 0; border-top: 1px dotted #ccc; line-height: 1.4em; font-size: 12px; }

ul.boxlist2 li { border: none; padding: 0 0 5px 0; margin: 0 0 15px 0;}

ul.boxlist li.evenItem, ul.boxlist2 li.evenItem { background: #f9f9f9;}

/* ul.boxlist li:hover { background: #f1f1f1; } */

ul.boxlist li em, ul.boxlist2 li em { display: block; color: #777; font-size: 0.9em; font-style: normal; }

ul.boxlist li a, ul.boxlist2 li a { display: block; font-weight: bold; color: #222; text-transform: uppercase;}

ul.boxlist li u, ul.boxlist2 li u { text-decoration: none; }

ul.boxlist li u a, ul.boxlist2 li u a { display: inline; font-weight: bold; color: #888; text-decoration: none; text-transform: uppercase;}

ul.boxlist li a:hover, ul.boxlist2 li a:hover { color: #cc0000;}

#content-register ul.boxlist2 li { width: 220px; height: 200px; float: left; margin: 0 5px 20px 0; }

#content-register ul.boxlist2 li img { width: 210px; height: 138px; border: 4px solid #eee; margin-bottom: 8px;}

#content-register ul.boxlist2 li a img:hover { border: 4px solid #ccc;}

/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
WEITERE ARTIKEL
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/

#weitere-artikel { display: block; width: 920px; margin: 30px 0; padding: 30px 0; background: #fff url('images/divide.gif') repeat-x; font-size: 12px; line-height: 1.8em; }

.spalte1, .spalte2, .spalte3 { display: block; float: left;  width: 305px; margin-right: 5px; padding: 0px;}

.spalte3 { width: 300px; margin: 0; border: none; float: right;}

#weitere-artikel ul { display: block; margin: 10px 0 20px 0; padding: 0 5px 0 2px;}

#weitere-artikel ul li { display: block; clear: both; height: 72px; padding: 3px 0; border-bottom: 1px dotted #ccc; line-height: 1.4em; font-size: 12px; }

#weitere-artikel ul li.evenItem { background: #f9f9f9;}

/* #weitere-artikel ul li:hover { background: #f1f1f1; } */

#weitere-artikel ul li em { display: block; color: #777; font-size: 0.9em; font-style: normal; }

#weitere-artikel ul li a { display: block; font-weight: bold; color: #222; text-transform: uppercase;}

#weitere-artikel ul li a:hover { color: #cc0000;}

a.weitere { display: block; margin-bottom: 20px; padding: 4px 2px; font-weight: bold; font-size: 11px; text-transform: uppercase; display: none;}


#weitere-artikel a.rubrik { color: #fff; }

#weitere-artikel h4 { background: #444;}
#weitere-artikel h4:hover { background: #666; }

img.minithumb {display: block; width: 104px; height: 68px; float: left; margin: 1px 10px 0 0; border: 1px solid #eee;}
img.minithumb:hover {border: 1px solid #ddd;}


/* +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
/* PAGEBAR														 */
/* +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */

#bottom-nav { clear: both; display: block; height: 40px; margin: 20px 18px; * height: 60px; }

.pagebar {
	display: block;
	height: 30px;
	/* float: left; */
	padding: 0;
	margin: 10px 0 20px 0;
	text-decoration: none;
	font-size: 12px;
	line-height: 30px;
	font-family: 'Droid Sans', Arial, Helvetica, sans-serif;
}

.pagebar a, .pageList .this-page, .pagebar a:visited, .pagebar .break {
	display: inline;
	margin: 0;
	padding: 6px 10px;
	text-decoration: none;
	background: #444;
	color: #eee;
	-moz-border-radius: 2px; border-radius: 2px;
	-webkit-border-radius: 2px;
}

.pagebar .break { margin-right: 4px; }

.pagebar .this-page, .pagebar a:hover {
	display: inline;
	margin: 0;
	padding: 6px 10px;
	background: #beb6b6;
	background-color: #111;
	color: #fff;
	-moz-border-radius: 2px; border-radius: 2px;
	-webkit-border-radius: 2px;
}


/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
INFORMATION, IMPRESSUM
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/

#content h3 { display: block; width: 520px; margin: 4px 0px; padding: 0 2px; }

p.infotext, .infotext { display: block; width: 536px; margin: 10px 2px 30px 2px; line-height: 1.8em; text-align: justify; font-family: 'Droid Sans', Arial, Helvetica, sans-serif; }

p.infotext a { font-weight: bold;}


/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
GOOGLE
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/

#ad1 { display: block; margin: 20px 0 40px 0;}

#textlinks { display: block; width: 540px; margin: 20px 0; padding: 10px 0 20px 0; }

/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
FOOTER
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/

#footer-text { display: block; background: #222; width: 910px; height: 10px; margin: 0 auto; padding: 20px 5px 60px 5px; font-size: 1.1em; color: #888; }

#footer p.left { display: block; float: left; width: 620px; line-height: 2.0em; }

#footer p.right { display: block; margin-top: 5px; float: right; width: 270px; text-align: right; }

#footer a { padding: 2px; color: #888; font-weight: bold;}

#footer a.feed, #footer a.twitter { display: block; float: left; height: 16px; padding: 0 0 0 21px; margin: 5px 18px 0 1px; background: url('images/feed-header.gif') 0px 0px no-repeat; line-height: 1.4em; opacity: .6;}
#footer a.twitter { background: url('images/twitter-header.gif') no-repeat; opacity: .6; }

#footer a:hover {color: #eee; opacity: 1.0; }



img.social_img { width: 25px; height: 25px; background: #fff;}

.social_bookmark a { display: none;}
.d a { display: block; float: left; margin-right: 5px;}
.d a:hover { opacity: .7;}

/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
NAVBOX
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/

#previouslinks a { display: block; width: 40px; height: 73px; background: #1e1e1e url('images/prev-link.gif') 20px center no-repeat; position: fixed; top: 45%; left: -15px; z-index:9; text-align: center; padding-top: 3px; border: 0px solid #f4f4f4;}
#nextlinks a { display: block; width: 40px; height: 73px; background: #1e1e1e url('images/next-link.gif') 5px center no-repeat; position: fixed; top: 45%; right: -15px; z-index:9; text-align: center; padding-top: 3px;}

#previouslinks a:hover { -webkit-transform: translate(10px,0); -moz-transform: translate(10px,0); -o-transform: translate(10px,0);}
#nextlinks a:hover { -webkit-transform: translate(-10px,0); -moz-transform: translate(-10px,0); -o-transform: translate(-10px,0); }

#previouslinks a, #nextlinks a { -moz-box-shadow: 0px 0px 2px rgba(0,0,0,0.15); -khtml-box-shadow: 0px 0px 2px rgba(0,0,0,0.25); -webkit-box-shadow: 0px 0px 2px rgba(0,0,0,0.25); box-shadow: 0px 0px 2px rgba(0,0,0,0.25);}


/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
SPEZIELLES
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/

/* Teaser */

#teaser { display: block; width: 900px; height: 400px; background: #000; margin: -40px 0 35px 0; border-bottom: 0px solid #222; overflow: hidden; }

.teaser-headline { display: block; float: left; position: relative; top: 328px; left: 10px; background: url('http://designjournal.org/teaser/teaser-headline-bg.png'); line-height: 24px; color: #fff; font-size: 24px; padding: 6px 10px 6px 6px; font-weight: bold;}

.teaser-headline2 { display: block; clear: both; float: left; position: relative; top: 330px; left: 10px; background: url('http://designjournal.org/teaser/teaser-headline-bg.png'); line-height: 13px; font-size: 11px; color: #ddd; padding: 3px 6px; font-weight: bold;}

.teaser-headline, .teaser-headline2 {border-radius: 2px; -moz-border-radius: 2px; -webkit-border-radius: 2px;}


/* CSS3 fancy pants */

#previouslinks a, #nextlinks a,
ul#menu li a, ul#menu li a:hover,
#footer a, #footer a:hover
{-webkit-transition: all 0.3s ease-in-out;-moz-transition: all 0.3s ease-in-out;-o-transition: all 0.3s ease-in-out; }

#previouslinks a, #nextlinks a
{-webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; opacity: .9;}



#error { display: block; width: 856px; height: 80px; margin-bottom: 40px; background: #ffc; font-size: 12px; border: 1px solid #ffb; padding: 20px; line-height: 1.5em;}

#error h4 { display: block; margin: 5px 0 5px -4px; font-family: 'Droid Sans', Arial, Helvetica, sans-serif; font-size: 20px; font-weight: bold; text-transform: none; background: #ffc; color: #222; letter-spacing: -1px;}

/* ::-webkit-scrollbar-thumb:vertical { height:10px; background-color:#eee; }
::-webkit-scrollbar { width:10px; height:5px; background:#fff; margin-right:5px; border-left: 1px solid #fff; } */
