:root {
    --color-primary: #323844;
    --color-background: #FFFFFF;
    --color-background-gray: #F2F2F2;
    --color-background-menu: #000000;
    --color-font-light: #666666;
    --color-font-title: #323844;
    --color-font-error: #FF3333;
    --color-font-warning: #0000CD;
    --color-navigator: #B5B7BC;
    --color-white: #FFFFFF;
    --color-message: #0000FF ;
    --color-light_orange: #FFD580 ;
    --color-light_green: #8eff00 ;
    --color-green: #009A17 ;
}

body {
  margin: 0px;
  font-family: "SegoeUI-SemiLight-final","Segoe UI SemiLight","Segoe UI WPC Semilight","Segoe UI",Segoe,Tahoma,Helvetica,Arial,sans-serif;
}

a {
    color: var(--color-primary);
    fill: currentColor;
    cursor: pointer;
    text-decoration: none;
    transition: filter ease-in-out 80ms;
}

h1 {
  font-size: 32px ;
  font-weight: normal ;
  color: var(--color-font-light) ;
}

.H1_white {
  font-size: 24px ;
  padding: 2px 2px 8px 4px ;
}

h2 {
  font-size: 20px ;
  padding-left: 2px ;
}

.H2_white {
  font-size: 20px ;
  padding-left: 2px ;
}

.H2_green {
  font-size: 20px ;
  padding-left: 2px ;
  color:#8eff00;
  width: 320px ;
}
.H2_green_18 {
  font-size: 18px ;
  padding-left: 2px ;
  color:#8eff00;
  width: 320px ;
}

.img32 {
  height: 32px ;
  width: 32px ;
}

.img28 {
  height: 28px ;
  width: 28px ;
}

.img24 {
  height: 24px ;
  width: 24px ;
}

.img20 {
  height: 20px ;
  width: 20px ;
}

.img20g {
  padding-left:4px ;
  height: 20px ;
  width: 20px ;
}

.img16 {
  height: 16px ;
  width: 16px ;
}

.img16g {
  padding-left:4px ;
  height: 16px ;
  width: 16px ;
}

.img12g {
  padding-left:4px ;
  height: 12px ;
  width: 12px ;
}

.img12h {
  padding-left:4px ;
  height: 12px ;
  width: 12px ;
  opacity: 0.05 ;
}

.img12h:hover {
  padding-left:4px ;
  height: 12px ;
  width: 12px ;
  opacity: 1 ;
}

.clear{
    clear:both;
}

label {
  display: block ;
  color: #666 ;
  margin-bottom: 0.2em ;
}

.input-base, input[type="text"], input[type="email"], input[type="date"], input[type="search"], input[type="url"], input[type="color"], input[type="password"], select, textarea {
    border-radius: 3px;
    border: 1px solid #D4D4D4;
    background-color: rgb(232, 240, 254);
    border-color: #d4d4d4;
    color: #666;
    display: inline-block;
    font-size: 14px;
    padding: 9px;
    max-width: 100%;
}

#report_comment_status {
    border-radius: 3px;
    border: 1px solid #D4D4D4;
    background-color: rgb(255, 255, 255);
    border-color: #d4d4d4;
    color: #666;
    display: inline-block;
    font-size: 14px;
    padding: 2px;
    max-width: 100%;
    width: 240px ;
}

input {
    appearance: menulist-button;
    background-color: rgb(232, 240, 254);
    background-image: none ;
    color: -internal-light-dark(black, white) ;
}

#header {
  background-color: #000000 ;
  position: fixed;
  color: #FFFFFF;
  padding: 4px 2px 2px 7px ;
}

#header table {
  width: 100% ;
}

#header a {
  padding-bottom: 14px ;
  cursor: pointer ;
  color: #FFFFFF ;
  text-decoration: none;
}

#header a:hover {
  text-decoration: underline;
}

.header_menu {
  font-size: 12px ;
}

.header_menu_item {
  width: 68px ;
}

.header_menu td {
  vertical-align: middle ;
  border-left: solid 0px rgba(255,255,255,.5);
  max-width: 60px ;
}


.header_menu a:hover {
  text-decoration: none ;
}

