/*
            ██╗░░░██╗░██╗░░░░░░░██╗██╗░░░██╗
            ██║░░░██║░██║░░██╗░░██║██║░░░██║
            ██║░░░██║░╚██╗████╗██╔╝██║░░░██║
            ██║░░░██║░░████╔═████║░██║░░░██║
            ╚██████╔╝░░╚██╔╝░╚██╔╝░╚██████╔╝
            ░╚═════╝░░░░╚═╝░░░╚═╝░░░╚═════╝░
        ░█████╗░██╗░░░██╗████████╗██╗███████╗░██████╗
        ██╔══██╗██║░░░██║╚══██╔══╝██║██╔════╝██╔════╝
        ██║░░╚═╝██║░░░██║░░░██║░░░██║█████╗░░╚█████╗░
        ██║░░██╗██║░░░██║░░░██║░░░██║██╔══╝░░░╚═══██╗
        ╚█████╔╝╚██████╔╝░░░██║░░░██║███████╗██████╔╝
        ░╚════╝░░╚═════╝░░░░╚═╝░░░╚═╝╚══════╝╚═════╝░
*/

@font-face {
    font-family: Terminus;
    src: url('https://jirachi6774.com/Assets/Fonts/Terminus\ OneShot.ttf');
}

html {
    color: #EEEEEE;
    background-color: #2B2A33;
    font-family: Terminus;
}

.header {
    font-size: 40px;
    text-align: center;
    user-select: none;
}

.header-2 {
    font-size: 30px;
    text-align: center;
    user-select: none;
}

.help-text {
    text-align: center;
    margin: 0px;
    font-style: italic;
}

.header-text {
    font-size: 20px;
    text-align: center;
}

.header-text::selection {
    background-color: #EEEEEE;
    color: #2B2A33;
}

.jirachi {
    color: #F9E579;
    text-decoration: none;
    transition: 0.5s;
}

.jirachi:hover {
    text-shadow: 0px 0px 3px #F9E579;
}

.jirachi::selection {
    background-color: #F9E579;
    color: #2B2A33;
}

.select {
    user-select: none;
}

/* Box Code */
.PET-flex {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    padding-left: 10px;
    padding-right: 10px;
}

.PET-figure {
    margin: 2px;
    text-align: center;
    font-size: 25px;
    box-shadow: 0 0 9px black;
    padding: 5px;
    border-radius: 5px;
    width: 100%;
    max-width: 450px;
    height: 320px;
    overflow: scroll;
    -webkit-user-select: none;
    user-select: none;
    background-color: #313338;
}

.scroll-box {
    scroll-behavior: smooth;
}

/* Width */
::-webkit-scrollbar {
    width: 10px;
}

::-webkit-scrollbar-corner {
    background: rgba(255, 255, 255, 0);
}

.PET-link {
    transition: 0.5s;
}

.PET-link:hover {
    cursor: pointer;
    text-shadow: 0px 0px 3px currentColor;
}

/* Tiers */
#gold {
    color: #E5B80B;
}

#silver {
    color: #C3C7C7;
}

#bronze {
    color: #C5832B;
}
/* End of Tiers */

.footer {
    text-align: center;
    font-size: 22px;
    user-select: none;
}

.footer-text {
    text-align: center;
    font-size: 18px;
}

.footer-arrow {
    color: #F15454;
    text-shadow: 0px 0px 5px #F15454;
    font-weight: bolder;
    font-size: 25px;
    user-select: none;
    animation: RedArrow infinite 0.8s;
}

@keyframes RedArrow {
    50% {color: #EEEEEE;}
    50% {text-shadow: #EEEEEE;}
}

.footer-link {
    color: #9dffec;
    transition: 0.5s;
}

.footer-link:hover {
    text-shadow: 0px 0px 3px #9dffec;
    cursor: pointer;
}

.no-rank {
    user-select: none;
}