/*------- ko_util.css --------*/
/*------------------ file upload ------------------*/
div.file_box
{
    position: relative;
    display: inline-block;
    float: left;
    height: 220px;
    margin: 3px;
    overflow: hidden;
    padding: 5px;
    width: 220px;
    border: 1px solid #666666;
}
div.file_box_close
{
    background: none repeat scroll 0 0 #FF3300;
    display: inline-block;
    font-size: 2em;
    height: 30px;
    line-height: 20px;
    margin: 3px;
    position: absolute;
    right: 3px;
    text-align: center;
    vertical-align: middle;
    width: 30px;
}
div.upload_box
{    
    background: none repeat scroll 0 0 #DEE9EB;
    border: 1px solid #DDD;
    color: #4C596C;
    display: block;
    height: 200px;
    padding: 10px;
    position: relative;
    text-align: center;
    vertical-align: middle;
    width: 200px;
    overflow: hidden;
    margin: 0 auto;
}
div.upload_box > .bt
{        
    background: none repeat scroll 0 0 #58AD52;
    border-radius: 3px;
    bottom: 5px;
    color: #FFFFFF;
    cursor: pointer;
    font-size: 20px;
    height: 30px;
    left: 5px;
    padding: 5px;
    position: absolute;
    right: 5px;
}
div.upload_box > .out
{        
    background: #F29826;
    font-size: 0.9em;
}
div.upload_box > .info
{        
    cursor: default;
}
div.upload_box > img.thumb
{        
    font-size: 0.7em;
    height: 120px;
    margin: 5px;
    overflow: hidden;
    max-width: 200px;
    max-height: 220px;
}
/*------------------ loader ------------------*/
.ajax_loader {
    background: url("../img/spinner_squares_circle.gif") no-repeat scroll center center transparent;
    height: 100%;
    width: 100%;
}


/*------------------ tree ------------------*/

ul.root_tree
{
	list-style-type: none;
	padding-left: 2px;
}

ul.root_tree ul { 
	list-style-type: none;
	padding-left: 15px;
	margin-left: 0.2em;
}
ul.root_tree li {	
	border-left: 2px solid #0097C3;
}

ul.root_tree li:last-of-type {	border-left: 0px solid transparent;	}
/*ul.root_tree li:last-of-type > ul{	margin-left: 0.2em;}*/
		
ul.root_tree ul div {
	display: inline-block;
}

ul.root_tree div.nodeelement
{
    display: block;
    margin-left: 10px;
    position: relative;
    min-height: 35px;
    /*font-size: 0.9em;*/
}
ul.root_tree div.nodeelement::before
{
    content: " ";
    display: inline-block;
    top: -15px;
    left: -12px;
    position: absolute;
    width: 8px;
    height: 25px;
    border-left: 2px solid #0097C3;
    border-bottom: 2px solid #0097C3;
}

ul.root_tree li:last-of-type > div.nodeelement::before
{
    left: -10px;
}
ul.root_tree > li >div.nodeelement::before
{ 
    content: "";
    border-left: 0px solid transparent;
    border-bottom: 0px solid transparent;
}

ul.root_tree div.nodeelement p
{
    display: table-cell;
    padding: 0 3px;
    padding-left: 8px;
    margin: 0px;
}

ul.root_tree ul
{
    margin-bottom: 0px;
    font-size: 16px;
}

span.expandbutton{
	display: inline-block;
	position: relative;
	width: 12px;
	height: 12px;
	color: #FFF;
	background: #0097C3;
	padding: 3px;
	line-height: 12px;
	text-align: center;
	/*border: 1px solid #333;*/
	cursor: pointer;
	float: left;
    border-radius: 3px;
}

ul.root_tree a{text-decoration: none; color: #FFF;}
span.nodevalue{
	display: inline-block;
	font-size: 0.8em;
}
a.nodebutton{
	display: inline-block;
	color: #FFF; 
	height: 20px;
	background: #333;
	line-height: 20px;
	text-align: center;
	padding: 2px 5px;
	margin: 2px;
	border-radius: 3px; 
}
.input_lock{ color: #FFF; Background: #BBB;}
a.ok{background: #EC0;}
a.cancel{background: #888;}
a.off{background: #F33;}
a.on{background: #00BB33;}
a.select{background: #0097C3;}
a.add{background: #00BB33;}


/*------------------ file upload element ------------------*/

div.file_box
{
	position: relative;
	display: inline-block;
	float: left;
	height: 220px;
	margin: 3px;
	overflow: hidden;
	padding: 5px;
	width: 220px;
	border: 1px solid #666666;
}
div.file_box_close
{
	background: none repeat scroll 0 0 #FF3300;
	display: inline-block;
	font-size: 2em;
	height: 30px;
	line-height: 20px;
	margin: 3px;
	position: absolute;
	right: 3px;
	text-align: center;
	vertical-align: middle;
	width: 30px;
}