/* Main Tab Items */

nav {
    justify-self: center;
}


#MainTab button.unlocker {
    border: 3px solid black;
    border-radius: 10px;
    margin-top: 40px;
    color: #fff;
    background-color: #555;
    max-width: 150px;
    font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
    cursor: pointer;
}
#MainTab button.unlocker:hover {
    background-color: #777;
}
#MainTab h1.unlockheader {
    margin-bottom: 5px;
}

#MainTab .grid1c2r {
    display: grid;
}

/* Prestige Tab Items */
#PresTab .prestigereset {
    display: inline-block;
    margin-top: 5px;
    padding: 10px 20px;
    text-decoration: none;
    border-radius: 6px;
    text-align: center;
    cursor: pointer;
    background-color: #aaee27;
    font-family: 'Times New Roman', Times, serif;
    max-width: 325px;
}

#MainPresTab .container {
    display: flex;
    gap: 5px;
}

/* Power Tab Items */
#PowPresTab button {
    display: inline-block;
    margin-top: 5px;
    text-decoration: none;
    border-radius: 6px;
    text-align: center;
    cursor: pointer;
    background-color: #99cc53;
    font-family: 'Times New Roman', Times, serif;
}
#powergain {
    padding: 10px 20px;
}

#PowPresTab .rebuyables {
    display: flex;
    justify-content: center;
}

#PowPresTab .rebuyable {
    background-color: #99cc53;
}
#PowPresTab .rebuyable:hover {
    background-color: #aaee75;
}

/* Booster Tab Items */
#BoostTab .boosterreset {
    display: inline-block;
    margin-top: 5px;
    padding: 10px 20px;
    text-decoration: none;
    border-radius: 6px;
    text-align: center;
    cursor: pointer;
    background-color: #230faa;
    font-family: 'Times New Roman', Times, serif;
    color: white;
}

/* Ascension Tab Items */
#AscTab .Ascensionreset {
    display: inline-block;
    margin-top: 5px;
    padding: 10px 20px;
    text-decoration: none;
    border-radius: 6px;
    text-align: center;
    cursor: pointer;
    background: radial-gradient(
        circle,
        transparent 60%,
        rgb(255, 191, 0) 100%
    ), 
    red;
    font-family: 'Times New Roman', Times, serif;
    max-width: 325px;
    position: relative;
}

#AscTab .AscRank {
    min-width: 250px;
    min-height: 250px;
    max-width: 250px;
    max-height: 250px;
    border: 5px solid black;
    border-radius: 30px;
    background: radial-gradient(
        circle,
        transparent 60%,
        rgb(255, 191, 0) 100%
    ), 
    red;
    position: relative;
    cursor: pointer;
    margin-top: 20px;
    text-align: center;
    word-wrap: break-word;
}
#AscRankTab {
    display: flex;
    justify-content: center;
}
#AscRankRewardTab {
    display: flex;
    flex-direction: row;
    justify-content: center;
    flex-wrap: wrap;
}
#AscRankRewardTab .AscRankRewardBox {
    max-width: 150px;
    max-height: 100px;
    min-height: 100px;
    min-width: 100px;
    border: 3px solid black;
    background: radial-gradient(
        circle,
        transparent 60%,
        rgb(255, 191, 0) 100%
    ), 
    red;
    position: relative;
}
#AscUpgTab .upgrades{
    display: flex;
    justify-content: center;
}
#AscBuyableTab {
    display: flex;
    justify-content: center;
}
#AscBuyableTab .rebuyable{
    background: radial-gradient(
        circle,
        transparent 60%,
        rgb(255, 191, 0) 100%
    ), 
    red;
    cursor: pointer;
}
#AscBuyableTab .rebuyable:hover{
    background: radial-gradient(
        circle,
        transparent 60%,
        rgb(255, 191, 100) 100%
    ), 
    #F44;
}
#AllocationTab .rebuyables{
    display: flex;
    justify-content: center;
}
#AllocationTab .rebuyable{
    background: radial-gradient(
        circle,
        transparent 60%,
        rgb(255, 191, 0) 100%
    ), 
    red;
}
#AllocationTab .rebuyable:hover{
    background: radial-gradient(
        circle,
        transparent 60%,
        rgb(255, 191, 100) 100%
    ), 
    #F44;
}
#AllocationTab .upgrades{
    display: flex;
    justify-content: center;
}
#AllocationTab .bought{
    min-width: 150px;
}
#AllocationTab .unbought{
    min-width: 150px;
}
#AllocationTab button{
    margin: 30px;
}

/* The Void Items */
.voidcolor{
    background: #550055;
    box-shadow: 0 0 5px 5px #110055;
}
#VoidTab .EnterVoid{
    margin-top: 15px;
    margin-bottom: 15px;
    background: #550055;
    box-shadow: 0 0 10px 2px #110055, 0 0 10px 5px #330055;

}
#VoidTab .EnterVoid:hover{
    background: #660066;
    box-shadow: 0 0 10px 3px #330055, 0 0 10px 6px #441144;
}
#VoidTab button{
    padding: 10px 20px;
    display: inline-block;
    margin-top: 5px;
    text-decoration: none;
    border-radius: 6px;
    text-align: center;
    cursor: pointer;
    font-family: 'Times New Roman', Times, serif;
}
#VoidTab .rebuyables{
    display: flex;
    gap: 10px;
    justify-content: center;
}
#VoidTab .rebuyable{
    background-color: #550055;
    box-shadow: 0 0 10px 2px #110055, 0 0 10px 5px #330055;
}
#VoidTab .rebuyable:hover{
    background: #660066;
    box-shadow: 0 0 10px 3px #330055, 0 0 10px 6px #441144;
}

/* Automation Tab Items */
#AutoTab .autogain {
    background-color: #333;
    color: white;
    min-width: 250px;
    border-radius: 6px;
}
#AutoTab .autogain:hover {
    background-color: #555;
    cursor: pointer;
}

#MainAutoTab .Automations {
    justify-content: center;
    display: flex;
    flex-wrap: wrap;
}
#MainAutoTab .Automation {
    min-width: 250px;
    max-width: 250px;
    border: 2px solid black;
    background-color: #333;
    color: white;
}

/* QOL Tab Items */

#QOLAutoTab .container {
    display: flex;
    gap: 5px;
    flex-wrap: wrap;
}
/* Settings Tab Items */
#SettingsTab .settings {
    margin-top: 50px;
}
#SettingsTab .resetcolor {
    background-color: red;
}