New look for iTop !

git-svn-id: http://svn.code.sf.net/p/itop/code/trunk@3601 a333f486-631f-4898-b8df-5754b55c2be0

application/displayblock.class.inc.php

@@ -855,7 +855,7 @@ class DisplayBlock
 			$oPage->add_ready_script(
 <<<EOF
 	$("#dh_$sId").click( function() {
-		$("#ds_$sId").slideToggle('normal', function() { $("#ds_$sId").parent().resize(); } );
+		$("#ds_$sId").slideToggle('normal', function() { $("#ds_$sId").parent().resize(); FixSearchFormsDisposition(); } );
 		$("#dh_$sId").toggleClass('open');
 	});
 EOF

application/itopwebpage.class.inc.php

@@ -76,15 +76,6 @@ class iTopWebPage extends NiceWebPage implements iTabbedPage
 		$this->add_linked_script('../js/jquery.multiselect.min.js');
 		$this->add_linked_script('../js/ajaxfileupload.js');
 		
-		$aMultiselectOptions = array(
-			'header' => true,
-			'checkAllText' => Dict::S('UI:SearchValue:CheckAll'),
-			'uncheckAllText' => Dict::S('UI:SearchValue:UncheckAll'),
-			'noneSelectedText' => Dict::S('UI:SearchValue:Any'),
-			'selectedText' => Dict::S('UI:SearchValue:NbSelected'),
-			'selectedList' => 1,
-		);
-		$sJSMultiselectOptions = json_encode($aMultiselectOptions);
 		$sSearchAny = addslashes(Dict::S('UI:SearchValue:Any'));
 		$sSearchNbSelected = addslashes(Dict::S('UI:SearchValue:NbSelected'));
 		$this->add_dict_entry('UI:FillAllMandatoryFields');
@@ -227,9 +218,7 @@ EOF;
 				});
 			}
 		});
-		
-		$('.multiselect').multiselect($sJSMultiselectOptions);
-		
+					
 		$('.resizable').filter(':visible').resizable();
 	}
 	catch(err)
@@ -586,6 +575,16 @@ EOF
 		}
 		
 		// Put here the 'ready scripts' that must be executed after all others
+		$aMultiselectOptions = array(
+			'header' => true,
+			'checkAllText' => Dict::S('UI:SearchValue:CheckAll'),
+			'uncheckAllText' => Dict::S('UI:SearchValue:UncheckAll'),
+			'noneSelectedText' => Dict::S('UI:SearchValue:Any'),
+			'selectedText' => Dict::S('UI:SearchValue:NbSelected'),
+			'selectedList' => 1,
+		);
+		$sJSMultiselectOptions = json_encode($aMultiselectOptions);
+		
 		$this->add_ready_script(
 <<<EOF
 		// Since the event is only triggered when the hash changes, we need to trigger
@@ -594,6 +593,11 @@ EOF
 		
 		// Some table are sort-able, some are not, let's fix this
 		$('table.listResults').each( function() { FixTableSorter($(this)); } );
+		
+		$('.multiselect').multiselect($sJSMultiselectOptions);
+
+		FixSearchFormsDisposition();
+
 EOF
 		);
 		if ($this->GetOutputFormat() == 'html')

application/nicewebpage.class.inc.php

@@ -94,7 +94,7 @@ class NiceWebPage extends WebPage
 	$("table.listResults").tableHover(); // hover tables
 EOF
 		);
-		$this->add_linked_stylesheet("../css/light-grey.css");
+		$this->add_saas("css/light-grey.scss");
 
 		$this->m_sRootUrl = $this->GetAbsoluteUrlAppRoot();
      	$sAbsURLAppRoot = addslashes($this->m_sRootUrl);

css/css-variables.scss

@@ -0,0 +1,6 @@
+$highlight-color: #E87C1E;
+$grey-color: #555555;
+$complement-color: #1c94c4;
+$complement-light: #d6e8ef;
+$frame-background-color: #F1F1F1;
+$text-color: #000;

css/light-grey.css

