/*	cms.css
	
	This css provides base-level styling that can be overridden by other stylesheets.
	It should be the first css file referenced.

	It includes styling used by cms devices, such as gizmos, but should be kept 
	to as little site-specific stuff as possible.

	There are big cross-over areas though (eg. fixed image sizes, div boxes)

These copied from other files:

define $red    		#a71f26
define $link	 		#fe5921 
define $bg_admin		#dddfef
define $admin_highlight_l1	#edeffe
define $blue    		#27a
define $bg_blue 		#e9f2f8
define $dkgreen 		#485F39

# define $bg_red     	#ffdddd
# define $admin_highlight_l2	#cfd4ed
*/

/* Eric Meyer's reset except for (ol which just seems stupid!) {{{
From: http://meyerweb.com/eric/thoughts/2008/01/15/resetting-again/ */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}
body {
	line-height: 1;
}
ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}

/* remember to define focus styles! */
:focus {
	outline: 0;
}

/* remember to highlight inserts somehow! */
ins {
	text-decoration: none;
}
del {
	text-decoration: line-through;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: collapse;
	border-spacing: 0;
}
/* }}} */

input { position:static; }

sup { font-size:0.6em;vertical-align:super; }
sub { font-size:0.6em;vertical-align:sub; }

/* images {{{ */
img { display:block; /* (default in strict mode is inline) */ }
img, a img { border-style: none; }
img.icon    { position:relative;top:-20px;left:3px; border:none !important; }
a img.icon    { border:none; }

/* }}} */

/* lists {{{

Reminders
ul, ol are Block level. li is inline.  The markers are placed outside the box
(this way we get hanging indents) A float only affects inline level stuff, not
the block itself. So putting padding and/or margins won't offset the markers
which are positioned relative to the inline li elements.  So best to put a
margin on the inline element to achieve the hanging indent.  a padding on the
inline li element wouldn't work because that pads from the marker which just
gets put to the left of the text, irrespective of whether or not that's
interfering with a float.

*/
ul, ol {
	list-style-position:outside; /* ie. hanging indents */
	margin:0 0 0.8em 0;
	padding:0;
}
ul { list-style-type: square; }
li { padding:0; margin:0; }
ul>li {	margin-left:1.4em ; }
ol>li {	margin-left:2.0em ; }


.good,
.bad,
.warn,
.video,
.takeaction,
.rss,
.twitter,
.facebook,
.info,
.doc,
.docx,
.pdf,
.odt,
.xls,
.xlsx,
.ods
{
	list-style: none;
	background-position:0 1px;
	background-repeat:no-repeat;
	background-image:('/format/icon_16px_default_bullet.png'); 
	padding-left:22px;
	margin-left:0;
	min-height:18px;
}

.good { background-image: url('/format/icon_good.png'); }
.bad { background-image: url('/format/icon_bad.png'); }
.warn { background-image: url('/format/icon_warning.png'); }
.video { background-image: url('/format/icon_video.png'); }
.takeaction { background-image: url('/format/icon_megaphone_16px.png'); }
.rss { background-image: url('/format/icon_16px_rss.png'); }
.twitter { background-image: url('/format/icon_16px_twitter.png'); }
.facebook { background-image: url('/format/icon_16px_facebook.png'); }
.info { background-image: url('/format/icon_info.png'); }
.doc,
.docx { background-image: url('/format/icon_16px_document_msword.jpg'); }
.odt { background-image: url('/format/icon_16px_document_openoffice.png'); }
.pdf { background-image: url('/format/icon_16px_document_pdf.png'); }
.xls,
.xlsx { background-image: url('/format/icon_16px_spreadsheet_msexcel.png'); }
.ods { background-image: url('/format/icon_16px_spreadsheet_openoffice.png'); }
	
dl { margin-top: 0px; }
dt { margin-top: 0px; }
/* }}} */


/* super-awesome-buttons 2011-02-15 {{{ */
.awesome,
.awesome:visited
{

	border-color: #CCCCCC #CCCCCC #888888 #888888;
	border-style: solid;
	border-width: 1px;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;

	background-color: #8F8F88;
	background-image: url(/format/bg_super_awesome_button.png);
	background-position:0 -6px;/* fudge as the effect is too strong */
	background-repeat: repeat-x;

	cursor: pointer;

	display: inline-block;
	position: relative;
	line-height: 1;
	padding: 2px 6px;
	margin-right:12px;
	margin-bottom:4px;

	color: white;
	font-weight: normal;
	text-decoration: none;
	font-size:13px;
	text-shadow: 0 -1px 1px rgba(0,0,0,0.25);
}

