/*
Theme Name: an ordinary theme
Theme URI: http://www.blog.ordinary.ch/?page_id=269
Version: 2.3
Description: A simple theme with two corresponding random pictures in the header and a suckertree navigation thereunder. Optionally one or two columns. Two color schemes available. Widget ready. Please read the readme.txt file.
Author: Fabian Schmid
Author URI: http://www.blog.ordinary.ch/
Tags: one-column, two-columns, fixed-width, white, black, light
*/

/* STANDARDS */

body {
	display: block;
	background: #ffffff;
	color: #000000;
	font-family: Arial, Verdana, Helvetica, sans-serif;
	font-size: .75em;
}
table tr td {
	font-family: "Arial";
	font-size: 11px;
}
p {
	text-align: left;
}
h2 {
	margin: 0;
	color: #000000;
	font-size: 1.2em;
	text-transform: uppercase;
}
h3 {
	text-transform: uppercase;
}
a {
	color: #20807e;
	text-decoration: none;
}
a:hover {
	color: #a1a1a1;
}
img {
	border: none;
}
blockquote {
	padding-left: 30px;
	background: url("images/blockquote.jpg") no-repeat top left;
	font-style: italic;
}
.alignleft {
	text-align: left;
}
.alignright {
	text-align: right;
}
.aligncenter {
	text-align: center;
}

/* MAIN CONTAINERS */

#contentwrap {
	width: 910px;
	min-height: 480px;
	margin-top: 30px;
}
#left{
	float: left;
	width: 630px;
}
#right{
	float: right;
	width: 270px;
}

/* HEADER */
	
#titleanddesc {
	width: 800px;
	padding: 20px 1px 0 1px;
}
#blogtitle {
	float: left;
	text-align: left;
	color: #20807e;
	font-size: 11px;
	font-weight: bold;
	text-transform: uppercase;
}
#blogtitle a {
	text-decoration: none;
}
#blogdescription {
	float: left;
	color: #a9a9a9;
	font-size: 11px;
	text-transform: uppercase;
}
#leftbanner {
	clear: both;
	float: left;
	width: 305px;
	height: 377px;
}
#rightbanner {
	float: right;
	width: 605px;
	height: 377px;
}
#navigation {
	float: left;
	width: 794px;
	height: 17px;
	margin-top: 3px;
margin-bottom:20px;
}

/* LEFT (POST & ENTRIES) */

.posts{
	margin-right: 0;
}
.postdate {
	margin-top: 20px;
	color: #000000;
	font-size: 1.7em;
	font-weight: bold;
	text-transform: uppercase;
}
.pagetitle {
	margin-top: 20px;
	color: #000000;
	font-size: 1.7em;
	font-weight: bold;
	text-transform: uppercase;
}
.posttitle {
	font-size: 1.2em;
	font-weight: bold;
	text-transform: uppercase;
}
.posttitle a {
	color: #20807e;
	text-decoration: none;
}
.posttitle a:hover {
	color: #000000;
}
.category a {
	text-decoration: none;
	text-transform: lowercase;
}
.postmetadatabottom {
	width: 100px;
	margin: 0 0 0 10px;
	padding: 0;
	background: #DDDDDD;
	text-transform: uppercase;
}
.postmetadatabottom a {
	color: #000000;
	text-decoration: none;
}
.postmetadatabottom a:hover {
	color: #ffffff;
}
.entry {
	padding-bottom: 10px;
	font-family: Calibri, Arial, Verdana, Helvetica, sans-serif;
	/*border-bottom: 1px dotted #a9a9a9;*/
	font-size: 16px;
	line-height: 24px;
}
.entry ul, ol{
	margin-left: 25px;
	padding-left: 0;
}
.entry table tr td{
	font-family: Calibri, Arial, Verdana, Helvetica, sans-serif;
	font-size: 16px;
}

/* RIGHT (SEARCH & WIDGETS) */

.search {
	float: right;
	margin-top: 20px;
}
#searchsubmit {
	display: none;
}
#s{
	width: 250px;
	margin-bottom: 20px;
	padding: 1px 2px 1px 17px;
	background: #000000 url("images/magnifier-black.png") no-repeat top left;
	color: #ffffff;
	border: none;
}
.widgets{
	float: left;
	width: 270px;
	margin-bottom: 18px;
	border-top: 0;
}
.widgets ul{
	margin: 0;
	padding-left: 0;
	list-style-type: none;
}
.widgets ul li ul li{
	padding: 1px 4px;
}
.widgets ul li a{
	color: #000000;
	font-size: 12px;
	font-weight: bold;
	text-decoration: none;
	text-transform: uppercase;
}
.widgets ul li a:hover{
	background-color: #000000;
	color: #ffffff;
	cursor: pointer;
}
h2.widgettitle{
	padding: 1px 4px;
	background-color: #000000;
	color: #ffffff;
	border-top: 3px solid #000000;
	border-bottom: 3px solid #000000;
	font-size: 12px;
	font-weight: bold;
	text-decoration: none;
	text-transform: uppercase;
}
h2.widgettitle:hover{
	background-color: #000000;
	color: #ffffff;
	cursor: pointer;
}

