body {
	font-family: verdana, arial, tahoma, sans-serif;
	font-size: 0.8em;
	color: #000000;
	background: #ffffff;
	text-align: center;
	margin: 0;
	padding: 0;
	background:url('../images/background.gif');
	background-repeat: repeat-x;
	}

a	{
	color: #ffffff;
	text-decoration: none;
	}
a:hover	{
	color: #ffffff;
	text-decoration: underline;
	}
	
div#wrapper {
	width: 100%;
	text-align: center;  
	margin-left: auto;
	margin-right: auto;
	display: block;
	}

div#container {
	padding: 0;
	width: auto;
	margin-left: auto;
	margin-right: auto;
	text-align: left; /* resetting the "text-align: center" of "wrapper" */
	display: block;
	}

.colone {width: 200px;}
.coltwo {width: 100%; min-width:200px;}
.colthree {width: 200px;}
	
table#logoarea {
	border-spacing: 0px;
		}
	
.horbar1 {
	height: 0px;
	background: #e9eff8;
	border-top: solid 1px #144ca1;	}
	
.horbar2 { 
	height: 5px;
	background: #ffffff;
	border-bottom: dashed 1px #cccccc;	}	

.header-image-container {
	height: 150px; 
	}

.opacityleft {
	background-color: #ffffff; 
	height: 150px;
	width: 200px; 
	filter: alpha(opacity=40);
	-moz-opacity:.40;
	opacity:.40;
	}

.opacityright {
	background-color: #ffffff; 
	height: 150px;
	width: 200px; 
	filter: alpha(opacity=40);
	-moz-opacity:.40;
	opacity:.40;
	}

		
td#left {
	border-right: dashed 1px #CCCCCC;
	padding: 10px 10px 10px 10px;
	background: #ffffff;	
	vertical-align: top;
	}

td#right {
	border-left: dashed 1px #CCCCCC;
	padding: 10px 10px 10px 10px;
	background: #ffffff;	
	vertical-align: top;
	}

div.widget {
	margin: 0 0 15px 0;	}

.widget ul li {
	margin: 2px 0 2px 0px;
	}

.widget ul li ul li {
	margin: 2px 0 2px 5px;  
	}

.widget ul li ul li ul li {
	margin: 2px 0 2px 5px;  
	}
	
.widget ul li a:link, 
.widget ul li a:visited, 
.widget ul li a:active {
	padding: 0 0 0 5px; 
	margin: 0 0 0 3px;
	color: #000000; 
	border-left: solid 5px #f4a929; 
	}

.widget ul li a:hover {
	color: #144ca1; 
	text-decoration: underline;
	border-left: solid 5px #144ca1; 
	}

.widget_categories ul li a:link, 
.widget_categories ul li a:visited, 
.widget_categories ul li a:active,
.widget_categories ul li a:hover {
	display: inline !important;  
	}
	
div.post {
	margin: 0 0 30px 0;
	}

div.post-headline {
		}

div.post-headline h2 {
	padding: 0;
margin: 0;
	}

div.post-bodycopy {
		}
	
