/*
Theme Name: Spitfire Site
Theme URI: http://spitfiresite.com/
Description: Spitfire Site is custom-built blog theme with two column layout. Right hand sidebar supports widgets. Tags and gravatars supported.
Version: 1.0
Author: Martin W
Author URI: http://episode2.org
Tags: fluid width, variable width, blue, white, rounded corners, two columns, right sidebar, widgets, newsletter, cms

The CSS, XHTML and design is released under GPL:
http://www.opensource.org/licenses/gpl-license.php
*/

/* Spitfiresite.com */

/* Basic color set
Page background: 		#fffdf9

Text color:		 		#505050
Text color, h1, h2:		#003366
Text color, h3:			#303030

Roundel Blue:    		#003165
Roundel Red:	 		#9a0000
Roundel Yellow:	 		#ffca00

Shade 1 (light blue):	#ecf4ff
Shade 2 (grey even):	#f6f6f6
Shade 3 (grey odd):		#ecedf3

*/

/* General page layout 
   ========================
*/

body { 
	margin:0;
	padding:0;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 0.8em; 
	text-align: center;
    background-color: #fffdf9; 
    color: #505050;
}

div.body {	
	width: 96%;
	min-width: 944px;
	max-width: 1280px;
	text-align: left;
	margin: 0 auto;
}

* html .body {
	height: 200ex; 
	}

/* Nameplate
   ========
*/

div.nameplate {
	padding: 0;
	background: #FFF url(/styleguide/spitfire_site_logo_middle.gif) repeat-x top;
	height: 64px;
}

div.nameplate .logo_lefts { 
	background: transparent url(/styleguide/spitfire_site_logo_left.gif) no-repeat left; 
	float: left;
	height: 64px; 
	width: 220px;
}

div.nameplate .logo_rights {
	background: transparent url(/styleguide/spitfire_site_logo_right_bob_70_years.gif) no-repeat right;
	float: right;
	height: 64px;
	width: 580px;
	margin-left: -220px;
}

div.nameplate h1 {
	font-size: 0.5em; 
   	display: none;
}

div.nameplate h2 {
	font-size: 0.4em; 
   	display: none;
}

/* 3-column layout
   ===============
   Basic breakdown of the page into columns (panes) below the nameplate.
   First, the page is fomred into two columns (panes): 

   #navigation_pane (left column)
   #content_pane    (main content column)

   The content pane can be used as is, or divided further into
   
   #right_column    (narrow column to the right for links, sidebars, tag cloud etc.)
   #left_column     (main content area)
*/

#navigation_pane {
   	margin: 7px 0 15px 0; 
	width: 11.25em;
	float: left;
	margin-right: 8px;
	text-align: left;
}

#content_pane {
    margin: 7px 0 15px 12em; /* left margin equals the witdh of navigation pane + 0.75 em */
	padding-left: 0.75em;
	border-left: 1px solid #c0c0c0;
}

#right_column {
   	margin: 0 0 0 0; 
	text-align: left;
	width: 20%;
	float: right;
    word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
    overflow: hidden;      /* fix for long non-text content breaking IE sidebar float */
	/* border: 1px solid green; */
}

#left_column {
    margin: 0 0 0 0; 
	padding-right: 0.2em;
	text-align: left;
	width: 78%;
    word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
    overflow: hidden;      /* fix for long non-text content breaking IE sidebar float */
	/* border: 1px solid red; */
}

/* Header and footer 
   =================
   Page header and footer go into the #content_pane
*/

div.page_header {
	margin: 0 0 1em 0;	
	text-align: center;
}

div.page_footer {
	margin: 1em 0 0 0;	
	text-align: center;
	clear: both;
}
	
/* Page heading styles
   ===================
   
   Useful if a page does contain something else than a single post, 
   for example for archive pages.
*/

div.page_kicker {
	/* Same as div.kicker */
}	

div.page_headline {
	/* Same as div.headline */
}

