#buyableUpgrades {
    margin: 0 auto;
    display: flex;
    justify-content: center;
}
#singleUpgrades {
    margin: 0 auto;
    display: flex;
    justify-content: center;
}
#singleUpgrades2 {
  margin: 0 auto;
  display: flex;
  justify-content: center;
}
#maxBuyLine {
  margin: 0 auto;
  display: flex;
  justify-content: center;
}
.upgradeButton{
    border-style: solid;
    border-radius: 4px;
    background-color: black;
    color: rgb(255, 255, 255);
    font-size: calc(11px * var(--font-scale));
    width: 17.5vw;
    max-width: 210px;
    height: 110px;
    text-align: center;
    font-family: "Poly";
    transition:  0.25s ease-in-out;
    margin: 5px;
    cursor: pointer;
}

.maxBuy{
  height: 35px;
  width: 70px;
  text-align: center;
  border-color: white;
  border-style: solid;
  margin-right: 0px;
}
.maxBuy:hover{
  background-color:  rgb(34, 34, 34);
}
.upgradeButton:active:enabled {
    transform: scale(0.95); 
}
.upgradeButton:disabled{
    background-color: rgb(65, 65, 65) !important; 
}
.upgradeButton:disabled:hover{
    background-color: rgb(241, 103, 103)  !important;
    color: black  !important;
}
.buyableButton{
    background-color: #000000;
    border-color: var(--coin-upgrade);
    color: rgb(255, 255, 255);
}
.buyableButton:hover:enabled{
    background-color: var(--coin-upgrade);
    box-shadow: 0 0 10px var(--coin-upgrade);
    color: black;
}
.singleButton{
    background-color: #000000;
    border-color: var(--coin-upgrade);
    color: rgb(255, 255, 255);
}
.singleButton:hover:enabled{
    background-color: var(--coin-upgrade);
    box-shadow: 0 0 10px var(--coin-upgrade);
    color: black;
}
.singleButton.purchased {
    background-color: var(--coin-upgrade);
    color: black;
}
.coinUpgradeButton.superPurchased {
  background-color: var(--supercoin);
  color: black;
  border-color: var(--supercoin);
}
.coinUpgradeButton.superPurchasedBuyable {
  background-color: rgb(0, 0, 0);
  border-color: var(--supercoin);
}
.coinUpgradeButton.superPurchasedBuyable:hover:enabled, .coinUpgradeButton.superPurchased:hover:enabled  {
  background-color: var(--supercoin);
  color: rgb(0, 0, 0);
  box-shadow: 0 0 10px var(--supercoin);
}
.coinUpgradeButton.superPurchasedBuyable:hover:enabled super, .coinUpgradeButton.superPurchased:hover:enabled super, .coinUpgradeButton.superPurchased super {
  color: rgb(0, 0, 0);
}
.prestigeSingleButton{
  background-color: #000000;
  border-color: var(--prestige-upgrade);
  color: rgb(255, 255, 255);
}
.prestigeSingleButton:hover:enabled {
  background-color: var(--prestige-upgrade);
  box-shadow: 0 0 10px var(--prestige-upgrade);
  color: black;
}
.prestigeSingleButton.purchased {
  background-color: var(--prestige-upgrade);
  color: black;
}
.prestigeBuyableButton{
  background-color: #000000;
  border-color: var(--prestige-upgrade);
  color: rgb(255, 255, 255);
}
.prestigeBuyableButton:hover:enabled {
  background-color: var(--prestige-upgrade);
  box-shadow: 0 0 10px var(--prestige-upgrade);
  color: black;
}
.breakPrestigeSingleButton{
  background-color: #000000;
  border-color: var(--break-prestige-upgrade);
  color: rgb(255, 255, 255);
}
.breakPrestigeSingleButton:hover:enabled {
  background-color: var(--break-prestige-upgrade);
  box-shadow: 0 0 10px var(--break-prestige-upgrade);
  color: black;
}
.breakPrestigeSingleButton.purchased {
  background-color: var(--break-prestige-upgrade);
  color: black;
}
.breakPrestigeBuyableButton{
  background-color: #000000;
  border-color: var(--break-prestige-upgrade);
  color: rgb(255, 255, 255);
}
.breakPrestigeBuyableButton:hover:enabled {
  background-color: var(--break-prestige-upgrade);
  box-shadow: 0 0 10px var(--break-prestige-upgrade);
  color: black;
}

