simple-widgets/dist/index.css

A Collection of React components to make your React code simpler

/* src/sw-DropDown.css */
.sw-dropdown-menu {
  display: flex;
  flex-direction: column;
  background: #1888ff;
  list-style: none;
  text-align: start;
  width: var(--sw-menu_width);
  z-index: 9;
  border-radius: .25rem;
  box-shadow: 0 0 35px 0 rgba(0, 0, 0, 0.5);
}
.sw-dropdown-menu-horizontal {
  position: absolute;
  top: 100%;
}
.sw-dropdown-menu-vertical {
  position: absolute;
  left: 100%;
  top: var(--sw-menu_top);
  bottom: var(--sw-menu_bottom);
}
.sw-dropdown-menu li,
.sw-dropdown-menu li span {
  background: #1888ff;
  cursor: pointer;
}
.sw-dropdown-menu li:hover span {
  background: #5cabff;
  border-radius: .25rem;
  box-shadow: 35px 35px 35px 35px rgba(0, 0, 0, 0.7);
  width: var(--sw-menu_width);
}
.sw-dropdown-menu li:hover {
  background: #5cabff;
  width: var(--sw-menu_width);
}
.sw-dropdown-menu.clicked {
  display: none;
  width: var(--sw-menu_width);
}
.sw-dropdown-menu2-vertical {
  margin-left: var(--sw-menu_vertical_margin_left);
}
.sw-dropdown-menu2-horizontal {
  margin-left: var(--sw-menu_horizontal_margin_left);
}
.sw-dropdown-menu2 {
  position: fixed;
  top: 200px;
  left: 200px;
  list-style: none;
  text-align: start;
  z-index: 9;
}
.sw-dropdown-menu ul {
  width: var(--sw-menu_width);
}
.sw-dropdown-menu2 ul {
  width: var(--sw-menu_width);
}
.sw-dropdown-menu li span {
  width: var(--sw-menu_width);
}
.sw-dropdown-menu2 li span {
  cursor: pointer;
  width: var(--sw-menu_width);
}
.sw-dropdown-menu2 li:hover span {
  background: lightblue;
}
.sw-dropdown-menu2.clicked {
  display: none;
}
.sw-dropdown-link {
  display: block;
  height: 100%;
  width: 100%;
  text-decoration: none;
  color: white;
  padding: 16px;
}
.sw-dropdown-link:hover {
  background: #5cabff;
  height: 100%;
  width: 100%;
}

/* src/sw-Header.css */
.sw-header_div {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
}
.sw-header_div * {
  margin-block-start: 0;
  margin-block-end: 0;
}
.sw-header_column {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
}
.sw-header_logo {
  height: inherit;
  width: 15%;
  justify-content: center;
}
.sw-header_title {
  display: contents;
  justify-content: center;
  font-size: 3.4vw;
}
.sw-header_link {
  text-align: right;
  font-weight: bold;
  text-decoration: none;
  padding: 8px;
  font-size: 2vw;
  --header_link_color: #1888ff;
  color: var(--header_link_color);
}
.sw-header_link:hover {
  color: white;
  background-color: var(--header_link_color);
  border-radius: 0.25em;
  box-shadow: 0 10px 10px 0 rgba(0, 0, 0, 0.3);
}
.sw-header_msg {
  display: flex;
  justify-content: center;
  width: 7%;
  font-size: 1.3vw;
}
.sw-header_database {
  font-size: 1.3vw;
}