.navigation-top {
	margin: 0 0 10px 0;
	padding: 10px 0 10px 0;
	border-bottom: dashed 1px #ccc;	}

.navigation-middle {
	margin: 10px 0 20px 0;
	padding: 10px 0 10px 0;
	border-top: dashed 1px #ccc;
	border-bottom: dashed 1px #ccc;	}
	
.navigation-bottom {
	margin: 20px 0 0 0;
	padding: 10px 0 10px 0;
	border-top: dashed 1px #ccc;	}

.aligncenter {
	display: block;
	margin-left: auto;
	margin-right: auto;
	}

.alignleft {
	float: left;
	}

.alignright {
	float: right;
	}
	
/* ------------------------------------------------------------------
---------- BASE LAYOUT ----------------------------------------------
------------------------------------------------------------------ */

ul, ol, dl, p, h1, h2, h3, h4, h5, h6 {
	margin-top: 10px;
	margin-bottom: 0px;
	padding-top: 0;
	padding-bottom: 0;
	}

ul ul, ul ol, ol ul, ol ol {
	/* remove margins on sub-lists */
	margin-top: 0;
	margin-bottom: 0;
	}

h1 {font-size: 2.15em; font-weight: bold;}
h2 {font-size: 1.85em; font-weight: bold;}
h3 {font-size: 1.5em; font-weight: bold; letter-spacing:-1px;}
h4 {font-size: 1.4em;}
h5 {font-size: 1.2em;}
h6 {font-size: 1em;}

h3 a {
	color: #144ca1;
	text-decoration: none;
	}
h3 a:hover {
	color: #4f79b9;
	text-decoration: none;
	}
	
code, pre {
	font-family: "Courier New", Courier, monospace;
	font-size: 1em;
	}

pre {
	overflow: auto;
	word-wrap: normal;
	padding-bottom: 1.5em;
	overflow-y: hidden;
	width: 99%;
	}

abbr[title], acronym[title] {
	border-bottom: 1px dotted;
	}
	
hr {
	display: block;
	height: 2px;
	border: none;
	margin: 0.5em auto;
	color: #cccccc;
	background-color: #cccccc;
	}

table {
	font-size: 1em; /* use the body's font size in tables, too */
	}	


/* ------------------------------------------------------------------
---------- WRAPPER, CONTAINER & LAYOUT ------------------------------
------------------------------------------------------------------ */

/*-------------------- LAYOUT to keep it all together -----*/
	
table#layout {
	font-size: 100%;
	width: 100%;
	max-width: 100%;
	table-layout: fixed;
	}

	
/* ------------------------------------------------------------------
---------- HEADER ---------------------------------------------------
------------------------------------------------------------------ */


/*-------------------- HEADER CONTAINER -------------------*/

td#header {
	width: auto;
	padding: 0;
	background-color: #e9eff8;
	}


/*-------------------- LOGO AREA --------------------------*/

table#logoarea, 
table#logoarea tr, 
table#logoarea td {
	margin: 0;
	padding: 0;
	background: none;
	border: 0;
	}

table#logoarea {
	width: 100%;
	max-width: 100%;
	/* more  ... */
	}
	

/*-------------------- LOGO -------------------------------*/

.logo {
	display: block;
	margin: 0 40px 0 100px;
	}

img.logo:hover {
	filter:alpha(opacity=80);
	/* CSS3 standard */
	opacity:0.8;
	}
	
td.logoarea-logo {
	width: 1%;
	}

	
/*-------------------- BLOG TITLE -------------------------*/

h1.blogtitle {
	color: #144ca1;
	display: block;
	margin: 0;
	padding:0;
	letter-spacing:-2px;
	line-height: 1.0em;
	font-family: georgia, Times New Roman, serif;
	font-size: 40px;	
	font-style: italic;
	}
	
h1.blogtitle a:link, 
h1.blogtitle a:visited, 
h1.blogtitle a:active {
	color: #666666;
	text-decoration: none;
	/* more  ... */
	}
	
h1.blogtitle a:hover {
	color: #000000;
	font-weight: bold;
	text-decoration: none;
	/* more  ... */
	}

/*-------------------- BLOG TAGLINE -----------------------*/