@@ -1,1425 +1,1945 @@
-/* CSS Document */
-body {
-    font-family: Tahoma, Verdana, Arial, Helvetica;
-    font-size: 10pt;
-    color:#000000;
-	margin: 0;			/* Remove body margin/padding */
-	padding: 0;
-	overflow: hidden;	/* Remove scroll bars on browser window */
-}
-
-/* to prevent flicker, hide the pane's content until it's ready */
-.ui-layout-center, .ui-layout-north, .ui-layout-south {
-    display: none;
-}
-
-.raw_output {
-    font-family: Courier-New, Courier, Arial, Helvetica;
-    font-size: 8pt;
-    background-color: #eeeeee;
-    color: #000000;
-    border: 1px dashed #000000;
-    padding: 0.25em;
-    margin-top: 1em;
-}
-
-h1 {
-    font-family: Tahoma, Verdana, Arial, Helvetica;
-    color: #000;
-    font-weight: bold;
-    font-size: 12pt;
-}
-h2 {
-    font-family: Tahoma, Verdana, Arial, Helvetica;
-    color: #000;
-    font-weight: normal;
-    font-size: 12pt;
-}
-h3 {
-    font-family: Tahoma, Verdana, Arial, Helvetica;
-    color: #000;
-    font-weight: normal;
-    font-size: 10pt;
-}
-.hilite, .hilite a, .hilite a:visited {
-    color: #EB8F00;
-    text-decoration: none;
-}
-table.datatable {
-	width: 100%;
-	border: 0;
-	padding: 0;
-}
-td.menucontainer {
-	text-align: right;
-}
-table.listResults {
-    padding: 0px;
-	border-top: 3px solid #f6f6f1;
-	border-left: 3px solid #f6f6f1;
-	border-bottom: 3px solid #e6e6e1;  
-	border-right: 3px solid #e6e6e1;
-	width: 100%;
-	background-color: #fff;
-}
-
-table.listResults td {
-	padding: 2px;
-}
-
-table.listContainer {
-    border: 0;
-	padding: 0;
-	margin:0;
-	width: 100%;
-	clear: both;
-}
-
-tr.containerHeader, tr.containerHeader td {
-	background: transparent;
-} 
-
-tr.even td, .wizContainer tr.even td {
-	background-color: #f9f9f1;
-} 
-tr.red_even td, .wizContainer tr.red_even td {
-	background-color: #f97e75;
-	color: #ffffff;
-}
-tr.red td, .wizContainer tr.red td {
-	background-color: #f9a397;
-	color: #ffffff;
-}
-tr.orange_even td, .wizContainer tr.orange_even td {
-	background-color: #f4d07a;
-}
-tr.orange td, .wizContainer tr.orange td {
-	background-color: #f4e96c;
-} 
-tr.green_even td, .wizContainer tr.green_even td {
-	background-color: #bee5a3;
-} 
-tr.green td, .wizContainer tr.green td {
-	background-color: #b3e5b4;
-} 
-
-tr td.hover, tr.even td.hover, .hover a, .hover a:visited, .hover a:hover, .wizContainer tr.even td.hover,  .wizContainer tr td.hover {
-	background-color: #fdf5d0;
-	color: #000000;
-}
-
-th {
-    font-family: Tahoma, Verdana, Arial, Helvetica;
-    font-size: 8pt;
-    color: #1C94C4;
-    height:20px;
-    background: #f6f6f1 url(../images/grey-header.gif) bottom repeat-x;	
-}
-
-th.header {
-	cursor: pointer;
-	background-repeat: no-repeat;
-	background-position: center right;
-	background-image: url(../images/bg.gif);
-	background-repeat: no-repeat;
-	padding-right: 16px; // some space for the asc/desc icons
-}
-
-th.headerSortUp {
-	background-image: url(../images/asc.gif);
-	text-decoration: underline;
-	cursor: pointer;
-}
-
-th.headerSortDown {
-	background-image: url(../images/desc.gif);
-	text-decoration: underline;
-	cursor: pointer;
-}
-
-td {
-    font-family: Tahoma, Verdana, Arial, Helvetica;
-    font-size: 12px;
-    color:#696969;
-	nobackground-color: #ffffff;
-	padding: 0px;
-}
-
-tr.clicked td {
-    font-family: Tahoma, Verdana, Arial, Helvetica;
-    font-size: smaller;
-	background-color: #ffcfe8;
-}
-
-td.label {
-	vertical-align: top;
-}
-td.label span {
-    font-family: Tahoma, Verdana, Arial, Helvetica;
-    font-size: 12px;
-    color: #000000;
-    padding: 5px;
-    padding-right: 10px;	
-    font-weight:bold;
-    vertical-align: top;
-    text-align: right;
-    display: block;
-}
-fieldset td.label span {
-    padding: 3px;
-    padding-right: 10px;
-}
-fieldset {
-    margin-top: 3px;	
-    -moz-border-radius: 6px;
-	-webkit-border-radius: 6px;
-	border-radius: 6px;
-	border-style: solid;
-	border-color: #ddd;
-}
-
-legend {
-    font-family: Tahoma, Verdana, Arial, Helvetica;
-    font-size: 12px;
-	padding:8px;
-	color: #fff;
-	background-color: #1C94C4;
-	font-weight: bold;
-	-moz-border-radius: 6px;
-	-webkit-border-radius: 6px;
-	border-radius: 6px;
-}
-legend.transparent {
-	background: transparent;
-	color: #333333;
-	font-size: 1em;
-	font-weight: normal;
-	padding: 0;
-}
-.ui-widget-content td legend a, .ui-widget-content td legend a:hover, .ui-widget-content td legend a:visited {
-	color: #fff;
-}
-
-.ui-widget-content td a, p a, p a:visited, td a, td a:visited {
-	text-decoration:none;
-	color: #1C94C4;
-	padding-left:14px;
-	background: url(../images/mini-arrow-orange.gif) no-repeat left;
-}
-p a:hover, td a:hover {
-	text-decoration:underline;
-	color:#EB8F00;
-	padding-left:14px;
-	background: url(../images/mini-arrow-orange.gif) no-repeat left;
-}
-
-td a.no-arrow, td a.no-arrow:visited, .SearchDrawer a.no-arrow, .SearchDrawer a.no-arrow:visited {
-	text-decoration:none;
-	color:#000000;
-	padding-left:0px;
-	background: inherit;
-}
-td a.no-arrow:hover {
-	text-decoration:underline;
-	color:#d81515;
-	padding-left:0px;
-	background: inherit;
-}
-td a.mailto, td a.mailto:visited {
-	text-decoration:none;
-	color:#000000;
-	padding-left:20px;
-	background: url(../images/mail.png) no-repeat left;
-}
-td a.mailto:hover {
-	text-decoration:underline;
-	color:#EB8F00;
-	padding-left:20px;
-	background: url(../images/mail.png) no-repeat left;
-}
-
-a.small_action {
-    font-family: Tahoma, Verdana, Arial, Helvetica;
-    font-size: 8pt;
-    color: #000000;
-	text-decoration:none;
-}
-.display_block {
-	padding:0.25em;
-}
-.actions_details {
-	float:right;
-	margin-top:10px;
-	margin-right:10px;
-	padding-left: 5px;
-	padding-top: 2px;
-	padding-bottom: 2px;
-	background: url(../images/actions_left.png) no-repeat left;
-}
-.actions_details span{
-	background: url(../images/actions_right.png) no-repeat right;
-	color: #fff;
-	font-weight: bold;
-	padding-top: 2px;
-	padding-bottom: 2px;
-	padding-right: 12px;
-}
-.actions_details a {
-	text-decoration:none;
-}
-.loading {
-	noborder: 1px dashed #CCC;
-	background: #b9c1c8;
-	padding:0.25em;
-}
-
-input.textSearch {
-	border:1px solid #000;
-	font-family:Tahoma,Verdana, Arial, Helvetica, sans-serif;
-	font-size: 12px;
-	color:#000000;
-}
-
-.ac_input {
-	border: 1px solid #7f9db9;
-	background: #fff url(../images/ac-background.gif) no-repeat right;
-}
-
-/* By Rom */
-.csvimport_createobj {
-    color: #AA0000;
-    background-color:#EEEEEE;
-}
-.csvimport_error {
-    font-weight: bold;
-    color: #FF0000;
-    background-color:#EEEEEE;
-}
-.csvimport_warning {
-    color: #CC8888;
-    background-color:#EEEEEE;
-}
-.csvimport_ok {
-    color: #00000;
-    background-color:#BBFFBB;
-}
-.csvimport_reconkey {
-    font-style: italic;
-    color: #888888;
-    background-color:#FFFFF;
-}
-.csvimport_extreconkey {
-    color: #888888;
-    background-color:#FFFFFF;
-}
-
-#accordion h3 {
-	padding: 10px;
-}
-
-.ui-accordion-content ul {
-    list-style:none;
-    padding-left:16px;
-	margin-top: 8px;
-}	
-
-.ui-accordion-content li.submenu {
-	margin-top: 8px;
-}	
-
-.ui-accordion-content ul ul {
-	padding: 8px 0px 8px 8px;
-	margin:0;
-    list-style:none;
-    border: 0;
-}	
-	
-.nothing {
-    noborder-top: 1px solid #8b8b8b;
-    padding: 4px 0px 0px 16px;   	
-	font-size:8pt;
-    background: url(../images/green-square.gif) no-repeat bottom left;
-    color:#83b217;
-    font-weight:bold;
-	text-decoration:none;
-}
-div.ui-accordion-content {
-	padding-top: 10px;
-	padding-left: 10px;
-}
-.ui-accordion-content a, ui-accordion-content a:visited {
-	color:	#1C94C4;
-	text-decoration:none;
-}
-
-.ui-accordion-content a:hover {
-	color: 	#EB8F00;
-	text-decoration: none;
-}
-.ui-accordion-content p {
-	color:#8b8b8b;
-	text-decoration:none;
-	margin: 0;
-	padding-bottom: 1px;
-	font-size: 9pt;
-    font-weight:normal;
-    border: 0;
-}
-
-.ui-accordion-content ul { 
-	padding-left: 0;
-	margin-top: 0;
-}
-
-.ui-accordion-content li { 
-	color:#8b8b8b;
-	text-decoration:none;
-	margin: 0;
-	padding: 0px 0pt 0px 16px;
-	font-size: 9pt;
-    background: url(../images/mini-arrow-orange.gif) no-repeat top left;
-    font-weight:normal;
-    border: 0;
-}
-
-a.CollapsibleLabel, td a.CollapsibleLabel { 
-	margin: 0;
-	padding: 0px 0pt 0px 16px;
-	font-size:8pt;
-	text-decoration:none;
-	color:#8b8b8b;
-    background: url(../images/mini-arrow-orange.gif) no-repeat left;
-}
-
-/* Beware: IE6 does not support multiple selector with multiple classes, only the last class is used */
-a.CollapsibleLabel.open,  td a.CollapsibleLabel.open { 
-	margin: 0;
-	padding: 0px 0pt 0px 16px;
-	font-size:8pt;
-	text-decoration:none;
-	color: #EB8F00;
-    background: url(../images/mini-arrow-orange-open.gif) no-repeat left;
-}
-
-.page_header {
-	background-color:#f6f6f1;
-	padding:5px;
-}
-/* move up a header immediately following a display block (i.e. "actions" menu) */
-.display_block + .page_header {
-	margin-top: -8px;
-}
-
-.notreeview li { background: url(../images/tv-item.gif) 0 0 no-repeat; }
-.notreeview .collapsable { background-image: url(../images/tv-collapsable.gif); }
-.notreeview .expandable { background-image: url(../images/tv-expandable.gif); }
-.notreeview .last { background-image: url(../images/tv-item-last.gif); }
-.notreeview .lastCollapsable { background-image: url(../images/tv-collapsable-last.gif); }
-.notreeview .lastExpandable { background-image: url(../images/tv-expandable-last.gif); }
-
-#OrganizationSelection {
-    padding:5px 0px 16px 20px;
-}
-
-/* popup menus */
-div.itop_popup {
-	margin: 0;
-	padding: 0;
-	float:right;
-}
-div.itop_popup > ul > li {
-	list-style: none;
-	cursor: pointer;
-}
-
-div.actions_menu > ul {
-	height:19px;
-	line-height: 17px;
-	vertical-align: middle;
-	display:block;
-	nowidth:70px; /* Nasty work-around for IE... en attendant mieux */
-	padding-left: 5px;
-	background: url(../images/actions_left.png) no-repeat top left;
-	cursor: pointer;
-	margin: 0;
-}
-
-div.actions_menu > ul > li {
-	float: left;
-	list-style: none;
-	font-size: 11px;
-	font-family: Tahoma,sans-serif;
-	height: 17px;
-	padding-right: 16px;
-	padding-left: 4px;
-	background: url(../images/actions_right.png) no-repeat top right transparent;
-	font-weight: bold;
-	color: #fff;
-	vertical-align: middle;
-	margin: 0;
-}
-#logOffBtn > ul > li {
-	list-style: none;
-	vertical-align: middle;
-	margin: 0;
-	padding: 0;
-	cursor: pointer;
-}
-#logOffBtn > ul {
-	list-style: none;
-	vertical-align: middle;
-	margin: 0;
-	padding: 0;
-	height: 25px;
-	noline-height: 25px;
-}
-	
-.itop_popup li a, #logOffBtn li a {
-	display: block;
-	padding: 5px 12px;
-	text-decoration: none;
-	nowidth: 70px;
-	color: #000;
-	font-weight: bold;
-	white-space: nowrap;
-	background: #fff;
-}
-
-#logOffBtn li span {
-	display: block;
-	padding: 5px 12px;
-	text-decoration: none;
-	nowidth: 70px;
-	color: #000;
-	white-space: nowrap;
-	background: #fff;
-}
-.itop_popup ul {
-	padding-left: 0;
-}
-
-.menucontainer div.toolkit_menu {
-	margin-left: 10px;
-}
-
-.itop_popup li a:hover, #logOffBtn li a:hover {
-	background: #1A4473;
-}
-
-.itop_popup ul > li > ul, #logOffBtn ul > li > ul
-{	
-	border: 1px solid black;
-	background: #fff;
-}
-	
-.itop_popup li > ul, #logOffBtn li > ul
-{	margin: 0;
-	padding: 0;
-	position: absolute;
-	display: none;
-	border-top: 1px solid white;
-	z-index: 999;
-}
-
-.itop_popup li ul li,  #logOffBtn li ul li {
-	float: none;
-	display: inline;
-}
-
-.itop_popup li ul li a, #logOffBtn li ul li a {
-	width: auto;
-	text-align: left;
-}
-
-.itop_popup li ul li a:hover, #logOffBtn li ul li a:hover{
-	background: #D81515;
-	color: #fff;
-	font-weight: bold;
-}
-.itop_popup > ul {
-	margin: 0;
-}
-hr.menu-separator {
-	border: none 0;
-	border-top: 1px solid #ccc;;
-	color: #ccc;
-	background-color: transparent;
-	height: 1px;
-	margin: 3px;
-	cursor: default;
-}
-/************************************/
-.wizHeader {
-	background: #1c94c4;
-	padding: 15px;
-}
-.wizSeparator {
-	float:left;
-	background: #83b217;
-	height: 29px;
-	margin-top: 5px;
-}
-div.wizActiveStep {
-	height: 29px;
-	background: url(../images/wizActiveStepLeft.gif) no-repeat left;
-	color: #d81515;
-	padding-left: 8px;
-	margin-top: 5px;
-	vertical-align: middle;
-	float: left;
-}
-div.wizActiveStep span {
-	height: 29px;
-	background: url(../images/wizActiveStepRight.gif) no-repeat top right;
-	padding-right: 8px;
-	padding-top: 8px;
-	float:left;
-}
-
-div.wizStep {
-	height: 29px;
-	background: url(../images/wizStepLeft.gif) no-repeat left;
-	padding-left: 8px;
-	vertical-align: middle;
-	margin-top: 5px;
-	float:left;
-}
-div.wizStep span {
-	height: 29px;
-	background: url(../images/wizStepRight.gif) no-repeat top right;
-	padding-right: 8px;
-	padding-top: 8px;
-	float:left;
-}
-.wizContainer {
-	border: 5px solid #1c94c4;
-	background: #d6e8ef;
-	padding: 5px;
-}
-
-.wizContainer table tr td {
-	background: transparent;
-}
-.alignRight {
-	text-align: right;
-	padding: 3px;
-}
-
-.alignLeft {
-	text-align: left;
-	padding: 3px;
-}
-
-.red {
-	background-color: #ff6000;
-	color: #000;
-}
-
-th.red {
-	background: url(../images/red-header.gif) bottom left repeat-x;
-	color: #000;
-}
-
-.green {
-	background-color: #00cc00;
-	color: #000;
-}
-th.green {
-	background: url(../images/green-header.gif) bottom left repeat-x;
-	color: #000;
-}
-
-.orange {
-	background-color: #ffde00;
-	color: #000;
-}
-
-th.orange {
-	background: url(../images/orange-header.gif) bottom left repeat-x;
-	color: #000;
-}
-
-/* For Date Picker: Creates a little calendar icon
- * instead of a text link for "Choose date"
- */
-td a.dp-choose-date, a.dp-choose-date, td a.dp-choose-date:hover, a.dp-choose-date:hover, td a.dp-choose-date:visited, a.dp-choose-date:visited {
-	float: left;
-	width: 16px;
-	height: 16px;
-	padding: 0;
-	margin: 5px 3px 0;
-	display: block;
-	text-indent: -2000px;
-	overflow: hidden;
-	background: url(../images/calendar.png) no-repeat; 
-}
-td a.dp-choose-date.dp-disabled, a.dp-choose-date.dp-disabled {
-	background-position: 0 -20px;
-	cursor: default;
-}
-/* For Date Picker: makes the input field shorter once the date picker code
- * has run (to allow space for the calendar icon)
- */
-input.dp-applied {
-	width: 140px;
-	float: left;
-}
-
-/* For search forms */
-.SearchDrawer {
-	//background: #1c94c4 url(../images/search-top-left-corner.png) top left no-repeat;
-	border-top: 5px solid #1c94c4;
-	border-left: 5px solid #1c94c4;
-	border-right: 5px solid #1c94c4;
-	border-bottom: 0;
-	background: #d6e8ef;
-	color: #000;
-	padding: 10px;
-	margin: 0;
-	font-size: 12px;
-}
-.SearchDrawer label {
-	background: #d6e8ef;
-	color: #000;
-}
-.SearchDrawer h1 {
-	color: #000;
-}
-.DrawerClosed {
-	display: none;
-}
-.DrawerHandle {
-	margin: 0;
-	padding: 5px;
-	background: url(../images/drawer-handle.gif) bottom no-repeat transparent;
-	color: #fff;
-	cursor: pointer;
-	text-align: center;
-	/* center the block */
-	width: 100px;
-	margin-left: auto;
-	margin-right: auto;
-	margin-top: 0;
-	margin-bottom: 0;
-	display: block;
-	font-size: 12px;
-}
-
-div.HRDrawer {
-	height: 5px;
-	width: 100%;
-	margin: 0;
-	background-color:  #1c94c4;
-	margin: 0;
-	padding: 0;
-	border: 0;
-	display: block;
-}
-.mini_tabs a {
-	text-decoration: none;
-	font-weight:bold;
-	color: #ccc;
-	background-color:#333;
-	padding-left: 1em;
-	padding-right: 1em;
-	padding-bottom: 0.25em;
-}
-.mini_tabs a.selected {
-	color: #fff;
-	background-color:  #1c94c4;
-	padding-top: 0.25em;
-}
-.mini_tabs ul {
-	margin: -10px;
-}
-.mini_tabs ul li {
-	float: right;
-	list-style: none;
-	nopadding-left: 1em;
-	nopadding-right: 1em;
-	margin-top: 0;
-}
-.mandatory {
-	border: 1px solid #f00;
-}
-
-/* Beware: IE6 does not support multiple selector with multiple classes, only the last class is used */
-table.listResults tr.odd td.truncated, table.listResults tr td.truncated, .wizContainer table.listResults tr.odd td.truncated, .wizContainer table.listResults tr td.truncated {
-	background: url(../images/truncated.png) bottom  repeat-x;
-}
-
-/* Beware: IE6 does not support multiple selector with multiple classes, only the last class is used */
-table.listResults tr.even td.truncated, .wizContainer table.listResults  tr.even td.truncated {
-	background: #f9f9f1 url(../images/truncated.png) bottom  repeat-x;
-}
-
-/* Beware: IE6 does not support multiple selector with multiple classes, only the last class is used */
-table.listResults tr.even td.hover.truncated, , .wizContainer table.listResults  tr.even td.hover.truncated {
-	background: #fdf5d0 url(../images/truncated.png) bottom  repeat-x;
-}
-
-/* Beware: IE6 does not support multiple selector with multiple classes, only the last class is used */
-table.listResults tr.odd td.hover.truncated,  table.listResults tr td.hover.truncated, .wizContainer table.listResults  tr.odd td.hover.truncated, .wizContainer table.listResults  tr td.hover.truncated {
-	background: #fdf5d0 url(../images/truncated.png) bottom  repeat-x;
-}
-
-table.listResults.truncated {
-	border-bottom: 0;
-	padding-bottom: 0;
-}
-
-tr.csv_row0 td {
-	padding-top:5px;
-	padding-bottom:5px;
-	padding-left:10px;
-	padding-right:10px;
-	background: #fff;
-	border-left: #000 1px solid;
-	
-}
-tr.csv_row1 td {
-	padding-top:5px;
-	padding-bottom:5px;
-	padding-left:10px;
-	padding-right:10px;
-	background: #f9f9f1;
-	border-left: #000 1px solid;
-	
-}
-tr.csv_row1 th, tr.csv_row0 th {
-	padding-top:5px;
-	padding-bottom:5px;
-	padding-left:10px;
-	padding-right:10px;
-	border-left: #000 1px solid;
-	
-}
-
-td.cell_modified {
-	font-weight: bold;
-	color: #000;
-}
-
-td.cell_error {
-	font-weight: bold;
-	color: #D81515;
-}
-table.transparent, table.transparent td {
-	background: transparent;
-}
-p.page-header {
-	color:#1c94c4;
-	font-weight: bold;
-	font-size: 12pt;
-	font-family: Verdana, Arial, Helvetica, Sans-Serif
-}
-td.dashboard {
-	vertical-align:top;
-	border: 1px solid #ccc;
-	-moz-border-radius: 10px;
-	-webkit-border-radius: 10px;
-	border-radius: 10px;
-	padding: 10px;
-	width: 50%;
-}
-.white {
-	background-color: #fff;
-}
-
-/*** New Lacanau layout ***/
-
-.ui-layout-pane { /* all 'panes' */ 
-	overflow: auto;
-} 
-
-.ui-layout-resizer { /* all 'resizer-bars' */ 
-	background: #DDD; 
-} 
-.ui-layout-toggler { /* all 'toggler-buttons' */ 
-	background: #AAA; 
-}
-div#top-left {
-	width: 28px;
-	height: 70px;
-	background: #f6f6f1 url(../images/top-left-bkg.png) top left no-repeat;
-	float:left;
-}
-div#header-logo {
-	width: 100%;
-	height: 70px;
-	background: #f6f6f1 url(../images/splitter-top.png) top repeat-x;
-}
-.ui-layout-pane-west {
-	background: #f6f6f1 url(../images/left-bkg.png) left repeat-y;
-}
-div#right {
-	min-width: 260px;
-}
-div#menu {
-	width: 100%;
-	overflow: auto;
-}
-.header-menu {
-	padding-left: 24px;
-	padding-right: 8px;
-	padding-bottom: 24px;
-	background: transparent;
-}
-div#inner_menu {
-	padding-left: 24px;
-	padding-right: 8px;
-	background: transparent;
-}
-div#logo {
-	height: 70px;
-	nowidth: 100%;
-	text-align: center;
-}
-div#logo div {
-	height: 88px;
-	width: 244px;
-	background: url(../images/itop-logo-2.png) left no-repeat;
-}
-#top-bar {
-	height: 55px;
-	background: url(../images/banner-bkg.png) repeat-x scroll 0 0 transparent;
-	text-align: right;
-}
-#admin-banner {
-	float: left;
-	margin-top: 2px;
-	padding: 8px;
-	border: 1px solid #c33;
-	background-color: #fee;
-	-moz-border-radius: 0.5em;
-}
-#global-search {
-	height: 55px;
-	float: right;
-	background: url(../images/banner-search.png) no-repeat;
-	nopadding-top: 15px;
-	text-align: right;
-	overflow-y: hidden;
-}
-#global-search > form div {
-	padding-left: 4px;
-}
-#global-search table, #global-search tr td,  #global-search tr {
-	padding: 0;
-	border: 0;
-	height: 55px;
-	margin: 0;
-	background: transparent;
-	overflow-y: hidden;
-	vertical-align: middle;
-}
-#global-search > form input[type="text"] {
-	border: 0;
-	height: 18px;
-	width: 180px;
-	padding-top: 4;
-	background: transparent;
-}
-#global-search > form tr td#g-search-input {
-	padding-top: 3px;
-	padding-left: 3px;
-	background: transparent;
-}
-div.icon {
-	width: 20px;
-	height: 20px;
-	margin: 2px;
-	float: right;
-}
-span.ui-icon {
-	float:left;
-	margin:0 2px;
-}
-.ui-layout-button-pin-down {
-	background: url(../images/splitter-bkg.png) transparent;
-	width: 16px;
-	background-position: -144px -144px;
-}
-.ui-layout-resizer-west-open {
-	background: url(../images/splitter-bkg.png) repeat-y scroll 0 0 transparent;
-	width: 16px;
-}
-div.footer img {
-	border: 0;
-	margin-bottom: 5px;
-	margin-top: 5px;
-}
-div.footer{
-	text-align:center;
-}
-#SearchResultsToAdd table.listResults tbody {
-	height: 300px;
-	overflow-y: auto;
-}
-tr.row_unchanged td {
-	border-bottom: 1px #ccc solid;
-	padding: 2px;
-}
-.wizContainer table tr.row_error td {
-	border-bottom: 1px #ccc solid;
-	background-color: #fdd;
-	padding: 2px;
-}
-tr.row_modified td {
-	border-bottom: 1px #ccc solid;
-	padding: 2px;
-}
-tr.row_added td {
-	border-bottom: 1px #ccc solid;
-	padding: 2px;
-}
-a.truncated {
-	cursor: pointer;
-}
-.org_combo
-{
-	font-size:x-small;
-	width: auto;
-	max-width: 200px; 
-}
-span.form_validation {
-	width:24px;
-	text-align:center;
-}
-.notification {
-	border: 1px solid #c33;
-	background-color: #fee;
-	padding: 0.5em;
-	margin: 0.5em;
-	text-align:center;
-	width: 95%;
-	-moz-border-radius: 0.5em;
-}
-.wiki_broken_link {
-	text-decoration: line-through;
-}
-.synoptics, .synoptics tr td {
-	background: transparent;
-	padding:10px;
-	font-size:1em;
-	vertical-align:middle;
-	color:#fff;
-	text-align:center;
-}
-.synoptics tr td.arrow {
-	color:#333;
-	border-top: 1px dashed #333;
-	width:100px;
-}
-.synoptics tr.synoptics_header td {
-	color:#000; font-size:1em;
-	vertical-align:middle;
-	text-align:center;
-}
-.mono_value {
-	display: inline-block;
-	background-color: #3c3;
-	color: #fff;
-	font-weight:bold;
-	padding: 3px;
-	padding-left: 5px;
-	padding-right: 5px;
-	margin-left:3px;
-	-moz-border-radius: 10px;
-	-webkit-border-radius: 10px;
-	border-radius: 10px;
-}
-.multi_values {
-	display: inline-block;
-	background-color: #c33;
-	color: #fff;
-	font-weight:bold;
-	padding: 3px;
-	padding-left: 5px;
-	padding-right: 5px;
-	margin-left:3px;
-	-moz-border-radius: 10px;
-	-webkit-border-radius: 10px;
-	border-radius: 10px;
-}
-.caselog {
-	overflow-x: hidden;
-	display: block;
-	overflow-y: auto;
-	border: 1px #ddd solid;
-    font-family: Tahoma, Verdana, Arial, Helvetica;
-    font-size: 12px;
-}
-.caselog_input_header {
-	padding-top:3px;
-	padding-bottom:3px;
-	border-top:1px solid #fff;
-	background: #ddd;
-	width:100%;
-}
-.caselog_header {
-	padding:3px;
-	border-top:1px solid #fff;
-	background: #ddd url(../images/plus.gif) left no-repeat;
-	padding-left: 16px;
-	cursor: pointer;
-	width:100%;
-}
-.caselog_header.open {
-	background: #ddd url(../images/minus.gif) left no-repeat;
-}
-.caselog_entry {
-	padding:3px;
-	padding-left: 16px;
-	border-bottom:1px #999 solid;
-	margin-left:0;
-	margin-right:0;
- 	white-space: pre-wrap; /* css-3 */
-    white-space: -moz-pre-wrap; /* Mozilla, since 1999 */
-    white-space: -pre-wrap; /* Opera 4-6 */
-    white-space: -o-pre-wrap; /* Opera 7 */
-    word-wrap: break-word; /* Internet Explorer 5.5+, CSS3 */
-}
-table.details {
-  border-collapse: collapse;
-  noborder-bottom: 2px #fff solid;
-  width:100%;
-}
-table.details>tbody>tr>td {
-	border-bottom: 2px #ddd solid;
-	padding-bottom: 5px;
-	padding-top: 3px;
-}
-fieldset table.details>tbody>tr>td {
-	padding-top: 3px;
-	background: transparent;
-	border: 0;
-}
-.ac_dlg_loading {
-	background: white url('../images/indicator.gif') right center no-repeat;
-}
-table.pagination {
-	display:inline-block;
-}
-table.pagination tr td {
-	padding: 3px;
-}
-.pagination_container {
-	padding-left: 3px;
-}
-.pager p {
-	margin-top: 0;
-	margin-bottom: 0;
-}
-.pager td span {
-	min-width: 20px;
-	padding-left: 2px;
-	padding-right: 2px;
-	display:inline-block;
-	text-align: center;
-	cursor: pointer;
-}
-
-.pager td span.curr_page {
-	color: #fff;
-	background: #999;
-	-moz-border-radius: 4px;
-	-webkit-border-radius: 4px;
-	border-radius: 4px;
-}
-img.prev, img.first, img.next, img.last {
-	cursor: pointer;
-}
-div.actions_button {
-	float:right;
-	background: url("../images/actions_left.png") no-repeat scroll left top transparent;
-	padding-left: 5px;
-	margin-top: 0;
-	margin-right: 10px;
-	height:17px;
-	vertical-align: middle;
-}
-
-div.actions_button a, .actions_button a:hover, .actions_button a:visited {
-	background:url(../images/actions_bkg.png) no-repeat scroll right top transparent;
-	color:#fff;
-	padding-right: 8px;
-	cursor:pointer;
-	font-family: Tahoma,sans-serif;
-	font-size: 11px;
-	font-weight: bold;
-	padding-left: 4px;
-	text-decoration: none;
-	height:17px;
-	line-height: 17px;
-	display: block;
-}
-select#org_id {
-	max-width: 90%;
-}
-/*********** Dashboards ***********/
-.itop-dashboard {
-	background-color: #fff;
-}
-.dragHover {
-	background: url(./ui-lightness/images/ui-bg_diagonals-thick_20_666666_40x40.png);
-}
-.edit_mode .dashlet {
-	background: url(./ui-lightness/images/ui-bg_diagonals-thick_20_666666_40x40.png);
-	padding: 5px;
-	margin:0;
-	position:relative;
-}
-.edit_mode .dashlet-selected {
-	background: #EB8F00 !important;
-	padding: 5px;
-	margin:0;
-}
-td.layout_cell {
-	height: 50px; /* min-height does not work */
-	vertical-align: top;
-}
-.dashlet-content {
-	background: #fff;
-	margin:0;
-}
-table.prop_table {
-    border-bottom: 2px solid #F9F9F1;
-    padding: 1px;
-    width: 100%;
-}
-.close-box {
-	margin: 5px;
-	width: 20px;
-	height: 20px;
-	position: absolute;
-	top: 0;
-	right: 0;
-	z-index: 10;
-	background: transparent url(../images/delete.png) no-repeat center;
-}
-td.prop_value {
-	text-align: left;
-}
-tr.itop-property-field-modified td {
-	background: #fbb;
-}
-tr.itop-property-field-modified td.hover {
-	background: #f99;
-}
-td.prop_value textarea, td.prop_value input[type=text]{
-	width: 98%;
-}
-td.prop_icon {
-	width: 20px;
-}
-
-.dashlet {
-	text-align:left;
-}
-.dashlet-inline {
-	display: inline-block;
-}
-.dashlet-badge a.actions {
-    background: none repeat scroll 0 0 transparent;
-    color: #666666;
-    font-size: 16px;
-    text-decoration: none;
-}
-.dashlet-content .display_block {
-	text-align:left;
-}
-.prop_apply .ui-icon-alert {
-	display: none;
-}
-.prop_apply .ui-state-error .ui-icon-alert {
-	display: block;
-}
-.ui-state-error .ui-icon-circle-check {
-	display: none;
-}
-.summary-details {
-    float: right;
-    margin-top: 5px;
-}
-.summary-details th {
-    background: none repeat scroll 0 0 #CCCCCC;
-    color: #EEEEEE;
-    padding: 5px;
-    text-align: center;
-}
-.main_header {
-    background-color: #F1F1F6;
-    min-height: 60px;
-    width: 100%;
-}
-.main_header h1 {
-    color: #1C94C4;
-    line-height: 16px;
-    margin-bottom: 0;
-    margin-top: 0;
-    padding-bottom: 10px;
-    padding-top: 10px;
-}
-.main_header img {
-	margin-top: 10px;
-	margin-right: 10px;
-	float:left;
-}
-a.summary,  a.summary:hover {
-    background: none repeat scroll 0 0 transparent;
-    color: #666666;
-    text-decoration: none;
-    padding-left: 0;
-}
-.summary-details td {
-    background: none repeat scroll 0 0 transparent;
-    padding: 5px;
-    text-align: center;
-}
-
-#DashboardMenu > ul > li {
-	list-style: none;
-	vertical-align: middle;
-	margin: 0;
-	padding: 0;
-	cursor: pointer;
-}
-
-#DashboardMenu > ul {
-	list-style: none;
-	vertical-align: middle;
-	margin: 0;
-	padding: 0;
-	height: 25px;
-}
-#DashboardMenu li a {
-	display: block;
-	padding: 5px 12px;
-	text-decoration: none;
-	color: #000;
-	font-weight: bold;
-	text-align: left;
-	white-space: nowrap;
-	background: #fff;
-}
-#DashboardMenu li span {
-	display: block;
-	padding: 5px 12px;
-	text-decoration: none;
-	color: #000;
-	white-space: nowrap;
-	background: #fff;
-}
-#DashboardMenu li {
-	list-style: none;
-}
-#DashboardMenu li a:hover {
-	background: #1A4473;
-}
-
-#DashboardMenu ul > li > ul
-{	
-	border: 1px solid black;
-	background: #fff;
-}
-	
-#DashboardMenu li > ul
-{	margin: 0;
-	padding: 0;
-	position: absolute;
-	display: none;
-	border-top: 1px solid white;
-	z-index: 999;
-}
-#DashboardMenu li ul li a:hover{
-	background: #D81515;
-	color: #fff;
-	font-weight: bold;
-	list-style: none;
-}
-.sortable_field_list {
-	display: inline-block;
-	width: 250px;
-	height: 150px;
-	border: 1px #333 solid;
-	overflow: auto;
-	padding-left: 0;
-	margin: 0;
-}
-.sortable_field_list li {
-	list-style: none;
-	font-size: 11px;
-}
-.sort_order {
-	display: inline-block;
-	width: 16px;
-	height: 12px;
-}
-.sort_none {
-	background: url(../images/bg.gif) no-repeat center;
-}
-.sort_asc {
-	background: url(../images/desc.gif) no-repeat center;
-}
-.sort_desc {
-	background: url(../images/asc.gif) no-repeat center;
-}
-.sort_hidden {
-	display: none;
-}
-.sortable_field_list > li.selected {
-	background: #F6A828;
-}
-.itop-deleted-object {
-	text-decoration: line-through;
-}
-.header_message {
-	padding: 1em;
-	font-size: 10pt;
-	background: #fff;
-	border: 1px solid #999;
-	-moz-border-radius: 4px;
-	-webkit-border-radius: 4px;
-	border-radius: 4px;
-	margin-bottom: 10px;
-}
-.header_message {
-	padding: 1em;
-	font-size: 10pt;
-	background: #fff;
-	border: 1px solid #999;
-	-moz-border-radius: 4px;
-	-webkit-border-radius: 4px;
-	border-radius: 4px;
-	margin-bottom: 10px;
-}
-.message_info {
-	border: 1px solid #993;
-	background: url(../images/info-mini.png) 1em 1em no-repeat #ffc;
-	padding-left: 3em;
-}
-.message_ok {
-	border: 1px solid #393;
-	background: url(../images/ok.png) 1em 1em no-repeat #cfc;
-	padding-left: 3em;
-}
-.message_error {
-	border: 1px solid #933;
-	background: url(../images/error.png) 1em 1em no-repeat #fcc;
-	padding-left: 3em;
-}
-.fg-menu a img {
-        border: 0;
-}
-div.ui-dialog-header {
-    padding-bottom: 10px;
-    padding-top: 7px;
-}
-.form_field_error {
-	border: 1px solid #933;
-	background: #fcc;
-}
-.simple-graph {
-	background: #fff;
-}
+/*
+ * CSS Document
+ */
+body {
+  font-family: Tahoma, Verdana, Arial, Helvetica;
+  font-size: 10pt;
+  color: black;
+  margin: 0;
+  /*
+ * Remove body margin/padding
+ */
+
+  padding: 0;
+  overflow: hidden;
+  /*
+ * Remove scroll bars on browser window
+ */
+
+}
+
+
+/*
+ * to prevent flicker, hide the pane's content until it's ready
+ */
+.ui-layout-center, .ui-layout-north, .ui-layout-south {
+  display: none;
+}
+
+
+.ui-layout-content {
+  padding-left: 10px;
+}
+
+
+.raw_output {
+  font-family: Courier-New, Courier, Arial, Helvetica;
+  font-size: 8pt;
+  background-color: #eeeeee;
+  color: black;
+  border: 1px dashed black;
+  padding: 0.25em;
+  margin-top: 1em;
+}
+
+
+h1 {
+  font-family: Tahoma, Verdana, Arial, Helvetica;
+  color: black;
+  font-weight: bold;
+  font-size: 12pt;
+}
+
+
+h2 {
+  font-family: Tahoma, Verdana, Arial, Helvetica;
+  color: black;
+  font-weight: normal;
+  font-size: 12pt;
+}
+
+
+h3 {
+  font-family: Tahoma, Verdana, Arial, Helvetica;
+  color: black;
+  font-weight: normal;
+  font-size: 10pt;
+}
+
+
+.hilite, .hilite a, .hilite a:visited {
+  color: #e87c1e;
+  text-decoration: none;
+}
+
+
+table.datatable {
+  width: 100%;
+  border: 0;
+  padding: 0;
+}
+
+
+td.menucontainer {
+  text-align: right;
+}
+
+
+table.listResults {
+  padding: 0px;
+  border-top: 3px solid #f1f1f1;
+  border-left: 3px solid #f1f1f1;
+  border-bottom: 3px solid #e6e6e1;
+  border-right: 3px solid #e6e6e1;
+  width: 100%;
+  background-color: white;
+}
+
+
+table.listResults td {
+  padding: 2px;
+}
+
+
+table.listContainer {
+  border: 0;
+  padding: 0;
+  width: 100%;
+  clear: both;
+}
+
+
+tr.containerHeader, tr.containerHeader td {
+  background: transparent;
+}
+
+
+.wizContainer tr.even td, tr.even td {
+  background-color: #f1f1f1;
+}
+
+
+.wizContainer tr.red_even td, tr.red_even td {
+  background-color: #f97e75;
+  color: white;
+}
+
+
+.wizContainer tr.red td, tr.red td {
+  background-color: #f9a397;
+  color: white;
+}
+
+
+.wizContainer tr.orange_even td, tr.orange_even td {
+  background-color: #f4d07a;
+}
+
+
+.wizContainer tr.orange td, tr.orange td {
+  background-color: #f4e96c;
+}
+
+
+.wizContainer tr.green_even td, tr.green_even td {
+  background-color: #bee5a3;
+}
+
+
+.wizContainer tr.green td, tr.green td {
+  background-color: #b3e5b4;
+}
+
+
+.hover a, .hover a:hover, .hover a:visited, .wizContainer tr td.hover, .wizContainer tr.even td.hover, tr td.hover, tr.even td.hover {
+  background-color: #fdf5d0;
+  color: black;
+}
+
+
+th {
+  font-family: Tahoma, Verdana, Arial, Helvetica;
+  font-size: 8pt;
+  color: #1c94c4;
+  height: 20px;
+  background: #f1f1f1 bottom repeat-x;
+}
+
+
+th.header {
+  cursor: pointer;
+  background-repeat: no-repeat;
+  background-position: center right;
+  background-repeat: no-repeat;
+  padding-right: 16px;
+}
+
+
+th.headerSortUp {
+  background-image: url(../images/asc.gif);
+  text-decoration: underline;
+  cursor: pointer;
+}
+
+
+th.headerSortDown {
+  background-image: url(../images/desc.gif);
+  text-decoration: underline;
+  cursor: pointer;
+}
+
+
+td {
+  font-family: Tahoma, Verdana, Arial, Helvetica;
+  font-size: 12px;
+  color: #696969;
+  nobackground-color: white;
+  padding: 0px;
+}
+
+
+tr.clicked td {
+  font-family: Tahoma, Verdana, Arial, Helvetica;
+  font-size: smaller;
+  background-color: #ffcfe8;
+}
+
+
+td.label {
+  vertical-align: top;
+}
+
+
+td.label span {
+  font-family: Tahoma, Verdana, Arial, Helvetica;
+  font-size: 12px;
+  color: black;
+  padding: 5px;
+  padding-right: 10px;
+  font-weight: bold;
+  vertical-align: top;
+  text-align: right;
+  display: block;
+}
+
+
+fieldset td.label span {
+  padding: 3px;
+  padding-right: 10px;
+}
+
+
+fieldset {
+  margin-top: 3px;
+  -moz-border-radius: 6px;
+  -webkit-border-radius: 6px;
+  border-radius: 6px;
+  border-style: solid;
+  border-color: #dddddd;
+}
+
+
+legend {
+  font-family: Tahoma, Verdana, Arial, Helvetica;
+  font-size: 12px;
+  padding: 8px;
+  color: white;
+  background-color: #1c94c4;
+  font-weight: bold;
+  -moz-border-radius: 6px;
+  -webkit-border-radius: 6px;
+  border-radius: 6px;
+}
+
+
+legend.transparent {
+  background: transparent;
+  color: #333333;
+  font-size: 1em;
+  font-weight: normal;
+  padding: 0;
+}
+
+
+.ui-widget-content td legend a, .ui-widget-content td legend a:hover, .ui-widget-content td legend a:visited {
+  color: white;
+}
+
+
+.ui-widget-content td a, p a, p a:visited, td a, td a:visited {
+  text-decoration: none;
+  color: #1c94c4;
+  padding-left: 14px;
+  background: url(../images/mini-arrow-orange.gif) no-repeat left;
+}
+
+
+p a:hover, td a:hover {
+  text-decoration: underline;
+  color: #e87c1e;
+  padding-left: 14px;
+  background: url(../images/mini-arrow-orange.gif) no-repeat left;
+}
+
+
+.SearchDrawer a.no-arrow, .SearchDrawer a.no-arrow:visited, td a.no-arrow, td a.no-arrow:visited {
+  text-decoration: none;
+  color: black;
+  padding-left: 0px;
+  background: inherit;
+}
+
+
+td a.no-arrow:hover {
+  text-decoration: underline;
+  color: #d81515;
+  padding-left: 0px;
+  background: inherit;
+}
+
+
+td a.mailto, td a.mailto:visited {
+  text-decoration: none;
+  color: black;
+  padding-left: 20px;
+  background: url(../images/mail.png) no-repeat left;
+}
+
+
+td a.mailto:hover {
+  text-decoration: underline;
+  color: #e87c1e;
+  padding-left: 20px;
+  background: url(../images/mail.png) no-repeat left;
+}
+
+
+a.small_action {
+  font-family: Tahoma, Verdana, Arial, Helvetica;
+  font-size: 8pt;
+  color: black;
+  text-decoration: none;
+}
+
+
+.display_block {
+  padding: 0.25em;
+}
+
+
+.actions_details {
+  float: right;
+  margin-top: 10px;
+  margin-right: 10px;
+  padding-left: 5px;
+  padding-top: 2px;
+  padding-bottom: 2px;
+  background: url(../images/actions_left.png) no-repeat left;
+}
+
+
+.actions_details span {
+  background: url(../images/actions_right.png) no-repeat right;
+  color: white;
+  font-weight: bold;
+  padding-top: 2px;
+  padding-bottom: 2px;
+  padding-right: 12px;
+}
+
+
+.actions_details a {
+  text-decoration: none;
+}
+
+
+.loading {
+  noborder: 1px dashed #cccccc;
+  background: #b9c1c8;
+  padding: 0.25em;
+}
+
+
+input.textSearch {
+  border: 1px solid black;
+  font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif;
+  font-size: 12px;
+  color: black;
+}
+
+
+.ac_input {
+  border: 1px solid #7f9db9;
+  background: white url(../images/ac-background.gif) no-repeat right;
+}
+
+
+/*
+ * By Rom
+ */
+.csvimport_createobj {
+  color: #aa0000;
+  background-color: #eeeeee;
+}
+
+
+.csvimport_error {
+  font-weight: bold;
+  color: red;
+  background-color: #eeeeee;
+}
+
+
+.csvimport_warning {
+  color: #cc8888;
+  background-color: #eeeeee;
+}
+
+
+.csvimport_ok {
+  color: black;
+  background-color: #bbffbb;
+}
+
+
+.csvimport_reconkey {
+  font-style: italic;
+  color: #888888;
+  background-color: white;
+}
+
+
+.csvimport_extreconkey {
+  color: #888888;
+  background-color: white;
+}
+
+
+#accordion h3 {
+  padding: 10px;
+}
+
+
+.ui-accordion-content ul {
+  list-style: none;
+  list-style-image: url(data:0);
+  padding-left: 16px;
+  margin-top: 8px;
+}
+
+
+.ui-accordion-content li.submenu {
+  margin-top: 8px;
+}
+
+
+.ui-accordion-content ul ul {
+  padding: 8px 0px 8px 8px;
+  list-style: none;
+  list-style-image: url(data:0);
+  border: 0;
+}
+
+
+.nothing {
+  noborder-top: 1px solid #8b8b8b;
+  padding: 4px 0px 0px 16px;
+  font-size: 8pt;
+  background: url(../images/green-square.gif) no-repeat bottom left;
+  color: #83b217;
+  font-weight: bold;
+  text-decoration: none;
+}
+
+
+div.ui-accordion-content {
+  padding-top: 10px;
+  padding-left: 10px;
+}
+
+
+.ui-accordion-content a, ui-accordion-content a:visited {
+  color: #1c94c4;
+  text-decoration: none;
+}
+
+
+.ui-accordion-content a:hover {
+  color: #e87c1e;
+  text-decoration: none;
+}
+
+
+.ui-accordion-content ul {
+  padding-left: 0;
+  margin-top: 0;
+}
+
+
+.ui-accordion-content li {
+  color: #555555;
+  text-decoration: none;
+  margin: 0;
+  padding: 0px 0pt 0px 16px;
+  font-size: 9pt;
+  background: url(../images/mini-arrow-orange.gif) no-repeat top left;
+  font-weight: normal;
+  border: 0;
+}
+
+
+a.CollapsibleLabel, td a.CollapsibleLabel {
+  margin: 0;
+  padding: 0px 0pt 0px 16px;
+  font-size: 8pt;
+  text-decoration: none;
+  color: #555555;
+  background: url(../images/mini-arrow-orange.gif) no-repeat left;
+}
+
+
+/*
+ * Beware: IE6 does not support multiple selector with multiple classes, only the last class is used
+ */
+a.CollapsibleLabel.open, td a.CollapsibleLabel.open {
+  margin: 0;
+  padding: 0px 0pt 0px 16px;
+  font-size: 8pt;
+  text-decoration: none;
+  color: #e87c1e;
+  background: url(../images/mini-arrow-orange-open.gif) no-repeat left;
+}
+
+
+.page_header {
+  background-color: #f1f1f1;
+  padding: 5px;
+}
+
+
+/*
+ * move up a header immediately following a display block (i.e. "actions" menu)
+ */
+.display_block + .page_header {
+  margin-top: -8px;
+}
+
+
+.notreeview li {
+  background: url(../images/tv-item.gif) 0 0 no-repeat;
+}
+
+
+.notreeview .collapsable {
+  background-image: url(../images/tv-collapsable.gif);
+}
+
+
+.notreeview .expandable {
+  background-image: url(../images/tv-expandable.gif);
+}
+
+
+.notreeview .last {
+  background-image: url(../images/tv-item-last.gif);
+}
+
+
+.notreeview .lastCollapsable {
+  background-image: url(../images/tv-collapsable-last.gif);
+}
+
+
+.notreeview .lastExpandable {
+  background-image: url(../images/tv-expandable-last.gif);
+}
+
+
+#OrganizationSelection {
+  padding: 5px 0px 16px 20px;
+}
+
+
+/*
+ * popup menus
+ */
+div.itop_popup {
+  margin: 0;
+  padding: 0;
+  float: right;
+}
+
+
+div.itop_popup > ul > li {
+  list-style: none;
+  cursor: pointer;
+}
+
+
+div.actions_menu > ul {
+  height: 19px;
+  line-height: 17px;
+  vertical-align: middle;
+  display: block;
+  nowidth: 70px;
+  /*
+ * Nasty work-around for IE... en attendant mieux
+ */
+
+  padding-left: 5px;
+  background: url(../images/actions_left.png) no-repeat top left;
+  cursor: pointer;
+  margin: 0;
+}
+
+
+div.actions_menu > ul > li {
+  float: left;
+  list-style: none;
+  font-size: 11px;
+  font-family: Tahoma, sans-serif;
+  height: 17px;
+  padding-right: 16px;
+  padding-left: 4px;
+  background: url(../images/actions_right.png) no-repeat top right transparent;
+  font-weight: bold;
+  color: white;
+  vertical-align: middle;
+  margin: 0;
+}
+
+
+#logOffBtn > ul > li {
+  list-style: none;
+  vertical-align: middle;
+  margin: 0;
+  padding: 0;
+  cursor: pointer;
+}
+
+
+#logOffBtn > ul {
+  list-style: none;
+  vertical-align: middle;
+  margin: 0;
+  padding: 0;
+  height: 25px;
+  noline-height: 25px;
+}
+
+
+#logOffBtn li a, .itop_popup li a {
+  display: block;
+  padding: 5px 12px;
+  text-decoration: none;
+  nowidth: 70px;
+  color: black;
+  font-weight: bold;
+  white-space: nowrap;
+  background: white;
+}
+
+
+#logOffBtn li span {
+  display: block;
+  padding: 5px 12px;
+  text-decoration: none;
+  nowidth: 70px;
+  color: black;
+  white-space: nowrap;
+  background: white;
+}
+
+
+.itop_popup ul {
+  padding-left: 0;
+}
+
+
+.menucontainer div.toolkit_menu {
+  margin-left: 10px;
+}
+
+
+#logOffBtn li a:hover, .itop_popup li a:hover {
+  background: #1a4473;
+}
+
+
+#logOffBtn ul > li > ul, .itop_popup ul > li > ul {
+  border: 1px solid black;
+  background: white;
+}
+
+
+#logOffBtn li > ul, .itop_popup li > ul {
+  margin: 0;
+  padding: 0;
+  position: absolute;
+  display: none;
+  border-top: 1px solid white;
+  z-index: 999;
+}
+
+
+#logOffBtn li ul li, .itop_popup li ul li {
+  float: none;
+  display: inline;
+}
+
+
+#logOffBtn li ul li a, .itop_popup li ul li a {
+  width: auto;
+  text-align: left;
+}
+
+
+#logOffBtn li ul li a:hover, .itop_popup li ul li a:hover {
+  background: #e87c1e;
+  color: white;
+  font-weight: bold;
+}
+
+
+.itop_popup > ul {
+  margin: 0;
+}
+
+
+hr.menu-separator {
+  border: none 0;
+  border-top: 1px solid #cccccc;
+  color: #cccccc;
+  background-color: transparent;
+  height: 1px;
+  margin: 3px;
+  cursor: default;
+}
+
+
+/*
+ * **********************************
+ */
+.wizHeader {
+  background: #1c94c4;
+  padding: 15px;
+}
+
+
+.wizContainer {
+  border: 5px solid #1c94c4;
+  background: #d6e8ef;
+  padding: 5px;
+}
+
+
+.wizContainer table tr td {
+  background: transparent;
+}
+
+
+.alignRight {
+  text-align: right;
+  padding: 3px;
+}
+
+
+.alignLeft {
+  text-align: left;
+  padding: 3px;
+}
+
+
+.red {
+  background-color: #ff6000;
+  color: black;
+}
+
+
+th.red {
+  background: url(../images/red-header.gif) bottom left repeat-x;
+  color: black;
+}
+
+
+.green {
+  background-color: #00cc00;
+  color: black;
+}
+
+
+th.green {
+  background: url(../images/green-header.gif) bottom left repeat-x;
+  color: black;
+}
+
+
+.orange {
+  background-color: #ffde00;
+  color: black;
+}
+
+
+th.orange {
+  background: url(../images/orange-header.gif) bottom left repeat-x;
+  color: black;
+}
+
+
+/*
+ * For Date Picker: Creates a little calendar icon
+ * * instead of a text link for "Choose date"
+ */
+a.dp-choose-date, a.dp-choose-date:hover, a.dp-choose-date:visited, td a.dp-choose-date, td a.dp-choose-date:hover, td a.dp-choose-date:visited {
+  float: left;
+  width: 16px;
+  height: 16px;
+  padding: 0;
+  margin: 5px 3px 0;
+  display: block;
+  text-indent: -2000px;
+  overflow: hidden;
+  background: url(../images/calendar.png) no-repeat;
+}
+
+
+a.dp-choose-date.dp-disabled, td a.dp-choose-date.dp-disabled {
+  background-position: 0 -20px;
+  cursor: default;
+}
+
+
+/*
+ * For Date Picker: makes the input field shorter once the date picker code
+ * * has run (to allow space for the calendar icon)
+ */
+input.dp-applied {
+  width: 140px;
+  float: left;
+}
+
+
+/*
+ * For search forms
+ */
+.SearchDrawer {
+  border-top: 5px solid #1c94c4;
+  border-left: 5px solid #1c94c4;
+  border-right: 5px solid #1c94c4;
+  border-bottom: 0;
+  background: #d6e8ef;
+  color: black;
+  padding: 10px;
+  margin: 0;
+  font-size: 12px;
+}
+
+
+.SearchDrawer label {
+  background: #d6e8ef;
+  color: black;
+}
+
+
+.SearchDrawer h1 {
+  color: black;
+}
+
+
+.DrawerClosed {
+  display: none;
+}
+
+
+.DrawerHandle {
+  margin: 0;
+  padding: 5px;
+  background: url(../images/drawer-handle.gif) bottom no-repeat transparent;
+  color: white;
+  cursor: pointer;
+  text-align: center;
+  /*
+ * center the block
+ */
+
+  width: 100px;
+  margin-left: auto;
+  margin-right: auto;
+  margin-top: 0;
+  margin-bottom: 0;
+  display: block;
+  font-size: 12px;
+}
+
+
+div.HRDrawer {
+  height: 5px;
+  width: 100%;
+  margin: 0;
+  background-color: #1c94c4;
+  margin: 0;
+  padding: 0;
+  border: 0;
+  display: block;
+}
+
+
+.mini_tabs a {
+  text-decoration: none;
+  font-weight: bold;
+  color: #cccccc;
+  background-color: #333333;
+  padding-left: 1em;
+  padding-right: 1em;
+  padding-bottom: 0.25em;
+}
+
+
+.mini_tabs a.selected {
+  color: white;
+  background-color: #1c94c4;
+  padding-top: 0.25em;
+}
+
+
+.mini_tabs ul {
+  margin: -10px;
+}
+
+
+.mini_tabs ul li {
+  float: right;
+  list-style: none;
+  nopadding-left: 1em;
+  nopadding-right: 1em;
+  margin-top: 0;
+}
+
+
+.mandatory {
+  border: 1px solid red;
+}
+
+
+/*
+ * Beware: IE6 does not support multiple selector with multiple classes, only the last class is used
+ */
+.wizContainer table.listResults tr td.truncated, .wizContainer table.listResults tr.odd td.truncated, table.listResults tr td.truncated, table.listResults tr.odd td.truncated {
+  background: url(../images/truncated.png) bottom repeat-x;
+}
+
+
+/*
+ * Beware: IE6 does not support multiple selector with multiple classes, only the last class is used
+ */
+.wizContainer table.listResults  tr.even td.truncated, table.listResults tr.even td.truncated {
+  background: #f9f9f1 url(../images/truncated.png) bottom repeat-x;
+}
+
+
+/*
+ * Beware: IE6 does not support multiple selector with multiple classes, only the last class is used
+ */
+, .wizContainer table.listResults  tr.even td.hover.truncated, table.listResults tr.even td.hover.truncated {
+  background: #fdf5d0 url(../images/truncated.png) bottom repeat-x;
+}
+
+
+/*
+ * Beware: IE6 does not support multiple selector with multiple classes, only the last class is used
+ */
+.wizContainer table.listResults  tr td.hover.truncated, .wizContainer table.listResults  tr.odd td.hover.truncated, table.listResults tr td.hover.truncated, table.listResults tr.odd td.hover.truncated {
+  background: #fdf5d0 url(../images/truncated.png) bottom repeat-x;
+}
+
+
+table.listResults.truncated {
+  border-bottom: 0;
+  padding-bottom: 0;
+}
+
+
+tr.csv_row0 td {
+  padding-top: 5px;
+  padding-bottom: 5px;
+  padding-left: 10px;
+  padding-right: 10px;
+  background: white;
+  border-left: black 1px solid;
+}
+
+
+tr.csv_row1 td {
+  padding-top: 5px;
+  padding-bottom: 5px;
+  padding-left: 10px;
+  padding-right: 10px;
+  background: #f9f9f1;
+  border-left: black 1px solid;
+}
+
+
+tr.csv_row0 th, tr.csv_row1 th {
+  padding-top: 5px;
+  padding-bottom: 5px;
+  padding-left: 10px;
+  padding-right: 10px;
+  border-left: black 1px solid;
+}
+
+
+td.cell_modified {
+  font-weight: bold;
+  color: black;
+}
+
+
+td.cell_error {
+  font-weight: bold;
+  color: #d81515;
+}
+
+
+table.transparent, table.transparent td {
+  background: transparent;
+}
+
+
+p.page-header {
+  color: #1c94c4;
+  font-weight: bold;
+  font-size: 12pt;
+  font-family: Verdana, Arial, Helvetica, Sans-Serif;
+}
+
+
+td.dashboard {
+  vertical-align: top;
+  border: 1px solid #cccccc;
+  padding: 0.5em;
+  width: 50%;
+}
+
+
+.white {
+  background-color: white;
+}
+
+
+/*
+ * ** New Lacanau layout **
+ */
+.ui-layout-pane {
+  /*
+ * all 'panes'
+ */
+
+  overflow: auto;
+}
+
+
+.ui-layout-resizer {
+  /*
+ * all 'resizer-bars'
+ */
+
+  background: #f1f1f1;
+}
+
+
+.ui-layout-toggler {
+  /*
+ * all 'toggler-buttons'
+ */
+
+  background: #aaaaaa;
+}
+
+
+div#top-left {
+  width: 28px;
+  height: 70px;
+  background: #f1f1f1;
+  float: left;
+}
+
+
+div#header-logo {
+  width: 100%;
+  height: 70px;
+  background: #f1f1f1;
+}
+
+
+.ui-layout-pane-west {
+  background: #f1f1f1;
+}
+
+
+div#right {
+  min-width: 260px;
+}
+
+
+div#menu {
+  width: 100%;
+  overflow: auto;
+}
+
+
+.header-menu {
+  padding-left: 24px;
+  padding-right: 8px;
+  padding-bottom: 24px;
+  background: transparent;
+}
+
+
+div#inner_menu {
+  padding-left: 24px;
+  padding-right: 8px;
+  background: transparent;
+}
+
+
+div#logo {
+  height: 70px;
+  nowidth: 100%;
+  text-align: center;
+}
+
+
+div#logo div {
+  height: 88px;
+  width: 244px;
+  background: url(../images/itop-logo-2.png) left no-repeat;
+}
+
+
+#left-pane .ui-layout-north {
+  overflow: hidden;
+}
+
+
+#top-bar {
+  height: 55px;
+  background: #f1f1f1;
+  text-align: right;
+}
+
+
+#admin-banner {
+  float: left;
+  margin-top: 2px;
+  padding: 8px;
+  border: 1px solid #cc3333;
+  background-color: #ffeeee;
+  -moz-border-radius: 0.5em;
+}
+
+
+#global-search {
+  height: 55px;
+  float: right;
+  background: url(../images/banner-search.png) no-repeat;
+  nopadding-top: 15px;
+  text-align: right;
+  overflow-y: hidden;
+}
+
+
+#global-search > form div {
+  padding-left: 4px;
+}
+
+
+#global-search table, #global-search tr, #global-search tr td {
+  padding: 0;
+  border: 0;
+  height: 55px;
+  margin: 0;
+  background: transparent;
+  overflow-y: hidden;
+  vertical-align: middle;
+}
+
+
+#global-search > form input[type="text"] {
+  border: 0;
+  height: 18px;
+  width: 180px;
+  padding-top: 4;
+  background: transparent;
+}
+
+
+#global-search > form tr td#g-search-input {
+  padding-top: 3px;
+  padding-left: 3px;
+  background: transparent;
+}
+
+
+div.icon {
+  width: 20px;
+  height: 20px;
+  margin: 2px;
+  float: right;
+}
+
+
+span.ui-icon {
+  float: left;
+  margin: 0 2px;
+}
+
+
+.ui-layout-button-pin-down {
+  background: url(../images/splitter-bkg.png) transparent;
+  width: 16px;
+  background-position: -144px -144px;
+}
+
+
+.ui-layout-resizer-west-open {
+  background-color: #f1f1f1;
+  width: 8px;
+}
+
+
+div.footer img {
+  border: 0;
+  margin-bottom: 5px;
+  margin-top: 5px;
+}
+
+
+div.footer {
+  text-align: center;
+}
+
+
+#SearchResultsToAdd table.listResults tbody {
+  height: 300px;
+  overflow-y: auto;
+}
+
+
+tr.row_unchanged td {
+  border-bottom: 1px #cccccc solid;
+  padding: 2px;
+}
+
+
+.wizContainer table tr.row_error td {
+  border-bottom: 1px #cccccc solid;
+  background-color: #ffdddd;
+  padding: 2px;
+}
+
+
+tr.row_modified td {
+  border-bottom: 1px #cccccc solid;
+  padding: 2px;
+}
+
+
+tr.row_added td {
+  border-bottom: 1px #cccccc solid;
+  padding: 2px;
+}
+
+
+a.truncated {
+  cursor: pointer;
+}
+
+
+.org_combo {
+  font-size: x-small;
+  width: auto;
+  max-width: 200px;
+}
+
+
+span.form_validation {
+  width: 24px;
+  text-align: center;
+}
+
+
+.notification {
+  border: 1px solid #cc3333;
+  background-color: #ffeeee;
+  padding: 0.5em;
+  margin: 0.5em;
+  text-align: center;
+  width: 95%;
+  -moz-border-radius: 0.5em;
+}
+
+
+.wiki_broken_link {
+  text-decoration: line-through;
+}
+
+
+.synoptics, .synoptics tr td {
+  background: transparent;
+  padding: 10px;
+  font-size: 1em;
+  vertical-align: middle;
+  color: white;
+  text-align: center;
+}
+
+
+.synoptics tr td.arrow {
+  color: #333333;
+  border-top: 1px dashed #333333;
+  width: 100px;
+}
+
+
+.synoptics tr.synoptics_header td {
+  color: black;
+  font-size: 1em;
+  vertical-align: middle;
+  text-align: center;
+}
+
+
+.mono_value {
+  display: inline-block;
+  background-color: #33cc33;
+  color: white;
+  font-weight: bold;
+  padding: 3px;
+  padding-left: 5px;
+  padding-right: 5px;
+  margin-left: 3px;
+  -moz-border-radius: 10px;
+  -webkit-border-radius: 10px;
+  border-radius: 10px;
+}
+
+
+.multi_values {
+  display: inline-block;
+  background-color: #cc3333;
+  color: white;
+  font-weight: bold;
+  padding: 3px;
+  padding-left: 5px;
+  padding-right: 5px;
+  margin-left: 3px;
+  -moz-border-radius: 10px;
+  -webkit-border-radius: 10px;
+  border-radius: 10px;
+}
+
+
+.caselog {
+  overflow-x: hidden;
+  display: block;
+  overflow-y: auto;
+  border: 1px #dddddd solid;
+  font-family: Tahoma, Verdana, Arial, Helvetica;
+  font-size: 12px;
+}
+
+
+.caselog_input_header {
+  padding-top: 3px;
+  padding-bottom: 3px;
+  border-top: 1px solid white;
+  background: #dddddd;
+  width: 100%;
+}
+
+
+.caselog_header {
+  padding: 3px;
+  border-top: 1px solid white;
+  background: #dddddd url(../images/plus.gif) left no-repeat;
+  padding-left: 16px;
+  cursor: pointer;
+  width: 100%;
+}
+
+
+.caselog_header.open {
+  background: #dddddd url(../images/minus.gif) left no-repeat;
+}
+
+
+.caselog_entry {
+  padding: 3px;
+  padding-left: 16px;
+  border-bottom: 1px #999999 solid;
+  white-space: pre-wrap;
+  /*
+ * css-3
+ */
+
+  white-space: -moz-pre-wrap;
+  /*
+ * Mozilla, since 1999
+ */
+
+  white-space: -pre-wrap;
+  /*
+ * Opera 4-6
+ */
+
+  white-space: -o-pre-wrap;
+  /*
+ * Opera 7
+ */
+
+  word-wrap: break-word;
+  /*
+ * Internet Explorer 5.5+, CSS3
+ */
+
+}
+
+
+table.details {
+  border-collapse: collapse;
+  noborder-bottom: 2px white solid;
+  width: 100%;
+}
+
+
+table.details>tbody>tr>td {
+  border-bottom: 2px #dddddd solid;
+  padding-bottom: 5px;
+  padding-top: 3px;
+}
+
+
+fieldset table.details>tbody>tr>td {
+  padding-top: 3px;
+  background: transparent;
+  border: 0;
+}
+
+
+.ac_dlg_loading {
+  background: white url('../images/indicator.gif') right center no-repeat;
+}
+
+
+table.pagination {
+  display: inline-block;
+}
+
+
+table.pagination tr td {
+  padding: 3px;
+}
+
+
+.pagination_container {
+  padding-left: 3px;
+}
+
+
+.pager p {
+  margin-top: 0;
+  margin-bottom: 0;
+}
+
+
+.pager td span {
+  min-width: 20px;
+  padding-left: 2px;
+  padding-right: 2px;
+  display: inline-block;
+  text-align: center;
+  cursor: pointer;
+}
+
+
+.pager td span.curr_page {
+  color: white;
+  background: #999999;
+  -moz-border-radius: 4px;
+  -webkit-border-radius: 4px;
+  border-radius: 4px;
+}
+
+
+img.first, img.last, img.next, img.prev {
+  cursor: pointer;
+}
+
+
+div.actions_button {
+  float: right;
+  background: url("../images/actions_left.png") no-repeat scroll left top transparent;
+  padding-left: 5px;
+  margin-top: 0;
+  margin-right: 10px;
+  height: 17px;
+  vertical-align: middle;
+}
+
+
+.actions_button a:hover, .actions_button a:visited, div.actions_button a {
+  background: url(../images/actions_bkg.png) no-repeat scroll right top transparent;
+  color: white;
+  padding-right: 8px;
+  cursor: pointer;
+  font-family: Tahoma, sans-serif;
+  font-size: 11px;
+  font-weight: bold;
+  padding-left: 4px;
+  text-decoration: none;
+  height: 17px;
+  line-height: 17px;
+  display: block;
+}
+
+
+select#org_id {
+  max-width: 90%;
+}
+
+
+/*
+ * ********** Dashboards **********
+ */
+.itop-dashboard {
+  background-color: white;
+}
+
+
+.dragHover {
+  background: url(./ui-lightness/images/ui-bg_diagonals-thick_20_666666_40x40.png);
+}
+
+
+.edit_mode .dashlet {
+  background: url(./ui-lightness/images/ui-bg_diagonals-thick_20_666666_40x40.png);
+  padding: 5px;
+  position: relative;
+}
+
+
+.edit_mode .dashlet-selected {
+  background: #e87c1e !important;
+  padding: 5px;
+}
+
+
+td.layout_cell {
+  height: 50px;
+  /*
+ * min-height does not work
+ */
+
+  vertical-align: top;
+}
+
+
+.dashlet-content {
+  background: white;
+}
+
+
+table.prop_table {
+  border-bottom: 2px solid #f9f9f1;
+  padding: 1px;
+  width: 100%;
+}
+
+
+.close-box {
+  margin: 5px;
+  width: 20px;
+  height: 20px;
+  position: absolute;
+  top: 0;
+  right: 0;
+  z-index: 10;
+  background: transparent url(../images/delete.png) no-repeat center;
+}
+
+
+td.prop_value {
+  text-align: left;
+}
+
+
+tr.itop-property-field-modified td {
+  background: #ffbbbb;
+}
+
+
+tr.itop-property-field-modified td.hover {
+  background: #ff9999;
+}
+
+
+td.prop_value input[type=text], td.prop_value textarea {
+  width: 98%;
+}
+
+
+td.prop_icon {
+  width: 20px;
+}
+
+
+.dashlet {
+  text-align: left;
+}
+
+
+.dashlet-inline {
+  display: inline-block;
+}
+
+
+.dashlet-badge a.actions {
+  background: none repeat scroll 0 0 transparent;
+  color: #666666;
+  font-size: 16px;
+  text-decoration: none;
+}
+
+
+.dashlet-content .display_block {
+  text-align: left;
+}
+
+
+.prop_apply .ui-icon-alert {
+  display: none;
+}
+
+
+.prop_apply .ui-state-error .ui-icon-alert {
+  display: block;
+}
+
+
+.ui-state-error .ui-icon-circle-check {
+  display: none;
+}
+
+
+.summary-details {
+  float: right;
+  margin-top: 5px;
+}
+
+
+.summary-details th {
+  background: none repeat scroll 0 0 #555555;
+  color: #eeeeee;
+  padding: 5px;
+  text-align: center;
+}
+
+
+.main_header {
+  background-color: #f1f1f1;
+  min-height: 60px;
+  width: 100%;
+}
+
+
+.main_header h1 {
+  color: #1c94c4;
+  line-height: 16px;
+  margin-bottom: 0;
+  margin-top: 0;
+  padding-bottom: 10px;
+  padding-top: 10px;
+}
+
+
+.main_header img {
+  margin-top: 10px;
+  margin-right: 10px;
+  float: left;
+}
+
+
+a.summary, a.summary:hover {
+  background: none repeat scroll 0 0 transparent;
+  color: #666666;
+  text-decoration: none;
+  padding-left: 0;
+}
+
+
+.summary-details td {
+  background: none repeat scroll 0 0 transparent;
+  padding: 5px;
+  text-align: center;
+}
+
+
+#DashboardMenu > ul > li {
+  list-style: none;
+  vertical-align: middle;
+  margin: 0;
+  padding: 0;
+  cursor: pointer;
+}
+
+
+#DashboardMenu > ul {
+  list-style: none;
+  vertical-align: middle;
+  margin: 0;
+  padding: 0;
+  height: 25px;
+}
+
+
+#DashboardMenu li a {
+  display: block;
+  padding: 5px 12px;
+  text-decoration: none;
+  color: black;
+  font-weight: bold;
+  text-align: left;
+  white-space: nowrap;
+  background: white;
+}
+
+
+#DashboardMenu li span {
+  display: block;
+  padding: 5px 12px;
+  text-decoration: none;
+  color: black;
+  white-space: nowrap;
+  background: white;
+}
+
+
+#DashboardMenu li {
+  list-style: none;
+}
+
+
+#DashboardMenu li a:hover {
+  background: #1a4473;
+}
+
+
+#DashboardMenu ul > li > ul {
+  border: 1px solid black;
+  background: white;
+}
+
+
+#DashboardMenu li > ul {
+  margin: 0;
+  padding: 0;
+  position: absolute;
+  display: none;
+  border-top: 1px solid white;
+  z-index: 999;
+}
+
+
+#DashboardMenu li ul li a:hover {
+  background: #d81515;
+  color: white;
+  font-weight: bold;
+  list-style: none;
+}
+
+
+.sortable_field_list {
+  display: inline-block;
+  width: 250px;
+  height: 150px;
+  border: 1px #333333 solid;
+  overflow: auto;
+  padding-left: 0;
+  margin: 0;
+}
+
+
+.sortable_field_list li {
+  list-style: none;
+  font-size: 11px;
+}
+
+
+.sort_order {
+  display: inline-block;
+  width: 16px;
+  height: 12px;
+}
+
+
+.sort_none {
+  background: url(../images/bg.gif) no-repeat center;
+}
+
+
+.sort_asc {
+  background: url(../images/desc.gif) no-repeat center;
+}
+
+
+.sort_desc {
+  background: url(../images/asc.gif) no-repeat center;
+}
+
+
+.sort_hidden {
+  display: none;
+}
+
+
+.sortable_field_list > li.selected {
+  background: #f6a828;
+}
+
+
+.itop-deleted-object {
+  text-decoration: line-through;
+}
+
+
+.header_message {
+  padding: 1em;
+  font-size: 10pt;
+  background: white;
+  border: 1px solid #999999;
+  -moz-border-radius: 4px;
+  -webkit-border-radius: 4px;
+  border-radius: 4px;
+  margin-bottom: 10px;
+}
+
+
+.header_message {
+  padding: 1em;
+  font-size: 10pt;
+  background: white;
+  border: 1px solid #999999;
+  -moz-border-radius: 4px;
+  -webkit-border-radius: 4px;
+  border-radius: 4px;
+  margin-bottom: 10px;
+}
+
+
+.message_info {
+  border: 1px solid #999933;
+  background: url(../images/info-mini.png) 1em 1em no-repeat #ffffcc;
+  padding-left: 3em;
+}
+
+
+.message_ok {
+  border: 1px solid #339933;
+  background: url(../images/ok.png) 1em 1em no-repeat #ccffcc;
+  padding-left: 3em;
+}
+
+
+.message_error {
+  border: 1px solid #993333;
+  background: url(../images/error.png) 1em 1em no-repeat #ffcccc;
+  padding-left: 3em;
+}
+
+
+.fg-menu a img {
+  border: 0;
+}
+
+
+div.ui-dialog-header {
+  padding-bottom: 10px;
+  padding-top: 7px;
+}
+
+
+.form_field_error {
+  border: 1px solid #993333;
+  background: #ffcccc;
+}
+
+
+.graph_config, .simple-graph {
+  background: white;
+}
+
+
+.graph_config {
+  padding: 0.25em;
+}
+
+
+.graph_config button.ui-widget {
+  font-size: 12px;
+}
+
+
+.arrow:after, .ui-tooltip {
+  background: #f1f1f1;
+  border: 1px solid #555555;
+}
+
+
+.ui-tooltip {
+  padding: 10px 10px;
+  box-shadow: 0 0 7px black;
+}
+
+
+.arrow {
+  width: 70px;
+  height: 16px;
+  overflow: hidden;
+  position: absolute;
+  left: 50%;
+  margin-left: -35px;
+  bottom: -16px;
+}
+
+
+.arrow.top {
+  top: -16px;
+  bottom: auto;
+}
+
+
+.arrow.left {
+  left: 20%;
+}
+
+
+.arrow:after {
+  content: "";
+  position: absolute;
+  left: 20px;
+  top: -20px;
+  width: 25px;
+  height: 25px;
+  box-shadow: 6px 5px 9px -9px black;
+  -webkit-transform: rotate(45deg);
+  -ms-transform: rotate(45deg);
+  transform: rotate(45deg);
+}
+
+
+.arrow.top:after {
+  bottom: -20px;
+  top: auto;
+}
+
+

