@import url(tree.css);

body {margin:0px;font-size:14px;background-color:#fafaff;}
div,form,img,ol,dl,dt,dd,fieldset {margin:0;padding:0;border:0;}
h1,h2,h3,h4,h5,h6,p {margin:0;padding:0;font-size:1em;}
ul,ol,li {margin:0;padding:0;list-style:none;}
em {font-style:normal;}
hr {display:none;}

body, button, input, textarea {
	font-family:Tahoma,arial,simsun;
}


html {
	height:100%;
	visibility:visible !important;
}
/**/
#jsonNav {
	overflow:auto;
	height:calc( 100% - 26px );
	box-sizing:border-box;
	padding:1em 1em 2.8em;
}
#panel {padding:12px 2px 12px 12px;width:512px;height:80%;@min-height:300px;position:fixed;z-index:10;right:2em;top:1em;border:1px solid #C8C8C8;border-color:#e7e7f3 #c8c8d8 #c8c8d8 #e7e7f3;background:#f3f5ff;box-shadow:4px 4px 9px rgba(0, 0, 50, 0.2), -3px -3px 30px rgba(88, 88, 188, 0.1) inset;
	transition:
		height .2s ease-out
		,width .2s ease-out
	;
}
body{height:100%;}

#panel.min {width:10px;height:3px;}
#panel.disTransition {transition:none;}
#showLink {display:none;position:absolute;right:27px;top:45px;}
a#showLink:link, a#showLink:visited {color:#577cff;text-decoration:underline;}
a#showLink:hover, a#showLink:active {color:#577cff;text-decoration:none;}
#minBtn {position:absolute;right:5px;top:5px;padding-left:7px;z-index:1;cursor:pointer;color:#577cff;}
#minBtn:hover {color:#87acff;}
#valueAct {height:100%;overflow:auto;opacity:1;position:relative;
	transition:
		opacity .4s ease-in
	;
}
#panel.min #valueAct {display@:none;opacity:0;height:1px;overflow:hidden;}
#saveBtn {float:left;}
#undoBtn {margin-left:4em;}
#undoBtn, #redoBtn {float:left;}
#showPath {width:420px;background-color:#e3e4e9;}
#showKey {width:120px;background-color:#e3e4e9;}
#showKey.isArrayElm {}
#showKey.isArrayElm~span {visibility:hidden;}
.lableInput #showKey~span {font-weight:bold;}
#showValue {outline:0;width:462px;min-height:250px;padding:10px 12px;border:1px solid #b6b6c4;border-right-color:#eef;border-bottom-color:#eef;border-radius:2px;box-shadow:1px 1px 6px rgba(33, 33, 98, .16) inset;}
#showValue:focus {box-shadow:1px 1px 12px rgba(53, 53, 118, .26) inset;border:1px solid #d0d0ed;border-right-color:#ddf;border-bottom-color:#ddf;}
.inputTitle {display:inline-block;width:4em;margin:0 0 1em;}
#pathTips {height:25px;line-height:1.6em;width:100%;position:fixed;z-index:15;left:0;bottom:0;background-color:#eee;color:#666;padding:0.2em 1em 0;border-top:1px solid #fff;}
button {border-radius:2px;margin:0.5em 0 0;border-width: 1px;padding: 1px 8px 3px;}
#msgBox {color:red;font-size:12px;font-weight:bold;height:38px;line-height:14px;padding-right:24px;padding-top:5px;text-align:right;}
.textInpub {padding:3px 6px;border-radius:2px;}
#mask {z-index:20;position:absolute;left:0;top:0;background-color:rgba(101, 123, 190,0.3);width:100%;height:100%;}
#enterInputDialog {position:absolute;left:50%;top:50%;margin:-170px 0 0 -280px;padding:20px;width:560px;height:340px;text-align:right;border-radius:6px;box-shadow: 6px 5px 7px rgba(50, 50, 50, 0.4);background-color:#fafaff;border:1px solid #e8e8e8;}
#enterValue {width:530px;height:265px;margin:5px 0 0;border-radius:2px;padding:15px;box-shadow:1px 1px 10px rgba(88, 88, 188, 0.18) inset;border-color:#888 #ddd #ddd #888;}
#enterInputTips {text-align:left;line-height:1.5em;}
.tools2 {padding:0 1em 0 0;text-align:right;}


.noIco .ico {display:none;}
.folderIco .ico {display:none;}
.folderIco .elmBox {padding:0 0 0 20px;}
.folderIco .node .elmBox {background-image:url(treePic/elm.png);background-size:24px 22px;background-position:2px 0;background-repeat:no-repeat;}
.folderIco .elmBox {background-image:url(treePic/object.png);background-size:24px 22px;background-position:2px 0;background-repeat:no-repeat;}
.folderIco .open>.row>.elmBox {background-image:url(treePic/objectOpen.png);}
.noIco.folderIco .elmBox,
.noIco.folderIco .open>.row>.elmBox {background-image:none;padding:0;}

