body{
	font-family: Arial;
	background-color: rgb(221,221,221);
}
h3{
	margin: 0px;
	color: #fff;
	text-shadow: 0px 0px 2px #393f44;;
}
.head {
	width: 95%;
}
.head div{
	margin-top:15px;
	display: inline-block;
}
.head .mnu {
	float: right;
	margin-left: 7px;
	background: #f2f0f9;
	background-image: linear-gradient(to bottom, #f2f0f9, #b5b4b6);
	border-radius: 3px;
	color: #000;
	padding: 3px 10px;
	text-decoration: none;
	border: 1px solid #999;
}
.head a.mnu:hover {
	background: #fff;
	background-image: linear-gradient(to bottom, #fff, #ccc);
	text-decoration: none;
	cursor: pointer;
}
.head .file {
	background: #e3e3e3;
	background-image: linear-gradient(to bottom, #e3e3e3, #c9c9c9);
	border-radius: 3px 8px 0px 0px;
	color: #000000;
	padding: 2px 10px 2px 10px;
	text-decoration: none;
	border: 1px solid #9c9c9c;
	margin-left: 1px;
}
.head a.file:hover, .head a.selected {
	background: #fff;
	background-image: linear-gradient(to bottom, #fff, #ccc);
	border-radius: 3px 8px 0px 0px;
	color: #000000;
	padding: 2px 10px 2px 10px;
	text-decoration: none;
	border: 1px solid #9c9c9c;
	cursor: pointer;
	border: 1px solid gray;
}
.eContainer{
    position: absolute;
	top: 45px;
	bottom: 17px;
	left: 5px;
	right: 27%;
	margin-right: 10px;
}
.editor {
	font-family: Arial, Helvetica, sans-serif;
	display: inline-block;
	word-wrap: break-word;
	overflow-y: auto;
    padding: 5px;
    border-radius: 3px;
    background: white;
    border: 1px solid #9e9ea9;
    white-space: pre-wrap;
	width:100%;
	height:100%;
    margin-right:5px;
}
.right {
    padding: 2px;
    display: inline-block;
    border: 1px solid #9e9ea9;
    border-radius: 3px;
    vertical-align: top;
    background-color: #f1f1f1;
    position:absolute;
    top:45px;
    right:5px;
    bottom: 5px;
    left:74%;
    transition: 1s;
}
.right center {
	width:100%;
	height:100%;
	display:flex;
	flex-direction: column;
}
div.devchat{
	width: 92%;
    height: 99%;
    padding: 5px;
    display: inline-block;
    border-radius: 3px;
    vertical-align: top;
    background-color: #e4e3ea;
    margin: 5px auto;
    box-shadow: 0 0 7px #646b86;
    overflow-y: scroll;
    overflow-x: hidden;
}
div.msg {
	opacity: 0;
	padding: 6px;
    border-radius: 4px;
    border: solid 1px #ccc;
    text-align: left;
    margin: 2%;
    font: 100% "helvetica",arial,sans-serif;
    color: #6F767B;
    text-shadow: 0px 0px 0px #2b83bd;
    word-wrap: break-word;
    transition: 1s;
    background-color: #ededed;
}
.input {
    width: 94%;
    height: 84px;
    border: 1px solid #aaadb7;
    border-radius: 3px;
    padding: 4px;
    box-shadow: 0 0 7px #a0a4ab;
    background: #e4e3ea;
    margin: 5px auto;
    font: 100% "helvetica",arial,sans-serif;
    color: #59656b;
    padding: 2px;
    overflow: hidden;
}
.dialog{
	display:none;
	position:absolute;
	top:0px;
	right:0px;
	bottom:0px;
	left:0px;
	z-index:1;
	background:#7f7f7f;
	background:rgba(0,0,0,0.8);
	transition: 1s;
}
.dialog div{
	position:absolute;
	top:15%;
	right:25%;
	width:50%;
	height:75%;
	background:#e3e3e3;
	border-radius:3px;
	overflow:auto;
	display:flex;
	flex-direction: column;
}
.dialog ul{
	padding-top:20px;
	padding-bottom:20px;
	margin-bottom:0px;
	background:#fff;
	flex:1;
}
.dialog li{
	list-style-type:none;
    background-repeat: no-repeat;
    padding:5px 0px 1px 35px;
}
.dialog li:before {
     position: absolute;
     margin: -4px 0 0 -35px;
     min-height: 32px;  
     background: url(sprite.png) no-repeat;
     width:30px;
     content:"";
     vertical-align: middle;
 }
.dialog li:hover {
    text-decoration: underline;
    cursor:pointer;
}
.dialog li.folder:before {
	background-position: -97px -0px;
}
.dialog li.php:before {
	background-position: -32px -126px;
}
.dialog li.html:before {
	background-position: -129px -126px;
}
.dialog li.css:before {
	background-position: -97px -126px;
}
.dialog li.js:before {
	background-position: 0px -126px;
}
.dialog li.png:before {
	background-position: -64px 0px;
}
li.L0, li.L1, li.L2, li.L3, li.L5, li.L6, li.L7, li.L8 {
	list-style-type: unset;
}