/* src/sw-NavBar.css */
:root {
  --sw-menu_width: 12.5em;
  --sw-menu_vertical_margin_left: 11.87em;
  --sw-menu_horizontal_margin_left: 12.5em;
  --sw-menu_horizontal_pad_left: 2.75em;
  --sw-menu_height: vh;
  --sw-margin_top: 2.5em;
  --sw-menu_vertical_pad_top: 3.125em;
  --sw-menu_vertical_pad_top_always: 0.9375em;
  --sw-menu_vertical_pad_left: 0.625em;
  --sw-horiz_menu_width: 100%;
  --sw-both_wh: 0%;
  --sw-horizontal_width: 0%;
  --sw-vertical_height: 0%;
  --sw-slide_time: 500ms;
  --sw-menu_additional: 3.5em;
  --sw-menu_top: none;
  --sw-menu_bottom: none;
}
body::-webkit-scrollbar {
  display: none;
}
.sw-menubar {
  display: flex;
  width: 100%;
}
.sw-nav-menu_horizontal {
  resize: both;
  overflow-y: scroll;
  width: 100%;
  height: 100vh;
}
.sw-nav-menu_vertical {
  resize: both;
  overflow-y: scroll;
  width: 100%;
  height: 100vh;
}
.sw-nav-menu_float {
  flex-grow: 4;
}
.sw-nav-nav-menu {
  background-color: #a4d3ee;
  font-size: x-large;
  font-weight: 450;
  position: relative;
  box-shadow: 0 35px 35px -35px rgba(0, 0, 0, 0.3);
}
.sw-nav-nav-menu_fixed_vert {
  background-color: #a4d3ee;
  font-size: x-large;
  font-weight: 450;
  position: relative;
  box-shadow: 0 35px 35px -35px rgba(0, 0, 0, 0.3);
  z-index: 70;
}
.sw-nav-center {
  font-size: xx-large;
  margin-left: 5px;
  color: black;
  position: absolute;
  top: 0%;
  left: 0%;
}
.sw-nav_menu_component {
  margin-top: var(--sw-margin_top);
}
.sw-nav-horiz-open-horizontal {
  padding-left: var(--sw-menu_horizontal_pad_left);
  width: var(--sw-horizontal_width);
  color: transparent;
  background-color: inherit;
}
.sw-nav-horiz-open-horizontal:hover {
  padding-left: var(--sw-menu_horizontal_pad_left);
  width: var(--sw-horiz_menu_width);
  color: black;
  background-color: #a4d3ee;
  transition: width var(--sw-slide_time), color 500ms 250ms ease-out;
}
.sw-nav-vertical {
  width: var(--sw-menu_width);
  height: var(--sw-menu_height);
}
.sw-nav-open-both {
  width: var(--sw-both_wh);
  height: var(--sw-both_wh);
  color: transparent;
  transition:
    width var(--sw-slide_time) ease-in,
    height var(--sw-slide_time) ease-in,
    color 250ms ease-out;
}
.sw-nav-open-both:hover {
  width: var(--sw-menu_width);
  height: var(--sw-menu_height);
  color: black;
  padding-top: var(--sw-menu_vertical_pad_top);
  transition:
    width var(--sw-slide_time) ease-out,
    height var(--sw-slide_time) ease-out,
    color 2000ms ease-out;
}
.sw-nav-open-horizontal {
  width: var(--sw-horizontal_width);
  color: transparent;
  transition: width var(--sw-slide_time) ease-in, color 250ms ease-out;
}
.sw-nav-open-horizontal:hover {
  padding-top: var(--sw-menu_vertical_pad_top);
  width: var(--sw-menu_width);
  color: black;
  background-color: #a4d3ee;
  transition: width var(--sw-slide_time) ease-out, color 1000ms 250ms ease-out;
}
.sw-nav-open-vertical {
  height: var(--sw-vertical_height);
  color: transparent;
  transition: height var(--sw-slide_time) ease-in, color 250ms ease-out;
}
.sw-nav-open-vertical:hover {
  height: var(--sw-menu_height);
  color: black;
  padding-top: var(--sw-menu_vertical_pad_top);
  transition: height var(--sw-slide_time) ease-out, color 500ms ease-out;
}
nav ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
}
nav ul li {
  float: left;
}
nav ul li span {
  text-decoration: none;
  display: block;
  padding: 8px;
}
.sw-navbar_vertical {
  display: flex;
  justify-content: left;
  align-items: flex-start;
  font-size: 1.2rem;
}
.sw-navbar {
  display: flex;
  justify-content: left;
  align-items: center;
  font-size: 1.2rem;
}
.sw-nav-menu-horizontal {
  grid-template-columns: repeat(25, auto);
  margin-right: 2rem;
  text-align: center;
}
.sw-nav_menu_vertical_pad {
  padding-top: var(--sw-menu_vertical_pad);
}
.sw-nav_menu_vertical_pad_always {
  padding-top: var(--sw-menu_vertical_pad_top_always);
}
.sw-nav-menu-vertical {
  grid-template-columns: 1fr;
  width: var(--sw-menu_width);
}
.sw-nav-menu {
  display: grid;
  grid-gap: 10px;
  list-style: none;
  justify-content: start;
}
.sw-nav-item {
  display: flex;
  align-items: center;
}
.sw-nav-item:hover span {
  color: white;
  background: #1888ff;
  border-radius: .25em;
  box-shadow: 0 10px 10px 0 rgba(0, 0, 0, 0.3);
}
.sw-nav-item-vertical {
  display: flex;
  flex-direction: row;
  padding-left: var(--sw-menu_vertical_pad_left);
}
.sw-nav-item-vertical:hover span {
  color: white;
  background: #1888ff;
  border-radius: .25em;
  box-shadow: 0 10px 10px 0 rgba(0, 0, 0, 0.3);
  width: var(--sw-menu_width);
}
.sw-nav-links {
  text-decoration: none;
}
.sw-nav-links2 {
  text-decoration: none;
}
.sw-nav-links:hover :not(.dropdown-menu) {
  background-color: #1888ff;
  border-radius: 4px;
  transition: all 0.2s ease-out;
}
.sw-menu nav[disabled] {
  pointer-events: none;
  opacity: 0.6;
}
@media screen and (max-width: 960px) {
  .sw-nav-menu.active {
    background: #242222;
    left: 0;
    opacity: 1;
    transition: all 0.5s ease;
    z-index: 1;
  }
  .sw-nav-links:hover {
    background-color: #1888ff;
    border-radius: 0;
  }
}

/* src/sw-checkboxRadio.css */
.sw-checkbox_defaultStyle {
  background-color: transparent;
  background-repeat: no-repeat;
  border: none;
  cursor: pointer;
  overflow: hidden;
  outline: none;
  color: inherit;
}
.sw-radio_defaultStyle {
  border: none;
  background-color: transparent;
  color: inherit;
}

/* src/sw-contextMenuHover.css */
div.sw-cm_contextMenuHov {
  position: absolute;
  display: block;
  padding: 10px;
  z-index: 1;
}
span.sw-cm_contextMenuHov:hover {
  visibility: visible;
  background-color: lightgray;
}
.sw-cm_menuStyle {
  width: 15em;
  border: 2px solid black;
  border-radius: 10px;
  background-color: var(--sw-theme_backgroundColor);
}

