/*body{
	overflow: hidden !important;
	position: fixed !important;
	top : 0px !important;
	height: 100% !important;
	width: 100% !important;
}*/
.body-treeview{
	/* สีน้ำฟ้า*/
	/*background:#71B1D1;*/
	
	/* สีน้ำเงิน */
	background: #F2F2F2;
}
/*#0072C6*/
/*#505254*/

/* #0072C6 */
/*rgba(224, 219, 191, 0.17)*/
@font-face {
  font-family: 'FontAwesome';
  src: url('../fonts/fontawesome-webfont.eot?v=4.3.0');
  src: url('../fonts/fontawesome-webfont.eot?#iefix&v=4.3.0') format('embedded-opentype'), url('../fonts/fontawesome-webfont.woff2?v=4.3.0') format('woff2'), url('../fonts/fontawesome-webfont.woff?v=4.3.0') format('woff'), url('../fonts/fontawesome-webfont.ttf?v=4.3.0') format('truetype'), url('../fonts/fontawesome-webfont.svg?v=4.3.0#fontawesomeregular') format('svg');
  font-weight: normal;
  font-style: normal;
}
.fa {
  display: inline;
  font: normal normal normal 14px/1 FontAwesome;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  transform: translate(0, 0);
}

.menu-container {
	/*margin:0 -15px;*/
}
.head-menu{
	padding-top: 20px;
	padding-bottom: 15px;
	margin-left: 10px;
	color: rgba(51, 46, 46, 0.89);
	font-size: 14px;
	font-weight: bold;
	font-family: "Sans-serif",tahoma;
}
.treeview {
	/*font-family: "Segoe UI","Open Sans","serif";*/
    padding: 0;
    margin: 0;
    font-size: 15px;
    color: rgba(51, 46, 46, 0.89);
	white-space: nowrap;
	
	/* สีฟ้า */
    /*background-color: #71B1D1;*/
	
	/* สีน้ำเงิน */
	/*background-color:#336699;*/
}
.treeview ul {
	position : relative;
	right:30px;
	margin-top : 0px !important;
}
.treeview-hover {
	right: 100px;
	padding-left: 115px !important;
	display : block;
	height :auto;
	width: 100%;
	/* dark theme color */
	background-position : 184px center !important;
	z-index:150;
	/*light theme color
	background: #7CC1DE !important;
	background-position : 184px center !important;*/
	
}

/* fix for IE6 */ 
* html .hitarea {
    display: block;
    float: none;
}

.treeview li {
	list-style: none;
    line-height : 30px;
   /* padding: 3px 0px 3px 5px;*/
}

.treeview a {
    text-decoration: none;
    color: rgba(51, 46, 46, 0.89);
	font-family: "Sans-serif",tahoma;
}

#treecontrol {
    margin: 1em 0;
    display: none;
}

.treeview .hover {
    cursor: pointer;
}

.treeview li {
    background: url(../IMAGES/TREEVIEW/treeview-default-line.gif) 0 0 no-repeat;
}

.treeview li.collapsable, 
.treeview li.expandable {
	background-position: 0 -176px;
}

.filetree li {
	padding: 3px 0px 2px 12px;
	/* สีฟ้า   */
	/*background-color : #71B1D1;*/
	/*background-color:#F2F2F2;*/
}
.filetree .folder a {
	color: rgba(51, 46, 46, 0.89);
	font-family: "Sans-serif",tahoma;
}

.folder, .filetree .file {
    margin: auto 10px auto 5px;
    padding: 1px 0px 1px 16px;
    display: block;
	/*height: 100%;*/
}


.filetree .folder a:before{
	margin: auto 7px auto 5px;
	position:relative;
	font-family: 'FontAwesome';
	
	/* น้ำตาล */
	/*color: #8A531C ;*/
	/*  เทา */
	color: #CCCCCC;
	/* ส้ม */
	/*color: #E67300;*/
	
	/* กล่องสี่เหลี่ยม - */
	/*content: "\f147";*/
	/* รูปลูกศรชี้ลง */
	content:"\f0d7";
	/* รูป - */
	/*content: "\f068";*/
	
}

.filetree li.expandable .folder a:before{
	margin: auto 7px auto 5px;
   	position:relative;
	font-family: 'FontAwesome';
	width: 100%;
	/*color: #8A531C ;*/
	color: #CCCCCC;
	/* ส้ม */
	/*color: #E67300;*/
	
	/* รูปกล่องสี่เหลี่ยม+*/
	/*content: "\f196";*/
	/* รูปลูกศรชี้ขวา */
	content:  "\f0da";
	/* รูป + */
	/*content: "\f067";*/
	
}
.filetree .file{
	cursor: pointer;
}
.filetree .file a:before {
	margin: auto 7px auto 5px;
	position:relative;
	/*font-family: 'FontAwesome';
	content:"\f111";
	color: #CCCCCC;*/
}
.bg-click{
	position : relative;
	display : block;
	background-color : #DEDEDE !important;
	z-index : 200;
}
.a-click{
	color:  rgba(51, 46, 46, 0.89) !important;
}

.a-click:before{
	color: rgba(51, 46, 46, 0.89) !important;
}
/*
@media screen and (max-height: 1080px){
	.block-tree{
		top: 7% !important;
	}
}



@media screen and (max-height: 900px){
	.block-tree{
		top: 7% !important;
	}
	
	.head-menu{
		padding-top: 22px;
	}
}


@media screen and (max-height: 780px){
	.block-tree{
		top: 8% !important;
	}
	.head-menu{
		padding-top: 26px;
	}
}

@media screen and (max-height: 680px){
	.block-tree{
		top: 9% !important;
	}
	.head-menu{
		padding-top: 30px;
	}
}

@media screen and (max-height: 580px){
	.block-tree{
		top: 10% !important;
	}
	.head-menu{
		padding-top: 34px;
	}
}
*/
.block-tree{
	float:left;
	background-color: #F2F2F2;
	overflow-x:hidden;
	z-index: 100;
	height: 100%;
	width: 16%;
	display:block;
}
.block-tree .menu-container{
	width: inherit;
	background-color: transperent;
	z-index: 100;
	margin-bottom: 25%;
}