body
{
    padding: 0;
    color: black;
    margin-top: 5px;
    margin-right: 0;
    margin-bottom: 10px;
    margin-left: 0;
    font-size: 11px; 
    font-family: "Lucida Sans Unicode", "Lucida Grande", Sans-Serif;
    background-color: #FFF;
}

a:link
{
    color: #555;text-decoration: none; ;border:0px;
}

a:visited
{
    color: #555;
}

a:hover
{
    color: #000;
    text-decoration: underline
}

a:active
{
    color: #12eb87;
}

p /*, ul*/
{
    margin-bottom: 20px;
    line-height: 1.6em;
}
ul
{
    list-style:none;
}

header, footer, nav, section
{
    display: block;
}

.systemName 
{
     font-family: pt-serif-1,pt-serif-2, "Segoe UI", Arial, Tahoma, Verdana, Helvetica, sans-serif;
    font-weight: normal;
    color: #000; /*#fff;*/
    margin: -0.1em 0 0 0;
    font-size: 13px;
    padding-bottom: 1px;
    padding-right: 1px;
    margin-bottom: 0;
    width:100px;
    }
    
.info
{
    padding-left:10px;
    font-size: 12px;
}
/* HEADINGS   
----------------------------------------------------------*/
div.container 
{
    text-align: center;
    /*margin-bottom: 5px;*/
    /*background-color:#498e00;*/
    /*border-bottom: 2px solid #498e00;*/
 }

.titleimg{float:left;}
    
h1 {
    font-family: pt-serif-1,pt-serif-2, "Segoe UI", Arial, Tahoma, Verdana, Helvetica, sans-serif;
    font-weight: bold;
    /*color: #949494;*/ /*#fff;*/
    margin: -0.1em 0 0 0;
    font-size: 12px;
    padding-bottom: 1px;
    padding-right: 1px;
    margin-bottom: 0;
}

h4 {
    margin: -0.1em 0 0 0;
    padding-bottom: 0;
    margin-bottom: 0;
}

/* PRIMARY LAYOUT ELEMENTS   
----------------------------------------------------------*/
.page
{
    width: 99%;
    margin-left: auto;
    margin-right: auto;
}

header 
{
    min-width: 950px;
    max-width: auto;
    width: 100%;
    margin: 0 auto;
    border-spacing: 0;
	border-bottom: 1px solid #498e00; /*#5c87b2;*/
}

#main {
    padding: 10px 0px 10px 5px;
    background-color: #fff;
    border-radius: 4px 0 0 0;
    -webkit-border-radius: 4px 0 0 0;
    -moz-border-radius: 4px 0 0 0;
}


footer, #footer{}

/*#page_title {float:left;width:80%;}
#export_toolbar {margin-right:5px;padding-left:80%;width:20%;}

/* TAB MENU   
----------------------------------------------------------*/
#tblheader 
{
    width:100%;
    padding:0px;
	background-color: #fff;  
	border-collapse: collapse;
    
}
#tblheader td,
{
    padding:0px;
    margin:0px;
}

#tblheaderinfo 
{
    width:300px;
    padding:0px;
    text-align:right;
}

#partillogon
{
    text-align:right;
        
}

#userlogin
{
    width: 100%;
    padding-bottom: 4px;
}

#login
{
    margin-top:80px;
 }
/* Styles for pages layout
----------------------------------------------------------*/
#centerpanel{width: 50%;}

#wrapper{width: 100%; overflow: auto;}
#leftpanel{float: left;width: 50%;}
#rightpanel{}

#wrapper_romaneo{width: 100%;overflow: auto;}
#leftpanel_romaneo{float: left;width: 80%;}

#leftpanel_process{float: left; width: 55%;}
#rightpanel_process{}

#leftpanel_contract{float: left; width: 35%;}
#rightpanel_contract{}

#tpwrapper{ width: 100%;overflow: auto;}
#tpleft{float: left; width: 30%;}
#tpcenter{float: left; width: 30%;}
#tpright{}

#stockleft{float: left; width: 20%;}
#stockcenter{float: left; width: 35%;}