/* src/sw-doubleListBox.css */
.sw-dlb_buttonSt {
  width: 3em;
  margin: 0.25em 0.75em;
  justify-content: center;
  background-color: var(--sw-theme_buttonColor);
  color: var(--sw-theme_buttonTextColor);
  border: var(--sw-theme_buttonBorder);
  border-radius: var(--sw-theme_buttonRadius);
  font-weight: 900;
}
.sw-dlb_topSt {
  display: flex;
  flex-direction: row;
}
.sw-dlb_colSt {
  width: min-content;
  align-self: center;
}
.sw-dlb_listSt {
  min-width: 8em;
}
.sw-dlb_rightClass {
  font-size: 16;
  font-weight: bold;
  margin-bottom: 5px;
}
.sw-dlb_leftClass {
  font-size: 16;
  font-weight: bold;
  margin-bottom: 5px;
}
.sw-dlb_titleClass {
  font-size: 24;
  font-weight: bold;
}
.sw-dlb_overallStyle {
  margin-left: auto;
  margin-right: auto;
}
.sw-dlb_display {
  display: block;
}

/* src/sw-entryform.css */
.sw-ef_tLabel {
  width: 19em;
  margin: 5px;
  text-align: left;
  line-height: 1.25em;
  display: table-cell;
}
.sw-ef_cell {
  display: table-cell;
  margin-right: 5px;
  margin-top: 5px;
  margin-bottom: 5px;
  line-height: 1.25em;
}
.sw-ef_w3 {
  width: 3em;
  text-align: left;
}
.sw-ef_w3R {
  width: 3em;
  text-align: right;
}
.sw-ef_w6 {
  width: 6em;
  text-align: left;
}
.sw-ef_w6R {
  width: 6em;
  text-align: right;
}
.sw-ef_w8 {
  width: 8em;
  text-align: left;
}
.sw-ef_w8R {
  width: 8em;
  text-align: right;
}
.sw-ef_w9 {
  width: 9em;
  text-align: left;
}
.sw-ef_w9R {
  width: 9em;
  text-align: right;
}
.sw-ef_w12 {
  width: 12em;
  text-align: left;
}
.sw-ef_w12R {
  width: 12em;
  text-align: right;
}
.sw-ef_w18 {
  width: 18em;
  text-align: left;
}
.sw-ef_w18R {
  width: 18em;
  text-align: right;
}
.sw-ef_w18P {
  width: 18em;
  padding: 10px;
  text-align: left;
}
.sw-ef_w18PR {
  width: 18em;
  padding: 10px;
  text-align: right;
}
.sw-ef_w19 {
  width: 19em;
  text-align: left;
}
.sw-ef_w19P {
  width: 19em;
  padding: 10px;
  text-align: left;
}
.sw-ef_w19R {
  width: 19em;
  text-align: right;
}
.sw-ef_w19PR {
  width: 19em;
  padding: 10px;
  text-align: right;
}
.sw-ef_w25 {
  width: 25em;
  text-align: left;
}
.sw-ef_w25R {
  width: 25em;
  text-align: right;
}
.sw-ef_w31 {
  width: 31em;
  text-align: left;
}
.sw-ef_w31R {
  width: 31em;
  text-align: right;
}
.sw-ef_w44 {
  width: 44em;
  text-align: left;
}
.sw-ef_w44R {
  width: 44em;
  text-align: right;
}
.sw-ef_w56 {
  width: 56em;
  text-align: left;
}
.sw-ef_w56R {
  width: 56em;
  text-align: right;
}
.sw-ef_table {
  margin: 15px;
  display: table;
}
.sw-ef_tableCenter {
  margin: auto;
  display: table;
}
.sw-ef_row {
  display: table-row;
}
.sw-ef_specialrow {
  display: table-row;
  margin: 50px;
}
th1,
td1 {
  border: 2px solid black;
}
table1 {
  border: 2px solid black;
  margin: 20px;
}

/* src/sw-inputFile.css */
.sw-infile_fileStyle {
  display: none;
}
.sw-infile_buttonStyle {
  margin: var(--sw-theme_buttonMargin);
  border-radius: var(--sw-theme_buttonRadius);
  color: var(--sw-theme_buttonTextColor);
  font: var(--sw-theme_buttonFont);
  font-weight: var(--sw-theme_buttonFontWeight);
  font-size: var(--sw-theme_buttonFontSize);
  padding: 5px;
  display: inline-block;
  cursor: pointer;
}
.sw-infile_textStyle {
  width: 75%;
}
.sw-infile_marginStyle {
  margin-right: 10px;
}

/* src/sw-invalid.css */
.sw-invalid_checkForError {
  position: relative;
}
.sw-invalid_errMessage {
  visibility: hidden;
  background-color: black;
  color: #fff;
  width: 350px;
  text-align: center;
  border-radius: 6px;
  padding: 10px;
  position: absolute;
  z-index: 1;
}
.sw-invalid_checkForError:hover .sw-invalid_errMessage {
  visibility: visible;
}
.sw-invalid_error {
  font-weight: bolder;
  color: red;
}

/* src/sw-modal.css */
#sw-modalButton {
  background: transparent;
  border: none !important;
}
#sw-modal {
  background-color: rgba(129, 127, 127, 0.5);
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  top: 0;
  z-index: 10;
  display: flex;
  justify-content: center;
  align-items: center;
}
#sw-modal:empty {
  display: none;
}
#sw-modal > div {
  background-color: white;
  max-width: fit-content;
  max-height: 75%;
  padding: 15px;
  border-radius: 5px;
  text-align: center;
  overflow-y: scroll;
}
.sw-modal_marginStyle {
  margin-bottom: 10px;
}
.sw-modal_abuttonStyle,
.sw-modal_ebuttonStyle,
.sw-modal_cbuttonStyle,
.sw-modal_buttonStyle {
  margin: var(--sw-theme_buttonMargin);
  border-radius: var(--sw-theme_buttonRadius);
  color: var(--sw-theme_buttonTextColor);
  width: var(--sw-theme_buttonWidth);
  height: var(--sw-theme_buttonHeight);
  font: var(--sw-theme_buttonFont);
  font-weight: var(--sw-theme_buttonFontWeight);
  font-size: var(--sw-theme_buttonFontSize);
  background-color: var(--sw-theme_buttonColor);
}
.sw-modal_xbuttonStyle {
  color: black;
  font: "san-serif";
  font-weight: var(--sw-theme_buttonFontWeight);
  font-size: 16pt;
  background-color: inherit;
  border: 1px solid lightgray;
}
.sw-modal_divButton {
  text-align: right;
}
.sw-modal_flex {
  display: flex;
  justify-content: space-between;
}
.sw-modal_header {
  font-size: 24pt;
  font-weight: bold;
  margin-bottom: -10px;
}
.sw-modal_zindex {
  z-index: 15;
}

