/********************************************
   AUTHOR:  			Erwin Aligam 
   WEBSITE:   			http://www.styleshout.com/
	TEMPLATE NAME: 	Bright Side of Life
   TEMPLATE CODE: 	S-0005
   VERSION:          1.0          	
 *******************************************/ 
 
/********************************************
   HTML ELEMENTS
********************************************/ 

/* top elements */
body { margin: 0; padding: 0; font: 0.7em/1.5em Verdana, Tahoma, Helvetica, sans-serif; color: #000; background-color: #8d1231; background-repeat: inherit; background-attachment: inherit; background-position: inherit; text-align: center; }

/***********************
	  Menü
************************/
/* ================================================================ 
This copyright notice must be untouched at all times.

The original version of this stylesheet and the associated (x)html
is available at http://www.cssplay.co.uk/menus/final_drop2.html
Copyright (c) 2005-2007 Stu Nicholls. All rights reserved.
This stylesheet and the assocaited (x)html may be modified in any 
way to fit your requirements.
=================================================================== */
/* style the outer div to give it width */
.menu { width:820px; font-size:0.85em; font-weight: bold; background-color: #8d1231; text-align: center; position: absolute; height: 31px; z-index:4    }
/* remove all the bullets, borders and padding from the default list styling */
.menu ul { float: left; padding:0; margin:0; list-style-type:none; }
.menu ul ul { width:135px; }
/* float the list to make it horizontal and a relative positon so that you can control the dropdown menu positon */
.menu li { width:135px; position:relative; float: left; }
/* style the links for the top level */
.menu a, .menu a:visited { display:block; font-size:11px; text-decoration:none; color:#fff; width:130px; height:30px; background:#8d1231; padding-left:10px; line-height:29px; }
/* a hack so that IE5.5 faulty box model is corrected */
* html .menu a, * html .menu a:visited {
width:150px;
w\idth:130px;
}
/* style the second level background */
.menu ul ul a.drop, .menu ul ul a.drop:visited {
background:#8d1231;
}
/* style the second level hover */
.menu ul ul a.drop:hover{
background:#000;
}
.menu ul ul :hover > a.drop {
background:#000;
}
/* style the third level background */
.menu ul ul ul a, .menu ul ul ul a:visited { background:#8d1231; }
/* style the third level hover */
.menu ul ul ul a:hover {
background:#8d1231;
}
.menu ul ul ul :hover > a {
background:#000;
}
/* 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;
}
/* 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:120px; 
top:0;
width:120px;
}
/* position the third level flyout menu for a left flyout */
.menu ul ul ul.left {
left:-120px;
}
/* style the table so that it takes no part in the layout - required for IE to work */
.menu table {position:absolute; top:0; left:0;}
/* style the second level links */
.menu ul ul a, .menu ul ul a:visited {
background:#8d1231; 
color:#000; 
height:auto; 
line-height:1em; 
padding:5px 10px; 
width:129px
}
* html .menu ul ul a{
width:150px;
w\idth:129px;
}
/* style the top level hover */
.menu a:hover, .menu ul ul a:hover{
color:#fff; 
background:#000;
}
.menu :hover > a, .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;
}
/* keep the fourth level hidden when you hover on second level list OR link */
.menu ul :hover 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;
}
/* make the fourth level visible when you hover over third level list OR link */
.menu ul :hover ul :hover ul :hover ul { 
visibility:visible;
}


/* links */
a { 
	color: #8d1231;
	background-color: inherit;
	text-decoration: none;
}
a:hover {
	color: #9EC068;
	background-color: inherit;
}

/* headers */
h1, h2, h3 { color: #333; font-size: 1em; font-family: Georgia, "Times New Roman", Times, serif; font-weight: bold; font-style: normal;fon;line-height: normal; t-variant: normal; }
h1 { font-size: 1.5em; color: #8d1231; } 
h2 { font-size: 1.4em; text-transform:uppercase;}
h3 { font-size: 1.3em; }

p, h1, h2, h3 {
	margin: 10px 15px;
}
ul, ol {
	margin: 10px 30px;
	padding: 0 15px;
	color: #8d1231;
}
ul span, ol span {
	color: #000; 
}

/* images */
img {
	border: solid 2px #fff;
}
img.no-border {
	border: none;
}
img.float-right {
  margin: 5px 0px 5px 15px;  
}
img.float-left {
  margin: 5px 15px 5px 0px;
}
a img {  
  border: solid 2px #fff;
}
a:hover img {  
  border: 2px solid #CCC !important; /* IE fix*/
  border: 2px solid #568EB6;
}

code { margin: 5px 0; padding: 10px; text-align: left; display: block; overflow: auto; font: 500 1em/1.5em "Lucida Console", "courier new", monospace;
  /* white-space: pre; */
  background: #e8dfbb; border-color: #f2f2f2 #f2f2f2 #f2f2f2 #8d1231; border-style: solid; border-width: 1px 1px 1px 4px; }
acronym {
  cursor: help;
  border-bottom: 1px solid #777;
}
blockquote { margin: 15px; padding: 0 0 0 20px; background: #e8dfbb; color: #8d1231; font: bold 1.2em/1.5em Georgia, "Bookman Old Style", Serif; border-color: #f2f2f2 #f2f2f2 #f2f2f2 #8d1231; border-style: solid; border-width: 1px 1px 1px 4px; }

/* form elements */
form {
	margin:10px; padding: 0;
	border: solid 1px #f2f2f2; 
	background-color: #e8dfbb; 
}
label {
	display:block;
	font-weight:bold;
	margin:5px 0;
}
input {
	padding: 2px;
	border:1px solid #eee;
	font: normal 1em Verdana, sans-serif;
	color:#777;
}
textarea {
	width:300px;
	padding:2px;
	font: normal 1em Verdana, sans-serif;
	border:1px solid #eee;
	height:100px;
	display:block;
	color:#777;
}
input.button { 
	margin: 0; 
	font: bold 1em Arial, Sans-serif; 
	border: solid 1px #ccc;
	background: #fff; 
	padding: 2px 3px; 
	color: #8d1231;	
}

/* search form */
form.searchform {
	background: transparent;
	border: none;
	margin: 0; padding: 0;
}
form.searchform input.textbox { 
	margin: 0; 
	width: 120px;
	border: solid 1px #408835; 
	background: #fff;
	color: #333; 
	height: 14px;
	vertical-align: top;
}
form.searchform input.button { 
	margin: 0; 
	padding: 2px 3px; 
	font: bold 12px Arial, Sans-serif; 
	background: #FAFAFA;
	border: 1px solid #f2f2f2;
	color: #777;	
	width: 60px;
	vertical-align: top;
}
/***********************
	  LAYOUT
************************/
#wrap { background-color: #e8dfbb; background-image: url(../images/paper_bg.jpg); background-attachment: scroll; width: 820px; height: 100%; margin: 0 auto; text-align: left; }
#content-wrap { background-color: #e8dfbb; clear: both; margin: 0; padding: 0; position: relative; top: 146px; z-index: 2; }

/* header */
#header { background-image: url(../images/headerphoto.jpg); background-repeat: no-repeat; background-attachment: scroll; background-position: 0 100%; position: relative; height: 146px; z-index: 1; }
/* main */
#main { float: left; margin-left: 15px; padding: 0; width: 50%; z-index: 3; }

.post-footer {
	background-color: #FAFAFA;
	padding: 5px; margin: 20px 15px 0 15px;
	border: 1px solid #f2f2f2;
	font-size: 95%;	
}
.post-footer .date {
	background: url(../images/clock.gif) no-repeat left center;
	padding-left: 20px; margin: 0 10px 0 5px;
}
.post-footer .comments {
	background: url(../images/comment.gif) no-repeat left center;
	padding-left: 20px; margin: 0 10px 0 5px;
}
.post-footer .readmore {
	background: url(../images/page.gif) no-repeat left center;
	padding-left: 20px; margin: 0 10px 0 5px;
}

/* sidebar */
#sidebar { float: left; width: 23%; z-index: 3; margin: 0; padding: 0; display: inline; }
#sidebar ul.sidemenu {
	list-style:none;
	margin:10px 0 10px 15px;
	padding:0;		
}
#sidebar ul.sidemenu li { margin-bottom:1px; }
#sidebar ul.sidemenu a {
	display:block;
	font-weight:bold;
	color: #000;	
	text-decoration:none;	
	padding:2px 5px 2px 10px;
	background: #e8dfbb;
	border-left:4px solid #408835;	
	
	min-height:18px;
}

* html body #sidebar ul.sidemenu a { height: 18px; }

#sidebar ul.sidemenu a:hover {
	padding:2px 5px 2px 10px;
	background: #e8dfbb;
	color: #000;
	border-left:4px solid #8d1231;
}

/* rightbar */
#rightbar {
	float: right;
	width: 23%;
	padding: 0; margin:0;		
}

/* Footer */
#footer { 
	clear: both; 
	color: #fff; 
	background: #8d1231; 
	border-top: 5px solid #408835;
	margin: 0; padding: 0; 
	height: 50px;	  
	font-size: 95%;		
}
#footer a { 
	text-decoration: none; 
	font-weight: bold;	
	color: #FFF;
}
#footer .footer-left{
	float: left;
	width: 65%;
}
#footer .footer-right{
	float: right;
	width: 30%;
}

/* alignment classes */
.float-left  { float: left; }
.float-right {	float: right; }
.align-left  {	text-align: left; }
.align-right {	text-align: right; }

/* additional classes */
.clear { clear: both; }
.green {	color: #408835; }
.gray  {	color: #BFBFBF; }