body, html {
  font-size: 13px;
  font-family: sans-serif;
}
body {
  margin: 0px;
  padding: 0px;
  background-color: #fff;
}
a { text-decoration: none; }
#topBar, #pageBody, #footer {
  max-width: 1000px;
  margin: auto;
}
#topBar { background-color: #e0e0e0; border-radius: 0px 0px 5px 5px; }
#topBar .main { padding-left: 10px; font-size: 1.5rem; font-weight: bold; }
#topBar .main a { color: #000; }
#topBar div { line-height: 50px; vertical-align: middle; }
#topBar ul.box {
  list-style-type: none;
  padding: 0px;
  margin: 0px;
  text-align: right;
  display: flex;
}
#topBar ul.box li {
  padding: 0px 5px;
}
#pageBody .navbar {
  background-color: #B55B36;
  border-radius: 5px 5px 0 0;
  color: #fff;
}
#pageBody .navbar a {
  color: #fff;
}
#pageBody .navbar .navbar-brand {
  font-size: 1rem;
  font-weight: bold;
  padding-left: 10px;
}
#pageBody .input_prev {
  background-color: #e0e0e0;
  border: 1px solid #c0c0c0;
  padding: 3px;
}
#rawDataBox {
  overflow: auto; max-height: 100px;
  font-size: .8rem;
}
.viewPort {
  margin-bottom: 2px;
  overflow: auto;
  max-height: 600px;
}
.viewPort .title {
  font-weight: bold;
  text-align: center;
  display: block;
  width: 100%;
  padding: 5px;
}
.viewPort .maintitle {
  background-color: #5a5a5a;
  color: #fff;
  font-size: .9rem;
}
.viewPort .subtitle {
  background-color: #c0c0c0;
  font-size: .8rem;
}
.viewPort div.pokemon {
  font-size: .8rem;
  margin-bottom: 5px;
}
.viewPort div.pokemon img { max-width: 100%; }
.viewPort div.pokemon .name { font-weight: bold; }
.viewPort div.cat {
  padding: 5px;
  justify-content: space-around;
  display: flex;
  flex-wrap: wrap;
  margin-bottom: 10px;
  background-color: #e0e0e0;
  border: 1px solid #5a5a5a;
  border-radius: 0px 0px 5px 5px;
}
/* sprite view */
.view-sprites div.pokemon {
  text-align: center;
  width: 135px;
  font-size: .8rem;
}
/* icon view */
.view-icons div.pokemon {
  width: 33%;
  display:flex;
  vertical-align: middle;
  line-height: 40px;
}
.view-icons div.pokemon img { width: 45px; border: 1px solid #e0e0e0; }
.view-icons div.pokemon .name { padding-left: 10px; }
.view-icons div.pokemon .level { padding-left: 10px; }
.box-tooltip {
  --bs-tooltip-bg: red;
  --bs-tooltip-color: var(--bs-white);
}
.hidden {
  display: none;
}