p.tagline { 
	font-family: georgia, Times New Roman, serif;
	margin: 0;
	padding: 1px 0 0 18px;
	font-size: 14px;
	font-weight: normal;
	letter-spacing:-0.5px;
	font-style: italic;
	color: #144ca1;	}
	
.contactright {
	color: #144ca1;
	margin: 13px 10px 0 0;
	padding:0;
	letter-spacing:-1px;
	line-height: 120%;
	font-family: georgia, Times New Roman, serif;
	font-size: 20px;	
	font-style: normal;
	text-decoration: none;
	}

.contactright a:hover {
	color: #144ca1;
	margin: 0 10px 0 0;
	padding:0;
	letter-spacing:-1px;
	line-height: 120%;
	font-family: georgia, Times New Roman, serif;
	font-size: 20px;	
	font-style: normal;
	text-decoration: underline;
	}
	
/*-------------------- HORIZONTAL BARS --------------------*/

.horbar1, 
.horbar2 { 
	font-size: 1px;
	clear: both; 
	display: block;
	position: relative;
	padding: 0; 
	margin: 0;
	width: 100%; 
	}

.header-image-container {
	position: relative; 
	margin: 0; 
	padding: 0; 
	/* more  ... */
	/* background: (= header image) will be added in bfa_header_config.php */
	}

	
.titleoverlay {
	z-index: 4;
	position: relative;
	float: left;
	width: auto;
	/* more  ... */
	}


/*-------------------- OPACITY LEFT -----------------------*/

.opacityleft {
	/* more  ... */
	position: absolute; 
	z-index: 2; 
	top: 0; 
	left: 0; 
	/* more  ... */
	}


/*-------------------- OPACITY RIGHT ----------------------*/	
.opacityright {
	/* more  ... */
	position: absolute; 
	z-index: 2; 
	top: 0; 
	right: 0; 
	/* more  ... */
	}


/* ------------------------------------------------------------------
---------- CENTER COLUMN --------------------------------------------
------------------------------------------------------------------ */

td#middle {
	vertical-align: top;
	padding-left: 5px;
	width: 100%;
	max-width: 100%;		
	overflow: ;
	padding-top: 0px;	
	padding-bottom: 10px;	
	}

	
/* ------------------------------------------------------------------
---------- WIDGETS --------------------------------------------------
------------------------------------------------------------------ */

div.widget {
	display: block;
	width: auto;  /* without this IE will stretch too-wide select 
					menus but not the other widgets. With 100% IE
					will remove sidebar borders if select menu is
					too wide */
	/* more  ... */
	}

div.widget-title {
	display: block;
	width: auto;
	/* more  ... */
	}

div.widget-title h3 {
	padding-left: 0px;
	margin:0;
	position: relative;
	z-index: 1;
	/* more  ... */
	}	
	
div.widget-content-left {
	margin-top: -7px;
	padding: 6px 0px 5px 8px;
	display: block;
	width: auto;
	background:url('../images/menuback-left.jpg');
	/* more  ... */
	}
div.widget-content-right {
	margin-top: -7px;
	padding: 6px 0px 5px 8px;
	display: block;
	width: auto;
	background:url('../images/menuback-right.jpg');
	/* more  ... */
	}

	
/* ------------------------------------------------------------------
---------- Select MENUS INSIDE OF WIDGETS -------------------------
------------------------------------------------------------------ */

/* if a select menu is too wide to fit into the sidebar (because one 
 or several of its option titles are too long) then it will be cut off
 in IE 6 & 7 */

div.widget select { 
	/* more  ... */
	width: 98%; 		/* auto won't work in Safari */
	margin-top: 5px;
}	
	
	
/* ------------------------------------------------------------------
---------- LISTS INSIDE OF WIDGETS ----------------------------------
------------------------------------------------------------------ */

.widget ul {
	list-style-type: none;
	margin: 0; 
	padding: 0;
	width: auto;
	}

/*------------- list items with 1 link per item -----------*/
	
.widget ul li {
	margin: 2px 0 4px 0;  
	display: block;
	/* more  ... */
	}

.widget ul li a:link, 
.widget ul li a:visited, 
.widget ul li a:active {
	text-decoration: none; 
	font-size: 12px;
	font-weight: bold; 
	/* more  ... */
	}

.widget ul li a:hover {
	text-decoration: none; 
	}

.widget ul li a:link, 
.widget ul li a:visited, 
.widget ul li a:active,
.widget ul li a:hover {
	display: block;	   /* default=block. If set to "inline-block", the comments widget 
						cannot be overwritten to "inline" for IE */
	}