.user_initials {
  /* background-color: #4DED30 ; */
  background-color: var(--color-background) ;
  color: var(--color-background-menu) ;
  text-align: center ;
  border-radius: 16px;
  height: 28px ;
  width: 32px ;
  vertical-align: middle;
  font-size: 18px ;
  font-weight: 600 ;
  padding-top: 3px ;
}

#navigator {
  background-color: var(--color-navigator) ;
  position: fixed;
  color: #323844;
  padding: 0px 0px 2px 0px ;
  overflow: auto ;
}

.navigator_title {
  background-color: var(--color-primary) ;
  color: var(--color-white) ;
  font-size: 20px ;
  padding-left: 8px ;
  padding-top: 7px ;
  padding-bottom: 6px ;
  border-right: 1px solid var(--color-navigator) ;
}

#navigator_list {
  font-size: 13px ;
  overflow: auto ;
  color: var(--color-primary) ;
}

.navigator_list tr:hover {
  background-color: #FFFFFF ;
  cursor: pointer ;
}

#navigator_sub {
  background-color: #F2F2F2 ;
  position: relative;
  display: none ;
}

#menu {
  background-color: var(--color-primary) ;
  position: fixed;
  padding: 2px 4px 0px 4px ;
}

.menu_top {
  background-color: var(--color-primary) ;
  border-radius: 3px;
  border: 1px solid transparent;
  padding: 0px 0px 12px 0px ;
  color: #FFFFFF ;
}

.menu_top_button:hover   {
  cursor: pointer ;
  text-decoration: underline;
}

.menu_title {

}

.menu_top select {
  border-radius: 3px;
  border: 1px solid #D4D4D4;
  background-color: rgb(232, 240, 254);
  border-color: #d4d4d4;
  color: #666;
  display: inline-block;
  font-size: 14px;
  padding: 1px;
  max-width: 100%;
}

#screen {
  margin-right: 20px ;
  background-color: var(--color-background-gray) ;
  position: fixed;
}

#screen_container_old {
  background-color: var(--color-background) ;
  position: fixed;
  padding: 12px 12px 12px 12px ;
  overflow: auto ;
  box-shadow: 0 6px 6px -1px rgba(0,0,0,0.1);
  border-radius: 3px;
  border: 1px solid transparent;
}

#screen_container {
  position: fixed;
  padding: 4px 4px 4px 4px ;
  overflow: none ;
  background-color: var(--color-background-gray) ;
}

.screen_container_child {
  background-color: var(--color-background-gray) ;
  position: absolute;
}

.tab_container {
  background-color: var(--color-background-gray) ;
  position: absolute;
  border-radius: 0px 0px 4px 4px ;
}

.tab_container_child {
  background-color: var(--color-white) ;
  padding: 4px ;
  border-radius: 4px ;
  box-shadow: 0 6px 6px -1px rgba(0,0,0,0.1);
}

.tab_active {
  background-color: var(--color-white) ;
  padding: 3px 12px 3px 12px ;
  border-radius: 6px 6px 0px 0px ;
  cursor: pointer ;
  text-decoration: underline;
}

.tab_inactive {
  background-color: var(--color-background-gray) ;
  padding: 3px 12px 3px 12px ;
  border-radius: 6px 6px 0px 0px ;
  border-left: 1px solid #DDDDDD ;
  border-top: 1px solid #DDDDDD ;
  border-right: 1px solid #DDDDDD ;
  cursor: pointer ;
}

#footer_screen {
  background-color: #F2F2F2 ;
  position: fixed;
  padding: 2px 2px 2px 4px ;
}

#footer_nav {
  background-color: #F2F2F2 ;
  position: fixed;
  padding: 2px 2px 0px 8px ;
  font-size: 12px ;
}

.form_group {
  margin-bottom: 12px ;
  color: var(--color-primary);
}

.form_group_bold {
  font-weight: 500 ;
  font-size: 14px ;
  color: var(--color-font-light) ;
}

.form_spacer_top {
  margin-top: 24px ;
}

#div_login {
  position: absolute;
  background-color: var(--color-background) ;
  margin-left: -260px ;
  margin-top: -200px ;
  width: 472px ;
  left: 50% ;
  top: 50% ;
  padding: 8px 24px 18px 24px ;
  border-radius: 4px;
  box-shadow: 0 6px 6px -1px rgba(0,0,0,0.1);
  border: 1px solid transparent;
}

.text-left {
    text-align: start;
}