/* src/sw-outline.css */
:root {
  --sw-outline-indentation_amount: 1em;
  --sw-outline-item_width: 100%;
  --sw-outline-normal_indent: 1em;
  --sw-outline-margin_right: 1em;
  --sw-outline-font_size: large;
  --sw-outline-reg_color: rgb(0, 124, 186);
  --sw-outline-reg_back_color: white;
  --sw-outline-hover_color: white;
  --sw-outline-hover_back_color: rgb(0, 124, 186);
  --sw-outline-font_family: Tahoma;
  --sw-outline-overall_width: 100%;
}
.sw-outline-item {
  width: var(--sw-outline-item_width);
  color: var(--sw-outline-reg_color);
  background-color: var(--sw-outline-reg_back_color);
  font-size: var(--sw-outline-font_size);
  font-family: var(--sw_outline-font_family);
}
.sw-outline-button {
  border: none;
  width: var(--sw-outline-item_width);
  color: var(--sw-outline-reg_color);
  background-color: var(--sw_outline-reg_back_color);
  font-size: var(--sw-outline-font_size);
  text-align: left;
  padding-left: 0px;
  font-family: var(--sw-outline-font_family);
  margin-bottom: 10px;
}
.sw-outline-button:hover {
  color: var(--sw-outline-hover_color);
  background-color: var(--sw-outline-hover_back_color);
}
.sw-outline-button_disable {
  background-color: gray;
  border: none;
  width: var(--sw-outline-item_width);
  color: var(--sw-outline-reg_color);
  font-size: var(--sw-outline-font_size);
  text-align: left;
  padding-left: 0px;
  font-family: var(--sw-outline-font_family);
}
.sw-outline-font_plain {
  font-style: normal;
}
.sw-outline-font_bold {
  font-weight: bold;
}
.sw-outline-font_italic {
  font-style: italic;
}
.sw-outline-indent_normal {
  margin-left: var(--sw-outline-normal_indent);
}
.sw-outline-indent_spacing {
  margin-left: var(--sw-outline-indentation_amount);
}
.sw-outline-list {
  list-style: none;
}
.sw-outline-flex {
  display: flex;
}
.sw-outline-margin {
  margin-right: var(--sw-outline-margin_right);
  border-right: 1px black solid;
}
.sw-outline-selected_item {
  width: var(--sw-outline-overall_width);
}
.sw-outline-scroll {
  overflow: auto;
  min-width: 10em;
}

/* src/sw-pageTitle.css */
:root {
  --sw-pt_bannerBackground: rgb(0, 124, 186);
  --sw-pt_bannerTextColor: rgb(255, 255, 255);
  --sw-pt_bannerBorderRadius: 8px;
  --sw-pt_bannerFontSize: 24pt;
  --sw-pt_bannerFontWeight: normal;
  --sw-pt_bannerTextAlign: left;
  --sw-pt_bannerMarginLeft: 20px;
  --sw-pt_bannerMarginBottom: 10px;
  --sw-pt_bannerOverFlowY: hidden;
}
.sw-pt_banner {
  display: flex;
  align-items: center;
  background-color: var(--sw-pt_bannerBackground);
  border-radius: var(--sw-pt_bannerBorderRadius);
}
.sw-pt_bannerFont {
  font-family: var(--sw-pt_font);
  font-size: var(--sw-pt_bannerFontSize);
  color: var(--sw-pt_bannerTextColor);
  text-align: var(--sw-pt_bannerTextAlign);
  margin-left: var(--sw-pt_bannerMarginLeft);
  overflow-y: var(--sw-pt_bannerOverFlowY);
}
.sw-pt_bannerSmallFont {
  font-family: var(--sw-pt_font);
  color: var(--sw-pt_bannerTextColor);
  text-align: var(--sw-pt_bannerTextAlign);
  margin-left: var(--sw-pt_bannerMarginLeft);
  margin-bottom: var(--sw-pt_bannerMarginBottom);
  overflow-y: var(--sw-pt_bannerOverFlowY);
}

/* src/sw-slider1.css */
.sw-slider1_rangeValue {
  text-align: center;
  font-size: 2em;
  color: #999;
  font-weight: 400;
  margin-left: 20px;
}
.sw-slider1_range {
  width: 400px;
  height: 25px;
  -webkit-appearance: none;
  background: gray;
  outline: none;
  border-radius: 15px;
  overflow: hidden;
  box-shadow: inset 0 0 5px rgba(0, 0, 0, 1);
}
.sw-slider1_range::-webkit-slider-thumb {
  -webkit-appearance: none;
  width: 25px;
  height: 25px;
  border-radius: 50%;
  background: blue;
  cursor: pointer;
  border: 4px solid #333;
  box-shadow: -407px 0 0 400px blue;
}