div.page_byline {
	/* Similar to  div.byline */
	font-size: 85%; 
	line-height: 1.25;
    margin-top: 1em;
    padding-bottom: 1em;
    border-bottom: 1px dotted #bbb;
    
    padding-left: 20px; 
	background-image: url('/styleguide/sense-tag.gif');
	background-repeat: no-repeat;
	background-position: left top;

}

.page_byline span.subcategories {
	/* Display subcategory list is a separate line */
	/* display:block; 
	clear:both; 
	padding-top:1em; */
}

.page_byline span.subcategories span.separator {
	/* Display subcategory list is a separate line */
	/* display:none; */
}

div.page_deck {
	text-align:justify;
	line-height: 1.4;
	margin-left: 1.6em;
}

div.page_subheading {
	/* This style is used on archive pages to separate groups of posts */
	clear: both;
}
	
/* Navigation bar
   ==============
   Navigation bar at the top of the content pane - for menus, breadcrumbs etc.
*/	

div.navigation_bar { 
	margin: 1em 0 1em 0;
	padding: 0 0 0.5em 0;
	line-height: 1.25em;
	height: 1.5em;
	white-space: nowrap;
	width: auto;
	border-bottom: 1px solid #c0c0c0;
	
	font-size: 85%;    /* 11px */
	text-align: left;
}

/* Navigation pane styles
   ======================
   List styles for the navigation pane, where the main navigation menu is to be placed
*/	

#navigation_pane * {
	margin: 0;
	padding: 0;
}

#navigation_pane h3 { 
	line-height: 1.25em;
	white-space: nowrap;
	list-style-type: none;
	width: auto;
	border-bottom: 1px solid #c0c0c0;
	
	font-size: 92%;  /* 12 px */
	font-weight: bold;
	padding: 0.25em; /* 3px; */
	color: #909090; 
	
	text-indent: 18px; 
	background: #eaeaea url('/styleguide/bullet_roundel_grey_4.gif') no-repeat left;
	background-position: 4px center;
}

#navigation_pane li { 
	line-height: 1.25em;
	white-space: nowrap;
	list-style-type: none;
	width: auto;
	border-bottom: 1px solid #c0c0c0;
	
	font-size: 92%;    /* 11px */
    margin: 0;
	padding: 3px;
	color: #808080;
	
	text-indent: 2px; /* 16px */
}

#navigation_pane #selected {
	background: #9a0000;
    color: #ffffff;
}

#navigation_pane #selected a	{
	color: #ffffff; 
	text-decoration: underline;
} 

#font-family #selected a:link	{
	: #ffffff; 
	text-decoration: underline;
} 

#navigation_pane #selected a:visited	{
	color: #ffffff; 
	text-decoration: underline;
} 

/* Post layout styles
   ==================
*/

/* Wrapper divs for single, archive, page and index pages 
   Each of these divs surrounds the entire Loop output on the corresponding page. 
   The purpose of these wrappers is to provide context to other post elements, 
   for example to differentiate styling of posts between different pages. Example:
   .index div.content { display: none; }
*/
div.single {
	/* border: 1px solid green; */
	clear:both;
	/* margin-top: 2em; */
}

div.archive {
	/* border: 1px solid green; */
	clear:both;
	/* margin-top: 2em; */
}

div.page {
	/* border: 1px solid green; */
	clear:both;
	/* margin-top: 2em; */
}

div.index {
	/* border: 1px solid green; */
	clear:both;
	/* margin-top: 2em; */
}


.teaser img {
	padding: 6px;
	border: 1px solid #c0c0c0;
	margin: 0 0 1em 0;
	background-color: #fffdf9;
	/* width: 180px; */
	/* height: 120px; not setting height allows us to retain image proportions */
}

div.kicker {
}

div.headline {
}

h1
{
    /* font-family: Arial, Helvetica;
    font-size: 169%;   
    font-weight: bold;
    */

    font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif;
    font-size: 1.8em;
    font-weight: normal;

    color: #003366;
    margin-top: 0; 
    margin-bottom: 0;
    text-align: left
}