css/light-grey.scss

@@ -0,0 +1,1439 @@
+@import 'css-variables.scss';
+
+$hilight-color = $highlight-color;
+$summary-details-background = $grey-color;
+$main-header-background = $frame-background-color;
+$table-even-background = $frame-background-color;
+$popup-menu-highlight-color = $highlight-color;
+$popup-menu-text-color: #000;
+$popup-menu-background-color: #fff;
+$popup-menu-text-higlight-color: #fff;
+
+/* CSS Document */
+body {
+    font-family: Tahoma, Verdana, Arial, Helvetica;
+    font-size: 10pt;
+    color: $text-color;
+	margin: 0;			/* Remove body margin/padding */
+	padding: 0;
+	overflow: hidden;	/* Remove scroll bars on browser window */
+}
+
+/* to prevent flicker, hide the pane's content until it's ready */
+.ui-layout-center, .ui-layout-north, .ui-layout-south {
+    display: none;
+}
+.ui-layout-content {
+	padding-left: 10px;
+}
+
+.raw_output {
+    font-family: Courier-New, Courier, Arial, Helvetica;
+    font-size: 8pt;
+    background-color: #eeeeee;
+    color: $text-color;
+    border: 1px dashed $text-color;
+    padding: 0.25em;
+    margin-top: 1em;
+}
+
+h1 {
+    font-family: Tahoma, Verdana, Arial, Helvetica;
+    color: $text-color;
+    font-weight: bold;
+    font-size: 12pt;
+}
+h2 {
+    font-family: Tahoma, Verdana, Arial, Helvetica;
+    color: $text-color;
+    font-weight: normal;
+    font-size: 12pt;
+}
+h3 {
+    font-family: Tahoma, Verdana, Arial, Helvetica;
+    color: $text-color;
+    font-weight: normal;
+    font-size: 10pt;
+}
+.hilite, .hilite a, .hilite a:visited {
+    color: $hilight-color;
+    text-decoration: none;
+}
+table.datatable {
+	width: 100%;
+	border: 0;
+	padding: 0;
+}
+td.menucontainer {
+	text-align: right;
+}
+table.listResults {
+    padding: 0px;
+	border-top: 3px solid $frame-background-color;
+	border-left: 3px solid $frame-background-color;
+	border-bottom: 3px solid #e6e6e1;  
+	border-right: 3px solid #e6e6e1;
+	width: 100%;
+	background-color: #fff;
+}
+
+table.listResults td {
+	padding: 2px;
+}
+
+table.listContainer {
+    border: 0;
+	padding: 0;
+	margin:0;
+	width: 100%;
+	clear: both;
+}
+
+tr.containerHeader, tr.containerHeader td {
+	background: transparent;
+} 
+
+tr.even td, .wizContainer tr.even td {
+	background-color: $table-even-background;
+} 
+tr.red_even td, .wizContainer tr.red_even td {
+	background-color: #f97e75;
+	color: #fff;
+}
+tr.red td, .wizContainer tr.red td {
+	background-color: #f9a397;
+	color: #fff;
+}
+tr.orange_even td, .wizContainer tr.orange_even td {
+	background-color: #f4d07a;
+}
+tr.orange td, .wizContainer tr.orange td {
+	background-color: #f4e96c;
+} 
+tr.green_even td, .wizContainer tr.green_even td {
+	background-color: #bee5a3;
+} 
+tr.green td, .wizContainer tr.green td {
+	background-color: #b3e5b4;
+} 
+
+tr td.hover, tr.even td.hover, .hover a, .hover a:visited, .hover a:hover, .wizContainer tr.even td.hover,  .wizContainer tr td.hover {
+	background-color: #fdf5d0;
+	color: $text-color;
+}
+
+th {
+    font-family: Tahoma, Verdana, Arial, Helvetica;
+    font-size: 8pt;
+    color: $complement-color;
+    height:20px;
+    background: $frame-background-color bottom repeat-x;	
+}
+
+th.header {
+	cursor: pointer;
+	background-repeat: no-repeat;
+	background-position: center right;
+	background-repeat: no-repeat;
+	padding-right: 16px; // some space for the asc/desc icons
+}
+
+th.headerSortUp {
+	background-image: url(../images/asc.gif);
+	text-decoration: underline;
+	cursor: pointer;
+}
+
+th.headerSortDown {
+	background-image: url(../images/desc.gif);
+	text-decoration: underline;
+	cursor: pointer;
+}
+
+td {
+    font-family: Tahoma, Verdana, Arial, Helvetica;
+    font-size: 12px;
+    color:#696969;
+	nobackground-color: #ffffff;
+	padding: 0px;
+}
+
+tr.clicked td {
+    font-family: Tahoma, Verdana, Arial, Helvetica;
+    font-size: smaller;
+	background-color: #ffcfe8;
+}
+
+td.label {
+	vertical-align: top;
+}
+td.label span {
+    font-family: Tahoma, Verdana, Arial, Helvetica;
+    font-size: 12px;
+    color: #000000;
+    padding: 5px;
+    padding-right: 10px;	
+    font-weight:bold;
+    vertical-align: top;
+    text-align: right;
+    display: block;
+}
+fieldset td.label span {
+    padding: 3px;
+    padding-right: 10px;
+}
+fieldset {
+    margin-top: 3px;	
+    -moz-border-radius: 6px;
+	-webkit-border-radius: 6px;
+	border-radius: 6px;
+	border-style: solid;
+	border-color: #ddd;
+}
+
+legend {
+    font-family: Tahoma, Verdana, Arial, Helvetica;
+    font-size: 12px;
+	padding:8px;
+	color: #fff;
+	background-color: $complement-color;
+	font-weight: bold;
+	-moz-border-radius: 6px;
+	-webkit-border-radius: 6px;
+	border-radius: 6px;
+}
+legend.transparent {
+	background: transparent;
+	color: #333333;
+	font-size: 1em;
+	font-weight: normal;
+	padding: 0;
+}
+.ui-widget-content td legend a, .ui-widget-content td legend a:hover, .ui-widget-content td legend a:visited {
+	color: #fff;
+}
+
+.ui-widget-content td a, p a, p a:visited, td a, td a:visited {
+	text-decoration:none;
+	color: $complement-color;
+	padding-left:14px;
+	background: url(../images/mini-arrow-orange.gif) no-repeat left;
+}
+p a:hover, td a:hover {
+	text-decoration:underline;
+	color:$highlight-color;
+	padding-left:14px;
+	background: url(../images/mini-arrow-orange.gif) no-repeat left;
+}
+
+td a.no-arrow, td a.no-arrow:visited, .SearchDrawer a.no-arrow, .SearchDrawer a.no-arrow:visited {
+	text-decoration:none;
+	color:#000000;
+	padding-left:0px;
+	background: inherit;
+}
+td a.no-arrow:hover {
+	text-decoration:underline;
+	color:#d81515;
+	padding-left:0px;
+	background: inherit;
+}
+td a.mailto, td a.mailto:visited {
+	text-decoration:none;
+	color:#000000;
+	padding-left:20px;
+	background: url(../images/mail.png) no-repeat left;
+}
+td a.mailto:hover {
+	text-decoration:underline;
+	color:$highlight-color;
+	padding-left:20px;
+	background: url(../images/mail.png) no-repeat left;
+}
+
+a.small_action {
+    font-family: Tahoma, Verdana, Arial, Helvetica;
+    font-size: 8pt;
+    color: #000000;
+	text-decoration:none;
+}
+.display_block {
+	padding:0.25em;
+}
+.actions_details {
+	float:right;
+	margin-top:10px;
+	margin-right:10px;
+	padding-left: 5px;
+	padding-top: 2px;
+	padding-bottom: 2px;
+	background: url(../images/actions_left.png) no-repeat left;
+}
+.actions_details span{
+	background: url(../images/actions_right.png) no-repeat right;
+	color: #fff;
+	font-weight: bold;
+	padding-top: 2px;
+	padding-bottom: 2px;
+	padding-right: 12px;
+}
+.actions_details a {
+	text-decoration:none;
+}
+.loading {
+	noborder: 1px dashed #CCC;
+	background: #b9c1c8;
+	padding:0.25em;
+}
+
+input.textSearch {
+	border:1px solid #000;
+	font-family:Tahoma,Verdana, Arial, Helvetica, sans-serif;
+	font-size: 12px;
+	color:#000000;
+}
+
+.ac_input {
+	border: 1px solid #7f9db9;
+	background: #fff url(../images/ac-background.gif) no-repeat right;
+}
+
+/* By Rom */
+.csvimport_createobj {
+    color: #AA0000;
+    background-color:#EEEEEE;
+}
+.csvimport_error {
+    font-weight: bold;
+    color: #FF0000;
+    background-color:#EEEEEE;
+}
+.csvimport_warning {
+    color: #CC8888;
+    background-color:#EEEEEE;
+}
+.csvimport_ok {
+    color: #00000;
+    background-color:#BBFFBB;
+}
+.csvimport_reconkey {
+    font-style: italic;
+    color: #888888;
+    background-color:#FFFFF;
+}
+.csvimport_extreconkey {
+    color: #888888;
+    background-color:#FFFFFF;
+}
+
+#accordion h3 {
+	padding: 10px;
+}
+
+.ui-accordion-content ul {
+    list-style:none;
+    list-style-image: url(data:0);
+    padding-left:16px;
+	margin-top: 8px;
+}	
+
+.ui-accordion-content li.submenu {
+	margin-top: 8px;
+}	
+
+.ui-accordion-content ul ul {
+	padding: 8px 0px 8px 8px;
+	margin:0;
+    list-style:none;
+    list-style-image: url(data:0);
+    border: 0;
+}	
+	
+.nothing {
+    noborder-top: 1px solid #8b8b8b;
+    padding: 4px 0px 0px 16px;   	
+	font-size:8pt;
+    background: url(../images/green-square.gif) no-repeat bottom left;
+    color:#83b217;
+    font-weight:bold;
+	text-decoration:none;
+}
+div.ui-accordion-content {
+	padding-top: 10px;
+	padding-left: 10px;
+}
+.ui-accordion-content a, ui-accordion-content a:visited {
+	color:	$complement-color;
+	text-decoration:none;
+}
+
+.ui-accordion-content a:hover {
+	color: 	$highlight-color;
+	text-decoration: none;
+}
+
+.ui-accordion-content ul { 
+	padding-left: 0;
+	margin-top: 0;
+}
+
+.ui-accordion-content li { 
+	color:$grey-color;
+	text-decoration:none;
+	margin: 0;
+	padding: 0px 0pt 0px 16px;
+	font-size: 9pt;
+    background: url(../images/mini-arrow-orange.gif) no-repeat top left;
+    font-weight:normal;
+    border: 0;
+}
+
+a.CollapsibleLabel, td a.CollapsibleLabel { 
+	margin: 0;
+	padding: 0px 0pt 0px 16px;
+	font-size:8pt;
+	text-decoration:none;
+	color:$grey-color;
+    background: url(../images/mini-arrow-orange.gif) no-repeat left;
+}
+
+/* Beware: IE6 does not support multiple selector with multiple classes, only the last class is used */
+a.CollapsibleLabel.open,  td a.CollapsibleLabel.open { 
+	margin: 0;
+	padding: 0px 0pt 0px 16px;
+	font-size:8pt;
+	text-decoration:none;
+	color: $highlight-color;
+    background: url(../images/mini-arrow-orange-open.gif) no-repeat left;
+}
+
+.page_header {
+	background-color:$frame-background-color;
+	padding:5px;
+}
+/* move up a header immediately following a display block (i.e. "actions" menu) */
+.display_block + .page_header {
+	margin-top: -8px;
+}
+
+.notreeview li { background: url(../images/tv-item.gif) 0 0 no-repeat; }
+.notreeview .collapsable { background-image: url(../images/tv-collapsable.gif); }
+.notreeview .expandable { background-image: url(../images/tv-expandable.gif); }
+.notreeview .last { background-image: url(../images/tv-item-last.gif); }
+.notreeview .lastCollapsable { background-image: url(../images/tv-collapsable-last.gif); }
+.notreeview .lastExpandable { background-image: url(../images/tv-expandable-last.gif); }
+
+#OrganizationSelection {
+    padding:5px 0px 16px 20px;
+}
+
+/* popup menus */
+div.itop_popup {
+	margin: 0;
+	padding: 0;
+	float:right;
+}
+div.itop_popup > ul > li {
+	list-style: none;
+	cursor: pointer;
+}
+
+div.actions_menu > ul {
+	height:19px;
+	line-height: 17px;
+	vertical-align: middle;
+	display:block;
+	nowidth:70px; /* Nasty work-around for IE... en attendant mieux */
+	padding-left: 5px;
+	background: url(../images/actions_left.png) no-repeat top left;
+	cursor: pointer;
+	margin: 0;
+}
+
+div.actions_menu > ul > li {
+	float: left;
+	list-style: none;
+	font-size: 11px;
+	font-family: Tahoma,sans-serif;
+	height: 17px;
+	padding-right: 16px;
+	padding-left: 4px;
+	background: url(../images/actions_right.png) no-repeat top right transparent;
+	font-weight: bold;
+	color: $popup-menu-text-higlight-color;
+	vertical-align: middle;
+	margin: 0;
+}
+#logOffBtn > ul > li {
+	list-style: none;
+	vertical-align: middle;
+	margin: 0;
+	padding: 0;
+	cursor: pointer;
+}
+#logOffBtn > ul {
+	list-style: none;
+	vertical-align: middle;
+	margin: 0;
+	padding: 0;
+	height: 25px;
+	noline-height: 25px;
+}
+	
+.itop_popup li a, #logOffBtn li a {
+	display: block;
+	padding: 5px 12px;
+	text-decoration: none;
+	nowidth: 70px;
+	color: $popup-menu-text-color;
+	font-weight: bold;
+	white-space: nowrap;
+	background: $popup-menu-background-color;
+}
+
+#logOffBtn li span {
+	display: block;
+	padding: 5px 12px;
+	text-decoration: none;
+	nowidth: 70px;
+	color: $popup-menu-text-color;
+	white-space: nowrap;
+	background: $popup-menu-background-color;
+}
+.itop_popup ul {
+	padding-left: 0;
+}
+
+.menucontainer div.toolkit_menu {
+	margin-left: 10px;
+}
+
+.itop_popup li a:hover, #logOffBtn li a:hover {
+	background: #1A4473;
+}
+
+.itop_popup ul > li > ul, #logOffBtn ul > li > ul
+{	
+	border: 1px solid black;
+	background: #fff;
+}
+	
+.itop_popup li > ul, #logOffBtn li > ul
+{	margin: 0;
+	padding: 0;
+	position: absolute;
+	display: none;
+	border-top: 1px solid white;
+	z-index: 999;
+}
+
+.itop_popup li ul li,  #logOffBtn li ul li {
+	float: none;
+	display: inline;
+}
+
+.itop_popup li ul li a, #logOffBtn li ul li a {
+	width: auto;
+	text-align: left;
+}
+
+.itop_popup li ul li a:hover, #logOffBtn li ul li a:hover{
+	background: $popup-menu-highlight-color;
+	color: $popup-menu-text-higlight-color;
+	font-weight: bold;
+}
+.itop_popup > ul {
+	margin: 0;
+}
+hr.menu-separator {
+	border: none 0;
+	border-top: 1px solid #ccc;
+	color: #ccc;
+	background-color: transparent;
+	height: 1px;
+	margin: 3px;
+	cursor: default;
+}
+/************************************/
+.wizHeader {
+	background: $complement-color;
+	padding: 15px;
+}
+.wizContainer {
+	border: 5px solid $complement-color;
+	background: $complement-light;
+	padding: 5px;
+}
+
+.wizContainer table tr td {
+	background: transparent;
+}
+.alignRight {
+	text-align: right;
+	padding: 3px;
+}
+
+.alignLeft {
+	text-align: left;
+	padding: 3px;
+}
+
+.red {
+	background-color: #ff6000;
+	color: #000;
+}
+
+th.red {
+	background: url(../images/red-header.gif) bottom left repeat-x;
+	color: #000;
+}
+
+.green {
+	background-color: #00cc00;
+	color: #000;
+}
+th.green {
+	background: url(../images/green-header.gif) bottom left repeat-x;
+	color: #000;
+}
+
+.orange {
+	background-color: #ffde00;
+	color: #000;
+}
+
+th.orange {
+	background: url(../images/orange-header.gif) bottom left repeat-x;
+	color: #000;
+}
+
+/* For Date Picker: Creates a little calendar icon
+ * instead of a text link for "Choose date"
+ */
+td a.dp-choose-date, a.dp-choose-date, td a.dp-choose-date:hover, a.dp-choose-date:hover, td a.dp-choose-date:visited, a.dp-choose-date:visited {
+	float: left;
+	width: 16px;
+	height: 16px;
+	padding: 0;
+	margin: 5px 3px 0;
+	display: block;
+	text-indent: -2000px;
+	overflow: hidden;
+	background: url(../images/calendar.png) no-repeat; 
+}
+td a.dp-choose-date.dp-disabled, a.dp-choose-date.dp-disabled {
+	background-position: 0 -20px;
+	cursor: default;
+}
+/* For Date Picker: makes the input field shorter once the date picker code
+ * has run (to allow space for the calendar icon)
+ */
+input.dp-applied {
+	width: 140px;
+	float: left;
+}
+
+/* For search forms */
+.SearchDrawer {
+	//background: $complement-color url(../images/search-top-left-corner.png) top left no-repeat;
+	border-top: 5px solid $complement-color;
+	border-left: 5px solid $complement-color;
+	border-right: 5px solid $complement-color;
+	border-bottom: 0;
+	background: $complement-light;
+	color: #000;
+	padding: 10px;
+	margin: 0;
+	font-size: 12px;
+}
+.SearchDrawer label {
+	background: $complement-light;
+	color: #000;
+}
+.SearchDrawer h1 {
+	color: #000;
+}
+.DrawerClosed {
+	display: none;
+}
+.DrawerHandle {
+	margin: 0;
+	padding: 5px;
+	background: url(../images/drawer-handle.gif) bottom no-repeat transparent;
+	color: #fff;
+	cursor: pointer;
+	text-align: center;
+	/* center the block */
+	width: 100px;
+	margin-left: auto;
+	margin-right: auto;
+	margin-top: 0;
+	margin-bottom: 0;
+	display: block;
+	font-size: 12px;
+}
+
+div.HRDrawer {
+	height: 5px;
+	width: 100%;
+	margin: 0;
+	background-color:  $complement-color;
+	margin: 0;
+	padding: 0;
+	border: 0;
+	display: block;
+}
+.mini_tabs a {
+	text-decoration: none;
+	font-weight:bold;
+	color: #ccc;
+	background-color:#333;
+	padding-left: 1em;
+	padding-right: 1em;
+	padding-bottom: 0.25em;
+}
+.mini_tabs a.selected {
+	color: #fff;
+	background-color:  $complement-color;
+	padding-top: 0.25em;
+}
+.mini_tabs ul {
+	margin: -10px;
+}
+.mini_tabs ul li {
+	float: right;
+	list-style: none;
+	nopadding-left: 1em;
+	nopadding-right: 1em;
+	margin-top: 0;
+}
+.mandatory {
+	border: 1px solid #f00;
+}
+
+/* Beware: IE6 does not support multiple selector with multiple classes, only the last class is used */
+table.listResults tr.odd td.truncated, table.listResults tr td.truncated, .wizContainer table.listResults tr.odd td.truncated, .wizContainer table.listResults tr td.truncated {
+	background: url(../images/truncated.png) bottom  repeat-x;
+}
+
+/* Beware: IE6 does not support multiple selector with multiple classes, only the last class is used */
+table.listResults tr.even td.truncated, .wizContainer table.listResults  tr.even td.truncated {
+	background: #f9f9f1 url(../images/truncated.png) bottom  repeat-x;
+}
+
+/* Beware: IE6 does not support multiple selector with multiple classes, only the last class is used */
+table.listResults tr.even td.hover.truncated, , .wizContainer table.listResults  tr.even td.hover.truncated {
+	background: #fdf5d0 url(../images/truncated.png) bottom  repeat-x;
+}
+
+/* Beware: IE6 does not support multiple selector with multiple classes, only the last class is used */
+table.listResults tr.odd td.hover.truncated,  table.listResults tr td.hover.truncated, .wizContainer table.listResults  tr.odd td.hover.truncated, .wizContainer table.listResults  tr td.hover.truncated {
+	background: #fdf5d0 url(../images/truncated.png) bottom  repeat-x;
+}
+
+table.listResults.truncated {
+	border-bottom: 0;
+	padding-bottom: 0;
+}
+
+tr.csv_row0 td {
+	padding-top:5px;
+	padding-bottom:5px;
+	padding-left:10px;
+	padding-right:10px;
+	background: #fff;
+	border-left: #000 1px solid;
+	
+}
+tr.csv_row1 td {
+	padding-top:5px;
+	padding-bottom:5px;
+	padding-left:10px;
+	padding-right:10px;
+	background: #f9f9f1;
+	border-left: #000 1px solid;
+	
+}
+tr.csv_row1 th, tr.csv_row0 th {
+	padding-top:5px;
+	padding-bottom:5px;
+	padding-left:10px;
+	padding-right:10px;
+	border-left: #000 1px solid;
+	
+}
+
+td.cell_modified {
+	font-weight: bold;
+	color: #000;
+}
+
+td.cell_error {
+	font-weight: bold;
+	color: #D81515;
+}
+table.transparent, table.transparent td {
+	background: transparent;
+}
+p.page-header {
+	color:$complement-color;
+	font-weight: bold;
+	font-size: 12pt;
+	font-family: Verdana, Arial, Helvetica, Sans-Serif
+}
+td.dashboard {
+	vertical-align:top;
+	border: 1px solid #ccc;
+	padding: 0.5em;
+	width: 50%;
+}
+.white {
+	background-color: #fff;
+}
+
+/*** New Lacanau layout ***/
+
+.ui-layout-pane { /* all 'panes' */ 
+	overflow: auto;
+} 
+
+.ui-layout-resizer { /* all 'resizer-bars' */ 
+	background: #f1f1f1; 
+} 
+.ui-layout-toggler { /* all 'toggler-buttons' */ 
+	background: #AAA; 
+}
+div#top-left {
+	width: 28px;
+	height: 70px;
+	background: $frame-background-color;
+	float:left;
+}
+div#header-logo {
+	width: 100%;
+	height: 70px;
+	background: $frame-background-color;
+}
+.ui-layout-pane-west {
+	background: $frame-background-color;
+}
+div#right {
+	min-width: 260px;
+}
+div#menu {
+	width: 100%;
+	overflow: auto;
+}
+.header-menu {
+	padding-left: 24px;
+	padding-right: 8px;
+	padding-bottom: 24px;
+	background: transparent;
+}
+div#inner_menu {
+	padding-left: 24px;
+	padding-right: 8px;
+	background: transparent;
+}
+div#logo {
+	height: 70px;
+	nowidth: 100%;
+	text-align: center;
+}
+div#logo div {
+	height: 88px;
+	width: 244px;
+	background: url(../images/itop-logo-2.png) left no-repeat;
+}
+#left-pane .ui-layout-north {
+	overflow: hidden;
+}
+#top-bar {
+	height: 55px;
+	background: $frame-background-color;
+	text-align: right;
+}
+#admin-banner {
+	float: left;
+	margin-top: 2px;
+	padding: 8px;
+	border: 1px solid #c33;
+	background-color: #fee;
+	-moz-border-radius: 0.5em;
+}
+#global-search {
+	height: 55px;
+	float: right;
+	background: url(../images/banner-search.png) no-repeat;
+	nopadding-top: 15px;
+	text-align: right;
+	overflow-y: hidden;
+}
+#global-search > form div {
+	padding-left: 4px;
+}
+#global-search table, #global-search tr td,  #global-search tr {
+	padding: 0;
+	border: 0;
+	height: 55px;
+	margin: 0;
+	background: transparent;
+	overflow-y: hidden;
+	vertical-align: middle;
+}
+#global-search > form input[type="text"] {
+	border: 0;
+	height: 18px;
+	width: 180px;
+	padding-top: 4;
+	background: transparent;
+}
+#global-search > form tr td#g-search-input {
+	padding-top: 3px;
+	padding-left: 3px;
+	background: transparent;
+}
+div.icon {
+	width: 20px;
+	height: 20px;
+	margin: 2px;
+	float: right;
+}
+span.ui-icon {
+	float:left;
+	margin:0 2px;
+}
+.ui-layout-button-pin-down {
+	background: url(../images/splitter-bkg.png) transparent;
+	width: 16px;
+	background-position: -144px -144px;
+}
+.ui-layout-resizer-west-open {
+	background-color: $frame-background-color;
+	width: 8px;
+}
+div.footer img {
+	border: 0;
+	margin-bottom: 5px;
+	margin-top: 5px;
+}
+div.footer{
+	text-align:center;
+}
+#SearchResultsToAdd table.listResults tbody {
+	height: 300px;
+	overflow-y: auto;
+}
+tr.row_unchanged td {
+	border-bottom: 1px #ccc solid;
+	padding: 2px;
+}
+.wizContainer table tr.row_error td {
+	border-bottom: 1px #ccc solid;
+	background-color: #fdd;
+	padding: 2px;
+}
+tr.row_modified td {
+	border-bottom: 1px #ccc solid;
+	padding: 2px;
+}
+tr.row_added td {
+	border-bottom: 1px #ccc solid;
+	padding: 2px;
+}
+a.truncated {
+	cursor: pointer;
+}
+.org_combo
+{
+	font-size:x-small;
+	width: auto;
+	max-width: 200px; 
+}
+span.form_validation {
+	width:24px;
+	text-align:center;
+}
+.notification {
+	border: 1px solid #c33;
+	background-color: #fee;
+	padding: 0.5em;
+	margin: 0.5em;
+	text-align:center;
+	width: 95%;
+	-moz-border-radius: 0.5em;
+}
+.wiki_broken_link {
+	text-decoration: line-through;
+}
+.synoptics, .synoptics tr td {
+	background: transparent;
+	padding:10px;
+	font-size:1em;
+	vertical-align:middle;
+	color:#fff;
+	text-align:center;
+}
+.synoptics tr td.arrow {
+	color:#333;
+	border-top: 1px dashed #333;
+	width:100px;
+}
+.synoptics tr.synoptics_header td {
+	color:#000; font-size:1em;
+	vertical-align:middle;
+	text-align:center;
+}
+.mono_value {
+	display: inline-block;
+	background-color: #3c3;
+	color: #fff;
+	font-weight:bold;
+	padding: 3px;
+	padding-left: 5px;
+	padding-right: 5px;
+	margin-left:3px;
+	-moz-border-radius: 10px;
+	-webkit-border-radius: 10px;
+	border-radius: 10px;
+}
+.multi_values {
+	display: inline-block;
+	background-color: #c33;
+	color: #fff;
+	font-weight:bold;
+	padding: 3px;
+	padding-left: 5px;
+	padding-right: 5px;
+	margin-left:3px;
+	-moz-border-radius: 10px;
+	-webkit-border-radius: 10px;
+	border-radius: 10px;
+}
+.caselog {
+	overflow-x: hidden;
+	display: block;
+	overflow-y: auto;
+	border: 1px #ddd solid;
+    font-family: Tahoma, Verdana, Arial, Helvetica;
+    font-size: 12px;
+}
+.caselog_input_header {
+	padding-top:3px;
+	padding-bottom:3px;
+	border-top:1px solid #fff;
+	background: #ddd;
+	width:100%;
+}
+.caselog_header {
+	padding:3px;
+	border-top:1px solid #fff;
+	background: #ddd url(../images/plus.gif) left no-repeat;
+	padding-left: 16px;
+	cursor: pointer;
+	width:100%;
+}
+.caselog_header.open {
+	background: #ddd url(../images/minus.gif) left no-repeat;
+}
+.caselog_entry {
+	padding:3px;
+	padding-left: 16px;
+	border-bottom:1px #999 solid;
+	margin-left:0;
+	margin-right:0;
+ 	white-space: pre-wrap; /* css-3 */
+    white-space: -moz-pre-wrap; /* Mozilla, since 1999 */
+    white-space: -pre-wrap; /* Opera 4-6 */
+    white-space: -o-pre-wrap; /* Opera 7 */
+    word-wrap: break-word; /* Internet Explorer 5.5+, CSS3 */
+}
+table.details {
+  border-collapse: collapse;
+  noborder-bottom: 2px #fff solid;
+  width:100%;
+}
+table.details>tbody>tr>td {
+	border-bottom: 2px #ddd solid;
+	padding-bottom: 5px;
+	padding-top: 3px;
+}
+fieldset table.details>tbody>tr>td {
+	padding-top: 3px;
+	background: transparent;
+	border: 0;
+}
+.ac_dlg_loading {
+	background: white url('../images/indicator.gif') right center no-repeat;
+}
+table.pagination {
+	display:inline-block;
+}
+table.pagination tr td {
+	padding: 3px;
+}
+.pagination_container {
+	padding-left: 3px;
+}
+.pager p {
+	margin-top: 0;
+	margin-bottom: 0;
+}
+.pager td span {
+	min-width: 20px;
+	padding-left: 2px;
+	padding-right: 2px;
+	display:inline-block;
+	text-align: center;
+	cursor: pointer;
+}
+
+.pager td span.curr_page {
+	color: #fff;
+	background: #999;
+	-moz-border-radius: 4px;
+	-webkit-border-radius: 4px;
+	border-radius: 4px;
+}
+img.prev, img.first, img.next, img.last {
+	cursor: pointer;
+}
+div.actions_button {
+	float:right;
+	background: url("../images/actions_left.png") no-repeat scroll left top transparent;
+	padding-left: 5px;
+	margin-top: 0;
+	margin-right: 10px;
+	height:17px;
+	vertical-align: middle;
+}
+
+div.actions_button a, .actions_button a:hover, .actions_button a:visited {
+	background:url(../images/actions_bkg.png) no-repeat scroll right top transparent;
+	color:#fff;
+	padding-right: 8px;
+	cursor:pointer;
+	font-family: Tahoma,sans-serif;
+	font-size: 11px;
+	font-weight: bold;
+	padding-left: 4px;
+	text-decoration: none;
+	height:17px;
+	line-height: 17px;
+	display: block;
+}
+select#org_id {
+	max-width: 90%;
+}
+/*********** Dashboards ***********/
+.itop-dashboard {
+	background-color: #fff;
+}
+.dragHover {
+	background: url(./ui-lightness/images/ui-bg_diagonals-thick_20_666666_40x40.png);
+}
+.edit_mode .dashlet {
+	background: url(./ui-lightness/images/ui-bg_diagonals-thick_20_666666_40x40.png);
+	padding: 5px;
+	margin:0;
+	position:relative;
+}
+.edit_mode .dashlet-selected {
+	background: $highlight-color !important;
+	padding: 5px;
+	margin:0;
+}
+td.layout_cell {
+	height: 50px; /* min-height does not work */
+	vertical-align: top;
+}
+.dashlet-content {
+	background: #fff;
+	margin:0;
+}
+table.prop_table {
+    border-bottom: 2px solid #F9F9F1;
+    padding: 1px;
+    width: 100%;
+}
+.close-box {
+	margin: 5px;
+	width: 20px;
+	height: 20px;
+	position: absolute;
+	top: 0;
+	right: 0;
+	z-index: 10;
+	background: transparent url(../images/delete.png) no-repeat center;
+}
+td.prop_value {
+	text-align: left;
+}
+tr.itop-property-field-modified td {
+	background: #fbb;
+}
+tr.itop-property-field-modified td.hover {
+	background: #f99;
+}
+td.prop_value textarea, td.prop_value input[type=text]{
+	width: 98%;
+}
+td.prop_icon {
+	width: 20px;
+}
+
+.dashlet {
+	text-align:left;
+}
+.dashlet-inline {
+	display: inline-block;
+}
+.dashlet-badge a.actions {
+    background: none repeat scroll 0 0 transparent;
+    color: #666666;
+    font-size: 16px;
+    text-decoration: none;
+}
+.dashlet-content .display_block {
+	text-align:left;
+}
+.prop_apply .ui-icon-alert {
+	display: none;
+}
+.prop_apply .ui-state-error .ui-icon-alert {
+	display: block;
+}
+.ui-state-error .ui-icon-circle-check {
+	display: none;
+}
+.summary-details {
+    float: right;
+    margin-top: 5px;
+}
+.summary-details th {
+    background: none repeat scroll 0 0 $summary-details-background;
+    color: #EEEEEE;
+    padding: 5px;
+    text-align: center;
+}
+.main_header {
+    background-color: $main-header-background;
+    min-height: 60px;
+    width: 100%;
+}
+.main_header h1 {
+    color: $complement-color;
+    line-height: 16px;
+    margin-bottom: 0;
+    margin-top: 0;
+    padding-bottom: 10px;
+    padding-top: 10px;
+}
+.main_header img {
+	margin-top: 10px;
+	margin-right: 10px;
+	float:left;
+}
+a.summary,  a.summary:hover {
+    background: none repeat scroll 0 0 transparent;
+    color: #666666;
+    text-decoration: none;
+    padding-left: 0;
+}
+.summary-details td {
+    background: none repeat scroll 0 0 transparent;
+    padding: 5px;
+    text-align: center;
+}
+
+#DashboardMenu > ul > li {
+	list-style: none;
+	vertical-align: middle;
+	margin: 0;
+	padding: 0;
+	cursor: pointer;
+}
+
+#DashboardMenu > ul {
+	list-style: none;
+	vertical-align: middle;
+	margin: 0;
+	padding: 0;
+	height: 25px;
+}
+#DashboardMenu li a {
+	display: block;
+	padding: 5px 12px;
+	text-decoration: none;
+	color: #000;
+	font-weight: bold;
+	text-align: left;
+	white-space: nowrap;
+	background: #fff;
+}
+#DashboardMenu li span {
+	display: block;
+	padding: 5px 12px;
+	text-decoration: none;
+	color: #000;
+	white-space: nowrap;
+	background: #fff;
+}
+#DashboardMenu li {
+	list-style: none;
+}
+#DashboardMenu li a:hover {
+	background: #1A4473;
+}
+
+#DashboardMenu ul > li > ul
+{	
+	border: 1px solid black;
+	background: #fff;
+}
+	
+#DashboardMenu li > ul
+{	margin: 0;
+	padding: 0;
+	position: absolute;
+	display: none;
+	border-top: 1px solid white;
+	z-index: 999;
+}
+#DashboardMenu li ul li a:hover{
+	background: #D81515;
+	color: #fff;
+	font-weight: bold;
+	list-style: none;
+}
+.sortable_field_list {
+	display: inline-block;
+	width: 250px;
+	height: 150px;
+	border: 1px #333 solid;
+	overflow: auto;
+	padding-left: 0;
+	margin: 0;
+}
+.sortable_field_list li {
+	list-style: none;
+	font-size: 11px;
+}
+.sort_order {
+	display: inline-block;
+	width: 16px;
+	height: 12px;
+}
+.sort_none {
+	background: url(../images/bg.gif) no-repeat center;
+}
+.sort_asc {
+	background: url(../images/desc.gif) no-repeat center;
+}
+.sort_desc {
+	background: url(../images/asc.gif) no-repeat center;
+}
+.sort_hidden {
+	display: none;
+}
+.sortable_field_list > li.selected {
+	background: #F6A828;
+}
+.itop-deleted-object {
+	text-decoration: line-through;
+}
+.header_message {
+	padding: 1em;
+	font-size: 10pt;
+	background: #fff;
+	border: 1px solid #999;
+	-moz-border-radius: 4px;
+	-webkit-border-radius: 4px;
+	border-radius: 4px;
+	margin-bottom: 10px;
+}
+.header_message {
+	padding: 1em;
+	font-size: 10pt;
+	background: #fff;
+	border: 1px solid #999;
+	-moz-border-radius: 4px;
+	-webkit-border-radius: 4px;
+	border-radius: 4px;
+	margin-bottom: 10px;
+}
+.message_info {
+	border: 1px solid #993;
+	background: url(../images/info-mini.png) 1em 1em no-repeat #ffc;
+	padding-left: 3em;
+}
+.message_ok {
+	border: 1px solid #393;
+	background: url(../images/ok.png) 1em 1em no-repeat #cfc;
+	padding-left: 3em;
+}
+.message_error {
+	border: 1px solid #933;
+	background: url(../images/error.png) 1em 1em no-repeat #fcc;
+	padding-left: 3em;
+}
+.fg-menu a img {
+        border: 0;
+}
+div.ui-dialog-header {
+    padding-bottom: 10px;
+    padding-top: 7px;
+}
+.form_field_error {
+	border: 1px solid #933;
+	background: #fcc;
+}
+.simple-graph, .graph_config {
+	background: #fff;
+}
+.graph_config {
+	padding: 0.25em;
+}
+.graph_config button.ui-widget {
+	font-size: 12px;
+}
+.ui-tooltip, .arrow:after {
+	background: $frame-background-color;
+	border: 1px solid $grey-color;
+}
+.ui-tooltip {
+	padding: 10px 10px;
+	box-shadow: 0 0 7px black;
+}
+.arrow {
+	width: 70px;
+	height: 16px;
+	overflow: hidden;
+	position: absolute;
+	left: 50%;
+	margin-left: -35px;
+	bottom: -16px;
+}
+.arrow.top {
+	top: -16px;
+	bottom: auto;
+}
+.arrow.left {
+	left: 20%;
+}
+.arrow:after {
+	content: "";
+	position: absolute;
+	left: 20px;
+	top: -20px;
+	width: 25px;
+	height: 25px;
+	box-shadow: 6px 5px 9px -9px black;
+	-webkit-transform: rotate(45deg);
+	-ms-transform: rotate(45deg);
+	transform: rotate(45deg);
+}
+.arrow.top:after {
+	bottom: -20px;
+	top: auto;
+}

