Profile
https://pastebin.com/7QKqMZrr
<!--
hi, sorry if this code is chaotic, i wrote it mainly for myself and i'm not a html pro.
anyway, thank you for using it.
DO NOT remove the credit, please - unless you edit it
to the point where it's not recognizable.
feel free to frankenstein, use, edit, etc.
this doesn't use bootstrap because i hate it with a burning passion <3
colors (use ctrl+f for replacing them)
#252222 - bg
#1e1d1d - divider
#ec5c87 - accent
#5c5454 - past name text
#e5d2d8 - text
#2e2c2c - border
-->
<br>
<div>
<div style="display:flex;
justify-content: center;
filter: drop-shadow(1px 1px 3px black);">
<div style="
width: 200px;
height: 200px;
background: url('https://f2.toyhou.se/file/f2-toyhou-se/images/54117103_cz48nVGyXnwpcIK.png'); background-size: 120%; background-position: -30px -20px">
</div>
<div style="width:400px; height:200px; background: #252222; border: 1px solid #2e2c2c">
<span style="
color: #ec5c87;
font-family: times new roman;
letter-spacing: 8px;
font-size: 50px;
margin-left:20px;
position: fixed;
bottom :150px;"><b>eclipsed</b>sun</span><br>
<span style="margin-left:230px; margin-right:20px; font-size: 15px; font-family: times new roman; position: fixed; top: 39px; color: #5c5454">eclipsekit -> eclipsedpaw</span>
<hr>
<div style="color: #e5d2d8;margin-left:20px; margin-right:20px; font-size: 12px; font-family: ms gothic; display: inline-flex;">
<div> <b>name</b><br>
<b>rank</b><br>
<b>clan</b><br>
<b>age</b><br>
<b>mother</b><br>
<b>father</b><br></div>
<div style="min-width: 15px"></div>
<div> eclipsedsun<br>
deputy<br>
thunderclan<br>
40 moons<br>
wildrose<br>
not real<3<br> </div>
<div style="min-width: 15px"></div>
<div style="text-align: justify">
eclipsedsun is a deputy of thunderclan and a daughter of a warrior named wildrose.
she's very ambitious and can seem hard to talk to... she's a bit awkward, too.</div>
</div>
</div>
</div>
<div style="
width: 600px;
height: auto;
margin: auto;">
<div style="filter: drop-shadow(1px 1px 3px black);border-left: 1px solid #2e2c2c;border-right: 1px solid #2e2c2c;background-color: #1e1d1d; height:40px; width:100%;">
<span style="font-family: ms gothic; font-size: 12px; margin-top: 10px; position: fixed; margin-left: 30px; color: #e5d2d8">" this a place for a quote! not too long plez "</span>
</div>
<div style="
width: 600px;
height: auto;
margin: auto;">
<div style="filter: drop-shadow(1px 1px 3px black);border-left: 1px solid #2e2c2c;border-right: 1px solid #2e2c2c;background-color: #252222; height:185px; width:100%;">
<span style="font-weight: 600;font-family: TIMES NEW ROMAN; font-size: 20px; margin-top: 10px; position: fixed; margin-left: 35px; color: #ec5c87">information</span>
<div style="font-family: ms gothic; font-size: 12px; margin-left: 30px; margin-right: 30px; color: #e5d2d8; text-align: justify; position: relative; top: 38px; ">hello! this is a place
where you can talk more about your character. what's their personality? how are they seen
by their clanmates? how did they get their rank, or name? are they satisfied with their life
right now? do they have many friends? maybe they're crushing on someone? what was their
relationship with their parents and mentor? this box doesn't scroll, so don't sweat it too much,
but if you have a lot of lore to share, you'll get a good, scrollable box for that down below!
you can also use that box here for design notes. whatever you want ngl.... </div>
</div>
<div style="background-image: url('https://f2.toyhou.se/file/f2-toyhou-se/images/54116792_nSoHyRqs9MCSKYx.png'); width: 100%; height: 200px; background-size: 100%; background-position: -1px -40px"></div>
<div style="filter: drop-shadow(1px 1px 3px black);border-left: 1px solid #2e2c2c;border-right: 1px solid #2e2c2c;background-color: #252222; height:385px; width:100%;">
<span style="font-weight: 600;font-family: TIMES NEW ROMAN; font-size: 20px; margin-top: 10px; position: fixed; margin-left: 35px; color: #ec5c87">lore</span>
<div style="font-family: ms gothic; font-size: 12px; margin-left: 30px; margin-right: 30px; color: #e5d2d8; text-align: justify; position: relative; top: 38px; overflow-y: scroll; height: 315px;">
this is a place for all your infodumping needs. it scrolls!
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas viverra sodales dictum. Duis nec maximus leo. Pellentesque accumsan elementum enim, vitae dignissim nulla ullamcorper eu. Phasellus cursus ut lorem varius porta. Aenean et feugiat sem. Nullam molestie metus quis enim convallis, et dapibus urna ullamcorper. Morbi faucibus, massa eu condimentum malesuada, turpis nibh vehicula urna, ac semper urna enim sit amet dui.
Praesent cursus metus nibh, sit amet rhoncus ex interdum at. Morbi vehicula erat ipsum, vel varius enim feugiat convallis. Sed id turpis eros. Mauris ut tempus sem. Praesent ullamcorper vel est non feugiat. Proin fermentum ipsum sed massa elementum, nec blandit magna elementum. Sed vel massa eleifend, mollis velit ac, molestie ante. Aliquam pretium vel dui non gravida. Integer nec sollicitudin ante. Nulla eu condimentum nibh. Nunc ullamcorper, felis ac porttitor venenatis, magna tortor lobortis est, ac ultrices purus dolor maximus magna. In neque magna, egestas id est at, maximus feugiat mi. Integer pellentesque mauris a fermentum vulputate. Vestibulum volutpat nulla at lacinia facilisis. Mauris et tempus lorem.
Praesent quis interdum est. Nullam sem nulla, dignissim sit amet erat pulvinar, eleifend fringilla orci. Sed vitae feugiat mauris. Donec a leo at magna vulputate semper quis et augue. Vivamus nec accumsan quam. Duis augue enim, sodales at vulputate non, auctor ut velit. Ut tincidunt vel lectus et condimentum. Integer erat quam, efficitur sit amet odio at, auctor efficitur elit. Nulla lacinia at mi eu rhoncus. Quisque tincidunt metus eu laoreet mollis. Aliquam erat volutpat. Sed commodo facilisis justo et finibus. Maecenas consectetur enim id lorem dignissim, in fringilla enim ultricies. Aenean posuere turpis vitae enim ornare, sed molestie nisi porta.
In iaculis accumsan lorem vel sagittis. Nulla egestas nibh in arcu suscipit hendrerit. Praesent a porttitor justo. Suspendisse massa massa, congue at suscipit a, finibus quis odio. Vivamus lorem neque, egestas ac aliquet quis, finibus nec velit. Etiam vel neque eros. Praesent at scelerisque est, in congue lectus. Nulla egestas, tortor eget vestibulum facilisis, eros mauris sollicitudin enim, ut molestie ligula ipsum quis ipsum. Vivamus vel tempor eros, sit amet malesuada quam. Nulla facilisi.
Nullam accumsan semper ultrices. Ut purus augue, dapibus a odio vel, fringilla imperdiet risus. Aenean hendrerit ullamcorper pulvinar. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Nullam ultrices placerat turpis, sed porta justo venenatis nec. Cras est ligula, convallis at mi sit amet, hendrerit lacinia est. Nunc ut urna sed magna venenatis rutrum. Aliquam eleifend porttitor arcu sed aliquam. Fusce volutpat, lacus nec rhoncus pretium, ligula tellus vehicula ligula, non vestibulum ligula ipsum ac sapien. Donec dignissim mollis eros, eget interdum justo.
</div>
</div>
</div>
</div>
