@charset "utf-8";
/* CSS Document */

/* ******************************************************************************************************************* */
/* ************************************************** General styles ************************************************* */
/* ******************************************************************************************************************* */
body { background-color: #f5f5f5; font-family: Verdana, Geneva, sans-serif; font-size: 10px; margin: 0; }
a { color: #2f8927; text-decoration: none; cursor: pointer; }
a:hover { color: #003082; }
h1 { margin-top: 5px; margin-right: 0px; margin-bottom: 10px; margin-left: 0px; padding: 0px; font-size: 18px; font-weight: bold; color: #2f8927; }
h2 { margin: 0px; padding: 0px; font-size: 14px; font-weight: bold; }
h3 { margin: 0px; padding: 0px; font-size: 12px; font-weight: bold; }
form { margin: 20px; padding: 0px; }



/* ******************************************************************************************************************* */
/* ************************************************ Login Form styles ************************************************ */
/* ******************************************************************************************************************* */
#loginForm { background: url(images/gradient3.jpg) #ffffff no-repeat top left; border: 1px solid #cccccc; min-height: 400px; width: 600px; position: absolute; left: 50%; top: 50px; margin-left: -300px; z-index: 1; text-align: center; vertical-align: middle; padding-bottom: 40px; }



/* ******************************************************************************************************************* */
/* ************************************************ Main Layout styles *********************************************** */
/* ******************************************************************************************************************* */
#mainBody { background: url(images/gradient3.jpg) #ffffff no-repeat top left; border-left: 1px solid #cccccc; border-right: 1px solid #cccccc; border-bottom: 1px solid #cccccc; height: 500px; width: 1000px; }
#mainHeaderCell { border-bottom: 1px solid #dfdfdf; }
#mainContentCell { border-top: 1px solid #ffffff; padding: 8px; }



/* ******************************************************************************************************************* */
/* *************************************************** Menu styles *************************************************** */
/* ******************************************************************************************************************* */
#mainMenuCell { background: url(images/menu_bg2.png) no-repeat top right; padding: 8px; }
#mainMenuCell a { font-weight: bold; padding: 2px 10px 2px 10px; border: 1px solid transparent; }
#mainMenuCell a:hover { color: #ffffff; background: url(images/2f8927_gradC_75.png) repeat-x top left #2f8927; border: 1px solid #2f8927; }
/*
#mainMenuCell a { margin: 0px 10px 0px 10px; }
#appMenuCell { background-color: #fafafa; border-bottom: 1px solid #dfdfdf; border-top: 1px solid #ffffff; text-align: right; vertical-align: middle; color: #cccccc; height: 20px; }
#appMenuCell a { padding: 1px 8px 1px 8px; margin: 4px; }
#appMenuCell a:hover { background: url(images/100px_2f8927_grad25.png) repeat-y top right; border-bottom: 1px solid #ff0000; }
*/
/*#appMenuCell { background-color: #fafafa; border-bottom: 1px solid #dfdfdf; text-align: right; color: #cccccc; font-weight: bold; padding: 4px 0px 4px 0px; }
#appMenuCell a { padding: 4px 10px 4px 10px; border-left: 1px solid #dfdfdf; }
#appMenuCell a:hover { background: url(images/2f8927_gel_25.png) repeat-x top left; border-bottom: 1px solid #ff0000; }*/
#appMenuCell { background-color: #fafafa; border-bottom: 1px solid #dfdfdf; text-align: right; color: #cccccc; font-weight: bold; padding: 6px 4px 6px 0px; }
#appMenuCell a { padding: 4px 10px 4px 10px; border: 1px solid transparent; }
#appMenuCell a:hover { color: #ffffff; background: url(images/2f8927_gradC_75.png) repeat-x top left #2f8927; border: 1px solid #2f8927; }
#appToolbarCell { background-color: #fafafa; border-bottom: 1px solid #dfdfdf; text-align: left; color: #cccccc; font-weight: bold; padding: 4px 4px 2px 4px; }
#appToolbarCell a { padding: 8px 10px 0px 10px; border: 1px solid transparent; }
#appToolbarCell a:hover { color: #ffffff; background: url(images/2f8927_gradC_75.png) repeat-x top left #2f8927; border: 1px solid #2f8927; }
.applicationMenu { font-weight: bold; padding: 4px 0px 4px 0px; /*background: url(images/white50.png); border: 1px solid #999999;*/
}
.applicationMenu a { padding: 4px 10px 4px 10px; border: 1px solid transparent; }
.applicationMenu a:hover { color: #ffffff; background: url(images/2f8927_gradC_75.png) repeat-x top left #2f8927; border: 1px solid #2f8927; }



/* ******************************************************************************************************************* */
/* *************************************************** Font styles *************************************************** */
/* ******************************************************************************************************************* */
.pageTitle { font-size: 18px; font-weight: bold; color: #2f8927; margin: 4px 8px 2px 8px; }
.pageSubTitle { font-size: 14px; color: #999999; margin: 0px 8px 2px 8px; }
.errorMessage { color: #ff0000; font-weight: bold; margin: 40px; }
.errorMessage a { color: #963; }
.errorMessage a:hover { color: #CC0; }
.errorMessageBlock { border: 1px solid #ff0000; background-color: #ffcccc; padding: 10px; margin: 4px 0; color: #ff0000; }
.errorMessageBlock a { color: #990000; }
.errorMessageBlock a:hover { color: #cc3333; }
.successMessage { color: #2f8927 !important; }
.successMessageBlock { border: 1px solid #2f8927; background-color: #effbee; padding: 10px; margin: 4px 0; color: #2f8927; }
.warningMessage { color: #f93 !important; }
.warningMessageBlock { border: 1px solid #f60; color: #f60; background-color: #fc6; font-size: 10px; padding: 10px; margin: 4px 0; }
.noteMessage { color: #999 !important; }
.noteMessageBlock { border: 1px solid #333; color: #999; background-color: #eee; font-size: 10px; padding: 10px; margin: 4px 0; }
.note-special { font-style: italic; }
.note-small { font-size: 11px; }



/* ******************************************************************************************************************* */
/* ********************************************* Applications Home styles ******************************************** */
/* ******************************************************************************************************************* */
.applicationItemContainer { display: inline; vertical-align:top; width: 300px; height: 125px; float: left; }
.applicationIcon { display: block; width: 300px; text-align: center; }
.applicationTitle { display: block; text-align: center; width: 300px; font-size: 12px; }
.applicationDescription { display: block; margin-left: 40px; margin-bottom: 10px; }
.appCategoryHeader { background: url(/suppliers/images/efefef_gradient1_20px.png) repeat-x top left; margin-top: 40px; margin-bottom: 0px; padding: 4px 4px 0px 4px; min-height: 16px; font-size: 12px; font-weight: bold; color: #003082; }




/* ******************************************************************************************************************* */
/* ************************************************ Application styles *********************************************** */
/* ******************************************************************************************************************* */
.itemTitle { color: #999; font-weight: bold; font-size: 10px; padding-left: 4px; }
th.itemTitle { text-align: right; }
span.itemTitle { display: inline-block; text-align: right; padding-right: 4px; }
.itemSection { padding-left: 20px; padding-bottom: 12px; }
.sectionTitle { color: #666; font-weight: bold; font-size: 14px; border-bottom: 1px solid #ccc; padding: 1px; background-color: #f4f4f4; margin-bottom: 4px; }
.sectionCell { border: 1px solid #ccc;  padding: 2px; background-color: #fafafa; }
.sectionItemNotes { color: #666; font-size: 10px; padding-left: 8px; }
.sectionFooter { border: 1px solid #999999; border-top: none; padding: 2px; vertical-align: top; font-size: 10px; color: #666; background-color: #eaf3e9; }
.mainIDCell { border: 1px solid #ccc; background-color: #eee; padding: 8px; font-size: 18px; font-weight: bold; text-align: center; }




/* ******************************************************************************************************************* */
/* *************************************************** Table styles ************************************************** */
/* ******************************************************************************************************************* */
.calloutTable { border: 1px solid #2f8927; background-color: #fafafa; padding: 20px; width: 400px; margin: auto; margin-top: 40px; }
.calloutCell { border: 1px solid #2f8927; background-color: #fafafa; padding: 2px; }
.calloutCellTitle { font-weight: bold; font-size: 12px; color: #999999; }
.calloutCellClose { border: 1px solid #2f8927; background-color: ##ffffff; padding: 2px; }
.calloutCellClose:hover { background-color: #2f8927; color: #ffffff; }
.formTable { border: 1px solid #2f8927; background-color: #fafafa; padding: 5px; width: 400px; margin: auto; margin-bottom: 40px; }



/* ******************************************************************************************************************* */
/* ************************************************ Data table styles ************************************************ */
/* ******************************************************************************************************************* */
.dataTable { border: 1px solid #999999; empty-cells: show; background-color: #ffffff; margin-top: 40px; }
.dataTable th { border-bottom: 1px solid #999999; background-color: #cccccc; padding: 0px 2px 0px 2px; }
.dataRow { cursor: pointer; }
.dataRow:hover { background-color: #E6FECD; }
.evenRow { background-color: #f4f4f4; }
.oddRow { background-color: #ffffff; }
.evenRowHighlight1 { background-color: #ffe0e0; }
.oddRowHighlight1 { background-color: #ffefef; }
.highlight1Description { padding: 4px; border: 1px solid #cccccc; background-color: #ffe0e0; font-weight: bold; }
.evenRowHighlight2 { background-color: #f0ffe0; }
.oddRowHighlight2 { background-color: #f8ffe8; }
.highlight2Description { padding: 4px; border: 1px solid #cccccc; background-color: #f0ffe0; font-weight: bold; }
.evenRowHighlight3 { background-color: #e8f8ff; }
.oddRowHighlight3 { background-color: #efffff; }
.highlight3Description { padding: 4px; border: 1px solid #cccccc; background-color: #e8f8ff; font-weight: bold; }
.dataCell { border-top: 1px solid #cccccc; padding: 0px 2px 0px 2px; }
.dataTableHeaderCell { background-color: #2f8927; color: #ffffff; border-bottom: 1px solid #333333; font-size: 14px; font-weight: bold; padding: 2px; }
.dataTableMenuCell { background-color: #2f8927; color: #ffffff; border-bottom: 1px solid #333333; padding: 2px; font-size: 10px; }
.addLink { font-size: 8px; font-weight: bold; border: 1px solid #efefef; background-color: #00bb00; color: #efefef; padding: 0px 2px 0px 2px; margin: 1px; }
.addLink:hover { background-color: #00dd00; color: #ffffff; }
.deleteLink { font-size: 8px; font-weight: bold; border: 1px solid #efefef; background-color: #cc0000; color: #efefef; padding: 0px 3px 0px 3px; margin: 1px; }
.deleteLink:hover { background-color: #ff0000; color: #ffffff; }

.valuesTable { }
.valuesTable th, .valuesTable-th { color: #999; font-weight: bold; font-size: 10px; padding: 2px; vertical-align: middle; }
.valuesTable th { text-align: right; }
.valuesTable td { color: #000; font-weight: normal; font-size: 12px; padding: 2px; vertical-align: middle; text-align: left; }
.valuesTable input, .valuesTable textarea, .valuesTable select { -webkit-appearance: none; -webkit-border-radius: 0; padding: 4px; margin: 0; outline: 0; border: 1px solid #ccc; }
.valuesTable input[type="radio"] { -webkit-appearance: radio; border: none; }
.valuesTable input[type="checkbox"] { -webkit-appearance: checkbox; border: none; }
.valuesTable select { -webkit-appearance: menulist; }
.valuesTable-small { font-size: 10px; }
.valuesTable-paddedLink { padding: 0 10px; }
.valuesTable-noteText { font-size: 11px; color: #666; }
.valuesTable th.listTitle { vertical-align: top; padding-top: 6px; }
.valuesTable-vertical { }
.valuesTable-vertical th { color: #999; font-weight: bold; font-size: 10px; padding: 10px 2px 2px 2px; vertical-align: bottom; text-align: left; }
.valuesTable-vertical td { color: #000; font-weight: normal; font-size: 12px; padding: 2px; vertical-align: top; text-align: left; }

.dataTable-basic { border: 1px solid #ccc; empty-cells: show; border-spacing: 0; border-collapse: collapse; }
.dataTable-basic td { border-top: 1px solid #ccc; text-align: left; vertical-align: top; padding: 2px; }
.dataTable-basic th { background-color: #2f8927; font-weight: bold; color: #fff; text-align: left; vertical-align: bottom; padding: 2px; }
.dataTable-basic th a { color: #fff; }
.dataTable-basic th a:hover { text-decoration: underline; }
.dataTable-basic tr.odd { background-color: #fff; }
.dataTable-basic tr.even { background-color: #eee; }
.dataTable-basic td.numeric, .dataTable-basic th.numeric { text-align: right; }
.dataTable-basic td.actions, .dataTable-basic th.actions { text-align: right; }
.dataTable-basic td.right, .dataTable-basic th.right { text-align: right; }
.dataTable-basic tr.footer td { border-top: 2px solid #333; background-color: #eaf3e9; }
.dataTable-basic tr.noBorder td { border: none; }
.dataTable-basic tr[onclick] { cursor: pointer; }
.dataTable-basic tr[onclick]:hover { background-color: #eaf3e9; }
.dataTable-basic .border-left { border-left: 1px solid #ccc; }

.dataTable-blockList { border-top: 1px dotted #999; }
.dataTable-blockList div.odd { background-color: #fff; }
.dataTable-blockList div.odd:hover { }
.dataTable-blockList div.even { background-color: #f4f4f4; }
.dataTable-blockList div.even:hover { }
.dataTable-blockList-item { padding: 10px; border-bottom: 1px dotted #999; }
.dataTable-blockList-item h3 { margin: 0; padding: 0 0 10px 0; }
.dataTable-blockList-item p { margin: 0; padding: 0 0 0 20px; }
.dataTable-blockList-item[onclick] { cursor: pointer; }
.dataTable-blockList-item[onclick]:hover { background-color: #eaf3e9; }

.dataTable-drawer { border: 1px solid #ccc; border-top: none; background-color: #f8f8f8; padding: 4px; }

.dataTable-footer { border: 1px solid #ccc; border-top: none; background-color: #edf3e9; padding: 4px; text-align: right; }
.dataTable-footer a { margin-left: 20px; }



/* ******************************************************************************************************************* */
/* ********************************************** Message Table styles *********************************************** */
/* ******************************************************************************************************************* */
#messageTable{ border: 1px solid #cccccc; background-color: #f4f4f4; display: block; margin: 10px; }
.statusMessage { font-family: Arial, Helvetica, sans-serif; font-size: 18px; color: #003082; text-decoration: none; padding: 4px 10px 4px 10px; }



/* ******************************************************************************************************************* */
/* ************************************************ Fade Prompt styles *********************************************** */
/* ******************************************************************************************************************* */
.fadePromptBackground { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; z-index: 100; background: url(images/black75.png) repeat; vertical-align: middle; color: #ffffff; }
.fadePromptMainSection { position: absolute; top: 50%; left: 50%; min-height: 100px; width: 350px; margin-top: -50px; margin-left: -200px; border: 1px solid #000000; background-color: #f4f4f4; color: #555555; padding: 25px; }
.fadePromptMainSection800 { position: absolute; top: 200px; left: 50%; margin: auto; margin-left: -425px; padding: 25px; width: 800px; min-height: 100px; border: 1px solid #000000; background-color: #f4f4f4; color: #555555; }
.fadePromptOkButton { border: 1px solid #999999; background: #dddddd url(images/gel4.png) repeat-x top left; padding: 2px; width: 100px; left: 50%; margin-left: 0px; position: relative; text-align: center; vertical-align: middle; margin-top: 40px; color: #2f8927; font-weight: bold; }
.fadePromptOkButton:hover { background: #dddddd url(images/white75.png) repeat; cursor: pointer; }



/* ******************************************************************************************************************* */
/* ************************************************** Button styles ************************************************** */
/* ******************************************************************************************************************* */
a.formButton { padding: 12px 18px 12px 18px; margin: 2px; font-size: 16px; font-weight: bold; border: 1px outset #f3f3f3; background: url(images/buttons/formButton_43px_A.jpg) top repeat-x #cfcfcf; color: #333333; cursor: pointer; }
a.formButton:hover { border: 1px outset #c6e7f8; background: url(images/buttons/formButton_43px_A_hover.jpg) top repeat-x #a7d9f5; }
a.formButton:active { border: 1px inset #c6e7f8; background: url(images/buttons/formButton_43px_A_active.jpg) top repeat-x #c6e7f8; }
a.formButtonSmall { padding: 8px 14px 8px 14px; margin: 2px; font-size: 12px; font-weight: bold; border: 1px outset #f3f3f3; background: url(images/buttons/formButton_32px_A.jpg) top repeat-x #cfcfcf; color: #333333; cursor: pointer; }
a.formButtonSmall:hover { border: 1px outset #c6e7f8; background: url(images/buttons/formButton_32px_A_hover.jpg) top repeat-x #a7d9f5; }
a.formButtonSmall:active { border: 1px inset #c6e7f8; background: url(images/buttons/formButton_32px_A_active.jpg) top repeat-x #c6e7f8; }
a.formButtonSmaller { padding: 4px 6px 4px 6px; margin: 2px; font-size: 10px; font-weight: bold; border: 1px outset #f3f3f3; background: url(images/buttons/formButton_20px_A.jpg) top repeat-x #cfcfcf; color: #333333; cursor: pointer; }
a.formButtonSmaller:hover { border: 1px outset #c6e7f8; background: url(images/buttons/formButton_20px_A_hover.jpg) top repeat-x #a7d9f5; }
a.formButtonSmaller:active { border: 1px inset #c6e7f8; background: url(images/buttons/formButton_20px_A_active.jpg) top repeat-x #c6e7f8; }

.button-primary { border: 1px solid #2f8927; background-color: #43953c; padding: 5px 10px; margin: 0; white-space: nowrap; font-size: 11px; font-weight: bold; color: #fff; cursor: pointer; text-shadow: 0 -1px 1px rgba(0, 0, 0, .25); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .5); border-radius: 4px; }
.button-primary:hover { background-color: #63a75d; color: #fff; }
.button-secondary { border: 1px solid #ccc; background-color: #eee; padding: 5px 10px; margin: 0; white-space: nowrap; font-size: 11px; font-weight: bold; color: #333; cursor: pointer; text-shadow: 0 1px 1px rgba(255, 255, 255, .5); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .5); border-radius: 4px; }
.button-secondary:hover { background-color: #f4f4f4; color: #333; }
.button-small { padding: 2px 6px; }
.button-smaller { padding: 1px 4px; font-size: 10px; }
.button-large { padding: 4px 12px; font-size: 18px; }
input.button-primary { -webkit-appearance: none; -webkit-border-radius: 0; font-family: Verdana, Geneva, sans-serif; border: 1px solid #2f8927; background-color: #43953c; padding: 5px 10px; margin: 0; font-size: 11px; font-weight: bold; color: #fff; cursor: pointer; text-shadow: 0 -1px 1px rgba(0, 0, 0, .25); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .5); border-radius: 4px; }
input.button-secondary { -webkit-appearance: none; -webkit-border-radius: 0; font-family: Verdana, Geneva, sans-serif; border: 1px solid #ccc; background-color: #eee; padding: 5px 10px; margin: 0; font-size: 11px; font-weight: bold; color: #333; cursor: pointer; text-shadow: 0 1px 1px rgba(255, 255, 255, .5); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .5); border-radius: 4px; }




/* *********************************************************************** */
/* ************************* Image Button styles ************************* */
/* *********************************************************************** */
.imageButtonLink { padding: 2px; }
.imageButtonLink:hover { background-color: #C1E0FF; }




/* ******************************************************************************************************************* */
/* ************************************************ PO Inquiry styles ************************************************ */
/* ******************************************************************************************************************* */
.poNote { border: 1px solid #d0d0d0; background-color: #f6f6f6; margin: 0px 2px 2px 40px; }
.poLineNote { border: 1px solid #d0d0d0; margin: 0px 2px 2px 40px; }
.poLineNote:hover { background-color: #e6fecd; }





/* ******************************************************************************************************************* */
/* ********************************************* My Folder styles **************************************************** */
/* ******************************************************************************************************************* */
.myFolderItemContainer { display: inline; vertical-align:top; width: 200px; height: 125px; float: left; 
}
.myFolderIcon { display: block; width: 200px; text-align: center; }
.myFolderTitle { display: block; text-align: center; width: 200px; font-size: 12px; }