/*
Theme Name: Comp-Fu
Theme URI: http://www.comp-fu.com
Description: Based on the Open Sourcerer theme (www.opensourcerer.com) by Alan Lord
Author: Stefan Ihringer
Author URI: http://www.comp-fu.com
Version: 1.0
Tags: dark, two-columns, flexible-width
License: GPLv3 or Later. (c) 2013 Stefan Ihringer (c) 2009 Alan Lord
*/

/**********
 * LAYOUT *
 **********/

body {
    min-width:30em;
}

/* Common padding inside containing divs. Do NOT add any height, borders or */
/* width to this element; it will almost certainly break IE6 */
.inside {
    padding:0.5em 1.5em;
}

.centeredwrap {
	clear: both;
    max-width:1100px;	
    margin: 0 auto;
    background-color: #161616;
}

#header {
    width:100%;
    height:200px;
}

#subheader {
	margin-right: 245px;
}

#content {
    float:left;
    margin-right:-235px;
    width:100%;
    margin-bottom: 0.5em;
    overflow:hidden;
	background-color:#161616;
}

#sidebar {
    float:right;
    width:234px;
    overflow:hidden;
    margin-bottom: 0.5em;
	background-color:#161616;
}

#footer {
    clear:both;
    overflow: hidden;
    padding: 1.5em;
}

.article, .archive {
	margin-right: 245px;
}



/********
 * MENU *
 ********/
 
#menu {
	width: 100%;
	background-color: #252525;
	background: url("../images/bgstripes.png");
	overflow: hidden;
	position: relative;
	border-top: solid 1px #161616;
	border-bottom: dashed 1px #333;
	clear: both;
}

#menu ul {
    clear:left;
    white-space: nowrap;
    list-style: none;
    margin:0;
    padding:0;
}

#menu ul li {
    display: block;
    float: left;
    list-style: none;
	border-bottom: none;
	padding-bottom: 1px;
}

/* unselected item */
#menu li a {
	display: block;
	padding: 7px 1em 0 .7em;
	margin: 0;
	min-height: 25px;
	float: left;
	font-weight: bold;
	font-size: 1em;
	color: #D1D1D1;
}

/* hover item */
#menu li a:hover {
	color: #a4bd2d;
}

/* current item */
#menu li.current_page_item {
	padding-bottom: 0;
	border-bottom: 1px dashed #a4bd2d;
	background-color: #161616;
}
#menu li.current_page_item a {
	color: #a4bd2d;
}

/* sub-menus */

#menu li ul {
    position:relative;
    left:0.5em;
}

#menu li ul li {
    font-size:95%;
}


/* search */

#topsearch {
	width: 224px;
	float: right !important;
	border-left: 1px dashed #333;
	padding-left: 10px !important;
}

#topsearch form {
	margin:0;
	padding:0;
}

#s {
	display: block;
	float: left;
	width: 154px !important;
	padding: 0.4em 10px;
	margin: 0 !important;
	background-color: #FFF;
	background: url("../images/search_box.png") no-repeat;
	border: none;
	font-weight: normal;
	font-size: 1em;
	color: #888;
}

#s:focus {
	color:#0F0C0B;
}

#submitBtn {
	display: block;
	width: 50px;
	padding: 0;
	margin: 0;
	border: 0;
	background-color: transparent;
	font-family: inherit;
	font-size: 1em;
	font-weight: bold;
	color: inherit;
	text-decoration:none;
	text-align:center;
	float:right;
	cursor:pointer;
	overflow:visible; /* removes extra side padding in IE */
}

#submitBtn span {
	display: block;
	min-height:25px;
	padding:7px 0 0 0;
	white-space:nowrap;
	position: relative;
}

#submitBtn:hover {
	color: #A4BD2D; /* #DCDAD5; */
}



/***********
 * CONTENT *
 ***********/
 
/*
comp-fu/bildfehler-Farbschema

orange: #e75c14;
grün: 	#a4bd2d;
blau:	#3AA0B9

bg dunkel: #161616;
bg heller: #252525;
*/

/* header */

#header {
	background:#0F0C0B url("../images/header.jpg") no-repeat 50% 50%;
	text-align:right;
	border:none;
}

#header p.bigheadline {
	font-size: 2.5em;
	font-weight: 200;
	margin: 3.5em 1em 0 0;
	text-shadow: #000000 2px 2px 0.2em;
}

#header p.description {
	font-size: 1.2em;
	margin: 2em 18px 0 0;
}

#header p.bigheadline a {
	color:#fff;
}



/* prev/next and category subheader */

#subheader {
	background:url(../images/bgstripes.png) repeat-x bottom left;
	padding: 0.8em 1.5em;
	color:#AAA;
	font-weight:normal;
}

#subheader small, .categories-nav {

}

#subheader .alignleft {
	max-width: 49%;
}
#subheader .alignright {
	text-align: right;
	max-width: 49%;
}

.categories-nav a:hover {
	color:#3AA0B9;
}

.posts-nav a:hover {
	color:#a4bd2d;
}