/* src/sw-slider2.css */
.sw-slider2_rangeValue {
  text-align: center;
  font-size: 2em;
  color: #999;
  font-weight: 400;
  margin-left: 20px;
}
.sw-slider2_range {
  -webkit-appearance: none;
  background-color: lightgray;
  height: 4px;
  width: 400px;
  outline: none;
}
.sw-slider2_range::-webkit-slider-thumb {
  -webkit-appearance: none;
  border: solid black 2px;
  background: blue;
  border-radius: 6px;
  width: 12px;
  height: 30px;
  cursor: pointer;
}

/* src/sw-slider3.css */
.sw-slider3_rangeValue {
  text-align: center;
  font-size: 2em;
  color: #999;
  font-weight: 400;
  margin-left: 20px;
}
.sw-slider3_range {
  -webkit-appearance: none;
  width: 400px;
  height: 20px;
  outline: none;
  overflow: hidden;
  background: lightgray;
  box-shadow: inset 0 0 5px rgba(0, 0, 0, 1);
}
.sw-slider3_range::-webkit-slider-thumb {
  width: 15px;
  height: 20px;
  -webkit-appearance: none;
  background: blue;
  cursor: pointer;
  border: 2px solid #333;
  box-shadow: -400px 0 0 400px blue;
}

/* src/sw-slider4.css */
.sw-slider4_rangeValue {
  text-align: center;
  font-size: 2em;
  color: #999;
  font-weight: 400;
  margin-left: 20px;
}
.sw-slider4_range {
  width: 400px;
  margin: 13.8px 0;
  background-color: transparent;
  -webkit-appearance: none;
}
.sw-slider4_range:focus {
  outline: none;
}
.sw-slider4_range::-webkit-slider-runnable-track {
  background: #3071a9;
  border: 0.2px solid #010101;
  border-radius: 1.3px;
  width: 100%;
  height: 8.4px;
  cursor: pointer;
}
.sw-slider4_range::-webkit-slider-thumb {
  margin-top: -14px;
  width: 16px;
  height: 36px;
  background: #ffffff;
  border: 1px solid #000000;
  border-radius: 3px;
  cursor: pointer;
  -webkit-appearance: none;
}
.sw-slider4_range:focus::-webkit-slider-runnable-track {
  background: #367ebd;
}
.sw-slider4_range::-moz-range-track {
  background: #3071a9;
  border: 0.2px solid #010101;
  border-radius: 1.3px;
  width: 100%;
  height: 8.4px;
  cursor: pointer;
}
.sw-slider4_range::-moz-range-thumb {
  width: 16px;
  height: 36px;
  background: #ffffff;
  border: 1px solid #000000;
  border-radius: 3px;
  cursor: pointer;
}
.sw-slider4_range::-ms-track {
  background: transparent;
  border-color: transparent;
  border-width: 14.8px 0;
  color: transparent;
  width: 100%;
  height: 8.4px;
  cursor: pointer;
}
.sw-slider4_range::-ms-fill-lower {
  background: #2a6495;
  border: 0.2px solid #010101;
  border-radius: 2.6px;
}
.sw-slider4_range::-ms-fill-upper {
  background: #3071a9;
  border: 0.2px solid #010101;
  border-radius: 2.6px;
}
.sw-slider4_range::-ms-thumb {
  width: 16px;
  height: 36px;
  background: #ffffff;
  border: 1px solid #000000;
  border-radius: 3px;
  cursor: pointer;
  margin-top: 0px;
}
.sw-slider4_range:focus::-ms-fill-lower {
  background: #3071a9;
}
.sw-slider4_range:focus::-ms-fill-upper {
  background: #367ebd;
}

/* src/sw-slider5.css */
.sw-slider5_rangeValue {
  text-align: center;
  font-size: 2em;
  color: #999;
  font-weight: 400;
  margin-left: 20px;
}
.sw-slider5_range {
  width: 400px;
}

/* src/sw-spreadSheet.css */
.sw-ss_button {
  margin: var(--sw-theme_buttonMargin);
  border-radius: var(--sw-theme_buttonRadius);
  color: var(--sw-theme_buttonTextColor);
  font: var(--sw-theme_buttonFont);
  font-weight: var(--sw-theme_buttonFontWeight);
  font-size: var(--sw-theme_buttonFontSize);
}
.sw-ss_center {
  text-align: center;
}
.sw-ss_left {
  text-align: left;
}
.sw-ss_right {
  text-align: right;
}
.sw-ss_check {
  font-size: x-large;
}
.sw-ss_checked_background {
  background-color: var(--sw-theme_checkedBackground);
}
.sw-ss_background {
  background-color: var(--sw-theme_backgroundColor);
}