css/ui-lightness/jquery-ui-1.10.3.custom.css

@@ -0,0 +1,1178 @@
+/*! jQuery UI - v1.10.4 - 2015-04-25
+* http://jqueryui.com
+* Includes: jquery.ui.core.css, jquery.ui.resizable.css, jquery.ui.selectable.css, jquery.ui.accordion.css, jquery.ui.autocomplete.css, jquery.ui.button.css, jquery.ui.datepicker.css, jquery.ui.dialog.css, jquery.ui.menu.css, jquery.ui.progressbar.css, jquery.ui.slider.css, jquery.ui.spinner.css, jquery.ui.tabs.css, jquery.ui.tooltip.css, jquery.ui.theme.css
+* To view and modify this theme, visit http://jqueryui.com/themeroller/?ffDefault=Trebuchet%20MS%2CTahoma%2CVerdana%2CArial%2Csans-serif&fwDefault=bold&fsDefault=1.1em&cornerRadius=0&bgColorHeader=%23E87C1E&bgTextureHeader=flat&bgImgOpacityHeader=35&borderColorHeader=%23F26522&fcHeader=%23ffffff&iconColorHeader=%23ffffff&bgColorContent=%23eeeeee&bgTextureContent=flat&bgImgOpacityContent=100&borderColorContent=%23dddddd&fcContent=%23333333&iconColorContent=%23222222&bgColorDefault=%23f1f1f1&bgTextureDefault=flat&bgImgOpacityDefault=100&borderColorDefault=%23cccccc&fcDefault=%23555555&iconColorDefault=%23F26522&bgColorHover=%23fde17c&bgTextureHover=flat&bgImgOpacityHover=100&borderColorHover=%23E87C1E&fcHover=%23E87C1E&iconColorHover=%23E87C1E&bgColorActive=%23ffffff&bgTextureActive=flat&bgImgOpacityActive=65&borderColorActive=%23E87C1E&fcActive=%23E87C1E&iconColorActive=%23E87C1E&bgColorHighlight=%23ffe45c&bgTextureHighlight=flat&bgImgOpacityHighlight=75&borderColorHighlight=%23fed22f&fcHighlight=%23363636&iconColorHighlight=%231c94c4&bgColorError=%23b81900&bgTextureError=diagonals_thick&bgImgOpacityError=18&borderColorError=%23cd0a0a&fcError=%23ffffff&iconColorError=%23ffd27a&bgColorOverlay=%23666666&bgTextureOverlay=diagonals_thick&bgImgOpacityOverlay=20&opacityOverlay=50&bgColorShadow=%23000000&bgTextureShadow=flat&bgImgOpacityShadow=10&opacityShadow=20&thicknessShadow=5px&offsetTopShadow=-5px&offsetLeftShadow=-5px&cornerRadiusShadow=5px
+* Copyright 2015 jQuery Foundation and other contributors; Licensed MIT */
+
+/* Layout helpers
+----------------------------------*/
+.ui-helper-hidden {
+	display: none;
+}
+.ui-helper-hidden-accessible {
+	border: 0;
+	clip: rect(0 0 0 0);
+	height: 1px;
+	margin: -1px;
+	overflow: hidden;
+	padding: 0;
+	position: absolute;
+	width: 1px;
+}
+.ui-helper-reset {
+	margin: 0;
+	padding: 0;
+	border: 0;
+	outline: 0;
+	line-height: 1.3;
+	text-decoration: none;
+	font-size: 100%;
+	list-style: none;
+}
+.ui-helper-clearfix:before,
+.ui-helper-clearfix:after {
+	content: "";
+	display: table;
+	border-collapse: collapse;
+}
+.ui-helper-clearfix:after {
+	clear: both;
+}
+.ui-helper-clearfix {
+	min-height: 0; /* support: IE7 */
+}
+.ui-helper-zfix {
+	width: 100%;
+	height: 100%;
+	top: 0;
+	left: 0;
+	position: absolute;
+	opacity: 0;
+	filter:Alpha(Opacity=0);
+}
+
+.ui-front {
+	z-index: 100;
+}
+
+
+/* Interaction Cues
+----------------------------------*/
+.ui-state-disabled {
+	cursor: default !important;
+}
+
+
+/* Icons
+----------------------------------*/
+
+/* states and images */
+.ui-icon {
+	display: block;
+	text-indent: -99999px;
+	overflow: hidden;
+	background-repeat: no-repeat;
+}
+
+
+/* Misc visuals
+----------------------------------*/
+
+/* Overlays */
+.ui-widget-overlay {
+	position: fixed;
+	top: 0;
+	left: 0;
+	width: 100%;
+	height: 100%;
+}
+.ui-resizable {
+	position: relative;
+}
+.ui-resizable-handle {
+	position: absolute;
+	font-size: 0.1px;
+	display: block;
+}
+.ui-resizable-disabled .ui-resizable-handle,
+.ui-resizable-autohide .ui-resizable-handle {
+	display: none;
+}
+.ui-resizable-n {
+	cursor: n-resize;
+	height: 7px;
+	width: 100%;
+	top: -5px;
+	left: 0;
+}
+.ui-resizable-s {
+	cursor: s-resize;
+	height: 7px;
+	width: 100%;
+	bottom: -5px;
+	left: 0;
+}
+.ui-resizable-e {
+	cursor: e-resize;
+	width: 7px;
+	right: -5px;
+	top: 0;
+	height: 100%;
+}
+.ui-resizable-w {
+	cursor: w-resize;
+	width: 7px;
+	left: -5px;
+	top: 0;
+	height: 100%;
+}
+.ui-resizable-se {
+	cursor: se-resize;
+	width: 12px;
+	height: 12px;
+	right: 1px;
+	bottom: 1px;
+}
+.ui-resizable-sw {
+	cursor: sw-resize;
+	width: 9px;
+	height: 9px;
+	left: -5px;
+	bottom: -5px;
+}
+.ui-resizable-nw {
+	cursor: nw-resize;
+	width: 9px;
+	height: 9px;
+	left: -5px;
+	top: -5px;
+}
+.ui-resizable-ne {
+	cursor: ne-resize;
+	width: 9px;
+	height: 9px;
+	right: -5px;
+	top: -5px;
+}
+.ui-selectable-helper {
+	position: absolute;
+	z-index: 100;
+	border: 1px dotted black;
+}
+.ui-accordion .ui-accordion-header {
+	display: block;
+	cursor: pointer;
+	position: relative;
+	margin-top: 2px;
+	padding: .5em .5em .5em .7em;
+	min-height: 0; /* support: IE7 */
+}
+.ui-accordion .ui-accordion-icons {
+	padding-left: 2.2em;
+}
+.ui-accordion .ui-accordion-noicons {
+	padding-left: .7em;
+}
+.ui-accordion .ui-accordion-icons .ui-accordion-icons {
+	padding-left: 2.2em;
+}
+.ui-accordion .ui-accordion-header .ui-accordion-header-icon {
+	position: absolute;
+	left: .5em;
+	top: 50%;
+	margin-top: -8px;
+}
+.ui-accordion .ui-accordion-content {
+	padding: 1em 2.2em;
+	border-top: 0;
+	overflow: auto;
+}
+.ui-autocomplete {
+	position: absolute;
+	top: 0;
+	left: 0;
+	cursor: default;
+}
+.ui-button {
+	display: inline-block;
+	position: relative;
+	padding: 0;
+	line-height: normal;
+	margin-right: .1em;
+	cursor: pointer;
+	vertical-align: middle;
+	text-align: center;
+	overflow: visible; /* removes extra width in IE */
+}
+.ui-button,
+.ui-button:link,
+.ui-button:visited,
+.ui-button:hover,
+.ui-button:active {
+	text-decoration: none;
+}
+/* to make room for the icon, a width needs to be set here */
+.ui-button-icon-only {
+	width: 2.2em;
+}
+/* button elements seem to need a little more width */
+button.ui-button-icon-only {
+	width: 2.4em;
+}
+.ui-button-icons-only {
+	width: 3.4em;
+}
+button.ui-button-icons-only {
+	width: 3.7em;
+}
+
+/* button text element */
+.ui-button .ui-button-text {
+	display: block;
+	line-height: normal;
+}
+.ui-button-text-only .ui-button-text {
+	padding: .4em 1em;
+}
+.ui-button-icon-only .ui-button-text,
+.ui-button-icons-only .ui-button-text {
+	padding: .4em;
+	text-indent: -9999999px;
+}
+.ui-button-text-icon-primary .ui-button-text,
+.ui-button-text-icons .ui-button-text {
+	padding: .4em 1em .4em 2.1em;
+}
+.ui-button-text-icon-secondary .ui-button-text,
+.ui-button-text-icons .ui-button-text {
+	padding: .4em 2.1em .4em 1em;
+}
+.ui-button-text-icons .ui-button-text {
+	padding-left: 2.1em;
+	padding-right: 2.1em;
+}
+/* no icon support for input elements, provide padding by default */
+input.ui-button {
+	padding: .4em 1em;
+}
+
+/* button icon element(s) */
+.ui-button-icon-only .ui-icon,
+.ui-button-text-icon-primary .ui-icon,
+.ui-button-text-icon-secondary .ui-icon,
+.ui-button-text-icons .ui-icon,
+.ui-button-icons-only .ui-icon {
+	position: absolute;
+	top: 50%;
+	margin-top: -8px;
+}
+.ui-button-icon-only .ui-icon {
+	left: 50%;
+	margin-left: -8px;
+}
+.ui-button-text-icon-primary .ui-button-icon-primary,
+.ui-button-text-icons .ui-button-icon-primary,
+.ui-button-icons-only .ui-button-icon-primary {
+	left: .5em;
+}
+.ui-button-text-icon-secondary .ui-button-icon-secondary,
+.ui-button-text-icons .ui-button-icon-secondary,
+.ui-button-icons-only .ui-button-icon-secondary {
+	right: .5em;
+}
+
+/* button sets */
+.ui-buttonset {
+	margin-right: 7px;
+}
+.ui-buttonset .ui-button {
+	margin-left: 0;
+	margin-right: -.3em;
+}
+
+/* workarounds */
+/* reset extra padding in Firefox, see h5bp.com/l */
+input.ui-button::-moz-focus-inner,
+button.ui-button::-moz-focus-inner {
+	border: 0;
+	padding: 0;
+}
+.ui-datepicker {
+	width: 17em;
+	padding: .2em .2em 0;
+	display: none;
+}
+.ui-datepicker .ui-datepicker-header {
+	position: relative;
+	padding: .2em 0;
+}
+.ui-datepicker .ui-datepicker-prev,
+.ui-datepicker .ui-datepicker-next {
+	position: absolute;
+	top: 2px;
+	width: 1.8em;
+	height: 1.8em;
+}
+.ui-datepicker .ui-datepicker-prev-hover,
+.ui-datepicker .ui-datepicker-next-hover {
+	top: 1px;
+}
+.ui-datepicker .ui-datepicker-prev {
+	left: 2px;
+}
+.ui-datepicker .ui-datepicker-next {
+	right: 2px;
+}
+.ui-datepicker .ui-datepicker-prev-hover {
+	left: 1px;
+}
+.ui-datepicker .ui-datepicker-next-hover {
+	right: 1px;
+}
+.ui-datepicker .ui-datepicker-prev span,
+.ui-datepicker .ui-datepicker-next span {
+	display: block;
+	position: absolute;
+	left: 50%;
+	margin-left: -8px;
+	top: 50%;
+	margin-top: -8px;
+}
+.ui-datepicker .ui-datepicker-title {
+	margin: 0 2.3em;
+	line-height: 1.8em;
+	text-align: center;
+}
+.ui-datepicker .ui-datepicker-title select {
+	font-size: 1em;
+	margin: 1px 0;
+}
+.ui-datepicker select.ui-datepicker-month,
+.ui-datepicker select.ui-datepicker-year {
+	width: 49%;
+}
+.ui-datepicker table {
+	width: 100%;
+	font-size: .9em;
+	border-collapse: collapse;
+	margin: 0 0 .4em;
+}
+.ui-datepicker th {
+	padding: .7em .3em;
+	text-align: center;
+	font-weight: bold;
+	border: 0;
+}
+.ui-datepicker td {
+	border: 0;
+	padding: 1px;
+}
+.ui-datepicker td span,
+.ui-datepicker td a {
+	display: block;
+	padding: .2em;
+	text-align: right;
+	text-decoration: none;
+}
+.ui-datepicker .ui-datepicker-buttonpane {
+	background-image: none;
+	margin: .7em 0 0 0;
+	padding: 0 .2em;
+	border-left: 0;
+	border-right: 0;
+	border-bottom: 0;
+}
+.ui-datepicker .ui-datepicker-buttonpane button {
+	float: right;
+	margin: .5em .2em .4em;
+	cursor: pointer;
+	padding: .2em .6em .3em .6em;
+	width: auto;
+	overflow: visible;
+}
+.ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current {
+	float: left;
+}
+
+/* with multiple calendars */
+.ui-datepicker.ui-datepicker-multi {
+	width: auto;
+}
+.ui-datepicker-multi .ui-datepicker-group {
+	float: left;
+}
+.ui-datepicker-multi .ui-datepicker-group table {
+	width: 95%;
+	margin: 0 auto .4em;
+}
+.ui-datepicker-multi-2 .ui-datepicker-group {
+	width: 50%;
+}
+.ui-datepicker-multi-3 .ui-datepicker-group {
+	width: 33.3%;
+}
+.ui-datepicker-multi-4 .ui-datepicker-group {
+	width: 25%;
+}
+.ui-datepicker-multi .ui-datepicker-group-last .ui-datepicker-header,
+.ui-datepicker-multi .ui-datepicker-group-middle .ui-datepicker-header {
+	border-left-width: 0;
+}
+.ui-datepicker-multi .ui-datepicker-buttonpane {
+	clear: left;
+}
+.ui-datepicker-row-break {
+	clear: both;
+	width: 100%;
+	font-size: 0;
+}
+
+/* RTL support */
+.ui-datepicker-rtl {
+	direction: rtl;
+}
+.ui-datepicker-rtl .ui-datepicker-prev {
+	right: 2px;
+	left: auto;
+}
+.ui-datepicker-rtl .ui-datepicker-next {
+	left: 2px;
+	right: auto;
+}
+.ui-datepicker-rtl .ui-datepicker-prev:hover {
+	right: 1px;
+	left: auto;
+}
+.ui-datepicker-rtl .ui-datepicker-next:hover {
+	left: 1px;
+	right: auto;
+}
+.ui-datepicker-rtl .ui-datepicker-buttonpane {
+	clear: right;
+}
+.ui-datepicker-rtl .ui-datepicker-buttonpane button {
+	float: left;
+}
+.ui-datepicker-rtl .ui-datepicker-buttonpane button.ui-datepicker-current,
+.ui-datepicker-rtl .ui-datepicker-group {
+	float: right;
+}
+.ui-datepicker-rtl .ui-datepicker-group-last .ui-datepicker-header,
+.ui-datepicker-rtl .ui-datepicker-group-middle .ui-datepicker-header {
+	border-right-width: 0;
+	border-left-width: 1px;
+}
+.ui-dialog {
+	overflow: hidden;
+	position: absolute;
+	top: 0;
+	left: 0;
+	padding: .2em;
+	outline: 0;
+}
+.ui-dialog .ui-dialog-titlebar {
+	padding: .4em 1em;
+	position: relative;
+}
+.ui-dialog .ui-dialog-title {
+	float: left;
+	margin: .1em 0;
+	white-space: nowrap;
+	width: 90%;
+	overflow: hidden;
+	text-overflow: ellipsis;
+}
+.ui-dialog .ui-dialog-titlebar-close {
+	position: absolute;
+	right: .3em;
+	top: 50%;
+	width: 20px;
+	margin: -10px 0 0 0;
+	padding: 1px;
+	height: 20px;
+}
+.ui-dialog .ui-dialog-content {
+	position: relative;
+	border: 0;
+	padding: .5em 1em;
+	background: none;
+	overflow: auto;
+}
+.ui-dialog .ui-dialog-buttonpane {
+	text-align: left;
+	border-width: 1px 0 0 0;
+	background-image: none;
+	margin-top: .5em;
+	padding: .3em 1em .5em .4em;
+}
+.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset {
+	float: right;
+}
+.ui-dialog .ui-dialog-buttonpane button {
+	margin: .5em .4em .5em 0;
+	cursor: pointer;
+}
+.ui-dialog .ui-resizable-se {
+	width: 12px;
+	height: 12px;
+	right: -5px;
+	bottom: -5px;
+	background-position: 16px 16px;
+}
+.ui-draggable .ui-dialog-titlebar {
+	cursor: move;
+}
+.ui-menu {
+	list-style: none;
+	padding: 2px;
+	margin: 0;
+	display: block;
+	outline: none;
+}
+.ui-menu .ui-menu {
+	margin-top: -3px;
+	position: absolute;
+}
+.ui-menu .ui-menu-item {
+	margin: 0;
+	padding: 0;
+	width: 100%;
+	/* support: IE10, see #8844 */
+	list-style-image: url(data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7);
+}
+.ui-menu .ui-menu-divider {
+	margin: 5px -2px 5px -2px;
+	height: 0;
+	font-size: 0;
+	line-height: 0;
+	border-width: 1px 0 0 0;
+}
+.ui-menu .ui-menu-item a {
+	text-decoration: none;
+	display: block;
+	padding: 2px .4em;
+	line-height: 1.5;
+	min-height: 0; /* support: IE7 */
+	font-weight: normal;
+}
+.ui-menu .ui-menu-item a.ui-state-focus,
+.ui-menu .ui-menu-item a.ui-state-active {
+	font-weight: normal;
+	margin: -1px;
+}
+
+.ui-menu .ui-state-disabled {
+	font-weight: normal;
+	margin: .4em 0 .2em;
+	line-height: 1.5;
+}
+.ui-menu .ui-state-disabled a {
+	cursor: default;
+}
+
+/* icon support */
+.ui-menu-icons {
+	position: relative;
+}
+.ui-menu-icons .ui-menu-item a {
+	position: relative;
+	padding-left: 2em;
+}
+
+/* left-aligned */
+.ui-menu .ui-icon {
+	position: absolute;
+	top: .2em;
+	left: .2em;
+}
+
+/* right-aligned */
+.ui-menu .ui-menu-icon {
+	position: static;
+	float: right;
+}
+.ui-progressbar {
+	height: 2em;
+	text-align: left;
+	overflow: hidden;
+}
+.ui-progressbar .ui-progressbar-value {
+	margin: -1px;
+	height: 100%;
+}
+.ui-progressbar .ui-progressbar-overlay {
+	background: url("images/animated-overlay.gif");
+	height: 100%;
+	filter: alpha(opacity=25);
+	opacity: 0.25;
+}
+.ui-progressbar-indeterminate .ui-progressbar-value {
+	background-image: none;
+}
+.ui-slider {
+	position: relative;
+	text-align: left;
+}
+.ui-slider .ui-slider-handle {
+	position: absolute;
+	z-index: 2;
+	width: 1.2em;
+	height: 1.2em;
+	cursor: default;
+}
+.ui-slider .ui-slider-range {
+	position: absolute;
+	z-index: 1;
+	font-size: .7em;
+	display: block;
+	border: 0;
+	background-position: 0 0;
+}
+
+/* For IE8 - See #6727 */
+.ui-slider.ui-state-disabled .ui-slider-handle,
+.ui-slider.ui-state-disabled .ui-slider-range {
+	filter: inherit;
+}
+
+.ui-slider-horizontal {
+	height: .8em;
+}
+.ui-slider-horizontal .ui-slider-handle {
+	top: -.3em;
+	margin-left: -.6em;
+}
+.ui-slider-horizontal .ui-slider-range {
+	top: 0;
+	height: 100%;
+}
+.ui-slider-horizontal .ui-slider-range-min {
+	left: 0;
+}
+.ui-slider-horizontal .ui-slider-range-max {
+	right: 0;
+}
+
+.ui-slider-vertical {
+	width: .8em;
+	height: 100px;
+}
+.ui-slider-vertical .ui-slider-handle {
+	left: -.3em;
+	margin-left: 0;
+	margin-bottom: -.6em;
+}
+.ui-slider-vertical .ui-slider-range {
+	left: 0;
+	width: 100%;
+}
+.ui-slider-vertical .ui-slider-range-min {
+	bottom: 0;
+}
+.ui-slider-vertical .ui-slider-range-max {
+	top: 0;
+}
+.ui-spinner {
+	position: relative;
+	display: inline-block;
+	overflow: hidden;
+	padding: 0;
+	vertical-align: middle;
+}
+.ui-spinner-input {
+	border: none;
+	background: none;
+	color: inherit;
+	padding: 0;
+	margin: .2em 0;
+	vertical-align: middle;
+	margin-left: .4em;
+	margin-right: 22px;
+}
+.ui-spinner-button {
+	width: 16px;
+	height: 50%;
+	font-size: .5em;
+	padding: 0;
+	margin: 0;
+	text-align: center;
+	position: absolute;
+	cursor: default;
+	display: block;
+	overflow: hidden;
+	right: 0;
+}
+/* more specificity required here to override default borders */
+.ui-spinner a.ui-spinner-button {
+	border-top: none;
+	border-bottom: none;
+	border-right: none;
+}
+/* vertically center icon */
+.ui-spinner .ui-icon {
+	position: absolute;
+	margin-top: -8px;
+	top: 50%;
+	left: 0;
+}
+.ui-spinner-up {
+	top: 0;
+}
+.ui-spinner-down {
+	bottom: 0;
+}
+
+/* TR overrides */
+.ui-spinner .ui-icon-triangle-1-s {
+	/* need to fix icons sprite */
+	background-position: -65px -16px;
+}
+.ui-tabs {
+	position: relative;/* position: relative prevents IE scroll bug (element with position: relative inside container with overflow: auto appear as "fixed") */
+	padding: .2em;
+}
+.ui-tabs .ui-tabs-nav {
+	margin: 0;
+	padding: .2em .2em 0;
+}
+.ui-tabs .ui-tabs-nav li {
+	list-style: none;
+	float: left;
+	position: relative;
+	top: 0;
+	margin: 1px .2em 0 0;
+	border-bottom-width: 0;
+	padding: 0;
+	white-space: nowrap;
+}
+.ui-tabs .ui-tabs-nav .ui-tabs-anchor {
+	float: left;
+	padding: .5em 1em;
+	text-decoration: none;
+}
+.ui-tabs .ui-tabs-nav li.ui-tabs-active {
+	margin-bottom: -1px;
+	padding-bottom: 1px;
+}
+.ui-tabs .ui-tabs-nav li.ui-tabs-active .ui-tabs-anchor,
+.ui-tabs .ui-tabs-nav li.ui-state-disabled .ui-tabs-anchor,
+.ui-tabs .ui-tabs-nav li.ui-tabs-loading .ui-tabs-anchor {
+	cursor: text;
+}
+.ui-tabs-collapsible .ui-tabs-nav li.ui-tabs-active .ui-tabs-anchor {
+	cursor: pointer;
+}
+.ui-tabs .ui-tabs-panel {
+	display: block;
+	border-width: 0;
+	padding: 1em 1.4em;
+	background: none;
+}
+.ui-tooltip {
+	padding: 8px;
+	position: absolute;
+	z-index: 9999;
+	max-width: 300px;
+	-webkit-box-shadow: 0 0 5px #aaa;
+	box-shadow: 0 0 5px #aaa;
+}
+body .ui-tooltip {
+	border-width: 2px;
+}
+
+/* Component containers
+----------------------------------*/
+.ui-widget {
+	font-family: Trebuchet MS,Tahoma,Verdana,Arial,sans-serif;
+	font-size: 1.1em;
+}
+.ui-widget .ui-widget {
+	font-size: 1em;
+}
+.ui-widget input,
+.ui-widget select,
+.ui-widget textarea,
+.ui-widget button {
+	font-family: Trebuchet MS,Tahoma,Verdana,Arial,sans-serif;
+	font-size: 1em;
+}
+.ui-widget-content {
+	border: 1px solid #dddddd;
+	background: #eeeeee url("images/ui-bg_flat_100_eeeeee_40x100.png") 50% 50% repeat-x;
+	color: #333333;
+}
+.ui-widget-content a {
+	color: #333333;
+}
+.ui-widget-header {
+	border: 1px solid #F26522;
+	background: #E87C1E url("images/ui-bg_flat_35_E87C1E_40x100.png") 50% 50% repeat-x;
+	color: #ffffff;
+	font-weight: bold;
+}
+.ui-widget-header a {
+	color: #ffffff;
+}
+
+/* Interaction states
+----------------------------------*/
+.ui-state-default,
+.ui-widget-content .ui-state-default,
+.ui-widget-header .ui-state-default {
+	border: 1px solid #cccccc;
+	background: #f1f1f1 url("images/ui-bg_flat_100_f1f1f1_40x100.png") 50% 50% repeat-x;
+	font-weight: bold;
+	color: #555555;
+}
+.ui-state-default a,
+.ui-state-default a:link,
+.ui-state-default a:visited {
+	color: #555555;
+	text-decoration: none;
+}
+.ui-state-hover,
+.ui-widget-content .ui-state-hover,
+.ui-widget-header .ui-state-hover,
+.ui-state-focus,
+.ui-widget-content .ui-state-focus,
+.ui-widget-header .ui-state-focus {
+	border: 1px solid #E87C1E;
+	background: #fde17c url("images/ui-bg_flat_100_fde17c_40x100.png") 50% 50% repeat-x;
+	font-weight: bold;
+	color: #E87C1E;
+}
+.ui-state-hover a,
+.ui-state-hover a:hover,
+.ui-state-hover a:link,
+.ui-state-hover a:visited,
+.ui-state-focus a,
+.ui-state-focus a:hover,
+.ui-state-focus a:link,
+.ui-state-focus a:visited {
+	color: #E87C1E;
+	text-decoration: none;
+}
+.ui-state-active,
+.ui-widget-content .ui-state-active,
+.ui-widget-header .ui-state-active {
+	border: 1px solid #E87C1E;
+	background: #ffffff url("images/ui-bg_flat_65_ffffff_40x100.png") 50% 50% repeat-x;
+	font-weight: bold;
+	color: #E87C1E;
+}
+.ui-state-active a,
+.ui-state-active a:link,
+.ui-state-active a:visited {
+	color: #E87C1E;
+	text-decoration: none;
+}
+
+/* Interaction Cues
+----------------------------------*/
+.ui-state-highlight,
+.ui-widget-content .ui-state-highlight,
+.ui-widget-header .ui-state-highlight {
+	border: 1px solid #fed22f;
+	background: #ffe45c url("images/ui-bg_flat_75_ffe45c_40x100.png") 50% 50% repeat-x;
+	color: #363636;
+}
+.ui-state-highlight a,
+.ui-widget-content .ui-state-highlight a,
+.ui-widget-header .ui-state-highlight a {
+	color: #363636;
+}
+.ui-state-error,
+.ui-widget-content .ui-state-error,
+.ui-widget-header .ui-state-error {
+	border: 1px solid #cd0a0a;
+	background: #b81900 url("images/ui-bg_diagonals-thick_18_b81900_40x40.png") 50% 50% repeat;
+	color: #ffffff;
+}
+.ui-state-error a,
+.ui-widget-content .ui-state-error a,
+.ui-widget-header .ui-state-error a {
+	color: #ffffff;
+}
+.ui-state-error-text,
+.ui-widget-content .ui-state-error-text,
+.ui-widget-header .ui-state-error-text {
+	color: #ffffff;
+}
+.ui-priority-primary,
+.ui-widget-content .ui-priority-primary,
+.ui-widget-header .ui-priority-primary {
+	font-weight: bold;
+}
+.ui-priority-secondary,
+.ui-widget-content .ui-priority-secondary,
+.ui-widget-header .ui-priority-secondary {
+	opacity: .7;
+	filter:Alpha(Opacity=70);
+	font-weight: normal;
+}
+.ui-state-disabled,
+.ui-widget-content .ui-state-disabled,
+.ui-widget-header .ui-state-disabled {
+	opacity: .35;
+	filter:Alpha(Opacity=35);
+	background-image: none;
+}
+.ui-state-disabled .ui-icon {
+	filter:Alpha(Opacity=35); /* For IE8 - See #6059 */
+}
+
+/* Icons
+----------------------------------*/
+
+/* states and images */
+.ui-icon {
+	width: 16px;
+	height: 16px;
+}
+.ui-icon,
+.ui-widget-content .ui-icon {
+	background-image: url("images/ui-icons_222222_256x240.png");
+}
+.ui-widget-header .ui-icon {
+	background-image: url("images/ui-icons_ffffff_256x240.png");
+}
+.ui-state-default .ui-icon {
+	background-image: url("images/ui-icons_F26522_256x240.png");
+}
+.ui-state-hover .ui-icon,
+.ui-state-focus .ui-icon {
+	background-image: url("images/ui-icons_E87C1E_256x240.png");
+}
+.ui-state-active .ui-icon {
+	background-image: url("images/ui-icons_E87C1E_256x240.png");
+}
+.ui-state-highlight .ui-icon {
+	background-image: url("images/ui-icons_1c94c4_256x240.png");
+}
+.ui-state-error .ui-icon,
+.ui-state-error-text .ui-icon {
+	background-image: url("images/ui-icons_ffd27a_256x240.png");
+}
+
+/* positioning */
+.ui-icon-blank { background-position: 16px 16px; }
+.ui-icon-carat-1-n { background-position: 0 0; }
+.ui-icon-carat-1-ne { background-position: -16px 0; }
+.ui-icon-carat-1-e { background-position: -32px 0; }
+.ui-icon-carat-1-se { background-position: -48px 0; }
+.ui-icon-carat-1-s { background-position: -64px 0; }
+.ui-icon-carat-1-sw { background-position: -80px 0; }
+.ui-icon-carat-1-w { background-position: -96px 0; }
+.ui-icon-carat-1-nw { background-position: -112px 0; }
+.ui-icon-carat-2-n-s { background-position: -128px 0; }
+.ui-icon-carat-2-e-w { background-position: -144px 0; }
+.ui-icon-triangle-1-n { background-position: 0 -16px; }
+.ui-icon-triangle-1-ne { background-position: -16px -16px; }
+.ui-icon-triangle-1-e { background-position: -32px -16px; }
+.ui-icon-triangle-1-se { background-position: -48px -16px; }
+.ui-icon-triangle-1-s { background-position: -64px -16px; }
+.ui-icon-triangle-1-sw { background-position: -80px -16px; }
+.ui-icon-triangle-1-w { background-position: -96px -16px; }
+.ui-icon-triangle-1-nw { background-position: -112px -16px; }
+.ui-icon-triangle-2-n-s { background-position: -128px -16px; }
+.ui-icon-triangle-2-e-w { background-position: -144px -16px; }
+.ui-icon-arrow-1-n { background-position: 0 -32px; }
+.ui-icon-arrow-1-ne { background-position: -16px -32px; }
+.ui-icon-arrow-1-e { background-position: -32px -32px; }
+.ui-icon-arrow-1-se { background-position: -48px -32px; }
+.ui-icon-arrow-1-s { background-position: -64px -32px; }
+.ui-icon-arrow-1-sw { background-position: -80px -32px; }
+.ui-icon-arrow-1-w { background-position: -96px -32px; }
+.ui-icon-arrow-1-nw { background-position: -112px -32px; }
+.ui-icon-arrow-2-n-s { background-position: -128px -32px; }
+.ui-icon-arrow-2-ne-sw { background-position: -144px -32px; }
+.ui-icon-arrow-2-e-w { background-position: -160px -32px; }
+.ui-icon-arrow-2-se-nw { background-position: -176px -32px; }
+.ui-icon-arrowstop-1-n { background-position: -192px -32px; }
+.ui-icon-arrowstop-1-e { background-position: -208px -32px; }
+.ui-icon-arrowstop-1-s { background-position: -224px -32px; }
+.ui-icon-arrowstop-1-w { background-position: -240px -32px; }
+.ui-icon-arrowthick-1-n { background-position: 0 -48px; }
+.ui-icon-arrowthick-1-ne { background-position: -16px -48px; }
+.ui-icon-arrowthick-1-e { background-position: -32px -48px; }
+.ui-icon-arrowthick-1-se { background-position: -48px -48px; }
+.ui-icon-arrowthick-1-s { background-position: -64px -48px; }
+.ui-icon-arrowthick-1-sw { background-position: -80px -48px; }
+.ui-icon-arrowthick-1-w { background-position: -96px -48px; }
+.ui-icon-arrowthick-1-nw { background-position: -112px -48px; }
+.ui-icon-arrowthick-2-n-s { background-position: -128px -48px; }
+.ui-icon-arrowthick-2-ne-sw { background-position: -144px -48px; }
+.ui-icon-arrowthick-2-e-w { background-position: -160px -48px; }
+.ui-icon-arrowthick-2-se-nw { background-position: -176px -48px; }
+.ui-icon-arrowthickstop-1-n { background-position: -192px -48px; }
+.ui-icon-arrowthickstop-1-e { background-position: -208px -48px; }
+.ui-icon-arrowthickstop-1-s { background-position: -224px -48px; }
+.ui-icon-arrowthickstop-1-w { background-position: -240px -48px; }
+.ui-icon-arrowreturnthick-1-w { background-position: 0 -64px; }
+.ui-icon-arrowreturnthick-1-n { background-position: -16px -64px; }
+.ui-icon-arrowreturnthick-1-e { background-position: -32px -64px; }
+.ui-icon-arrowreturnthick-1-s { background-position: -48px -64px; }
+.ui-icon-arrowreturn-1-w { background-position: -64px -64px; }
+.ui-icon-arrowreturn-1-n { background-position: -80px -64px; }
+.ui-icon-arrowreturn-1-e { background-position: -96px -64px; }
+.ui-icon-arrowreturn-1-s { background-position: -112px -64px; }
+.ui-icon-arrowrefresh-1-w { background-position: -128px -64px; }
+.ui-icon-arrowrefresh-1-n { background-position: -144px -64px; }
+.ui-icon-arrowrefresh-1-e { background-position: -160px -64px; }
+.ui-icon-arrowrefresh-1-s { background-position: -176px -64px; }
+.ui-icon-arrow-4 { background-position: 0 -80px; }
+.ui-icon-arrow-4-diag { background-position: -16px -80px; }
+.ui-icon-extlink { background-position: -32px -80px; }
+.ui-icon-newwin { background-position: -48px -80px; }
+.ui-icon-refresh { background-position: -64px -80px; }
+.ui-icon-shuffle { background-position: -80px -80px; }
+.ui-icon-transfer-e-w { background-position: -96px -80px; }
+.ui-icon-transferthick-e-w { background-position: -112px -80px; }
+.ui-icon-folder-collapsed { background-position: 0 -96px; }
+.ui-icon-folder-open { background-position: -16px -96px; }
+.ui-icon-document { background-position: -32px -96px; }
+.ui-icon-document-b { background-position: -48px -96px; }
+.ui-icon-note { background-position: -64px -96px; }
+.ui-icon-mail-closed { background-position: -80px -96px; }
+.ui-icon-mail-open { background-position: -96px -96px; }
+.ui-icon-suitcase { background-position: -112px -96px; }
+.ui-icon-comment { background-position: -128px -96px; }
+.ui-icon-person { background-position: -144px -96px; }
+.ui-icon-print { background-position: -160px -96px; }
+.ui-icon-trash { background-position: -176px -96px; }
+.ui-icon-locked { background-position: -192px -96px; }
+.ui-icon-unlocked { background-position: -208px -96px; }
+.ui-icon-bookmark { background-position: -224px -96px; }
+.ui-icon-tag { background-position: -240px -96px; }
+.ui-icon-home { background-position: 0 -112px; }
+.ui-icon-flag { background-position: -16px -112px; }
+.ui-icon-calendar { background-position: -32px -112px; }
+.ui-icon-cart { background-position: -48px -112px; }
+.ui-icon-pencil { background-position: -64px -112px; }
+.ui-icon-clock { background-position: -80px -112px; }
+.ui-icon-disk { background-position: -96px -112px; }
+.ui-icon-calculator { background-position: -112px -112px; }
+.ui-icon-zoomin { background-position: -128px -112px; }
+.ui-icon-zoomout { background-position: -144px -112px; }
+.ui-icon-search { background-position: -160px -112px; }
+.ui-icon-wrench { background-position: -176px -112px; }
+.ui-icon-gear { background-position: -192px -112px; }
+.ui-icon-heart { background-position: -208px -112px; }
+.ui-icon-star { background-position: -224px -112px; }
+.ui-icon-link { background-position: -240px -112px; }
+.ui-icon-cancel { background-position: 0 -128px; }
+.ui-icon-plus { background-position: -16px -128px; }
+.ui-icon-plusthick { background-position: -32px -128px; }
+.ui-icon-minus { background-position: -48px -128px; }
+.ui-icon-minusthick { background-position: -64px -128px; }
+.ui-icon-close { background-position: -80px -128px; }
+.ui-icon-closethick { background-position: -96px -128px; }
+.ui-icon-key { background-position: -112px -128px; }
+.ui-icon-lightbulb { background-position: -128px -128px; }
+.ui-icon-scissors { background-position: -144px -128px; }
+.ui-icon-clipboard { background-position: -160px -128px; }
+.ui-icon-copy { background-position: -176px -128px; }
+.ui-icon-contact { background-position: -192px -128px; }
+.ui-icon-image { background-position: -208px -128px; }
+.ui-icon-video { background-position: -224px -128px; }
+.ui-icon-script { background-position: -240px -128px; }
+.ui-icon-alert { background-position: 0 -144px; }
+.ui-icon-info { background-position: -16px -144px; }
+.ui-icon-notice { background-position: -32px -144px; }
+.ui-icon-help { background-position: -48px -144px; }
+.ui-icon-check { background-position: -64px -144px; }
+.ui-icon-bullet { background-position: -80px -144px; }
+.ui-icon-radio-on { background-position: -96px -144px; }
+.ui-icon-radio-off { background-position: -112px -144px; }
+.ui-icon-pin-w { background-position: -128px -144px; }
+.ui-icon-pin-s { background-position: -144px -144px; }
+.ui-icon-play { background-position: 0 -160px; }
+.ui-icon-pause { background-position: -16px -160px; }
+.ui-icon-seek-next { background-position: -32px -160px; }
+.ui-icon-seek-prev { background-position: -48px -160px; }
+.ui-icon-seek-end { background-position: -64px -160px; }
+.ui-icon-seek-start { background-position: -80px -160px; }
+/* ui-icon-seek-first is deprecated, use ui-icon-seek-start instead */
+.ui-icon-seek-first { background-position: -80px -160px; }
+.ui-icon-stop { background-position: -96px -160px; }
+.ui-icon-eject { background-position: -112px -160px; }
+.ui-icon-volume-off { background-position: -128px -160px; }
+.ui-icon-volume-on { background-position: -144px -160px; }
+.ui-icon-power { background-position: 0 -176px; }
+.ui-icon-signal-diag { background-position: -16px -176px; }
+.ui-icon-signal { background-position: -32px -176px; }
+.ui-icon-battery-0 { background-position: -48px -176px; }
+.ui-icon-battery-1 { background-position: -64px -176px; }
+.ui-icon-battery-2 { background-position: -80px -176px; }
+.ui-icon-battery-3 { background-position: -96px -176px; }
+.ui-icon-circle-plus { background-position: 0 -192px; }
+.ui-icon-circle-minus { background-position: -16px -192px; }
+.ui-icon-circle-close { background-position: -32px -192px; }
+.ui-icon-circle-triangle-e { background-position: -48px -192px; }
+.ui-icon-circle-triangle-s { background-position: -64px -192px; }
+.ui-icon-circle-triangle-w { background-position: -80px -192px; }
+.ui-icon-circle-triangle-n { background-position: -96px -192px; }
+.ui-icon-circle-arrow-e { background-position: -112px -192px; }
+.ui-icon-circle-arrow-s { background-position: -128px -192px; }
+.ui-icon-circle-arrow-w { background-position: -144px -192px; }
+.ui-icon-circle-arrow-n { background-position: -160px -192px; }
+.ui-icon-circle-zoomin { background-position: -176px -192px; }
+.ui-icon-circle-zoomout { background-position: -192px -192px; }
+.ui-icon-circle-check { background-position: -208px -192px; }
+.ui-icon-circlesmall-plus { background-position: 0 -208px; }
+.ui-icon-circlesmall-minus { background-position: -16px -208px; }
+.ui-icon-circlesmall-close { background-position: -32px -208px; }
+.ui-icon-squaresmall-plus { background-position: -48px -208px; }
+.ui-icon-squaresmall-minus { background-position: -64px -208px; }
+.ui-icon-squaresmall-close { background-position: -80px -208px; }
+.ui-icon-grip-dotted-vertical { background-position: 0 -224px; }
+.ui-icon-grip-dotted-horizontal { background-position: -16px -224px; }
+.ui-icon-grip-solid-vertical { background-position: -32px -224px; }
+.ui-icon-grip-solid-horizontal { background-position: -48px -224px; }
+.ui-icon-gripsmall-diagonal-se { background-position: -64px -224px; }
+.ui-icon-grip-diagonal-se { background-position: -80px -224px; }
+
+
+/* Misc visuals
+----------------------------------*/
+
+/* Corner radius */
+.ui-corner-all,
+.ui-corner-top,
+.ui-corner-left,
+.ui-corner-tl {
+	border-top-left-radius: 0;
+}
+.ui-corner-all,
+.ui-corner-top,
+.ui-corner-right,
+.ui-corner-tr {
+	border-top-right-radius: 0;
+}
+.ui-corner-all,
+.ui-corner-bottom,
+.ui-corner-left,
+.ui-corner-bl {
+	border-bottom-left-radius: 0;
+}
+.ui-corner-all,
+.ui-corner-bottom,
+.ui-corner-right,
+.ui-corner-br {
+	border-bottom-right-radius: 0;
+}
+
+/* Overlays */
+.ui-widget-overlay {
+	background: #666666 url("images/ui-bg_diagonals-thick_20_666666_40x40.png") 50% 50% repeat;
+	opacity: .5;
+	filter: Alpha(Opacity=50);
+}
+.ui-widget-shadow {
+	margin: -5px 0 0 -5px;
+	padding: 5px;
+	background: #000000 url("images/ui-bg_flat_10_000000_40x100.png") 50% 50% repeat-x;
+	opacity: .2;
+	filter: Alpha(Opacity=20);
+	border-radius: 5px;
+}

