/* Advanced Editor (c) 2012-2017 Scriptol.com 
   Based on  Advanced Explorer (c) 2012 Scriptol.com */

#body, html {
	margin:0;
	padding:0;
	overflow: hidden;
    background:black;
}

#toolbar {
    position:absolute;
    top:0;
    left:0;
    right:0;
    display:block;
	height: 36px; 
	background: url("../images/back.png");
	border:1px solid #CCC;
	padding:4px 8px 0px 8px;
    margin:0 0 8px 0;
}

.imagebutton 
{
	display:inline-block;
	margin-right:2px;
	border-radius:4px;
    box-sizing: border-box;	
	border:1px solid #DDD;
	height:34px;
	width: 34px;
    float:left;
}

.imagebutton:hover
{
	border:1px solid #333;
}

.image {
	position: relative; 
	height:32px; 
	width:32px; 
	border:none;
    margin:0;
}

.buttonInput {
	display:inline-block;
	margin-right:2px;
    box-sizing: border-box;	
	height:34px;
	width: 64px;
    float:left;
}
#line {
    margin-top:4px;
}

#main {
	position: absolute;
	top: 42px;
	right: 0;
	bottom: 0;
	left: 0;
	margin:0;	
	padding:0;
	border:1px solid #999;
    background: black;
}

#project {
	position:relative;
	top:0px;
	left:0;
	bottom:0;
	width:200px;
	height:100%;
	overflow:hidden;
	border-right:1px solid #888;
	display:block;
    background:black;
}

#prjbar {
	position:absolute;
	top:0;
	left:0;
	width:200px;
	height:28px;
	padding:4px;
	margin:0;
	overflow:hidden;
	background: url("../images/darkbar.png");
	padding:4px 4px 0px 4px;
}

#prjlist {
	position:absolute;
	top:29px;
	left:0;
	bottom:28px;	
	width:100%;
    height:auto;
	padding:8px 2px 8px 2px;
	margin:0px;
	background:black;
    color:white;
    overflow-y:scroll; 
}

#prjlist p {
    margin:2px 4px 2px 2px;
    padding:0 4px 0 4px;
    overflow:hidden;
    width:auto;
    font-size:14px;
	font-family:Arial, Tahoma, sans-serif;
	border:1px solid black;
	border-radius:4px;  
}

#prjlist p:hover {
	border:1px solid #aaa;	
}


#allprjs {
    position:absolute;
    bottom:0;
    left:0;
    right:0;
    width:200px;
    height:27px;
    background: url("../images/darkbar.png");
    border-top:1px solid #888;
}

#currprj {
    font-size:16px;
    font-weight: bold;
    padding:4px 4px 4px 0px;
    line-height:22px;
    color:#888;
    font-family: Arial, serif;
    text-align:center;
}

#epanel, #lpanel, #openel, #apanel, #dbpanel { 
	position: absolute;
    float:left;
	padding:0;
	top: 0px;
	right: 0px;
	bottom: 0px;
	left: 201px;  
    background: green;
}

#epanel {
	display:block;    
}

#lpanel, #opanel, #apanel, #dbpanel {
	display:none;
    background:#eee;
}

#apanel {
    text-align:center;
    padding:16px;
	width:auto;
	height:100%;    
}

#loader {
	display:block;
	width:100%;
	height:100%;
	border: none;
	overflow:visible;
	padding:0;
	margin:0;
	
}

#manual {
	display:block;
	width:100%;
	height:100%;
	border: none;
	overflow:visible;
	padding:0;
	margin:0;
	
}

#editor {
    position:absolute;
    display:block;
    top:0;
    left:0;
    width:100%;
    bottom:28px;
    background:black;
}

#statusbar {
    display:block;
    position:absolute;
    left:0px;
    right:0;
    bottom:0;    
    height:28px;
    background: url("../images/prjback.png");
    background: #333;
    border-top:1px solid #666;
    padding:2px;
    margin-top:-32px;
    box-sizing: border-box;
}

#statustext {
    display:block;
    position:absolute;
    top:2px;
    left:4px;
    right:4px;
    height:20px;
    line-height:18px;
    color:#999;
    margin:2px;
    padding:0px 8px 2px 8px;
    border-radius:4px;
    overflow:hidden;
    box-sizing: border-box;  
    font-size:12px;
    font-family: Arial;
}

.sideright {
    position:relative;
    float:right;
    right:0px;
    padding:0;
    overflow:visible;
}

.tfield, #dbgroup {
    position:relative;
    display:inline-block;
    float:left;      
    line-height:20px;
    padding:2px 8px 2px 8px;
    margin:4px 4px 0px 0;
    background:#ddd;
    color:#000;
    font-family:Arial, sans-serif;
}

.tfield, .dbfield {
    border:1px solid #999;
    border-radius:4px;   
    background: none;
    overflow:hidden;    
}


.dbfield {
    position:relative;
    display:inline-block;    
    float:left;  
    padding:4px 8px 2px 32px;
    margin:4px 4px 0px 0;    
    background-image: url("../images/dbfile.png");
    background-repeat: no-repeat;
    overflow:visible;
    color:#000;
    font-weight:normal;
    font-family:Arial, sans-serif;   
    min-width:96px;
}


.indicator {
	position:relative;
	right:0px;
	display:inline-block;
	height: 34px; 
	width: 34px; 
	padding:1px 0 1px 1px;	
}