.text-right {
    text-align: end;
}

.inline-left {
  padding-top: 8px ;
  float: left ;
}

.inline-right {
  float: right ;
}

.home_link a {
    color: #666;
    font-size: 90%;
    text-decoration: none;
    border: 0px;
}

.button {
  font-size: 0.85rem;
  line-height: 1.4em;
  padding: 7.8px 32px;
  margin-top: 6px;
  margin-bottom: 6px;
  margin-left: 24px ;
  margin-right: 4px ;
  display: inline-block;
  font-weight: 400;
  outline: 0;
  border-radius: 3px;
  cursor: pointer;
  transition: background-color ease-in-out 120ms, filter ease-in-out 120ms, box-shadow ease-in-out 120ms;
  box-shadow: none;
  background-color: #323844;
  color: #FFF;
  text-transform: uppercase;
  border: 1px solid #323844;
  vertical-align: top;
  filter: none;
}

.button:hover {
  background-color: var(--color-background);
  color: #323844;
  font-weight: 400;
}

.img_hover:hover {
  cursor: pointer;
}

.button_block {
  background-color: #F2F2F2;
  padding-right:20px;
  color: #323844;
  width: 100%;
  height: 60px;
}

.button_block:hover {
  background-color: var(--color-primary);
  color: #FFFFFF;
  font-weight: 400;
}

#password_bar {
  margin-top: 4px ;
  width: 1%;
  height: 15px;
  background-color: green;
  text-align: center ;
  font-family: "SegoeUI-SemiLight-final","Segoe UI SemiLight","Segoe UI WPC Semilight","Segoe UI",Segoe,Tahoma,Helvetica,Arial,sans-serif;
  font-size: 11px ;
  color: #FFFFFF ;
  border-radius: 4px ;
}

#drop_file_zone {
  background-color: #FFFFFF;
  font-weight: bold;
  text-align: center;
  color: #555;
  border: 2px dashed #555;
  border-radius: 7px;
  cursor: default;
}

#drop_file_zone.hover {
	color: #006400;
	border-color: #006400;
	border-style: solid;
	box-shadow: inset 0 3px 4px #888;
  padding: 4px ;
}

#drag_upload_file {
  width:50%;
  margin:0 auto;
}
#drag_upload_file p {
  text-align: center;
}
#drag_upload_file #selectfile {
  display: none;
}

.white_cornered {
  background-color: var(--color-white) ;
  border-radius: 4px;
  box-shadow: 0 6px 6px -1px rgba(0,0,0,0.1);
  border: 1px solid transparent; 
  min-height:100px ;
  width: 98% ;
  margin-left: 6px ;
  padding: 4px ;
}

.black_cornered {
  background-color: var(--color-white) ;
  border-radius: 4px;
  border: 1px solid #CCCCCC;
  min-height:86px ;
  width: 90% ;
  margin-left: 6px ; 
  padding: 4px ;
}

.table_view td {
  padding-left: 4px ;
  padding-right: 4px ;
  padding-top: 2px ;
  padding-bottom: 2px ;
}

.table_view tr:hover {
  background-color: #FFFF6A ; ;
}

.table_view th {
  background-color: var(--color-primary) ;
  color: var(--color-white) ;
  padding: 2px 6px 2px 6px;
  font-weight: 400 ;
}

.table_viewer_t {
  padding: 0 px ;
  border-spacing: 0px;
  box-sizing: border-box;
  border-collapse: collapse;
}

.table_viewer_t td {
  border: 1px solid #D3D3D3 ;
  padding: 2px 6px 2px 6px ;
  font-size: 12px ;
}

.table_viewer_t th {
  border: 1px solid #D3D3D3 ;
  background-color: #F2F2F2 ;
  font-weight: bold ;
  padding: 2px 6px 2px 6px ;
}

.table_viewer_t tr:hover {
  background-color: #FFFF6A ;
}

.table_viewer_row_input input {
  background-color: #EEEEEE;
  color: #000066;
  text-align: left;
  border: none;
  height: 18px;
  font-size: 12px;
  padding-left: 4px ;
  padding-right: 4px ;
}

.scrollbars {
  overflow: auto ;
}

.log_section {
  font-size: 12px ;
}

.message_section {
  height: 40px ;
  font-size: 11px ;
  color: var(--color-message) ;
  padding-left: 20px ;
  padding-top: 12px ;
}