js/extkeywidget.js

@@ -95,6 +95,7 @@ function ExtKeyWidget(id, sTargetClass, sFilter, sTitle, bSelectMode, oWizHelper
 				me.UpdateSizes();
 				me.UpdateButtons();
 				me.ajax_request = null;
+				FixSearchFormsDisposition();
 				me.DoSearchObjects();
 			},
 			'html'

js/linksdirectwidget.js

@@ -257,6 +257,7 @@ $(function()
 					var c = this.value;
 					me._onUpdateDlgButtons(c);
 				});
+				FixSearchFormsDisposition();
 				$('#SearchResultsToAdd_'+me.id).unblock();
 				me._onSearchDlgUpdateSize();
 			});

js/linkswidget.js

@@ -134,6 +134,7 @@ function LinksWidget(id, sClass, sAttCode, iInputId, sSuffix, bDuplicates, oWizH
 					var c = this.value;
 					me.UpdateButtons(c);
 				});
+				FixSearchFormsDisposition();
 				$(sSearchAreaId).unblock();		
 			},
 			'html'

js/utils.js

@@ -210,12 +210,35 @@ function ReloadSearchForm(divId, sClassName, sBaseClass, sContext)
 					}
 				}
 		   }
+		   FixSearchFormsDisposition();
 		   oDiv.unblock();
 		   oDiv.parent().resize(); // Inform the parent that the form has just been (potentially) resized
 	   }
 	 );
 }
 