#harshUmulti {
  white-space: break-spaces;
  align-items: center;
  width: 175px;
  height: 40px;
}

#umultiplierBoost:disabled, #upowerBoost:disabled,  #uadderBoost:disabled, #ureducerBoost:disabled{
  border-color: rgb(90,90,90);
}

#uMultiDiv, #upowerDiv {
  display: flex;
  flex-direction: column;
}


#umultiplierBoost {
  border-color:var(--umultiplier);
}

#umultiplierBoost:hover:enabled{
  background-color: var(--umultiplier);
  box-shadow: 0 0 10px var(--umultiplier);
  color: black;
}

#upowerBoost {
  border-color:var(--upower);
}

#upowerBoost:hover:enabled{
  background-color: var(--upower);
  box-shadow: 0 0 10px var(--upower);
  color: black;
}

#uadderBoost {
  border-color:var(--uadder);
}

#uadderBoost:hover:enabled{
  background-color: var(--uadder);
  box-shadow: 0 0 10px var(--uadder);
  color: black;
}

#ureducerBoost {
  border-color:var(--ureducer);
}

#ureducerBoost:hover:enabled{
  background-color: var(--ureducer);
  box-shadow: 0 0 10px var(--ureducer);
  color: black;
}

.shardBuyableButton {
  border-color: var(--shard);
}

.shardBuyableButton:hover:enabled {
  background-color: var(--shard);
  box-shadow: 0 0 10px var(--shard);
  color: black;
}

.shardSingleButton {
  border-color: var(--shard);
}

.shardSingleButton:hover:enabled {
  background-color: var(--shard);
  box-shadow: 0 0 10px var(--shard);
  color: black;
}

.shardSingleButton.purchased {
  background-color: var(--shard);
  color: black;
}

.pinkButton {
  background-color: rgb(191, 34, 99);
  color: white;
  border-color: rgb(163, 27, 81);
  width: 150px;
  height: 75px;
}

.pinkButton:hover {
  box-shadow: 0 0 10px rgb(191, 34, 99);
}

.greenButton {
  background-color: rgb(32, 178, 29);
  color: white;
  border-color: rgb(38, 192, 35);
  width: 150px;
  height: 75px;
}

.greenButton:hover {
  box-shadow: 0 0 10px rgb(32, 178, 29);
}

.blueButton {
  background-color: rgb(34, 116, 183);
  color: white;
  border-color: rgb(30, 122, 197);
  width: 150px;
  height: 75px;
}

.blueButton:hover {
  box-shadow: 0 0 10px rgb(34, 116, 183);
}

.greyButton {
  background-color: rgb(82, 82, 82);
  color: white;
  border-color: rgb(75, 75, 75);
  width: 380px;
  height: 50px;
}

.greyButton:hover {
  box-shadow: 0 0 10px rgb(82, 82, 82);
}

.superCrystalUpgradeButton {
  background-color: #000000;
  border-color: var(--supercrystal);
  color: rgb(255, 255, 255);
}

.superCrystalUpgradeButton:hover:enabled{
  background-color: var(--supercrystal);
  box-shadow: 0 0 10px var(--supercrystal);
  color: black;
}
.superCrystalUpgradeButton.purchased {
  background-color: var(--supercrystal);
  color: black;
}

.fortuneBuyableButton {
  border-color: var(--fortune);
}

.fortuneBuyableButton:hover:enabled {
  background-color: var(--fortune);
  box-shadow: 0 0 10px var(--fortune);
  color: black;
}

.fortuneSingleButton {
  border-color: var(--fortune);
}

.fortuneSingleButton:hover:enabled {
  background-color: var(--fortune);
  box-shadow: 0 0 10px var(--fortune);
  color: black;
}

.fortuneSingleButton.purchased {
  background-color: var(--fortune);
  color: black;
}

.balanceBuyableButton {
  border-color: var(--balance);
}

.balanceBuyableButton:hover:enabled {
  background-color: var(--balance);
  box-shadow: 0 0 10px var(--balance);
  color: black;
}

.balanceSingleButton {
  border-color: var(--balance);
}

.balanceSingleButton:hover:enabled {
  background-color: var(--balance);
  box-shadow: 0 0 10px var(--balance);
  color: black;
}

.balanceSingleButton.purchased {
  background-color: var(--balance);
  color: black;
}