.value {display:none;padding:0 8px}
.object>.row .elm {color:#333;font-weight:normal;}
.object>.row .elm:after {content:"";}
.object>.elmList>.elmBlock>.row .elm:after {}
.array>.elmList>.elmBlock>.row .elm {font-weight:normal;color:#000;display@:none;}
.array>.elmList>.elmBlock>.row .elm.array-key {color:#aaa;}
.showValueInNav .array>.elmList>.node>.row .elm {display:none;}
.showValueInNav .array>.elmList>.array>.row .elm {display:inline;}
.array>.elmList>.array>.row .elm {}
.elm, .array>.elmList>.array>.row .elm {color:#4a0;font-weight:bold;display:inline;}
.showValueInNav .elm:after {content:"  :";color:#2c3;font-weight:bold;}
.showValueInNav .cur>.row .elm:after {color:#fff;}
.array>.elmList>.array>.row .elm:after {content:"";color:#2c3;font-weight:bold;}
.showValueInNav .value {display:inline-block;}
.showValueInNav .array>.elmList>.elmBlock>.row .elm {}
.string>.row .value {color:#f63;float@:left;}
.string>.row .value img {display:none;border:1px solid #8C9ACA;}
.showImg .string>.row .value img {display:inline;}
.showImg .imgUrl.elmBlock>.row .elm {vertical-align:sub;}
.showImg .value.has-img {padding-bottom:8px;vertical-align:text-top;}
.bottomBox {font-size:12px;}
.number>.row .value {color:#cc00ff;}
.null>.row .value {color:#bb4;}
.boolean>.row .value {color:#09c;}
.hover-show-img.showImg .value.has-img {padding-bottom:0;}
.hover-show-img.showImg .string>.row .value {
	z-index:1;
	position:relative;
}
.hover-show-img.showImg .string>.row .value img {
	display:none;
	position:absolute;
	left:0;
	top:120%;
}
.hover-show-img.showImg .string>.row .value:hover {
	z-index:2;
}
.hover-show-img.showImg .string>.row .value:hover img{
	display:inline;
}
.has-img img {
	max-height:300px;
	max-width:500px;
}

.copy-tips {
	color:#4a0;
	opacity:0;
}
.copy-tips.hide {
	transition:opacity 3s ease-in .5s;
}
.copy-tips.show {
	opacity:1;
}
.deError-tips {
	color:#e33;
}
.deError-tips.hide {
	display:none;
}
.deError-tips.show {
	display:inline;
}
#hideBox {
	width:1px;
	height:1px;
	overflow:hidden;
	position:absolute;
	left:-100px;
	top:-100px;
}
#errorTips {
	position:fixed;
	left:0;
	top:0;
	z-index:23;
	width:560px;border-radius:6px;box-shadow: 6px 5px 7px rgba(229, 163, 163, 0.4);background-color:#ffecf1;border:1px solid #dbb2b2;
	overflow:auto;
	max-height:98%;
}
#sigh {
	position:absolute;
	left:10px;
	top:10px;
	z-index:23;
	color:#d84646;
	cursor:pointer;
}
#errorBtn {
	padding:5px 0 0 5px;
	font-size:16px;
	cursor:pointer;
	color:#e96969;
	position:absolute;
	left:0;
	top:0;
}
#errorBtn:hover {
	opacity:0.6;
}
#errorCode .errorEm {
	background-color:#ff921b;
}
#errorTarget {
	color:#000;
	background-color:#fff;
}
#errorCode {
	padding:0 10px 10px;
}
#errorCode ol {
	padding:0 0 0 3em;
}
#tipsBox {
	color:#b4465c;
	padding: 6px 0 4px 2em;
}
#errorCode ol li {
	padding:4px 7px 0;
	list-style-type: decimal;
	color:#b4465c;
	background-color:#fdf7f7;
}
#errorCode ol li div {
	color:#000;
}

#jsObjEnterOk {
	float:left;
	color:#999;
	background-color:#fff;
	border-color:#eee #fff #fff #eee;
}


