body { behavior:url("../include/csshover.htc") }


/**
* FONTS & ALIGNMENT
*/
body, div, span, p, td{
	font-family: Verdana,Arial, Tahoma;
	font-size: 10px;
	font-weight: normal;

	text-align: left;
	vertical-align: top;
}

body{
	margin-top: 0px;
	text-align: center; /*Zentrierung im IE*/

  background-color: #FFFFFF;
}

img{
	margin: 2px;
}

a:link{
	text-decoration: none;
	color:#000000;
}

a:visited{
	text-decoration: none;
	color:#000000;
}

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

a:active{
	text-decoration: none;
	color:#000000;
}

.button{
      border-width: 1px;
      border-style: solid;
      border-color: #000000;

      background-color: #EEEEEE;
      color: #000000;
}

.button a{
      color: #000000;
}

.button:hover, .button:focus{
	text-decoration: underline;
	cursor: pointer;
}

/**
* Borders
*/
.innerForm, .infoField, .eventInfoField, .commentField{
      border-width: 1px;
      border-style: solid;
      border-color: #000000;
}

.icon{
  vertical-align:middle;
  border-style:none;
  border-width:0;
  padding: 0;
  margin: 0;

  display:inline;
}

.icon:hover{
  text-decoration: none;
}

input, textarea, select{
  font-family: Verdana,Arial, Tahoma;
  font-size: 12px;
  vertical-align: middle;
  border-style: solid;
  border-width: 1px;
  border-color: #000000;
  padding: 2px;
  margin: 1px;
}

input, select{
  height: 20px;
  width: 150px;
}

input.date{
  width: 120px;
}

.whoPrefix{
  font-weight:normal;
  width: 60px;
}

input.whoAuthNo{
  width: 30px;
}

input.whoSerialNo, input.whoSplitNo{
  width: 52px;
}

textarea{
  height: 80px;
}


/**
* HEADER STYLES
*/
#nav{
  margin-top: 28px;
}

#headline{
	border-style: none;
	margin-left:4px;
	margin-bottom: 8px;
}

#headline *{
	margin: 0px;
	padding: 0px;

  color: #003366;
}

#headline h1{
	font-size: 24px;
	float:left;
	margin-right:8px;
}

#headline h2{
	font-size: 18px;
	line-height: 33px;
	vertical-align:text-bottom;
}

#headline img{
	position: absolute;
	top: 0px;
	right: 0px;
	margin:4px;
}

/**
* FORMULAR LAYOUT
*/
input.checkbox{
        border: 0px;
        border-style: none;

        width:14px;
        height:14px;

	margin: 0px;
	padding: 0px;
}


/**
* EMAIL FORM
*/

#email, #upload{
  position: absolute;

  top: 0px;
  left: 0px;

  width: 100%;
  height: 100%;

  padding: 0;
  margin: 0;

  z-index: 100;

  display:none;
}


.innerForm{
  position: absolute;

  bottom: 50px;
  right: 50px;

  background-color: #EEEEEE;

  vertical-align: top;

  padding: 0;
  margin: 0;

  display: block;
}

#email_form{
  width: 600px;
  height: 328px; /*hardcoded for drag and drop*/
}

#upload_form{
  width: 600px;
  height: 290px; /*hardcoded for drag and drop*/
}

.infoField, .eventInfoField{
  position:absolute;

  background-color: #EEEEEE;
  vertical-align: top;
  text-align: center;

  width: 300px;

  display:block;
}

.eventInfoField input{
  width: 190px;
}

.eventInfoField input.date, .eventInfoField input.time{
  width: 140px;
}

.eventInfoField textarea{
  width: 190px;
  height: 70px;
}


.eventInfoField .commentText{
/** feld für den Kommentar-Text */
}

.eventInfoField .nameCell, .infoField .nameCell{
  width: 60px;
}

.eventInfoField .dataCell, .infoField .dataCell{
  width: auto;
}


.infoField table, .eventInfoField table{
  text-align: left;
  margin: 4px;
  width: 290px;
}


div.innerFormField, div.fields_headline{
  margin: 4px;
  padding: 4px;

  padding-right: 40px;

  text-align: right;

  font-size: 12px;
  line-height: 14px;

  border-style: none;
}

div.fields_headline{
  text-align: center;
  font-weight: bold;

  background-color: #003366;
  color: #FFFFFF;

  display:block;
}

.fields_headbuttons{
  position:absolute;

  right:12px;
  top:8px;

  font-weight:bold;
  font-size:12px;

  text-align:right;

  color: #FFFFFF;
}