.text_input {
  text-align:left;
  padding:2px;
  border: 1px solid #D4D4D4 ;
  border-radius: 3px ;
  background-color: rgb(232,240,254) ;
  color: #666 ;
  font-size: 14px ;
}

.input_table {
  border-collapse: separate;
  border-spacing: 0px;
}

.s2_menu {
  height:64px;
  background-color:#EEEEEE ;
}

.s2_title {
  padding-top: 20px ;
  padding-bottom: 0px ;
  margin-left:30px ;
  display: inline-block;
}

#s2_body {
  overflow: auto;
  padding-top: 20px ;
  padding-left: 20px ;
  padding-right: 20px ;
  background-color:var(--color-background) ;
}

#s2_body_content {
  overflow: auto;
  background-color:#FFFFFF ;
  margin-inline-start: auto;
  margin-inline-end: auto;
  overflow: initial;
}

#s2_record_view {
  overflow: auto;
  padding-top: 0px ;
  padding-left: 0px ;
  padding-right: 6px ;
}

.s2_record_section {
  background-color:#FFFFFF ;
  box-shadow: 0px 1px 6px -1px rgba(0,0,0,0.1);
  border-radius: 3px;
  border: 1px solid #EEEEEE ;
  padding: 12px ;
  margin-top: 8px ;
  margin-bottom: 4px ;
}

.s2_record_section_title {
  font-size: 20px ;
  padding-bottom: 24px ;
  padding-left: 20px ;
  color: #222 ;
}

#s2_record_section_photos {
  background-color: #FFF ;
  padding: 4px ;
  display: inline-block;
  float: right ;
  margin-top: -50px ;
  margin-bottom: 6px ;
}

#s2_uploader {
  width: 180px;
  height: 40px;
  background: #FFFFFF;
  padding: 10px;
  padding-top: 30px ;
  text-align: center ;
  vertical-align: middle ;
  border: dotted 3px rgba(32,38,44,.3);
  border-radius: 10px;
}
#s2_uploader.highlight {
  background: #EEEEEE;
  border: dotted 3px #0B6623;
}
#s2_uploader.disabled {
  background:#aaa;
}

#s2_photo_displayer {
  display: inline-block;
}

#s2_pager_number_of_records {
  display: inline-block;
}

.s2_record_section_label {
  color: #666 ;
  font-weight: 400 ;
  vertical-align: top ;
  padding-top: 10px ;
  padding-left: 20px ;
}

.s2_record_section input {
  border-radius: 3px;
  border: 1px solid #D4D4D4;
  background-color: #fff;
  border-color: #d4d4d4;
  color: #323844;
  display: inline-block;
  font-size: 14px;
  padding: 9px;
  max-width: 100%;
}


.s2_record_save_section {
  text-align: right ;
  padding: 20px ;
}

.s2_record_save_button {
  font-size: 0.85rem;
  line-height: 1.4em;
  padding: 7.8px 32px;
  margin-top: 6px;
  margin-bottom: 6px;
  margin-left: 24px ;
  display: inline-block;
  font-weight: 400;
  outline: 0;
  border-radius: 3px;
  cursor: pointer;
  transition: background-color ease-in-out 120ms, filter ease-in-out 120ms, box-shadow ease-in-out 120ms;
  box-shadow: none;
  background-color: #323844;
  color: #FFF;
  text-transform: uppercase;
  border: 1px solid #323844;
  vertical-align: top;
  filter: none;
}

.s2_record_save_button:hover {
  background-color: #FFF;
  color: #323844;
  font-weight: 400;
}

#s2_record_commands {
  text-align: right;
}


.s2_buttom_record_command {
  font-size: 0.85rem;
  line-height: 1.4em;
  padding-top: 4px;
  padding-left: 32px;
  padding-right: 32px ;
  padding-bottom: 4px ;
  margin-bottom: 4px;
  margin-top: 4px;
  display: inline-block;
  font-weight: 400;
  outline: 0;
  border-radius: 3px;
  cursor: pointer;
  transition: background-color ease-in-out 120ms, filter ease-in-out 120ms, box-shadow ease-in-out 120ms;
  box-shadow: none;
  color: #323844;
  text-transform: uppercase;
  vertical-align: top;
  filter: none;
}