.categories-nav a {
	text-decoration: underline;
}



/* sidebar (widgets: see below) */

#sidebar {
	border-left: 1px dashed #444;
	font-size: 1em;
}

#sidebar h3 {
	font-size:1.3em;
}



/* article and content */

.article, .archive {
	background-color:#161616;
	color:#F0F0F0;
/*	font-size:1.1em;*/
	line-height:1.8em;
}

.article p, .archive p, .article ul, .article ol {
	margin-bottom:1.5em;
}
.article ol li {
	margin-bottom:0.5em;
}

/* text in columns */
.article p.column1, .article p.column2 {
	float:left;
	display:block;
	width:45%;
}
.article p.column2 {
	margin-left:2em;
}

.article h1, .archive h1.entry-title {
	background:url(../images/bgstripes.png) repeat left;
	margin-right:-.9375em;
	margin-left:-.9375em;
	padding:.5em .9375em;
	font-size:1.6em;
	font-weight:normal;
	line-height:1.3em;
}

.article h2, .article h3 {
	margin-top:2.5em;
	font-weight: normal;
	color: #a4bd2d;
}
/* h4 floated to look like inline text */
.article h4 {
	font-size: 1.0em;
	float: left;
	margin: 0 1em 0 0;
	font-weight: bold;
	color: #a4bd2d;
}

span.g {
	color: #A4BD2D;
}
span.r {
	color: #e75c14;
}



/* Links */

.article p a, .article li a, .article td a, .postmeta a {
	color: inherit;
	font-weight: normal;
	text-decoration: underline;
}
.postmeta a {
	color: #f7ce8c;
	font-weight: normal;
	text-decoration: underline;
}
.article p a:visited, .article li a:visited, .article td a:visited {
	color: inherit;
	font-weight:normal;
	text-decoration: none;
	border-bottom: 1px dashed;
}

/* no dashed border on images */
.article a.liimagelink:visited {
	border-bottom: none;
}
/* no dashed border on download links for tutorial page */
.article ul.horizontal li a:visited {
	text-decoration: underline;
	border-bottom: none;
}
.article p a:hover, .article li a:hover, .article td a:hover, .comments a:hover {
	color: #e75c14;
}
/* link in titles */
.article h1, .article h1 a {
	color:#a4bd2d;
}
.article h1 a:hover {
	color:#fff;
}



/* Images */

p img, .wp-caption img {
    position:relative; /* IE6 Hack */
    padding: 0;
    /* auto-fit images to column width */
    max-width: 100%;
    height: auto;
}

/* image alignment classes defined by Wordpress */
img.centered {
	display: block;
	margin-left: auto;
	margin-right: auto;
}
img.alignright {
	margin: 0 0 0.2em 1em;
	display: inline;
}
img.alignleft {
	margin: 0 1em 0.2em 0;
	display: inline;
}
img.alignnone {
	margin: 0.2em 0;
}
img.size-full, img.size-medium {
	/* rounded corners frame */
	padding: 6px;
	background-color:#222;
	border: 1px solid #666;
	border-radius: 3px;
}

/* captioned images (class defined by Wordpress) */
.wp-caption {
	border: 1px solid #666;
	text-align: center;
	background-color: #222;
	padding: 4px 4px 0 4px;
	margin: 0.5em 0 1.5em 0;
	border-radius: 3px;
	max-width: 100%;
	overflow: hidden;
}
.wp-caption img {
	padding: 0;
	border: 0 none;
}
.wp-caption p.wp-caption-text {
	font-size: 1em;
	margin: 0;
}



/* tutorial page: icon links */

.article ul.horizontal {
    list-style:none;
    margin:0;
    position: relative;
}
ul.horizontal li {
    display:block;
    float:left;
    list-style:none;
    margin:0 2em 1.5em 0;
}
li.icon_download a {
	display: block;
    min-height: 32px;
	padding: 4px 0 0 40px;
	background: url("../images/icon_download.png") no-repeat left -50px;
}
li.icon_video a {
	display: block;
    min-height: 32px;
	padding: 4px 0 0 40px;
	background: url("../images/icon_video.png") no-repeat left -50px;
}
li.icon_download a:hover, li.icon_video a:hover {
	color: #3AA0B9;
	background-position: left top;
}
ul.horizontal + p {
	/* paragraph following this ul */
	clear: both;
}



/* Related articles */

.related-posts, .article p.infobox {
	clear: both;
	background-color: #222222;
	border: 1px solid #666666;
	padding: 0 1em;
    margin-top: 2em;
    margin-bottom: 2em;
}
.related-posts ul, .related-posts ol {
	list-style-position: inside;
	list-style-type: none;
	margin: 0 0 0.5em 0;
}
.related-posts p {
	color: #a4bd2d;
	font-weight: bold;
	margin-bottom: 0.5em;
}
.related-posts ol li {
	margin-bottom: 0;
}
div.yarpp-related ol li a {
	font-size: 0.9em;
	font-weight: normal !important;
}



/* The Article's meta data */

