.loading-title{font-size:1em;margin-top:2em;text-align:center;color:#c5bcb4;line-height: 1.1em;}
h2.error{font-size:1em;margin-top:2em;text-align:center;color:#c5bcb4;line-height: 1.1em;}

/* SPLIT PANE STYLES */
#left-component {
	right: 50%;
	margin-right: 5px;
}

.my-divider {
	right: 50%;
	width: 5px;
	/* vertical handle */
	background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAAPCAYAAADDNm69AAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAALEgAACxIB0t1+/AAAABx0RVh0U29mdHdhcmUAQWRvYmUgRmlyZXdvcmtzIENTNAay06AAAAAYdEVYdENyZWF0aW9uIFRpbWUAMTQuMDEuMjAxMNh/L3IAAAAaSURBVAiZYzh9+vT//////4fRTAxoYFgLAAA44w7VNg0kZQAAAABJRU5ErkJggg==');
	background-color: #BEB4AA;
	background-repeat: no-repeat;
	background-position: 0 50%;
}

#right-component {
	width: 50%;
	background:#f3eee7;
}

.split-pane-frame {
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	width: 100%;
	height: 100%;
	top:0;
	right:0;
	left:0;
	bottom:0;
	border: 2px solid #BEB4AA;
	overflow:auto;
	margin-bottom: 31px;

}
.decoration {
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	width: 100%;
	height: 100%;
	overflow: hidden;
}
/* END: SPLIT PANE STYLES */

/* ACE EDITOR STYLES */

/**
* Hate using  !important, but couldn't find another way without
* directly tying style to an id.
**/
.code-editor {
	position: absolute !important;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	font-size:14px !important;
}

.editor-wrapper {
	position: relative;
	display: inline-table;
	height: 100%;
	width: 100%;
	min-height: 100px;
}

.results, .results-wrapper{
	width:100%;
	height:100%;
	top:0;
	bottom:0;
	left:0;
	right:0;
	border:none;
	background:#f3eee7;
}
.results-wrapper{
	overflow:auto;
}
.editor-wrapper{
	padding:8px;
}
.editor-wrapper .fullscreen{
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	position: fixed;
	z-index: 1100;

}

.editor-container{
	display: table;
	width: 100%;
	height: 100%;

}

.editor-container > div {
	display: table-row;
	width: 100%;
}

.editor-container > div > div {
	display: table-cell;
	width: 100%;
	border-radius:5px;

}

.results-label{
	position: absolute;
	display: inline-block;
	top: 0px;
	right: 0px;
	float: right;
	opacity: .3;
	border-bottom: 2px solid #BEB4AA;
	border-left: 2px solid #BEB4AA;
	-moz-border-radius-bottomleft: 5px;
	-webkit-border-bottom-left-radius: 5px;
	border-bottom-left-radius: 5px;
	background: #000;
	color: #fff;
	font-size: 1.1em;
	-webkit-box-shadow: -5px 3px 13px rgba(50, 50, 50, 0.75);
	-moz-box-shadow: -5px 3px 13px rgba(50, 50, 50, 0.75);
	box-shadow: -5px 3px 13px rgba(50, 50, 50, 0.75);
	height: 28px;
	line-height: 22px;
	text-align: center;
	z-index: 30;
	padding: 2px 18px;

}

.editor-toolbar{
	border: 2px solid #BEB4AA;
	background-color: #fff;
	padding-top: 0px;
	margin-top: -3px;
	display: inline-block !important;
	-webkit-border-bottom-right-radius: 4px;
	-webkit-border-bottom-left-radius: 4px;
	-moz-border-radius-bottomright: 4px;
	-moz-border-radius-bottomleft: 4px;
	border-bottom-right-radius: 4px;
	border-bottom-left-radius: 4px;
}

.popover{
	max-width:35em;
	z-index: 1101;
}

.ace_scrollbar::-webkit-scrollbar {
	width: 15px;
	background-color:#333;
}

.ace_scrollbar::-webkit-scrollbar-track {
	box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
}

.ace_scrollbar::-webkit-scrollbar-thumb {
	background: rgba(100, 100, 100, 0.8);
	border-radius: 5px;
}

.ace_scrollbar::-webkit-scrollbar-corner,
.ace_scrollbar::-webkit-scrollbar-thumb:window-inactive {
	background: rgba(100, 100, 100, 0.4);
}
.modal-solution {
	width: 750px;
}