#rcmd {
	position:absolute;
	right:-1px;
	top:calc(100% + 2px);
	box-shadow:4px 4px 9px rgba(0, 0, 50, 0.4), -3px -3px 30px rgba(88, 88, 188, 0.2) inset;
}
#rcmd.tips {
	box-shadow:none;
}
#rcmd.tips a {
	line-height: 2em;
	font-size:12px;
	text-decoration:none;
	color:#6178C7;
}
#rcmd.tips a:hover {
	text-decoration:underline;
}
.min #optBtn,
.min #rcmd {
	visibility:hidden;
}
.min #showValue {
	transition-delay : .4s;
	visibility:hidden;
}
#rcmd #closeAd {
	position:absolute;
	width:14px;
	height:14px;
	line-height:14px;
	padding:0;
	text-align:center;
	right:0;
	top:0;
	background-color:#aaa;
	border:none;
	color:#000;
	margin:0;
}
#rcmd #closeAd:hover {
	color:#fff;
}
.setting-btn {
	transition-property:visibility;
	transition-delay:.1s;
	visibility:visible;
	border:none;
	padding:0;
	margin:0;
	position:absolute;
	bottom:15px;
	right:15px;
	display:block;
	width:24px;
	height:24px;
	background:url(img/setting-btn.png) no-repeat 0 0;
	cursor:pointer;
	outline:none;
}
.setting-btn:hover {
	background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAE/ElEQVRIS51VC2xTZRT+bm/brYwhG48xhCggOCPD8dJIILAAGh8JUQEDBCSgMAIaxZjAho+MiEwIZCPAcGEwRZ5DFEFhvByE53Qp7NmtgDDGunWUru199N7ee8xf29IuIwT+5Oa2ueec7/zfOec7HB5xiGgugFcB6AAcAPZzHHcDQOBRvuw7F21ERMkAegHwALgHIFXX8eXFKukDSdbNzFbT4Plk0cS3bNV/XwIwCAAP4A7Hcb6uACMARDQQwMx2tzbB7dWFhDhDaWpf/pkWpzan9qY8huh/dy2g4dxfR058uvi1fEu3p2Y472Og10dlI9Li1oVuGYMTBCCiHgAWtDi12Y1N/gxFJRPPc85ePQ0Oj6APlWWKj/YSBNGXlKhXGc2J6aJM3RmuvaGuYNuGjwus1ktN7H/YPgzQ29Whf1d9Q56nKBSk4nGPKAj6hm+X5pefLl0NwM3yjtSAiOKbHOqCxiZ1va6T5XGDM3tXeyut+mLG+ca6ykUA7ADUmCKzGlTUyNs6fNobTwLw0/a17r0l648qirwWAOsyid2CI6JuAMYAmNh6T82ssiuToruLiHC+/Ij/ysUTLgMgjM98p3vG6AkpRpMxpgML83POHNyTvzojI+OO1Wq9C0AMAyz1STTl32ZljMuj9VNUMkbfYFfx975D+zbXeDrunQDQkNw71bIy98eJ6SNemcUbDREQSZQU0qRbdvv1NZ8vyWS2zUGKiKiwvFL8UFWJ9XPMaay/GshdMbvK4bi1GcBlAPcZt2Vlp9N1y4idvCl+QKc5giSK2rTJKVkAdrC2ZQAbTl4WPuuK91PHD3gK8pb9IopCAYCW0AAqoii+W3Nd+8YtcC909vPLEt6e1Od3AHMYTQzg/ZOXhb1dAdRcu+LLzZ5V5Gpv3RKSCZGIUgEsqayVF7q8Wr/OfqLPi2lTUhlF81lzMYAexfuqi+PizW8mJ/eNN5lNEV5VRaWD+7fus1n/yMnLy+PGjRuXCOD1Fqc23XbbPzIQeECrJApobrJr584c9u7emXcUwCoAbSyYAcBgAMNKSmtn9ksdMM/ARxVPklUu4P1z6LNJzUlJCX0EmZ6/06am+RUyRWdfUrSmY9f2NVcBVAE4B+ACgPbwJJsFQZh+u1XNam7jx4N7ABAOQqQrRt7AaTpiAoe/b8nPth3aU7AJQFloBgQAvohUCFJgZc11db5H0JmiPvZx3G1S1+Uu3nzNepY1RBsAP9OkiNg1twaWNdxWvtb0J9MillHO8ukVVy4cWwigPkYqiMjwT52Y0tqu5fIGWsgbeU6WRNyw14qDhrwYZ+lmiZkRn6eDGmxWcfBzw+N7JvUKfvv1wA/SzzvWnne72nIAVEekIooLQ//+Q56e+9GqIk1Tx14o/83TaLtavyK3xDE8fex8A896AdA1DceP7haLt35VMTRtpGvUy5NHu11Oy+HSwhpJ8u0HcAoAkwpWA4rRk9B2GpCQkJgpCF6mqo0bN24yDRs156A5zhxUWY/bRTnL37PX11ZsA3AWQG8AbFk5AdSGpr0DgNIVQFhh2YJhAQ1ZWVlxaaNmZRvN/DxZ9JlsdZX+ok3ZxwDkA7jJOiXEAusutrflUHD2O3YnR9EVng/2Zk8KgKkAXgoV71ooe6ZNQSpC88TeLHBowT4coKs2ZSrLpD14s1CmLDij4qGncw0eZcsCs65hfmzvsieSbVfO/wGiC2pcTa6aSAAAAABJRU5ErkJggg==) no-repeat 0 0;
}
.setting-btn:active {
	background:url(img/setting-btn.png) no-repeat 0 0;
}