* html .widget ul li a:link, 
* html .widget ul li a:visited, 
* html .widget ul li a:active,
* html .widget ul li a:hover {
	height: 1%;   /* IE6 needs this */
	}
	
/* the archive widgets get inline-blick so post counts won't wrap
into the next line. In FF2 items that don't fit into a single line 
will overflow the sidebar but that is unlikely as the longest item 
would be "[month name] (post count)" */
/*.widget_categories ul li a:link, 
.widget_categories ul li a:visited, 
.widget_categories ul li a:active,
.widget_categories ul li a:hover, */
.widget_archive ul li a:link, 
.widget_archive ul li a:visited, 
.widget_archive ul li a:active,
.widget_archive ul li a:hover {
	display: -moz-inline-box; /* Firefox 2 doesn't know default "inline-block" */
	display: inline-block !important;  
	}

/* The category widget gets "block" or "inline" depending on whether "post count" is being
used or not. */
.widget_categories ul li a:link, 
.widget_categories ul li a:visited, 
.widget_categories ul li a:active,
.widget_categories ul li a:hover {
	/* more  ... */
	}
	
/* ------------------------------------------------------------------
---------- POSTS ----------------------------------------------------
------------------------------------------------------------------ */

/*-------------------- POST CONTAINER ---------------------*/

div.post {
	display: block;
	/* more  ... */
	}

/*-------------------- POST HEADLINE ----------------------*/

div.post-headline h2 {
	margin: 0;
	padding: 0;
	/* more  ... */
	}

/*-------------------- POST BODY COPY ---------------------*/
	
div.post-bodycopy p {
	margin: 1em 0;
	padding: 0;
	display: block;
	/* The rule below would create hor. scrollbars in Firefox, 
	which would be better than overflowing long strings, but the
	downside is that text won't float around images anymore. 
	Uncomment this if you don't float images anyway */
	/* overflow: auto; */
	}

/* ------------------------------------------------------------------
---------- IMAGES ---------------------------------------------------
------------------------------------------------------------------ */

img { 
	border: 0;
	}
	
/* hiding from IE6 which would stretch the image vertically. 
IE6 will get width and height via jQuery */
div[class~=post] img { 
	height: auto; /* FF & Safari need auto */
	}	


/* ------------------------------------------------------------------
---------- HACKS: Clearfix & others ---------------------------------
------------------------------------------------------------------ */

.clearfix:after
	{
    	content: "."; 
    	display: block; 
    	height: 0; 
    	clear: both; 
    	visibility: hidden;
	}
	
.clearfix
	{
	min-width: 0;		/* trigger hasLayout for IE7 */
	display: inline-block;
	/* \*/	display: block;	/* Hide from IE Mac */
	}
	
* html .clearfix
	{
	/* \*/  height: 1%;	/* Hide from IE Mac */ 
	}

/* Chrome and Safari don't like clearfix in some cases.
Also, adding height and font-size for IE6 */
.clearboth {
	clear: both;
	height: 1%;
	font-size: 1%;
	line-height: 1%;
	display: block;
	padding: 0;
	margin: 0;
	}

div.homepageicon {
	margin-bottom: 2px;
	margin-left: 3px;
	float: left;
	padding: 2px;
	}
	
.icontext {
	background-color: #144ca1;
	font-family: verdana, arial, tahoma, sans-serif;
	color: #ffffff;
	width: 141px;
	margin-top: -4px;
	padding-top: 2px;
	height: 15px;
	text-align: center;
	font-size: 11px;
	font-weight: bold;
	vertical-align: middle;
	}
	
.icontext:hover {
	background-color: #144ca1;
	color: #ffffff;
	width: 141px;
	margin-top: -4px;
	padding-top: 2px;
	height: 15px;
	text-align: center;
	font-size: 11px;
	font-weight: bold;
	vertical-align: middle;
	}
	
img.homeicon {
	border: 1px solid #144ca1;
	}
	