/* src/sw-theme.css */
:root {
  --sw-theme_backgroundColor: inherit;
  --sw-theme_buttonPadding: 8px;
  --sw-theme_buttonMargin: 10px;
  --sw-theme_buttonRadius: 10px;
  --sw-theme_buttonWidth: 100px;
  --sw-theme_buttonHeight: 30px;
  --sw-theme_buttonBorder: 2px solid #bcdff3;
  --sw-theme_buttonColor: #a4d3ee;
  --sw-theme_buttonTextColor: rgb(46, 41, 37);
  --sw-theme_buttonFont: "Open Sans", sans-serif;
  --sw-theme_buttonFontWeight: 600;
  --sw-theme_buttonFontSize: 12;
  --sw-theme_buttonStyle: normal;
  --sw-theme_disableButtonColor: lightgray;
  --sw-theme_checkedBackground: lightgray;
  --sw-theme_font: "Open Sans", sans-serif;
  --sw-theme_fontWeight: bold;
  --sw-theme_fontSize: 12pt;
  --sw-theme_errorColor: pink;
  --sw-theme_normalColor: white;
  --sw-theme_textColor: black;
}
.sw-theme_buttonStyle {
  font-family: var(--sw-theme_buttonFont);
  font-size: var(--sw-theme_buttonFontSize);
  font-weight: var(--sw-theme_buttonFontWeight);
  font-style: var(--sw-theme_buttonStyle);
  color: var(--sw-theme_buttonTextColor);
  border: var(--sw-theme_buttonBorder);
  border-radius: var(--sw-theme_buttonRadius);
  margin: var(--sw-theme_buttonMargin);
  padding: var(--sw-theme_buttonPadding);
}
.sw-theme_grayButtonBackground {
  background-color: var(--sw-theme_disableButtonColor);
}
.sw-theme_normalButtonBackground {
  background-color: var(--sw-theme_buttonColor);
}
.sw-theme_errorBackground {
  background-color: var(--sw-theme_errorColor);
}
.sw-theme_normalBackground {
  background-color: var(--sw-theme_normalColor);
}

/* src/index.css */

/* src/sw-accordion.css */

/* src/sw-carousel.css */