.s2_buttom_record_command:hover {
  background-color: #DDDDDD;
  color: #323844;
}

.s2_record_section textarea {
  border-radius: 3px;
  border: 1px solid #D4D4D4;
  background-color: #fff;
  border-color: #d4d4d4;
  color: #323844;
  display: inline-block;
  font-size: 14px;
  padding: 9px;
  max-width: 100%;
}

.s2_record_section td {
  padding-bottom: 12px ;
}

.s2_add_record {
  display: inline-block;
  float: center ;
  padding-left: 40px ;
  padding-top: 20px ;
}

.s2_search {
  display: inline-block;
  float: center ;
  position: relative ;
  top: -4px ;
  padding-left: 40px ;
}

.s2_button {
  background-color: transparent;
  color: #666;
  fill: currentColor;
  border: 1px solid #CCC;
  position: relative ;
  top: -14px ;
  text-decoration: none;
  font-size: 0.85rem;
  line-height: 1.4em;
  padding: 7.8px 16px;
  font-weight: 400;
  outline: 0;
  border-radius: 2px;
  cursor: pointer;
  box-shadow: none;
  background-color: #FFF ;
  text-transform: uppercase;
  border-radius: 3px;
  border: 1px solid #D4D4D4;
  vertical-align: top;
  filter: none;
  transition-duration: 0.4s;
}

.s2_button:hover {
  background-color: #DDD;
}

#s2_search_value {
  border-radius: 3px;
  border: 1px solid #D4D4D4;
  background-color: #fff;
  border-color: #d4d4d4;
  color: #666;
  display: inline-block;
  font-size: 14px;
  padding: 9px;
  width: 250px;
  max-width: 100%;
}

#s2_pager {
  background-color: #FFFFFF ;
  display: inline-block;
  max-width: 200%;
  padding-left: 20px;
  position: relative ;
  right: -80px ;
  bottom: 6px ;
  color: #666666 ;
}


.s2_h1 {
  font-size: 2em;
  font-weight: 400;
  color: #222;
  vertical-align: bottom ;
}

.s2_h2 {
  font-size: 1.5em;
  font-weight: 400;
  color: #222;
  vertical-align: bottom ;
  text-decoration: underline;
}

p.s2_h1 {
  padding: 0px ;
  margin: 0px ;
}

.s2_table_view {
  overflow: auto;
  padding-top: 20px ;
  margin-left: 20px ;
  margin-right: 20px ;
  background-color:#FFF ;
  border-spacing: 0px ;
}

.s2_table_view td {
  border-bottom: 1px solid rgba(0,0,0,0.05); ;
  padding-left: 20px ;
  padding-right: 8px ;
  padding-top: 8px ;
  padding-bottom: 8px ;
  font-size: 14px ;
}

.s2_table_view th {
  border-bottom: 1px solid rgba(0,0,0,0.05); ;
  padding-left: 20px ;
  padding-right: 20px ;
  padding-top: 8px ;
  padding-bottom: 8px ;
  font-size: 16px ;
}

.underline {
  border-bottom: 1px solid rgba(0,0,0,0.5);
  font-size: 22px ;
  padding-bottom: 8px ;
  padding-left: 2px ;
  color: #222 ;
}

.inline_block_right {
  display: inline-block;
  float: right;
  padding-right: 20px ;
  padding-left: 20px ;
  padding-bottom: 0px ;
}

.inline_block {
  display: inline-block;
  position: relative;
}

.inline_block_valign {
  display: inline-block;
  position: relative;
  top: 2px;
  padding-left:2px ;
}

.script_button {
  position: relative;
  top: -4px ;
  background-color: #F2F2F2;
  color: #323844;
  width: 100%;
}

.script_button:hover {
  background-color: var(--color-primary);
  color: #FFFFFF;
  font-weight: 400;
}

.log_h1 {
  color: var(--color-font-title);
  font-size: 24px ;
  font-weight: normal ;
  padding: 6px 0px 6px 0px;
}

.log_h2 {
  color: var(--color-font-title);
  font-size: 20px ;
  font-weight: normal ;
  padding: 6px 0px 6px 0px;
}

.log_h3 {
  color: var(--color-font-title);
  font-size: 16px ;
  font-weight: normal ;
  padding: 6px 0px 6px 0px;
}

