/*******************************************************************************************/
/**************************** css pages ****************************************************/
/*******************************************************************************************/

body {	
	background:#fff;
	color:#6d6d6d;
	font-family:Arial, Helvetica, sans-serif;
	font-size:11px;
	line-height:17px;
	margin:0;
	padding:0;
	text-align: center;
	overflow-x:hidden;
}
.alignTop{
	vertical-align:top;
}
h1 {
	color:#1566DB;
	float:left;
	font-size:15px;
	font-weight:bold;
	font-family: Verdana, Tahoma, Arial, sans-serif;
	margin-top:10px;
	margin-bottom:10px;
	margin-left:3px;
	width:100%;
	text-align:left;
}
.highlightAdd{
	position: relative;
	right:40px;
	color=#00FF00;
}
.highlightRemove{
	position: relative;
	right:52px;
	color=#FF0000;	
}
select, input{
	font-size:9px;
	padding:1px;
	margin:4px 0;
}

.gngError {
	background-color:#FEF8E0;
}

.FieldInError {
	background-color:#FEF8E0;
}

.marketClass  {
	margin:0 4px -1px 0;
}
.marketClassError  {
	margin:0 4px -1px 0;
	background-color:#FEF8E0;
}

.button {
	font-weight: bold;
}

#noSuchResults {
	padding-left: 6px;
	font-size:10px;
	color:black;
	font-family: Verdana, Tahoma, Arial, sans-serif;
}

#errorMessages {
	color:#E42121;
	float:left;
	margin-left:3px;
	width:100%;
	margin-bottom: 0px;
	margin-top: 0px;
	font-weight:bold;
	font-size:11px;	
	font-family: Verdana, Tahoma, Arial, sans-serif;
	text-align: left;
}
#errorMessages ul {
	color: black;
	font-weight:normal;
}

/*******************************************************************************************/
/**************************** css head *****************************************************/
/*******************************************************************************************/
#footer{
	font-family:Arial, Helvetica, sans-serif;
	font-size:11px;
	padding-top:10px;
}

#head{
	height:89px;
	margin:0 0 0px 0px;
	position:relative;
	width:100%;
}

/*******************************************************************************************/
/**************************** css order ****************************************************/
/*******************************************************************************************/

#orderConfirmation {
	color:#E42121;
	float:left;
	font-size:15px;
	font-weight:bold;
	margin-top:5px;
	margin-bottom:5px;
	margin-left:3px;
	text-align:left;
	width:100%;
}

.important {
	color:#E42121;
}

.filterNormal {
	font-weight:normal !important;
	vertical-align:middle;
}

.filterIcon {
	vertical-align:-15% !important;
}

#orderTopTitle {
	color:#E42121;
	float:left;
	font-weight:bold;
	font-size:110%;
	font-family: Verdana, Tahoma, Arial, sans-serif;
	padding-top:7px;
}

#orderTopLeft {
	background: url(../images/orderTopLeft.gif) no-repeat;
	float:left;
	height:100%;
	width:6px;
}

#orderTopRight {
	background: url(../images/orderTopRight.gif) no-repeat;
	float:left;
	height:100%;
	width:6px;
}

#orderTopContent {
	background: url(../images/orderTopBackground.gif) repeat-x;
	float:left;
	width:100%;
	height:28px;
	margin:0 0 1px 0px;
	overflow:hidden;
	padding:0;

}

#orderBtn {
	float:right;
}

#orderBtn img{
	border:none;
	cursor:pointer;
}

#orderInputConfirmation {
	font-size:11px;
	margin:17px 0 1px 0px;
	overflow:hidden;
	padding:9px 0px 0x 0px;
	width:100%;
}

#orderInput {
	background:#f3f4f5;
	border:solid 1px #999;
	float:left;
	margin:0 0 1px 0px;
	overflow:hidden;
	padding:9px 0px 0px 0px;
	width:100%;
}

#orderInput.status table{
	width:100%;
}

#orderInput.status img{
	cursor:pointer;
	margin:-6px 0 0 0;
}

#orderInput span,
#orderInputConfirmation span
{
	color:#000;
	font-weight:bold;
	font-size: 11px;
}

#orderInputConfirmation span {
	margin-left:10px;
}

#orderInput span.important,
#orderInputConfirmation span.important
{
	color:#E42121;
}

#orderInput span.required,
#orderInputConfirmation span.required {
	font-weight:bold;
	color: #1566DB;
}

#orderInput span#companyName, #orderInput span#destinationCorridor,
#orderInputConfirmation span#companyName, #orderInputConfirmation span#destinationCorridor
{
	font-weight:normal;
	margin-right:35px;

}

#orderInput select{
	margin-right:22px;
}