#is_ie6 .awesome,
#is_ie6 .awesome:visited,
#is_ie7 .awesome,
#is_ie7 .awesome:visited
{
	position:static;
}

.awesome:hover 
{
	background-color: #6F6F66;
}
.awesome:active 
{ 
	background-color: #4F4F44;
	border-color: #222;
}
/* Cancel link underlining if link is button*/
a.awesome:hover { 
	text-decoration:none;
}

 /* Sizes ---------- */
.small.awesome { font-size: 11px; }
.medium.awesome { font-size: 13px; padding: 5px 9px; }
.large.awesome { font-size: 14px; padding: 10px 14px; }
 
/* Colors ---------- */
.primary.awesome,
.green.awesome { background-color: #618D09;
/* was #618D09; but hard to read white */
}
.primary.awesome:hover,
.green.awesome:hover { background-color: #91BD09;  }
.formbox .primary.awesome { background-color: #E60034/*$red_text*/; }
.formbox .primary.awesome:hover { background-color: #c60014; }

/* secondary class is not defined
.secondary.awesome { }
.secondary.awesome:hover { }
*/

.confirm.awesome,
.red.awesome { background-color: #CF7F40; }
.confirm.awesome:hover,
.red.awesome:hover { background-color: #cc4104; }

.magenta.awesome { background-color: #a9014b; }
.orange.awesome { background-color: #ff5c00; }
.yellow.awesome { background-color: #ffb515; }

button.awesome.sell,
input.awesome.sell
{
	background-image:url('/format/bg_sell_button.png');
	background-position: bottom left;
	background-repeat:no-repeat;
	padding-left:16px;
}
button.awesome.sell:hover,
input.awesome.sell:hover
{
	background-image:url('/format/bg_sell_button_hover.png');
}

button.awesome.disabled,
input.awesome.disabled,
button.awesome[disabled="disabled"],
input.awesome[disabled="disabled"]
{
	background-color:#ddd !important;
	color:white !important;
	top:0px !important;
	background-image:none !important;
}

#is_ie6 .awesome { background-image:none; }

/* }}} */
/* Defaults */
body { background-color:white;color:black; font-family:sans-serif,"DejaVu Sans","Bitstream Vera Sans",Arial,Helvetica;}

/* links {{{ */
a.external 
{ 
	padding-right:13px;
	background-image:url('/format/external_link.png');
	background-position:right;
	background-repeat:no-repeat;
}
a.mail 
{ 
	padding-right:18px;
	background-image:url('/format/icon_16px_mail.png'); 
	background-position:right;
	background-repeat:no-repeat;
}
/*a.anchor 
{ 
	padding-right:12px;
	background-image:url('/format/icon_anchor.gif');
	background-position:right;
	background-repeat:no-repeat;
}
a.download
{
	padding-right:20px;
	background-image:url('/format/icon_dl.gif');
	background-position:right;
	background-repeat:no-repeat;
}*/
#is_ie5 a.external,
#is_ie5 a.download,
#is_ie5 a.mail,
#is_ie5 a.anchor
{	background-image:none; }
/* }}} */

/* breaks {{{ */
br.clear       { clear:both }
br.clear_right { clear:right }
br.clear_left  { clear:left }
/* }}} */

/* Tables {{{ */
table { border-collapse:collapse; }

td, th
{
	border:solid 1px #888;
	vertical-align:top;
	text-align:left;
	padding:0.1em 0.4em;
	line-height:120%;
}

th { font-weight:bold; }

table.compact td,
table.compact th
{
	padding:0 0.2em;
	font-size:0.8em /*$textSizeSmall*/;
}

/* }}} */

/* headings {{{ */
h1, h2, h3, h4 	{ margin:1em 0 0.2em 0; /* top right bottom left */ }
h1 				{ margin-bottom:1em; }
/* }}} */

/* paragraphs, strong, emphasis{{{ */
p { margin-top:0.3em; 
	margin-bottom: 0.7em;
	line-height:120%;
}
strong { font-weight:bold; }
/* }}} */



pre
{
	border:solid 1px #888;
	background: #eee;
	font-size:0.8em /*$textSizeSmall*/;
	padding:0.2em 0.4em ;
	font-family: 'bitstream vera sans mono','freemono',fixed,monospace;
}

/* address boxes {{{ */
div.address, address {
    font-style: normal;
	padding-left:24px;
	padding-top:0;
	background-image:url('/format/mail.gif'); 
	background-position:top left;
	background-repeat:no-repeat;
	font-size:0.8em /*$textSizeSmall*/;
}
#is_ie5 div.address, address { background-image:none; }
/* }}} */

/* hidden div {{{
	This is uesful to apply to an image in a news story, at top of page because the image
	chosen is always the first in the page. This way you can safely specify an image
	without upsetting your design.
	*/
.hidden { display:none; } /* }}} */

/* locater div {{{ */
div.locater { position:absolute }
/* }}} */

/* Admin box {{{ */
div#adminbox {
	position:fixed;
	right:-150px;
	top:0;
	bottom:0;
	z-index:10;
	font-size:11px; /* min. readable size?  */
	width:16em;
	text-align:left;
	margin:0;
	padding:0;
	background-color:#dddfef /*$bg_admin*/;
	background-color:rgba(200,210,240,0.8);
	border-left:solid 1px #27a /*$blue*/;
	opacity:0.2;
	-webkit-transition: all 0.2s ease-in-out 0.4s;
	-moz-transition: all 0.2s ease-in-out 0.4s;
	-o-transition: all 0.2s ease-in-out 0.4s;
	-ms-transition: all 0.2s ease-in-out 0.4s;
	transition: all 0.2s ease-in-out 0.4s;
}
div#adminbox:hover {
	-webkit-transition: all 0.3s ease-out 0.1s;
	-moz-transition: all 0.3s ease-out 0.1s;
	-o-transition: all 0.3s ease-out 0.1s;
	-ms-transition: all 0.3s ease-out 0.1s;
	transition: all 0.3s ease-in-out 0.1s;
}
#adminbox:hover { right:0; opacity:1;}
#is_ie5 #adminbox,
#is_ie6 #adminbox 
{ position:absolute; }

#adminbox li { background-image:none; padding-left:0; list-style: square; }


div#adminbox a,
div#adminbox a:visited { color:#a71f26 /*$red*/; }
#adminbox li a { display:block; }
/* startunless::MSIE5 */
div#adminbox div.hideit:hover + div { display:none; }
div#adminbox div.hideit:hover + div + * { display:none; }
div#adminbox div.hideit:hover + div + * + * { display:none; }
/* end::MSIE5 */

div#adminbox div.text {
	margin:0;
	padding:0.2em;
	position:relative;
	bottom:-0.1em;
	height:auto;
}
div#adminbox ul { }
div#adminbox li {margin-left:26px; }
#adminbox li.general
{
	list-style-image: url('/format/adminbox_general.png');
	margin-top:0.3em;
} 
div#adminbox div.text p { margin-left:0.5em; }
#adminbox li:hover { background-color:#edeffe /*$admin_highlight_l1*/; }
#adminbox li.edit { list-style-image: url('/format/adminbox_edit.png');  } 
#adminbox li.home { list-style-image: url('/format/adminbox_home.png');  } 
#adminbox li.delete { list-style-image: url('/format/adminbox_delete.png');  } 
#adminbox li.publish { list-style-image: url('/format/adminbox_publish.png');  } 
#adminbox li.happy { list-style-image: url('/format/adminbox_happy.png');  } 
#adminbox li.unhappy { list-style-image: url('/format/adminbox_stop.png');  } 
#adminbox li.addchild { list-style-image: url('/format/adminbox_addchild.png');  } 
#adminbox li.stats { list-style-image: url('/format/adminbox_stats.png');  } 
/*#adminbox li.stats { list-style-image: url('/format/adminbox_sitemap.png');  } */
#adminbox ul.workflow { overflow:auto;height:200px; }

#adminbox h1 { border-top:solid 1px;text-align:center;font-size:1.2em;color:black;font-weight:normal; }

/* }}} */

/* cms_error div for user errors  {{{ */
	div.cms_error
	{
		border-left:solid 1em #a71f26 /*$red*/;
		border-right:solid 1em #a71f26 /*$red*/;
		border-top:dotted 1px #a71f26 /*$red*/;
		border-bottom:dotted 1px #a71f26 /*$red*/;
		background-color:#fee;
		padding: 0.2em;
		color:#800;
		margin:0.5em;
	}
/* }}} */
/* cms_warnings div for user errors  {{{ */
	div.cms_warnings
	{
		border:dotted 1px #a71f26 /*$red*/;
		background-color:#ffd;
		padding: 0.2em;
		color:#800;
		margin:0.5em;
	}
/* }}} */

/* admin/graphics page {{{ */
div.thumbnail_box {
	padding:0.5em 0;
	margin:0.5em;
	margin-left:0;
	clear:left;
}
div.thumbnail_box img {
	float:left;
	display:block;
	margin:0;
	margin-right:0.5em;
	padding:0
}
/* graphics box with caption {{{ */
div.image_box_right, div.image_box_left
{
	border:solid 1px gray;
	margin:0.3em;
	background-color:white;
}
div.image_box_right
{
	float:right;
	margin-right:0;
}

div.image_box_left
{
	float:left;
	margin-right:0;
	clear:left;
}
div.image_box_caption
{
	margin:0;
	padding:0.2em;
}
/* }}} */
/* }}} */

/* layout divs (for forms) {{{

These divs (ic_row, ic_XXem, ic_control, ic_last)
provide a way to layout table like structures of fixed widths, and 
to fit controls into them so that they all align.

They work by being left floats, 
0.6em shorter than the specified size, 
with 0.6em margin on the right.

This means that the 2nd 20em box starts 20em from the left,
and a 40em box below that (in next "row") aligns 

ie.

+---------------------------------------------+
| ic_row                                      |
| +------------------+ +--------------------+ |
| + ic_20em          + + ic_20em            + |
| +   (float)        + +  (float)           + |
| +------------------+ +--------------------+ |
+=============================================+
| ic_row                                      |
| +-----------------------------------------+ |
| + ic_40em                                 + |
| +   (float) sort of equiv. to colspan=2   + |
| +-----------------------------------------+ |
+---------------------------------------------+

It is also possible to nest the floats enabling more complex layouts.
However, the content space available for a 40em box is 39.4em so clearly
won't fit two 20em boxes in. To get around that, use the ic_last
box for the last item as well as the size (ie. class="ic_20em ic_last")
which removes the right hand margin

+--------------------------------------------------------------+
| ic_row                                                       |
| +-----------------------------------------+ +--------------+ |
| | ic_40em                                 | | ic_20em      | |
| +-----------------------------------------+ |              | |
| | ic_row                                  | |  this one    | |
| +-----------------+ +---------------------+ |  has the     | |
| | ic_20em         | | ic_20em, ic_last    | |  equivalent  | |
| |                 | |                     | |  of          | |
| |                 | |                     | |  rowspan=2   | |
| +-----------------+ +---------------------+ |              | |
| +=========================================+ |              | |
| | ic_row                                  | |              | |
| +-----------------+ +---------------------+ |              | |
| | ic_20em         | | ic_20em, ic_last    | |              | |
| |                 | |                     | |              | |
| |                 | |                     | |              | |
| +-----------------+ +---------------------+ |              | |
| +-----------------------------------------+ |              | |
| +-----------------------------------------+ +--------------+ |
+==============================================================+
| ic_row                                                       |
| +----------------------------------------------------------+ |
| | ic_60em                                                  | |
| |             note that this still aligns.                 | |
| +----------------------------------------------------------+ |
+--------------------------------------------------------------+

Finally, the ic_control boxes are there for inputs to fit in, with
some margins.

Because the width property specifies the internal width for the content,
borders, padding, margin add to this. So I remove all these from input
elements, but then they're bare and borderless, but at least I can safely use
width=100% without it distorting the containing box.

So ic_control is a normal div which stretches to fit all available horizontal
space. (this is different to width:100%) and I add borders (background colours)
to this and padding, then the bare input goes inside.

Because these are all in em widths, the context matters.
*/
div.ic_row { margin:0;padding:0;clear:both;margin-bottom:1.6em; }
div.ic_row br { clear:left; }

div.ic_20em, 
	div.ic_30em, 
	div.ic_40em,
	div.ic_60em,
	div.ic_80em
	{ margin:0;padding:0;
	float:left;
	margin-right:0.6em;
	}
	
div.ic_20em {width:19.4em; }
div.ic_30em {width:29.4em; }
div.ic_40em {width:39.4em; }
div.ic_60em {width:59.4em; }
div.ic_80em {width:99.5%; } /*80em is too wide!*/
div.ic_last {margin-right:0 !important;}

div.ic_control {
		padding:3px;
		margin:0.2em 0;
		background-color:white;
		-moz-border-radius:3px;
		-webkit-border-radius:3px;
		border-radius:3px;
		}
div.ic_control input,
div.ic_control textarea
{
	padding:0;
	border:none;
	border-width:0; /*for M$IE*/
	margin:0;
	width:100%;
}
/* }}} */
div.antispam_input     {width:150px;}
img.antispam           {position:absolute;left:156px;margin-top:0.8em; }

/* search results {{{ */
p.searchresult { margin:0;}
p.searchresult_description { font-size:0.8em /*$textSizeSmall*/;margin-top:0; }

/* }}} */

/* Gizmo: discussions {{{ */
img.emoticon 
{
	display:inline;
	border:none;
}
/*
	div.cols2080.gd_row
		div.cols_row.clearfix
			div.cols20.gd_poster
				div.padding
			div.cols80.gd_post
				div.padding
		[div.cols_row.clearfix...]
 */
div.cols2080 
{
	background-image: url('/format/bg_20_80col.png');
	background-position: 20% ;
	background-repeat: repeat-y;
}
div.cols_row
{
	float:none;
	color:#27a /*$blue*/;
	border-bottom:dotted 1px #27a /*$blue*/;
}
div.cols20
{
	float:left;
	width:20%;
}
div.cols80
{
	float:left;
	width:80%;
}
div.padding { padding:0.5em;float:none;}

div.gd_row div.gd_post div.padding { padding:0 0.5em; }
div.gd_poster 	{ font-size:0.65em /*$textSizeXSmall*/; }
#is_ie5 div.gc_poster,
#is_ie6 div.gc_poster,
#is_ie7 div.gc_poster { font-size:0.65em /*$textSizeXSmall*/; }

div.gd_poster strong {color:inherit}
div.gd_post 	{ color:black; }

div.cols2080.gd_row.gd_hidden
{
	background-color:#aaa;
	background-image:none;
	color:#a71f26 /*$red*/;
}
div.cols2080.gd_row.gd_preview div.gd_post div.padding {
	color:#a71f26 /*$red*/;
	border:solid 1px #a71f26 /*$red*/;
}
div.cols2080.gd_row.gd_preview div.gd_post div.padding h2 { margin-top:0; }

/* The much debated clearfix class!
 * ================================ */
.clearfix:after {
    clear: both;
    content: ".";
    display: block;
    height: 0;
    visibility: hidden;
}
:first-child + html .clearfix {
    min-height: 1%;
}
/* Hides from IE-mac which properly treats this escape->\*/
* html .clearfix {height: 1%;}
/* End hide from ie-mac. ie/win will have processed the css between
 * these comments. */
/* ================================ 
/* Abandoned method: .clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } 
 * ================================ */

div.gd_post blockquote {
	font-size:0.65em /*$textSizeXSmall*/;
	padding-left:3em;
	background-color:#e9f2f8 /*$bg_blue*/;
}
div.gd_post blockquote p,
div.gd_post blockquote li
 { margin-top:0; margin-bottom:0.1em;}
div.gizmo_discussion cite { margin:0; color:#27a /*$blue*/;}
div.gizmo_discussion { clear:both; }
div.gd_post a.quote { 
	background-image: url('/format/wiki_quote_link.png');
	background-repeat:no-repeat;
	background-position: left;
	padding-left:18px;
	font-size:0.65em /*$textSizeXSmall*/;
}

/* }}} */

/* links wiki_cmd {{{ */

div.wiki_cmd_outer {
	background-image:url('/format/nav_wiki_ul.png');
	background-repeat:no-repeat;
	background-position:top left;
	background-color:#C3EDBD;
    margin:0;
	margin-bottom:2em;
	padding:0;
	color:black;
}

div.wiki_cmd_outer div.wiki_cmd {
	background-image:url('/format/nav_wiki_div.png');
	background-position:bottom left;
	background-repeat:no-repeat;
	margin:0;
	padding:0.2em 8px 0.4em 8px;/* top right bottom left */
}
div.wiki_cmd p,
div.wiki_cmd li {
    background-color:transparent;
	font-weight:normal;
	font-size:0.65em /*$textSizeXSmall*/;
}
#is_ie5 div.wiki_cmd li,
#is_ie6 div.wiki_cmd li,
#is_ie7 div.wiki_cmd_outer
{
	position:relative; /* without this this div goes over the padding of the containing div. */
}
div.wiki_cmd p
{
	margin: 0.2em 0 0 0; /* top right bottom left */
    padding: 0.2em 0; /* top,bottom left,right */
}
div.wiki_cmd a,
div.wiki_cmd a:visited 
{
	color:#fe5921 /*$link*/;
}
div.wiki_cmd a:hover { color:#27a /*$blue*/; }

div.wiki_cmd div.row { 
	margin-bottom:0.2em;
	border-bottom:solid 1px white;
	padding-bottom:0.2em;
}
div.wiki_cmd h1 { 
	font-size:0.8em /*$textSizeSmall*/; text-align:center; margin:0;
	margin-bottom:0.2em;
	color:#485F39 /*$dkgreen*/;
	}

img.wiki_status_icon1
{
	float:left;
	margin-left:6px;
	margin-right:16px;
	margin-top:6px;
	margin-bottom:6px;
	width:30px;
}
#is_ie5 img.wiki_status_icon1,
#is_ie6 img.wiki_status_icon1
{
	margin-left:3px; 	
	margin-right:10px; 
}
a:hover img.wiki_status_icon1
{
	margin:0;
	margin-right:10px;
	width:auto;
}
img.wiki_status_icon { text-align:center; margin-left:auto; margin-right:auto; }

/* }}} */

/* Diffs {{{ */
div.diff_changed,
div.diff_new,
div.diff_changedto,
div.diff_unchanged
{	font-family: 'DejaVu Sans Mono','Bitstream Vera Sans Mono', monospace;
	white-space:pre;	
}

div.diff_changed {
	color:#d44;text-decoration: line-through;
}
div.diff_changedto,
div.diff_new 
	{color:#080; }
div.diff_unchanged { color:#888; }
/* }}} */

div.wiki_workspace
{
	font-size:0.8em /*$textSizeSmall*/;
}
div.wiki_workspace span.details { font-size:0.65em /*$textSizeXSmall*/;color:#666;}
div.wiki_workspace p { margin-bottom:0.1em; }

/* Debug box taken from webdevshared/rl_core/css/debug.css need to manually update it */
/* debug box {{{ */
div.debug {
	display:block;
	text-align:left;
	font-family: "Bitstream Vera Sans Mono",fixed,courier;
	font-size:small;
	color:black;
	background:#eef;
}
div.debug p { margin:0 }
div.debug h1 { margin:0 0 0.5em 0;
 font-size:1.2em;
 font-weight:bold;
 background-image:none;
 color:black;
 background-color:#88f;
font-family:sans-serif;
 }
div.debug h2 { 
 margin:0;
 padding:8px;
 font-size:1.1em;
 font-weight:bold;
 cursor:pointer;
 background-image:none;
 color:white;
 background-color:#88f;
font-family:sans-serif;
  
	-moz-border-radius-topleft: 4px;
	-moz-border-radius-topright: 4px;
	-moz-border-radius-bottomleft: 0;
	-moz-border-radius-bottomright: 0;
}
div.debug h2:hover { color:#66f; } 
div.debug div.start,
div.debug div.end
{ margin:0;
 padding-left:0.5em;
 font-size:1em;
 font-weight:bold;
 background-image:none;
 background-color:#ccf;
 font-family:sans-serif;
 color:black;
 }
div.debug div.end
{
	-moz-border-radius-bottomright: 4pxl
	-moz-border-radius-bottomleft: 4pxl
}
div.debug div.start p.normal,
div.debug div.end p.normal { color:#664; }
div.debug pre { margin:0 1em ;  background-color:#bbe; border:dotted 1px #88d;}
div.debug li p.normal { font-weight:normal;color:black; }
div.debug li p.ooo { font-weight:bold;color:#a00; }
div.debug li p.oh { font-weight:bold;color:#0a0; }
div.debug li p.shhh { font-weight:normal;color:#999}
div.debug li span.right { position:absolute; font-weight:normal;right:1em;}
div.debug ol { margin:0; 
	border-right: solid 2px #ccf;
	border-left: solid 2px #ccf; background-color:#d8d8ff;}
div.debug li.ooo {  }
div.debug li li { background-color:#def;  }
div.debug li li li { background-color:#cef; }
div.debug li li li li { background-color:#bef; }
div.debug li li li li li { background-color:#bee; }
div.debug li li li li li li { background-color:#bed; }
div.debug li li li li li li li { background-color:#bec; }
div.debug span.slow { color:red;  }
div.debug p.clickable { cursor:pointer;  }
div.debug p.clickable:hover { color:#66f;  }
div.debug button.command { display:inline; margin:0;padding:1px; border:solid 1px transparent;font-size:xx-small; color:#88d; }
div.debug button.command:hover { border:solid 1px #aaf; color:#66f; background-color:#ccf; }
/* }}} */

.cmstodo { background: red; color white; }