.log_error {
  color: var(--color-font-error);
  font-size: 14px ;
  font-weight: 600 ;
}

.log_warning {
  color: var(--color-font-warning);
  font-size: 14px ;
  font-weight: 600 ;
}

.log_text {
  color: var(--color-font-light);
  font-family: monospace;
  font-size: 14px ;
  font-weight: 400 ;
}

/* --------------------------------------------------------------------------- */
/* CSS for Pivot functionality                                                 */
/* --------------------------------------------------------------------------- */

#import_pivot_header {
  min-height: 60px ;
}

.div_moveable {
    position: absolute;
    background-color: #66AAEE;
    color:#323844;
    font-size: 80%;
    opacity: 0.99;
    border: 1px solid #FFFFFF ;
    border-radius: 4px;
}

.div_moveable_header {
  padding: 4px 6px 6px 8px ;
  cursor: move;
  background-color: #2196F3;
  color: #fff;
  font-size: 18px;
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
}

.div_moveable_dark {
    position: absolute;
    background-color: #666666;
    color:#323844;
    font-size: 80%;
    opacity: 0.99;
    border: 1px solid #FFFFFF ;
    border-radius: 4px;
}

.div_moveable_darkheader {
  padding: 4px 6px 6px 8px ;
  cursor: move;
  background-color: #323844;
  color: #fff;
  font-size: 18px;
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
}

.div_moveable_log {
    position: absolute;
    background-color: #666666;
    color:#323844;
    font-size: 80%;
    opacity: 0.99;
    border: 1px solid #FFFFFF ;
    border-radius: 4px;
}

.div_moveable_log_header {
  padding: 4px 6px 6px 8px ;
  cursor: move;
  background-color: #323844;
  color: #fff;
  font-size: 18px;
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
}

#show_layout {
  height: 60px ;
}

.pivot_select_section {
    padding-top:2px;
    padding-bottom:2px;
    background-color: #FFFFFF;
    color:#323844;
    font-size: 11px;
    overflow-y:auto;
}

.pivot_footer {
  color:#666666;
  font-size: 11px;
}

#pivot_where_clause {
  height:48px;
  min-width: 480px;
	overflow:auto;
	border: 1px #DDDDDD solid;
  border-radius: 4px;
}
#table_where_clause {
	height:48px;
  min-width: 480px;
	overflow:auto;
	border: 1px #DDDDDD solid;
  border-radius: 4px;
}

.file_list {
  font-size: 14px ;
  padding: 4px ;
}

.file_list:td {
  padding: 4px ;
}

.file_list tr:hover {
  background-color: var(--color-light_orange) ;
}

.orange_label {
  background-color: var(--color-light_orange) ;
}

.green_label {
  color: var(--color-green) ;
  font-weight: 600 ;
}

.button_clear {
  width: 200px ;
  height: 32px ;
  background: url('/img/eraser_24.png');
  background-repeat: no-repeat ;
  background-position: 32px 2px ;
  padding-left: 16px;
  color: #323844;
  margin-left: 12px ;
  border: 2px solid #DDDDDD ;
  text-align: center;
  text-decoration: none;
  font-size: 12px;
  font-weight: bold;
  cursor: pointer;
  background-color: #FFFFFF;
}

.button_clear:hover {
  color: #FFFFFF;
  border: 2px solid #323844 ;
  background: url('/img/refreshing-curve-arrows_white.png');
  background-repeat: no-repeat ;
  background-position: 32px 2px ;
  background-color: #323844;
}

.filter_apply {
  width: 200px ;
  height: 32px ;
  background: url('/img/refreshing-curve-arrows.png');
  background-repeat: no-repeat ;
  background-position: 32px 2px ;
  padding-left: 16px;
  color: #323844;
  margin-left: 12px ;
  border: 2px solid #DDDDDD ;
  text-align: center;
  text-decoration: none;
  font-size: 12px;
  font-weight: bold;
  cursor: pointer;
  background-color: #FFFFFF;
}

.filter_apply:hover {
  color: #FFFFFF;
  border: 2px solid #323844 ;
  background: url('/img/refreshing-curve-arrows_white.png');
  background-repeat: no-repeat ;
  background-position: 32px 2px ;
  background-color: #323844;
}

.filter_body {
  background-color: #FFFFFF ;
  margin: 4px ;
}