#orderInputSelection {
	border:solid 1px #c0c0c0;
	float:none;
	margin:0 0 1px 0px;
	padding:0px;
	overflow:hidden;
	width:100%;
	}

#requiredFields {
	margin-top: 10px;
	margin-bottom: 10px;
	text-align:left;
	color: black;
	display:block;
	clear:both;
}

#requiredFields span.required {
	color: #1566DB;
	font-weight:bold;
}

.formInputBtn{
	margin:0 auto 18px auto;
	padding:0;
	
}

.formInputBtnTop{
	margin:3px auto 3px auto;
	padding:0;;
}
#orderInputSelection .formInputBtnTop{
	margin-top:11px;
}

.formInputBtn input,
.formInputBtnTop input{
	margin:0 12px;
	padding:0 24px;
}


.borderTable#order{
	margin:13px auto 19px auto;
	width:95%;
	float:none;
}

.borderTable#confirmation{
	margin:10px 0px 10px;
	padding:0px;
	width:98%;
} 

.borderTable#confirmation tbody th{
	font-weight:normal;
} 

#orderInputSelection span {
	font-weight:bold;

}

th.headerSortUp {
    background-image: url(../images/btn/btnDownOver.gif);
	cursor: pointer;
	font-weight: bold !important;
    background-repeat: no-repeat;
    background-position: bottom center;
    padding-left: 20px;
    border-right: 1px solid #dad9c7;
    margin-left: -1px;
    height: 45px !important;
    vertical-align: top;
}

th.headerSortDown {
    background-image: url(../images/btn/btnUpOver.gif);
	cursor: pointer;
	font-weight: bold !important;
    background-repeat: no-repeat;
    background-position: bottom center;
    padding-left: 20px;
    border-right: 1px solid #dad9c7;
    margin-left: -1px;
    height: 45px !important;
    vertical-align: top;
}

th.header {
	background-image: url(../images/btn/btnUp.gif);
	cursor: pointer;
	font-weight: bold;
    background-repeat: no-repeat;
    background-position: bottom center;
    padding-left: 20px;
    border-right: 1px solid #dad9c7;
    margin-left: -1px;
    height: 45px !important;
    vertical-align: top;
} 

th.unsortable {
	font-weight: bold !important;
    border-right: 1px solid #dad9c7;
} 

.thin {
	width: 30px !important;
}

th.thin {
	width: 30px !important;
}

th.narrow {
	width: 80px !important;
}

th.NOnarrow {
	width: 90px !important;
}

.NOtableWidth {
	width: 80% !important;
}

th.semiwide {
	width: 182px !important;
}

.borderTable th {
	border:solid 1px #c0c0c0;
	font-size:11px; 
	width:auto;
	font-weight: normal;
	color:black;
}
.borderTable th.header {
	border:solid 1px #c0c0c0 !important; 
	padding-left: 5px;
	padding-right: 5px;
	font-weight: bold;
	text-align:left;
}

.borderTable th.unsortable {
	font-weight: bold !important;
    border-right: 1px solid #dad9c7;
} 

.borderTable th.thin {
	width:30px !important;
} 

.borderTable th.narrow {
	width:80px !important;
} 

.borderTable th.semiwide {
	width:132px !important;
} 

.borderTable th.headerTrackingNumber {
	width: 50px;
}
.borderTable th.headerWantDate {
	width: 60px;
}
.borderTable th.headerWantWeek {
	width:25px;
}
.borderTable th.headerOrigin {
	width: auto;
}
.borderTable th.headerMarketClass {
	width: 85px;
}
.borderTable th.headerCorridor {
	width: auto;
}
.borderTable th.headerCarsOrdered {
	width:40px
}
.borderTable th.headerStatus {
	width: auto;
}
.orderRecap .borderTable#myTable{
	width:100%;
}
.orderRecap tbody th {
	padding:0 5px;
}
.orderRecap tbody th span {
	font-weight:bold;
}
#orderInputSelection thead, 
.orderRecap thead {
	background:#878787;
}

#orderInputSelection thead th{
	color:#fff;
	padding:5px 5px 5px 5px;
}

.orderRecap thead th{
	color:#fff;
	padding:5px 2px;
}

#orderInputSelection table.borderTable {
	border: 1px solid #c0c0c0;
}

#orderInputSelection tbody th{
	padding:5px;
}

#orderInputSelection tbody img{
	border:none;
	cursor:pointer;
}

#orderInputSelection tbody .carsOrdered {
	margin: 0;
	padding: 0 4px;
	text-align: right;
	width: 60px !important;
}