.fields_headbuttons a, .fields_headbuttons a:hover, .fields_headbuttons a:visited{
  color: #FFFFFF;
}

div.innerFormField input, div.innerFormField textarea{
  width: 480px;
}

div.innerFormField select{
  width: 280px;
  margin-right: 201px;
}

div.innerFormField input.radio{
  border: 0px;
  border-style: none;

  width: 16px;
}

.innerForm .handlers{
    border-width: 1px 0 0 0;
    border-style: solid;

    margin-left: auto;
    margin-top: 12px;
}

.innerForm .handlers div.button, #login_box div.button{
      float: right;

      font-weight: bold;
      font-size: 10px;

      line-height: 28px;

      text-align: center;
      vertical-align: middle;

      width: 150px;
      height: 28px;

      margin: 8px;

      display: block;
}

/**
* NAVIGATION ELEMENTS
*/
#warehouseHandler, #searchHandler{
	border-style: none;
}


#searchHandler{
  width:100%;
	right: 0px;
	margin: 0px;
}

#searchHandler div.button{
	float: right;

	font-weight: bold;
	font-size: 10px;

	line-height: 24px;

	text-align: center;
	vertical-align: middle;

	width: 100px;
	height: 24px;

	margin:4px;
}

#warehouseHandler{
  position: absolute;

  margin: 0px;
  padding: 4px;

  bottom: 0px;
  right: 0px;
}

#warehouseHandler div{
	font-weight: bold;
	font-size: 10px;

	line-height: 28px;

	text-align: center;
	vertical-align: middle;

	width: 150px;
	height: 28px;

  margin: 8px;

  display: block;
}


#warehouseHandler div a, #searchHandler div a{
	text-decoration: none;
}

#warehouseHandler div a:hover, #searchHandler div a:hover{
	text-decoration: underline;
}

#shipping_history_header, #data_warehouse_table, #search_header{
	clear:left;
	margin-top: 16px;
}

/**
* POSITIONING
*/
#content{
	position: relative;

	border-width: 1px;
	border-style: solid;
	border-color: #000000;

  background-color: #FFFFFF;

	top: 16px;

	width: 960px;
	/*min-height: 600px;*/

	margin-left: auto;
	margin-right: auto;

  padding-bottom: 0;
}

/**
* USE INVISIBLE TABLES FOR A GRID LAYOUT
*/
table.layoutGrid, td.layoutGrid{
	border-width: 0px;
	border-style: none;

	margin: 0px;
	padding: 0px;
}

/**
* TABLE - LAYOUT
*/
table{
	border-collapse: collapse;
}

td{
	height: 16px;

	border-width: 1px;
	border-style: solid;
	border-color: #999999;

	padding-top: 2px;
	padding-bottom: 2px;

	padding-left: 3px;
	padding-right: 2px;
}


/**
* DIFFERENT CELL SHADERS
*/
.nameCell, .nameHeadCell{
	font-weight: bold;
	background-color: #99CCFF;
  color: #000000;
}


.even .dataCell, .even .dateCell, .even .timeCell, .even .inputCell, .even .iconCell, .dataCell .even .dataCell, .even .hiddenDataCell{
	background-color: #EEEEEE;
}

.odd .dataCell, .odd .dateCell, .odd .timeCell, .odd .inputCell, .odd .iconCell, .dataCell .odd .dataCell, .odd .hiddenDataCell{
	background-color: #FFFFFF;
}

.buttonCell {
	background-color: #FFFFFF;
  text-align: right;
  padding: 4px;
}

.even .currentCell, .odd .currentCell{
  background-color: #33CC66;
  /* green status */
}

data_warehouse_table td{
	height:16px;
	vertical-align: middle;
}

.level0 .nameCell, .level0 .dataCell{
	font-weight: bold;
}

.level1 .nameCell{
	text-transform: uppercase;
	font-weight: bold;
}

.level2 .nameCell{
	font-weight: bold;
	padding-left: 24px;
}

.level3 .nameCell{
	font-weight: normal;
	padding-left: 24px;
}

.inputCell{
	text-align: center;
  vertical-align: middle;
	padding:0px;
}

.inputCell img{
	border-style:none;
}

.inputCell img{
	vertical-align: middle;
}

.timeCell, .nameHeadCell, .currentCell{
	text-align: center;
}

.dateCell, .timeCell{
	white-space: nowrap;
}

.dateCell, dataCell{
  padding-left:4px;
}

.headerCell, .headerCell a, .headerCell a:active, .headerCell a:visited, .headerCell a:hover{
	font-weight: bold;
	text-align: center;

	color: #FFFFFF;
	background-color: #003366;
	line-height: 12px;

	padding: 3px 1px 3px 1px;
	margin: 0px;
}