.array-leng {
	display:none;
}
.show-leng .array-leng {
	display:inline;
	padding:0 10px;
	margin:0 0 0 4px;
	height:20px;
	line-height:20px;
	background-color:#d3d3d3;
	border-radius:4px;
	text-shadow:none;
	color:#fff;
}
.lengMode-array .elmBlock.object>.row .array-leng {
	display:none;
}

.elmBlock>.elmList {
	display:none;
}
.elmBlock.open>.elmList {
	display:block;
}


.rich .treeNav {text-shadow: -2px 1px 3px rgba(110, 110, 110, 0.17);}
.rich .treeNav .cur>.row .elmSpan {box-shadow: -3px 3px 5px rgba(50, 50, 50, 0.4);}
.rich .treeNav .show-leng .array-leng {box-shadow:-2px 1px 3px rgba(70, 70, 70, 0.2);}

.smart .treeNav {font-size:12px;}
.smart .treeNav .row {line-height:22px;}
.smart .treeNav .elmBlock .row {background-position-y:-2px;}
.smart .treeNav .elm {padding: 3px 8px;}
.smart .treeNav .value {padding: 0 8px 0 4px;}
.smart .treeNav .ico {margin-top:-2px;}

.dark {background-color:#0e0900;}
.dark body {background-color:transparent;}
.dark #minBtn {color:#becaf5;}
.dark #panel {background-color:#575a5d;border-color: #676a6d #474a4d #474a4d #676a6d;color:#dbe0f3;}
.dark .treeNav .row:hover .elmBox{font-weight:bold;border-color:#394c63;}
.dark .treeNav .elmBox {border-left:2px solid #0e0900;}
.dark .treeNav {font-size:12px;}
.dark .treeNav .row {line-height:22px;}
.dark .treeNav .elmBlock .row {background-position-y:-2px;}
.dark .treeNav .elm {padding: 3px 8px;}
.dark .treeNav .value {padding: 0 8px 0 4px;}
.dark .treeNav .ico {margin-top:-2px;}

.dark .treeNav .cur>.row .elmSpan {background-color:#3a4c63;}
.dark .object>.row .elm {color:#999;}
.dark .array>.elmList>.elmBlock>.row .elm {color:#999;}
.dark .array>.elmList>.elmBlock>.row .elm.array-key {color:#bbb;}
.dark .show-leng .array-leng {color:#777;background-color:#444;}
.dark .elm, .array>.elmList>.array>.row .elm {color:#6e9354;}
.dark .showValueInNav .elm:after {color:#346739;}
.dark .showValueInNav .cur>.row .elm:after {color:#fff;}
.dark .array>.elmList>.array>.row .elm:after {color:#2c3;}
.dark .string>.row .value {color:#d3947f;}
.dark .number>.row .value {color:#b474c4;}
.dark .null>.row .value {color:#a7af5d;}
.dark .boolean>.row .value {color:#629fb3;}
.dark .treeNav .cur>.row .elmSpan * {color: #ccc !important;}

.dark .treeNav .root.elmBlock>.row {background-image:url(treePic/folderRoot_b.png);}
.dark .treeNav .root.open.elmBlock>.row {background-image:url(treePic/openRoot_b.png);}
.dark .treeNav .folder>.row {background-image:url(treePic/folder_b.png);}
.dark .treeNav .elmList>li.folder:last-child>.row {background-image:url(treePic/folderLast_b.png);}
.dark .treeNav .elmList>li.node:last-child>.row,
.dark .treeNav .empty.elmBlock>li:last-child>.row {background-image:url(treePic/nodeLast.png);}
.dark .treeNav .open>.row {background-image:url(treePic/open_b.png);}
.dark .treeNav .elmList>li.open:last-child>.row {background-image:url(treePic/openLast_b.png);}
.dark .treeNav .open.root>.row {background-image:url(treePic/open_b.png);}
.dark .treeNav .empty>.row {background-image:url(treePic/node.png);}
.dark .treeNav .elmList>li.node:last-child>.row {background-image:url(treePic/nodeLast.png);}

.dark #msgBox {color:#ff6969;}
.dark #panel a#showLink:link,
.dark #panel a#showLink:visited {color:#96adff;}