@font-face {
	font-family: 'icomoon';
	src:url('../fonts/icomoon/icomoon.eot?se601i');
	src:url('../fonts/icomoon/icomoon.eot?#iefixse601i') format('embedded-opentype'),
		url('../fonts/icomoon/icomoon.woff?se601i') format('woff'),
		url('../fonts/icomoon/icomoon.ttf?se601i') format('truetype'),
		url('../fonts/icomoon/icomoon.svg?se601i#icomoon') format('svg');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'icomoon2';
	src:url('../fonts/icomoon2/icomoon2.eot?se601i');
	src:url('../fonts/icomoon2/icomoon2.eot?#iefixse601i') format('embedded-opentype'),
		url('../fonts/icomoon2/icomoon2.woff?se601i') format('woff'),
		url('../fonts/icomoon2/icomoon2.ttf?se601i') format('truetype'),
		url('../fonts/icomoon2/icomoon2.svg?se601i#icomoon') format('svg');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'icomoon4';
	src:url('../fonts/icomoon4/icomoon4.eot?se601i');
	src:url('../fonts/icomoon4/icomoon4.eot?#iefixse601i') format('embedded-opentype'),
		url('../fonts/icomoon4/icomoon4.woff?se601i') format('woff'),
		url('../fonts/icomoon4/icomoon4.ttf?se601i') format('truetype'),
		url('../fonts/icomoon4/icomoon4.svg?se601i#icomoon') format('svg');
	font-weight: normal;
	font-style: normal;
}

html,body{padding:0;height:100%;margin:0;}
body{
	font-family:helvetica, Georgia ,Geneva, Verdana, sans-serif;
	font-size:90%;
	line-height:1.3em;
	color:#333;
	background-color:#fff;
	font-weight:normal;
	text-align:center;
	display:table;
	width:100%;
	height:100%;
}
a,div,span,section,header,td,textarea,input,h1,h2,h3,h4,input,button,textarea,select{
	box-sizing:border-box;font-size:1em;
}
a{
	text-decoration:none;
	color:#06c;
}
a:hover{
	text-decoration:underline;
}
hr{
	border:none;
	border-top:solid 1px #ccc;
	width:100%;
}
h2{
	font-weight:normal;
	font-size:1.2em;
	color:#ff3c00;
	margin:0px 0px;
	padding:0px;
}
input[type=text],input[type=password],textarea,select{
	border:				solid 1px #ccc;
	outline:			none;
	padding:			3px 6px;
	color:				#444;
}
input[type=text]:hover,input[type=password]:hover,textarea:hover,select:hover{
	border-color:		#999;
}
input[type=text]:focus,input[type=password]:focus,textarea:focus,select:focus{
	border-color:		rgba(82,168,236,.75);
	box-shadow:			0 0 4px rgba(82,168,236,.5);
	-moz-box-shadow:	0 0 4px rgba(82,168,236,.5);
	-webkit-box-shadow:	0 0 4px rgba(82,168,236,.5);
}
input[type=text]:disabled{
	background-color:	#eee;
}

input.text,textarea.textarea,select.select{
	border-radius:3px;
}