#shipment, #addresses_references, #history, #shipping_history_list, #search_header, #search_result{
	border-width: 2px;
	border-style: solid;
	border-color: #003366;

	padding: 0px;
	margin: 0px;
}

#shipping_history_list{
	margin-top: 16px;
	width: 100%;
}

#data_warehouse_table{
	border-width: 2px;
	border-style: solid;
	border-color: #003366;

	width: 82%;
}

#search_header{
	margin-top: 16px;
	width: 100%;
}

#search_header table{
	width: 100%;
}

#search_header table td{
	height: 28px;
	vertical-align: middle;
}

#search_result{
	width:100%;
	margin-top: 16px;
}

#search_result thead tr td.headerCell:hover{
  text-decoration: underline;
  cursor: pointer;
}

#search_result tbody tr:hover td.dataCell,
#search_result tbody tr:hover td.dateCell,
#search_result tbody tr:hover td.inputCell{
  /* text-decoration: underline; */
  background-color: #CCCCCC;
  cursor: pointer;
}


#history table tr td.dateCell:hover,
#history table tr td.timeCell:hover,
#history table tr td.currentCell:hover,
#shipping_history_list tr td.dateCell:hover,
#shipping_history_list tr td.timeCell:hover,
#shipping_history_list tr td.currentCell:hover{
  background-color: #CCCCCC;
  cursor: pointer;
}


#history table tr td.nameCell {
 width: 220px;
}

#history .eventInfoField td.nameCell {
  width: 60px;
}

#history .eventInfoField td.dataCell {
  width: 216px;
}



/**
*
* DEFINE COLUMN WIDTHS
*
*/
/* ---------- shippingHistory ------------ */
#shipping_history_header{
	width: 100%;
}

#shipment, #addresses_references{
	width: 35%;
}

#history{
	width: 65%;
}

#shipment table, #addresses_references table, #history table{
	width: 100%;
}

#shipment .infoField table, #addresses_references .infoField table, #history .infoField table{
	width: 290px;
}

#shipment .eventInfoField table, #addresses_references .eventInfoField table, #history .eventInfoField table{
	width: 290px;
}

.eventInfoField{
  position:absolute;

  right: 0px;

  height: 120px;

  text-align:right;
}


#shipment td.nameCell, #addresses_references td.nameCell{
	width: 40%;
}

#shipment td.dataCell, #addresses_references td.dataCell{
	/*width: 60%;*/
}

td.iconCell{
	width: 16px;
        text-align:center;
}


/* ---------- dataWarehouse ------------ */
#data_warehouse_table td.nameCell{
	width: 29%;
}

#data_warehouse_table td.dataCell{
	width: 45%;
}

#data_warehouse_table td.inputCell{
	width: 13%;
}

/* --------- login --------------- */
#login_box{
  width:100%;
  text-align: center;
}

#login_box table{
  width: 300px;
  margin: 60px auto 60px auto;
}

#login_box table td{
  text-align:right;
  vertical-align:middle;
}

#login_box table td.failed{
  text-align:center;

  font-size: 12px;
  line-height: 32px;
  vertical-align: middle;
  font-weight:bold;
  vertical-align:middle;
}


#login_box div.button{
  width: 100px;
  height: 24px;
  line-height: 24px;
}

ul.errors{
  list-style-type: none;
  list-style-position: outside;

  padding-left: 4px;
  margin: 0px;

  background-color: #FF0000;
  display:block;
}

ul.errors li{
  font-weight: bold;
  font-size: 12px;

  line-height: 14px;

  padding: 4px;
  margin: 0px;

  color: #FFFFFF;
}

.info_bar{
  padding: 4px;
  margin: 0;

  background-color: #EEEEEE;
  border: 1px #000000 solid;
  display: block;
  clear: both;

  vertical-align: top;
}

.info_bar img{
  margin: 0 2px 0 10px;
}


#debug{
  display:none;
  position:absolute;
  bottom: 0px;
  left:0px;
  border: 1px #000000 solid;
  background-color: #FF0000;
  margin: 15px;
  padding: 5px;
}

#debug table{
  border: 1px #000000 solid;
}

#debug .button{
  width: 100px;
  height: 24px;
  line-height:24px;
  text-align: center;
}


#debug table td{
  background-color: #EEEEEE;
  font-size: 10px;
  font-weight: bold;
  line-height: 14px;
  width: 150px;
  height: 20px;
}

input.xpath{
  height: 20px;
  width: 600px;
}

select.multiselect{
  height: 100px;
  width: 150px;
}