#quit {
	position:relative;
    float:right;
	right:0px;
	display:inline-block;
}



.pimage, .primage, {
	position: relative; 
	height:22px; 
	width:22px; 
	border:none;
}

.primage {
    float:right; 
    margin-right: 16px;
}


/* Insert tooltip */

.insert {
    display:block;
    position:relative;
    font-family: Arial,serif;
}

.insert .comlist {
    display:none;
    color:black;
    background:#E8E8E8;	
    font-size:13px;
}

.insert p {
    margin:6px 2px 2px 8px;
}

.insert:hover .comlist {
    display:block;
    position:absolute;
    top:16px;    
    left:0;
    z-index:1005;
    width:128x;
    min-width:128px;    
    max-width:128px;
    min-height:40px;
    border:1px solid #BBB;    
    overflow:visible;
    padding:0 0 6px 0;
}

.insert h3 {
    margin:0;
    padding:3px 3px 1px 0;
    margin-bottom:4px;
    background: #CCC;
    color:#000;
    font-size:12px;
    font-weight:bold;
    text-align:center;
    border-bottom:1px solid #BBB;
}

.insert p .shortcut {
    float:right;
    padding-right:8px;
}

/* Project tooltip */

#prjSet {
    display:block;
    position:relative;
    font-family: Arial,serif;
}


#prjSet span {
    display:none;
    border-radius:8px;
    color:black;
    background:white;	
}

#prjSet span img {
    float:left;
    margin:0px 8px 8px 0;
}

#prjSet p {
    margin:4px 2px 2px 8px;
}

#prjSet:hover span {
    display:block;
    position:absolute;
    left:0;
    bottom:8px;    
    z-index:1000;
    width:196x;
    height:580px;
    min-width:196px;    
    max-width:196px;
    min-height:128px;
    border:2px solid #ccc;    
    overflow-x:visible;
    overflow-y:scroll;
    padding:0;
    background: #ccc;
}

#prjSet h3 {
    margin:0;
    padding:3px 3px 1px 0;
    margin-bottom:4px;
    background: #666;
    color:#ccc;
    font-size:12px;
    font-weight:bold;
    text-align:center;
    border-bottom:1px solid #ccc;
}

.prjIna {
    font-weight:normal;
    color:#666;
}

.prjAct {
    font-weight:bold;
    color:#000;
}

.prjctxm {
    position:absolute;	
    width: 96px;
    height:20px;
    min-height:20px;
    padding: 1px 8px 1px 8px;
    margin:0;
    left:0;
    top:0;
    border: 1px solid #999;
    border-radius:4px;
    color:black;
    background: #F8F8F8;
    z-index:1000;
    overflow: visible;
    font-weight:normal;
	font-size:13px;
	font-family:Arial, Helvetica, sans-serif;
}

.prjctxm p {
    border:none !important;
}

.prjctxm p:hover {
    font-weight:bold;  
    border:none !important;
}

#sDialog {
    border-top: 1px solid #ccc;
    border-left: 1px solid #ccc;
    border-right: 1px solid #666;
    border-bottom: 1px solid #666;
    border-radius:6px;
    padding:16px;
} 

#sDialog p {
    margin-left:16px;
    font-weight: bold;
}

#sDialog menu {
    text-align:center;
    padding:0;
    margin:8px;
} 

#sDialog button {
    width:96px;
    margin:0 2px 0 2px;
} 

#dbWin {
    padding:16px 32px 32px 32px;
    width:100%;
    font-size:16px;
    font-family: Arial, serif;
    overflow:hidden;
    box-sizing: border-box;    
}

#dbWin > div {
    display: inline-block;
    background: #CCC;
    padding:16px 32px 16px 32px;
    margin:8px 0 24px 0;
    border-radius: 8px;
    border:1px solid #999;
    box-sizing: border-box;
    width:auto;
    font-weight: bold;
    overflow:hidden;
}
#dbWin button {
    margin: 8px;
    padding:4px 16px 4px 16px;
    width;120px;
    height:32px;
    border-radius:6px;
    font-size:14px;
}

#dbWin #read {
    display: inline-block;
    padding:0;
    margin:8px 0 16px 0;
    width:auto;
    font-weight: bold;
}

#dbWin #lfield {
    display: block;
    position:absolute;
    -margin:0 32px 8px 0;
    top:160px;
    left:16px;
    right:16px;
    bottom:8px;
    padding:8px;
    background: #F8F8F8;
    box-sizing: border-box;
    min-width:400px;
    min-height:160px;
    padding:0;
    border:1px solid #aaa;
    overflow:scroll;        
}

#dbWin #itemList {
    padding:8px 0 8px 0;
    margin:0;
    font-weight: normal;
    width:100%;
    color:black;

}

#dbWin #itemList .led {
    color:white;
}

#dbWin #itemList .led:hover {
    color:#F0F0F0;
}

#dbWin #itemList .ledf {
    color:black;
}


#dbWin #itemList .liTitle {
    display:inline-block;
    width:30%;
    padding-left:8px;
}


#dbWin #itemList li:hover {
    font-weight: bold;
    background-color: #E0E0E0;
}

#dbWin #itemList .liDate {
    display:inline-block;
    width:140px;
}

#dbWin #itemList .ilact {
    display:inline;
    padding:0;
    margin:0;
}

#dbWin #itemList .cross {
    float:right;
    width:24px;    
}