h2
{
    /* font-family: Arial, Helvetica;
    font-size: 138%;   
    font-weight: bold; */
    
    font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif;
    font-size: 1.4em;
    font-weight: normal;

    color: #003366;
    margin-top: 0px;
    margin-bottom: 0px;
    text-align: left
}


div.byline, p.byline {
    font-size: 85%; 
	line-height: 1.25em;
    margin-top: 1em;
    padding-bottom: 1em;
    border-bottom: 1px dotted #bbb;
}

.byline .category .separator {
	/* Decorate category byline with preceding icon */
    padding-right: 18px; 
    margin-right: 2px;
	background-image: url('/styleguide/sense-tag.gif');
	background-repeat: no-repeat;
	background-position: right center;
}

.byline .comments .separator {
	/* Decorate category byline with preceding icon */
    padding-right: 18px; 
    margin-right: 2px;
	background-image: url('/styleguide/sense-comment.gif');
	background-repeat: no-repeat;
	background-position: right center;
}

.byline a {
	font-weight: normal;
}

div.endsign {
	clear: both;
	height: 7px;
	width: 40px;
	border-bottom: 1px dotted #bbb;
	/* background-color: #505050; #b6cad7; matching the sense bitmaps */
}

div.continue
{
	/* Decorate continue link with preceding icon */
    padding-left: 20px; 
	background-image: url('/styleguide/sense-arrow-right.gif');
	background-repeat: no-repeat;
	background-position: left 0.15em;
}

div.continue a
{
	font-weight: normal;
}

div.jumpline
{
	border: 1px dotted #bbb;	
	padding: 0.4em 1em 0.4em 1em;
	margin: 1em 0 1em 0;
	text-align: right;
	clear: both;
}

.jumpline a
{
	font-weight: normal;
}


div.excerpt {
	font-size: 100%;
	line-height: 1.6;
	text-align: left; 
	margin-top: 1em;
	/* margin-bottom: 1em; */
}


/* Content styles
   ==============	
   Styles for body copy
*/

div.content {
	font-size: 100%;
	line-height: 1.6;
	text-align: justify; /* consider this */
}

.content a {
	font-weight: bold;
}

.content p {
}

.content ul
{
    line-height: 1.6;
	margin-bottom: 1em;
	list-style-type: square;
}

.content ol
{
    line-height: 1.6;
	margin-bottom: 1em;
}

.content li {
	/* margin-top: 1em; */
}

/* Subheadings within body copy.
Use <h3> as basic subheading tag. */

h3, h4, h5, h6 {
    /* font-family: Tahoma, Arial, Helvetica;
	font-size: 108%; 
    font-weight: bold; */

	font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif;
	font-size: 1.4em;
	font-weight: normal; 

    color: #303030;
    text-align: left
}

/* Images within body copy */

.content img, .content object {
	display: block;
}

.content .image img, .content .wp-caption img, .content .image object {
	display: inline; 
}

.content img, .content .image img, .content .wp-caption img, .content object, .content .image object {
	clear: both;
	margin-left: auto;
	margin-right: auto;
	padding: 6px;
	border: 1px solid #c0c0c0;
	margin-top: 1px;
	margin-bottom: 1px;
	max-width: 98%; /* Make the image scale down to the available width of text column */
}

/* Horizontal line for body copy */

.content hr {
    color: #c0c0c0;
    height: 1px;
	border: none 0; 
	border-top: 1px solid #c0c0c0;
	height: 1px; 
}    

/* Tables for body copy */

.content table
{
	font-size: 100%;
	line-height: 1.25;
	empty-cells: show;
	border-collapse: collapse;
	border: 0;
	padding: 0;
	margin-top: 0;
	margin-bottom: 0;
	margin-left:auto;
	margin-right:auto;
}

.content tr {
}

