/* SOURCE: http://www.levmuchnik.net/Content/ProgrammingTips/WEB/XMLDisplay/XMLDisplay.css */

/* 
 * carrot:   #ed9121, rgb(237, 145, 33)
 * almond:   #c48c48, rgb(196, 140, 72)
 */

@charset "utf-8";

/* CSS Document */
.Utility {
   color:		black;
}
.NodeName { /* element tags */
   font-weight:		bold;
   color:		#800080;
}
.AttributeName {
   font-style:		italic;
   color:		black;
}
.AttributeValue {
   color:		blue;
}
.NodeValue {
   color:		black;
}
.TextValue {
   color:		#66aaff;
}

.Element {
/* This is the orange line to left of elements: */
/*   border-left-color:	#FFAA11; */
   border-left-color:	rgba(196, 140, 72, 0.7);
   /* border-left-width currently must be a pixel count */
   border-left-width:	1px;
   border-left-style:	solid; 
   padding-top:		0px;
   margin-top:		0px;
}

.ElementClear {
/*
   border-left-color:	#FFAA11;
   border-left-width:	thin;
   border-left-style:	solid;
*/
   padding-top:		0px;
   margin-top:		0px;
}

.ElementEven {
   border-left-color:	#CC8822;
   border-left-width:	thin;
   border-left-style:	solid;
   padding-top:		0px;
   margin-top:		0px;
}

.ElementOdd {
   border-left-color:	#AACC44;
   border-left-width:	thin;
   border-left-style:	solid;
   padding-top:		0px;
   margin-top:		0px;
}

.clickableOn {
   font-weight:		900;
   font-size:		large;
   color:		#800080;
   cursor:		pointer;
   vertical-align:	middle;
   margin-top:		0px;
}

.clickableOff {
   font-weight:		900;
   font-size:		large;
   color:		#800080;
   cursor:		pointer;
   vertical-align:	middle;
   margin-top:		0px;
}


/* Tooltip for labeling element lines */
/* https://github.com/AdamWhitcroft/CSS.Tooltips/blob/master/css-tooltips.css */

[etip] {
   position:			absolute;
/*   cursor:			help;			 */
}

[etip]:before {
   display:none;
   /* hide the tooltip when not hovered: */
   content:			'';
   border:			5px solid #FFAA11;
   /* four-border technique to create the arrow:*/
   border-top-color:		#FFAA11;
   border-right-color:		transparent;
   border-bottom-color:		transparent;
   border-left-color:		transparent;
   position:			absolute;
   top:				50%;
   left:			0px;
   z-index:			8;
   font-size:			0;
   line-height:			0;
   width:			0;
   height:			0;
}

[etip]:after {
   display:			none;
   content:			attr(etip);
   position:			absolute;
   top:				50%;
   left:			0px;
   padding:			1px 1px;
   background:			#FFAA11;
   color:			#000000;
   z-index:			9;
   font-size:			0.5em;
   height:			9px;
   line-height:			9px;
   border-radius:		2px;
   white-space:			nowrap;
   word-wrap:			normal;
   font-family:			bold;
}

.tooltiparray {
   /* top:				50%; */
   left:			0px;
   padding:			1px 1px;
   background:			rgba(196, 140, 72, 0.7);
   color:			#000000;
/*   z-index:			9; */
   z-index:			-2; 
   font-size:			0.5em;
   height:			9px;
   /* line-height:			9px; */
   border-radius:		2px;
   white-space:			nowrap;
   word-wrap:			normal;
   font-family:			bold;
}

[etip]:hover:before,
[etip]:hover:after {
   display:			block;
}