+function FixSearchFormsDisposition()
+{
+	// Fix search forms
+	$('.SearchDrawer').each(function() {
+		var colWidth = 0;
+		var labelWidth = 0;
+		$('label:visible', $(this)).each( function() {
+			var l = $(this).parent().width() - $(this).width();
+			colWidth = Math.max(l, colWidth);
+			labelWidth = Math.max($(this).width(), labelWidth);
+		});
+		$('label:visible', $(this)).each( function() {
+			if($(this).data('resized') != true)
+			{
+				$(this).parent().width(colWidth + labelWidth);
+				$(this).width(labelWidth).css({display: 'inline-block'}).data('resized', true);					
+			}
+		});		
+	});
+
+}
+
 /**
  * Stores - in a persistent way - user specific preferences
  * depends on a global variable oUserPreferences created/filled by the iTopWebPage
@@ -389,6 +412,33 @@ function ShortcutListDlg(sOQL, sDataTableId, sContext)
 	return false;
 }
 
+function ExportListDlg(sOQL, sDataTableId, sFormat, sDlgTitle)
+{
+	var sDataTableName = 'datatable_'+sDataTableId;
+	var oColumns = $('#'+sDataTableName).datatable('option', 'oColumns');
+	var aFields = [];
+	for(var j in oColumns)
+	{
+		for(var k in oColumns[j])
+		{
+			if (oColumns[j][k].checked)
+			{
+				var sCode = oColumns[j][k].code;
+				if (sCode == '_key_')
+				{
+					sCode = 'id';
+				}
+				aFields.push(j+'.'+sCode);
+			}
+		}
+	}
+
+	$.post(GetAbsoluteUrlAppRoot()+'webservices/export-v2.php', {interactive: 1, advanced: 1, mode: 'dialog', format: sFormat, expression: sOQL, suggested_fields: aFields.join(','), dialog_title: sDlgTitle}, function(data) {
+		$('body').append(data);
+	});
+	return false;
+}
+
 function DisplayHistory(sSelector, sFilter, iCount, iStart)
 {
 	$(sSelector).block();

lib/sass/Phamlp.php

@@ -0,0 +1,72 @@
+<?php
+/* SVN FILE: $Id: HamlException.php 61 2010-04-16 10:19:59Z chris.l.yates $ */
+/**
+ * Phamlp.
+ * @author			Chris Yates <chris.l.yates@gmail.com>
+ * @copyright 	Copyright (c) 2010 PBM Web Development
+ * @license			http://phamlp.googlecode.com/files/license.txt
+ * @package			PHamlP
+ */
+/**
+ * Phamlp class.
+ * Static support classes.
+ * @package			PHamlP
+ */
+class Phamlp {
+	/**
+	 * @var string Language used to translate messages
+	 */
+	public static $language;
+	/**
+	 * @var array Messages used for translation
+	 */
+	public static $messages;
+	
+	/**
+	 * Translates a message to the specified language.
+	 * @param string message category.
+	 * @param string the original message
+	 * @param array parameters to be applied to the message using <code>strtr</code>.
+	 * @return string the translated message
+	 */
+	public static function t($category, $message, $params = array()) {
+		if (!empty(self::$language)) {
+			$message = self::translate($category, $message);
+		}
+		return $params!==array() ? strtr($message,$params) : $message;
+	}
+
+	/**
+	 * Translates a message to the specified language.
+	 * If the language or the message in the specified language is not defined the
+	 * original message is returned.
+	 * @param string message category
+	 * @param string the original message
+	 * @return string the translated message
+	 */
+	private static function translate($category, $message) {
+		if (empty(self::$messages[$category])) self::loadMessages($category);
+		return (empty(self::$messages[$category][$message]) ? $message : self::$messages[$category][$message]);
+	}
+
+	/**
+	 * Loads the specified language message file for translation.
+	 * Message files are PHP files in the "category/messages" directory and named
+	 * "language.php", where category is either haml or sass, and language is the
+	 * specified language.
+	 * The message file returns an array of (source, translation) pairs; for example:
+	 * <pre>
+	 * return array(
+	 *   'original message 1' => 'translated message 1',
+	 *   'original message 2' => 'translated message 2',
+	 * );
+	 * </pre>
+	 * @param string message category
+	 */
+	private static function loadMessages($category) {
+		$messageFile = dirname(__FILE__).DIRECTORY_SEPARATOR.$category.DIRECTORY_SEPARATOR.'messages'.DIRECTORY_SEPARATOR.self::$language.'.php';
+		if (file_exists($messageFile)) {
+			self::$messages[$category] = require_once($messageFile);
+		}
+	}
+}

lib/sass/PhamlpException.php

@@ -0,0 +1,31 @@
+<?php
+/* SVN FILE: $Id: HamlException.php 61 2010-04-16 10:19:59Z chris.l.yates $ */
+/**
+ * Phamlp exception.
+ * @author			Chris Yates <chris.l.yates@gmail.com>
+ * @copyright 	Copyright (c) 2010 PBM Web Development
+ * @license			http://phamlp.googlecode.com/files/license.txt
+ * @package			PHamlP
+ */
+
+require_once('Phamlp.php');
+
+/**
+ * Phamlp exception class.
+ * Base class for PHamlP::Haml and PHamlP::Sass exceptions.
+ * Translates exception messages.
+ * @package			PHamlP
+ */
+class PhamlpException extends Exception {
+	/**
+	 * Phamlp Exception.
+	 * @param string Category (haml|sass)
+	 * @param string Exception message
+	 * @param array parameters to be applied to the message using <code>strtr</code>.
+	 */
+	public function __construct($category, $message, $params, $object) {
+		parent::__construct(Phamlp::t($category, $message, $params) . 
+			(is_object($object) ? ": {$object->filename}::{$object->line}\nSource: {$object->source}" : '')
+		);
+	}
+}

lib/sass/haml/HamlException.php

@@ -0,0 +1,29 @@
+<?php
+/* SVN FILE: $Id: HamlException.php 61 2010-04-16 10:19:59Z chris.l.yates $ */
+/**
+ * Haml exception.
+ * @author			Chris Yates <chris.l.yates@gmail.com>
+ * @copyright 	Copyright (c) 2010 PBM Web Development
+ * @license			http://phamlp.googlecode.com/files/license.txt
+ * @package			PHamlP
+ * @subpackage	Haml
+ */
+
+require_once(dirname(__FILE__).'/../PhamlpException.php');
+
+/**
+ * Haml exception class.
+ * @package			PHamlP
+ * @subpackage	Haml
+ */
+class HamlException extends PhamlpException {
+	/**
+	 * Haml Exception. 
+	 * @param string Exception message
+	 * @param array parameters to be applied to the message using <code>strtr</code>.
+	 * @param object object with source code and meta data
+	 */
+	public function __construct($message, $params = array(), $object = null) {
+		parent::__construct('haml', $message, $params, $object);
+	}
+}

lib/sass/haml/HamlHelpers.php

@@ -0,0 +1,199 @@
+<?php
+/* SVN FILE: $Id: HamlHelpers.php 92 2010-05-20 17:42:59Z chris.l.yates $ */
+/**
+ * HamlHelpers class file.
+ * 
+ * @author			Chris Yates <chris.l.yates@gmail.com>
+ * @copyright 	Copyright (c) 2010 PBM Web Development
+ * @license			http://phamlp.googlecode.com/files/license.txt
+ * @package			PHamlP
+ * @subpackage	Haml
+ */
+
+/**
+ * HamlHelpers class.
+ * Contains methods to make it easier to do various tasks.
+ * 
+ * The class can be extended to provide user defined helper methods. The
+ * signature for user defined helper methods is ($block, $other, $arguments);
+ * $block is the string generated by the Haml block being operated on.
+ * 
+ * Tthe path to the extended class is provided to HamlParser in the config
+ * array; class name == file name.
+ * 
+ * HamlHelpers and any extended class are automatically included in the context
+ * that a Haml template is parsed in, so all the methods are at your disposal
+ * from within the template.
+ * 
+ * @package			PHamlP
+ * @subpackage	Haml
+ */
+class HamlHelpers {
+	const XMLNS = 'http://www.w3.org/1999/xhtml';
+	
+	/**
+	 * Returns the block with string appended.
+	 * @see succeed
+	 * @param string Haml block
+	 * @param string string to append
+	 * @return string the block with string appended.
+	 */
+	public static function append($block, $string) {
+	  return $block.$string;
+	}
+	
+	/**
+	 * Escapes HTML entities in text, but without escaping an ampersand that is
+	 * already part of an escaped entity.
+	 * @param string Haml block
+	 * @return string the block with HTML entities escaped.
+	 */
+	public static function escape_once($block) {
+	  return htmlentities(html_entity_decode($block));
+	}
+	
+	/**
+	 * Returns an array containing default assignments for the xmlns, lang, and
+	 * xml:lang attributes of the html element.
+	 * This helper method is for use in the html element only.
+	 * 
+	 * Examples:<br/>
+	 * %html(html_attrs())<br/> 
+	 * produces<br/> 
+	 * <html lang="en-us" xml:lang="en-us" xmlns="http://www.w3.org/1999/xhtml">
+	 * 
+	 * %html(html_attrs('en-gb'))<br/> 
+	 * produces<br/>
+	 * <html lang="en-gb" xml:lang="en-gb" xmlns="http://www.w3.org/1999/xhtml">
+	 * 
+	 * %html(html_attrs('en-gb', false))<br/> 
+	 * produces<br/> 
+	 * <html xml:lang="en-gb" xmlns="http://www.w3.org/1999/xhtml">
+	 * 
+	 * Although handled in HamlParser, the notes below are here for completeness.<br/> 
+	 * Other attributes are defined as normal. e.g.<br/> 
+	 * %html(xmlns:me="http://www.example.com/me" html_attrs('en-gb', false))<br/> 
+	 * produces<br/> 
+	 * <html xml:lang="en-gb" xmlns="http://www.w3.org/1999/xhtml" xmlns:me="http://www.example.com/me">
+	 * 
+	 * PHamlP also allows for the language to be defined using PHP code that can 
+	 * be eval'd; the code must end with a semi-colon (;). e.g.<br/> 
+	 * %html(html_attrs("FW::app()->language);", false))<br/> 
+	 * produces (assuming FW::app()->language returns 'en-gb')<br/> 
+	 * <html xml:lang="en-gb" xmlns="http://www.w3.org/1999/xhtml">
+	 * 
+	 * @param string document language. Default = en-us
+	 * @param boolean whether the html element has the lang attribute. Default: true
+	 * Should be set false for XHTML 1.1 or greater documents
+	 * @return string the block with string appended.
+	 */
+	public static function html_attrs($language = 'en-us', $lang = true)  {
+	  return ($lang ?
+	  	array('xmlns'=>self::XMLNS, 'xml:lang'=>$language, 'lang'=>$language) :
+	  	array('xmlns'=>self::XMLNS, 'xml:lang'=>$language));
+	}
+	
+	/**
+	 * Returns a copy of text with ampersands, angle brackets and quotes escaped
+	 * into HTML entities.
+	 * @param string Haml block
+	 * @return string the block with HTML entities escaped.
+	 */
+	public static function html_escape($block) {
+	  return htmlspecialchars($block);
+	}
+	
+	/**
+	 * Iterates an array and using the block to generate a <li> element for each
+	 * array element.
+	 * Examples:<br/>
+	 * = list_of(array('red', 'orange', ...., 'violet'), 'colour')<br/>
+	 * 	= colour<br/>
+	 * Produces:<br/>
+	 * <li>red</li><br/>
+	 * <li>orange</li><br/>
+	 *    |<br/>
+	 *    |<br/>
+	 * <li>violet></li><br/>
+	 * 
+	 * = list_of(array('Fly Fishing' => 'JR Hartley', 'Lord of the Rings' => 'JRR Tolkien'), 'title', 'author')<br/>
+	 *   %h3= title<br/>
+	 *   %p= author<br/>
+	 * Produces:<br/>
+	 * <li><br/>
+	 *   <h3>Fly Fishing</h3><br/>
+	 *   <p>JR Hartley</p><br/>
+	 * </li><br/>
+	 * <li><br/>
+	 *   <h3>Lord of the Rings</h3><br/>
+	 *   <p>JRR Tolkien</p><br/>
+	 * </li><br/>
+	 * 
+	 * @param string Haml block
+	 * @param array items
+	 * @param string string in block to replace with item key or item value
+	 * @param string string in block to replace with item value
+	 * @return string list items.
+	 */
+	public static function list_of($block, $items, $key, $value = null) {
+		$output = '';
+		foreach ($items as $_key=>$_value) {
+			$output .= '<li>' . strtr($block, (empty($value) ? array($key=>$_value) :
+					array($key=>$_key, $value=>$_value))) . '</li>';
+		} // foreach
+		return $output;
+	}
+	
+	/**
+	 * Alias for prepend.
+	 * @see prepend
+	 * @param string Haml block
+	 * @param string string to prepend
+	 * @return string the block with string prepended
+	 */
+	public static function preceed($block, $string) {
+		return self::prepend($block, $string);
+	}
+	
+	/**
+	 * Returns the block with string prepended.
+	 * @param string Haml block
+	 * @param string string to prepend
+	 * @return string the block with string prepended
+	 */
+	public static function prepend($block, $string) {
+		return $string.$block;
+	}
+	
+	/**
+	 * Converts newlines in the block to HTML entities.
+	 * @param string Haml block
+	 * @return string the block with newlines converted to HTML entities
+	 */
+	public static function preserve($block) {
+		return str_replace("\n", '&#x0d;&#x0a;', $block);
+	}
+	
+	/**
+	 * Alias for append.
+	 * @see append
+	 * @param string Haml block
+	 * @param string string to apppend
+	 * @return string the block with string apppended
+	 */
+	public static function succeed($block, $string) {
+		return self::append($block, $string);
+	}
+	
+	/**
+	 * Surrounds a block of Haml code with strings.
+	 * If $back is not given it defaults to $front.
+	 * @param string Haml block
+	 * @param string string to prepend
+	 * @param string string to apppend
+	 * @return string the block surrounded by the strings
+	 */
+	public static function surround($block, $front, $back=null) {
+	  return $front.$block.(is_null($back) ? $front : $back);
+	}	
+}

lib/sass/haml/HamlParser.php

