body {
  background-color:black;
  font-family: Arial, Helvetica, sans-serif;
}

.page {
  background-color:white;
  max-width:600px;
  margin:auto;
  padding-top:5px;
}

/* Title Box */

.title {
  background: linear-gradient(to right,#FAA634, #ED2F81);
  border-radius: 0px 10px 10px 0px;
  padding:1px;
  padding-left:10px;
  margin:5px;
  color:white;
  font-size:large;
  font-weight: bold;
  text-transform: uppercase;
  display: flex;
  justify-content:space-between;
  align-items:center;
}

.mookbox, .bossbox, .megabossbox {
  border-radius: 7px 0px 0px 7px;
  max-width:100px;
  padding:1px;
  padding-left:5px;
  padding-right:5px;
  margin:5px;
  margin-left:1px;
  color: white;
  font-size:medium;
}

.mookbox {
  background-color: #8CC63E;
}

.bossbox {
  background-color: #FAA634;
}

.megabossbox {
  background-color: #ED2A7B;
}

.rankbox {
  background-color:white;
  border-radius: 10px 10px 10px 10px;
  max-width:200px;
  padding:3px;
  padding-right:5px;
  margin:5px;
  color: #2A388F;
  font-size:medium;
  
}

.content {
  margin:5px;
  padding-bottom:5px;
}

.boxes {
  display:flex;
  justify-content:space-between;
  padding-top:5px;
  padding-bottom:5px;
}

/* Info Boxes */

.infobox {
  padding:5px;
}

.infoboxtitle {
  background-color:#575354;
  padding:5px;
  color:white;
  font-size:small;
  font-weight:bold;
  text-transform: uppercase;
  text-align:
}

/* Combat Values */

.combatvalues {
  padding:10px;
  text-align:center;
  font-size:small;
  text-transform: uppercase;
}

.combatvalues th {
  font-weight:normal;
  border-bottom:2px solid lightgrey;
  padding-bottom:10px;
}

.combatvalues td {
  padding-top:10px;
}

.seperator {
  background-color: lightgrey;
}

.fa-heart {
  color:red;
}

/* Aptitudes / Traits */

.stats {
  padding-left:10px;
  padding-right:10px;
}

.stat_num {
  font-weight:bold;
  text-align:right;
}

.stat_name {
  font-size:small;
  text-transform: uppercase;
}

.prog {
  background-color: lightgrey;
  height:20px;
  width:100px;
}

.red {
  background: linear-gradient(to right,#F9735D,#F54339);
}

.orange {
  background: linear-gradient(to right,#FCA134,#F97738);
}

.green {
  background: linear-gradient(to right,#94CD5A,#37BD61);
}

.blue {
  background: linear-gradient(to right,#14B4E3,#0087C5);
}

.purple {
  background: linear-gradient(to right,#9470B2,#9470B2);
}

.traits {
  color:grey;
  font-size:small;
  text-align:center;
}

/* Adversary Info */

.advinfo th {
  font-weight:normal;
  font-size:small;
  text-transform: uppercase;
  text-align:left;
  padding-bottom:10px;
  border-bottom:1px solid lightgrey;
}

.advinfo td {
  font-size:small;
  text-align:left;
  padding-bottom:10px;
  border-bottom:1px solid lightgrey;
  text-transform: capitalize;
}

/* Abilities & more */

.columns {
  display:flex;
  justify-content:space-between;
}

.column {
  flex-grow:1;
  max-width:300px;
}

.ability-title {
  background: linear-gradient(to right,#FAA634, #ED2F81);
  border-radius: 0px 10px 10px 0px;
  padding:5px;
  padding-left:10px;
  margin:5px;
  color:white;
  font-size:large;
  font-weight: bold;
  text-transform: uppercase;
  display: flex;
  justify-content:space-between;
  align-items:center;
}

.ability-subtitle {
  background: linear-gradient(to right,#FDECD5, #FBD4E5);
  border-radius: 0px 10px 10px 0px;
  padding:5px;
  padding-left:10px;
  margin:5px;
  color:#F47923;
  font-size:normal;
  font-weight: bold;
  text-transform: uppercase;
  display: flex;
  justify-content:space-between;
  align-items:center;
}

.ability-content {
  background-color:#F0F1F1;
  border-radius: 0px 10px 10px 0px;
  margin:5px;
  padding:5px;
  padding-bottom:10px;
}

.tabbed {
  padding-left:15px;
}

.fa-caret-right, .fa-square-caret-right {
  padding-top:10px;
  color:#F47923;
}

.fa-circle-question {
  color: #3E43A1;
}

.fa-circle-check {
  color: #81B03D;
}

.fa-circle-xmark {
  color:#F73830;
}

a {
  color: #3E43A1;
}