/* src/sw-table.css */
:root {
  --sw-sst_hover_back_color1: none;
  --sw-sst_hover_back_color2: none;
  --sw-sst_hover_back_color3: none;
  --sw-sst_hover_back_color4: none;
  --sw-sst_hover_back_color5: none;
  --sw-sst_hover_back_color6: none;
  --sw-sst_hover_back_color7: none;
  --sw-sst_hover_back_color8: none;
  --sw-sst_hover_back_color9: none;
  --sw-sst_hover_back_color10: none;
  --sw-sst_header_background: #FFFFFE;
}
table.sw-sst_search_sort_table1 tr:hover td {
  background-color: var(--sw-sst_hover_back_color1);
}
table.sw-sst_search_sort_table2 tr:hover td {
  background-color: var(--sw-sst_hover_back_color2);
}
table.sw-sst_search_sort_table3 tr:hover td {
  background-color: var(--sw-sst_hover_back_color3);
}
table.sw-sst_search_sort_table4 tr:hover td {
  background-color: var(--sw-sst_hover_back_color4);
}
table.sw-sst_search_sort_table5 tr:hover td {
  background-color: var(--sw-sst_hover_back_color5);
}
table.sw-sst_search_sort_table6 tr:hover td {
  background-color: var(--sw-sst_hover_back_color6);
}
table.sw-sst_search_sort_table7 tr:hover td {
  background-color: var(--sw-sst_hover_back_color7);
}
table.sw-sst_search_sort_table8 tr:hover td {
  background-color: var(--sw-sst_hover_back_color8);
}
table.sw-sst_search_sort_table9 tr:hover td {
  background-color: var(--sw-sst_hover_back_color9);
}
table.sw-sst_search_sort_table10 tr:hover td {
  background-color: var(--sw-sst_hover_back_color10);
}
.sw-sst_divStyle {
  border: 2px solid black;
  border-radius: 10px;
  text-align: center;
  margin: 5px;
  padding: 10px;
  width: fit-content;
  overflow: auto;
  background-color: var(--sw-theme_backgroundColor);
  resize: horizontal;
}
.sw-sst_divStyle2 {
  border: none;
  text-align: center;
  margin: 5px;
  padding: 10px;
  width: fit-content;
  overflow: auto;
  background-color: var(--sw-theme_backgroundColor);
  resize: horizontal;
}
.sw-sst_noButtonStyle {
  margin: 10px;
  padding: 0px;
  border: none;
  background: none;
  font-weight: bold;
  color: black;
}
.sw-sst_marginStyle {
  margin-top: 10px;
  margin-bottom: 10px;
  margin-left: 10px;
  margin-right: 30px;
}
.sw-sst_noBorderStyle {
  margin: 10px;
  padding: 0px;
  border: none;
  background: none;
}
.sw-sst_noBorder {
  border: none;
}
.sw-sst_tableStyle {
  margin: auto;
  border: 1px solid black;
  width: fit-content;
}
.sw-sst_oddRow {
  background-color: lightgray;
}
.sw-sst_evenRow {
  background-color: inherit;
}
.sw-sst_centerBoldStyle {
  text-align: center;
  font-weight: bold;
  font-size: 20px;
  z-index: 20;
}
.sw-sst_footerStyle {
  font-weight: bold;
  font-size: 20px;
  border: 1px solid black;
}
.sw-sst_footerStyle2 {
  text-align: none;
  font-weight: bold;
  font-size: 20px;
  border: none;
}
.sw-sst_scrollStyle {
  display: block;
  overflow: scroll;
  width: auto;
  border: 1px solid black;
  margin-left: auto;
  margin-right: auto;
}
.sw-sst_searchStyle {
  margin: 5px;
}
.sw-sst_footStyle {
  width: 100%;
  margin: 10px;
  text-align: right;
  bottom: 0;
  z-index: 2;
  background-color: var(--sw-theme_backgroundColor);
}
.sw-sst_footStyle2 {
  text-align: left;
}
.sw-sst_imageStyleFilter {
  background-color: lightgreen;
}
.sw-sst_imageStyleNormal {
  background-color: aliceblue;
}
.sw-sst_imageStyleDisable {
  background-color: var(--sw-theme_disableButtonColor);
}
.sw-sst_buttonStyle2 {
  border: none;
  background-color: var(--sw-theme_backgroundColor);
}
.sw-sst_headerStyle {
  position: sticky;
  top: 0;
  z-index: 2;
  border: 1px solid black;
  background-color: var(--sw-sst_header_background);
}
.sw-sst_headerStyle2 {
  position: sticky;
  top: 0;
  z-index: 2;
  border: none;
  background-color: var(--sw-sst_header_background);
}
.sw-sst_widthStyle {
  margin-bottom: 0px;
  padding-bottom: 0px;
  width: 99%;
  text-align: center;
}
.sw-sst_titleStyle {
  color: black;
  background-color: var(--sw-theme_backgroundColor);
}
.sw-sst_buttonStyle {
  margin: var(--sw-theme_buttonMargin);
  padding: var(--sw-theme_buttonPadding);
  border: var(--sw-theme_buttonBorder);
  border-radius: var(--sw-theme_buttonRadius);
  color: var(--sw-theme_buttonTextColor);
  font: var(--sw-theme_buttonFont);
  font-weight: var(--sw-theme_buttonFontWeight);
  font-size: var(--sw-theme_buttonFontSize);
}
.sw-sst_grayButtonBackground {
  background-color: var(--sw-theme_disableButtonColor);
}
.sw-sst_normalButtonBackground {
  background-color: var(--sw-theme_buttonColor);
}
.sw-sst_letterBackground {
  background-color: lightblue;
}
.sw-sst_regBackground {
  background-color: var(--sw-theme_backgroundColor);
}
.sw-sst_headerButton {
  background-color: var(--theme_backgroundColor);
  border: none;
  font-weight: bold;
  font: var(--sw-theme_buttonFont);
  font-size: 1em;
}
.sw-sst_dropDownDiv {
  background-color: navy;
  color: white;
}
.sw-sst_dropDownButton {
  background-color: navy;
  color: white;
  border: none;
  margin: 10px;
  font-size: 1.5em;
}
.sw-sst_tableBold {
  font-weight: bold;
  margin-top: 15px;
  font-size: 1.5em;
}
.sw-sst_headerColor {
  color: #0096FF;
}
.sw-sst-dropDown_choice {
  margin-bottom: 10px;
}
.sw-sst_dropButton {
  border-radius: 5px;
  color: black;
  background-color: gainsboro;
  margin-bottom: 10px;
}
.sw-sst_toolTip {
  visibility: hidden;
  background-color: transparent;
  color: gainsboro;
  font-size: 0.75em;
  position: absolute;
  z-index: 1;
}
.sw-sst_showToolTip:hover .sw-sst_toolTip {
  visibility: visible;
  animation: tooltipAnim 1s 1;
  opacity: 1;
}
.sw-sst_top {
  top: 0;
  left: 0;
}
.sw-sst_right_top_bot {
  text-align: right;
  float: right;
}
.sw-sst_body_full {
  border: 1px solid black;
}
.sw-sst_table {
  border-collapse: collapse;
  width: 100%;
}
.sw-sst_table2 {
  border: none;
  width: 100%;
}
.sw-sst_resize {
  resize: horizontal;
  overflow: auto;
}
.sw-sst_final_total_margin {
  margin-top: 20px;
}
.sw-sst_body_col {
  border-left: 1px solid black;
  border-right: 1px solid black;
  border-top: none;
  border-bottom: none;
}
.sw-sst_body_row {
  border-left: none;
  border-right: none;
  border-top: 1px solid black;
  border-bottom: 1px solid black;
}
.sw_sst_body_none {
  border: none;
}
.sw-sst_stripe:nth-child(even) {
  background-color: gainsboro;
}
.sw-sst_left {
  text-align: left;
  font-weight: normal;
  font-size: unset;
}
.sw-sst_left_bold {
  font-weight: bold;
  text-align: left;
}
.sw-sst_center {
  text-align: center;
  font-weight: normal;
  font-size: unset;
}
.sw-sst_center_bold {
  font-weight: bold;
  text-align: center;
}
.sw-sst_right {
  text-align: right;
  font-weight: normal;
  font-size: unset;
}
.sw-sst_right_bold {
  font-weight: bold;
  text-align: right;
}
.sw-sst_money {
  text-align: right;
}
.sw-sst_money_bold {
  font-weight: bold;
  text-align: right;
}
.sw-sst_money_left {
  text-align: left;
}
.sw-sst_money_left_bold {
  font-weight: bold;
  text-align: left;
}
.sw-sst_money_center {
  text-align: center;
}
.sw-sst_money_center_bold {
  font-weight: bold;
  text-align: center;
}
.sw-sst_date {
  text-align: center;
}
.sw-sst_date_bold {
  font-weight: bold;
  text-align: center;
}
.sw-sst_date_left {
  text-align: left;
}
.sw-sst_date_left_bold {
  font-weight: bold;
  text-align: left;
}
.sw-sst_date_right {
  text-align: right;
}
.sw-sst_date_right_bold {
  font-weight: bold;
  text-align: right;
}
.sw-sst_bottom {
  vertical-align: bottom;
}
.sw-sst_excelButtonStyle {
  margin: 20px;
  border-radius: 10px;
  padding-left: 15px;
  padding-right: 15px;
  padding-top: 4px;
  padding-bottom: 4px;
  color: var(--sw-theme_buttonTextColor);
  background-color: var(--sw-theme_buttonColor);
  width: 270px;
  height: var(--sw-theme_buttonHeight);
  font: var(--sw-theme_buttonFont);
  font-weight: bold;
  text-decoration: none;
}
.sw-sst_pre {
  white-space: pre-line;
}
.sw-sst_checkbox_bold {
  font-size: 12pt;
  font-weight: bold;
}
@keyframes tooltipAnim {
  0% {
    opacity: 0;
  }
  75% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* src/sw-textarea.css */
.sw-textarea_word_count {
  font-size: 10pt;
  line-height: 0;
}
.sw-textarea_word_count_red {
  font-size: 10pt;
  line-height: 0;
  color: red;
}

/* src/forms/Form.css */
.sw-form {
  resize: both;
  overflow: auto;
}
.sw-form-tr {
  resize: both;
  overflow: auto;
}

/* src/forms/sw-Gears.css */
.sw-gears-container {
  background-color: #ffffff;
  height: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}
.sw-gears-machine {
  width: 60vmin;
  fill: #3eb049;
}
.sw-gears-small-shadow,
.sw-gears-medium-shadow,
.sw-gears-large-shadow {
  fill: rgba(0, 0, 0, 0.05);
}
.sw-gears-small {
  -webkit-animation: counter-rotation 2.5s infinite linear;
  -moz-animation: counter-rotation 2.5s infinite linear;
  -o-animation: counter-rotation 2.5s infinite linear;
  animation: counter-rotation 2.5s infinite linear;
  -webkit-transform-origin: 100.136px 225.345px;
  -ms-transform-origin: 100.136px 225.345px;
  transform-origin: 100.136px 225.345px;
}
.sw-gears-small-shadow {
  -webkit-animation: counter-rotation 2.5s infinite linear;
  -moz-animation: counter-rotation 2.5s infinite linear;
  -o-animation: counter-rotation 2.5s infinite linear;
  animation: counter-rotation 2.5s infinite linear;
  -webkit-transform-origin: 110.136px 235.345px;
  -ms-transform-origin: 110.136px 235.345px;
  transform-origin: 110.136px 235.345px;
}
.sw-gears-medium {
  -webkit-animation: rotation 3.75s infinite linear;
  -moz-animation: rotation 3.75s infinite linear;
  -o-animation: rotation 3.75s infinite linear;
  animation: rotation 3.75s infinite linear;
  -webkit-transform-origin: 254.675px 379.447px;
  -ms-transform-origin: 254.675px 379.447px;
  transform-origin: 254.675px 379.447px;
}
.sw-gears-medium-shadow {
  -webkit-animation: rotation 3.75s infinite linear;
  -moz-animation: rotation 3.75s infinite linear;
  -o-animation: rotation 3.75s infinite linear;
  animation: rotation 3.75s infinite linear;
  -webkit-transform-origin: 264.675px 389.447px;
  -ms-transform-origin: 264.675px 389.447px;
  transform-origin: 264.675px 389.447px;
}
.sw-gears-large {
  -webkit-animation: counter-rotation 5s infinite linear;
  -moz-animation: counter-rotation 5s infinite linear;
  -o-animation: counter-rotation 5s infinite linear;
  animation: counter-rotation 5s infinite linear;
  -webkit-transform-origin: 461.37px 173.694px;
  -ms-transform-origin: 461.37px 173.694px;
  transform-origin: 461.37px 173.694px;
}
.sw-gears-large-shadow {
  -webkit-animation: counter-rotation 5s infinite linear;
  -moz-animation: counter-rotation 5s infinite linear;
  -o-animation: counter-rotation 5s infinite linear;
  animation: counter-rotation 5s infinite linear;
  -webkit-transform-origin: 471.37px 183.694px;
  -ms-transform-origin: 471.37px 183.694px;
  transform-origin: 471.37px 183.694px;
}
@-webkit-keyframes rotation {
  from {
    -webkit-transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(359deg);
  }
}
@-moz-keyframes rotation {
  from {
    -moz-transform: rotate(0deg);
  }
  to {
    -moz-transform: rotate(359deg);
  }
}
@-o-keyframes rotation {
  from {
    -o-transform: rotate(0deg);
  }
  to {
    -o-transform: rotate(359deg);
  }
}
@keyframes rotation {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(359deg);
  }
}
@-webkit-keyframes counter-rotation {
  from {
    -webkit-transform: rotate(359deg);
  }
  to {
    -webkit-transform: rotate(0deg);
  }
}
@-moz-keyframes counter-rotation {
  from {
    -moz-transform: rotate(359deg);
  }
  to {
    -moz-transform: rotate(0deg);
  }
}
@-o-keyframes counter-rotation {
  from {
    -o-transform: rotate(359deg);
  }
  to {
    -o-transform: rotate(0deg);
  }
}
@keyframes counter-rotation {
  from {
    transform: rotate(359deg);
  }
  to {
    transform: rotate(0deg);
  }
}

/* src/forms/sw-MakeModal.css */
.sw-make-modal_buttonStyle {
  background-color: var(--sw-theme_buttonColor);
  margin-left: var(--sw-theme_buttonMargin);
  margin-right: var(--sw-theme_buttonMargin);
  padding-left: var(--sw-theme_buttonPadding);
  padding-right: var(--sw-theme_buttonPadding);
  border-radius: var(--sw-theme_buttonRadius);
  color: var(--sw-theme_buttonTextColor);
  width: var(--sw-theme_buttonWidth);
  font: var(--sw-theme_buttonFont);
  font-weight: var(--sw-theme_buttonFontWeight);
  font-size: var(--sw-theme_buttonFontSize);
}
#sw-modal > div {
  padding-left: 10px;
  padding-right: 10px;
  padding-bottom: 8px;
  border-radius: 15px;
}

/* src/forms/img/FormImages.css */
.sw-AddRecordIcon {
  min-width: 16px;
  min-height: 0.75em;
}
.sw-CloneRecordIcon {
  min-width: 16px;
  min-height: 0.75em;
}
/*# sourceMappingURL=index.css.map */