button.button{
	outline:none;
	padding:3px 10px;
	border:solid 1px #ccc;
	border-radius:2px;
	background-color:#fff;
	background-image:-moz-linear-gradient(top,#fff,#eee);
	background-image:-ms-linear-gradient(top,#fff,#eee);
	background-image:-o-linear-gradient(top,#fff,#eee);
	background-image:-webkit-linear-gradient(top,#fff,#eee);
	background-image:linear-gradient(top,#ffffff 0,#eee 100%);
}
button.button:hover{
	color:#ff3c00;
}






body{
	text-align:center;
	padding:0px;
}
body > div{
	display:table;
	width:100%;
	height:100%;
	background-color:#fff;
}
body > div > div{
	display:table;
	width:100%;
	height:100%;
}
body > div > div > div{
	display:table-row;	
	height:100%;
}
body > div > div > div > div{
	display:table-cell;
	max-width:1000px;
	text-align:center;
	height:100%;
	width:100%;
}
body > div > div > div > div > div{
	display:inline-block;
	max-width:1800px;
	width:100%;
	text-align:left;
	box-shadow:0px 0px 10px 5px rgba(0,0,0,0.1);
	
	height:100%;
}
body > div > div > div > div > div > div > table > tbody > tr > td > h1{
	font-size:1.5em;
	margin:0px 0px;
	padding:0px 0px 10px 0px;
	color:#fff;
}




.apptree{
	list-style:none;
	line-height:2em;
	padding:0px;
	margin:0px;
	border-bottom:solid 1px #ccc;
	max-width:200px;
}
.apptree ul{
	list-style:none;
	padding:0px;
	line-height:2em;
}
.apptree ul > li > a,.apptree > li > a{
	display:block;color:#555;
	border-left:solid 1px #ddd;
	border-right:solid 1px #ddd;
}
.apptree ul > li > a:hover,.apptree > li > a:hover{
	color:#06c;
}
.apptree > li > a{
	border-left:solid 3px #ff3c00;
}
.apptree ul > li,.apptree > li{
	border-top:solid 1px #ddd;
}
.apptree ul > lix:before,.apptree > lix:before{
	display:inline-block;
	content:"\e61b";
	font-family:"icomoon";
	width:20px;
	text-align:center;
	color:#999;
	font-weight:normal;
	vertical-align:middle;
	position:relative;top:-2px;
}






.shiftmeter{
	position:absolute;
	bottom:-1px;width:0;
	background-color:rgba(255,0,30,0.8);
	height:1px;
	left:0px;
}



.op-done > *:before{display:inline-block;content:"\f00c";font-family:"icomoon2";width:30px;text-align:center;color:#06c}
.op-error > *:before{display:inline-block;content:"\f00d";font-family:"icomoon2";width:30px;text-align:center;color:#f03}
.op-down > *:before{display:inline-block;content:"\e60c";font-family:"icomoon";width:30px;text-align:center;color:#090}

span.vs-edit,span.vs-add,span.vs-remove{display:inline-block;}




.css_fieldDesc{
	width:100%;
	color:#666;
	font-style:italic;
	font-size:0.9em
}
.css_fieldDesc > span > b{
	display:inline-block;
	min-width:60px;
	font-style:normal;
}
.css_maxfieldwidth {
	position:relative;
	min-width:100px;
}
.css_maxfieldwidth > span{
	padding-right:20px;
	top:7px;
	position:absolute;
	max-width:100%;
	
	overflow:hidden;
	display:block;
	text-overflow:ellipsis;
}



h2.bom-idnt{
	color:#ff3c00;
	font-size:1.2em;
	margin:20px 0px 3px 0px;
	padding:0;
}
.noselect {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
.header-ribbon{
	position:relative;
	z-index:30;
	background-color:#fff;
	padding:15px;
	border-bottom:solid 1px #ccc;
	box-shadow:0px 4px 3px rgba(0,0,0,0.1);
}

.tran-deleted > td{
	background-color:#f7f7f7;
	color:#888;
}


/*chart.js*/
.chartjs-tooltip {
	position: absolute;
	background: rgba(0, 0, 0, .8);
	color: #fff;
	padding: 3px;
	border-radius: 5px;
	transition: all .1s ease;
	pointer-events: none;padding:10px;
	box-shadow:2px 2px 3px rgba(0,0,0,0.5);
	display:none;
}
.chartjs-tooltip-section{
	padding:1px;
}
.chartjs-tooltip-key{
	display:inline-block;
	width:14px;
	height:11px;
	border-radius:2px;
	border:solid 1px rgba(255,255,255,0.2);
}
.chartjs-tooltip-value > b{
	font-weight:normal;
	padding-left:7px;
	display:inline-block;
	min-width:30px;
	padding-right:10px;
}
.chartjs-tooltip-title{
	display:block;
	text-align:center;
	padding-bottom:4px;
	font-size:1.1em;
	font-weight:bold;
}


#cssViewer{
	display: -webkit-box;display: -moz-box;display: -ms-flexbox;display: -webkit-flex;display: flex;
	flex-wrap:wrap;
}
#cssViewer > a{
	display:inline-block;
	min-width:180px;
	text-align:center;
	border:solid 1px #ddd;
	margin:1px;
	border-radius:5px;
	color:#333;
	padding:0px 10px;
	vertical-align:top;
	background-image:-moz-linear-gradient(top,#fff,#eee);
	background-image:-ms-linear-gradient(top,#fff,#eee);
	background-image:-o-linear-gradient(top,#fff,#eee);
	background-image:-webkit-linear-gradient(top,#fff,#eee);
	background-image:linear-gradient(top,#ffffff 0,#eee 100%);
	
	-webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
	
	-webkit-box-flex: 1;-moz-box-flex: 1;-webkit-flex: 1;-ms-flex: 1;flex: 1;
}
#cssViewer > a:hover{
	text-decoration:none;
	color:#06c;
	border-color:#999;
}
#cssViewer > a:active{
	background-image:-moz-linear-gradient(top,#eee,#fff);
	background-image:-ms-linear-gradient(top,#eee,#fff);
	background-image:-o-linear-gradient(top,#eee,#fff);
	background-image:-webkit-linear-gradient(top,#eee,#fff);
	background-image:linear-gradient(top,#eeeeee 0,#fffffff 100%);
}

#cssViewer > span{
	display:inline-block;
	border-left:solid 1px #ccc;
	width:1px;
	height:90px;
	margin:10px 5px;
	vertical-align:top;
}
#cssViewer > a > span{
	display:block;
	font-family:icomoon4;
	font-size:40px;
	line-height:30px;
	padding:20px;
}
#cssViewer > a > h1{
	font-weight:normal;
	font-size:1em;
	display:inline-block;
}




.loading_overlay{
	position:fixed;
	background-color:rgba(255,255,255,0);
	left:0;top:0px;right:0;bottom:0;
	text-align:center;
	vertical-align:top;
	z-index:40;
	cursor:wait;
	display:none;
}
.loading_overlay > span{
	display:inline-block;
	height:100%;
	vertical-align:top;
}
.loading_overlay > div{
	display:inline-block;
	font-size:1em;
	margin-top:80px;
	font-family:Verdana, Geneva, sans-serif;
	color:#222;
	line-height:1em;
	padding:33px 20px 10px 20px;
	border-radius:10px;
	cursor:default;
	background-color:#fff;
	width:400px;
	height:100px;
	box-shadow:0px 0px 10px rgba(0,0,0,0.4);
}





#screenSector{
	display:inline-block;
	max-width:1000px;
	min-width:700px;
}
#screenSectorCol > tbody > tr > td > div > div > a{
	min-width:150px;color:#333;
}
#screenSectorCol > tbody > tr > td{
	white-space:normal;
	
}
#screenSectorCol > tbody > tr > td > div > div > span{
	background-color:#fff;min-width:60px;
	text-align:center;
}



#screenSectorCol > tbody > tr > td > div{
	display:inline-block;margin:0px 3px;
}

#navSideScreen{
	display:none;
	padding-top:60px;
	text-align:left;
	position:fixed;
	top:0px;
	left:-100%;
	background-color:rgba(0,0,0,0.9);
	z-index:30;
	max-width:250px;
	width:250px;
}
#navSideScreen > a{
	display:block;
	font-size:1em;
	line-height:1.9em;
	color:#eee;
	
	padding:5px 20px;
	text-shadow:1px 1px 0px #000;
}
#navSideScreen > a:hover{
	text-decoration:none;
	background-color:rgba(0,0,0,1);
}
#navSideScreen > a > span{
	font-family:icomoon4;
	padding-right:10px;
}
.screen_input_300{
	min-width:300px;
}
@media screen and (max-width:900px){
	#screenSectorCol > tbody > tr > td:first-child{
		display:none;
	}
	#screenSector{
		min-width:200px;
		width:100%;
	}
	#screenSectorCol > tbody > tr > td > div > a{
		color:#333;
	}
	.css_fieldDesc > span{
		display:none;
	}
}

@media screen and (max-width:480px){
	#screenSectorCol > tbody > tr > td{
		white-space:normal
	}
	#screenSectorCol > tbody > tr > td > div{
		display:inline-block;
		white-space:normal;
	}
	#screenSectorCol > tbody > tr > td > div > a{
		min-width:1%;
	}
}









