/*
https://fontawesome.com/v5/search
*/

:root {
	--highlight_color: #FFBF00;

    --urba_base_color: #2274A5;
    --urba_base_color_local: darkmagenta;
    /*--urba_base_color: #ffb502;*/
    --urba_base_color_contrast: #4D9DE0;

	--urba_secondary_color: #E83F6F;
    /*--urba_secondary_color: #2592b5;*/
    --urba_secondary_color_contrast: pink;

	--urba_tertiary_color: #32936F;
	/*--urba_tertiary_color: #A5BC0D;*/
	--urba_tertiary_color_contrast: #B8D5B8;

	--urba_local_color: #464530;
	--urba_local_color_contrast: silver;

	--page_color: white;

	--link_button_color: #2592b5;
	--link_button_dropshadow: #0b495d;

	--search_button_color: #2592b5;
	--search_button_dropshadow: #0b495d;

	--button_hover_color: tomato;

	--batch_color_green: #15B041;
	--batch_color_orange: #F08D1B;
	--batch_color_yellow: #F2CE00;
}
.image_thumbnail {
	max-width: 100px;
	max-height: 100px;
	display: inline-block;
}
.image_preview {
	max-width: 200px;
	max-height: 200px;
	display: inline-block;
}

.body { background-color:white; margin:0; padding:0; accent-color:dodgerblue;}
.body_off { background-color:white; margin:0; padding:0; }

.hidden { display:none; }

.inline_definition { float:left; margin:7px 0 0 3px; font-size:9pt; color:lightgray; cursor:zoom-in; }
.inline_definition:hover { color:tomato; }