/* FOOTER */

#navlink {
	clear: both;
	margin: 25px 0 25px 0;
	font-weight: bold;
	text-transform: uppercase;
}
#footer {
	width: 910px;
	padding: 0 1px 30px 1px;
	border-top: 3px solid #000000;
	font-size: 11px;
}
#footer a {
	font-weight: bold;
	text-decoration: none;
}	
#footerleft {
	float: left;
	text-transform: uppercase;
}
#footerright {
	float: right;
	color: #c11415;
	font-weight: bold;
	text-transform: uppercase;
}

/* COMMENTS */

#comments {
	clear: both;
	padding-top: 20px;
}
#comments h3{
	background: #DDDDDD;
}
.comment-info-split {
	clear: both;
}
.commentmetadata {
	text-transform: uppercase;
}
.commentlist div.alt {
	padding: 10px;
	background: #DDDDDD;
	color: #000000;
}
.commentlist div {
	padding: 10px;
}
.comment-div {
	display: block;
}
.comment-left {
	width: 30%;
}
.comment-right {
	width: 70%;
}


/** menu **/
.menubar {width:100%;	height: 30px;	text-align:center; width:100%; }

.menu {z-index:100; margin:0px auto; padding-top:9px; padding-bottom:10px; width:850px; text-transform: uppercase; position:relative; z-index:1}
/* hack to correct IE5.5 faulty box model */

/* remove all the bullets, borders and padding from the default list styling */
.menu ul {margin:0px; padding:0; list-style-type:none;}

.menu ul li{
display:inline; position:relative; z-index:1;
}

.menu ul ul {width:255px;background:#666633;}
/* float the list to make it horizontal and a relative positon so that you can control the dropdown menu positon */
.menu li {float:left;position:relative;}

.menu li.separator {
padding:7px 0px;
margin:0px;	
	}


/* style the links for the top level */
.menu a, .menu a:visited {
display:block; padding: 9px 15px; 
font-weight: 400;
color: black;
font-size: 12px;
font-family: Verdana, Arial, Helvetica, sans-serif;
letter-spacing:1px;
text-decoration:none;
}
.menu ul ul li{
	text-align:left;
}
.menu ul ul a, .menu ul ul a:visited {
font-weight: 400;
color: black;
font-size: 12px;
padding: 5px auto;
font-family: Verdana, Arial, Helvetica, sans-serif;
letter-spacing:1px;
}

/* style the second level background */
.menu ul ul a.drop, .menu ul ul a.drop:visited {background:#e58475;}
/* style the second level hover */
.menu ul ul a.drop:hover{background:#e58475;}
.menu ul ul :hover > a.drop {background:#e58475;}
/* style the third level background */
.menu ul ul ul a, .menu ul ul ul a:visited {background:#e58475;}
/* style the third level hover */
.menu ul ul ul a:hover {background:#e58475;}

.menu ul ul li{
	width: 150px;
}
/* hide the sub levels and give them a positon absolute so that they take up no room */
.menu ul ul {visibility:hidden;position:absolute;height:0;top:30px;left:0; width:150px; z-index:2000; background:#666633;}
/* another hack for IE5.5 */
* html .menu ul ul {top:30px;t\op:30px;}

/* position the third level flyout menu */
.menu ul ul ul{left:149px; top:-1px; width:150px;}

/* position the third level flyout menu for a left flyout */
.menu ul ul ul.left {left:-149px;}

/* style the table so that it takes no ppart in the layout - required for IE to work */
.menu table {position:absolute; top:0; left:0; border-collapse:collapse;}

/* style the second level links */
.menu ul ul a, .menu ul ul a:visited {background:#EDEDED; color:black; height:auto; padding:7px 10px;}
/* yet another hack for IE5.5 */
/* html .menu ul ul a, * html .menu ul ul a:visited {width:150px;w\idth:150px;} */

/* style the top level hover */
.menu a:hover{color:#fff;background: #000;}
.menu ul ul a:hover{color:#fff;background: #000;}
.menu :hover > a{color:#fff;background: #000;} 

.menu ul ul :hover > a {color:#fff; background: #000;}

/* make the second level visible when hover on first level list OR link */
.menu ul li:hover ul,
.menu ul a:hover ul{visibility:visible; }
/* keep the third level hidden when you hover on first level list OR link */
.menu ul :hover ul ul{visibility:hidden;}
/* make the third level visible when you hover over second level list OR link */
.menu ul :hover ul :hover ul{ visibility:visible;}

.menu ul li.liston a{
color: #333333;
}