#orderInputSelection tbody .carsOrderedError {
	margin: 0;
	padding: 0 4px;
	text-align: right;
	background-color:#FEF8E0;
	width: 60px !important;
}

#orderInputSelection tbody .grainGrade {
}

#orderInputSelection tbody .grainGradeError {
	background-color:#FFFF00;
}

.orderRecap tbody .carsOrderedSmall {
	width:27px;
}
.orderRecap tbody .carsOrderedSmallError {
	width:27px;
	background-color:#FEF8E0;
}

#orderInputSelection tbody .dateOrdered, .smallInput{
	width:80px;
}
#orderInputSelection tbody .dateOrdered, .smallInputError{
	width:80px;
	background-color:#FEF8E0;
}

#orderInputSelection tbody .originOrdered {
	width:150px;
}
#orderInputSelection tbody .originOrderedError {
	width:90%;
	background-color:#FEF8E0;
}

.even {
	background: #f1f1f1;
}

td.alignRight {
	text-align: right;
	padding-right: 5px;
}

td.normal {
	padding-left: 5px;
	font-size: 11px;
}

td.alignLeft {
	text-align: left;
	padding-left: 5px;
}
td.totalResult{
	background-color:#E0EBFE;
}
td.totalResultRecords{
	background-color:#C3D8FD;
}

td.alignCenter {
	text-align: center;
}

th.alignLeft {
	text-align: left;
	padding-left: 5px;
}

th.alignRight {
	text-align: right;
	padding-right: 5px;
}

th.programTypeCell {
	padding: 0px;
}

.orderRecap {
	border:solid 1px #c0c0c0;

	margin:0px 0 1px 0px;
	overflow:hidden;
	width:100%;
}

.orderRecap TABLE.theadGrey {
	width:100%;
}

.orderRecap .theadGrey tbody th{
	background:#c0c0c0;
	color:#fff;
	height:30px;
	font-size:11px;
}

.orderRecap tbody tr{
	background:#fff;
	border:solid 1px #c0c0c0;
	height:30px;
}

.orderRecap tbody tr.even{
	background:#f1f1f1;
}

.orderRecap tbody tr.error{
	background:#E42121;
}

.orderRecapBtn {
	float:left;
	margin:8px 0 1px 0px;
	overflow:hidden;
	width:100%;
}
.orderFooter {
	display:block;
	clear:both;
	text-align: center;
	color: black;
	width: 100%;
}

.theadGrey {
	background:#c0c0c0;
}

.smallSelect {
	width:130px;
}
.smallSelectError {
	width:130px;
	background-color:#FEF8E0;
}

.mediumSelect {
	width: 190px;
}
.mediumSelectError {
	width: 190px;
	background-color:#FEF8E0;
}

.longSelect {
	width:250px;
}

.longSelectError {
	width:250px;
	background-color:#FEF8E0;
}

.arrowUp, .arrowUpOver {
	cursor:pointer;
	height:11px;
	position:absolute;
	right:-4px;
	_right:0;
	top:0px;
	width:11px;
}

.arrowDown, .arrowDownOver {
	cursor:pointer;
	height:11px;
	position:absolute;
	right:-4px;
	_right:0;
	top:12px;
	width:11px;
}

.arrowUp {
	background: url(../images/btn/btnUp.gif) no-repeat;
}

.arrowUpOver {
	background: url(../images/btn/btnUpOver.gif) no-repeat;
}

.arrowDown {
	background: url(../images/btn/btnDown.gif) no-repeat;
}

.arrowDownOver {
	background: url(../images/btn/btnDownOver.gif) no-repeat;
}



.contentText {
	color:#000;
	float:left;
	font-size:12px;
	margin:0 15px;
}

.leftLabelDiv {
	text-align:left;
	color:#000;
	float:left;
	font-size:12px;
	margin:5 0 0 5px;
	padding:0px;
	width:375px;
	/*border:1px solid red;*/
}

.rightLabelDiv {
	color:#000;
	float:right;
	font-size:12px;
	margin:5 5px;
	padding:0px;
	/*border:1px solid blue;*/
}

.leftLabel {
	color:#000;
	float:left;
	font-size:12px;
	margin:0 15px;
}

.rightLabel {
	color:#000;
	float:right;
	font-size:12px;
	margin:0 15px;
}

.inputLabel {
	color:#000;
	font-size:11px;
	margin:0 15px;
	font-weight:bold;
}

.radioButton {
	margin:0px 4px -1px 0px;
	vertical-align: middle;
}

.subCell {
	font-size:11px;
	margin:0 4px -1px 0;
	font-weight: normal;
	color:black;
	vertical-align: middle;
	background: transparent;
	border-width: 0px !important;
	padding: 0px !important;
}

