<link href="https://dl.dropbox.com/scl/fi/r95tc7qqq0ow9n61hsfak/catch-them-all.css?rlkey=js056kb444ny512qvy208xzb4&st=ngem1vxp&dl=0"
    rel="stylesheet" />

<style>
    #pk {
        --primeColor: #893029;
        --secondColor: #9b3039;
        --primeColorOP: rgb(137, 48, 41, 0.8);

        --image: url(https://static.zerochan.net/Red.%28Pok%C3%A9mon%29.full.444952.jpg);
        --gif: url(https://www.want.nl/wp-content/uploads/2019/05/source-1.gif);

        --pokemonOne: url(https://66.media.tumblr.com/tumblr_ma4fsg8aDZ1rfjowdo1_500.gif);
        --pokemonTwo: url(https://i.gifer.com/4bXB.gif);
        --pokemonThree: url(https://i.ya-webdesign.com/images/arcanine-transparent-sprite-pokemon-1.gif);
        --pokemonFour: url(https://media.giphy.com/media/BbdLoi2hBmBmo/200w.gif);
        --pokemonFive: url(https://pa1.narvii.com/6467/1df509cbcdf354ea6cd3c2bcfdfdfb3b6ebf0d38_hq.gif);
        --pokemonSix: url(https://media.giphy.com/media/os6IDNCnXY3gA/giphy.gif);

        --polygon: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%);
        --font: "Lato", sans-serif;
        --titleFont: "Gruppo", cursive;
    }
</style>

<div id="pk" class="postPBack">
    <div class="pkImg">
        <div class="pkGif"></div>
        <a href="https://www.mytinyiglu.com/forum/Ice%20Bear" title="template by: Ice Bear" class="pkCred">
        </a>
    </div>

    <div class="pkMenu">
        <label for="general"> general </label>
        <label for="story"> story </label>
        <label for="personality">personality </label>
        <label for="team"> team </label>

        <div class="pkCover"></div>
        <div class="pkCover" style="left: 0px"></div>
    </div>

    <input type="radio" id="general" name="menu" checked />
    <div class="pkBox pkGeneral">
        <div class="pkQs">Full Name</div>
        <div class="pkPostAns">Red</div>

        <div class="pkQs">Date of Birth</div>
        <div class="pkPostAns">08.01.1993 (23y)</div>

        <div class="pkQs">Region</div>
        <div class="pkPostAns">Kanto</div>

        <div class="pkQs">occupation</div>
        <div class="pkPostAns">Pokemon Trainer</div>
    </div>

    <input type="radio" id="story" name="menu" />
    <div class="pkBox pkstory">
        <h1>story</h1>
        Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod
        tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
        quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
        consequat.
        <p>
            Duis aute irure dolor in reprehenderit in voluptate velit esse cillum
            dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
            proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
        </p>

        <div class="pkTCover"></div>
        <div class="pkTCover" style="top: 0px"></div>
    </div>

    <input type="radio" id="personality" name="menu" />
    <div class="pkBox pkPersonality">
        <h1>personality</h1>
        Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod
        tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
        quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
        consequat.
        <p>
            Duis aute irure dolor in reprehenderit in voluptate velit esse cillum
            dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
            proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
        </p>
    </div>

    <input type="radio" id="team" name="menu" />
    <div class="pkBox pkTeam">
        <div class="pkDisplay">
            <input type="radio" id="poke1" name="poke1" checked />
            <label for="poke1" title="Charizard"> </label>

            <input type="radio" id="poke2" name="poke1" />
            <label for="poke2" title="Pikachu"> </label>

            <input type="radio" id="poke3" name="poke1" />
            <label for="poke3" title="Arcanine"> </label>

            <input type="radio" id="poke4" name="poke1" />
            <label for="poke4" title="Umbreon"> </label>

            <input type="radio" id="poke5" name="poke1" />
            <label for="poke5" title="Lapras"> </label>

            <input type="radio" id="poke6" name="poke1" />
            <label for="poke6" title="Dragonite"> </label>

            <div class="pkNames PI1">Charizard</div>
            <div class="PkPokLv PI1">Level 55</div>
            <div class="pkPokemon PK1"></div>

            <div class="pkNames PI2">Pikachu</div>
            <div class="PkPokLv PI2">Level 55</div>
            <div class="pkPokemon PK2"></div>

            <div class="pkNames PI3">Arcanine</div>
            <div class="PkPokLv PI3">Level 60</div>
            <div class="pkPokemon PK3"></div>

            <div class="pkNames PI4">Umbreon</div>
            <div class="PkPokLv PI4">Level 40</div>
            <div class="pkPokemon PK4"></div>

            <div class="pkNames PI5">Lapras</div>
            <div class="PkPokLv PI5">Level 40</div>
            <div class="pkPokemon PK5"></div>

            <div class="pkNames PI6">Dragonite</div>
            <div class="PkPokLv PI6">Level 50</div>
            <div class="pkPokemon PK6"></div>
        </div>
    </div>
</div>