* {
        font-family: Verdana, Arial,  sans-serif; 
        letter-spacing: 0.2px;
        word-spacing: 1.7px;
        font-size: 10px;
        line-height: 17px;

}

body
{
    margin:10px 10px 10px 10px;
}

table
{
	color: #222;
}

.modded 
{
    background-color: #ccc;
    font-weight: bold;
    border-bottom: 2px solid #000000;
}

.footer
{
	text-align: center;
	font-size: 9px;
	color: #ddd;
}

.button {
	background-color: #22221a;
	color: #ddd;
	padding: 1px 4px;
	margin: 2px;
	border: 1px solid #443;
}

.button:hover {
	background-color: #32322a;
	border: 1px solid #554;

}

.blackbutton {
	background-color: #000000;
	color: #ddd;
	padding: 1px 4px;
	margin: 2px;
	border: 1px solid #221;
}

.blackbutton:hover {
	background-color: #111111;
	color: #fff;
	border: 1px solid #554;
}

.newbutton {
	background-color: #443;
	color: #eee;
	border: 1px solid #776;
	padding: 1px 4px;
	margin: 2px;
}

.newbutton:hover {
	background-color: #554;
	color: #fff;
	border: 1px solid #887;
}



.bigbutton {
	 height:30px;
	 width:100px;

}


.textbox {
	background-color: #eed;
  	color: #000;
    padding: 2px 4px;
    margin: 2px;
	border-top: 1px solid #080808;
	border-left: 1px solid #080808;
	border-right: 1px solid #555555;
	border-bottom: 1px solid #555555;
	font-size: 12px;
}

.noborder {
 border: 1px solid #ffffff;
	background-color: #32322a;

}

h1
{
font-size: 31px;
color: #555555;
}

h2
{
font-size: 25px;
color: #555555;
margin: 12px;
}


h3
{
font-size: 20px;
color: #555;
margin: 10px;
}

h4
{
font-size: 15px;
color: #555;
margin: 7px;
}

h5
{
font-size: 12px;
color: #555;
margin: 0px;
}


/* General page style */
a {
	color:#40c;
	text-decoration:none;
}

a:hover {
	color:#000;
}

a.s2 {
	color:#333;
	text-decoration:none;
    border-bottom: 1px dotted #666;
    padding-bottom:0px;
    margin-bottom:2px;
}

a.s2:hover {
	color:#000;
    border-bottom: 1px solid #000;
}

a.white {
	color:#402E18;
	FONT-SIZE: 10px;
	FONT-WEIGHT: bold; 
	FONT-FAMILY: Verdana, Helvetica; text-decoration:none;
}

a:hover.white {
	color:#0B0B0B;
	text-decoration:underline;
}




a.red {
	color:#ff4400;
	text-decoration:none;
}


a:hover.red {
	color:#882200;
}

a.orange {
	color:#ff8800;
	text-decoration:none;
}

a:hover.orange {
	color:#ff5500;
}

a.xsmall {
	color:#ff8800;
	text-decoration:none;
}

a:hover.xsmall {
	font-size: 10px;
	color:#ff5500;
}


.infoBox
{
    padding: 10px 10px 10px 70px;
}


form {
	margin:0px 0px 0px 0px;
}


.link {
	color:#333366;
	text-decoration:none;
	border-bottom: 1px dotted #000000;
	cursor: pointer;
}
.link:hover {
	color:#666688;
}


hr {
	height: 1px;
	border-top: 1px solid #221;
	border-bottom: 1px solid transparent;
}



.small {
        font-size: 10px;
        font-weight: normal;
}

.small2 {
        font-size: 10px;
        font-weight: normal;
        color: #f0f0f0;
}

.quote {
        color: #885;
        background-color: #32322a;
        padding: 14px;
        margin: 0px 20px 0px 20px;
        border: 1px solid #110;
}

.tbl1
{
    background-color: #ddd;
}

.tbl2
{
    background-color: #eee;    
}

.header
{
    background-color: #3e5b82;
    
    
}

.header a
{
    color:#ccc;
}

.header a:hover
{
    color:#fff;
}

.datagrid
{
    background : #F5F5F9;
    padding: 0px;
    border: 1px solid #cccccc;
    font-size: 10px;
}

.datagrid tr
{
    background-color: #DFDFE5;
    color: #000000;
}