.spacerCol {
	background: lightgrey;
	border-width: 0px !important;
	padding: 0px !important;
	width:1px !important;
}

.fullWidth {
	width: 132px !important;
}

.cellLayout {
	border-width: 0px !important;
	border-collapse: collapse;
}

.programTypeInputText {
	width: 50px;
}

.programTypeInputTextError {
	width:50px;
	background-color:#FEF8E0;
}

.COROrigin{
	background-color:#C0C0C0;
	border:solid 1px #c0c0c0;
	font-size:14px;
	font-weight:bold;
	color:black;
	height:20px;
}

.CORDestination{
	background-color:#E0E0E0;
	border:solid 1px #c0c0c0;
	font-size:12px;
	font-weight:bold;
	color:black;
	height:20px;
}

.COROriginTotal {
	background-color:#DFDFFF;
	font-size:14px;
	font-weight:bold;
	color:black;
	height:20px;
}

.CORDestinationTotal {
	background-color:#DFDFFF;
	font-size:12px;
	font-weight:bold;
	color:black;
	height:20px;
}

.tableHeader {
	background-color:#909090;
	border:solid 1px #c0c0c0;
	font-size:12px;
	font-weight:bold;
	color:white;
	height:20px;
}

.tableContent {
	background-color:#ffffff;
	border:solid 1px #c0c0c0;
	font-size:11px;
	font-weight:normal;
	color:black;
	height:20px;
}

.trainTypeTitleText{
	font-size:11px;
	font-weight:bold;
	color:black;
	text-align: center;
}


.trainTypeNormalText{
	font-size:10px;
	font-weight:normal;
	color:black;
	vertical-align: top;
}

.trainTypeSpecialText{
	font-size:10px;
	font-weight:normal;
	font-style: italic;
	color:blue;
}

.trainTypeSpecialBoldText{
	font-size:11px;
	font-weight:bold;
	font-style: italic;
	color:blue;
}

.originColumn {
	width:250px;
}

/*******************************************************************************************/
/**************************** css for submenu *********************************************/
/*******************************************************************************************/
a.submenu:link {
    text-decoration: none;
	color: #555555;
}
a.submenu:visited {
    text-decoration: none;
	color: #555555;
}
a.submenu:active {
    text-decoration: none;
	color: red;
}
a.submenu:hover {
    color: red;
}

td.submenu {
-webkit-text-size-adjust:none;
-ms-text-size-adjust:none;
-moz-text-size-adjust:none;
text-size-adjust:none;
text-align: center;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size:70%;
color: #555555;
background-image: url('../images/menu/vel_bottom_tile_submenu.gif');
background-repeat: repeat-x;
white-space:nowrap;
padding: 3px 8px;
}

td.leftSubMenu {
background-image: url('../images/menu/vel_bottom_left_submenu.gif');
background-repeat: no-repeat;
height: 100%;
}

td.sepSubMenu {
background-image: url('../images/menu/vel_bottom_seperator.gif');
background-repeat: no-repeat;
height: 100%;
}

td.rightSubMenu {
background-image: url('../images/menu/vel_bottom_right_submenu.gif');
background-repeat: no-repeat;
height: 100%;
}


/*******************************************************************************************/
/**************************** css for calendar *********************************************/
/*******************************************************************************************/
#alertConfirmation {
	background:#fffbf0;
	color:#000;
	float:left;
	font-size:12px;
	padding: 8px;
	width:100%;
}


#alertImage {
	float:left;
	height:32px;
	margin:6px 22px 6px 0;
	width:31px;
}

#alertConfirmation #text{
	float:left;
	width:90%;
	margin:13px 0;
}

@media print {
	/* Hide some useless stuff */
	.required, #requiredFields, 
	.formInputBtn, .formInputBtnTop, .button, #orderBtn {
		display:none;
	}

	/* Make some adjustment */
	#orderInput.status td span,
	#orderInput.status td select,
	#orderInput.status td input,
	.orderRecap thead th.header,
	.orderRecap tbody th,
	.orderRecap tbody th span,
	.orderRecap tbody th select {
		font-size:6pt;
		font-weight: normal;
	}
	#confirmation th span {
		font-weight: normal;
	}

	#order th.marketClassText {
		font-size: 6pt;
	}
	.borderTable th.headerMarketClass {
		width: 85px;
	}
	.borderTable#order{
		width:99%;
	}	
	#orderInputSelection tbody .originOrdered,
	#orderInputSelection tbody .originOrderedError {
		width:250px;
	}
	#footer{
		padding-top:0px;
	}

	/* Split the status orders table and add an header everytime it is splitted. */
	.pageBreak {
		page-break-before: always;
	}	
	thead {
		display:table-header-group;
	}
}