img.homeicon:hover {
	border: 1px dashed #144ca1;
	filter:alpha(opacity=80);
	/* CSS3 standard */
	opacity:0.8;
	}
	
.sectionheader {
	text-align:left;
	padding-left: 5px;
	color: #144ca1;
	}
	
img.specialoffers:hover {
	filter:alpha(opacity=80);
	/* CSS3 standard */
	opacity:0.8;
	}
	
.bodytext {
	font-family: verdana, arial, tahoma, sans-serif;
	font-size: 12px;
	line-height: 140%;
	text-align: left;
	padding-left: 15px;
	padding-top: 0px;
	width: 95%;
	}

.bodytext a {
	font-family: verdana, arial, tahoma, sans-serif;
	color: #144ca1;
	font-size: 12px;
	line-height: 140%;
	text-align: left;
	padding-top: 0px;
	width: 95%;
	text-decoration: underline;
	}

.bodytext a:hover {
	font-family: verdana, arial, tahoma, sans-serif;
	color: #144ca1;
	font-size: 12px;
	line-height: 140%;
	text-align: left;
	padding-top: 0px;
	width: 95%;
	border-bottom: 1px solid #144ca1;
	}

.bodytext img {
	border-right: 10px solid #144ca1;
	border-top: 1px solid #144ca1;
	border-bottom: 1px solid #144ca1;
	border-left: 1px solid #144ca1;
	margin-left: 10px;
	margin-top: 0px;
	margin-right: 10px;
	float: left;
	}

.bodyspecial {
	font-family: verdana, arial, tahoma, sans-serif;
	font-size: 12px;
	line-height: 140%;
	text-align: left;
	padding-left: 15px;
	padding-top: 0px;
	width: 95%;
	}

.bodyspecial a {
	font-family: verdana, arial, tahoma, sans-serif;
	color: #144ca1;
	font-size: 12px;
	line-height: 140%;
	text-align: left;
	padding-top: 0px;
	width: 95%;
	text-decoration: underline;
	}

.bodyspecial a:hover {
	font-family: verdana, arial, tahoma, sans-serif;
	color: #144ca1;
	font-size: 12px;
	line-height: 140%;
	text-align: left;
	padding-top: 0px;
	width: 95%;
	border-bottom: 1px solid #144ca1;
	}

.bodyspecial img {
	border-right: 1px solid #144ca1;
	border-top: 1px solid #144ca1;
	border-bottom: 1px solid #144ca1;
	border-left: 1px solid #144ca1;
	margin-left: 10px;
	margin-top: 0px;
	margin-right: 10px;
	float: left;
	height: 100%;
	width: 100%;
	}

.bodytext ul {
	padding: 0px 0px 0px 350px;
	}
		
img.image-offer {
	border: 1px solid #144ca1;
	}

.submenu {
	padding: 2px 2px 2px 4px;
	margin-left: 2px;
	background-color: #e9eff8;
	width: 350px;
	border-top: 1px solid #144ca1;
	}
	
.submenu a {
	font-family: verdana, arial, tahoma, sans-serif;
	color: #144ca1;
	font-size: 12px;
	line-height: 100%;
	font-weight: bold;
	text-align: left;
	text-decoration: underline;
	border-bottom: 0px solid #144ca1;
	}

.submenu a:hover {
	font-family: verdana, arial, tahoma, sans-serif;
	color: #144ca1;
	font-size: 12px;
	line-height: 100%;
	font-weight: bold;
	text-align: left;
	text-decoration: underline;
	border-bottom: 1px solid #144ca1;
	}
		
/* ------------------------------------------------------------------
---------- FOOTER ---------------------------------------------------
------------------------------------------------------------------ */

td#footer {
	padding-top: 5px;
	padding-right: 12px;
	border-top: dashed 1px #cccccc;
	width: 100%;
	text-align: right;
	font-family: verdana, arial, tahoma, sans-serif;
	font-size: 10px;
	}
	
td#footer a {
	color: #999999;
	}