.title_banner { float:left; background-color:#2274A5; width:100vw; color:white; }

.owner_only { float:left; padding:3px 9px; color:white; margin:2px; background-color:turquoise; border-radius:4px; }

.nav { position:absolute; top:36px; left:0; background-color:var(--urba_base_color); width:40px; height:100%; margin:0; padding:4px 0 0 5px; }
.nav_button { font-size:22px; width:35px; text-align:center; padding:6px 2px; color:white; background-color:var(--urba_secondary_color); border-top-left-radius:6px; border-bottom-left-radius:6px; margin:2px 0; }
.nav_button_off { color:var(--urba_base_color_contrast); cursor:pointer; padding:6px 2px; background-color:var(--urba_base_color); }
.nav_button_off:hover { color:var(--highlight_color); }
.nav_button_forbidden { color:var(--urba_base_color); padding:6px; background-color:var(--urba_base_color); }

.subnav { position:absolute; top:36px; left:40px; background-color:var(--urba_secondary_color); width:40px; height:100%; margin:0; padding:4px 0 0 5px; }
.subnav_button { font-size:22px; width:35px; text-align:center; padding:6px 2px; cursor:pointer; color:white; background-color:var(--urba_tertiary_color); border-top-left-radius:6px; border-bottom-left-radius:6px; margin:2px 0; }
.subnav_button_off { color:var(--urba_secondary_color_contrast); cursor:pointer; padding:6px 2px; background-color:var(--urba_secondary_color); }
.subnav_button_off:hover { color:var(--highlight_color); }
.subnav_hidden { display:none; }

.nav_button_permissions_on { font-size:20px; color:var(--urba_tertiary_color); cursor:pointer; }
.nav_button_permissions_on:hover { color:tomato }
.nav_button_permissions_off { font-size:20px; color:lightgray; cursor:pointer; }
.nav_button_permissions_on:hover { color:tomato }
.nav_button_permissions_plus { font-size:20px; color:var(--urba_tertiary_color); cursor:pointer; }
.nav_button_permissions_on:hover { color:tomato }

.localnav { position:absolute; top:0; left:0; background-color:var(--urba_tertiary_color); width:40px; height:100%; margin:0; padding:4px 0 0 5px; }
.localnav_button { font-size:24px; width:35px; text-align:center; padding:6px 0; color:#464530; background-color:white; border-top-left-radius:6px; border-bottom-left-radius:6px; }
.localnav_button_off { color:var(--urba_tertiary_color_contrast); cursor:pointer; padding:6px 0; background-color:var(--urba_tertiary_color); }
.localnav_button_off:hover { color:var(--highlight_color); }
.localnav_button_hidden { display:none; }
.localnav_hidden { display:none; }

.launch_supurba_1 { float:left; background-color:var(--highlight_color); color:var(--urba_secondary_color); font-size:10pt; font-weight:bold; margin:0 0 0 6px; padding:2px 10px; border-radius:6px; cursor:pointer;}
.launch_supurba_1:hover { background-color:lightsteelblue; }

.device_select { float:left; background-color:#FFBF00; padding:10px 20px; border-radius:10px; margin:4px; cursor:pointer; font-weight:bold; color:white; }
.device_select_off { float:left; background-color:#FFBF00; padding:10px 20px; border-radius:10px; margin:4px; font-weight:bold; color:white; }
.device_select:hover { background-color:yellow; color:darkolivegreen; }
.device_select_none { float:left; background-color:hotpink; padding:10px 20px; border-radius:10px; margin:4px; font-weight:bold; color:white; }

#content_wrap { position:absolute; top:36px; left:80px; width:calc(100% - 80px); height:100%; background-color:white; }

.supurba_logo { width: 250px; height: auto; }
.supurba_logo_div { margin-top:30px; }

.page_title_div { float:left; width:100%; padding:10px 0 2px 10px; margin-bottom:3px; }
.section_title { padding:3px 10px; font-family:'Open Sans', sans-serif; font-size:16px; color:white; background-color:#464530; margin-right:3px; border-top-left-radius:6px; border-top-right-radius:6px; }
.page_title { padding:3px 10px; font-family:'Open Sans', sans-serif; font-size:16px; color:white; background-color:#464530; margin-right:3px; border-radius:6px; }
.header_div { float:left; width:100%;  font-family:'Open Sans', sans-serif; font-size:18px; color:#464530; }
.sub_section_title { padding:3px 10px; font-family:'Open Sans', sans-serif; font-size:18px; color:#464530; margin-right:3px; border-bottom:3px solid #464530; }
.order_header_div { float:left; width:100%;  font-family:'Open Sans', sans-serif; color:#464530; }

.local_wrap { position:absolute; top:0; left:40px; width:calc(100% - 40px); height:100%; background-color:white; }
.local_wrap_solo { position:absolute; top:0; left:0; width:calc(100%); height:100%; background-color:#32936F; }

.page_div_padded { float:left; width:100%; padding:10px; }
.page_div_extended { float:left; width:100%; padding:0; background-color:white; }
.list_div { float:left; font-family:'Lato', sans-serif; font-weight:400; color:black; width:100%; border-bottom:1px solid #464530; padding:6px 0; }
.list_div_bold { float:left; font-family:'Lato', sans-serif; font-weight:400; color:black; width:100%; border-bottom:2px solid #464530; padding:6px 0; }
.sublist_div { float:left; font-family:'Lato', sans-serif; font-weight:400; color:gray; width:100%; border-bottom:1px solid lightgray; padding:6px 0; }
.list_titles { font-style:italic; }

.search_button { float:left; padding:2px 10px; font-family:'Lato', sans-serif; font-weight:400; font-size:16px; color:white; background-color:#2592b5; margin-right:3px; cursor:pointer; border-radius:6px; border-right:1px solid #0b495d; border-bottom:1px solid #0b495d; }
.search_button:hover { background-color:tomato; }
.add_item_button { float:left; padding:2px 10px; font-family:'Lato', sans-serif; font-weight:400; font-size:16px; color:white; background-color:#2592b5; margin-right:6px 3px 0 0; cursor:pointer; border-radius:6px; border-right:1px solid #0b495d; border-bottom:1px solid #0b495d; }
.add_item_button:hover { background-color:tomato; }
.view_button { float:left; padding:2px 8px 1px 8px; font-family:'Lato', sans-serif; font-weight:400; font-size:11px; color:white; background-color:#2592b5; margin-right:3px; cursor:pointer; border-radius:4px; border-right:1px solid #0b495d; border-bottom:1px solid #0b495d; }
.view_button:hover { background-color:tomato; }
.do_button { float:left; padding:2px 8px 1px 8px; font-family:'Lato', sans-serif; font-weight:400; font-size:11px; color:white; margin-right:3px; cursor:pointer; border-radius:4px; border-right:1px solid black; border-bottom:1px solid black; }
.do_button_1 { background-color:hotpink; }
.do_button_2 { background-color:purple; }
.do_button_3 { background-color:dodgerblue; }
.do_button_4 { background-color:crimson; }
.do_button_5 { background-color:green; }
.do_button_6 { background-color:goldenrod; }
.do_button_7 { background-color:orangered; }
.do_button_8 { background-color:olivedrab; }
.do_button_m { background-color:limegreen; }
.do_button_su { background-color:lightcoral; }
.do_button_o { background-color:turquoise; }
.do_button_jl { background-color:#3c8357; }
.do_button_off { background-color:lightgray; }
.do_button_atl { background-color:#2E6171; }
.do_button_lv { background-color:#2BB67E; }
.do_button_rtl { background-color:deepskyblue; }
.do_button_admin { background-color:deepskyblue; }
.do_button:hover { background-color:tomato; }
.store_button_0 { background-color:silver; }
.store_button_1 { background-color:slateblue; }
.store_button_2 { background-color:darkcyan; }
.store_button_3 { background-color:palevioletred; }
.store_button_4 { background-color:orangered; }
.store_button_5 { background-color:crimson; }
.store_color_1 { color:slateblue; }
.store_color_2 { color:darkcyan; }
.store_color_3 { color:palevioletred; }
.store_color_3 { color:orangered; }
.reverse_button_1 { float:left; padding:2px 8px 2px 8px; font-family:'Lato', sans-serif; font-weight:400; font-size:11px; color:crimson; margin-right:3px; cursor:pointer; border-radius:4px; background-color:white; }
.reverse_button_1:hover { background-color:tomato; }
.reverse_button_2 { float:left; padding:2px 8px 2px 8px; font-family:'Lato', sans-serif; font-weight:400; font-size:11px; color:lightseagreen; margin-right:3px; border-radius:4px; background-color:white; }
.do_nothing_button { float:left; padding:2px 8px 1px 8px; font-family:'Lato', sans-serif; font-weight:400; font-size:11px; background-color:lightgray; color:white; margin-right:3px; border-radius:4px; border-right:1px solid lightgray; border-bottom:1px solid lightgray; }
.dont_do_button { float:left; padding:2px 8px 1px 8px; font-family:'Lato', sans-serif; font-weight:400; font-size:11px; background-color:gray; color:white; margin-right:3px; border-radius:4px; border-right:1px solid gray; border-bottom:1px solid gray; }
.move_button { float:left; padding:2px 4px 1px 6px; font-size:15px; color:white; background-color:#2592b5; margin-right:3px; cursor:pointer; border-radius:4px; border-right:1px solid #0b495d; border-bottom:1px solid #0b495d; }
.move_button:hover { background-color:tomato; }
.held_button { float:left; padding:2px 8px 1px 8px; font-family:'Lato', sans-serif; font-weight:400; font-size:11px; color:white; background-color:hotpink; margin-right:3px; cursor:pointer; border-radius:4px; border-right:1px solid crimson; border-bottom:1px solid crimson; }
.held_button:hover { background-color:tomato; }
.report_pass { float:left; padding:2px 8px 1px 8px; font-family:'Lato', sans-serif; font-weight:400; font-size:11px; color:white; background-color:green; margin-right:3px; border-radius:4px; border-right:1px solid #0b495d; border-bottom:1px solid #0b495d; }
.report_fail { float:left; padding:2px 8px 1px 8px; font-family:'Lato', sans-serif; font-weight:400; font-size:11px; color:white; background-color:hotpink; margin-right:3px; border-radius:4px; border-right:1px solid crimson; border-bottom:1px solid crimson; }
.report_neutral { float:left; padding:2px 8px 1px 8px; font-family:'Lato', sans-serif; font-weight:400; font-size:11px; color:white; background-color:dodgerblue; margin-right:3px; border-radius:4px; border-right:1px solid #0b495d; border-bottom:1px solid #0b495d; }

.lightning_add_button { float:left; padding:0; background-color:green; color:white; font-weight:bold; width:200px; text-align:center; cursor:pointer; border-radius:6px; }
.lightning_add_button:hover { background-color:limegreen; }
.lightning_add_button_off { float:left; padding:0; background-color:lightgray; color:white; font-weight:bold; width:200px; text-align:center; border-radius:6px; }

.question_bubble { cursor:pointer; color:silver; font-size:20pt; }
.question_bubble:hover { color:tomato; }

.dont_do_button_active { float:left; padding:2px 8px 1px 8px; font-family:'Lato', sans-serif; font-weight:400; font-size:11px; color:white; margin-right:3px; border-radius:4px; }

/*//// progress flag ////*/

.kat_ina_loading { height: 120px; width:80px; }
.kat_ina_loaded { background-image:url('../assets/YES_KAT_INA.png'); height: 120px; width:80px; }
.progress_flag { float:left; font-family:'Lato', sans-serif; border-radius:3px; padding:1px 6px; font-size:7pt; cursor:pointer; background-color:white; color:lightgray; border:1px solid lightgray; }
.progress_flag:hover { background-color:tomato; border:1px solid tomato; color:white; }

.progress_flag_pending { color:white; background-color:silver; border:1px solid silver; border-bottom: 1px solid black; border-right:1px solid black; }
.progress_flag_in_process { color:white; background-color:dodgerblue; border:1px solid dodgerblue; border-bottom: 1px solid black; border-right:1px solid black; }
.progress_flag_half_completed { color:white; background-color:limegreen; border:1px solid limegreen; border-bottom: 1px solid black; border-right:1px solid black; }
.progress_flag_completed { color:white; background-color:green; border:1px solid green; border-bottom: 1px solid black; border-right:1px solid black; }
.progress_flag_issue { color:white; background-color:hotpink; border:1px solid hotpink; border-bottom: 1px solid black; border-right:1px solid black; }

.progress_flag_inactive_pending { float:left; font-family:'Lato', sans-serif; color:white; border-radius:3px; padding:2px 6px; font-size:.7em; background-color:silver; }
.progress_flag_inactive_in_procress { float:left; font-family:'Lato', sans-serif; color:white; border-radius:3px; padding:2px 6px; font-size:.7em; background-color:dodgerblue; }
.progress_flag_inactive_completed { float:left; font-family:'Lato', sans-serif; color:white; border-radius:3px; padding:2px 6px; font-size:.7em; background-color:green; }

.progress_flag_inactive_issue { float:left; font-family:'Lato', sans-serif; color:white; border-radius:3px; padding:2px 6px; font-size:.7em; background-color:hotpink; }
.progress_flag_inactive_resolved { float:left; font-family:'Lato', sans-serif; color:white; border-radius:3px; padding:2px 6px; font-size:.7em; background-color:orangered; }

/*//// progress bar ////*/

.progress_bar { font-size:11px; float:left; font-family:'Lato', sans-serif; border-radius:3px; cursor:zoom-in; }
.progress_bar_priority { margin:2px 1px 7px 3px; width:16px; padding:0 7px 0 7px; border-radius:3px; color:white; }
.progress_bar_order_status { margin:2px 0 2px 2px; width:16px; padding:0 7px 0 7px; border-radius:8px; color:white; }
.progress_bar_confirmation { margin-left:2px; width:20px; padding:2px 7px 2px 6px; border-radius:10px; color:white; }
.progress_bar_go { margin-left:2px; padding:2px 6px 2px 8px; border-bottom-left-radius:10px; border-top-left-radius:10px; color:white; }
.progress_bar_lil { margin-left:1px; width:28px; padding:2px 5px; border-bottom-right-radius:10px; border-top-right-radius:10px; color:white; }
.progress_bar_deposit { margin-left:2px; width:22px; padding:2px 3px 2px 8px; border-top-left-radius:10px; border-bottom-left-radius:10px; color:white; }
.progress_bar_receipt { margin-left:1px; width:20px; padding:2px 6px 2px 5px; border-top-right-radius:10px; border-bottom-right-radius:10px; color:white;  }
.progress_bar_lila { margin-left:2px; padding:2px 6px 2px 10px; border-bottom-left-radius:10px; border-top-left-radius:10px; color:white; }
.progress_bar_printing { margin-left:1px; padding:2px 6px; border-radius:3px; color:white; }
.progress_bar_production { margin-left:1px; padding:2px 6px; border-radius:3px; color:white; }
.progress_bar_packaging { margin-left:1px; padding:2px 10px 2px 6px; border-bottom-right-radius:10px; border-top-right-radius:10px; color:white; }
.progress_bar_balance { margin-left:2px; width:20px; padding:2px 2px 2px 8px; border-top-left-radius:10px; border-bottom-left-radius:10px; color:white; }
.progress_bar_invoice { margin-left:1px; width:17px; padding:2px 3px 2px 6px; border-top-right-radius:10px; border-bottom-right-radius:10px; color:white; }
.progress_bar_shipping { margin-left:2px; width:20px; padding:2px 7px 2px 7px; border-radius:10px; color:white; }
.progress_bar_go_member { margin-left:2px; padding:2px 8px 2px 8px; color:white; }
.progress_bar_note_marker_div { float:left; width:4px; font-family:sans-serif; font-size:2pt; margin:0 0 -6px 0; }
.progress_bar_note_marker { float:left; width:4px; margin:1px 0 0 0; border-radius:2px; }
.progress_bar_note_marker_on { color:lightgray; background-color:hotpink; }
.progress_bar_note_marker_off { color:white; background-color:white; }
.progress_bar_curtail { margin:0 0 0 0; width:30px; }
.progress_bar_expedite { margin:0 0 0 0; width:30px; }

.progress_bar_lavender { color:#A289BB; }
.progress_bar_olive { color:#688468; }
.progress_bar_teal { color:#62B5A0; }
.progress_bar_mauve { color:#E4B6BD; }

/*//// order controls ////*/

.order_panel_header_invoice { float:left; background-color:#0dbbdd; color:white; width:100%; font-weight:bold; padding:2px 10px; }
.order_panel_header_tool_box { float:left; background-color:#0dbbdd; color:white; width:100%; font-weight:bold; padding:2px 10px; }
.order_panel_header_flight_deck { float:left; background-color:#0dbbdd; color:white; width:100%; font-weight:bold; padding:2px 10px; }

.order_flight_deck_tab { float:left; margin:0 0 2px 4px; background-color:silver; color:white; border-bottom-left-radius:6px; border-bottom-right-radius: 6px; padding:0 12px 1px 12px; border-top:1px solid gray; font-weight:bold; cursor:pointer; }
.order_flight_deck_tab_on { background-color:crimson; color:white; padding-top:2px; margin-bottom:0; }
.order_tool_box_tab { float:left; margin:0 0 2px 4px; background-color:silver; color:white; border-bottom-left-radius:6px; border-bottom-right-radius: 6px; padding:0 12px 1px 12px; border-top:1px solid darkgreen; font-weight:bold; cursor:pointer; }
.order_tool_box_tab_on { background-color:crimson; color:white; padding-top:2px; margin-bottom:0; }

.add_button_thumbnail { float:left; padding:32px 0 33px 0; background-color:green; color:white; width:80px; text-align:center; cursor:pointer; }
.add_button_thumbnail:hover { background-color:limegreen; }

.order_flight_deck_panel { float:left; border-top:1px solid black; width:100%; margin:0; padding:0 0 10px 0; }
.order_flight_deck_tab:hover { background-color:tomato; color:white; padding-top:2px; margin-bottom:0; }
.order_tool_box_tab:hover { background-color:tomato; color:white; padding-top:2px; margin-bottom:0; }
.order_controls_row { float:left; width:100%; margin:6px 0 0 0; }
.order_controls_panel { float:left; padding:0 0 0 0; border:4px solid cadetblue; border-radius:8px; margin:0 0 0 6px; accent-color:var(--highlight_color);  }
.order_controls_panel_m { float:left; padding:0 0 0 0; border:4px solid limegreen; border-radius:8px; margin:0 0 0 6px; accent-color:limegreen;  }
.order_controls_panel_su { float:left; padding:0 0 0 0; border:4px solid lightcoral; border-radius:8px; margin:0 0 0 6px; accent-color:lightcoral; }
.order_controls_title_bar { float:left; margin:-2px 0 0 0; padding:0 6px 0 6px; color:white; font-size:8pt; background-color:cadetblue; width:100%; }
.order_controls_title_bar_m { float:left; margin:-2px 0 0 0; padding:0 6px 0 6px; color:white; font-size:8pt; background-color:limegreen; width:100%; }
.order_controls_title_bar_su { float:left; margin:-2px 0 0 0; padding:0 6px 0 6px; color:white; font-size:8pt; background-color:lightcoral; width:100%; }
.order_controls_button_area { float:left; margin:-2px 0 0 0; padding:0 4px 4px 0; }
.order_controls_button { float:left; margin:0 0 0 4px; padding:2px 8px 2px 8px; font-family:'Lato', sans-serif; font-weight:400; font-size:11px; cursor:pointer; border-radius:4px; color:cadetblue; background-color:white; border:1px solid cadetblue; }
.order_controls_button:hover { background-color:tomato; color:white; border-right:1px solid white; border-bottom:1px solid white; }
.order_controls_button_m { float:left; margin:0 0 0 4px; padding:2px 8px 2px 8px; font-family:'Lato', sans-serif; font-weight:400; font-size:11px; cursor:pointer; border-radius:4px; color:silver; background-color:white; border:1px solid lightgray; }
.order_controls_button_m:hover { background-color:tomato; color:white; border-right:1px solid white; border-bottom:1px solid white; }
.order_controls_button_m_off { float:left; margin:0 0 0 4px; padding:2px 8px 2px 8px; font-family:'Lato', sans-serif; font-weight:400; font-size:11px; border-radius:4px; color:silver; background-color:white; border:1px solid lightgray; }
.order_controls_button_off { float:left; margin:0 0 0 4px; padding:2px 8px 2px 8px; font-family:'Lato', sans-serif; font-weight:400; font-size:11px; border-radius:4px; color:white; background-color:silver; border:1px solid silver; border-left:0 solid black; border-top:0 solid black; }
.order_controls_button_issue { background-color:hotpink; color:white; border-right:1px solid black; border-bottom:1px solid black; border-left:0 solid black; border-top:0 solid black; }
.order_controls_button_yes { background-color:green; color:white; border-right:1px solid black; border-bottom:1px solid black; border-left:0 solid black; border-top:0 solid black; }
.order_controls_button_half_yes { background-color:limegreen; color:white; border-right:1px solid black; border-bottom:1px solid black; border-left:0 solid black; border-top:0 solid black; }
.order_controls_button_no { background-color:silver; color:white; border-right:1px solid black; border-bottom:1px solid black; border-left:0 solid black; border-top:0 solid black; }
.order_controls_button_in_process { background-color:dodgerblue; color:white; border-right:1px solid black; border-bottom:1px solid black; border-left:0 solid black; border-top:0 solid black; }
.order_controls_button_special_handling { background-color:orangered; color:white; border-right:1px solid black; border-bottom:1px solid black; border-left:0 solid black; border-top:0 solid black; }
.order_controls_button_exception { background-color:mediumvioletred; color:white; border-right:1px solid black; border-bottom:1px solid black; border-left:0 solid black; border-top:0 solid black; }
.order_controls_button_stop { background-color:crimson; color:white; border-right:1px solid black; border-bottom:1px solid black; border-left:0 solid black; border-top:0 solid black; }
.order_controls_button_fail { background-color:dimgrey; color:lightgray; border-right:1px solid black; border-bottom:1px solid black; border-left:0 solid black; border-top:0 solid black; }
.order_controls_button_error { background-color:black; color:black; border-right:1px solid black; border-bottom:1px solid black; border-left:0 solid black; border-top:0 solid black; }
.order_controls_button_wait { background-color:var(--highlight_color); color:white; border-right:1px solid black; border-bottom:1px solid black; border-left:0 solid black; border-top:0 solid black; }
.order_controls_button_control { background-color:cadetblue; color:white; border-right:1px solid black; border-bottom:1px solid black; border-left:0 solid black; border-top:0 solid black; }
.order_controls_button_pending { background-color:gold; color:gray; border-right:1px solid black; border-bottom:1px solid black; border-left:0 solid black; border-top:0 solid black; }
.order_controls_button_potential { background-color:darkturquoise; color:white; border-right:1px solid black; border-bottom:1px solid black; border-left:0 solid black; border-top:0 solid black; }
.order_controls_button_aggressive { background-color:#FFA600; color:gray; border-right:1px solid black; border-bottom:1px solid black; border-left:0 solid black; border-top:0 solid black; }
.order_controls_button_extreme { background-color:deeppink; color:white; border-right:1px solid black; border-bottom:1px solid black; border-left:0 solid black; border-top:0 solid black; }
.order_controls_note_button { float:left; margin:0 0 0 4px; padding:2px 5px 2px 5px; font-family:'Lato', sans-serif; font-weight:400; font-size:11px; cursor:pointer; border-radius:10px;  }
.order_controls_note_button:hover { background-color:tomato; color:white;  border:1px solid tomato; }
.order_controls_note_button_on { color:white; background-color:var(--highlight_color); border:1px solid var(--highlight_color); }
.order_controls_note_button_off { color:silver; background-color:white; border:1px solid lightgray; }
.order_controls_button_lavender { background-color:#A289BB; color:white; border-right:1px solid black; border-bottom:1px solid black; border-left:0 solid black; border-top:0 solid black; }
.order_controls_button_olive { background-color:#688468; color:white; border-right:1px solid black; border-bottom:1px solid black; border-left:0 solid black; border-top:0 solid black; }
.order_controls_button_teal { background-color:#62B5A0; color:white; border-right:1px solid black; border-bottom:1px solid black; border-left:0 solid black; border-top:0 solid black; }
.order_controls_button_mauve { background-color:#E4B6BD; color:white; border-right:1px solid black; border-bottom:1px solid black; border-left:0 solid black; border-top:0 solid black; }
.order_controls_button_miami_purple { background-color:#D85DB5; color:white; border-right:1px solid black; border-bottom:1px solid black; border-left:0 solid black; border-top:0 solid black; }
.order_controls_button_miami_green { background-color:#1AEF4C; color:white; border-right:1px solid black; border-bottom:1px solid black; border-left:0 solid black; border-top:0 solid black; }
.order_controls_button_miami_blue { background-color:#34B1FE; color:white; border-right:1px solid black; border-bottom:1px solid black; border-left:0 solid black; border-top:0 solid black; }
.order_controls_button_miami_red { background-color:#FF6978; color:white; border-right:1px solid black; border-bottom:1px solid black; border-left:0 solid black; border-top:0 solid black; }

.tool_box_panel { float:left; padding:0 0 0 0; border:4px solid #84C5C7; border-radius:8px; margin:0 0 0 6px; accent-color:var(--highlight_color);  }
.tool_box_title_bar { float:left; margin:-2px 0 0 0; padding:0 6px 0 6px; color:white; font-size:8pt; background-color:#84C5C7; width:100%; }
.tool_box_button { float:left; margin:0 0 0 4px; padding:2px 8px 2px 8px; font-family:'Lato', sans-serif; font-weight:400; font-size:11px; cursor:pointer; border-radius:4px; border-bottom:1px solid black; border-left:0 solid black; border-top:0 solid black; }
.tool_box_button:hover { background-color:tomato; color:white; border-bottom:1px solid black; border-left:0 solid black; border-top:0 solid black; }
.order_controls_tool_box { background-color:cadetblue; color:white; border-right:1px solid black; border-bottom:1px solid black; border-left:0 solid black; border-top:0 solid black; }


.quick_view_tab { float:left; margin:2px 0 -1px 4px; background-color:white; color:gray; border-top-left-radius:6px; border-top-right-radius: 6px; padding:1px 12px 2px 12px; border:1px solid black; border-bottom:1px solid white; font-weight:bold; }
.quick_view_tab_off { float:left; margin:4px 0 -1px 4px; background-color:lightgray; color:white; border-top-left-radius:6px; border-top-right-radius: 6px; padding:1px 12px 0 12px; border:1px solid lightgray;; border-bottom:1px solid black; font-weight:bold; cursor:pointer; }
.quick_view_tab_off:hover { background-color:tomato; border:1px solid tomato; border-bottom:1px solid black; margin-top:2px; padding-bottom:2px; }

/*//// order controls ////*/

.tender_button { float:left; color:white; font-size:15px; font-weight:bold; border-radius:16px; padding:3px 10px 4px 10px; margin:8px 0 0 3px; cursor:pointer; }
.tender_button:hover { background-color:tomato; }
.tender_button_off { background-color:silver; }
.tender_button_on { background-color:green; }
.tender_quantity { float:left; margin:0 0 0 6px; color:yellow; }

.print_button_ok { padding:2px 20px 1px 20px; font-family:'Lato', sans-serif; font-weight:400; font-size:11px; color:white; background-color:#2592b5; margin-right:3px; cursor:pointer; border-radius:4px; border-right:1px solid #0b495d; border-bottom:1px solid #0b495d; }
.print_button_ok:hover { background-color:tomato; }
.print_button_cancel { padding:2px 20px 1px 20px; font-family:'Lato', sans-serif; font-weight:400; font-size:11px; color:white; background-color:hotpink; margin-right:3px; cursor:pointer; border-radius:4px; border-right:1px solid crimson; border-bottom:1px solid crimson; }
.print_button_cancel:hover { background-color:tomato; }

.piece_type_button { float:left; padding:2px 8px 1px 8px; font-family:'Lato', sans-serif; font-weight:400; font-size:13px; color:white; background-color:silver; margin-right:3px; cursor:pointer; border-radius:4px; border-right:1px solid #0b495d; border-bottom:1px solid #0b495d; }
.piece_type_button:hover { background-color:tomato; }
.piece_type_button_on { background-color:#2592b5; }
.piece_type_other { float:left; padding:0 4px 0 2px; font-family:'Lato', sans-serif; font-weight:400; font-size:22px; color:#A5BC0D; cursor:pointer; }
.piece_type_other:hover { color:tomato; }

input { padding:2px 4px; font-family:Lato, sans-serif; font-weight:400; color:black; border-radius:6px; }
input::placeholder { font-family:Lato, sans-serif; font-weight:100; font-style:italic; color:gray; }

.text_field { float:left; margin-right:6px; }

.settlement_detail_div { float:left; padding:0 0 10px 10px; width:100%; }
.settlement_sale_item_detail_div { float:left; padding:0 0 10px 10px; width:100%; }
.batch_detail_div { float:left; padding:0 0 10px 10px; width:100%; }

.status_icon { font-size:18px; width:24px; margin-top:2px; color:#E0E0E0; }
.status_icon_not_needed { color:white; }
.status_icon_on { color:#2592b5; }

.status_icon_large { float:left; font-size:24px; margin:0 4px 0 0; padding:4px 6px; color:silver; cursor:pointer; border:1px solid silver; border-radius:5px; }
.status_icon_large:hover { background-color:tomato; color:white; }
.status_icon_large_not_needed { background-color:white; color:white; }
.status_icon_large_not_needed:hover { background-color:silver; color:white; }
.status_icon_large_on { background-color:#2592b5; color:white; border:1px solid #2592b5; }
.status_icon_large_on:hover { background-color:tomato; color:white; }

.batch_color_icon { float:left; width:32px; padding:1px 0 1px 0; margin:0 2px 0 0; font-family:'Lato', sans-serif; font-weight:400; font-size:12px; border-radius:2px; text-align:center; }
.batch_color_icon_1 { background-color:#15B041; color:white; }
.batch_color_icon_2 { background-color:#F2CE00; color:#464530; }
.batch_color_icon_3 { background-color:#F08D1B; color:white; }
.batch_color_icon_4 { background-color:hotpink; color:white; }
.batch_color_icon_0 { background-color:gray; color:white; }

.piece_card_icon { float:left; width:32px; padding:1px 0 1px 0; margin:0 2px 0 0; font-family:'Lato', sans-serif; font-weight:400; font-size:12px; border-radius:2px; text-align:center; }
.piece_type_icon { float:left; padding:1px 8px 1px 8px; margin:0 2px 0 0; background-color:#464530; font-family:'Lato', sans-serif; font-weight:400; font-size:12px; color:white; border-radius:2px; text-align:center; }
.piece_title { font-family:'Lato', sans-serif; font-weight:400; font-size:14px; padding:0; }
.piece_type_icon_yp { float:left; padding:1px 8px 1px 8px; margin:0 2px 0 0; background-color:green; font-family:'Lato', sans-serif; font-weight:400; font-size:12px; color:white; border-radius:2px; text-align:center; }
.piece_type_icon_nty { float:left; padding:1px 8px 1px 8px; margin:0 2px 0 0; background-color:crimson; font-family:'Lato', sans-serif; font-weight:400; font-size:12px; color:white; border-radius:2px; text-align:center; }

.piece_yes_please_icon { float:left; padding:1px 8px 2px 8px; margin:0 2px 0 0; background-color:green; font-size:16px; color:white; border-radius:2px; text-align:center; cursor:pointer; }
.piece_yes_please_icon:hover { background-color:tomato; }
.piece_no_thank_you_icon { float:left; padding:1px 8px 2px 8px; margin:0 2px 0 0; background-color:crimson; font-size:16px; color:white; border-radius:2px; text-align:center; cursor:pointer; }
.piece_no_thank_you_icon:hover { background-color:tomato; }
.piece_no_thank_you_icon_off { float:left; padding:1px 8px 2px 8px; margin:0 2px 0 0; background-color:gainsboro; font-size:16px; color:gainsboro; border-radius:2px; text-align:center; cursor:pointer; }
.piece_no_thank_you_icon_off:hover { background-color:tomato; color:white; }

.other_piece_type_div { float:left; width:100%; padding:0 0 0 10px; }
.piece_color_swatch { float:left; width:32px; padding:1px 0 1px 0; margin:3px 3px 0 0; font-family:'Lato', sans-serif; font-weight:400; font-size:14px; color:white; border-radius:2px; text-align:center; }

.add_piece_item_div { float:left; width:100%; padding:6px 0 3px 0; }
.add_piece_item_extra_div { float:left; width:100%; padding:0 0 3px 0; }
.add_piece_item_2_div { float:left; width:100%; padding:0 0 6px 0; border-bottom:1px dashed #464530; }
.jeneology_worksheet_div { float:left; width:100%; padding:6px 0 6 0; }
.jeneology_worksheet_div_button { float:left; padding:0 0 0 0; font-family:'Lato', sans-serif; font-weight:400; font-size:22px; color:#A5BC0D; cursor:pointer; }

.tricode_icon { float:left; width:36; padding:0 0 0 0; margin:1 2 0 0; font-family:'Lato', sans-serif; font-weight:400; font-size:10px; border:1px solid #464530; border-radius:2px; text-align:center; }
.tricode_icon_missing { float:left; width:32; padding:0 0 0 0; margin:1 2 0 0; font-family:'Lato', sans-serif; font-weight:400; font-size:10px; background-color:pink; color:pink; border:1px solid crimson; border-radius:2px; text-align:center; }

.jeneology_icon { float:left; width:40; padding:0 0 0 0; margin:1 2 0 0; font-family:'Lato', sans-serif; font-weight:400; font-size:10px; border:1px solid #464530; border-radius:2px; text-align:center; }
.jeneology_icon_missing { float:left; width:40; padding:0 0 0 0; margin:1 2 0 0; font-family:'Lato', sans-serif; font-weight:400; font-size:10px; background-color:pink; color:crimson; border:1px solid crimson; border-radius:2px; text-align:center; }

.sales_pitch_text { font-style:italic; }

.edit_piece_item_div { float:left; width:100%; padding:0 0 3 0; }

.look_up_div { float:left; padding:2 0 2 8; margin:0 2 0 0; border:1px solid silver; border-radius:4px; }
.pov_1_div { float:left; padding:2 0 2 8; margin:0 2; border:1px solid silver; border-radius:4px; }
.pov_2_div { float:left; padding:2 0 2 8; margin:0 2; border:1px solid silver; border-radius:4px; }

.item_note_bubble { float:left; padding:0 6 0 1; margin:1 0 0 6; font-family:'Lato', sans-serif; font-weight:400; font-size:12px; color:dodgerblue; border:1px solid dodgerblue; border-radius:2px; text-align:center; }
.item_note_icon { float:left; font-size:18px; margin:0 4 0 0; padding:0; color:dodgerblue; }

.item_print_bubble { cursor:pointer; float:left; padding:0 6 0 1; margin:0 0 0 2; font-family:'Lato', sans-serif; font-weight:400; font-size:12px; color:#464530; border:1px solid #464530; border-radius:2px; text-align:center; }
.item_print_bubble:hover { background-color:tomato; }
.item_print_bubble_off { cursor:pointer; float:left; padding:0 6 0 1; margin:0 0 0 2; font-family:'Lato', sans-serif; font-weight:400; font-size:12px; color:white; border:1px solid silver; border-radius:2px; text-align:center; }
.item_print_bubble_off:hover { background-color:tomato; }

.item_flagged_bubble { cursor:pointer; float:left; padding:0 6 0 1; margin:0 0 0 2; background-color:hotpink; font-size:12px; color:white; border:1px solid hotpink; border-radius:2px; text-align:center; }
.item_flagged_bubble:hover { background-color:tomato; }

.item_pricing_bubble { float:left; padding:0 6 0 1; margin:0 0 0 2; font-family:'Lato', sans-serif; font-weight:400; font-size:12px; color:#464530; border:1px solid #464530; border-radius:2px; text-align:center; }
.item_pricing_bubble_off { float:left; padding:0 6 0 1; margin:0 0 0 2; font-family:'Lato', sans-serif; font-weight:400; font-size:12px; color:white; border:1px solid silver; border-radius:2px; text-align:center; }
.item_pricing_bubble_missing { float:left; padding:0 6 0 1; margin:0 0 0 2; font-family:'Lato', sans-serif; font-weight:400; font-size:12px; background-color:pink; color:pink; border:1px solid crimson; border-radius:2px; text-align:center; }
.item_quantity_div { float:left; padding:1 6 1 1; margin:0 0 0 2; cursor:pointer; font-family:'Lato', sans-serif; font-weight:400; font-size:12px; color:white; background-color:dodgerblue; border-radius:2px; text-align:center; }
.item_quantity_div:hover { background-color:tomato; }
.quantitize_piece_item_div { float:left; width:100%; padding:0 0 6 200; border-bottom:1px dashed black; }
.quantitize_item_button { float:left; padding:2 10; font-family:'Lato', sans-serif; font-weight:400; font-size:16px; color:white; background-color:dodgerblue; margin-right:6 3 0 0; cursor:pointer; border-radius:6px; border-right:1px solid black; border-bottom:1px solid black; }
.quantitize_item_button:hover { background-color:tomato; }

.item_move_piece_button { cursor:pointer }
.item_move_piece_button:hover { background-color:tomato; }
.piece_articles_count { float:left; padding:2 8 1 8; font-size:11px; color:yellow; background-color:#2592b5; margin-right:3px; border-radius:4px; border-right:1px solid #0b495d; border-bottom:1px solid #0b495d; }

.tag_on { float:left; width:64; border:1px solid silver; height:25; color:white; cursor:pointer; font-size:.7em; text-align:center; padding:8 0 0 0; margin:0 3 0 0; border-radius:4px; }
.tag_off { float:left; width:64; border:1px solid white; height:25; color:white; cursor:pointer; font-size:.7em; text-align:center; padding:8 0 0 0; margin:0 3 0 0; border-radius:4px; }

.barcode { float:right; font-family:'Libre Barcode 39 Text'; font-size:34px; margin-top:-12px; }

.jeneology_link { float:left; width:150; font-size:12; padding:5 6 3 6; cursor:pointer; margin:3 0; text-align:center; background-color:dodgerblue; color:white; border-radius:6px; }
.jeneology_link:hover { background-color:tomato; }
.jeneology_link_on { float:left; width:150; font-size:12; padding:5 6 3 6; cursor:pointer; margin:3 0; text-align:center; background-color:tomato; color:white; border-radius:6px; }
.jeneology_kind_link { float:left; width:150; font-size:12; padding:5 6 3 6; cursor:pointer; margin:3 0; text-align:center; background-color:dodgerblue; color:white; border-top-right-radius:6px; border-bottom-right-radius:6px; }
.jeneology_kind_link:hover { background-color:tomato; }
.jeneology_kind_link_on { float:left; width:150; font-size:12; padding:5 6 3 6; cursor:pointer; margin:3 0; text-align:center; background-color:tomato; color:white; border-top-right-radius:6px; border-bottom-right-radius:6px; }
.jeneology_kind_number { float:left; width:38; font-size:12; padding:5 6 3 6; margin-right:2px; cursor:pointer; margin:3 0; text-align:center; background-color:tomato; color:white; border-top-left-radius:6px; border-bottom-left-radius:6px; }

.number_icon { font-family:'Lato', sans-serif; font-weight:900; font-size:18px; }
.listed_notice { float:left; margin:0 0 4 0; padding:3 10 2 10; border-radius:4px; color:white; font-family:'Lato', sans-serif; font-weight:900; font-size:18px; }

.login_screen { width:100%; height:100%; background-color:#A5BC0D; }

.hide_totals {  }
.hide_totals_off { color:white; }
.hide_totals_on { color:black; }

.sale-nav { float:left; font-size:24; background-color:#464530; color:white; margin:0 0 0 2; border-radius:0 6px 6px 0; cursor:pointer; }
.sale-nav:hover { background-color:tomato; }

.sale-nav-2 { float:left; font-size:24; background-color:#464530; color:white; margin:0 0 0 2; border-radius:6px 0 0 6px; cursor:pointer; }
.sale-nav-2:hover { background-color:tomato; }

.delivery-nav { float:left; padding:2 10; margin:0 0 0 2; background-color:dodgerblue; color:white; border-radius:4px; cursor:pointer; }
.delivery-nav:hover { background-color:tomato; }

.move_delivery_button { float:left; margin:2 4 0 6; color:gray; cursor:pointer; }
.move_delivery_button:hover { color:tomato; }

.sale_item_list_div { float:left; font-family:'Lato', sans-serif; color:black; width:100%; border-top:1px solid #464530; padding:4px 0; }
.sale_item_edit_div { float:left; font-family:'Lato', sans-serif; color:black; width:100%; border-top:1px dashed #464530; padding:4px 0; }

.sale_tools_button { float:left; font-size:20; background-color:#464530; color:white; margin:0 0 0 4; padding:4 6; border-radius:6px; cursor:pointer; }
.sale_tools_button:hover { background-color:tomato; }

.pay-button { float:left; color:black; cursor:hand; margin:6 0 0 10; font-size:30; }
.pay-button:hover { color:tomato }
.pay-button-on { color:crimson }

.pay-button-2 { float:left; color:black; cursor:hand; margin:6 0 0 10; font-size:30; }
.pay-button-2:hover { color:tomato }

.tender_div { float:left; margin:0 0 0 0; }

.tender_second_div { float:left; margin:0 0 0 0; }

.remove_list_item { float:left; margin:5 0 0 18; cursor:pointer; font-size:19px }
.remove_list_item:hover { color:tomato }

.tender_submit_button { float:left; font-family:'Lato', sans-serif; font-weight:bold; background-color:black; color:white; margin:0 0 0 0; padding:4 10; border-radius:6px; cursor:pointer; }
.tender_submit_button:hover { background-color:tomato; }

.tender_submit_button_2 { float:left; font-family:'Lato', sans-serif; font-weight:bold; background-color:crimson; color:white; margin:0 0 0 0; padding:4 10; border-radius:6px; cursor:pointer; }
.tender_submit_button_2:hover { background-color:tomato; }

.quick_item_0 { float:left; font-family:'Lato', sans-serif; background-color:crimson; color:white; margin:0 4 4 0; padding:4 10; border-radius:6px; cursor:pointer; }
.quick_item_0:hover { background-color:tomato; }

.quick_item_1 { float:left; font-family:'Lato', sans-serif; background-color:dodgerblue; color:white; margin:0 4 4 0; padding:4 10; border-radius:6px; cursor:pointer; }
.quick_item_1:hover { background-color:tomato; }

.quick_item_2 { float:left; font-family:'Lato', sans-serif; background-color:green; color:white; margin:0 4 4 0; padding:4 10; border-radius:6px; cursor:pointer; }
.quick_item_2:hover { background-color:tomato; }

.quick_item_3 { float:left; font-family:'Lato', sans-serif; background-color:limegreen; color:white; margin:0 4 4 0; padding:4 10; border-radius:6px; cursor:pointer; }
.quick_item_3:hover { background-color:tomato; }

.quick_item_4 { float:left; font-family:'Lato', sans-serif; background-color:hotpink; color:white; margin:0 4 4 0; padding:4 10; border-radius:6px; cursor:pointer; }
.quick_item_4:hover { background-color:tomato; }

.item_spec { float:left; border-radius:4px; margin:2px 0 0 2px; padding:3px 12px; color:white; }
.item_spec_1 { background-color:crimson; }

.dont_print_tool_panel { float:left; background-color:Aquamarine; padding:4px 8px; border-radius:6px; }


.user_login_button { float:right; margin:7px 30px 0 0; border:1px solid white; padding:2px 6px;
    color:white; border-radius:5px; cursor:pointer; font-size:9pt; }

.user_login_button:hover { border:1px solid gold; color:black; background-color:gold; }

.user_login_button_off { float:right; margin:7px 12px 0 0; border:1px solid lightgray; padding:3px 6px;
    background-color:white; color:lightgray; border-radius:5px; cursor:pointer; font-size:9pt; }

.user_login_button_off:hover { border:1px solid lightgray; color:lightgray; }

.user_panel_div { position:absolute; top:0; right:0; z-index:100; }

.user_panel { position:absolute; top:0; right:0; width:220px; background-color:white;
    border-bottom:1px solid darkgray; border-left:1px solid lightgray; border-bottom-left-radius:3px;
    opacity:1.0;  box-shadow:0 3px 0 3px rgba(0,0,0,0.1); }

.user_panel_off { display:none; }

.missing_icon_on { font-size:12pt; color:gold; cursor:pointer; }
.missing_icon_on:hover { color:tomato; }
.missing_icon_off { font-size:12pt; color:lightgray; cursor:pointer; }
.missing_icon_off:hover { color:tomato; }

.not_ready_icon_on { font-size:12pt; color:crimson; cursor:pointer; }
.not_ready_icon_on:hover { color:tomato; }
.now_ready_icon_on { font-size:12pt; color:green; cursor:pointer; }
.now_ready_icon_on:hover { color:tomato; }
.not_ready_icon_off { font-size:12pt; color:lightgray; cursor:pointer; }
.not_ready_icon_off:hover { color:tomato; }

.submit_login_button { float:left; margin:0 0 0 0; border:1px solid darkgray; padding:2px 6px;
    color:darkgray; border-radius:5px; cursor:pointer; font-size:9pt; }

.submit_login_button:hover { border:1px solid gold; color:black; background-color:gold; }

.supurba_subheader { position:absolute; top:36px; left:0; width:100vw; margin:0 0 0 0; padding:3px 0 0 0; text-align:center; background-color:deeppink; }