@import url("https://cdn.jsdelivr.net/npm/@mdi/font@4.x/css/materialdesignicons.min.css");
@import url("https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;600;700&display=swap");
.dev_info span {
  display: block;
  font-size: 14px;
  font-weight: bold;
  margin-bottom: 1rem;
}

.v-input--selection-controls {
  margin-top: 0;
}

* {
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
  font-family: 'Open Sans', sans-serif;
  padding: 0;
  margin: 0;
}

.v-select__slot input {
  border: 0;
}

.percentage {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}

.percentage h4 {
  text-align: center;
  font-weight: lighter;
  color: #222;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 100%;
          flex: 0 0 100%;
}

.percentage span {
  font-size: 0.7rem;
  text-align: center;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 100%;
          flex: 0 0 100%;
  font-weight: lighter;
  color: #444;
}

.percentage span.number {
  font-size: 2rem !important;
  font-weight: bold !important;
  color: #004de8 !important;
}

select,
input {
  padding: 1rem;
  border-radius: 5px;
  background-color: #FFFFFF;
  border: 1px dashed #004de8;
  width: 100%;
  height: auto;
}

select:disabled,
input:disabled {
  background-color: #EFEFEF;
}

select::-webkit-outer-spin-button, select::-webkit-inner-spin-button,
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
}

main#calculator_wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  margin: 5rem auto;
  width: 80rem;
  max-width: 100%;
}

main#calculator_wrapper section.info-box {
  width: 100%;
  padding: 3rem;
  color: #222;
  -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
          box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
  background-color: #EFEFEF;
  margin: 1rem 0;
}

main#calculator_wrapper section.info-box label {
  color: #004de8;
  font-size: 0.8rem;
  font-weight: 600;
}

main#calculator_wrapper aside.filter {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 100%;
          flex: 0 0 100%;
  background-color: #EFEFEF;
  font-size: 0.7rem;
  border-radius: 5px 5px 0 0;
}

main#calculator_wrapper aside.filter .filter_row {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  margin: 0.25rem;
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -ms-flex-line-pack: start;
      align-content: flex-start;
  padding: 0.5rem;
}

main#calculator_wrapper aside.filter .filter_row:last-child {
  padding: 0;
  margin: 0;
}

main#calculator_wrapper aside.filter .filter_row:last-child .reset_btn {
  font-size: 1rem;
  text-transform: uppercase;
  border-radius: 0 5px 0 0;
  height: 100%;
  width: 100%;
  cursor: pointer !important;
}

main#calculator_wrapper aside.filter .filter_row .add_all_button {
  -ms-flex-item-align: center;
      -ms-grid-row-align: center;
      align-self: center;
  padding: 0.5rem;
  text-decoration: underline;
  color: #004de8;
  cursor: pointer;
}

main#calculator_wrapper aside.filter .filter_row button {
  padding: 1rem;
  color: #000;
  border: 0;
  border: 1px solid #004de8;
  background-color: #EFEFEF;
  border-radius: 5px;
  position: relative;
}

main#calculator_wrapper aside.filter .filter_row button.v-btn {
  background-color: #004de8;
  color: #fff;
}

main#calculator_wrapper aside.filter .filter_row button.market {
  width: 50px;
  height: 50px;
  background-color: #004de8;
  color: #FFFFFF;
  font-size: 1rem;
  font-weight: 600;
  line-height: 0;
}

main#calculator_wrapper aside.filter .filter_row button:hover {
  background-color: #004de8;
  -webkit-transition: all 0.2s linear;
  transition: all 0.2s linear;
  color: #FFFFFF;
  cursor: pointer;
}

main#calculator_wrapper aside.filter .filter_row button.active {
  background-color: #004de8;
  color: #FFFFFF;
}

main#calculator_wrapper aside.filter .filter_row button.active:hover {
  cursor: default;
}

main#calculator_wrapper aside.filter .filter_row label {
  font-size: 0.7rem;
  font-weight: 600;
  color: #004de8;
  display: block;
  margin-bottom: 0.25rem;
  width: 100%;
}

main#calculator_wrapper aside.filter .filter_row select,
main#calculator_wrapper aside.filter .filter_row input {
  -ms-flex-item-align: end;
      align-self: flex-end;
}

