P90 Employee ID

[shangri_bullshit_la]

JORGMUND CORPORATION

CHARACTER NAME

PIPER 90: RIG CREW

App
Permissions
CR Chart
Thread Tracker
Inbox
Plotting

Just replace CHARACTER_NAME, CHARACTER_IMAGE, and your links.
This isn't "official" so you can delete, re-order, add, etc whatever you want.
Image dimensions are 200x240px.
<div style="margin: 15px auto 30px auto; width: 315px; height: 500px; display: grid; grid-template-columns: 25% auto; grid-column-gap: 0%; border-radius: 20px; padding: 25px 20px 0px 25px; background-image: url(https://cdnw.nickpic.host/sikpPn.png); background-size: 300px; background-color: #eee; box-shadow: 5px 5px 10px #888; overflow: hidden; font-size: 20px; font-family: Courier, monospace; line-height: 120%; white-space: normal; "><div style="display: flex; grid-column: 1; background-color: #F77E09; width: 100%; Height: 530px; margin-left: -30px; margin-top: -30px;"> <div style="margin-bottom: 10px; height: 500px; width: 75px;"><div style="width: 500px; margin-top: 475px; margin-left: 70px; transform: rotate(270deg); transform-origin: 0% 100%; text-align: right; "><span style="font-family: Arial Black, Gadget, sans-serif; color: white; font-size: 30px; font-weight: bold;"> JORGMUND CORPORATION</span></div></div></div><div style="grid-column: 2; display: grid; grid-template-rows: 270px auto;"><center><div style="grid-row: 1;"><div style="width: 100%; text-transform: uppercase; font-size: 30px;margin: auto; font-family: impact; line-height: 70%; ">CHARACTER_NAME</div> <img alt="character picture" src="CHARACTER_IMAGE" style="object-fit: cover; width: 200px; height: 240px; border-radius: 5px; margin: auto;"></div></center><div style="grid-row: 2; background-image: url(https://cdnw.nickpic.host/snojmp.png); background-repeat: no-repeat; background-position: 100% 100%; background-size: 170px; height: 220px;"> <span style="text-align: left; color: #555577;"><b>PIPER 90:</b> RIG CREW</span><p style="text-align: left; padding-left: 10%; padding-top: 5px; font-weight: bold; white-space: pre-wrap; margin: 0px;"><a href="link" style="text-decoration: none; color: black;">App</a> <a href="link" style="text-decoration: none; color: black;">Permissions</a> <a href="link" style="text-decoration: none; color: black;">CR Chart</a> <a href="link" style="text-decoration: none; color: black;">Thread Tracker</a> <a href="link" style="text-decoration: none; color: black;">Inbox</a> <a href="link" style="text-decoration: none; color: black;">Plotting</a></p></div></div></div>

You are welcome to use this code for other things, to reverse engineer it to serve other purposes, or w/e pleases you. If you make something totally new out of it, it would be pretty cool if you could credit zita (or at least show me what rad new thing you made.)

If you need any help with my spaghetti code for any reason, also feel free to ask.

HOW TO CHANGE THE COLORS:
Is Jorgmund Orange insufficient for your aesthetic needs? Replace the color code #F77E09 with whatever color you want.
Screw around with this image in photoshop to match (if you want it to):

Replace the second background image link in the code with your new circlesnake.
(Ensure you preserve transparency/opacity when you do.)

A NOTE ABOUT CENTER TAGS:
For some reason, something breaks slightly if you enclose this whole div in center tags. It should center itself without you having to do that, but if you want to center text above or below it you should close them before and open them after the badge.

A NOTE ABOUT JOURNAL LAYOUTS:
The css of a journal layout on your recent entries page might fuck with this in unpredictable ways. Keep an eye out.