.content td {
	border: 1px solid #c0c0c0;
	padding: 0.3em;
	margin: 0;
} 

.content table ul {
    line-height: 1.25
}

.content table ol {
    line-height: 1.25
}

/* Ad styles
   ============================
*/

div.ad {
	
}

div.ad_inline {
	/* Inline ad within the body copy */
}

div.ad_sidebar {
	/* Framed ad within the body copy */
	margin-top: 1em;
	margin-bottom: 1em;
	padding: 10px 10px 10px 10px;
	border: 1px #c0c0c0 solid;
	border-radius: 8px;
	background:#ECF4FF;
} 




/* Remaining post layout styles 
   - items at the bottom of page
   ============================
*/

div.signature {
	/* Similar in character to  div.byline */
	/* font-size: 85%; */
	font-size: 85%;
	line-height: 1.25;
    margin-top: 2em;
    margin-bottom: 1em;
    
    padding-left: 20px; 
	background-image: url('/styleguide/sense-comment.gif');
	background-repeat: no-repeat;
	background-position: left top;
}

/*  Wordpress comments.
	CSS classes follow the styles applied by wp_list_comments function
	===================
 */
 
div.related_posts {
	margin-left: 20px;
	margin-top: 5em;
	margin-bottom: 0.75em;
	padding: 0.5em 1em 0.5em 1em;
	border: 1px #c0c0c0 solid;
	border-radius: 8px;
	line-height: 1.6;
	background:#ECF4FF;
	/* background:#E6F3FF; */
} 

.related_posts h3 {
	/* Similar to  .comment-author */
	font-size: 100%; 
	line-height: 1.25;
    margin-top: 1em;
    padding-bottom: 1em;
    border-bottom: 1px dotted #bbb;
    
    padding-left: 20px; 
	background-image: url('/styleguide/sense-profile.gif');
	background-repeat: no-repeat;
	background-position: left top;
}

.related_posts a {
	font-weight:normal;
	/* font-size: 85%; */
}


div.comments {
	padding-left: 20px;
}

.comments h3 {
	/* font-size: 100%; */
}

.comment, .pingback {
	margin-top: 0.75em;
	margin-bottom: 0.75em;
	padding: 0.5em 1em 0.5em 1em;
	border: 1px #c0c0c0 solid;
	border-radius: 8px;
	line-height: 1.4;
}

.even {
	background:#F6F6F6;
}

.odd {
	background:#ECEDF3;
}

.comment-author {
	/* Similar to  div.byline */
	font-size: 85%; 
	line-height: 1.25;
    margin-top: 1em;
    padding-bottom: 1em;
    border-bottom: 1px dotted #bbb;
    margin-right: 40px;
    
    padding-left: 20px; 
	background-image: url('/styleguide/sense-comment.gif');
	background-repeat: no-repeat;
	background-position: left top;
}

.comment-meta{
	/* Similar to  div.byline */
	font-size: 85%; 
	display:inline;
}

.comment-author img {
	float:right;
	margin-right: -40px;
}

div.comment_form {
	padding-left: 20px;
}

.comment_form h3 {
	font-size: 100%;
}



/* Span styles */

.read_more {
/* Span for Read more... link of the_content() */		
}

.undecorated {
/* Enables removal of bold links */
}

.undecorated a {
	font-weight: normal;
}

/* Post style: archive_post
   ===============================
   Definition of post style for archive pages 
   Given through differences from default layout
*/   

div.archive_post {
	clear:left;
    margin: 0.5em 1em 0.5em 0;
    padding-left: 206px; /* space for thumbnail image to the left of the text */
    min-height: 132px;
    line-height: 1.25;
}

.archive_post .teaser {
	/* For archives, images should be displayed as thumbnails to the left  */
	margin: 0 0 0 -206px;
	float: left;
	position: relative; /* Fix for float negative margin bug in IE6 */
	display:inline;		/* Fix for double negative margin on float bug in IE6 */
}

