.xonomy { font-family: monospace; font-size: 15px; cursor: default; background-color: #ffffff;
	-webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;
	line-height: 1.5em; padding-left: 5px; }
.xonomy * { position: relative; }
.xonomy.laic { line-height: 2em; }
.xonomy.laic > .element { border-bottom: 1px dotted #cccccc; }
.xonomy.laic > .element.collapsed { padding-bottom: 5px; }

/*Inline formatting of names, values, punctuation*/
.xonomy .element .punc { color: #669acc; z-index: 1;  }
.xonomy .element > .tag { border-radius: 2px; }
.xonomy .element > .tag.opening {  }
.xonomy .element > .tag.opening > .punc.slash { display: none; }
.xonomy .element > .tag.closing {  }
.xonomy .element > .tag > .name { color: #cc3333; cursor: pointer; }
.xonomy .element > .tag.opening > .attributes {  }
.xonomy .element > .tag.opening > .attributes > .attribute {  }
.xonomy .element > .tag.opening > .attributes > .attribute > .name { color: #ff4455; cursor: pointer; }
.xonomy .element > .tag.opening > .attributes > .attribute > .valueContainer { cursor: pointer; }
.xonomy .element > .tag.opening > .attributes > .attribute > .valueContainer > .value { color: #666666; }
.xonomy .element > .children > .textnode > .value { color: #000000; cursor: pointer; }
.xonomy .element > .children > .textnode > .value > .insertionPoint { display: none; }
.xonomy .element > .children > .textnode > .value > .dots { display: none; }
.xonomy.laic .element > .tag.closing { display: none; }
.xonomy.laic .element > .tag { background-color: #f6f6f6; padding: 3px 0px 3px 0px; border: 1px solid #aaaaaa; border-radius: 2px; box-shadow: 0px 0px 1px #cccccc; }
.xonomy.laic .element > .tag.opening { margin: 0px 10px 0px 0px;  }
.xonomy.laic .element > .tag.closing { margin: 0px 0px 0px 10px;  }
.xonomy.laic .element > .tag.closing { display: none; }
.xonomy.laic .element.hasText .element.hasText.oneliner > .tag.opening { display: inline; margin-right: 0px; }
.xonomy.laic .element.hasText .element.hasText.oneliner > .tag { padding-top: 0px !important; padding-bottom: 0px !important; }
.xonomy.laic .element.hasText .element.hasText.oneliner > .tag * { padding-top: 0px !important; padding-bottom: 0px !important; }
.xonomy.laic .element.hasText .element.hasText.oneliner > .children { margin-left: 2px; padding: 0px 5px; background-color: #eeeeee; border: 1px solid #aaaaaa; border-radius: 2px; }
.xonomy.laic .element > .tag > .name { padding: 3px 10px 3px 10px; }
.xonomy.laic .element > .tag .punc { display: none !important; }
.xonomy.laic .element > .tag.opening > .attributes > .attribute { margin: 0px 0px 0px 0px; padding: 3px 0px 3px 0px; border-left: 1px solid #aaaaaa; }
.xonomy.laic .element > .tag.opening > .attributes > .attribute > .name { padding: 3px 10px; margin: 0px 0px 0px 0px;  }
.xonomy.laic .element > .tag.opening > .attributes > .attribute > .valueContainer { background-color: #ffffff; min-width: 1em; padding: 3px 10px 3px 10px; xbox-shadow: inset 0px 0px 3px #666666; }
.xonomy.laic .element > .tag.opening > .attributes > .attribute > .valueContainer:hover { background-color: #ffffcc; }
.xonomy.laic .element > .children > .textnode > .value { text-shadow: 1px 1px 0px #f0f0f0; }
.xonomy.laic .element > .children > .textnode > .value:hover { background-color: #ffffcc; }

/*Clickable items: hover state*/
.xonomy .element > .tag > .name:hover { color: #00cc00; }
.xonomy .element > .tag.opening > .attributes > .attribute > .name:hover { color: #00cc00; }
.xonomy .element > .tag.opening > .attributes > .attribute > .valueContainer:hover > .value { color: #00cc00; }
.xonomy .element > .children > .textnode > .value:hover { color: #666666; }
.xonomy .element > .children > .textnode.whitespace > .value:hover { background-color: #f2f2f2; }

/*Clickable items: current state*/
.xonomy .element.current > .tag > .name { background-color: #ffff99; color: #00cc00; padding: 0px 3px; margin: 0px -3px; border-radius: 2px; }
.xonomy .element > .tag.opening > .attributes > .attribute.current > .name { background-color: #ffff99; color: #00cc00; padding: 0px 3px; margin: 0px -3px; border-radius: 2px; }
.xonomy .element > .tag.opening > .attributes > .attribute > .valueContainer.current { background-color: #ffff99; padding: 0px 3px; margin: 0px -3px; border-radius: 2px; }
.xonomy .element > .tag.opening > .attributes > .attribute > .valueContainer.current > .value { color: #00cc00; border-radius: 2px; }
.xonomy .element > .children > .textnode.current > .value { background-color: #ffff99 !important; color: #00cc00; padding: 0px 3px; margin: 0px -3px; border-radius: 2px; }
.xonomy.laic .element.current > .tag > .name { background-color: #ffff99; color: #00cc00; padding: 3px 10px 3px 10px; margin: 0px; border-radius: 0px; }
.xonomy.laic .element > .tag.opening > .attributes > .attribute.current > .name { background-color: #ffff99; color: #00cc00; padding: 3px 10px; margin: 0px 0px 0px 0px; border-radius: 0px; }
.xonomy.laic .element > .tag.opening > .attributes > .attribute > .valueContainer.current { background-color: #ffff99; padding: 3px 10px 3px 10px; margin: 0px; border-radius: 0px; }

.xonomy.laic .element > .children > .textnode.whitespace:only-child > .value { padding: 0px 20px; border-bottom: 1px dotted #999999; }
.xonomy.laic .element > .children > .textnode.whitespace:only-child > .value * { display: none; }


/*Read-only stuff*/
.xonomy .readonly * { color: #aaaaaa !important; cursor: default !important; }

/*Block layout*/
.xonomy .element { padding-left: 25px; margin-top: 5px; margin-bottom: 5px; }
.xonomy .element .connector { border-top: 1px dotted #b6b6b6; width: 24px; height: 10px; position: absolute; top: 10px; left: 0px; }
.xonomy .element .children { margin-left: 10px; border-left: 1px dotted #cccccc; padding-top: 1px; padding-bottom: 1px; }
.xonomy .element .children .textnode { padding-left: 25px; margin-top: 5px; margin-bottom: 5px; }
.xonomy.laic .element { margin-top: 5px; margin-bottom: 5px; border-top: 1px dotted #cccccc; padding-top: 5px; padding-left: 30px; }
.xonomy.laic .element .children { border: 0px; padding-top: 0px; padding-bottom: 0px; margin-left: 0px; }
.xonomy.laic .element .connector { border: 0px; top: 21px; left: 5px; }

/*Inline layout (overrides block-layout default)*/
.xonomy .element.hasText > .children > .element { padding-left: 0px; display: inline; }
.xonomy .element.hasText .children .connector { position: relative; top: 0px; left: 0px; display: inline; padding-right: 16px; border: 0px; }
.xonomy .textnode > .connector { display: none !important; }
.xonomy .element.hasText .children { padding-left: 25px; padding-top: 5px; padding-bottom: 5px; }
.xonomy .element.hasText .element.hasText .children { margin-left: 0px; border-left: 0px; padding: 0px; display: inline; }
.xonomy .element.hasText .children .textnode { padding-left: 0px; display: inline; }
.xonomy .element.oneliner .children .textnode .dots { display: none !important; }
.xonomy.laic .element.hasText .element { border: 0px; }
.xonomy.laic .element.hasText .children { padding-top: 5px; }

/*One-liner layout*/
.xonomy .element.oneliner .element { padding-left: 0px; display: inline; }
.xonomy .element.oneliner .children { margin-left: 0px; border-left: 0px; padding: 0px; display: inline; }
.xonomy .element.oneliner .element.hasText .children { margin-left: 0px; border-left: 0px; padding: 0px; display: inline; }
.xonomy .element.oneliner .children .textnode { padding-left: 0px; display: inline; }

/*Empty text nodes: */
.xonomy .element .children .textnode.empty { min-height: 1em; }
.xonomy .element .children .textnode.empty .value { cursor: pointer; }
.xonomy .element .children .textnode.empty .value > .insertionPoint { display: inline; padding: 0px 2px; border-top: 1px solid #dddddd; border-bottom: 1px solid #dddddd; }
.xonomy .element .children .textnode.empty .value > .insertionPoint > .inside { border-left: 1px solid #dddddd; }
.xonomy .element .children .textnode.empty:first-child:last-child .value > .dots { display: inline; padding-left: 2em;}
.xonomy .element .children .textnode.empty .value:hover { background-color: #f2f2f2; }
.xonomy .element .children .textnode.empty .value:focus { background-color: #f2f2f2; }

/*Plus-minus collapsor*/
.xonomy .element > .connector > .plusminus { background-image: url(minus.gif); width: 9px; height: 9px; position: absolute; top: -5px; left: -5px; cursor: pointer; }
.xonomy .element.hasText .element.oneliner .connector .plusminus { top: 4px; left: 4px; }
.xonomy.laic .element > .connector > .plusminus { left: 0px; }

/*Collapsed elements*/
.xonomy .element.collapsed > .connector > .plusminus { background-image: url(plus.gif); }
.xonomy .element.collapsed > .children { display: none !important; }
.xonomy .element.hasText .element.oneliner.collapsed > .tag { display: none; }
.xonomy.laic .element.hasText .element.oneliner.collapsed > .tag { display: none !important; }

/*The "collapsoid" (= rectangle that hides collapsed stuff)*/
.xonomy .element > .childrenCollapsed { display: none; border: 1px solid #cccccc; color: #999999; border-radius: 2px; margin: 0px 2px; padding: 0px 5px 0px 5px; cursor: pointer; font-size: 85%; }
.xonomy .element.collapsed > .childrenCollapsed { display: inline; }
.xonomy .element > .childrenCollapsed:hover { background-color: #f4f4f4; }

/*Elements with no children*/
.xonomy .element.noChildren > .connector > .plusminus { display: none; }
.xonomy .element.noChildren > .children { display: none; }
.xonomy .element.noChildren > .tag.closing { display: none; }
.xonomy .element.noChildren > .tag.opening > .punc.slash { display: inline }
.xonomy .element.noChildren > .childrenCollapsed { display: none; }

.xonomy .element.uncollapsible > .connector > .plusminus { display: none; }
.xonomy .element.uncollapsible > .childrenCollapsed { display: none; }

/*Drag handle*/
.xonomy .connector > .draghandle { display: none; width: 9px; height: 13px; background-image: url(draghandle.gif); position: absolute; top: -7px; right: 2px; cursor: move; }
.xonomy .element.draggable > .connector > .draghandle { display: block; }

/*Classes involved in dragging and dropping*/
.xonomy .dragging { color: #cccccc !important; }
.xonomy .dragging * { color: #cccccc !important; }
.xonomy .dragging .draghandle { opacity: 0.5; }
.xonomy .elementDropper { display: block; margin-top: 0px; margin-bottom: 0px; height: 0px; position: relative; }
.xonomy .elementDropper > .inside { display: block; height: 9px; width: 9px; border: 1px solid #ffffff; background-color: #dddddd; position: absolute; top: -8px; left: -6px; z-index: 10; }
.xonomy .elementDropper:first-child > .inside { top: -1px;  }
.xonomy .elementDropper:only-child > .inside { top: -5px;  }
.xonomy .activeDropper > .inside { background-color: #888888; }

.xonomy.laic .elementDropper > .inside { top: -5px; left: 16px; }
.xonomy.laic .elementDropper:first-child > .inside { top: -5px;  }
.xonomy.laic .elementDropper:only-child > .inside { top: 0px;  }


/*Chewed selectable text*/
.xonomy .element > .children > .textnode .char { }
.xonomy .element > .children > .textnode .word { white-space: nowrap; }
.xonomy .hasInlineMenu > .children > .textnode .char > .selector { position: absolute; left: 0px; right: 0px; bottom: -2px; height: 1px; background-color: #eeeeee; z-index: 2; }
.xonomy .hasInlineMenu > .children > .textnode .char > .selector > .inside { position: absolute; left: 0px; right: 0px; bottom: -2px; top: -3px; background-color: transparent; }
.xonomy .hasInlineMenu > .children > .textnode .char > .selector > .inside:hover { background-color: #cccccc; }
.xonomy .element > .children > .textnode .char.on { background-color: #ffff99; }
.xonomy .element > .children > .textnode .char.on > .selector { position: absolute; left: 0px; right: 0px; z-index: 2; background-color: #00cc00; xbackground-color: #669acc; height: 3px; bottom: -3px; }
.xonomy .element > .children > .textnode .char.on > .selector > .inside { position: absolute; left: 0px; right: 0px; top: -2px; bottom: -1px; background-color: transparent; }

/*Pop-up box*/
#xonomyBubble { display: none; position: absolute; z-index: 2; min-width: 100px; }
#xonomyBubble > div.inside { box-shadow: 0px 0px 5px #99cbff; border: 1px solid #333333; background-color: #dddddd; border-radius: 2px; margin-top: 8px; }
#xonomyBubble > div.inside > #xonomyBubbleContent { font-family: Verdana, sans-serif; font-size: 11px; color: #666666; margin: 5px; padding: 5px; background-color: #ffffff; border-radius: 2px; }
#xonomyBubble span.punc { color: #669acc; }
#xonomyBubble.laic > div.inside { box-shadow: 0px 0px 5px #666666; }
#xonomyBubble.laic span.punc { display: none; }

/*When the pop-up box functions as menu or picker*/
#xonomyBubbleContent div.menu { margin: -5px; max-height: 250px; overflow-y: auto; white-space: nowrap; }
#xonomyBubbleContent div.menuItem { padding: 8px 20px 7px 10px; border-top: 1px solid #dddddd; cursor: pointer; margin-top: -1px; }
#xonomyBubbleContent span.techno { font-family: monospace; font-size: 13px; }
#xonomyBubbleContent span.techno span.punc {color: #669acc; }
#xonomyBubbleContent span.techno span.atName { color: #ff4455; }
#xonomyBubbleContent span.techno span.atValue { color: #666666; }
#xonomyBubbleContent span.techno span.elName { color: #cc3333; }
#xonomyBubbleContent div.menuItem.techno { padding-top: 6px; padding-bottom: 6px; font-family: monospace; font-size: 13px; }
#xonomyBubbleContent div.menuItem.techno span.explainer { font-family: Verdana, sans-serif; font-size: 11px; color: #999999; font-weight: normal; }
#xonomyBubbleContent div.menuItem.current { background-color: #ffffdd; }
#xonomyBubbleContent div.menuItem:hover { background-color: #ffffcc; }
#xonomyBubble.laic #xonomyBubbleContent div.menu { max-height: 300px; }
#xonomyBubble.laic #xonomyBubbleContent div.menuItem { padding: 11px 20px 10px 10px; }
#xonomyBubble.laic #xonomyBubbleContent span.techno { background-color: #f0f0f0; padding: 3px 0px 3px 0px; border-radius: 2px; }
#xonomyBubble.laic #xonomyBubbleContent span.techno span.elName { padding: 3px 6px; }
#xonomyBubble.laic #xonomyBubbleContent span.techno span.atName { padding: 3px 6px; }
#xonomyBubble.laic #xonomyBubbleContent span.techno span.atValue { background-color: #ffffff; padding: 3px 6px; }

/*When the pop-up box takes input from the user*/
#xonomyBubbleContent form { margin: -5px; padding: 5px; background-color: #eeeeee; }
#xonomyBubbleContent div.submitline { text-align: right; margin-top: 5px; }
#xonomyBubbleContent input { border-width: 1px; padding: 3px; color: #333333; font: inherit; }
#xonomyBubbleContent textarea { border-width: 1px; padding: 3px; color: #333333; font: inherit; }
#xonomyBubbleContent input.textbox { font-family: monospace; font-size: 13px; width: 250px; border: 1px solid #dddddd; }
#xonomyBubbleContent textarea.textbox { font-family: monospace; font-size: 13px; width: 400px; height: 100px; border: 1px solid #dddddd; }

/*When the pop-up is a list of warnings*/
#xonomyBubbleContent .warning { }
#xonomyBubble.laic .warning { padding: 10px; }

/*The exclamation mark that lets you know if there is a warning attached to an element or attribute*/
.xonomy .warner { display: none; width: 16px; margin: 0px 1px 0px 1px; }
.xonomy .warner .inside { position: absolute; bottom: -4px; left: 0px; background-image: url(exclamation.png); background-position: 0px 0px; width: 16px; height: 16px; cursor: pointer; }
.xonomy .element.invalid > .tag > .warner { display: inline-block; }
.xonomy .attribute.invalid > .warner { display: inline-block; }

.xonomy.laic .warner { margin-left: 0px; margin-right: 5px; }

/*Display names*/
span.displayName { font-family: Verdana, sans-serif; font-size: 11px; font-weight: normal; }