@@ -0,0 +1,1249 @@
+<?php
+/* SVN FILE: $Id: HamlParser.php 117 2010-09-21 09:41:58Z chris.l.yates@gmail.com $ */
+/**
+ * HamlParser class file.
+ * HamlParser allows you to write view files in
+ * {@link http://haml-lang.com/ Haml}.
+ * 
+ * Please see the {@link http://haml-lang.com/docs/yardoc/file.Haml_REFERENCE.html#plain_text Haml documentation} for the syntax.
+ * 
+ * Credits:
+ * This is a port of Haml to PHP. All the genius comes from the people that
+ * invented and develop Haml; in particular:
+ * + {@link http://hamptoncatlin.com/ Hampton Catlin},
+ * + {@link http://nex-3.com/ Nathan Weizenbaum},
+ * + {@link http://chriseppstein.github.com/ Chris Eppstein}
+ * 
+ * The bugs are mine. Please report any found at {@link http://code.google.com/p/phamlp/issues/list}
+ * 
+ * Notes
+ * <ul>
+ * <li>Debug (addition)<ul>
+ * <li>Source debug - adds comments to the output showing each source line above
+ * the result - ?#s+ to turn on, ?#s- to turn off, ?#s! to toggle</li>
+ * <li>Output debug - shows the output directly in the browser - ?#o+ to turn on, ?#o- to turn off, ?#o! to toggle</li>
+ * <li>Control both at once - ?#so+ to turn on, ?#so- to turn off, ?#so! to toggle</li>
+ * <li>Ugly mode can be controlled by the template</li>
+ * <liUugly mode strips comments in the output by default</li>
+ * <li>Ugly mode is turned off when in debug</li></ul></li>
+ * <li>"-" command (notes)<ul>
+ * <li>PHP does not require ending ";"</li>
+ * <li>PHP control blocks are automatically bracketed</li>
+ * <li>Switch Case statements do not end with ":"
+ * <li>do-while control blocks are written as "do (expression)"</li></ul></li>
+ * </ul>
+ * Comes with filters that run "out of the box":
+ * + <b>plain</b>: useful for large chunks of text to ensure Haml doesn't do anything.
+ * + <b>escaped</b>: like plain but the output is (x)html escaped.
+ * + <b>preserve</b>: like plain but preserves the whitespace.
+ * + <b>cdata</b>: wraps the content in CDATA tags.
+ * + <b>javascript</b>: wraps the content in <script> and CDATA tags. Useful for adding inline JavaScript.
+ * + <b>css</b>: wraps the content in <style> and CDATA tags. Useful for adding inline CSS.
+ * + <b>php</b>: wraps the content in <?php tags. The content is PHP code.
+ * There are two filters that require external classes to work. See {@link http://code.google.com/p/phamlp/wiki/PredefinedFilters PredefinedFilters on the PHamlP wiki} for details of how to use them.
+ * + <b>markdown</b>: Parses the filtered text with Markdown.
+ * + <b>textile</b>: Parses the filtered text with Textile.
+ * PHP can be used in all the filters (except php) by wrapping expressions in #().
+ * 
+ * @author			Chris Yates <chris.l.yates@gmail.com>
+ * @copyright 	Copyright (c) 2010 PBM Web Development
+ * @license			http://phamlp.googlecode.com/files/license.txt
+ * @package			PHamlP
+ * @subpackage	Haml
+ */
+
+require_once('tree/HamlNode.php');
+require_once('HamlHelpers.php');
+require_once('HamlException.php');
+
+/**
+ * HamlParser class.
+ * Parses {@link http://haml-lang.com/ Haml} view files.
+ * @package			PHamlP
+ * @subpackage	Haml
+ */
+class HamlParser {
+	/**#@+
+	 * Debug modes
+	 */
+	const DEBUG_NONE = 0;
+	const DEBUG_SHOW_SOURCE = 1;
+	const DEBUG_SHOW_OUTPUT = 2;
+	const DEBUG_SHOW_ALL = 3;
+	/**#@-*/
+
+	/**#@+
+	 * Regexes used to parse the document
+	 */
+	const REGEX_HAML = '/(?m)^([ \x09]*)((?::(\w*))?(?:%([\w:-]*))?(?:\.((?:(?:[-_:a-zA-Z]|#\{.+?\})+(?:[-:\w]|#\{.+?\})*(?:\.?))*))?(?:#((?:[_:a-zA-Z]|#\{.+?\})+(?:[-:\w]|#\{.+?\})*))?(?:\[(.+)\])?(?:(\()((?:(?:html_attrs\(.*?\)|data[\t ]*=[\t ]*\{.+?\}|(?:[_:a-zA-Z]+[-:\w]*)[\t ]*=[\t ]*.+)[\t ]*)+\)))?(?:(\{)((?::(?:html_attrs\(.*?\)|data[\t ]*=>[\t ]*\{.+?\}|(?:[_:a-zA-Z]+[-:\w]*)[\t ]*=>?[\t ]*.+)(?:,?[\t ]*)?)+\}))?(\|?>?\|?<?) *((?:\?#)|!!!|\/\/|\/|-#|!=|&=|!|&|=|-|~|\\\\\\\\)? *(.*?)(?:\s(\|)?)?)$/'; // Haml line
+	const REGEX_ATTRIBUTES = '/:?(?:(data)\s*=>?\s*([({].*?[})]))|(\w+(?:[-:]\w*)*)\s*=>?\s*(?(?=\[)(?:\[(.+?)\])|(?(?=([\'"]))(?:[\'"](.*?)\5)|([^\s,]+)))/';
+	const REGEX_ATTRIBUTE_FUNCTION = '/^\$?[_a-zA-Z]\w*(?(?=->)(->[_a-zA-Z]\w*)+|(::[_a-zA-Z]\w*)?)\(.+\)$/'; // Matches functions and instantiated and static object methods
+	const REGEX_WHITESPACE_REMOVAL = '/(.*?)\s+$/s';
+	const REGEX_WHITESPACE_REMOVAL_DEBUG = '%(.*?)(?:<br />\s)$%s'; // whitespace control when showing output
+	//const REGEX_CODE_INTERPOLATION = '/(?:(?<!\\\\)#{(.+?(?:\(.*?\).*?)*)})/';
+	/**#@-*/
+	const MATCH_INTERPOLATION = '/(?<!\\\\)#\{(.*?)\}/';
+	const INTERPOLATE = '<?php echo \1; ?>';
+	const HTML_ATTRS = '/html_attrs\(\s*((?(?=\')(?:.*?)\'|(?:.*?)"))(?:\s*,\s*(.*?))?\)/';
+
+
+	/**#@+
+	 * Haml regex match positions
+	 */
+	const HAML_HAML									=  0;
+	const HAML_INDENT								=  1;
+	const HAML_SOURCE								=  2;
+	const HAML_FILTER								=  3;
+	const HAML_TAG									=  4;
+	const HAML_CLASS								=  5;
+	const HAML_ID										=  6;
+	const HAML_OBJECT_REFERENCE			=  7;
+	const HAML_OPEN_XML_ATTRIBUTES	=  8;
+	const HAML_XML_ATTRIBUTES 			=  9;
+	const HAML_OPEN_RUBY_ATTRIBUTES = 10;
+	const HAML_RUBY_ATTRIBUTES			= 11;
+	const HAML_WHITESPACE_REMOVAL		= 12;
+	const HAML_TOKEN								= 13;
+	const HAML_CONTENT							= 14;
+	const HAML_MULTILINE						= 15;
+	/**#@-*/
+
+	/**#@+
+	 * Haml tokens
+	 */
+	const DOCTYPE = '!!!';
+	const HAML_COMMENT = '!(-#|//)!';
+	const XML_COMMENT = '/';
+	const SELF_CLOSE_TAG = '/';
+	const ESCAPE_XML = '&=';
+	const UNESCAPE_XML = '!=';
+	const INSERT_CODE = '=';
+	const INSERT_CODE_PRESERVE_WHITESPACE = '~';
+	const RUN_CODE = '-';
+	const INNER_WHITESPACE_REMOVAL = '<';
+	const OUTER_WHITESPACE_REMOVAL = '>';
+	const BLOCK_LEFT_OUTER_WHITESPACE_REMOVAL = '|>';
+	const BLOCK_RIGHT_OUTER_WHITESPACE_REMOVAL = '>|';
+	/**#@-*/
+	
+	const MULTILINE= ' |';
+
+	/**#@+
+	 * Attribute tokens
+	 */
+	const OPEN_XML_ATTRIBUTES = '(';
+	const CLOSE_XML_ATTRIBUTES = ')';
+	const OPEN_RUBY_ATTRIBUTES = '{';
+	const CLOSE_RUBY_ATTRIBUTES = '}';
+	/**#@-*/
+
+	/**#@+
+	 * Directives
+	 */
+	const DIRECTIVE = '?#';
+	const SOURCE_DEBUG = 's';
+	const OUTPUT_DEBUG = 'o';
+	/**#@-*/
+
+	const IS_XML_PROLOG = 'XML';
+	const XML_PROLOG = "<?php echo \"<?xml version='1.0' encoding='{encoding}' ?>\n\"; ?>";
+	const DEFAULT_XML_ENCODING = 'utf-8';
+	const XML_ENCODING = '{encoding}';
+
+	/**
+	 * @var string Doctype format. Determines how the Haml Doctype declaration is 
+	 * rendered.
+	 * @see doctypes
+	 */
+	private $format = 'xhtml';
+	/**
+	 * @var string Custom Doctype. If not null and the Doctype declaration in the
+	 * Haml Document is not a built in Doctype this will be used as the Doctype.
+	 * This allows Haml to be used for non-(X)HTML documents that are XML compliant.
+	 * @see doctypes
+	 * @see emptyTags
+	 * @see inlineTags
+	 * @see minimizedAttributes
+	 */
+	 private $doctype;
+	/**
+	 * @var boolean whether or not to escape X(HT)ML-sensitive characters in script.
+	 * If this is true, = behaves like &=; otherwise, it behaves like !=.
+	 * Note that if this is set, != should be used for yielding to subtemplates
+	 * and rendering partials. Defaults to false.
+	 */
+	private $escapeHtml = false;
+  /**
+   * @var boolean Whether or not attribute hashes and scripts designated by
+   * = or ~ should be evaluated. If true, the scripts are rendered as empty strings.
+   * Defaults to false.
+   */
+	private $suppressEval = false;
+  /**
+	 * @var string The character that should wrap element attributes. Characters
+	 * of this type within attributes will be escaped (e.g. by replacing them with
+	 * &apos;) if the character is an apostrophe or a quotation mark.
+	 * Defaults to " (an quotation mark).
+	 */
+	private $attrWrapper = '"';
+	/**
+	 * @var array available output styles:
+	 * nested: output is nested according to the indent level in the source
+	 * expanded: block tags have their own lines as does content which is indented
+	 * compact: block tags and their content go on one line
+	 * compressed: all unneccessary whitepaces is removed. If ugly is true this style is used.
+	 */
+	private $styles = array('nested', 'expanded', 'compact', 'compressed');
+	/**
+	 * @var string output style. Note: ugly must be false to allow style.
+	 */
+	private $style = 'nested';
+  /**
+	 * @var boolean if true no attempt is made to properly indent or format
+	 * the output. Reduces size of output file but is not very readable;
+	 * equivalent of style == compressed. Note: ugly must be false to allow style.
+	 * Defaults to true.
+	 * @see style
+	 */
+	private $ugly = true;
+	/**
+	 * @var boolean if true comments are preserved in ugly mode. If not in
+	 * ugly mode comments are always output. Defaults to false.
+	 */
+	private $preserveComments = false;
+	/**
+	 * @var integer Initial debug setting:
+	 * no debug, show source, show output, or show all.
+	 * Debug settings can be controlled in the template
+	 * Defaults to DEBUG_NONE.
+	 */
+	private $debug = self::DEBUG_NONE;
+	/**
+	 * @var string Path to the directory containing user defined filters. If 
+	 * specified this dirctory will be searched before PHamlP looks for the filter
+	 * in it's collection. This allows the default filters to be overridden and
+	 * new filters to be installed. Note: No trailing directory separator.
+	 */
+	private $filterDir;
+	/**
+	 * @var string Path to the file containing user defined Haml helpers.
+	 */
+	private $helperFile;
+	/**
+	 * @var string Haml helper class. This must be an instance of HamlHelpers.
+	 */
+	private $helperClass = 'HamlHelpers';
+
+	/**
+	 * @var array built in Doctypes
+	 * @see format
+	 * @see doctype
+	 */
+	private $doctypes = array (
+		'html4' => array (
+			'<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">', //HTML 4.01 Transitional
+			'Strict' => '<!DOCTYPE html PUBLIC "-//W3C//DTD 4.01 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">', //HTML 4.01 Strict
+			'Frameset' => '<!DOCTYPE html PUBLIC "-//W3C//DTD 4.01 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">', //HTML 4.01 Frameset
+		),
+		'html5' => array (
+			'<!DOCTYPE html>', // XHTML 5
+		),
+		'xhtml' => array (
+			'<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">', //XHTML 1.0 Transitional
+			'Strict' => '<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">', //XHTML 1.0 Strict
+			'Frameset' => '<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">', //XHTML 1.0 Frameset
+			'5' => '<!DOCTYPE html>', // XHTML 5
+			'1.1' => '<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">', // XHTML 1.1
+			'Basic' => '<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML Basic 1.1//EN" "http://www.w3.org/TR/xhtml-basic/xhtml-basic11.dtd">', //XHTML Basic 1.1
+			'Mobile' => '<!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML Mobile 1.2//EN" "http://www.openmobilealliance.org/tech/DTD/xhtml-mobile12.dtd">', //XHTML Mobile 1.2
+		)
+	);
+	/**
+	 * @var array A list of tag names that should be automatically self-closed
+	 * if they have no content.
+	 */
+	private $emptyTags = array('meta', 'img', 'link', 'br', 'hr', 'input', 'area', 'param', 'col', 'base');
+	/**
+	 * @var array A list of inline tags.
+	 */
+	private $inlineTags = array('a', 'abbr', 'accronym', 'b', 'big', 'cite', 'code', 'dfn', 'em', 'i', 'kbd', 'q', 'samp', 'small', 'span', 'strike', 'strong', 'tt', 'u', 'var');
+	/**
+	 * @var array attributes that are minimised
+	 */
+	 private $minimizedAttributes = array('compact', 'checked', 'declare', 'readonly', 'disabled', 'selected', 'defer', 'ismap', 'nohref', 'noshade', 'nowrap', 'multiple', 'noresize');
+	/**
+	 * @var array A list of tag names that should automatically have their newlines preserved.
+	 */
+	private $preserve = array('pre', 'textarea');
+	/**#@-*/
+
+	/**
+	 * @var string the character used for indenting. Space or tab.
+	 * @see indentSpaces
+	 */
+	private $indentChar;
+	/**
+	 * @var array allowable characters for indenting
+	 */
+	private $indentChars = array(' ', "\t");
+	/**
+	 * @var integer number of spaces for indentation.
+	 * Used on source if {@link indentChar} is space.
+	 * Used on output if {@link ugly} is false.
+	 */
+	private $indentSpaces;
+	/**
+	 * @var array loaded filters
+	 */
+	private $filters = array();
+	/**
+	 * @var boolean whether line is in a filter
+	 */
+	private $inFilter = false;
+	/**
+	 * @var boolean whether to show the output in the browser for debug
+	 */
+	private $showOutput;
+	/**
+	 * @var boolean whether to show the source in the browser for debug
+	 */
+	private $showSource;
+	/**
+	 * @var integer line number of source being parsed
+	 */
+	private $line;
+	/**
+	 * @var string name of file being parsed
+	 */
+	private $filename;
+	/**
+	 * @var mixed source
+	 */
+	private $source;
+
+	/**
+	 * HamlParser constructor.
+	 * @param array options
+	 * @return HamlParser
+	 */
+	public function __construct($options = array()) {
+		if (isset($options['language'])) {
+			Phamlp::$language = $options['language'];
+			unset($options['language']);
+		}
+		foreach ($options as $name => $value) {
+			$this->$name = $value;
+		} // foreach
+		
+		if ($this->ugly) {
+			$this->style = 'compressed';
+		}
+
+		$this->format = strtolower($this->format);
+		if (is_null($this->doctype) &&
+				!array_key_exists($this->format, $this->doctypes)) {
+			throw new HamlException('Invalid {what} ({value}). Must be one of "{options}"', array('{what}'=>'format', '{value}'=>$this->format, '{options}'=>join(', ', array_keys($this->doctypes))), $this);
+		}
+
+		$this->showSource = $this->debug & HamlParser::DEBUG_SHOW_SOURCE;
+		$this->showOutput = $this->debug & HamlParser::DEBUG_SHOW_OUTPUT;
+		
+		require_once dirname(__FILE__).DIRECTORY_SEPARATOR.'HamlHelpers.php';
+		if (isset($this->helperFile)) {
+			require_once $this->helperFile;
+			$this->helperClass = basename($this->helperFile, ".php"); 
+			if (!is_subclass_of($this->helperClass, 'HamlHelpers')) {
+				throw new HamlException('{what} must extend {base} class', array('{what}'=>$this->helperClass, '{base}'=>'HamlHelpers'), $this);
+			}
+		} 
+	}
+	
+	/**
+	 * Getter.
+	 * @param string name of property to get
+	 * @return mixed return value of getter function
+	 */
+	public function __get($name) {
+		$getter = 'get' . ucfirst($name);
+		if (method_exists($this, $getter)) {
+			return $this->$getter();
+		}
+		throw new HamlException('No getter function for {what}', array('{what}'=>$name));
+	}
+	
+	public function getFilename() {
+		return $this->filename; 
+	}
+	
+	public function getLine() {
+		return $this->line; 
+	}
+	
+	public function getSource() {
+		return $this->source; 
+	}
+
+	/**
+	 * Parses a Haml file.
+	 * If an output directory is given the resulting PHP is cached.
+	 * @param string path to file to parse
+	 * @param mixed boolean: true to use the default cache directory, false to use
+	 * the source file directory. string: path to the cache directory.
+	 * null: disable caching
+	 * @param string output file extension
+	 * @param integer permission for the output directory and file
+	 * @return mixed string: the resulting PHP if no output directory is specified
+	 * or the output filename if the output directory is specified.
+	 * boolean: false if the output file could not be written.
+	 */
+	public function parse($sourceFile, $cacheDir=null, $permission=0755, $sourceExtension='.haml', $outputExtension='.php') {
+		if (is_string($cacheDir) || is_bool($cacheDir)) {
+			if (is_bool($cacheDir)) {
+				$cacheDir =
+						($cacheDir ? dirname(__FILE__).DIRECTORY_SEPARATOR.'haml-cache' :
+						dirname($sourceFile));
+			}
+			$outputFile = $cacheDir.DIRECTORY_SEPARATOR.
+					basename($sourceFile, $sourceExtension).$outputExtension;
+			if (@filemtime($sourceFile) > @filemtime($outputFile)) {
+				if (!is_dir($cacheDir)) {
+					@mkdir($cacheDir, $permission);
+				}
+				$return = (file_put_contents($outputFile, $this->haml2PHP($sourceFile))
+						=== false ? false : $outputFile);
+				if ($return !== false) {
+					@chmod($outputFile, $permission);
+				}
+			}
+			else {
+				$return = $outputFile;
+			}
+		}
+		else {
+			$return = $this->haml2PHP($sourceFile);
+		}
+		return $return;
+	}
+
+	/**
+	 * Parses a Haml file into PHP.  
+	 * @param string path to file to parse
+	 * @return string the resulting PHP
+	 */
+	public function haml2PHP($sourceFile) {
+		$this->line = 0;
+		$this->filename = $sourceFile;
+		$helpers = "<?php\nrequire_once '".dirname(__FILE__).DIRECTORY_SEPARATOR."HamlHelpers.php';\n";
+		if (isset($this->helperFile)) {
+			$helpers .= "require_once '{$this->helperFile}';\n";
+		}
+		$helpers .= "?>";
+		return $helpers . $this->toTree(file_get_contents($sourceFile))->render();
+	}
+
+	/**
+	 * Parse Haml source into a document tree.
+	 * @param string Haml source
+	 * @return HamlRootNode the root of this document tree
+	 */
+	private function toTree($source) {
+		$this->source = explode("\n", $source);
+		$this->setIndentChar();
+
+		preg_match_all(self::REGEX_HAML, $source, $this->source, PREG_SET_ORDER);
+		unset($source);
+		$root = new HamlRootNode(array(
+			'format' => $this->format,
+			'style' => $this->style,
+			'attrWrapper' => $this->attrWrapper,
+			'minimizedAttributes' => $this->minimizedAttributes
+		));
+		$this->buildTree($root);
+		return $root;
+	}
+
+	/**
+	 * Builds a parse tree under the parent node.
+	 * @param HamlNode the parent node
+	 */
+	private function buildTree($parent) {
+		while (!empty($this->source) && $this->isChildOf($parent, $this->source[0])) {
+			$line = $this->getNextLine();
+			if (!empty($line)) {
+				$node = ($this->inFilter ?
+					new HamlNode($line[self::HAML_SOURCE], $parent) :
+					$this->parseLine($line, $parent));
+
+				if (!empty($node)) {
+					$node->token = $line;
+					$node->showOutput = $this->showOutput;
+					$node->showSource = $this->showSource;
+					$this->addChildren($node, $line);
+				}
+			}
+		}
+	}
+
+	/**
+	 * Adds children to a node if the current line has children.
+	 * @param HamlNode the node to add children to
+	 * @param array line to test
+	 */
+	private function addChildren($node, $line) {
+		if ($node instanceof HamlFilterNode) {
+			$this->inFilter = true;
+		}
+		if ($this->hasChild($line, $this->inFilter)) {
+			$this->buildTree($node);
+			if ($node instanceof HamlFilterNode) {
+				$this->inFilter = false;
+			}
+		}
+	}
+
+	/**
+	 * Returns a value indicating if the next line is a child of the parent line
+	 * @param array parent line
+	 * @param boolean whether to all greater than the current indent
+	 * Used if the source line is a comment or a filter.
+	 * If true all indented lines are regarded as children; if not the child line
+	 * must only be indented by 1 or blank. Defaults to false.
+	 * @return boolean true if the next line is a child of the parent line
+	 * @throws Exception if the indent is invalid
+	 */
+	private function hasChild($line, $allowGreater = false) {
+		if (!empty($this->source)) {
+			$i = 0;
+			$c = count($this->source);
+			while (empty($nextLine[self::HAML_SOURCE]) && $i <= $c) {
+				$nextLine = $this->source[$i++];
+			}
+
+			$level = $this->getLevel($nextLine, $line['line'] + $i);
+
+			if (($level == $line['level'] + 1) ||
+					($allowGreater && $level > $line['level'])) {
+				return true;
+			}
+			elseif ($level <= $line['level']) {
+				return false;
+			}
+			else {
+				throw new HamlException('Illegal indentation level ({level}); indentation level can only increase by one', array('{level}'=>$level), $this);
+			}
+		}
+		else {
+			return false;
+		}
+	}
+
+	/**
+	 * Returns a value indicating if $line is a child of a node.
+	 * A blank line is a child of a node.
+	 * @param HamlNode the node
+	 * @param array the line to check
+	 * @return boolean true if the line is a child of the node, false if not
+	 */
+	private function isChildOf($node, $line) {
+		$haml = trim($line[self::HAML_HAML]);
+		return empty($haml) || $this->getLevel($line, $this->line) >
+			$node->level;
+	}
+
+	/**
+	 * Determine the indent character and indent spaces.
+	 * The first character of the first indented line determines the character.
+	 * If this is a space the number of spaces determines the indentSpaces; this
+	 * is always 1 if the indent character is a tab.
+	 * @throws HamlException if the indent is mixed
+	 */
+	private function setIndentChar() {
+		foreach ($this->source as $l=>$source) {
+			if (!empty($source) && in_array($source[0], $this->indentChars)) {
+				$this->indentChar = $source[0];
+				for	($i = 0, $len = strlen($source); $i < $len && $source[$i] == $this->indentChar; $i++);
+				if ($i < $len && in_array($source[$i], $this->indentChars)) {
+					$this->line = ++$l;
+					$this->source = $source;
+					throw new HamlException('Mixed indentation not allowed', array(), $this);
+				}
+				$this->indentSpaces = ($this->indentChar == ' ' ? $i : 1);
+				return;
+			}
+		} // foreach
+		$this->indentChar = ' ';
+		$this->indentSpaces = 2;
+	}
+
+	/**
+	 * Gets the next line.
+	 * @param array remaining source lines
+	 * @return array the next line
+	 */
+	private function getNextLine() {
+		$line = array_shift($this->source);
+		// Blank lines ore OK
+		$haml =  trim($line[self::HAML_HAML]);
+		if (empty($haml)) {
+			$this->line++;
+			return null;
+		}
+		// The regex will strip off a '<' at the start of a line
+		if ($line[self::HAML_WHITESPACE_REMOVAL] ===
+				self::INNER_WHITESPACE_REMOVAL && empty($line[self::HAML_TAG])) {
+			$line[self::HAML_CONTENT] =
+				$line[self::HAML_WHITESPACE_REMOVAL].$line[self::HAML_TOKEN].$line[self::HAML_CONTENT];
+		}
+		// The regex treats lines starting with [.+] as an object reference; they are just content
+		if (!empty($line[self::HAML_OBJECT_REFERENCE]) && empty($line[self::HAML_TAG])) {
+			unset($line[self::HAML_OBJECT_REFERENCE]);
+			$line[self::HAML_CONTENT] = $line[self::HAML_SOURCE];
+		}
+		$line['line'] = $this->line++;
+		$line['level'] = $this->getLevel($line, $this->line);
+		$line['filename'] = $this->filename;
+		if ($this->isMultiline($line)) {
+			$line = $this->getMultiline($line);
+		}
+		return $line;
+	}
+
+	/**
+	 * Returns the indent level of the line.
+	 * @param array the line
+	 * @param integer line number
+	 * @return integer the indent level of the line
+	 * @throws Exception if the indent level is invalid
+	 */
+	private function getLevel($line, $n) {
+		if ($line[self::HAML_INDENT] && $this->indentChar === ' ') {
+			$indent = strlen($line[self::HAML_INDENT]) / $this->indentSpaces;
+		}
+		else {
+			$indent = strlen($line[self::HAML_INDENT]);
+		}
+
+		if (!is_integer($indent) ||
+				preg_match("/[^{$this->indentChar}]/", $line[self::HAML_INDENT])) {
+			throw new HamlException('Invalid indentation', array(), $this);
+		}
+		return $indent;
+	}
+
+	/**
+	 * Parse a line of Haml into a HamlNode for the document tree
+	 * @param array line to parse
+	 * @param HamlNode parent node
+	 * @return HamlNode
+	 */
+	private function parseLine($line, $parent) {
+		if ($this->isHamlComment($line)) {
+			return $this->parseHamlComment($line);
+		}
+		elseif ($this->isXmlComment($line)) {
+			return $this->parseXmlComment($line, $parent);
+		}
+		elseif ($this->isElement($line)) {
+			return $this->parseElement($line, $parent);
+		}
+		elseif ($this->isHelper($line)) {
+			return $this->parseHelper($line, $parent);
+		}
+		elseif ($this->isCode($line)) {
+			return $this->parseCode($line, $parent);
+		}
+		elseif ($this->isDirective($line)) {
+			return $this->parseDirective($line, $parent);
+		}
+		elseif ($this->isFilter($line)) {
+			return $this->parseFilter($line, $parent);
+		}
+		elseif ($this->isDoctype($line)) {
+			return $this->parseDoctype($line, $parent);
+		}
+		else {
+			return $this->parseContent($line, $parent);
+		}
+	}
+
+	/**
+	 * Return a value indicating if the line has content.
+	 * @param array line
+	 * @return boolean true if the line has a content, false if not
+	 */
+	private function hasContent($line) {
+	  return !empty($line[self::HAML_CONTENT]);
+	}
+
+	/**
+	 * Return a value indicating if the line is code to be run.
+	 * @param array line
+	 * @return boolean true if the line is code to be run, false if not
+	 */
+	private function isCode($line) {
+		return $line[self::HAML_TOKEN] === self::RUN_CODE;
+	}
+
+	/**
+	 * Return a value indicating if the line is a directive.
+	 * @param array line
+	 * @return boolean true if the line is a directive, false if not
+	 */
+	private function isDirective($line) {
+		return $line[self::HAML_TOKEN] === self::DIRECTIVE;
+	}
+
+	/**
+	 * Return a value indicating if the line is a doctype.
+	 * @param array line
+	 * @return boolean true if the line is a doctype, false if not
+	 */
+	private function isDoctype($line) {
+		return $line[self::HAML_TOKEN] === self::DOCTYPE;
+	}
+
+	/**
+	 * Return a value indicating if the line is an element.
+	 * Will set the tag to div if it is an implied div.
+	 * @param array line
+	 * @return boolean true if the line is an element, false if not
+	 */
+	private function isElement(&$line) {
+		if (empty($line[self::HAML_TAG]) && (
+				!empty($line[self::HAML_CLASS]) ||
+				!empty($line[self::HAML_ID]) ||
+				!empty($line[self::HAML_XML_ATTRIBUTES]) ||
+				!empty($line[self::HAML_RUBY_ATTRIBUTES]) ||
+				!empty($line[self::HAML_OBJECT_REFERENCE])
+		)) {
+			$line[self::HAML_TAG] = 'div';
+		}
+
+	  return !empty($line[self::HAML_TAG]);
+	}
+
+	/**
+	 * Return a value indicating if the line starts a filter.
+	 * @param array line to test
+	 * @return boolean true if the line starts a filter, false if not
+	 */
+	private function isFilter($line) {
+	  return !empty($line[self::HAML_FILTER]);
+	}
+
+	/**
+	 * Return a value indicating if the line is a Haml comment.
+	 * @param array line to test
+	 * @return boolean true if the line is a Haml comment, false if not
+	 */
+	private function isHamlComment($line) {
+		return preg_match(self::HAML_COMMENT, $line[self::HAML_TOKEN]) > 0;
+	}
+
+	/**
+	 * Return a value indicating if the line is a HamlHelper.
+	 * @param array line to test
+	 * @return boolean true if the line is a HamlHelper, false if not
+	 */
+	private function isHelper($line) {
+		return (preg_match(HamlHelperNode::MATCH, $line[self::HAML_CONTENT], $matches)
+			? method_exists($this->helperClass, $matches[HamlHelperNode::NAME]) : false);
+	}
+
+	/**
+	 * Return a value indicating if the line is an XML comment.
+	 * @param array line to test
+	 * @return boolean true if theline is an XML comment, false if not
+	 */
+	private function isXmlComment($line) {
+	  return $line[self::HAML_SOURCE][0] === self::XML_COMMENT;
+	}
+
+	/**
+	 * Returns a value indicating whether the line is part of a multilne group
+	 * @param array the line to test
+	 * @return boolean true if the line os part of a multiline group, false if not
+	 */
+	private function isMultiline($line) {
+	  return substr($line[self::HAML_SOURCE], -2) === self::MULTILINE;
+	}
+
+	/**
+	 * Return a value indicating if the line's tag is a block level tag.
+	 * @param array line
+	 * @return boolean true if the line's tag is is a block level tag, false if not
+	 */
+	private function isBlock($line) {
+	  return (!in_array($line[self::HAML_TAG], $this->inlineTags));
+	}
+
+	/**
+	 * Return a value indicating if the line's tag is self-closing.
+	 * @param array line
+	 * @return boolean true if the line's tag is self-closing, false if not
+	 */
+	private function isSelfClosing($line) {
+	  return (in_array($line[self::HAML_TAG], $this->emptyTags) ||
+	  	$line[self::HAML_TOKEN] == self::SELF_CLOSE_TAG);
+	}
+
+	/**
+	 * Gets a filter.
+	 * Filters are loaded on first use.
+	 * @param string filter name
+	 * @throws HamlException if the filter does not exist or does not extend HamlBaseFilter
+	 */
+	private function getFilter($filter) {
+		static $firstRun = true;
+		$imported = false;
+		
+		if (empty($this->filters[$filter])) {
+			if ($firstRun) {
+				require_once('filters/HamlBaseFilter.php');
+				$firstRun = false;
+			}
+
+			$filterclass = 'Haml' . ucfirst($filter) . 'Filter';
+			if (isset($this->filterDir)) {
+				$this->filterDir = (substr($this->filterDir, -1) == DIRECTORY_SEPARATOR?
+						substr($this->filterDir, 0, -1):$this->filterDir);
+				if (file_exists($this->filterDir.DIRECTORY_SEPARATOR."$filterclass.php")) {
+					require_once($this->filterDir.DIRECTORY_SEPARATOR."$filterclass.php");
+					$imported = true; 
+				}
+			}
+
+			if (!$imported && file_exists(dirname(__FILE__).DIRECTORY_SEPARATOR.'filters'.DIRECTORY_SEPARATOR."$filterclass.php")) {
+				require_once("filters/$filterclass.php");
+				$imported = true; 
+			}
+			
+			if (!$imported) {
+				throw new HamlException('Unable to find {what}: {filename}', array('{what}'=>$filter.' filter', '{filename}'=>$filterclass.'.php'), $this);
+			}
+			
+			$this->filters[$filter] = new $filterclass();
+
+			if (!($this->filters[$filter] instanceof HamlBaseFilter)) {
+				throw new HamlException('{what} must extend {base} class', array('{what}'=>$filter, '{base}'=>'HamlBaseFilter'), $this);
+			}
+
+			$this->filters[$filter]->init();
+		}
+		return $this->filters[$filter];
+	}
+
+	/**
+	 * Gets the next line.
+	 * @param array first line
+	 * @return array the next line
+	 */
+	private function getMultiline($line) {
+		do {
+			$multiLine = array_shift($this->source);
+			$line[self::HAML_CONTENT] .= substr($multiLine[self::HAML_SOURCE], 0, -2);
+		} while(!empty($this->source) && $this->isMultiline($this->source[0]));
+	  return $line;
+	}
+
+	/**
+	 * Parse attributes.
+	 * @param array line to parse
+	 * @return array attributes in name=>value pairs
+	 */
+	private function parseAttributes($line) {
+		$attributes = array();
+		if (!empty($line[self::HAML_OPEN_XML_ATTRIBUTES])) {
+			if (empty($line[self::HAML_XML_ATTRIBUTES])) {
+				$line[self::HAML_XML_ATTRIBUTES] = $line[self::HAML_CONTENT];
+				unset($line[self::HAML_CONTENT]);
+				do {
+					$multiLine = array_shift($this->source);
+					$line[self::HAML_XML_ATTRIBUTES] .= $multiLine[self::HAML_CONTENT];
+				}	while (substr($line[self::HAML_XML_ATTRIBUTES], -1) !==
+						self::CLOSE_XML_ATTRIBUTES);		
+			}
+			if (preg_match(self::HTML_ATTRS, $line[self::HAML_XML_ATTRIBUTES], $htmlAttrs)) {
+				$line[self::HAML_XML_ATTRIBUTES] = preg_replace(self::HTML_ATTRS, '', $line[self::HAML_XML_ATTRIBUTES]);
+				$attributes = array_merge($attributes, $this->htmlAttrs($htmlAttrs));			
+			}
+			$attributes = array_merge(
+					$attributes,
+					$this->parseAttributeHash($line[self::HAML_XML_ATTRIBUTES])
+			);
+		}
+		if (!empty($line[self::HAML_OPEN_RUBY_ATTRIBUTES])) {
+			if (empty($line[self::HAML_RUBY_ATTRIBUTES])) {
+				$line[self::HAML_RUBY_ATTRIBUTES] = $line[self::HAML_CONTENT];
+				unset($line[self::HAML_CONTENT]);
+				do {
+					$multiLine = array_shift($this->source);
+					$line[self::HAML_RUBY_ATTRIBUTES] .= $multiLine[self::HAML_CONTENT];
+				}	while (substr($line[self::HAML_RUBY_ATTRIBUTES], -1) !==
+						self::CLOSE_RUBY_ATTRIBUTES);		
+			}
+			if (preg_match(self::HTML_ATTRS, $line[self::HAML_RUBY_ATTRIBUTES], $htmlAttrs)) {
+				$line[self::HAML_RUBY_ATTRIBUTES] = preg_replace(self::HTML_ATTRS, '', $line[self::HAML_RUBY_ATTRIBUTES]);
+				$attributes = array_merge($attributes, $this->htmlAttrs($htmlAttrs));			
+			}
+			$attributes = array_merge(
+					$attributes,
+					$this->parseAttributeHash($line[self::HAML_RUBY_ATTRIBUTES])
+			);
+		}
+		if (!empty($line[self::HAML_OBJECT_REFERENCE])) {
+			$objectRef = explode(',', preg_replace('/,\s*/', ',', $line[self::HAML_OBJECT_REFERENCE]));
+			$prefix = (isset($objectRef[1]) ? $objectRef[1] . '_' : '');
+			$class = "strtolower(str_replace(' ',	'_', preg_replace('/(?<=\w)([ A-Z])/', '_\1', get_class(" . $objectRef[0] . '))))';
+			$attributes['class'] = "<?php echo '$prefix' . $class; ?>";
+			$attributes['id'] = "<?php echo '$prefix' . $class . '_' . {$objectRef[0]}->id; ?>";
+		}
+		else {
+			if (!empty($line[self::HAML_CLASS])) {
+				$classes = explode('.', $line[self::HAML_CLASS]);
+				foreach ($classes as &$class) {
+					if (preg_match(self::MATCH_INTERPOLATION, $class)) {
+						$class = $this->interpolate($class);
+					}
+				} // foreach
+				$attributes['class'] = join(' ', $classes) .
+						(isset($attributes['class']) ? " {$attributes['class']}" : '');
+			}
+			if (!empty($line[self::HAML_ID])) {
+				$attributes['id'] =
+						(preg_match(self::MATCH_INTERPOLATION, $line[self::HAML_ID]) ?
+						$this->interpolate($line[self::HAML_ID]) : $line[self::HAML_ID]) .
+						(isset($attributes['id']) ? "_{$attributes['id']}" : '');
+			}
+		}
+
+		ksort($attributes, SORT_STRING);
+	  return $attributes;
+	}
+
+	/**
+	 * Parse attributes.
+	 * @param string the attributes
+	 * @return array attributes in name=>value pairs
+	 */
+	private function parseAttributeHash($subject) {
+		$subject = substr($subject, 0, -1);
+ 		$attributes = array();
+		if (preg_match(self::REGEX_ATTRIBUTE_FUNCTION, $subject)) {
+			$attributes[0] = "<?php echo $subject; ?>";
+			return $attributes;
+		}
+		
+		preg_match_all(self::REGEX_ATTRIBUTES, $subject, $attrs, PREG_SET_ORDER);
+		foreach ($attrs as $attr) {
+			if (!empty($attr[1])) { // HTML5 Custom Data Attributes
+				$dataAttributes = $this->parseAttributeHash(substr($attr[2], 1));
+				foreach ($dataAttributes as $key=>$value) {
+					$attributes["data-$key"] = $value;				
+				} // foreach
+			}
+			elseif (!empty($attr[4])) {
+				$values = array_map('trim', explode(',', $attr[4]));
+				if ($attr[3] !== 'class' && $attr[3] !== 'id') {
+					throw new HamlException('Attribute must be "class" or "id" with array value', array(), $this);
+				}
+				$attributes[$attr[3]] = '<?php echo ' . join(($attr[3] === 'id' ? ".'_'." : ".' '."), $values) . '; ?>';
+			}
+			elseif (!empty($attr[6])) {
+				$attributes[$attr[3]] = $this->interpolate($attr[6]);
+			}
+			elseif ($attr[6] === '') {
+				$attributes[$attr[3]] = $attr[6];
+			}
+			else {
+				switch ($attr[7]) {
+					case 'true':
+						$attributes[$attr[3]] = $attr[3];
+						break;
+					case 'false':
+						break;
+					default:
+						$attributes[$attr[3]] = "<?php echo {$attr[7]}; ?>";
+						break;
+				}
+			}
+		} // foreach
+		return $attributes;
+	}
+	
+	/**
+	 * Returns an array of attributes for the html element.
+	 * @param array arguments for HamlHelpers::html_attrs 
+	 * @return array attributes for the html element
+	 */
+	private function htmlAttrs($htmlAttrs) {
+		if (empty($htmlAttrs[1]) && empty($htmlAttrs[2])) {
+			return HamlHelpers::html_attrs();
+		}
+		else {
+			$htmlAttrs[1] = substr($htmlAttrs[1], 1, -1);
+			if (substr($htmlAttrs[1], -1) == ';') {
+				$htmlAttrs[1] = eval("return {$htmlAttrs[1]}");
+			}
+			if (isset($htmlAttrs[2])) {
+				return HamlHelpers::html_attrs($htmlAttrs[1], eval($htmlAttrs[2] . ';'));
+			}
+			else {
+				return HamlHelpers::html_attrs($htmlAttrs[1]);
+			}
+		}
+	}
+	
+	/**
+	 * Parse code
+	 * @param array line to parse
+	 * @param HamlNode parent node
+	 * @return HamlCodeBlockNode
+	 */
+	private function parseCode($line, $parent) {
+		if (preg_match('/^(if|foreach|for|switch|do|while)\b(.*)$/',
+				$line[self::HAML_CONTENT], $block)) {
+			if ($block[1] === 'do') {
+				$node = new HamlCodeBlockNode('<?php do { ?>', $parent);
+				$node->doWhile = 'while' . $block[2] . ';';
+			}
+			elseif ($block[1] === 'switch') {
+				$node = new HamlCodeBlockNode("<?php {$line[self::HAML_CONTENT]} {", $parent);
+			}
+			else {
+				$node = new HamlCodeBlockNode("<?php {$line[self::HAML_CONTENT]} { ?>", $parent);
+			}
+		}
+		elseif (strpos($line[self::HAML_CONTENT], 'else') === 0) {
+			$node = new HamlCodeBlockNode("<?php } {$line[self::HAML_CONTENT]} { ?>", null);
+			$node->token = $line;
+			$node->showOutput = $this->showOutput;
+			$node->showSource = $this->showSource;
+			$parent->getLastChild()->addElse($node);
+			$this->addChildren($node, $line);
+			$node = null;
+		}
+		elseif (strpos($line[self::HAML_CONTENT], 'case') === 0) {
+			$node = new HamlNode(($parent->hasChildren() ? '<?php ' : '') .
+					"{$line[self::HAML_CONTENT]}: ?>", $parent);
+		}
+		else {
+			$node = new HamlNode("<?php {$line[self::HAML_CONTENT]}; ?>", $parent);
+		}
+		return $node;
+	}
+
+	/**
+	 * Parse content
+	 * @param array line to parse
+	 * @param HamlNode parent node
+	 * @return HamlNode
+	 */
+	private function parseContent($line, $parent) {
+		switch ($line[self::HAML_TOKEN]) {
+		  case self::INSERT_CODE:
+		  	$content = ($this->suppressEval ? '' :
+						'<?php echo ' . ($this->escapeHtml ?
+						'htmlentities(' . $line[self::HAML_CONTENT] . ')' :
+						$line[self::HAML_CONTENT]) .
+						"; ?>" .
+						($this->style == HamlRenderer::STYLE_EXPANDED ||
+							$this->style == HamlRenderer::STYLE_NESTED ? "\n" : ''));
+		    break;
+		  case self::INSERT_CODE_PRESERVE_WHITESPACE:
+				$content = ($this->suppressEval ? '' :
+						'<?php echo str_replace("\n", \'&#x000a\', ' . ($this->escapeHtml ?
+						'htmlentities(' . $line[self::HAML_CONTENT] . ')' :
+						$line[self::HAML_CONTENT]) .
+						"; ?>" .
+						($this->style == HamlRenderer::STYLE_EXPANDED ||
+							$this->style == HamlRenderer::STYLE_NESTED ? "\n" : ''));
+		    break;
+		  default:
+		  	$content = $line[self::HAML_CONTENT];
+		    break;
+		} // switch
+
+	  return new HamlNode($this->interpolate($content), $parent);
+	}
+
+	/**
+	 * Parse a directive.
+	 * Various options are set according to the directive
+	 * @param array line to parse
+	 * @return null
+	 */
+	private function parseDirective($line) {
+		preg_match('/(\w+)(\+|-)?/', $line[self::HAML_CONTENT], $matches);
+		switch ($matches[1]) {
+		  case 's':
+		  	$this->showSource = ($matches[2] == '+' ? true :
+		  		($matches[2] == '-' ? false : $this->showSource));
+		    break;
+		  case 'o':
+		  	$this->showOutput = ($matches[2] == '+' ? true :
+		  		($matches[2] == '-' ? false : $this->showOutput));
+		    break;
+		  case 'os':
+		  case 'so':
+		  	$this->showSource = ($matches[2] == '+' ? true :
+		  		($matches[2] == '-' ? false : $this->showSource));
+		  	$this->showOutput = ($matches[2] == '+' ? true :
+		  		($matches[2] == '-' ? false : $this->showOutput));
+		    break;
+		  default:
+		  	if (!in_array($matches[1], $this->styles)) {
+					throw new HamlException('Invalid {what} ({value})', array('{what}'=>'directive', '{value}'=>self::DIRECTIVE.$matches[0]), $this);
+		  	}
+		  	$this->style = $matches[1];
+		    break;
+		} // switch
+	}
+
+	/**
+	 * Parse a doctype declaration
+	 * @param array line to parse
+	 * @param HamlNode parent node
+	 * @return HamlDoctypeNode
+	 */
+	private function parseDoctype($line, $parent) {
+		$content = explode(' ', $line[self::HAML_CONTENT]);
+		if (!empty($content)) {
+			if ($content[0] === self::IS_XML_PROLOG) {
+				$encoding = isset($content[1]) ? $content[1] : self::DEFAULT_XML_ENCODING;
+				$output = str_replace(self::XML_ENCODING, $encoding, self::XML_PROLOG);
+			}
+			elseif (empty($content[0])) {
+				$output = $this->doctypes[$this->format][0];
+			}
+			elseif (array_key_exists($content[0],
+					$this->doctypes[$this->format])) {
+				$output = $this->doctypes[$this->format][$content[0]];
+			}
+			elseif (!empty($this->doctype)) {
+				$output = $this->doctype;				
+			}
+			else {
+				$_doctypes = array_keys($this->doctypes[$this->format]);
+				array_shift($_doctypes);
+				throw new HamlException('Invalid {what} ({value}); must be one of "{options}"', array('{what}'=>'doctype', '{value}'=>$content[0], '{options}'=>join(', ', $_doctypes).' or empty'), $this);
+			}
+		}
+		return new HamlDoctypeNode($output, $parent);
+	}
+
+	/**
+	 * Parse a Haml comment.
+	 * If the comment is an empty comment eat all child lines.
+	 * @param array line to parse
+	 */
+	private function parseHamlComment($line) {
+		if (!$this->hasContent($line)) {
+			while ($this->hasChild($line, true)) {
+				array_shift($this->source);
+				$this->line++;
+			}
+		}
+	}
+
+	/**
+	 * Parse a HamlHelper.
+	 * @param array line to parse
+	 * @param HamlNode parent node
+	 * @return HamlHelperNode
+	 */
+	private function parseHelper($line, $parent) {
+		preg_match(HamlHelperNode::MATCH, $line[self::HAML_CONTENT], $matches);
+		$node = new HamlHelperNode($this->helperClass, $matches[HamlHelperNode::PRE], $matches[HamlHelperNode::NAME], $matches[HamlHelperNode::ARGS], $parent);
+		if (isset($matches[HamlHelperNode::BLOCK])) {
+			new HamlNode($matches[HamlHelperNode::BLOCK], $node);
+		}
+		return $node;
+	}
+
+	/**
+	 * Parse an element.
+	 * @param array line to parse
+	 * @param HamlNode parent node
+	 * @return HamlElementNode tag node and children
+	 */
+	private function parseElement($line, $parent) {
+		$node = new HamlElementNode($line[self::HAML_TAG], $parent);
+		$node->isSelfClosing = $this->isSelfClosing($line);
+		$node->isBlock = $this->isBlock($line);
+		$node->attributes = $this->parseAttributes($line);
+		if ($this->hasContent($line)) {
+			$child = $this->parseContent($line, $node);
+			$child->showOutput = $this->showOutput;
+			$child->showSource = $this->showSource;
+			$child->token = array(
+				self::HAML_SOURCE => $line[self::HAML_SOURCE],
+				'filename' => $line['filename'],
+				'line' => $line['line'],
+				'level' => ($line['level'] + 1)
+			);
+		}
+		$node->whitespaceControl = $this->parseWhitespaceControl($line);
+	  return $node;
+	}
+
+	/**
+	 * Parse a filter.
+	 * @param array line to parse
+	 * @param HamlNode parent node
+	 * @return HamlNode filter node
+	 */
+	private function parseFilter($line, $parent) {
+		$node = new HamlFilterNode($this->getFilter($line[self::HAML_FILTER]), $parent);
+		if ($this->hasContent($line)) {
+			$child = $this->parseContent($line);
+			$child->showOutput = $this->showOutput;
+			$child->showSource = $this->showSource;
+			$child->token = array(
+				'level' => ($line['level'] + 1),
+				'line' => $line['line']
+			);
+		}
+	  return $node;
+	}
+
+	/**
+	 * Parse an Xml comment.
+	 * @param array line to parse
+	 * @param HamlNode parent node
+	 * @return HamlCommentNode
+	 */
+	private function parseXmlComment($line, $parent) {
+		return new HamlCommentNode($line[self::HAML_CONTENT], $parent);
+	}
+
+	private function parseWhitespaceControl($line) {
+		$whitespaceControl = array('inner' => false, 'outer' => array('left' => false, 'right' => false));
+
+		if (!empty($line[self::HAML_WHITESPACE_REMOVAL])) {
+			$whitespaceControl['inner'] =
+					(strpos($line[self::HAML_WHITESPACE_REMOVAL],
+					self::INNER_WHITESPACE_REMOVAL) !== false);
+
+			if (strpos($line[self::HAML_WHITESPACE_REMOVAL],
+					self::OUTER_WHITESPACE_REMOVAL) !== false) {
+				$whitespaceControl['outer']['left'] =
+						(strpos($line[self::HAML_WHITESPACE_REMOVAL],
+						self::BLOCK_LEFT_OUTER_WHITESPACE_REMOVAL) === false);
+				$whitespaceControl['outer']['right'] =
+						(strpos($line[self::HAML_WHITESPACE_REMOVAL],
+						self::BLOCK_RIGHT_OUTER_WHITESPACE_REMOVAL) === false);
+			}
+		}
+	  return $whitespaceControl;
+	}
+
+	/**
+	 * Replace interpolated PHP contained in '#{}'.
+	 * @param string the text to interpolate
+	 * @return string the interpolated text
+	 */
+	protected function interpolate($string) {
+	  return preg_replace(self::MATCH_INTERPOLATION, self::INTERPOLATE, $string);
+	}
+}