.archive_post .teaser img {
	/* Thumbnails will be set to fixed size 180*120px; */
	width: 180px;
	height: 120px;
	margin: 0;
}

.archive_post .headline {
	padding-top: 36px;
    line-height: 1.25;
}

.archive_post .headline h1 {
	/* show this heading inline to allow additional text to be placed following the header */
	display: inline; 
    font-family: inherit;
    font-size: 100%;    
    font-weight: bold;
}

.archive_post .kicker {
	display: none;
}

.archive_post .kicker h2 {
    font-family: inherit;
    font-size: 100%;
    font-weight: normal;
}

.archive_post .byline {
	font-size: 100%;
    margin-top: 0.2em;
    padding-bottom: 0;
    border: 0;
	line-height: 1.25;
}

.archive_post .byline .author {
	display: none;
}

.archive_post .byline .date {
	display: none;
}

.archive_post .byline .comments {
	/* Decorate category byline with preceding icon */
    padding-left: 20px; 
	background-image: url('/styleguide/sense-comment.gif');
	background-repeat: no-repeat;
	background-position: left center;
}

.archive_post .byline .category {
	display: none;
}

.archive_post .byline .tags {
	display: none;
}

.archive_post .byline .separator {
	display: none;
}

.archive_post .signature {
	display: none;
}

.archive_post .excerpt {
	margin-top: 0.25em;
	margin-bottom: 0em;
	line-height: 1.25;

}

.archive_post .content {
	display: none;
}

/* Post style: index_post
   ===============================
   Definition of post style for the index page 
   Given through differences from default layout
*/

.index h3 {
	/* Resemble font style for h1 */
    /* font-family: Arial, Helvetica;
    font-size: 169%;   
    font-weight: bold; */
    
	font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif;
	font-size: 1.6em;
	font-weight: normal;
    
    color: #003366;
    text-align: left;
    padding-bottom: 0.2em;
    border-bottom: 1px dotted #bbb;
    margin: 0;
}

div.index_post {
	margin-top: 1em;
	margin-bottom: 0; /* 0.5em; */
	padding-left: 1.4em;
    line-height: 1.25em;
}

.index_post .teaser {
	text-align: left;
	float:right;
	margin-left: 1em;
	margin-bottom: 0.5em;
	/* width: 38%; */
}

.index_post .teaser img {
	/* Thumbnails in lists, should be set to size 180*nnn px; */
	width: 360px; /* 94%; 240-270 px */
	height: auto;
}

.index_post .headline {
	display: list-item;
	list-style-type: disc;
	list-style-position:outside;
}

.index_post .headline h1 {
    font-family: inherit;
    font-size: 100%;    
    font-weight: bold;
}

.index_post .kicker {
	display: none;
}

.index_post .kicker h2 {
    font-family: inherit;
    font-size: 100%;
    font-weight: normal;
}

.index_post .excerpt {
	margin-top: 0.2em;
	margin-bottom: 0em;
	line-height: 1.25em;
}

.index_post .byline {
    font-size: 100%;
	margin-top: 0.2em;
	margin-bottom: 0em;
	border: 0;
	
}

.index_post .byline .separator {
	/* display: none; */
	/* Hide all separators in the byline, only comments will be displayed. */
}

.index_post .byline .author {
	/* display: none; */
}

.index_post .byline .date {
	/* display: none; */
}

.index_post .byline .comments {
	/* Decorate comments byline with preceding icon */
    padding-left: 20px; 
	background-image: url('/styleguide/sense-comment.gif');
	background-repeat: no-repeat;
	background-position: left center;
}


.index_post .byline .category {
	/* display: none; */
	/* Decorate category byline with preceding icon */
    padding-left: 20px; 
	background-image: url('/styleguide/sense-tag.gif');
	background-repeat: no-repeat;
	background-position: left center;
}

.index_post .byline .tags {
	/* display: none; */
}

.index_post .signature {
	display: none;
}