#report_data_selector {
  padding:12px ;
}

.report_data_selector {
  margin-right: 2px ;
  max-width: 240px ;
}

#features {
			margin: auto;
			width: 460px;
			font-size: 0.9em;
		}
		.connected, .sortable, .exclude, .handles {
			margin: auto;
			padding: 0;

			-webkit-touch-callout: none;
			-webkit-user-select: none;
			-khtml-user-select: none;
			-moz-user-select: none;
			-ms-user-select: none;
			user-select: none;
		}
		.sortable.grid {
			overflow: hidden;
		}
		.connected ul {
			list-style-type: circle;
		}
		.connected li, .sortable li, .exclude li, .handles li {
			list-style: none;
			background: #FFFFFF;
			margin: 2px;
			padding: 2px;
			height: 12px;

		}
		.handles span {
			cursor: move;
		}
		li.disabled {
			opacity: 0.5;
		}
		.sortable.grid li {
			line-height: 80px;
			float: left;
			width: 80px;
			height: 80px;
			text-align: center;
		}
		li.highlight {
			background: #FFFFFF;
		}
		#connected {

			overflow: hidden;
			margin: auto;
		}
		.connected {
			float: left;
			width: 180px;
			list-style: circle;
		}
		.connected.no2 {
			float: right;
		}
		li.sortable-placeholder {
			border: 1px dashed #CCC;
			background: none;
		}

#right_pane {
  z-index: 40 ;
}

table.pane_label {
  font-size: 12px ;
  color: #777777 ;
}

td.right_pane_label {
  font-size: 14px ;
  font-weight: 400 ;
  color: #777777 ;
}

input.right_pane {
  border-radius: 3px;
  border: 1px solid #D4D4D4;
  background-color: rgb(252, 252, 252);
  border-color: #d4d4d4;
  color: #666;
  display: inline-block;
  font-size: 12px;
  padding: 5px;
  width: 90%;
}

div.right_pane_subdiv {
  border-radius: 3px;
  border: 1px solid #D4D4D4;
  background-color: rgb(252, 252, 252);
  border-color: #d4d4d4;
  color: #666;
  display: inline-block;
  font-size: 12px;
  padding: 5px;
  width: 96%;
  height: 120px ;
}

input[type=search]{
  width: 210px;
  height: 36px;
  font-size: 14px;
  padding: 0px 32px 0px 8px;
  border-radius: 4px;
  outline: none;
  border: solid gray 1px;
  background: url('/img/searchglass.png') 176px center no-repeat;
  background-color: #FFFFFF ;
}

input.input_number_list {
  background-color: #FDFDFD ;
  border-radius: 0px;
  border: 0px solid #D4D4D4;
  font-size: 14px;
  height: 24px;
}

input.input_number_list:focus{
  background-color: #F0F0F0 ;
}

.error_header {
  font-size: 16px ;
  color: #CC0000 ;
  margin-top: 12px;
  margin-left: 12px;
}

.error_log {
  font-size: 12px ;
  color: #36454F;
  margin-left: 18px;
  margin-right: 24px;
}

/* The container */
.checkbox_container {
  display: block;
  position: relative;
  padding-left: 25px;
  padding-bottom: 0px;
  margin-bottom: 6px;
  cursor: pointer;
  font-size: 14px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/* Hide the browser's default checkbox */
.checkbox_container input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}
 
/* Create a custom checkbox */
.checkmark {
  position: absolute;
  top: 2px;
  left: 0;
  height: 20px;
  width: 20px;
  background-color: #f2f2f2;
  border: 1px solid #AAAAAA ; 
  border-radius: 3px;
}

/* On mouse-over, add a grey background color */
.checkbox_container:hover input ~ .checkmark {
  background-color: #ddd;
}

/* When the checkbox is checked, add a blue background */
.checkbox_container input:checked ~ .checkmark {
  background-color: #323844;
}

/* Create the checkmark/indicator (hidden when not checked) */
.checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the checkmark when checked */
.checkbox_container input:checked ~ .checkmark:after {
  display: block;
}

/* Style the checkmark/indicator */
.checkbox_container .checkmark:after {
  left: 6px;
  top: 2px;
  width: 5px;
  height: 10px;
  border: solid white;
  border-width: 0 3px 3px 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}