@charset "UTF-8";
body {
		margin:0;
		padding:0;
		border:0;			/* This removes the border around the viewport in old versions of IE */
		width:100%;
		background:#ffffff;
		min-width:600px;		/* Minimum width of layout - remove line if not required */
						/* The min-width property does not work in old versions of Internet Explorer */
		font-size:90%;
	}
	.pages a:link { font-size: 11px; text-align:right; color:#7e8c95}
	.pages a:hover { font-size: 11px; text-align:right; color:#000000}
	.pages { font-size: 11px; text-align:right;}
	h4 {
	font-family: Georgia, "Times New Roman", Times, serif; font-size:16px; color:#FFFFFF; text-align:center;
        margin:.8em 0 .2em 0;
        padding:0;
    }
	h1, h2, h3 {
		margin:.8em 0 .2em 0;
		padding:0;
	}
	.submit {vertical-align: text-bottom;}
	/* Header styles */
	#header img {
		margin:0 0 0 0;
	}
	#header a {padding: 0 0 0 0; margin: 0 0 0 0; border:0; text-decoration:none;}
	#header {
		clear:both;
		float:left;
		width:100%;
	}
	#header {
		background-image:url(../imgs/cprBlogBack.gif);
	}
	
	#layoutdims {
		clear:both;
		background:#eee;
		border-top:4px solid #000;
		margin:0;
		padding:6px 15px !important;
		text-align:right;
	}
	.t2 {text-transform: uppercase; font-family: Arial, Helvetica, sans-serif; font-size:14px; color:#FFFFFF; font-weight:500;
	background-image:url(pix/t2.gif); background-repeat:repeat-x; border-bottom:1px solid #000; border-top:1px solid #000; background-color:#5784af;
	    margin:0 0 .2em 0;
        padding-left:2px;
    }
	/* column container */
	
	.colmask {padding-top:7px; 
		position:relative;	/* This fixes the IE7 overflow hidden bug */
		clear:both;
		float:left;
		width:100%;			/* width of whole page */
		overflow: hidden;		/* This chops off any overhanging divs */
	}
	/* common column settings */
	.colright,
	.colmid,
	.colleft {
		float:left;
		width:100%;			/* width of page */
		position:relative;
	}
	.col1,
	.col2,
	.col3 {
		float:left;
		position:relative;
		padding:0 0 1em 0;	/* no left and right padding on columns, we just make them narrower instead 
						only padding top and bottom is included here, make it whatever value you need */
		overflow: visible; min-height: 840px;
	}
	/* 3 Column settings */
	.illustration {float: right; margin: 0 0 5px 20px; text-align: center;}
	.otherway, .left {float: left; margin: 0 20px 5px 0;}
	.full {float: none; width: 540px; margin: 0;}
	.half {width: 270px;}
	.third {width: 180px;}
	.quarter {width: 135px;}
	.col1 p, .col2 p, .col3 p, .col1 ul, .col1 li{font: 12px Verdana, Verdana, Geneva, sans-serif; letter-spacing: 1px; line-height: 1.5; color: #333; background: #FFF;
		
	}
	{font: 12px Verdana, Verdana, Geneva, sans-serif;margin:.4em 0 .8em 0;
		padding:0;}
	.col1 a:hover, col3 a:hover {color: #666666; text-decoration:underline;} 
.title {text-align:center; text-transform: none; letter-spacing: 1px; font: 1.66em"Times New Roman", Times, serif;}
.title a:link, .title a:visited {color: #7e8c95;}
.title a:hover {color: #000;}
.byline {text-align:center; font: italic 1.1em "Times New Roman", Times, serif; letter-spacing: 1px; margin: 0 0 1.5em;}
.byline a:link, .byline a:visited {font: bold 0.85em Verdana, sans-serif;
  text-transform: capitalize; letter-spacing: 3px;
  margin-left: 0.25em; color:#999966;}
  .date {text-align: center; border-bottom: 1px dashed #ccc; letter-spacing: 3px;
  padding-bottom: 1em; margin-bottom: 1.5em;}
.date a {color: #333300; border: none; text-decoration:none;}
.date a:hover {color: #000; text-decoration:underline;}
#content h1 {font: 1.66em "Times New Roman", Times, serif; text-align: center;
  margin: 0.5em 0; padding-bottom: 0.75em; border-bottom: 1px dashed #B2B2B2;}
#col1 h1 a {color: #000;}
#col1 h1 a:hover {color: #000;}
#col1 h1 em {font-style: normal;}	

.blog {text-align:left; text-transform: none; letter-spacing: 1px; font: 1.66em "Times New Roman", Times, serif;}
.blog a:link, .blog a:visited {color: #7e8c95; text-decoration: none;}
.blog a:hover {color: #000; text-decoration:underline;}
.byline2 {text-align:left; font: italic 1.1em "Times New Roman", Times, serif; letter-spacing: 1px; margin: 0 0 1.5em;}
.byline2 a:link, .byline a:visited {font: bold 0.85em Verdana, sans-serif;
  text-transform: capitalize; letter-spacing: 3px;
  margin-left: 0.25em; color:#999966;}
  .date2 { font:"Times New Roman", Times, serif; font-size:18px;text-align: center; border-bottom: 1px dashed #ccc; letter-spacing: 3px;
  padding-bottom: .55em; margin-bottom: .9em;}
.date2 a:link, .date2 a:visited {color: #999966; border: none; text-decoration:underline;}
.date2 a:hover {color: #000; text-decoration:underline;}
#content h1 {font: 1.66em "Times New Roman", Times, serif; text-align: center;
  margin: 0.5em 0; padding-bottom: 0.75em; border-bottom: 1px dashed #B2B2B2;}
#col1 h1 a {color: #000;}
#col1 h1 a:hover {color: #000;}
#col1 h1 em {font-style: normal;}	
#info2 {text-align: left; font: .8em Georgia, serif;
  padding: 0.1em 0 0.2em; margin: 0.1em 0 0.1em;
   border-bottom: 1px dashed #ccc;}
 #info2 li, #info2 p {display: inline; padding: 0; margin: -4px; background: none; color:#666633;}
 #info2 a {border-bottom-width: 0; text-decoration:none; color:#999966;}
 #info2 a:hover {border-bottom-width: 1px;}
 #info2 b {margin: 0 0.5em;}
 #info2 p a {padding-left: 20px;}


#info {text-align: center; font: .8em Georgia, serif;
  padding: 0.75em 0 0.5em; margin: 0.25em 0 0.5em;
  border: 1px dashed #B2B2B2; border-width: 1px 0;}
 #info li, #info p {display: inline; padding: 0; margin: 0; background: none; color:#666633;}
 #info a {border-bottom-width: 0; text-decoration:none; color:#999966;}
 #info a:hover {border-bottom-width: 1px;}
 #info b {margin: 0 0.5em;}
 #info p a {padding-left: 20px;}
 #authorlist li {padding: 0.4em 0 0.1em; margin-left: -5px; list-style: none}
 #authorlist a {color:#666633; text-decoration:none;}
  #authorlist a:hover {color:#666633; text-decoration: underline;}
 #topiclist li {padding: 0.1em 0 0.2em; margin-left: -5px; list-style: none}
 #topiclist a {color:#666633; text-decoration:none;}
  #topiclist a:hover {color:#666633; text-decoration: underline;} 
  
	.threecol {
		/*background:#eee;		 right column background colour */
	}
	.threecol .colmid {
		right:25%;			/* width of the right column */
		/*background:#fff;		 center column background colour */
	}
	.threecol .colleft {
		right:50%;			/* width of the middle column */
		/*background:#f4f4f4;	 left column background colour */
	}
	.threecol .col1 { background-color:#FFFFFF; 
		width:50%;			/* width of center column content (column width minus padding on either side) */
		left:98%;			/* 100% plus left padding of center column */
	}
	.threecol .col2 { margin-top: 30px; background-color:#FFFFFF;  
		width:18%;			/* Width of left column content (column width minus padding on either side) border-bottom:1px solid #000; border-left:1px solid #000; border-right:1px solid #000; */
		left:27%;			/* width of (right column) plus (center column left and right padding) plus (left column left padding) */
	}
	.threecol .col3 { margin-top: 30px; padding-left: 10px; background-color:#FFFFFF; border-left:1px solid #ccc; 
		width:21%;			/* Width of right column content (column width minus padding on either side) */
		left:85%;			/* Please make note of the brackets here:
						(100% - left column width) plus (center column left and right padding) plus (left column left and right padding) plus (right column left padding) */
	}
	.threecol .col3 .cal{background-color:#c3d9ff;}
	.threecol .col3 .t2{text-transform: uppercase; font-family: Arial, Helvetica, sans-serif; font-size:14px; color:#FFFFFF; font-weight:500;
	background-image:url(t2.gif); background-repeat:repeat-x; border-bottom:1px solid #000; border-top:1px solid #000; background-color:#5784af;
	    margin:0 0 0 0;
        padding-left:2px;
		}
	/* Footer styles */
	.logo p{text-align:center;margin-top:0px;
    margin-bottom:0px;
    padding:0px;
}
	#footer { margin-top: 7px;
		clear:both;
		float:left;
		width:100%;
		border-top:1px solid #000;
	}
	#footer p {
		padding:10px;
		margin:0;
	}
	
#listings {margin-top:5px; padding-top:10px; border-top:dashed; border-top-width:1px; border-top-color: #999;}
#listingsInfo {border-top:dashed; border-top-width:1px; border-top-color: #ccc; margin-top:2px; padding-top:2px; font:"Times New Roman", Times, serif; font-size:13px; text-transform:capitalize;}
#listingsInfo a {color:#999966; text-decoration:none;}
#listingsInfo a:hover{color: #999966; text-decoration: underline;}	
#comments{border-top:dashed; border-top-width:1px; border-top-color: #ccc; margin-top:5px; padding-top:10px;}	
#commentForm{display: none;}
#commentRead{display: none;}
/* SpryMenuBarVertical.css - Revision: Spry Preview Release 1.4 */

/* Copyright (c) 2006. Adobe Systems Incorporated. All rights reserved. */

/*******************************************************************************

 LAYOUT INFORMATION: describes box model, positioning, z-order

 *******************************************************************************/

/* The outermost container of the Menu Bar, a fixed width box with no margin or padding */
ul.MenuBarVertical
{
	margin: 0;
	padding: 0;
	list-style-type: none;
	font-size: 100%;
	cursor: default;
	width: 95%;
	}
/* Set the active Menu Bar with this class, currently setting z-index to accomodate IE rendering bug: http://therealcrisp.xs4all.nl/meuk/IE-zindexbug.html */
ul.MenuBarActive
{
	z-index: 1000;
}
/* Menu item containers, position children relative to this container and are same fixed width as parent */
ul.MenuBarVertical li
{
	margin: 0;
	padding: 0;
	list-style-type: none;
	font-size: 100%;
	position: relative;
	text-align: left;
	cursor: pointer;
	width: 95%;
}
/* Submenus should appear slightly overlapping to the right (95%) and up (-5%) with a higher z-index, but they are initially off the left side of the screen (-1000em) */
ul.MenuBarVertical ul
{
	margin: -5% 0 0 90%;
	padding: 0;
	list-style-type: none;
	font-size: 100%;
	position: absolute;
	z-index: 1020;
	cursor: default;
	width: 8.2em;
	left: -1000em;
	top: 0;
	
}
/* Submenu that is showing with class designation MenuBarSubmenuVisible, we set left to 0 so it comes onto the screen */
ul.MenuBarVertical ul.MenuBarSubmenuVisible
{
	left: 0;
}
/* Menu item containers are same fixed width as parent */
ul.MenuBarVertical ul li
{
	width: 8.2em;
}

/*******************************************************************************

 DESIGN INFORMATION: describes color scheme, borders, fonts

 *******************************************************************************/

/* Outermost menu container has borders on all sides */
ul.MenuBarVertical
{
	border: 0px;	
}

/* Menu items are a light gray block with padding and no text decoration */
ul.MenuBarVertical a
{
	display: block;
	cursor: pointer;
	font-family: 'myriad web', 'myriad pro', myriad, sans-serif, Helvetica, sans-serif;
	padding: 0.1em 0.3em;
	color: #333;
	text-decoration: none;
	font-size: 15px;
}

/* Menu items that have mouse over or focus have a blue background and white text */
ul.MenuBarVertical a:hover, ul.MenuBarVertical a:focus
{
	background-color: #33C;
	color: #FFF;
}
/* Menu items that are open with submenus are set to MenuBarItemHover with a blue background and white text */
ul.MenuBarVertical a.MenuBarItemHover, ul.MenuBarVertical a.MenuBarItemSubmenuHover, ul.MenuBarVertical a.MenuBarSubmenuVisible
{
	background-color: #33C;
	color: #FFF;
}

/*******************************************************************************

 SUBMENU INDICATION: styles if there is a submenu under a given menu item

 *******************************************************************************/

/* Menu items that have a submenu have the class designation MenuBarItemSubmenu and are set to use a background image positioned on the far left (95%) and centered vertically (50%) */
ul.MenuBarVertical a.MenuBarItemSubmenu
{
	background-image: url(SpryMenuBarRight.gif);
	background-repeat: no-repeat;
	background-position: 95% 8px;
}

/* Menu items that are open with submenus have the class designation MenuBarItemSubmenuHover and are set to use a "hover" background image positioned on the far left (95%) and centered vertically (50%) */
ul.MenuBarVertical a.MenuBarItemSubmenuHover
{
	background-image: url(SpryMenuBarRightHover.gif);
	background-repeat: no-repeat;
	background-position: 95% 8px;
}

/*******************************************************************************

 BROWSER HACKS: the hacks below should not be changed unless you are an expert

 *******************************************************************************/

/* HACK FOR IE: to make sure the sub menus show above form controls, we underlay each submenu with an iframe */
ul.MenuBarVertical iframe
{
	position: absolute;
	z-index: 1010;
}
/* HACK FOR IE: to stabilize appearance of menu items; the slash in float is to keep IE 5.0 from parsing */
@media screen, projection
{
	ul.MenuBarVertical li.MenuBarItemIE
	{
		display: inline;
		f\loat: left;
		background: #ccc;
	}
}
.TabbedPanels {
	margin-top: 10px;
	padding: 0px;
	float: left;
	clear: none;
	width: 100%; /* IE Hack to force proper layout when preceded by a paragraph. (hasLayout Bug)*/
}

/* This is the selector for the TabGroup. The TabGroup container houses
 * all of the tab buttons for each tabbed panel in the widget. This container
 * does not contribute anything visually to the look of the widget for our
 * default style.
 *
 * The name of the class ("TabbedPanelsTabGroup") used in this selector is not
 * necessary to make the widget function. You can use any class name you
 * want to style the TabGroup container.
 */
.TabbedPanelsTabGroup {
	margin: 0px;
	padding: 0px;
}

/* This is the selector for the TabbedPanelsTab. This container houses
 * the title for the panel. This is also the tab "button" that the user clicks
 * on to activate the corresponding content panel so that it appears on top
 * of the other tabbed panels contained in the widget.
 *
 * For our default style, each tab is positioned relatively 1 pixel down from
 * where it wold normally render. This allows each tab to overlap the content
 * panel that renders below it. Each tab is rendered with a 1 pixel bottom
 * border that has a color that matches the top border of the current content
 * panel. This gives the appearance that the tab is being drawn behind the
 * content panel.
 *
 * The name of the class ("TabbedPanelsTab") used in this selector is not
 * necessary to make the widget function. You can use any class name you want
 * to style this tab container.
 */
.TabbedPanelsTab {
	position: relative;
	top: 1px;
	float: left;
	padding: 4px 10px;
	margin: 0px 1px 0px 0px;
	text-decoration: none;
	font-size: 11px;
	font-family: 'myriad web', 'myriad pro', myriad, sans-serif, Helvetica, sans-serif;
	background-color: #ffffff;
	list-style: none;
	-moz-user-select: none;
	-khtml-user-select: none;
	cursor: pointer;
}

/* This selector is an example of how to change the appearnce of a tab button
 * container as the mouse enters it. The class "TabbedPanelsTabHover" is
 * programatically added and removed from the tab element as the mouse enters
 * and exits the container.
 */
.TabbedPanelsTabHover {
	background-color: #a2bccd;
}

/* This selector is an example of how to change the appearance of a tab button
 * container after the user has clicked on it to activate a content panel.
 * The class "TabbedPanelsTabSelected" is programatically added and removed
 * from the tab element as the user clicks on the tab button containers in
 * the widget.
 *
 * As mentioned above, for our default style, tab buttons are positioned
 * 1 pixel down from where it would normally render. When the tab button is
 * selected, we change its bottom border to match the background color of the
 * content panel so that it looks like the tab is part of the content panel.
 */
.TabbedPanelsTabSelected {
	background-color: #d6e5f0;
	margin-bottom: 5px;
	
}

/* This selector is an example of how to make a link inside of a tab button
 * look like normal text. Users may want to use links inside of a tab button
 * so that when it gets focus, the text *inside* the tab button gets a focus
 * ring around it, instead of the focus ring around the entire tab.
 */
.TabbedPanelsTab a {
	color: black;
	text-decoration: none;
	margin-bottom: 5px;
}

/* This is the selector for the ContentGroup. The ContentGroup container houses
 * all of the content panels for each tabbed panel in the widget. For our
 * default style, this container provides the background color and borders that
 * surround the content.
 *
 * The name of the class ("TabbedPanelsContentGroup") used in this selector is
 * not necessary to make the widget function. You can use any class name you
 * want to style the ContentGroup container.
 */
.TabbedPanelsContentGroup {
	clear: both;	
	border-top: dashed 1px #999;
	margin-top: 4px;	
	background-color: #fff;
}

/* This is the selector for the Content panel. The Content panel holds the
 * content for a single tabbed panel. For our default style, this container
 * provides some padding, so that the content is not pushed up against the
 * widget borders.
 *
 * The name of the class ("TabbedPanelsContent") used in this selector is
 * not necessary to make the widget function. You can use any class name you
 * want to style the Content container.
 */
.TabbedPanelsContent {
	padding: 4px;margin-top: 4px;
}

/* This selector is an example of how to change the appearnce of the currently
 * active container panel. The class "TabbedPanelsContentVisible" is
 * programatically added and removed from the content element as the panel
 * is activated/deactivated.
 */
.TabbedPanelsContentVisible {
}

/* Vertical Tabbed Panels
 *
 * The following rules override some of the default rules above so that the
 * TabbedPanels widget renders with its tab buttons along the left side of
 * the currently active content panel.
 *
 * With the rules defined below, the only change that will have to be made
 * to switch a horizontal tabbed panels widget to a vertical tabbed panels
 * widget, is to use the "VTabbedPanels" class on the top-level widget
 * container element, instead of "TabbedPanels".
 */

/* This selector floats the TabGroup so that the tab buttons it contains
 * render to the left of the active content panel. A border is drawn around
 * the group container to make it look like a list container.
 */
.VTabbedPanels .TabbedPanelsTabGroup {
	float: left;
	width: 10em;
	height: 20em;
	background-color: #d6e5f0;
	position: relative;
	border-top: solid 1px #999;
	border-right: solid 1px #999;
	border-left: solid 1px #CCC;
	border-bottom: solid 1px #CCC;
}

/* This selector disables the float property that is placed on each tab button
 * by the default TabbedPanelsTab selector rule above. It also draws a bottom
 * border for the tab. The tab button will get its left and right border from
 * the TabGroup, and its top border from the TabGroup or tab button above it.
 */
.VTabbedPanels .TabbedPanelsTab {
	float: none;
	margin: 0px;
	border-top: none;
	border-left: none;
	border-right: none;
}

/* This selector disables the float property that is placed on each tab button
 * by the default TabbedPanelsTab selector rule above. It also draws a bottom
 * border for the tab. The tab button will get its left and right border from
 * the TabGroup, and its top border from the TabGroup or tab button above it.
 */
.VTabbedPanels .TabbedPanelsTabSelected {
	background-color: #d6e5f0;
	border-bottom: solid 1px #999;
}

/* This selector floats the content panels for the widget so that they
 * render to the right of the tabbed buttons.
 */
.VTabbedPanels .TabbedPanelsContentGroup {
	clear: none;
	float: left;
	padding: 0px;
	width: 30em;
	height: 20em;
}