#editor,
#resulteditor {
	width: 100%;
}

#resulteditor {
	height: 600px;
}

#editor {
	height: 560px;
}

#editor,
.jsoneditor-outer {
	border: 1px solid #08c;
	border-top: none;
}

.jsoneditor-treepath,
.jsoneditor-navigation-bar {
	color: #fff !important;
}

.jsoneditor-poweredBy {
	display: none;
}

.ace_active-line {
	background: #fffbd1 !important;
}

#popup {
	display: none;
	position: absolute;
	top: -35px;
	right: 0;
	min-height: 10px;
	max-height: 200px;
	border-radius: 5px;
	width: max-content;
	padding: 5px 10px;
	max-width: 400px;
	background-color: #6c757d;
	color: #fff;
}

#close_btn {
	padding: 0;
	cursor: pointer;
	background: #08c;
	border: 0;
	position: absolute;
	top: -10px;
	right: -8px;
	border-radius: 50%;
	z-index: 999;
	font-size: 21px;
}

#close_btn:hover {
	top: -12px;
	right: -10px;
	background: #016394;
}

#popup.valid {
	background: #4ec239;
}

#popup.invalid {
	background: #f85050;
}

.jsoneditor-outer,
.jsoneditor {
	background-color: #08c;
	border: none;
}

.jsoneditor {
	border: 1px solid #08c !important;
}

.jsoneditor-menu {
	background-color: #08c;
	border-bottom: 1px solid #08c !important;
}

.toolbar {
	color: #f3f3f3bf;
	padding: 5px;
	background-color: #08c;
	border-bottom: 1px solid #f3f3f3bf;
}

.top.toolbar {
	padding: 4px 5px;
}

.xml_tooltip {
	position: relative;
	display: inline-block;
	border: 1px solid transparent;
	border-radius: 3px;
}

.addBorder,
.addBorder.formatDoc {
	border: 1px solid #38c6e7;
}

.xml_tooltip .tooltiptext {
	visibility: hidden;
	width: max-content;
	background-color: #07547a;
	color: #fff;
	text-align: center;
	border-radius: 6px;
	padding: 5px 10px;
	position: absolute;
	z-index: 1;
	top: -30px;
}

.xml_tooltip:hover .tooltiptext {
	visibility: visible;
}

.xml_tooltip i,
.xml_tooltip img {
	padding: 5px;
	font-size: 17px;
}

.xml_tooltip i:hover,
.xml_tooltip img:hover,
.upload:hover {
	cursor: pointer;
	border-radius: 3px;
	background: #ffffff57;
}

.xml_tooltip .fa-tree:before,
.xml_tooltip .fa-expand:before,
.xml_tooltip .fa-download:before,
.xml_tooltip .fa-upload:before,
.xml_tooltip .fa-link:before,
.xml_tooltip .fa-print:before {
	font-family: "FontAwesome";
}

.xml_tooltip .fa-expand:before {
	content: "\f065";
}

.xml_tooltip .fa-tree:before {
	content: "\f1bb";
}

.xml_tooltip .fa-download:before {
	content: "\f019";
}

.xml_tooltip .fa-upload:before {
	content: "\f093";
}

.xml_tooltip .fa-link:before {
	content: "\f0c1";
}

.xml_tooltip .fa-print:before {
	content: "\f02f";
}

.xml_tooltip .fa-tree {
	rotate: 180deg;
}

.select_box {
	color: #000;
	padding: 2px;
	font-size: 10px;
}

#resulteditor .jsoneditor-frame input {
	width: 85px;
}

.fullscreen.box {
	position: absolute;
	max-width: 100%;
	z-index: 999999;
	padding: 0;
	transition: max-width 0.3s linear;
}

.expand_size {
	max-width: 100%;
	flex: 0 0 100%;
	transition: all 0.3s linear;
}

.expand_size .row {
	margin: 0;
}

.url_loader:before {
	content: "";
	display: block;
	position: absolute;
	height: 98%;
	width: 100%;
	z-index: 999;
	background: #00000073;
	background-image: url("/assets/images/loader.gif");
	background-repeat: no-repeat;
	background-size: 75px;
	background-position: center;
	right: 0;
	top: -1px;
}

.upload input {
	width: 20px;
	height: 20px;
	padding: 0;
	bottom: -5px;
	opacity: 0;
	z-index: 9;
	position: absolute;
	top: 4px;
	right: 3px;
	font-size: 8px;
}

#json_graph:focus-visible,
#graph_view:focus-visible,
#json_graph:focus,
#graph_view:focus {
	outline-color: transparent;
	outline-width: 0;
}

.jsoneditor-tree table,
.jsoneditor-tree tr,
.jsoneditor-tree td {
	border: none;
}

.expand_size .ace_print-margin {
	visibility: hidden !important;
}

i.formatDoc{
    border-radius: 2px;
    border: 1px solid transparent;
}

@media (max-width: 767px) {
	.row .box:first-child {
		margin-bottom: 15px;
	}

	.expand {
		display: none;
	}
}
