/* ######################################################################################################
** # WEB-LAYOUT (c) by grafikmaker.de (http://www.grafikmaker.de) #######################################
** ######################################################################################################
**
**  Theme Name	: easytheme by grafikmaker.de
**	Theme URI	: http://www.grafikmaker.de
**	Description	: easytheme at grafikmaker.de
**	Version		: 1.0
**  Author	    : Thomas Wernecke - grafikmaker.de - MEDIENGESTALTUNG PRINT & WEB
**	Author URI	: http://www.grafikmaker.de 
**
*/


@import url(cleanup.css);
/* CSS_FONTS */
@import url(fonts.css);



/*###################################################################
= Allgemine Formatierung
###################################################################*/
body, select, input, textarea { color:#444; }
a {text-decoration:none; color:#444;}
a:hover, a:active { outline: none; text-decoration:underline; }
a, a:active, a:visited { color:#000; }
small { font-size: 85%; }
strong, th { font-weight: bold; }
td, td img { vertical-align: top; }
sub { vertical-align: sub; font-size: smaller; }
sup { vertical-align: super; font-size: smaller; }
pre {
padding: 15px;
white-space: pre; /* CSS2 */
white-space: pre-wrap; /* CSS 2.1 */
white-space: pre-line; /* CSS 3 (and 2.1 as well, actually) */
word-wrap: break-word; /* IE */
}
textarea { overflow: auto; }
.ie6 legend, .ie7 legend { margin-left: -7px; }
input[type="radio"] { vertical-align: text-bottom; }
input[type="checkbox"] { vertical-align: bottom; }
.ie7 input[type="checkbox"] { vertical-align: baseline; }
.ie6 input { vertical-align: text-bottom; }
label, input[type=button], input[type=submit], button { cursor: pointer; }
button, input, select, textarea { margin: 0; padding:5px; }
/* Farben für Formularvalidierung */
input:valid, textarea:valid   {  }
input:invalid, textarea:invalid {
	border-radius: 1px;
	-moz-border-radius: 1px;
	-webkit-border-radius: 1px;
	box-shadow: 0px 0px 5px red;
	-moz-box-shadow: 0px 0px 5px red;
	-webkit-box-shadow: 0px 0px 5px red;
}
.no-boxshadow input:invalid,
.no-boxshadow textarea:invalid { background-color: #f0dddd; }
::-moz-selection{ background: #FF5E99; color:#fff; text-shadow: none; }
::selection { background:#FF5E99; color:#fff; text-shadow: none; } 
a:link { -webkit-tap-highlight-color: #FF5E99; } 
button {  width: auto; overflow: visible; }
.ie7 img { -ms-interpolation-mode: bicubic; }


/*###################################################################
= Grundlayout
###################################################################*/

html {
	text-align: center;
	background:url(../img/bg_html.png) no-repeat left bottom;
	/*Scrollbalken immer anzeigen*/
	overflow: scroll;
    overflow-x: auto;
	min-height: 100%; /* Mindesthöhe in modernen Browsern */
	height: auto !important; /* !important-Regel für moderne Browser */
	height: 100%; /* Mindesthöhe in IE (<7) */
	/*individuellen Cursor*/
	/*cursor:url(../img/layout/cursor.cur), default;*/
}

body { position: relative; background:url(../img/bg_body.png) no-repeat right top; }

a{ color:#000; text-decoration:none; font-weight:bold; outline:none;}
.clear{clear:both;}

.clearField { border:3px solid #F2B807; }
.clearFieldBlurred { color: #777; font-style: italic; }
.clearFieldActive { color: #000; border-color:#A6121F; }

input[type=button], input[type=submit], button { background:#F2B807; color:#fff; border:none; font-weight:bold; }
input[type=button]:hover, input[type=submit]:hover, button:hover{ background:#A6121F; }
input[type=text], textarea {  border-radius:10px; -moz-border-radius:10px; }
input[type=text]:actice, textarea:active { border:#A6121F; }

#contactform input.clearField, #contactform textarea.clearField { width:220px; margin:0 0 10px 0;}

.error {background: #FF8080;border-color:#F00}
.success {display:none;margin:10px;}

/* =Page
---------------------------------------------------------------*/

div#page {
	position: relative;
	width: 960px;
	margin: 0 auto 40px auto;
	padding: 0;
	text-align: left;
	font-size: 1.0em;
	background: transparent;
	/*overflow:hidden;*/
}


		
/* =Branding
---------------------------------------------------------------*/

div#branding{ width:100%; height:100px; margin:0 10px; position:relative; top:0;}
div#branding h1{ height:75px; width:396px; position:absolute; top:25px; left:0; text-indent:-99999px; }
div#branding h1 a { height:75px; width:396px; display:block; background:url(../img/logo_mediengestaltung.png) no-repeat 0 0; }
div#branding h1 a:hover { background-position:0 -75px; }
div#branding blockquote {position:absolute; text-indent:-99999px;}

#nav{ position:absolute; top:0; right:0; }
#nav li{ display:inline; margin:0 10px 0 0; }
#nav li a{ padding:5px 10px;font-weight:normal; color:#fff;background:#000; line-height:20px; }
#nav li a:hover, 
#nav li .active, 
#nav .current_page_item a, 
#nav li a.current_page_item{ background:#A6121F; color:#fff; text-decoration:none; }
/* #nav li a:active{background:#289bc6;} */

div#content{ margin:20px auto; padding:10px; width:100%; background:#f6f6f6 url(../img/trans_grey_20.png); border-radius:10px; -moz-border-radius:10px; }
div#content_main { float:left; width:520px; padding:30px; text-shadow:#fff 1px 1px 1px; color:#333; line-height:1.6em;}

#sidebar{ float:right; margin:0 auto; padding:44px; width:260px; background:#929091 url(../img/bg_sidebar.png); text-shadow:#fff 1px 1px 1px; color:#333; }
#sidebar h6{
	margin:0 0 5px 0;
	padding:5px 5px 4px 10px;
	background:#262223 url(../img/holz_dunkel_01.png) center center;
	color:#fff;
	text-transform:uppercase;
	font-weight:normal;
	border:3px solid #fff;
	border-radius:6px;
	-moz-border-radius:6px;
}
#sidebar .box { margin:0 0 15px 0; position:relative; }
#sidebar .box_body { padding:10px; background:url(../img/trans_grey_20.png); border-radius:10px; -moz-border-radius:10px; }

#sidebar #links.box ul { height:80px; }
#sidebar #links.box ul li { width:80px; height:80px; line-height:80px; position:absolute; top:0; background:url(img/button.png); }
#sidebar #links.box ul li.left { left:0; background-position:0 top; }
#sidebar #links.box ul li.center { left:90px; background-position:80px top; }
#sidebar #links.box ul li.right { right:0; background-position:160px top; }
#sidebar #links.box ul li a { display:block; width:80px; height:80px;}

#sidebar #ads.box ul {}
#sidebar #ads.box ul li { margin:5px 0; }
#sidebar #ads .box ul li.small { width:125px; height:125px; }
#sidebar #ads.box ul li.small.left { float:left; }
#sidebar #ads.box ul li.small.right { float:right; }
#sidebar #ads.box ul li.big { width:250px; padding:5px; background:url(../img/trans_grey_20.png); text-align:center; }


#categories{border-bottom:1px solid #000;line-height:21px;}
#categories li{display:inline;margin:0 5px 0 0;}
#categories li a{padding:5px;color:#000;text-transform:uppercase;font-weight:normal;}
#categories li a:hover, #categories li b{padding:5px 5px 4px 5px;background:#000;color:#fff;text-transform:uppercase;font-weight:normal;}
/* #categories li a:active, #categories li b:hover, #categories li b:active{background:#289bc6;} */

		

.post{margin:10px 0;padding:10px 0;}
.post h2 {
	background:#000 url(../img/holz_dunkel_01.png) center center;
	font-size:16px; line-height:30px; color:#F2B807;
	padding:5px 5px 5px 60px;
	margin:0 0 15px -60px;
	font-family:Zekton;
	border:5px solid #fff;
	border-radius:10px; 
	-moz-border-radius:10px;
	-webkit-border-radius:10px;
	/* 
	box-shadow: 1px 1px 15px #888;
	-moz-box-shadow: 1px 1px 15px #888;
	-webkit-box-shadow: 1px 1px 15px #888;
	*/
}
.post h2 a{ text-transform:uppercase; padding:3px 10px 6px 10px; font-weight:bold; font-size:24px; line-height:30px; color:#F2B807; }
.post h2 a:hover{ text-decoration:none; }
.post h1 small { margin:0 0 0 10px; font-size:0.8em; color:#666; }
.post p { margin:10px 0; text-align:justify; }
.post ul.author { margin:20px 0; padding:10px; border:2px dashed #666; }
.post ul.author li { margin:0; padding:0;}
.post ul.author li.fb-like { margin:5px 0 0 0; padding:0 0 0 54px;}
.post ul.author li img { float:left; margin:0 10px 10px 0; padding:1px; border:1px solid #666; background:#f6f6f6; }

div#comments { margin:25px 0 10px 0; }

div#footer { margin:0 10px; }	
div#site_info { margin:0 10px; font-size:0.8em; color:#666; text-align:right; height:20px; line-height:20px; }
div#site_info a { font-weight:normal; color:#666; }
div#site_info img { float:right; padding:0 0 0 5px;}