insanitarium one page

<!--
colors:
text: #b80000
bg: black
text shadow: #000
header: white
-->

<div class="col-md-4 col-sm-12 mx-auto">

    <div class="collapse active show" id="collapse1" aria-expanded="true">
    <a href="#collapse1" data-toggle="collapse" aria-expanded="true" aria-controls="collapse1" style="cursor:pointer;">
        <!-- pagedoll. change https://64.media.tumblr.com/f808aaa1c3baae59a0900bf55e39b00e/b7e95b745706ae77-90/s400x600/aef98e6e2032b33b6d2a9b72d46bedc5276761e2.png to make it your oc-->
    <img src="https://64.media.tumblr.com/f808aaa1c3baae59a0900bf55e39b00e/b7e95b745706ae77-90/s400x600/aef98e6e2032b33b6d2a9b72d46bedc5276761e2.png" style="max-width: 45%; position: absolute; z-index:3; right: -50px; top: 45px">
    </a>
    </div>

    <div class="col-12" style="font-size: 35px; font-family: Georgia; color: white; text-shadow:  1px 1px 0 #000, -1px -1px 0 #000, -1px 1px 0 #000, 1px -1px 0 #000; margin-bottom: -20px; z-index: 1">

        <!-- your name -->
        <p style="margin: 0px; text-align: center">SWEETYPUSS</p>
    </div>

    <!-- background image. change https://ih1.redbubble.net/image.1444956834.5287/flat,750x1000,075,f.jpg to your image. -->
    <div class="col-12 p-1" style="background-image: url(https://ih1.redbubble.net/image.1444956834.5287/flat,750x1000,075,f.jpg); background-size: cover">

        <div class="col-12 mt-2 p-2" style="background-color: black; border: #b80000 solid 1px; color: #b80000; font-style: italic; text-align: center; font-size: 12px">


            <!-- pretty standard just your age pronouns and timezone -->
            <p style="font-style: normal; font-weight: 700; font-size: 15px">pronouns ・ age ・ timezone</p>

            <!-- just a little bioooo. lyrics from intimate with the firebird -->
            <div class="overflow-auto" style="max-height: 100px">
            i'd rather sift through matter / matters not when broken up like / shards of glass fall through side and / melted down and becoming
            i'd rather sift through matter / matters not when broken up like / shards of glass fall through side and / melted down and becoming
            i'd rather sift through matter / matters not when broken up like / shards of glass fall through side and / melted down and becoming
            </div>

            <!-- just a bunch of socials. you can change the icon by going to fontawesome.com -->

            <div class="justify-content-between p-1 mt-2" style="font-size: 20px; font-style: normal;">

                <!-- twitter -->
                <a href="#twitter" style="color: inherit"><i class="fab fa-twitter m-0"></i></a>
                ・
                <!-- instant gram -->
                <a href="#insta" style="color: inherit"><i class="fab fa-instagram"></i></a>
               ・
               <!-- deviantart -->
                <a href="#dA" style="color: inherit"><i class="fab fa-deviantart"></i></a>
               ・
               <!-- tumble er -->
                <a href="#tumblr" style="color: inherit"><i class="fab fa-tumblr"></i></a>
               ・
               <!-- carrd. if you wanna replace this with a brand you have to change the fas to fab lmfao -->
                <a href="#carrd" style="color: inherit"><i class="fas fa-id-card"></i></a>

            </div>
        </div>
    </div>

    <!-- code end -->

    <div class="justify-content-end" style="color: red;">
        <a href="/micro-wave" style="color: inherit;"><i class="fal fa-microwave"></i></a>
    </div>
</div>