.gil-usd {
  color: darkseagreen;
}
.fhtn-usd {
  color: lightseagreen;
}
.usd-thb {
  color: seagreen;
}
.price-box {
  background: black;
  margin: auto;
  font-size: 0.95rem;
  padding: 0.2em 2em;
}

.red {
  color: maroon;
}
.green {
  color: green;
}

.common {
  background: #efefef;
}
.uncommon {
  background: #a6f2c3;
}
.rare {
  background: #c0eaff;
}
.legendary {
  background: #ffedd6;
}
.mythical {
  background: #e9d7ff;
}
.immortal {
  background: #fff3ae;
}

.tg {
  border-collapse: collapse;
  border-color: #ccc;
  border-spacing: 0;
}
.tg td {
  border-color: #ccc;
  border-style: solid;
  border-width: 1px;
  color: #333;
  font-family: Arial, sans-serif;
  font-size: 14px;
  overflow: hidden;
  padding: 0px 5px;
  word-break: normal;
}
.tg th {
  background-color: #f0f0f0;
  border-color: #ccc;
  border-style: solid;
  border-width: 1px;
  color: #333;
  font-family: Arial, sans-serif;
  font-size: 14px;
  font-weight: normal;
  overflow: hidden;
  padding: 10px 5px;
  word-break: normal;
}
.tg .tg-1wig {
  font-weight: bold;
  text-align: left;
  vertical-align: top;
}
.tg .tg-7q3x {
  font-family: Arial, Helvetica, sans-serif !important;
  font-weight: bold;
  text-align: left;
  vertical-align: top;
}
.tg .tg-0lax {
  text-align: left;
  vertical-align: top;
}
#idata tr:hover {
  outline: 2px solid black;
}
/* Sortable tables */
table.sortable thead {
  background-color: #eee;
  color: #666666;
  font-weight: bold;
  cursor: pointer;
}

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

.grid-container {
  display: grid;
  grid-template-areas: 'main main right';
  grid-gap: 1em;
}

.grid-main {
  grid-area: main;
}

.grid-right {
  grid-area: right;
}

.me-container {
  margin: 2rem 2rem;
}

#address {
  width: 100%;
  padding: .5em;
  border-radius: 0.5em;
}

.me-rods { 
  border: 1px solid black;
  border-radius: .5em;
}

.me_rod {
  display: flex;
  justify-content: space-between;
  padding: .1rem 1rem;
  margin: .2rem 0;
}
.me_rod.red {
  background: lightgoldenrodyellow;
}

.summary-container {
  padding: .2rem 1rem;
}

.fish-prices { 
  border: 1px solid black;
  border-radius: .5em;
}

.fish-price {
  display: flex;
  justify-content: space-between;
  padding: .1rem 1rem;
  margin: .2rem 0;
}