.datagrid tr:nth-child(even) td {background: #EEEEEE; }
.datagrid tr:nth-child(odd) td {background: #f4f4f4;}


.datagrid tr.active:nth-child(even) td {background: #d6e6d6; }
.datagrid tr.active:nth-child(odd) td {background: #dfefdf;}


.rowable tr:hover:nth-child(even) td {background: #cccccc; }
.rowable tr:hover:nth-child(odd) td {background: #cccccc;}
.rowable tr:hover:nth-child(even) th.free {background: #aaa; }
.rowable tr:hover:nth-child(odd) th.free {background: #aaa;}

.rowable tr.signed:nth-child(even) td {background: #dcc; }
.rowable tr.signed:nth-child(odd) td {background: #e5d5d5;}
.rowable tr.signed:nth-child(even) th {background: #baa; }
.rowable tr.signed:nth-child(odd) th {background: #c5b5b5;}


.datagrid tr.panel td
{
    background-color: #ccc;
    color: #000000;
}
.datagrid tr.panel:hover td
{
    background-color: #ccc;
    color: #000000;
}

.datagrid .inactive
{
    background-color: #bbb;
    color:  #888;
}

.datagrid .condition_1
{
    background-color: #6d6;
    color:  #000;
}

.datagrid .condition_2
{
    background-color: #d66;
    color:  #000;
}

.datagrid .condition_3
{
    background-color: #dd6;
    color:  #000;
}

.datagrid .large, .datagrid .large *
{
    text-align: center;
    font-size: 22px;
    font-weight: bold;
    line-height: 54px;
    vertical-align: middle;
}

.datagrid th
{
    line-height: 19px;
    color: #444;
}

.datagrid td
{
    padding: 1px 10px 1px 10px;
    background-color: #EEEEEE;
    color: #000000;
}

.datagrid caption
{
    color: #000000;
    padding-bottom: 10px;
    font-size: 13px;
    font-weight: bold;
}

.datagrid caption .sub_head
{
    color: #444444;
    padding-bottom: 10px;
    font-size: 10px;
    font-weight: bold;
}

.datagrid a 
{
    color: #000055;    
    border-bottom: 1px dotted #666;
}

.datagrid a:hover
{
    color: #000;    
    border-bottom: 1px solid #000;

}

.datagrid .sort a
{
    color: #5c6987;    
    border-bottom: 0px;
}

.datagrid a.problem {
    color: #ee2222;
    font-weight: bold;
}


#newMachine input[type=text], #newMachine select,
#moveMachine input[type=text], #moveMachine select
{
  width:120px;
}

.info
{
    border: 1px solid #555;
    background: url('images/background_info.png') no-repeat;
    background-color: #ddd;
    color: #000088;
    padding: 20px 64px 20px 64px;
    text-align: center;
    margin: 20px;
    width: 500px;
}

.warning 
{
    border: 1px solid #555;
    background: url('images/background_warning.png') no-repeat;
    background-color: #ddd;
    color: #000088;
    padding: 20px 64px 20px 64px;
    text-align: center;
    margin: 20px;
    width: 500px;
}

.error 
{
    border: 1px solid #555;
    background: url('images/background_error.png') no-repeat;
    background-color: #ddd;
    color: #a50000;
    font-weight: bold;
    padding: 20px 64px 20px 64px;
    text-align: center;
    margin: 20px;
    width: 500px;
}


.input_field
{
    margin-left: 20px;
    width: 240px;
    padding: 2px;
}

.input_field[readonly]
{
    border: 1px solid #ddd;
    background-color: #eee;
    margin-left: 20px;
    width: 240px;
    padding: 2px;
}

.input_field2
{
    width: 80px;
    padding: 2px;
}
.input_field2[readonly]
{
    width: 80px;
    border: 1px solid #ccc;
    background-color: #ddd;
    padding: 2px;
}

.input_field3
{
    margin-left: 10px;
    width: 140px;
    padding: 2px;
}

.link
{
    cursor:pointer;
}

a.dp-choose-date {
	float: left;
	width: 16px;
	height: 16px;
	padding: 0;
	margin: 5px 3px 0;
	display: block;
	text-indent: -2000px;
	overflow: hidden;
	background: url(images/12_calendar.gif) no-repeat; 
}
a.dp-choose-date.dp-disabled {
	background-position: 0 -20px;
	cursor: default;
}
/* makes the input field shorter once the date picker code
 * has run (to allow space for the calendar icon
 */
input.dp-applied {
    margin-left: 20px;
	width: 140px;
	float: left;
    padding: 2px;
}

.quick_search_input
{
    background-color: #9eb1c9;
    color: #000;
    border: 1px solid #ccc;
}

.l {
text-align:left;
}


span.r {
	float : right;
	width : auto;
	text-align : right;
}

span.l {
 	float : left;
 	width : auto;
	text-align : left;
}


/*.machineview  span
{
	font-size: 11px;
}
*/
.machineview br
{
	line-height: 27px;
}

.machineview textarea
{
    padding:5px;
}

.machineview textarea[readonly]
{
    border: 1px solid #ccc;
    background: #ddd;
}


.datagrid .boldGray{
	color : #666666;
}

.datagrid .boldGray a{
	color : #555555;
}

.datagrid .boldRed{
	font-weight: bold;
	color : #FF231d;
}

.datagrid .boldRed a{
	font-weight: bold;
	color : #FF3612;
}

.not_important {
	color: #999;
	font-size: 8px;

}

.red {
    color: #ff0000;
}

.filter{
	background : #eeeeff;
	line-height: 25px;
	border : 1px solid #ccc;
	padding : 10px 10px 10px 10px !important;
	padding : 0px;
}


.filterlink {
	color: #212980;
	font-weight: bold;
	text-decoration:none;
	cursor: pointer;
}

.filterlink:hover {
	color: #4149a0;
	text-decoration:underline;
	cursor: pointer;
}


.allinfotable {
	font: normal 10px verdana, arial, helvetica, sans-serif;
	background : #f5f5f9;
	line-height: 15px;
	margin-bottom : 20px;
	border : 1px solid #ccc;
	overflow : hidden;
}

.width200
{
	width: 200px;
}

.cent{
	textalign: center;
}

.tooltip{ 
	background-color:#ffffff;
	padding:20px;
	border: 1px solid #dddddd;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 3;
	display: none;
}

.span_warning {
   color : #ff0000; 
}

.plan {
    position: absolute;
    top:10px;
    left: 10px;
}

.plan img {
    width: 1000px;
}

.plan_hidden
{
   display:none;
}

.plan_show
{
   display:block;
}

.plan_next_to {
    position: relative;
    top:10px;
    left: 10px;
    float: left;
}

.plan_next_to img{
    width:500px;
}


 .plan_small
 {
    width: 90px;
 }


.hud 
{
    width:100px;
    height:100%;
    background-color:rgba(0,0,0,0.3);
    right:0px;
    top:0px;
    position:fixed;
    z-index:9999;
    color: #fff;
    padding: 10px;
    overflow:auto;
    text-align:center
}
.hud_header
{
    color: #fff;
    font-size: 10px;
    font-weight: bold;
}
.hud_header hr
{
    color: #ffffff;
}

.plan_small_selected
{
    border: 2px solid #f00;
}

.edit_type
{
    padding-left: 10px;
    font-weight: bold;
    color: #08c;
}

ul
{
    list-style-type:disc;
}


.centralized 
{
    text-align: center;
    
}

.item_quantity
{
    text-align: center;
    width: 50px;
    border: 1px solid #777;
    cursor: pointer;
}

.inv_normal
{
    background-color: #77ff77;
}

.inv_faulty
{
    background-color: #ff7777;
}

.inv_service
{
    background-color: #ffff77;
}

.inv_quantity_input {
    margin-top: 4px;
    height: 30px;
    vertical-align: middle;
    text-align: center;
    font-size: 14px;
    font-weight: bold;    
}

.inv_quantity_input[disabled]
{
    background: #eee;
    border: 1px solid #ccc;
}

.righter {
    float: right;
}

.lefter {
    float: left;
}

.action_form
{
    border: 1px solid #ddd;
    padding: 10px 2px 10px 2px;
    margin-bottom: 20px;
}

.item_details_change td
{ 
    text-align: center;
    height: 40px;
    vertical-align: middle;
    font-size: 12px;
    font-weight: bold;
    
}

.datagrid tr.row_pending td {
    background-color: #ccffcc;
}

.datagrid tr.row_confirmed td {
    background-color: #ccccff;
}

.datagrid tr.row_cancelled td {
    background-color: #ffcccc;
}

.hidden
{
   display:none;
}

.actions {
    padding: 10px;
    border: 1px solid #ddd;
}

.selector_mover_panel 
{
    width:320px;margin:2px; padding:2px; background-color:#eee; border:1px solid #ddd;
}    
.selector_mover_panel table tr th
{
    background-color: #ddd;
}
.selector_mover_panel table tr td
{}

.debug{
    background-color:#888888; margin:4px; padding:34px; line-height:18px;
}


.info_table
{
    border: 1px solid #ccc;
    padding: 1px;
}

.info_table .tab
{
    padding: 2px 10px 2px 10px;
    background-color: #ddd;
    text-align: center;
    font-weight: bold;
    cursor: pointer;
    width: 80px;
}

.info_table .tab.current
{
    background-color: #fff;
}

.info_table .cont
{
    display:none;
    height:90px;
    overflow:auto;
}
.info_table .cont.current
{
    display: block;
}