.index_post .content {
	display: none;
}

/* Post style: single_post
   ===============================
   Definition of post style for the single post page 
   Given through differences from default layout
   TODO: For this style, perhaps there should be NO defferences from the default?
*/


.single_post .teaser {
	display: none;
}

.single_post .headline h1 a	{
    color: #003366;
	text-decoration: none;
} 

.single_post .headline h1 a:link	{
    color: #003366;
	text-decoration: none;
} 

.single_post .headline h1 a:visited	{
    color: #003366;
	text-decoration: none;
} 

.single_post .headline h1 a:hover	{
	color: #003366; 
	text-decoration: underline;
} 

.single_post .headline h1 a:active	{
	color: #336699;
	text-decoration: underline;
} 

.single_post .excerpt {
	font-style: italic;
	display: none;
}

/* TODO: FROM HERE */


/* Article footer */

p.footertext		
{
    /* font-family: Arial, Helvetica; */
    font-size: 85%;  // 11px
    text-align: left;
    line-height: 1.25
}	

p.footertext a
{
	font-weight: normal;
}

/* Body text styles.
Ordinary classless <p> or <div class="body_text"> 
can be used interchangeably as basic wrappers for body text */




blockquote
{
	/* font-style: italic ; */
	background-color: #eaeaea;
	color: #303030;
	padding: 0.6em 2em 0.7em 2em;
	margin:  0.5em 0   0.5em 2em;


}



/* Images within body text
These are supported in three styles of paragraphs. <p class="image"> (basic),
<p class="image_hanging"> and <p class="image_dropcap"> */

.wp-caption
{
	margin-left:auto;
	margin-right:auto;
}

.image, .wp-caption
{
    /* clear: both; */
    /* clear: both has been replaced with the following two instructions
    to workaround a bug in IE7 and Opera which created much whitespace 
    before the first dropcap item */
    clear: both;
    /* width: 100%; */
    /* overflow: visible; */

	color: #666066;
	text-align: center; 
	font-style: italic;
    line-height: 1.33
}

.image img, .wp-caption img
{
	padding: 6px;
	border: 1px solid #c0c0c0;
	margin: 1px;
}

img.wp-smiley {
	padding: 0;
	border: 0;
	margin: 0;
	display:inline;
	vertical-align:center;
}

p.image_hanging
{
    /* clear: both; */
    /* clear: both has been replaced with the following two instructions
    to workaround a bug in IE7 and Opera which created much whitespace 
    before the first dropcap item */
    float: left;
    width: 100%;
    overflow: auto;
    margin: 0;
}

p.image_hanging img
{
	padding: 6px;
	border: 1px solid #c0c0c0;
	margin: 0.5em 0em 0.5em 1em;
	float: right;
}

p.image_dropcap
{
    /* clear: both; */
    /* clear: both has been replaced with the following two instructions
    to workaround a bug in IE7 and Opera which created much whitespace 
    before the first dropcap item */
    /* float: left; */
    /*width: 100%;*/
    overflow: visible;
    margin: 0.5em 1em 0.5em 206px;
    min-height: 132px;
}

p.image_dropcap img
{
	padding: 6px;
	border: 1px solid #c0c0c0;
	margin: 0 0 0 -206px;
	float: left;
	width: 180px;
	height: 120px;	
}

/* Sidebars and colored bars */

.sidebar, .highlight 
{ 
	border-top: 1px dotted #888;	
	border-bottom: 1px dotted #888;
	background: #eaeaea;
	color: #222222;
	padding: 1em 1em 1em 1em;
	margin: 1em 0 1em 0;
}

.sidebar_alert, .alert 
{ 

	border-top: 1px dotted #888;	
	border-bottom: 1px dotted #888;
	background: #ffca00;
    /* color: #ffffff; */
	padding: 0.6em 1em 0.6em 1em;
	margin: 1em 0 1em 0;
}