#buttonspanel{text-align: right;margin-right: 10px;}

.hide{display: none;}
.loadingWrapper { position:relative;}

#loading {
    position:absolute;
    left:35%;top:40%;
    border: 1px solid #C7CACC;
    padding: 2px;
    background-color: whiteSmoke;
    color: black;
    opacity: 0.90;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    width: 100px;
    height: 100px;
    text-align: center;
    z-index: 100000;
}

/* FORM LAYOUT ELEMENTS   
---------------------------------------------------------*/
fieldset{ margin: 0 1em 0.75em 0; padding: 0 0.4em 0.4em 0.4em;  border: 1px solid #ddd;}

fieldset legend  
{
    font-size: 13px; font-weight:bold; 
}

fieldset.CenterNoBorder{ margin: 0 1em 0.75em 0; padding: 0 0.4em 0.4em 0.4em;  border: 0px solid #ddd; text-align:center;}

#legendDiv{vertical-align:middle}
#legendDiv-img{height:14px; vertical-align: middle; clear:right;}
#legendDiv-text{display:inline-block;vertical-align:middle}

label { float:left; width:10em; display:block; clear:left; margin-right:1em; text-align:left;  cursor:hand; }
textarea, input, select, label, button, optgroup { margin-top:5px; 
        /*font-family: Verdana,Arial,sans-serif*//*{ffDefault}*/;
        font-family: "Lucida Sans Unicode", "Lucida Grande", Sans-Serif;
        /*font-size: 1em; */
      }
input[type="checkbox"] ,input[type="radio"] { margin-bottom:3px; }	
textarea:focus, input[type="text"]:focus { border: 2px solid #ccc; }
select{border: 1px solid #ccc;padding: 2px;color: #444;}
input[type="text"]{ border: 1px solid #ccc; color: #444; width: 200px;margin-left:2px;}
input[type="submit"],input[type="reset"]{background-color: #ccc; color: #333;padding: 5px;}
input[type="checkbox"]{ color: #000; }
input[type="radio"]{  background-color: #fff; color: #000; }
option{ background-color:#fff; color:#000; }
optgroup{ background-color:#ccc; color:#000; }
button{ background-color: #ccc; color: #333; }

.inputdate{width:70px;}
.inputdatetime{width:120px;}
.inputshort{width:60px;}
.inputtiny{width:30px;}
.inputlarge{width:180px;}
.radio {border: solid 1px white;}
.radio input {border: solid 1px white;}

.editor-multiline-field textarea {width: 320px;height: 20px;}

.filters fieldset {background-color: #F8F8F8;padding:1px 1px 1px 1px;margin: 0px 0px 5px 0px;}
.filter-label {float: left;margin-top:0px; }
.filter-label label {text-align:right;width:40px;padding-top: 2px;font-size: 11px;}
.filter-label input {width:30px;}
.filter-label input .ui-button {padding: 0.1em 1em;}
.filter-label  textarea, input, select, label, button, optgroup {margin-top: 0px;font-size: 11px;}
.filter-field {float: left;}
.filter-field input {width:70px;}
.filter-field select {height:20px;}
.filter-slider {width:70px; float:left; padding:4px 17px 0px 17px;}

/* TABLE
----------------------------------------------------------*/
#iteminfo
{
    font-size: 11px;
	background: #fff;
	margin: 10px;
	border-collapse: collapse;
	text-align: left;
	color: #000000;
    font-weight: normal;
}

#iteminfo td
{
    padding: 3px;
}


.iteminfo_label
{
    padding: 3px;
    font-weight: normal;
    text-align: right;
}


#listing
{
/*	font-size: 11px;
	background: #fff;
	border-collapse: collapse;
	text-align: left;*/
	font-size: 11px;
	background: #fff;
	margin: 5px 5px 5px 5px;
	width: 99%;
	border-collapse: collapse;
	text-align: left;
}

#listing th, #listing td {
	border-bottom: 1px solid #CFCFCF;
	border-right: 1px solid #CFCFCF;
	border-left: 1px solid #CFCFCF;
	border-top: 1px solid #CFCFCF;
	color: #000;/*#555;*/
}

#listing th
{
    background: #CEE59B;
	font-weight: normal;
	padding: 4px 4px;
	/*border-bottom: 2px solid #AAA;/*#6678b1;*/
}
#listing td
{
	padding: 3px 3px;
	/*border-bottom: 1px solid #ccc;
	color: #669;
	padding: 3px 8px;*/
}

#listing tbody tr:hover td
{
	background-color: #F0EF9B;
}

#listing tfoot
{
	background-color: #CCC;
	color: #FFFFFF;
	font-weight: bold;
}

#listing tfoot td
{
    background-color: #F4F4F4;
    /*font-weight: bold;*/
    font-size: 11px;
}

#listing tfoot th
{
    border-top: 1px solid black;
    background-color: #F4F4F4;
    font-size: 11px;
}

#datatablelisting
{
	font-size: 11px;
	background: #fff;
	border-collapse: collapse;
	text-align: left;
/*	font-size: 11px;
	background: #fff;
	margin: 5px 5px 5px 5px;
	width: 99%;
	border-collapse: collapse;
	text-align: left;*/
}

#datatablelisting th, #datatablelisting td {
	border-bottom: 1px solid #CFCFCF;
	border-right: 1px solid #CFCFCF;
	border-left: 1px solid #CFCFCF;
	border-top: 1px solid #CFCFCF;
	color: #000;/*#555;*/
}

#datatablelisting th
{
    background: #CEE59B;
	font-weight: normal;
	padding: 4px 4px;
	/*border-bottom: 2px solid #AAA;/*#6678b1;*/
}
#datatablelisting td
{
	padding: 3px 3px;
	/*border-bottom: 1px solid #ccc;
	color: #669;
	padding: 3px 8px;*/
}

#datatablelisting tbody tr:hover td
{
	background-color: #F0EF9B;
}

#datatablelisting tfoot
{
	background-color: #CCC;
	color: #FFFFFF;
	font-weight: bold;
}

#datatablelisting tfoot td
{
    background-color: #F4F4F4;
    /*font-weight: bold;*/
    font-size: 11px;
}

#datatablelisting tfoot th
{
    border-top: 1px solid black;
    background-color: #F4F4F4;
    font-size: 11px;
}

/*----------------------------*/
#sublisting
{
	background: #fff;
	width: 100%;
	border-collapse: collapse;
	text-align: right;
}

#sublisting th, #sublisting td {
	border-bottom: 1px solid #CFCFCF;/*#A3B1A6;*/
	border-right: 1px solid #CFCFCF;
	border-left: 1px solid #CFCFCF;
	border-top: 1px solid #CFCFCF;
	color: #000;/*#555;*/
}

#sublisting th
{
    background: #CEE59B;/*#CCC;/*#7fbf4d;*/
	font-weight: normal;
	/*color: #fff;/*#8d97a0;*//*#039;*/
	padding: 3px 3px;
	/*border-bottom: 1px solid #6678b1;*/
}

#sublisting th group
{
	color: #8d97a0;/*#039;*/
	padding: 3px 3px;
}

/*#sublisting tr { background: #FCFDFE; }*/
/*#sublisting tbody tr { background: #FCFDFE; }*/
#sublisting tr.odd { background: #CCC; }
/*#sublisting tbody tr.odd { background: #F7F9FC; }*/

#sublisting td
{
	padding: 3px 3px;
}

#sublisting tbody tr:hover td
{
	background-color: #F0EF9B;
}


#sublisting tfoot
{
	background-color: #E4E4E4;
	/*color: #FFFFFF;*/
	font-weight: bold;
}

#sublisting tfoot td
{
    background-color: #F4F4F4;
    font-weight: bold;
    font-size: 11px;
}

tbody tr.hilite td {
    color: #fff;
    background: none repeat scroll 0 0 #7fbf4d;
}


#sublisting td.headergroup
{
    border-bottom: 1px solid #CFCFCF;/*#A3B1A6;*/
	border-right: 1px solid #CFCFCF;
	border-left: 0px solid #CFCFCF;
	border-top: 0px solid #CFCFCF;
}


/*----------------------------*/
#sublisting_report
{
	background: #fff;
	width: 100%;
	border-collapse: collapse;
	text-align: right;
}

#sublisting_report th, #sublisting_report td {
	border-bottom: 1px solid #CFCFCF;/*#A3B1A6;*/
	border-right: 1px solid #CFCFCF;
	border-left: 1px solid #CFCFCF;
	border-top: 1px solid #CFCFCF;
	color: #000;/*#555;*/
}

#sublisting_report th
{
    background: #F4f4f4;/*#CCC;/*#7fbf4d;*/
	font-weight: normal;
	/*color: #fff;/*#8d97a0;*//*#039;*/
	padding: 3px 3px;
	/*border-bottom: 1px solid #6678b1;*/
}

#sublisting_report th group
{
	color: #8d97a0;/*#039;*/
	padding: 3px 3px;
}

#sublisting_report tr.odd { background: #CCC; }


#sublisting_report td
{
	padding: 3px 3px;
}

#sublisting_report tfoot
{
	background-color: #E4E4E4;
	/*color: #FFFFFF;*/
	font-weight: normal;
}

#sublisting_report tfoot td
{
    background-color: #F4F4F4;
    font-weight: normal;
    font-size: 11px;
}


#sublisting_report td.headergroup
{
    border-bottom: 1px solid #CFCFCF;/*#A3B1A6;*/
	border-right: 1px solid #CFCFCF;
	border-left: 0px solid #CFCFCF;
	border-top: 0px solid #CFCFCF;
}

/*----------------------------*/
#detailtable
{
background: white;
width: 100%;
border-collapse: collapse;
text-align: right;
border: 1px solid #CCC;
margin-top: 5px;
}
#detailtable th
{
	font-weight: bold;
	color: #000;
	padding: 5px 5px;
	border-bottom: 1px solid #6678b1;
	background-color: #E0E0E0
}
#detailtable td
{
	/*border-bottom: 1px solid #ccc;*/
	color: #669;
	padding: 8px 5px;
	background-color: #F0F0F0;
}
#detailtable tbody tr:hover td
{

	background-color: #F0F0F0;
}

#detailtable tfoot
{
	background-color: #CCC;
	color: #FFFFFF;
	font-weight: bold;
}

#detailtable tfoot td
{
	background-color: #A3B1A6;
	color: #FFFFFF;
	font-weight: bold;
}

/*----------------------------*/
#selectListing
{
	font-size: 11px;
	background: #fff;
	/*margin: 5px 5px 5px 5px;*/
	width: 99%;
	border-collapse: collapse;
	text-align: left;
}
#selectListing th
{
    font-size: 10px;
	font-weight: bold;
	color: #8d97a0;/*#039;*/
	padding: 5px 5px;
	border-bottom: 1px solid #6678b1;
}
#selectListing td
{
	border-bottom: 1px solid #ccc;
	color: #669;
	font-size: 11px;
	padding: 2px 8px;
}

#selectListing tbody tr:hover td
{
	background-color: #F0F0F0;
}

#selectListing input[type="text"]
{width:60px;}

.list-button {
  color: #333;
  /*font: bold 11px "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;*/
  /*line-height: 2;*/
}


.selectListing_selected
{
	background-color: #f0f1f3;
	}

	
.formErrorContent {
    width: 100%;
    background: #EE0101;
    position: relative;
    color: white;
    width: 150px;
    font-size: 11px;
    border: 2px solid #DDD;
    box-shadow: 0 0 6px black;
    padding: 4px 10px 4px 10px;
    border-radius: 6px;
    }

/* MISC  
----------------------------------------------------------*/
.clear
{
    clear: both;
}

.error
{
    color: Red;
}

nav, #menucontainer
{
    margin-top: 40px;
}

div#title
{
    display: block;
    float: left;
    text-align: left;
}

#logindisplay
{
    font-size: 1.1em;
    display: block;
    text-align: right;
    margin: 10px;
    color: White;
}

#logindisplay a:link
{
    color: white;
    text-decoration: underline;
}

#logindisplay a:visited
{
    color: white;
    text-decoration: underline;
}

#logindisplay a:hover
{
    color: white;
    text-decoration: none;
}

/* Styles for validation helpers
-----------------------------------------------------------*/
.field-validation-error
{
    color: #ff0000;
}

.field-validation-valid
{
    display: none;
}

.input-validation-error
{
    border: 1px solid #ff0000;
    background-color: #ffeeee;
}

.validation-summary-errors
{
    font-weight: bold;
    color: #ff0000;
}

.validation-summary-valid
{
    display: none;
}

/* Styles for editor and display helpers
----------------------------------------------------------*/

.display-label , .editor-label
{
}

.display-field , .editor-field
{

}

.login-label{}

.login-label label{padding: 8px 8px; }
    
.login-field{}
.login-field input
{
    border: 1px solid gray;
    padding: 4px 8px;
    margin: 4px 0px 6px 0px;
}



.text-box
{
    width: 30em;
}

.text-box-numeric
{
    width: 30em;
}

.text-box.multi-line
{
        font-size: 11px; 
    font-family: "Lucida Sans Unicode", "Lucida Grande", Sans-Serif;
    /*height: 6.5em;*/
}

.tri-state
{
    width: 6em;
}



/** BUTTONs
*******************************************************************************/
input.cupid-green {
  background-color: #7fbf4d;
  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #7fbf4d), color-stop(100%, #63a62f));
  background-image: -webkit-linear-gradient(top, #7fbf4d, #63a62f);
  background-image: -moz-linear-gradient(top, #7fbf4d, #63a62f);
  background-image: -ms-linear-gradient(top, #7fbf4d, #63a62f);
  background-image: -o-linear-gradient(top, #7fbf4d, #63a62f);
  background-image: linear-gradient(top, #7fbf4d, #63a62f);
  border: 1px solid #63a62f;
  border-bottom: 1px solid #5b992b;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  -webkit-box-shadow: inset 0 1px 0 0 #96ca6d;
  -moz-box-shadow: inset 0 1px 0 0 #96ca6d;
  box-shadow: inset 0 1px 0 0 #96ca6d;
  color: #fff;
  font: bold 11px "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
  line-height: 1;
  padding: 7px 0 8px 0;
  text-align: center;
  text-shadow: 0 -1px 0 #4c9021;
  width: 120px; }
  input.cupid-green:hover {
    background-color: #76b347;
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #76b347), color-stop(100%, #5e9e2e));
    background-image: -webkit-linear-gradient(top, #76b347, #5e9e2e);
    background-image: -moz-linear-gradient(top, #76b347, #5e9e2e);
    background-image: -ms-linear-gradient(top, #76b347, #5e9e2e);
    background-image: -o-linear-gradient(top, #76b347, #5e9e2e);
    background-image: linear-gradient(top, #76b347, #5e9e2e);
    -webkit-box-shadow: inset 0 1px 0 0 #8dbf67;
    -moz-box-shadow: inset 0 1px 0 0 #8dbf67;
    box-shadow: inset 0 1px 0 0 #8dbf67;
    cursor: pointer; }
  input.cupid-green:active {
    border: 1px solid #5b992b;
    border-bottom: 1px solid #538c27;
    -webkit-box-shadow: inset 0 0 8px 4px #548c29, 0 1px 0 0 #eeeeee;
    -moz-box-shadow: inset 0 0 8px 4px #548c29, 0 1px 0 0 #eeeeee;
    box-shadow: inset 0 0 8px 4px #548c29, 0 1px 0 0 #eeeeee; }

	/* clean gray
*******************************************************************************/
input.clean-gray {
  background-color: #eeeeee;
  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #eeeeee), color-stop(100%, #cccccc));
  background-image: -webkit-linear-gradient(top, #eeeeee, #cccccc);
  background-image: -moz-linear-gradient(top, #eeeeee, #cccccc);
  background-image: -ms-linear-gradient(top, #eeeeee, #cccccc);
  background-image: -o-linear-gradient(top, #eeeeee, #cccccc);
  background-image: linear-gradient(top, #eeeeee, #cccccc);
  border: 1px solid #ccc;
  border-bottom: 1px solid #bbb;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  color: #333;
  font: bold 11px "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
  line-height: 1;
  padding: 7px 0 8px 0;
  text-align: center;
  text-shadow: 0 1px 0 #eee;
  width: 120px; }
  input.clean-gray:hover {
    background-color: #dddddd;
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #dddddd), color-stop(100%, #bbbbbb));
    background-image: -webkit-linear-gradient(top, #dddddd, #bbbbbb);
    background-image: -moz-linear-gradient(top, #dddddd, #bbbbbb);
    background-image: -ms-linear-gradient(top, #dddddd, #bbbbbb);
    background-image: -o-linear-gradient(top, #dddddd, #bbbbbb);
    background-image: linear-gradient(top, #dddddd, #bbbbbb);
    border: 1px solid #bbb;
    border-bottom: 1px solid #999;
    cursor: pointer;
    text-shadow: 0 1px 0 #ddd; }
  input.clean-gray:active {
    border: 1px solid #aaa;
    border-bottom: 1px solid #888;
    -webkit-box-shadow: inset 0 0 5px 2px #aaaaaa, 0 1px 0 0 #eeeeee;
    -moz-box-shadow: inset 0 0 5px 2px #aaaaaa, 0 1px 0 0 #eeeeee;
    box-shadow: inset 0 0 5px 2px #aaaaaa, 0 1px 0 0 #eeeeee; }


/* TAB MENU   
----------------------------------------------------------*/
#menu-container
{
    	-moz-border-radius-topleft:.5em;
	-webkit-border-top-left-radius:.5em;
	-moz-border-radius-topright:.5em;
	-webkit-border-top-right-radius:.5em;
    }
    
#process_chart_div{position: relative; float:left}
    
#inoutsummary {float:left;width:100px;margin-top:15px;}

.wfo_number
{
    float: left;
    background-color: whiteSmoke;
    width: 180px;
    padding: 5px 5px 5px 5px;
    margin: 4px 0 4px 0;
    text-align: center;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    border-radius: 20px;
    border: 1px solid #DEDEDE;
    color: #222;
}
.GrossInput{color: #000;}
.NetInput{font-weight:bold;color: #000;}
.Volatile{font-weight:bold;color: #BD9925;}
.NotProcessed{font-weight:bold;color:#883e3f;}
.Output{font-weight:bold;color:#75921F;}


.separator {
  background-color: #ededed;
  text-align: center;
  padding-bottom: 3px;
  padding-top: 3px;
  margin: 5px 0px;
}

/***********************************************************************************/
/*table, th, td {
	border: 1px solid #D4E0EE;
	border-collapse: collapse;
	font-family: "Trebuchet MS", Arial, sans-serif;
	color: #555;
}

caption {
	font-size: 150%;
	font-weight: bold;
	margin: 5px;
}

td, th {
	padding: 4px;
}

thead th {
	text-align: center;
	background: #E6EDF5;
	color: #4F76A3;
	font-size: 100% !important;
}

tbody th {
	font-weight: bold;
}

tbody tr { background: #FCFDFE; }

tbody tr.odd { background: #F7F9FC; }

table a:link {
	color: #718ABE;
	text-decoration: none;
}

table a:visited {
	color: #718ABE;
	text-decoration: none;
}

table a:hover {
	color: #718ABE;
	text-decoration: underline !important;
}

tfoot th, tfoot td {
	font-size: 85%;
}*/



/* Start by setting display:none to make this hidden.
   Then we position it in relation to the viewport window
   with position:fixed. Width, height, top and left speak
   speak for themselves. Background we set to 80% white with
   our animation centered, and no-repeating */
.modal {
    display: none;
    position: fixed;
    z-index: 1000;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background: rgba( 255, 255, 255, .8 ) url('http://sampsonresume.com/labs/pIkfp.gif') 50% 50% no-repeat;
}

/* When the body has the loading class, we turn
   the scrollbar off with overflow:hidden */
body.loading {
    overflow: hidden;
}

/* Anytime the body has the loading class, our
modal element will be visible */
body.loading .modal {
    display: block;
}