@charset "utf-8";
html, body { margin: 0; height: 100%; font-family: Arial, Helvetica, sans-serif; user-select: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; background-color: #FFF; }
body { display: flex; flex-direction: column; }
main { flex: 1; overflow: auto; height: inherit; }
section { height: 100%; overflow-x: auto; overflow-y: hidden; background-color: #003978; }
footer { height: auto; font-family: Arial, Helvetica, sans-serif; font-size: 9pt; color: #FFF; background-color: #003978; text-align: center; display: none; }

#Page_Header { font-family: Arial, Helvetica, sans-serif; font-size: 14pt; font-weight: bold; color: #FFF; background-color: #003978; height: 25px; width: 100%; text-align: center; padding-top: 3px; margin-bottom: 4px; }

.Masthead_Controls_Container_Radio { display: flex; flex-direction: row; justify-content: center; align-content: center; gap: 4px; margin-top: 2px; margin-bottom: 2px; width: max-content; height: max-content; margin-left: auto; margin-right: auto; }
.Masthead_Controls_Container_Radio input[type="radio"] { margin-top: -4px; }
.Masthead_Controls_Container_Radio input[type="checkbox"] { margin-top: -1px; margin-left: 6px; }
.Masthead_Controls_Container_Radio label { font-family: Arial, Helvetica, sans-serif; font-size: 9pt; font-weight: normal;  }
.Masthead_Controls_Container_Button { display: flex; flex-direction: row; justify-content: center; align-content: center; gap: 4px; color: #003978; padding-top: 2px; padding-bottom: 2px; width: 100%; height: 30px; }
	
#filter_po_number { width: 102px; }
#filter_item_number { width: 128px; }
#filter_item_description { width: 380px; min-width: 380px; }
#filter_quantity { width: 50px; text-align: center; }
#filter_ordered_by { width: 128px; }
#filter_ordered_by_email { width: 140px; }
#filter_order_date_begin, #filter_order_date_end { width: 65px; }
#filter_order_status { width: 80px; }
#filter_ordered_for { width: 148px; }
#filter_phone { width: 93px; }
#filter_location_id { width: 95px; }
#filter_cost_center { width: 90px; }
#filter_ship_method { width: 107px; }
#filter_ship_address { width: 192px; }
#filter_ship_city { width: 114px; }
#filter_ship_state,#filter_invoiced { width: 90px; }
#filter_ship_zipcode { width: 109px; }
#filter_ship_country { width: 109px; }
#filter_ship_care_of { width: 212px; }
#filter_inventory,#filter_min_inventory,#filter_max_inventory { width: 85px; }
#filter_cost_each { width: 85px; text-align: right; }
#filter_fulfillment { width: 85px; text-align: right; }
#filter_tracking_number { width: 500px; }
#filter_order_comments { width: 212px; }

/* Navigation buttons */
#Nav_Button_Container { display: flex; flex-direction: row; justify-content: center; align-content: center; gap: 4px; color: #003978; padding-top: 2px; padding-bottom: 2px; width: 100%; height: 26px; }
.Button_Nav,.Button_Nav_Disabled,.Button_Nav_Current_Page,.Button,.Button_Tracking_Number { font-family: Arial, Helvetica, sans-serif; font-size: 8pt; text-align: center; height: 11px; width: max-content; min-width: 20px; margin-left: 2px; margin-right: 2px; -webkit-border-radius: 8px; -khtml-border-radius: 8px; border-radius: 8px; behavior:url("border-radius.htc"); border: 1px solid #000; padding: 6px; background-image: linear-gradient(#FFF,#BBB); user-select: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; float: left; display: inline; cursor: pointer; }
.Button_Nav_Disabled { color: #777; border: 1px solid #777; cursor: default; }
.Button_Nav_Current_Page { color: #090; font-weight:bold; border: 2px solid #090; }
.Button_Nav:hover,.Button:hover,.Button_Tracking_Number:hover { box-shadow: 1px 1px 5px #000; }
.Button_Nav:active,.Button:active,.Button_Tracking_Number:active { box-shadow: 1px 1px 5px #000; border: 1px solid #555; background-image: linear-gradient(#EEE,#AAA); }
.Button_Tracking_Number,.Button_Tracking_Number:active { height: max-content; }
.Button_Nav_Gap_Spacer,.Button_Nav_Gap_NoSpacer { width: 10px; height: 11px; float: left; display: inline; }
.Button_Nav_Gap_NoSpacer { width: 1px; }

/* Download Report Dialogue */
#popup_download_pdf_container { position: absolute; top: 200px; width: 400px; height: max-content; left: 50%; margin-left: -200px; background-color: #FFF; border: 1px solid #090; box-shadow: 1px 1px 5px #000; z-index: 5000;  }
#popup_download_pdf_container_header { width: inherit; height: max-content; padding-top: 3px; padding-bottom: 3px; font-family: Arial, Helvetica, sans-serif; font-size: 12pt; text-align: center; color: #FFF; background-color: #003978;;  }
#popup_download_pdf_container_body { width: inherit; height: max-content; }
#popup_download_pdf_button_container { width: max-content; height: max-content; margin-left: auto; margin-right: auto; margin-top: 50px; margin-bottom: 20px; }
#popup_download_pdf_button { font-family: Arial, Helvetica, sans-serif; font-size: 12pt; text-align: center; }

#Grid_Container { float: left; height: 100%; width: auto; }
.Grid { background-color: #FFF; border-right-width: 1px; border-bottom-width: 1px; border-right-style: solid; border-bottom-style: solid; border-right-color: #014075; border-bottom-color: #014075; }
.Grid_Header { font-family: Arial, Helvetica, sans-serif; font-size: 14px; font-weight: bold; color: #FFF; text-align: center; text-decoration: none; height: 22px; }
.Grid_Header_Sort_Button { background: linear-gradient(#2C6DB1, #0B367B); cursor: pointer; }
.Grid_Header_Non_Sort_Button { background: linear-gradient(#2C6DB1, #0B367B); }
.Grid_Header_Sort_Button:hover { background: linear-gradient(#6CF, #2C6DB1); color: #0B367B; }
.Grid_Title { font-family: Arial, Helvetica, sans-serif; font-size: 14px; font-weight: bold; color: #FFF; background-color: #014075; text-align: center; }
#Grid_Table, #Grid_Table_Partial { height: 100%; border-right-width: 1px; border-bottom-width: 1px; border-right-style: solid; border-bottom-style: solid; border-right-color: #014075; border-bottom-color: #014075; }
#Grid_Table_Partial { height: auto; }
#Grid_Table tr.Grid_Row:nth-child(odd), #Grid_Table_Partial tr.Grid_Row:nth-child(odd) { background-color: #E7E7E7; }
#Grid_Table tr.Grid_Row_No_Hover:nth-child(odd), #Grid_Table_Partial tr.Grid_Row_No_Hover:nth-child(odd) { background-color: #E7E7E7; }
#Grid_Table tr.Grid_Row:nth-child(even), #Grid_Table_Partial tr.Grid_Row:nth-child(even) { background-color: #FFF; }
#Grid_Table tr.Grid_Row_No_Hover:nth-child(even), #Grid_Grid_Table_PartialTable tr.Grid_Row_No_Hover:nth-child(even) { background-color: #FFF; }
.Grid_Row,.Grid_Row_No_Hover { border-right-width: 1px; border-bottom-width: 1px; border-right-style: solid; border-bottom-style: solid; border-right-color: #014075; border-bottom-color: #014075; height: 20px; padding-left: 4px; padding-right: 4px; color: #014076; }
.Grid_Row:hover, .Grid_Row:hover a, .Grid_Row a:hover { background: linear-gradient(#2C6DB1, #0B367B); color: #FFF; }
.Grid_Cell,.Grid_Cell_Center,.Grid_Cell_Tracking,.Grid_Cell_Search,.Grid_Cell_Search_Center { font-family: Arial, Helvetica, sans-serif; font-size: 10px; font-weight: normal; border-left-width: 1px; border-top-width: 1px; border-left-style: solid; border-top-style: solid; border-left-color: #014075; border-top-color: #014075; padding-left: 4px; padding-right: 4px; }
.Grid_Cell_Center,.Grid_Cell_Search_Center { text-align: center; }
.Grid_Search { background-color: #0B367B; height: 25px; max-height: 25px; }
.Grid_Search_Data { font-family: Arial, Helvetica, sans-serif; font-size: 12px; font-weight: bold; color: #014076; text-transform: uppercase; }
.Grid_Data { font-family: Arial, Helvetica, sans-serif; font-size: 10px; font-weight: normal; color: #014076; }
.Grid_Button, .Grid_Button_Control { font-family: Arial, Helvetica, sans-serif; font-size: 10px; font-weight: normal; color: #014075; text-align: center; }

/* Edit Screen */
#order_history_for_americopy_form_container { margin-top: 30px; width: max-content; margin-left: auto; margin-right: auto; -webkit-border-radius: 8px; -khtml-border-radius: 8px; border-radius: 8px; behavior:url("border-radius.htc"); }
#order_history_for_americopy_form_header { font-family: Arial, Helvetica, sans-serif; font-size: 14pt; font-weight: bold; background-color: #003978; color: #FFF; text-align: center; padding-top: 4px; padding-bottom: 4px; -webkit-border-top-left-radius: 6px; -khtml-border-top-left-radius: 6px; border-top-left-radius: 6px; -webkit-border-top-right-radius: 6px; border-top-right-radius: 6px; -khtml-border-top-right-radius: 6px; border-top-left-right: 6px; behavior:url("border-radius.htc");}
.order_history_for_americopy_form_column_header, .order_history_for_americopy_form_field { font-family: Arial, Helvetica, sans-serif; font-size: 12pt; font-weight: normal; color: #003978; padding-left: 4px; }
.order_history_for_americopy_form_column_header { font-weight: normal; background-color: #777; color: #FFF; padding-left: 4px; text-align: center; }

.Login_Form_Header { font-family: Arial, Helvetica, sans-serif; font-size: 12px; font-weight: bold; color: #014075; text-align: left; }
.Login_Form_Text { font-family: Arial, Helvetica, sans-serif; font-size: 12px; font-weight: normal; color: #014075; text-align: left; }

datalist { position: absolute; background-color: white; border: 1px solid blue; border-radius: 0 0 5px 5px; border-top: none; font-family: sans-serif; width: 350px; padding: 5px; max-height: 10rem; overflow-y: auto; }
datalist option { background-color: white; padding: 4px; color: blue; margin-bottom: 1px; font-size: 18px; cursor: pointer; }
datalist option:hover, .active{   background-color: lightblue; }

.combobox-list { position: relative; }
.combobox .group { display: inline-flex; padding: 4px; cursor: pointer; }
.combobox input, .combobox button { background-color: white; color: black; box-sizing: border-box; height: 24px; padding: 0; margin: 0; vertical-align: bottom; border: 1px solid gray; position: relative; cursor: pointer; }
.combobox input { width: 150px; border-right: none; outline: none; padding: 1px 3px; }
.combobox button { width: 19px; border-left: none; outline: none; color: rgb(0 90 156); }
.combobox button[aria-expanded="true"] svg { transform: rotate(180deg) translate(0, -3px); }
ul[role="listbox"] { margin: 0; padding: 0; position: absolute; left: 4px; top: 34px; list-style: none; background-color: white; display: none; box-sizing: border-box; border: 2px currentcolor solid; max-height: 250px; width: max-content; padding-right: 10px; overflow: scroll; overflow-x: hidden; cursor: pointer; }
ul[role="listbox"] li[role="option"] { font-size: 10pt; margin: 0; display: block; padding-left: 3px; padding-top: 4px; padding-bottom: 4px; }

ul[role="listbox"] li[role="option"]:nth-child(even) { background-color: #DBE7E3; }
/* focus and hover styling */
.combobox .group.focus, .combobox .group:hover { padding: 2px; border: 2px solid currentcolor; border-radius: 4px; }
.combobox .group.focus polygon, .combobox .group:hover polygon { fill-opacity: 1; }
.combobox .group.focus input,.combobox .group.focus button,.combobox .group input:hover,.combobox .group button:hover { background-color: #def; }

[role="listbox"].focus [role="option"][aria-selected="true"] { background-color: blue; color: #FFF; }
[role="listbox"] [role="option"]:hover { background-color: blue !important; color: #FFF; }

#modal_shade { position: fixed; left: 0px; top: 0px; width:100%; height:100%; text-align:center; z-index: 4990; background-color: #000; opacity: .85; }