*
{
    padding: 0;
    margin: 0;
    font-family: 'Segoe UI', sans-serif;
}
body
{
    animation: 3s cubic-bezier(0.075, 0.82, 0.165, 1) inbody;
}
h1
{
    font-size: 4vh;
    min-width: 100%;
    display: flex;
    justify-content: center;
}
h3
{
    padding: 0.5vh;
    font-size: 1.8vh;
}
h5
{
    font-size: 2vh;
}
button
{
    display: flex;
    align-items: center;
    justify-content: center;
    height: 15vh;
    width: 15vh;
    border: none;
    border-radius: 1vh;
    transition: cubic-bezier(0.075, 0.82, 0.165, 1) 0.25s;
}
button img
{
    height: 14.5vh;
    transition: cubic-bezier(0.075, 0.82, 0.165, 1) 0.25s;
}
button:hover
{
    transition: cubic-bezier(0.075, 0.82, 0.165, 1) 0.25s;
    width: 16vh;
    height: 16vh;
}
button:active
{
    transition: cubic-bezier(0.075, 0.82, 0.165, 1) 0.25s;
    width: 14vh;
    height: 14vh;
}
button:active img
{
    height: 13.5vh;
    transition: cubic-bezier(0.075, 0.82, 0.165, 1) 0.25s;
}
.section
{
    color: white;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    min-width: 100%;
    max-height: 100%;
}
.section2
{
    min-width: 100%;
    color: white;
    display: flex;
    justify-content: center;
    text-align: center;
}
.sectionneco
{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    min-height: 20vh;
}
.textarea
{
    min-width: 100%;
    height: 15vh;
    display: flex;
    flex-direction: column;
    align-items: center;
}
.clicker
{
    min-height: 80vh;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.volslider
{
    color: white;
    min-width: 100%;
    min-height: 5vh;
    display: flex;
    align-items: center;
    justify-content: center;
}
.tier1
{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
}
.tier2
{
    display: none;
    justify-content: center;
    align-items: center;
    flex-direction: row;
}
.shopbutton
{
    height: 6vh;
    display: flex;
    align-items: center;
}
.shopbutton button
{
    
    width: 15vh;
    height: 4vh;
}
.shopbutton button:hover
{
    font-size: 2vh;
    width: 15.5vh;
    height: 4.5vh;
}
.shopbutton button:active
{
    font-size: 1.25vh;
    width: 14vh;
    height: 3.5vh;
}
.shop
{
    color: white;
    min-height: 25vh;
    min-width: 100%;
    display: none;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    text-align: center;
}
.shop h1
{
    flex-direction: row;
}
.shop .item
{
    padding: 1vh;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    min-height: 15vh;
    min-width: auto;
}
.shop button
{
    display: flex;
    align-items: center;
    justify-content: center;
    height: 10vh;
    width: 10vh;
    border: none;
    border-radius: 1vh;
    transition: cubic-bezier(0.075, 0.82, 0.165, 1) 0.25s;
}
.shop button img
{
    height: 9vh;
    transition: cubic-bezier(0.075, 0.82, 0.165, 1) 0.25s;
}
.shop button:hover
{
    transition: cubic-bezier(0.075, 0.82, 0.165, 1) 0.25s;
    width: 11vh;
    height: 11vh;
}
.shop button:hover img
{
    transition: cubic-bezier(0.075, 0.82, 0.165, 1) 0.25s;
    height: 10.5vh;
}
.shop button:active
{
    transition: cubic-bezier(0.075, 0.82, 0.165, 1) 0.25s;
    width: 9vh;
    height: 9vh;
}
.shop button:active img
{
    height: 8vh;
    transition: cubic-bezier(0.075, 0.82, 0.165, 1) 0.25s;
}
.shop h4
{
    font-size: 1.5vh;
    padding: 0.5vh;
}
.shop .status
{
    height: 5vh;
}
.button button 
{
    display: none;
    font-size: 1.5vh;
    height: 6vh;
}
.button button:hover
{
    font-size: 2vh;
    width: 11vh;
    height: 7vh;
}
.button button:active
{
    font-size: 1.25vh;
    width: 9vh;
    height: 5vh;
}
.arrows
{
    align-items: center;
    justify-content: center;
    display: flex;
    width: 50%;
    height: 4vh;
}
.arrows button
{
    
    margin: 1vh;
    width: 3vh;
    height: 3vh;
}
.arrows button:hover
{
    width: 4vh;
    height: 4vh;
}
.arrows button:active
{
    width: 3.5vh;
    height: 3.5vh;
}
@keyframes inbody {
    0% {opacity: 0;}
    100% {opacity: 1;}
}
@keyframes in {
    0% {opacity: 0; font-size: 0;}
    100% {opacity: 1; font-size: normal;}
}
@keyframes out {
    0% {opacity: 1; font-size: normal;}
    100% {opacity: 0; font-size: 0;}
}
@keyframes blingkeys {
    0% {background-color: black;}
    10% {background-color: white;}
    100% {background-color: black;}
}
@keyframes blingkeys1 {
    0% {background-color: black;}
    10% {background-color: rgb(217, 255, 0);}
    100% {background-color: black;}
}
@keyframes shopopen {
    0% {transform: scale(0); height: 0vh; min-width: 0;}
    100% {transform: scale(1); height: 25vh; min-width: 100%;}
}
@keyframes shopclose {
    0% {transform: scale(1); height: 25vh;}
    100% {transform: scale(0); height: 0vh;}
}
@keyframes buttonappear {
    0% {transform: scale(0);}
    100% {transform: scale(1);}
}
@keyframes buttondissapear {
    0% {transform: scale(1);}
    100% {transform: scale(0);}
}
@keyframes tieranim1 {
    0% {transform: translateX(0vh); opacity: 1;}
    100% {transform: translateX(-125vh); opacity: 0;}
}
@keyframes tieranim2 {
    0% {transform: translateX(-125vh); opacity: 0;}
    100% {transform: translateX(0vh); opacity: 1;}
}
@keyframes itemiconscale {
    0% {height: 10vh;}
    25% {height: 16vh;}
    75% {height: 16vh;}
    100% {height: 10vh;}
}