main#calculator_wrapper aside.filter .filter_row .markets {
  position: absolute;
  -webkit-columns: 3;
          columns: 3;
  border: 1px solid #EFEFEF;
  z-index: 10;
  background-color: #FFFFFF;
}

main#calculator_wrapper aside.filter .filter_row .markets .market {
  padding: 0.5rem;
}

main#calculator_wrapper aside.filter .filter_row .markets .market:hover {
  cursor: pointer;
  background-color: #eee;
}

main#calculator_wrapper .v-menu__content {
  max-width: 125px !important;
  text-align: left;
}

main#calculator_wrapper section.market_inputs {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 100%;
          flex: 0 0 100%;
}

main#calculator_wrapper section.market_inputs tr td.market_graphs_wrapper {
  padding: 0;
}

main#calculator_wrapper section.market_inputs tr td {
  padding: 0.5rem;
}

main#calculator_wrapper section.market_inputs tr td .v-chip {
  cursor: pointer;
}

main#calculator_wrapper section.market_inputs tr td input {
  padding: 0.5rem;
  width: 8rem;
  max-width: 100%;
}

main#calculator_wrapper section.market_inputs tr td section.market_graphs {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}

main#calculator_wrapper section.market_inputs tr td section.market_graphs .intro {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 100%;
          flex: 0 0 100%;
}

main#calculator_wrapper section.market_inputs tr td section.market_graphs .all_legs_section {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 100%;
          flex: 0 0 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

main#calculator_wrapper section.market_inputs tr td section.market_graphs .all_legs_section .graph {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  max-width: 300px;
}

main#calculator_wrapper section.market_inputs tr td section.market_graphs .all_legs_section .graph:last-of-type {
  margin: 0;
  border-top: 0;
}

main#calculator_wrapper section.market_inputs tr td section.market_graphs .all_legs_section .random_info {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

main#calculator_wrapper section.market_inputs tr td section.market_graphs .all_legs_section .random_info .fact {
  display: block;
  font-weight: bold;
  max-width: 500px;
  padding: 1rem;
  background-color: #004de8;
  color: #FFFFFF;
}

main#calculator_wrapper section.market_inputs tr td section.market_graphs .all_legs_section .random_info .fact h4 {
  font-size: 0.8rem;
  font-weight: lighter;
  margin-bottom: 0.25rem;
}

main#calculator_wrapper section.market_inputs tr td section.market_graphs .leg_section {
  background-color: #f9f9f9;
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
}

main#calculator_wrapper section.market_inputs tr td section.market_graphs .leg_section .alert {
  margin: 3rem 1.5rem;
}

main#calculator_wrapper section.market_inputs tr td section.market_graphs .leg_section h3 {
  font-weight: normal;
  width: 100%;
  text-align: center;
  margin: 1rem auto;
  color: #004de8;
}

main#calculator_wrapper section.market_inputs tr td section.market_graphs .leg_section .percentage {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}

main#calculator_wrapper section.market_inputs tr td section.market_graphs .leg_section .percentage h4 {
  text-align: center;
  font-weight: lighter;
  color: #222;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 100%;
          flex: 0 0 100%;
}

main#calculator_wrapper section.market_inputs tr td section.market_graphs .leg_section .percentage span {
  font-size: 0.7rem;
  text-align: center;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 100%;
          flex: 0 0 100%;
  font-weight: lighter;
  color: #444;
}

main#calculator_wrapper section.market_inputs tr td section.market_graphs .leg_section:nth-child(2) {
  background-color: #EFEFEF;
}

main#calculator_wrapper section.market_inputs tr td section.market_graphs .leg_section:nth-child(3) {
  background-color: #e2e2e2;
}

main#calculator_wrapper section.market_inputs tr td section.market_graphs .graph {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 100%;
          flex: 0 0 100%;
  margin: 0.5rem;
  height: 250px;
  padding: 0.5rem 0;
}

main#calculator_wrapper section.market_inputs tr td section.market_graphs .graph:last-of-type {
  border-top: 1px solid #666;
  margin: 0.5rem 0 0 0;
  background-color: rgba(156, 156, 156, 0.1);
}

main#calculator_wrapper section.market_inputs .v-chip.v-size--default {
  color: #FFFFFF;
  font-weight: 600;
}
/*# sourceMappingURL=app.css.map */