/**************************************************
blue-bar version 1.0

This is a W3C compliant XHTML/CSS template.

You are free to use and modify it under the terms
of the Creative Commons Attribution 3.0 License.
This means you can use it however you want and all
you have to do in return is keep the link back to
my website "www.hewison.net" when you use it.

Please visit my site for more free templates to give
any feedback. I'd love to know if it has been useful
for you.

GLHF :)
**************************************************/

/*** COMMON HTML ***/

* {
	margin:0;
	padding:0;
}

body {
	font:70%/1.8em verdana;
	color:#333333; 
	margin:0;
	padding:0;
	background:url(images/header-bg.gif) repeat-x #FFFFFF ;	
}

a {
	color:#3C3C3C;
	text-decoration:none;
}

a:hover {
	color:red;
	text-decoration:underline;
}


h1 {
	font-family:Arial, 'Trebuchet MS', Sans-Serif;
	font-size:150%;
	color:#282671;	 		
	text-transform:uppercase; 
	letter-spacing:0.5em;
}

h2, h3 {
	font-family:Arial, 'Trebuchet MS', Sans-Serif;
	font-weight:bold;
	font-size:120%;
	color:#282671;
}

h2 {
	font-size:150%;
	letter-spacing:.2em;
	border-bottom:4px solid #BAC3E8;
}

h1, h2, h3, p {
	padding:0;		
	margin:10px;
}


blockquote {
	font-size:120%;
	width:85%;
	margin:10px 0 0 30px;
 	padding:0 10px 0 10px;
  	background:#F3F3FF;
	border:1px solid #E2E2FE;
}

/*** WRAPPER ***/

#wrapper {
	margin:0 auto; 
	width:780px;
}

/*** HEADER ***/

#header {
	position:relative;
	margin:0; padding:0;
	height:50px;
}

#header-logo {
	position:relative;
	clear:both;
	height:30px; 
	margin:0 0 20px 0;
	padding:0 0 10px 0;
}
#header-logo #logo {
	position:absolute;
	/* left:5px; */
	right:3px;
	font:bold 30px "trebuchet MS", Arial, Tahoma, Sans-Serif;
	margin:5px 0 0 0;
	padding:0;
	letter-spacing:10px;
	color:#000;
	top: 9px;
	width: 758px;
	height: 40px;
}

.logo-blue  {
	color:#BAC3E8;
}

.logo-white {
	color:white;
}

#header ul {
	position:absolute;
	list-style:none;
	top:20px;
	font:bold 15px 'Trebuchet MS', Arial, Sans-serif;
	letter-spacing:4px;
}

#header li {
   display:inline;
}

#header a {
   float:left;
   margin:0 10px 0 0;
   padding:2px;
   text-decoration:none;
   color:#282671;
   border-top:3px solid transparent;
}

#header a:hover {
   border-top:3px solid #282671;
}

#header form.search {
	position:absolute;
	right:0px;
	bottom:0px;
	margin:0;
	padding:0 0 10px 0;
	border:none;
	background-color:transparent; 
}

#header form.search input.textbox { 
	margin:0;
	width:120px;
	color:#333; 
	border:1px solid #CCCCCC; 
	background:#FFFFFF;
}

#header form.search input.submit {
	font:bold 100% Arial, Sans-serif;
	height:23px;
	width:60px; 
	margin:0;
	padding:1px;
	color:#333333;
	border:1px solid #CCCCCC; 
}

/*** SIDEBAR ***/

#sidebar {
	float:left;
	width:220px;
	margin:0; padding:0; 
	background-color:#FFFFFF; 	
}

#sidebar p {
	margin:0;
	padding:10px;
	text-align:justify;
}

#sidebar h1 {
	margin:10px 0 0 0; 
	padding:4px 0 6px 8px; 
	font:bold 105% Arial, Sans-Serif;
	color:#FFFFFF;
	text-transform:uppercase; 
	background:#667ACC; 
	letter-spacing:1px;	
}

#sidebar .sidebar-box {
	z-index:1;
	border-right:1px solid #E2E2FE;
	border-bottom:1px solid #E2E2FE;
	border-left:1px solid #E2E2FE;
}

#sidebar ul.sidebar-menu {
	list-style:none;
	margin:0 0 -1px 0;
	padding:8px 0 0 0;
}

#sidebar ul.sidebar-menu li {
	font-size:110%;
	border-bottom:1px solid #E2E2FE; 
	background:url(images/bullet-blue.gif) no-repeat 8px 10px;	
	padding:6px 5px 4px 25px;
	margin:0 2px 0 2px;
}

#sidebar ul.sidebar-menu a, p a {
	font-weight:bolder;
	color:#3C3C3C;
	background:none;
}


#sidebar form {
	padding:10px;
	margin:0;
  	background:#F3F3FF;
}

#sidebar form label {
	font-size:90%;
	display:block;
}

#sidebar form input {
	width:96%;
	border:1px solid #ddd;
	padding:4px;
	margin:2px 0 5px 0;
}

#sidebar form .submit {
	width:30%;
	font:bold 100% Arial, Sans-serif; 
	margin:0; 
	padding:2px; 
	color:#FFFFFF;
	background-color:#667ACC;
	border:1px solid #CCCCCC;
}


#sidebar form textarea {
	width:96%;
	border:1px solid #ddd;
	padding:4px;
	margin:5px 0 10px 0;
}

/*** CONTENT ***/

#content {
	float:right;
	margin:0 0 20px 0;
	padding:0;
	width:545px;	
}

.article-controls {
	text-align:right;
	margin:10px 10px 5px 10px; 
	padding:3px 0;
	border-bottom:2px dotted #EFF0F1;
}

.article-controls img { border:none; outline-style: none; }

.article-controls a.comment {
	padding: 0 20px 0 0;
  	background: url(images/comment.gif) no-repeat right top;
}

#content ul {
	margin:0 0 10px 40px;
}

#content ul li {
 	list-style-type:disc;
 	list-style-position:outside;
}

#content ol {
	margin:0 0 10px 40px;
}

#content ol li {
 	list-style-type:upper-roman;
 	list-style-position:outside;
}

#content p img {
	float:left;
	margin:0 10px 10px 0;
	border:none;
}

#content form {
	padding:5px;
	margin:5px;
  	background:#F3F3FF;
	border:1px solid #E2E2FE;
}

#content form label {
	font-size:90%;
	display:block;
}

#content form input {
	border:1px solid #DDDDDD;
	padding:4px;
	margin:2px 0 5px 0;
}

#content form textarea {
	width:98%;
	padding:4px;
	margin:2px 0 4px 0;
	border:1px solid #DDDDDD;
}

#content form .submit {
	width:30%;
	font:bold 100% Arial, Sans-serif; 
	margin:0; 
	padding:2px; 
	color:#FFFFFF;
	background-color:#667ACC;
	border:1px solid #CCCCCC; 
}

/*** FOOTER ***/

#footer {
	clear:both; 	
	text-align:center;
	padding:5px 0;
	border-top:2px solid #667ACC;
}

#footer a{
	margin:0;
	padding:0;
	text-decoration:none;	 		
	text-transform:none; 
	letter-spacing:0;
}

/*** END OF STYLESHEET ***/