.framed 
{ 
	border: 1px dotted #bbb;	
	padding: 0.6em 1em 0.6em 1em;
	margin: 1em 0 1em 0;
}


.footnote
{
	border: 1px dotted #bbb;	
	padding: 0.4em 1em 0.4em 1em;
	margin: 1em 0 1em 0;
	font-size: 85%;    // 11px
}

.footnote a
{
	font-weight: normal;
}


.smalltext		
{
	font-size: 85%;    // 11px
	color: #222222;
	font-weight: normal;
	text-align: left
}

.smalltext a
{
	font-weight: normal;
}


/* Other HTML text elements */


small		
{
    font-size: 85%;
}	



/* Basic coloring for links */

a	{
	color: #336699; 
	text-decoration: underline;
} 

a:link	{
	color: #336699; 
	text-decoration: underline;
} 

a:visited	{
	color: #664466; 
	text-decoration: underline;
} 

a:active	{
	color: #cc6600;
	text-decoration: underline;
} 

a:hover	{
	
} 

/* Forms */

form
{
	font-size: 100%
}	

input
{
    font-family: Arial, Helvetica, sans-serif;
    font-size: 100%
}

textarea
{
    font-family: Arial, Helvetica, sans-serif;
    font-size: 100%
}

select
{
    font-family: Arial, Helvetica, sans-serif;
    font-size: 100%
}

/* Advanced additions to the layout classes:
   - Button bar
   - Widget box 
*/   

div.button_bar {
	clear: both;
	margin-top: 0;
	margin-bottom: 1em;
	padding-top: 0;
	padding-left: 0; 
	font-weight: bold;
	font-size: 100%;
}

div.button_bar span.button{
	display: inline-block;
	margin: 0;
	background: #9a0000; 
	border: 1px solid #c0c0c0;
}

.button_bar .button a{
	display:block;
	padding: 7px 8px; /*padding inside each tab*/
	color:white;
	text-decoration: none;
}

.button_bar .button a:visited{
	color: white;
}

.button_bar .button a:hover{
	background: #003165; 
	color:white;
	text-decoration:underline;
}

.button_bar .button a:active{
	background: #003165; /* b80000 background of tabs for hover state */
	color:#dddddd;
	text-decoration:underline;
}

div.widget_bar {
	/* Container for a row of widgets */
	width: 100%;
	float:none;
	clear: both;
}

div.widget_box {
	/* widget box can be used either singularily or enclosed inside widget_bar */

	display: inline-block;
	float:left;
	vertical-align: top;
	width: 100%;

	border-top: 1px solid #eaeaea;
	border-bottom: 1px dotted #c0c0c0;
	padding-left: 1px;
	padding-right: 1px;
	padding-top: 0;
	padding-bottom: 0.5em;

	margin-top: 0;
	margin-bottom: 1em;
}

.widget_box h3 {
	margin: 0 0 1em 0;
	line-height: 1.25em;
	white-space: nowrap;
	list-style-type: none;
	width: auto;
	border-bottom: 1px solid #c0c0c0;
	
	font-size: 92%;  /* 12 px */
	font-weight: bold;
	padding: 0.25em; /* 3px; */
	color: #909090; 
	
	text-indent: 20px; 
	background: #eaeaea url('/styleguide/bullet_roundel_grey_4.gif') no-repeat left;
	background-position: 6px center;
}
	
.widget_box p {
	color: #666666;
	font-size: 92%;
	padding-left: 6px;
	padding-right: 4px;
	padding-bottom: 0;
	padding-top: 0;
}

span.sense_tag {
	background-color:#B6CAD7; 
	color:#ffffff; 
	font-size: 12px; 
	font-family: Arial, Helvetica, sans-serif;
	font-style:normal;
	font-weight: bold;  
	padding: 0 3px 0 3px;
	margin: 0 0.3em 0 0.3em;
}

.index ul
{
    line-height: 1.6;
	margin-bottom: 1em;
	list-style-type: square;
}