.postmeta, small {
	font-size:0.9em;
}
.postmeta small {
	font-size:1em;
}

.postmeta {
	clear:both;
	color:#e75c14;
	margin-bottom:1.5em;
	padding-top:1em;
}

.postmeta a {
	color:#D7C1A6;
}

.postmeta .date {
	padding:2px 0 2px 20px;
	background: url(/_icons/date.png) no-repeat scroll left center;
}

.article blockquote {
	border-bottom:1px solid #9f4010;
	margin:2em 5em 2em 2em;
	padding:0;
	font-style:italic;
}
.article blockquote p:last-child {
	margin-bottom:0;
}


code {
	color:#D7C1A6;
	font-family:"Liberation Mono", Courier, Mono;
	font-size:1.0em;
	margin-left:2em;
	white-space: pre;
	overflow: auto;
}
span.code {
	color:#D7C1A6;
	font-family:"Liberation Mono", Courier, Mono;
}
pre {
	color:#D7C1A6;
	font-family:"Liberation Mono", Courier, Mono;
	font-size:0.91em;
	margin: 2em 0 2em 2em;
	overflow: auto;
}
/* remove pre styles when syntax highlighting is enabled */
.bwp-syntax-wrapper pre {
	color: inherit;
	font-family: inherit;
	/*font-size: inherit;*/
	margin: 0;
	overflow: auto;
}



/* Form Styling */
/* Style input boxes and buttons */

input[type="text"], textarea, select {
	color: #F0F0F0;
	border: 1px dashed #a4bd2d;
	background-color: #252525;
	padding: 5px;
}
fieldset {
	padding:0.5em;
	border-color:#D7C1A6;
	border-width:2px;
}



/* Comments */

h3#comments {
    font-weight:normal;
    margin-top:1em;
}
.commentmetadata {
	font-weight: normal;
	padding-bottom: 0.5em;
}
ul.commentlist {
    list-style: none;
    margin-left: 0em;
}
ul.commentlist li {
    background-color:#252525;
    padding:0.5em;
    border:solid 1px #252525;
    margin-bottom:0.5em;
}
/* highlight admin comments */
ul.commentlist li.bypostauthor {
	border-color: #a4bd2d;
}
.commentlist li .avatar { 
	float: right;
	border: 1px solid #DCDAD5;
	position:relative; /*IE6 Hack */
}
.commentlist p {
	font-weight: normal;
	line-height: 1.5em;
	text-transform: none;
}
#commentform textarea {
	width: 95%;
	height: 100px;
	overflow:auto; /* IE6 & 7 Need this */
}
#commentform code {
	white-space: normal;
	margin-left: 0;
}
/* unused? */
.comments .navigation {
    margin:0.5em 0 3.5em 0;
}




/* Language Icons */

.article p[lang="de"] {
	background:url("/_icons/de.png") no-repeat scroll left 5px;
	text-indent:20px;
}
.article p[lang="en"] {
	background:url("/_icons/gb.png") no-repeat scroll left 5px;
	text-indent:20px;
}

.article p[lang="cn"], .article p[lang="zh-cn"] {
	background:url("/_icons/cn.png") no-repeat scroll left 6px;
	padding:0 0 .5em 20px;
	border-bottom:1px solid #f00;
}



/* Footer */

#footer img {
    border: 0;
}

#ft_left {
    float: left;
}

#ft_centre {
    left:50%;
    bottom:1.2em;
	margin-left:-40px;
}

#ft_right {
    float: right;
}



/* Wordpress-specific styles */

/* Common Widget Styling */

.widget {
	width:100%;
	background-color:#161616;
	margin:0 0 0.5em 0;
}
.widget .inside {
	padding:0.5em;
	padding-left:10px;
}
.widget ul {
	list-style:none;
}
.widget ul li {
	margin-bottom:0.5em;
}
.widget a:hover {
	color:#3AA0B9;
}

/* Search Widget */

#searchform {
    padding:0;
    margin:0;
}
#searchform #s {
    width:140px;
	margin-right:0.5em;
}

/* Calendar Widget (unused) */

table#wp-calendar {
    margin:0 auto;
}
#wp-calendar caption {
    font-weight:bold;
    margin-bottom:0.5em;
}
#wp-calendar tbody, #wp-calendar thead {
    border:solid 1px #302724;
}    
#wp-calendar th, #wp-calendar td {
    padding:3px 4px;
    text-align:center;
}
#wp-calendar td a {
    padding:3px 4px;
    display:block;
    background:#DCDAD5;
    color:#1E1816;
    font-weight:bold;
}
#wp-calendar td a:hover {
    background:#1E1816;
    color:#DCDAD5;
}
#wp-calendar td#next a, #wp-calendar td#prev a {
    color:#DCDAD5;
    background:#1E1816;
}
#wp-calendar td#next a:hover, #wp-calendar td#prev a:hover {
    color:#FFF;
}

/* Tag Cloud */

#tag_cloud a {
    color:#D40000;
    margin:2px 3px;
}
#tag_cloud a:hover {
    color:#DCDAD5;
}