.js-plotly-plot .plotly .modebar {
  padding-top: 5%;
  margin-right: 3.5%;
}

body {
  background-color: #242E3F;
  color: #87B4E5;
  margin-left: 1%;
  margin-right: 1%;
  margin-bottom: 1%;
  margin-top: 1%;
}

a {
  text-decoration: none;
}

[hidden] {
  display: none !important;
}

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

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

/* .two.columns {
  width: 16.25%;
} */

/* .column,
.columns {
  margin-left: 0.5%;
} */

.pretty_container {
  border-radius: 5px;
  background-color: #1D262F;
  margin: 10px;
  padding: 10px;
  position: relative;
  box-shadow: 2px 2px 2px black;
}

.payment-button {
  width: 15%;
}

.crypto-qr {
  width: 35%;
}

#download_button_1 {
  display: block;
}

#download_button_2 {
  display: none;
}

.inner {
  background-color: #242E3F;
}

.bare_container {
  margin: 0 0 0 0;
  padding: 0 0 0 0;
}

.dcc_control {
  margin: 0;
  padding: 5px;
  width: calc(100%-40px);
}

.control_label {
  margin: 0;
  padding: 10px;
  padding-bottom: 0px;
  margin-bottom: 0px;
  width: calc(100%-40px);
}

.rc-slider {
  margin-left: 0px;
  padding-left: 0px;
}

.rc-slider-step,
.rc-slider-track,
.rc-slider-rail {
  background-color: #242e3f;
}

.rc-slider-dot {
  background-color: #1D262F
}

.rc-slider-handle {
  background-color: #2BFEBE
}

.rc-slider-dot,
.rc-slider-dot-active {
  border-color: rgba(43, 254, 190, 0.5);
}

.main_graph {
  margin-top: -0px !important;
  /* z-index: -1 */
}

.rc-slider-handle,
.rc-slider-handle-click-focused:focus {
  border-color: #2BFEBE;
}

.rc-slider-tooltip-inner {
  color: #fff;
  background-color: #6c6c6c;
  box-shadow: 0 0 4px #2BFEBE;
}

.rc-slider-handle-click-focused,
.rc-slider-handle:hover,
.rc-slider-handle:active {
  border-color: rgba(120, 255, 241);
}

.info_tooltip {
  border: 1px solid #2BFEBE;
  background-color: #242E3F;
  color: #87B4E5;
  padding: 6px 10px;
  border-radius: 4px;
  max-width: 600px;
  min-width: 100px;
  margin-left: 5px;
  margin-right: 5px;
}

.tooltip-inner {
  text-align: unset;
}

.tooltip {
  --bs-tooltip-zindex: unset;
  --bs-tooltip-max-width: unset;
  --bs-tooltip-padding-x: unset;
  --bs-tooltip-padding-y: unset;
  --bs-tooltip-margin: unset;
  --bs-tooltip-font-size: unset;
  --bs-tooltip-color: unset;
  --bs-tooltip-bg: unset;
  --bs-tooltip-border-radius: unset;
  --bs-tooltip-opacity: unset;
  --bs-tooltip-arrow-width: unset;
  --bs-tooltip-arrow-height: unset;
  font-family: unset;
  font-style: unset;
  font-weight: unset;
  line-height: unset;
  text-shadow: unset;
  text-transform: unset;
  letter-spacing: unset;
  word-break: unset;
  white-space: unset;
  word-spacing: unset;
  line-break: unset;
  font-size: unset;
  word-wrap: unset;
}

.flex-display {
  display: flex;
}

.container-display {
  display: flex;
}

#individual_graph,
#aggregate_graph {
  width: calc(100% - 30px);
  position: absolute;
}

#count_graph {
  position: absolute;
  height: calc(100% - 30px);
  width: calc(100% - 30px);
}

#header {
  align-items: center;
}

#learn-more-button {
  text-align: center;
  height: 100%;
  padding: 0 20px;
  text-transform: none;
  font-size: 15px;
  float: right;
  margin-right: 10px;
  margin-top: 30px;
}

#title {
  text-align: center;
}

.mini_container {
  border-radius: 5px;
  background-color: #1D262F;
  margin: 10px;
  padding: 10px;
  position: relative;
  box-shadow: 2px 2px 2px black;
}

.mini_container_button,
.mini_container_button:hover {
  border-radius: 5px;
  border: 1px solid #2BFEBE;
  color: #1D262F;
  background-color: #2BFEBE;
  margin: 10px;
  padding-left: 10px;
  padding-right: 10px;
  position: relative;
  width: fit-content;
}

.mini_container_button:hover {
  color: #2BFEBE;
  background-color: #1D262F;
  cursor: pointer;
}

.mini_container_icon {
  background-color: #2BFEBE;
  margin-top: -10px;
  margin-bottom: -10px;
  margin-right: -10px;
  width: calc(16.25% + 10px) !important;
  color: #1D262F;
  border-top-right-radius: 5px;
  border-bottom-right-radius: 5px;
  display: flex;
  align-items: center;
  text-align: center;
}

.fa-lg,
.fa-2x,
.fa-3x,
.fa-4x {
  width: 100%;
}

.custom-tab {
  border-radius: 5px;
  background-color: #1D262F !important;
  margin: 10px;
  padding: 10px;
  position: relative;
  box-shadow: 2px 2px 2px black;
  border: 0px !important;
}

.custom-tab--selected {
  color: #2BFEBE !important;
  box-shadow: 1px 1px 0px black;
  border-top: 3px solid #2BFEBE !important;
}


#right-column {
  display: flex;
  flex-direction: column;
}

#wells {
  flex: 1;
}

#gas {
  flex: 1;
}

#aggregate_data {
  align-items: center;
}

#oil {
  flex: 1;
}

#water {
  flex: 1;
}

#tripleContainer {
  display: flex;
  flex: 3;
}

#mainContainer {
  display: flex;
  flex-direction: column;
}

#pie_graph>div>div>svg:nth-child(3)>g.infolayer>g.legend {
  pointer-events: all;
  transform: translate(30px, 349px);
}