lib/sass/haml/filters/HamlBaseFilter.php

@@ -0,0 +1,30 @@
+<?php
+/* SVN FILE: $Id: HamlBaseFilter.php 49 2010-04-04 10:51:24Z chris.l.yates $ */
+/**
+ * Base Filter for {@link http://haml-lang.com/ Haml} class file.
+ * @author			Chris Yates <chris.l.yates@gmail.com>
+ * @copyright		Copyright (c) 2010 PBM Web Development
+ * @license			http://phamlp.googlecode.com/files/license.txt
+ * @package			PHamlP
+ * @subpackage	Haml.filters
+ */
+
+/**
+ * Base Filter for {@link http://haml-lang.com/ Haml} class.
+ * This class must be extended and the run() method overridden.
+ * @package			PHamlP
+ * @subpackage	Haml.filters
+ */
+abstract class HamlBaseFilter {
+	/**
+	 * Initialise the filter.
+	 */
+	public function init() {}
+
+	/**
+	 * Run the filter.
+	 * This method must be overridden in child classes.
+	 * @param string text to filter
+	 */
+	abstract public function run($text);
+}

lib/sass/haml/filters/HamlCdataFilter.php

@@ -0,0 +1,29 @@
+<?php
+/* SVN FILE: $Id: HamlCdataFilter.php 49 2010-04-04 10:51:24Z chris.l.yates $ */
+/**
+ * CDATA Filter for {@link http://haml-lang.com/ Haml} class file.
+ * @author			Chris Yates <chris.l.yates@gmail.com>
+ * @copyright		Copyright (c) 2010 PBM Web Development
+ * @license			http://phamlp.googlecode.com/files/license.txt
+ * @package			PHamlP
+ * @subpackage	Haml.filters
+ */
+
+/**
+ * CDATA Filter for {@link http://haml-lang.com/ Haml} class.
+ * Surrounds the filtered text with CDATA tags.
+ * @package			PHamlP
+ * @subpackage	Haml.filters
+ */
+class HamlCdataFilter extends HamlBaseFilter {
+	/**
+	 * Run the filter
+	 * @param string text to filter
+	 * @return string filtered text
+	 */
+	public function run($text) {
+	  return "<![CDATA[\n" .
+	  	preg_replace(HamlParser::MATCH_INTERPOLATION, '<?php echo \1; ?>', $text) .
+	  	"  ]]>\n";
+	}
+}

lib/sass/haml/filters/HamlCssFilter.php

@@ -0,0 +1,30 @@
+<?php
+/* SVN FILE: $Id: HamlCssFilter.php 99 2010-06-13 14:12:08Z chris.l.yates $ */
+/**
+ * CSS Filter for {@link http://haml-lang.com/ Haml} class file.
+ * @author			Chris Yates <chris.l.yates@gmail.com>
+ * @copyright		Copyright (c) 2010 PBM Web Development
+ * @license			http://phamlp.googlecode.com/files/license.txt
+ * @package			PHamlP
+ * @subpackage	Haml.filters
+ */
+
+/**
+ * CSS Filter for {@link http://haml-lang.com/ Haml} class.
+ * Surrounds the filtered text with <style> and CDATA tags.
+ * Useful for including inline CSS.
+ * @package			PHamlP
+ * @subpackage	Haml.filters
+ */
+class HamlCssFilter extends HamlBaseFilter {
+	/**
+	 * Run the filter
+	 * @param string text to filter
+	 * @return string filtered text
+	 */
+	public function run($text) {
+	  return "<style type=\"text/css\">\n/*<![CDATA[*/\n" .
+	  	preg_replace(HamlParser::MATCH_INTERPOLATION, '<?php echo \1; ?>', $text) .
+	  	"/*]]>*/\n</style>\n";
+	}
+}

lib/sass/haml/filters/HamlEscapedFilter.php

@@ -0,0 +1,32 @@
+<?php
+/* SVN FILE: $Id: HamlEscapedFilter.php 49 2010-04-04 10:51:24Z chris.l.yates $ */
+/**
+ * Escaped Filter for {@link http://haml-lang.com/ Haml} class file.
+ * @author			Chris Yates <chris.l.yates@gmail.com>
+ * @copyright		Copyright (c) 2010 PBM Web Development
+ * @license			http://phamlp.googlecode.com/files/license.txt
+ * @package			PHamlP
+ * @subpackage	Haml.filters
+ */
+
+/**
+ * Escaped Filter for {@link http://haml-lang.com/ Haml} class.
+ * Escapes the text.
+ * Code to be interpolated can be included by wrapping it in #().
+ * @package			PHamlP
+ * @subpackage	Haml.filters
+ */
+class HamlEscapedFilter extends HamlBaseFilter {
+	/**
+	 * Run the filter
+	 * @param string text to filter
+	 * @return string filtered text
+	 */
+	public function run($text) {
+	  return preg_replace(
+	  	HamlParser::MATCH_INTERPOLATION,
+	  	'<?php echo htmlspecialchars($text); ?>',
+	  	htmlspecialchars($text)
+	  ) . "\n";
+	}
+}

lib/sass/haml/filters/HamlJavascriptFilter.php

@@ -0,0 +1,31 @@
+<?php
+/* SVN FILE: $Id: HamlJavascriptFilter.php 49 2010-04-04 10:51:24Z chris.l.yates $ */
+/**
+ * Javascript Filter for {@link http://haml-lang.com/ Haml} class file.
+ * @author			Chris Yates <chris.l.yates@gmail.com>
+ * @copyright		Copyright (c) 2010 PBM Web Development
+ * @license			http://phamlp.googlecode.com/files/license.txt
+ * @package			PHamlP
+ * @subpackage	Haml.filters
+ */
+
+/**
+ * Javascript Filter for {@link http://haml-lang.com/ Haml} class.
+ * Surrounds the filtered text with <script> and CDATA tags.
+ * Useful for including inline Javascript.
+ * Code to be interpolated can be included by wrapping it in #().
+ * @package			PHamlP
+ * @subpackage	Haml.filters
+ */
+class HamlJavascriptFilter extends HamlBaseFilter {
+	/**
+	 * Run the filter
+	 * @param string text to filter
+	 * @return string filtered text
+	 */
+	public function run($text) {
+	  return "<script type=\"text/javascript\">\n  //<![CDATA[\n" .
+	  	preg_replace(HamlParser::MATCH_INTERPOLATION, '<?php echo \1; ?>', $text) .
+	  	"  //]]>\n</script>\n";
+	}
+}

lib/sass/haml/filters/HamlPhpFilter.php

@@ -0,0 +1,27 @@
+<?php
+/* SVN FILE: $Id: HamlPhpFilter.php 49 2010-04-04 10:51:24Z chris.l.yates $ */
+/**
+ * PHP Filter for {@link http://haml-lang.com/ Haml} class file.
+ * @author			Chris Yates <chris.l.yates@gmail.com>
+ * @copyright		Copyright (c) 2010 PBM Web Development
+ * @license			http://phamlp.googlecode.com/files/license.txt
+ * @package			PHamlP
+ * @subpackage	Haml.filters
+ */
+
+/**
+ * PHP Filter for {@link http://haml-lang.com/ Haml} class.
+ * The text will be parsed with the PHP interpreter.
+ * @package			PHamlP
+ * @subpackage	Haml.filters
+ */
+class HamlPhpFilter extends HamlBaseFilter {
+	/**
+	 * Run the filter
+	 * @param string text to filter
+	 * @return string filtered text
+	 */
+	public function run($text) {
+	  return "<?php\n$text?>\n";
+	}
+}

lib/sass/haml/filters/HamlPlainFilter.php

@@ -0,0 +1,28 @@
+<?php
+/* SVN FILE: $Id: HamlPlainFilter.php 49 2010-04-04 10:51:24Z chris.l.yates $ */
+/**
+ * Plain Filter for {@link http://haml-lang.com/ Haml} class file.
+ * @author			Chris Yates <chris.l.yates@gmail.com>
+ * @copyright		Copyright (c) 2010 PBM Web Development
+ * @license			http://phamlp.googlecode.com/files/license.txt
+ * @package			PHamlP
+ * @subpackage	Haml.filters
+ */
+
+/**
+ * Plain Filter for {@link http://haml-lang.com/ Haml} class.
+ * Does not parse the filtered text. This is useful for large blocks of text
+ * without HTML tags when lines are not to be parsed.
+ * @package			PHamlP
+ * @subpackage	Haml.filters
+ */
+class HamlPlainFilter extends HamlBaseFilter {
+	/**
+	 * Run the filter
+	 * @param string text to filter
+	 * @return string filtered text
+	 */
+	public function run($text) {
+	  return preg_replace(HamlParser::MATCH_INTERPOLATION, '<?php echo \1; ?>', $text). "\n";
+	}
+}

lib/sass/haml/filters/HamlPreserveFilter.php

@@ -0,0 +1,29 @@
+<?php
+/* SVN FILE: $Id: HamlPreserveFilter.php 103 2010-08-06 10:15:55Z chris.l.yates@gmail.com $ */
+/**
+ * Preserve Filter for {@link http://haml-lang.com/ Haml} class file.
+ * @author			Chris Yates <chris.l.yates@gmail.com>
+ * @copyright		Copyright (c) 2010 PBM Web Development
+ * @license			http://phamlp.googlecode.com/files/license.txt
+ * @package			PHamlP
+ * @subpackage	Haml.filters
+ */
+
+/**
+ * Preserve Filter for {@link http://haml-lang.com/ Haml} class.
+ * Does not parse the filtered text and preserves line breaks.
+ * @package			PHamlP
+ * @subpackage	Haml.filters
+ */
+class HamlPreserveFilter extends HamlBaseFilter {
+	/**
+	 * Run the filter
+	 * @param string text to filter
+	 * @return string filtered text
+	 */
+	public function run($text) {
+	  return str_replace("\n", '&#x000a;',
+	  	preg_replace(HamlParser::MATCH_INTERPOLATION, '<?php echo \1; ?>', $text)
+	  ) . "\n";
+	}
+}

lib/sass/haml/filters/HamlSassFilter.php

@@ -0,0 +1,37 @@
+<?php
+/* SVN FILE: $Id: HamlSassFilter.php 49 2010-04-04 10:51:24Z chris.l.yates $ */
+/**
+ * {@link Sass http://sass-lang.com/} Filter for
+ * {@link http://haml-lang.com/ Haml} class file.
+ * @author			Chris Yates <chris.l.yates@gmail.com>
+ * @copyright		Copyright (c) 2010 PBM Web Development
+ * @license			http://phamlp.googlecode.com/files/license.txt
+ * @package			PHamlP
+ * @subpackage	Haml.filters
+ */
+
+require_once('HamlCssFilter.php');
+require_once(dirname(__FILE__).'/../../sass/SassParser.php');
+
+/**
+ * {@link Sass http://sass-lang.com/} Filter for
+ * {@link http://haml-lang.com/ Haml} class.
+ * Parses the text as Sass then calls the CSS filter.
+ * Useful for including inline Sass.
+ * @package			PHamlP
+ * @subpackage	Haml.filters
+ */
+class HamlSassFilter extends HamlBaseFilter {
+	/**
+	 * Run the filter
+	 * @param string text to filter
+	 * @return string filtered text
+	 */
+	public function run($text) {
+		$sass = new SassParser();
+		$css = new HamlCssFilter();
+		$css->init();
+
+		return $css->run($sass->toCss(preg_replace(HamlParser::MATCH_INTERPOLATION, '<?php echo \1; ?>', $text), false));
+	}
+}

lib/sass/haml/filters/HamlScssFilter.php

@@ -0,0 +1,37 @@
+<?php
+/* SVN FILE: $Id: HamlSassFilter.php 49 2010-04-04 10:51:24Z chris.l.yates $ */
+/**
+ * {@link Scss http://sass-lang.com/} Filter for
+ * {@link http://haml-lang.com/ Haml} class file.
+ * @author			Chris Yates <chris.l.yates@gmail.com>
+ * @copyright		Copyright (c) 2010 PBM Web Development
+ * @license			http://phamlp.googlecode.com/files/license.txt
+ * @package			PHamlP
+ * @subpackage	Haml.filters
+ */
+
+require_once('HamlCssFilter.php');
+require_once(dirname(__FILE__).'/../../sass/SassParser.php');
+
+/**
+ * {@link Sass http://sass-lang.com/} Filter for
+ * {@link http://haml-lang.com/ Haml} class.
+ * Parses the text as Sass then calls the CSS filter.
+ * Useful for including inline Sass.
+ * @package			PHamlP
+ * @subpackage	Haml.filters
+ */
+class HamlScssFilter extends HamlBaseFilter {
+	/**
+	 * Run the filter
+	 * @param string text to filter
+	 * @return string filtered text
+	 */
+	public function run($text) {
+		$sass = new SassParser(array('syntax'=>'scss'));
+		$css = new HamlCssFilter();
+		$css->init();
+
+		return $css->run($sass->toCss(preg_replace(HamlParser::MATCH_INTERPOLATION, '<?php echo \1; ?>', $text), false));
+	}
+}

lib/sass/haml/filters/_HamlMarkdownFilter.php

@@ -0,0 +1,50 @@
+<?php
+/* SVN FILE: $Id: _HamlMarkdownFilter.php 51 2010-04-14 12:05:03Z chris.l.yates $ */
+/**
+ * Markdown Filter for {@link http://haml-lang.com/ Haml} class file.
+ * This filter is an abstract filter that must be extended.
+ * 
+ * @author			Chris Yates <chris.l.yates@gmail.com>
+ * @copyright		Copyright (c) 2010 PBM Web Development
+ * @license			http://phamlp.googlecode.com/files/license.txt
+ * @package			PHamlP
+ * @subpackage	Haml.filters
+ */
+
+/**
+ * Markdown Filter for {@link http://haml-lang.com/ Haml} class.
+ * Parses the text with Markdown.
+ * 
+ * This is an abstract class that must be extended and the init() method
+ * implemented to provide the vendorPath if the vendor class is not imported
+ * elsewhere in the application (e.g. by a framework) and vendorClass if the
+ * default class name is not correct.
+ * @package			PHamlP
+ * @subpackage	Haml.filters
+ */
+abstract class _HamlMarkdownFilter extends HamlBaseFilter {
+	/**
+	 * @var string Path to Markdown Parser
+	 */
+	protected $vendorPath;
+	/**
+	 * @var string Markdown class
+	 * Override this value if the class name is different in your environment
+	 */
+	protected $vendorClass = 'MarkdownExtra_Parser';
+	
+	/**
+	 * Child classes must implement this method.
+	 * Typically the child class will set $vendorPath and $vendorClass
+	 */
+	public function init() {}
+
+	/**
+	 * Run the filter
+	 * @param string text to filter
+	 * @return string filtered text
+	 */
+	public function run($text) {
+		return '<?php	'.(!empty($this->vendorPath)?'require_once "'.$this->vendorPath.'";':'').'$markdown___=new '.$this->vendorClass.'();echo  $markdown___->safeTransform("'.preg_replace(HamlParser::MATCH_INTERPOLATION, '".\1."', $text).'");?>';
+	}
+}

lib/sass/haml/filters/_HamlTextileFilter.php

@@ -0,0 +1,50 @@
+<?php
+/* SVN FILE: $Id: _HamlTextileFilter.php 51 2010-04-14 12:05:03Z chris.l.yates $ */
+/**
+ * Textile Filter for {@link http://haml-lang.com/ Haml} class file.
+ * This filter is an abstract filter that must be extended. 
+ * 
+ * @author			Chris Yates <chris.l.yates@gmail.com>
+ * @copyright		Copyright (c) 2010 PBM Web Development
+ * @license			http://phamlp.googlecode.com/files/license.txt
+ * @package			PHamlP
+ * @subpackage	Haml.filters
+ */
+
+/**
+ * Textile Filter for {@link http://haml-lang.com/ Haml} class.
+ * Parses the text with Textile.
+ * 
+ * This is an abstract class that must be extended and the init() method
+ * implemented to provide the vendorPath if the vendor class is not imported
+ * elsewhere in the application (e.g. by a framework) and vendorClass if the
+ * default class name is not correct.
+ * @package			PHamlP
+ * @subpackage	Haml.filters
+ */
+abstract class _HamlTextileFilter extends HamlBaseFilter {
+	/**
+	 * @var string Path to Textile Parser
+	 */
+	protected $vendorPath;
+	/**
+	 * @var string Textile class
+	 * Override this value if the class name is different in your environment
+	 */
+	protected $vendorClass = 'Textile';
+	
+	/**
+	 * Child classes must implement this method.
+	 * Typically the child class will set $vendorPath and $vendorClass
+	 */
+	public function init() {}
+
+	/**
+	 * Run the filter
+	 * @param string text to filter
+	 * @return string filtered text
+	 */
+	public function run($text) {
+		return '<?php	'.(!empty($this->vendorPath)?'require_once "'.$this->vendorPath.'";':'').'$textile___=new '.$this->vendorClass.'();echo  $textile___->TextileThis("'.preg_replace(HamlParser::MATCH_INTERPOLATION, '".\1."', $text).'");?>';
+	}
+}

lib/sass/haml/messages/_i18n.php

@@ -0,0 +1,32 @@
+<?php
+/* SVN FILE: $Id: SassRuleNode.php 49 2010-04-04 10:51:24Z chris.l.yates $ */
+/**
+ * Message translations.
+ *
+ * This file is contains the localizable messages for Haml. You may modify this
+ * file by translating the messages and saving with the filename language.php
+ * where "language" is the language ID of the translations.
+ *
+ * Each array element represents the translation (value) of a message (key).
+ * If the value is empty the message is considered as not translated.
+ *
+ * NOTE: this file must be saved in UTF-8 encoding.
+ *
+ * @author			Chris Yates <chris.l.yates@gmail.com>
+ * @copyright 	Copyright (c) 2010 PBM Web Development
+ * @license			http://phamlp.googlecode.com/files/license.txt
+ * @package			PHamlP
+ * @subpackage	Haml.messages
+ */
+	return array (
+		'Attribute must be "class" or "id" with array value'=>'',
+		'Illegal indentation level ({indentLevel}); indentation level can only increase by one'=>'',
+		'Invalid indentation'=>'',
+		'Invalid {what} ({value})'=>'',
+		'Invalid {what} ({value}); must be one of "{options}"'=>'',
+		'Mixed indentation not allowed'=>'',
+		'No getter function for {what}'=>'',
+		'No setter function for {what}'=>'',
+		'Unable to find {what}: {filename}'=>'',
+		'{what} must extend {base} class'=>'',
+  );

lib/sass/haml/messages/de.php

@@ -0,0 +1,32 @@
+<?php
+/* SVN FILE: $Id: SassRuleNode.php 49 2010-04-04 10:51:24Z chris.l.yates $ */
+/**
+ * Message translations.
+ *
+ * This file is contains the localizable messages for Haml. You may modify this
+ * file by translating the messages and saving with the filename language.php
+ * where "language" is the language ID of the translations.
+ *
+ * Each array element represents the translation (value) of a message (key).
+ * If the value is empty the message is considered as not translated.
+ *
+ * NOTE: this file must be saved in UTF-8 encoding.
+ *
+ * @author			Chris Yates <chris.l.yates@gmail.com>
+ * @copyright 	Copyright (c) 2010 PBM Web Development
+ * @license			http://phamlp.googlecode.com/files/license.txt
+ * @package			PHamlP
+ * @subpackage	Haml.messages
+ */
+	return array (
+		'Attribute must be "class" or "id" with array value'=>'Attribute müssen "class" oder "id" mit array-wert',
+		'Illegal indentation level ({indentLevel}); indentation level can only increase by one'=>'Illegale einrückungsebene ({indentLevel}); einrückungsebene kann nur von einem anstieg',
+		'Invalid indentation'=>'Ungültige einrückung',
+		'Invalid {what}'=>'Ungültige {what}',
+		'Invalid {what} ({value}); must be one of "{options}"'=>'Ungültige {what} ({value}); muss einer der "{options}"',
+		'Mixed indentation not allowed'=>'Mixed einzug nicht erlaubt',
+		'No getter function for {what}'=>'Kein getter-funktion für {what}',
+		'No setter function for {what}'=>'Kein setter-funktion für {what}',
+		'Unable to find {what}: {filename}'=>'Kann zu finden {what}: {filename}',
+		'{what} must extend {base} class'=>'{what} muss {base} klasse erweitern',
+  );

lib/sass/haml/messages/fr.php

@@ -0,0 +1,32 @@
+<?php
+/* SVN FILE: $Id: SassRuleNode.php 49 2010-04-04 10:51:24Z chris.l.yates $ */
+/**
+ * Message translations.
+ *
+ * This file is contains the localizable messages for Haml. You may modify this
+ * file by translating the messages and saving with the filename language.php
+ * where "language" is the language ID of the translations.
+ *
+ * Each array element represents the translation (value) of a message (key).
+ * If the value is empty the message is considered as not translated.
+ *
+ * NOTE: this file must be saved in UTF-8 encoding.
+ *
+ * @author			Chris Yates <chris.l.yates@gmail.com>
+ * @copyright 	Copyright (c) 2010 PBM Web Development
+ * @license			http://phamlp.googlecode.com/files/license.txt
+ * @package			PHamlP
+ * @subpackage	Haml.messages
+ */
+	return array (
+		'Attribute must be "class" or "id" with array value'=>"D'attributs doivent être \"class\" ou \"id\" avec valeur de array",
+		'Illegal indentation level ({indentLevel}); indentation level can only increase by one: {file}::{line}'=>"Niveau niveau d'indentation illégale ({indentLevel}); ne peut augmenter d'un: {file}::{line}",
+		'Invalid indentation: {line}::{file}'=>'Indentation blancs: {line}::{file}',
+		'Invalid {what} ({value}): {file}::{line}'=>'Invalide {what} ({value}): {file}::{line}',
+		'Invalid {what} ({value}); must be one of "{options}".'=>"Invalide {what} ({value}); doit être l'un des \"{options}\"",
+		'Mixed indentation not allowed: {file}::{line}'=>'Indentation mixte pas autorisé: {file}::{line}',
+		'No getter function for {what}'=>'Pas de fonction getter pour {what}',
+		'No setter function for {what}'=>'Pas de fonction setter pour {what}',
+		'Unable to find {what}: {filename}.'=>'Impossible de trouver {what}: {filename}.',
+		'{what} must extend {base} class.'=>"{what} doit s'étendre classe {base}",
+  );