• When posting, please be aware that artistic nudity is still nudity and not allowed under RpNation rules. Please edit your pictures accordingly!

    Remember to credit artists when using work not your own.

Closed ► sox's laundry hamper [broken af lol] ◄

do you prefer simple, mobile friendly codes or complex codes made for monitors?

  • mobile friendly (cmon sox the future is now old man)

  • big and complex pls

  • complex AND mobile friendly step it up sox

Results are only viewable after voting.
sox

sox

فلسطين حرة
1f2fb869075ccf67012b941cb0e71784.jpg

welcome to my mismatched laundry pile of freebies! i'm no expert at bbcode, so they might be pretty basic and kinda ugly (like ya homie over here), but i'm learning and hope to put out some quality designs for you folks! as you can see, they get progressively better the farther you get in the thread, so let me know if you have any requests!

all of my codes that are free to use will have the code linked. feel free to mess around with any of the properties, but please leave the credit on any codes you choose to use, especially since i'd love to see it in action. you don't have to reply to this thread with the link, but it never hurts! thanks for reading and enjoy the thread c:



IN-CHARACTER TEMPLATE
- MF: metanoia: x
- MF: venom: x
- NMF: voyager: x
- MF: juggernaut: x
- MF: sunday morning: x
- NMF: move: x

CHARACTER SHEET
- MF: rose water: x
- MF: parallel: x
- NMF: reverie: x
- NMF: twitter: x
- NMF: heartthrob (+mf): x
- NMF: idealist: x
- NMF: gone: x
- MF: refresher: x
- NMF: want: x
- MF: nyctophiliac: x
- MF: heliophiliac: x
- MF: serendipity: x
- NMF: hero: x
- MF: illusion: x
- NMF: long flight: x
- MF: strawberry milk: x

INTEREST CHECK
- MF: singularity: x
- NMF: cold case: x
- MF: cold-blooded: x

PLACEHOLDER
- MF: cookie: x
- MF: tryhard: x
- MF: innovator: x
- MF: redamancy: x
- MF: dream in a dream: x
- MF: snakecharmer: x
 
Last edited:
METANOIA - MOBILE FRIENDLY

my first ic code woot woot! please don't remove the credit! the text box scrolls, and if you hover over the name, you'll get interactions, mood, and outfit tags c: the name has to be manually centered. it's very basic and a little cramped but i like how it turned out overall! hope you guys like it~

[class=rectangle] position: relative; box-sizing: border-box; transform: translateX(-50%); left: 50%; background:#FFE0E0; overflow: visible; width: 510px; height: 360px; border: 2px solid white; border-radius: 30px; [/class] [class=name] position: absolute; top: 10px; left: 138px; height: 50px; overflow: hidden; text-align: center; font-family: Helvetica Neue; font-style: normal; text-transform: uppercase; font-weight: normal; font-size: 30px; color: white; text-shadow:3px 3px #FFCFCF; [/class] [class=pic1] position: absolute; width: 100px; height: 100px; top: 10px; left: 10px; margin: auto; background-image: url(https://66.media.tumblr.com/e1112af30af28a13bf66ced18ab9cf69/tumblr_pb46o0YBZm1tu18deo2_r1_540.gifv); background-size: 230%; background-position: 60% 50%; border: 2px #fff solid; border-radius: 30px; transition: 0.5s; [/class] [class=pic2] position: absolute; width: 100px; height: 100px; top: 125px; left: 10px; margin: auto; background-image: url(https://66.media.tumblr.com/0648a465c7c851bdafabf646d89956b5/tumblr_pibf1qN9b51tu18deo1_400.gif); background-size: 120%; background-position: 60% 50%; border: 2px #fff solid; border-radius: 30px; [/class] [class=pic3] position: absolute; width: 100px; height: 100px; top: 240px; left: 10px; margin: auto; background-image: url(https://66.media.tumblr.com/12a015f6e5ae73d813647859e95f1bc7/tumblr_pe475g36Sa1tu18deo1_540.gifv); background-size: 230%; background-position: 60% 50%; border: 2px #fff solid; border-radius: 30px; [/class] [class=pic4] position: absolute; width: 100px; height: 100px; top: 10px; left: 390px; margin: auto; background-image: url(https://66.media.tumblr.com/80492070df0767d384a97dc2047b9bcc/tumblr_pb46o0YBZm1tu18deo3_r1_540.gifv); background-size: 230%; background-position: 60% 50%; border: 2px #fff solid; border-radius: 30px; [/class] [class=pic5] position: absolute; width: 100px; height: 100px; top: 125px; left: 390px; margin: auto; background-image: url(https://66.media.tumblr.com/904cdac8d8d5cde9f2163d849fcfbc61/tumblr_pdxy2fRrBs1tu18deo1_500.gif); background-size: 200%; background-position: 40% 50%; border: 2px #fff solid; border-radius: 30px; [/class] [class=pic6] position: absolute; width: 100px; height: 100px; top: 240px; left: 390px; margin: auto; background-image: url(https://66.media.tumblr.com/871aa17dd072ecf8eb078effb98b1d10/tumblr_pe492wFx611tu18deo3_540.gif); background-size: 230%; background-position: 60% 50%; border: 2px #fff solid; border-radius: 30px; [/class] [class=credit] position: absolute; left: 130px; top: 340px; opacity: 0.7; overflow: hidden; width: 225px; height: 26px; text-align: center; font-family: Segoe UI; font-style: normal; font-weight: normal; font-size: 8px; color: #fff; [/class] [class=container] position: absolute; top: 60px; left: 125px; background: #FFE0E0; width:250px; height:270px; overflow:hidden; border: 1px solid white; [/class] [class=textbox] background: #FFCFCF; overflow: auto; width: 257px; height: 260px; text-align: justify; line-height: 12px; font-family: Segoe UI; font-style: normal; font-weight: normal; font-size: 10px; color: #fff; padding: 5px; [/class] [class=name2] position: absolute; width: 100%; top: 10px; height: 50px; overflow: hidden; text-align: center; font-family: Helvetica Neue; background-color: #FFE0E0; font-style: normal; text-transform: lowercase; font-weight: normal; font-size: 10px; line-height: 10px; color: white; [/class] [class=hidden] display:none; [/class] [script class=name on=mouseenter] fadeIn 0500 name2 [/script] [script class=name on=mouseleave] fadeOut 0500 name2 [/script]
[div class=rectangle]
[div class=pic1]

[div class=pic2][/div]
[div class=pic3][/div]
[div class=pic4][/div]
[div class=pic5][/div]
[div class=pic6][/div]
[div class=name]cha hakyeon[div class="name2 hidden"]interactions: xxx
mood: xxx
outfit: xxx[/div][/div]​
[div class=container][div class=textbox]Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Sit amet massa vitae tortor condimentum. Quis lectus nulla at volutpat diam ut venenatis tellus. Sagittis orci a scelerisque purus semper eget duis at tellus. Lacus suspendisse faucibus interdum posuere. Mattis pellentesque id nibh tortor id. A pellentesque sit amet porttitor eget dolor morbi. Volutpat odio facilisis mauris sit amet. Porta non pulvinar neque laoreet suspendisse. Imperdiet proin fermentum leo vel orci porta non pulvinar neque. Ultricies mi eget mauris pharetra et ultrices neque. Auctor eu augue ut lectus arcu bibendum at. Ut etiam sit amet nisl.

Vitae nunc sed velit dignissim sodales. Iaculis at erat pellentesque adipiscing commodo elit. Duis ut diam quam nulla porttitor. Sodales ut eu sem integer vitae justo eget. Urna et pharetra pharetra massa massa ultricies mi. Odio euismod lacinia at quis risus sed. Sagittis orci a scelerisque purus. Cras semper auctor neque vitae tempus quam pellentesque nec. Mattis molestie a iaculis at erat pellentesque. Mauris rhoncus aenean vel elit scelerisque. Neque aliquam vestibulum morbi blandit cursus risus at ultrices. Habitasse platea dictumst vestibulum rhoncus est. Placerat orci nulla pellentesque dignissim. Purus in massa tempor nec feugiat nisl pretium fusce. Eget mi proin sed libero enim sed faucibus. Bibendum arcu vitae elementum curabitur vitae nunc sed. Dictumst vestibulum rhoncus est pellentesque elit ullamcorper dignissim. Amet consectetur adipiscing elit duis tristique.

Sit amet consectetur adipiscing elit duis tristique sollicitudin nibh. Cursus eget nunc scelerisque viverra. Leo urna molestie at elementum eu. Nibh venenatis cras sed felis eget velit. Libero nunc consequat interdum varius sit. Arcu cursus vitae congue mauris rhoncus aenean vel elit scelerisque. Et magnis dis parturient montes nascetur ridiculus mus mauris. Commodo elit at imperdiet dui accumsan sit. Adipiscing elit ut aliquam purus sit amet luctus venenatis lectus. Duis convallis convallis tellus id interdum. Dignissim convallis aenean et tortor. Eget velit aliquet sagittis id consectetur purus ut faucibus pulvinar. Quam lacus suspendisse faucibus interdum posuere lorem. Commodo viverra maecenas accumsan lacus. Diam volutpat commodo sed egestas egestas fringilla.

Ullamcorper velit sed ullamcorper morbi tincidunt ornare massa eget. Nibh mauris cursus mattis molestie a iaculis at. Nulla at volutpat diam ut venenatis tellus. Leo integer malesuada nunc vel risus commodo viverra maecenas accumsan. Diam sit amet nisl suscipit adipiscing bibendum est. Nibh tellus molestie nunc non blandit massa. Tortor aliquam nulla facilisi cras. Tempus iaculis urna id volutpat lacus laoreet non curabitur. Vulputate eu scelerisque felis imperdiet proin. Risus commodo viverra maecenas accumsan lacus vel.

Risus pretium quam vulputate dignissim suspendisse. Bibendum at varius vel pharetra. Eros in cursus turpis massa tincidunt dui ut. Bibendum est ultricies integer quis auctor. Morbi tristique senectus et netus et malesuada fames. Quam vulputate dignissim suspendisse in est ante in nibh. Odio ut sem nulla pharetra diam sit amet. Viverra justo nec ultrices dui sapien. Amet commodo nulla facilisi nullam vehicula. Urna cursus eget nunc scelerisque viverra mauris in aliquam. Nisi porta lorem mollis aliquam ut porttitor leo. Velit sed ullamcorper morbi tincidunt ornare. Luctus venenatis lectus magna fringilla urna. In egestas erat imperdiet sed.[/div][/div]
[div class=credit]code by sox sox [/div][/div][/div]
Code: 
[nobr]
[comment]the pink background[/comment]
[class=rectangle]
        position: relative;
        box-sizing: border-box;
        transform: translateX(-50%);
        left: 50%;
        background:#FFE0E0;
        overflow: visible;
        width: 510px;
        height: 360px;
       border: 2px solid white;
        border-radius: 30px;
[/class]
[comment]big name title header[/comment]
[class=name]
        position: absolute;
        top: 10px;
        left: 138px;
        height: 50px;
        overflow: hidden;
        text-align: center;
        font-family: Helvetica Neue;
        font-style: normal;
        text-transform: uppercase;
        font-weight: normal;
        font-size: 30px;
        color: white;
        text-shadow:3px 3px #FFCFCF;
[/class]
[class=pic1]
                position: absolute;
                width: 100px;
                height: 100px;
                top: 10px;
                left: 10px;
                margin: auto;
                background-image: url(https://66.media.tumblr.com/e1112af30af28a13bf66ced18ab9cf69/tumblr_pb46o0YBZm1tu18deo2_r1_540.gifv);
                background-size: 230%;
                background-position: 60% 50%;
                border: 2px #fff solid;
                border-radius: 30px;
                transition: 0.5s;
[/class]
[class=pic2]
                position: absolute;
                width: 100px;
                height: 100px;
                top: 125px;
                left: 10px;
                margin: auto;
                background-image: url(https://66.media.tumblr.com/0648a465c7c851bdafabf646d89956b5/tumblr_pibf1qN9b51tu18deo1_400.gif);
                background-size: 120%;
                background-position: 60% 50%;
                border: 2px #fff solid;
                border-radius: 30px;
[/class]
[class=pic3]
                position: absolute;
                width: 100px;
                height: 100px;
                top: 240px;
                left: 10px;
                margin: auto;
                background-image: url(https://66.media.tumblr.com/12a015f6e5ae73d813647859e95f1bc7/tumblr_pe475g36Sa1tu18deo1_540.gifv);
                background-size: 230%;
                background-position: 60% 50%;
                border: 2px #fff solid;
                border-radius: 30px;
[/class]
[class=pic4]
                position: absolute;
                width: 100px;
                height: 100px;
                top: 10px;
                left: 390px;
                margin: auto;
                background-image: url(https://66.media.tumblr.com/80492070df0767d384a97dc2047b9bcc/tumblr_pb46o0YBZm1tu18deo3_r1_540.gifv);
                background-size: 230%;
                background-position: 60% 50%;
                border: 2px #fff solid;
                border-radius: 30px;
[/class]
[class=pic5]
                position: absolute;
                width: 100px;
                height: 100px;
                top: 125px;
                left: 390px;
                margin: auto;
                background-image: url(https://66.media.tumblr.com/904cdac8d8d5cde9f2163d849fcfbc61/tumblr_pdxy2fRrBs1tu18deo1_500.gif);
                background-size: 200%;
                background-position: 40% 50%;
                border: 2px #fff solid;
                border-radius: 30px;
[/class]
[class=pic6]
                position: absolute;
                width: 100px;
                height: 100px;
                top: 240px;
                left: 390px;
                margin: auto;
                background-image: url(https://66.media.tumblr.com/871aa17dd072ecf8eb078effb98b1d10/tumblr_pe492wFx611tu18deo3_540.gif);
                background-size: 230%;
                background-position: 60% 50%;
                border: 2px #fff solid;
                border-radius: 30px;
[/class]
[comment]DO NOT REMOVE[/comment]
[class=credit]
        position: absolute;
        left: 130px;
        top: 340px;
        opacity: 0.7;
        overflow: hidden;
        width: 225px;
        height: 26px;
        text-align: center;
        font-family: Segoe UI;
        font-style: normal;
        font-weight: normal;
        font-size: 8px;
        color: #fff;
[/class]
[comment]hidden scroll container[/comment]
[class=container]
                position: absolute;
                top: 60px;
                left: 125px;            
                background: #FFE0E0;
                width:250px;
                height:270px;
                overflow:hidden;
                border: 1px solid white;
[/class]
[comment]big text area[/comment]
[class=textbox]
        background: #FFCFCF;
        overflow: auto;
        width: 257px;
        height: 260px;
        text-align: justify;
        line-height: 12px;
        font-family: Segoe UI;
        font-style: normal;
        font-weight: normal;
        font-size: 10px;
        color: #fff;
        padding: 5px;
[/class]
[comment]fade in text: interactions, mood, outfit[/comment]
[class=name2]
        position: absolute;
        width: 100%;
        top: 10px;
        height: 50px;
        overflow: hidden;
        text-align: center;
        font-family: Helvetica Neue;
        background-color: #FFE0E0;
        font-style: normal;
        text-transform: lowercase;
        font-weight: normal;
        font-size: 10px;
        line-height: 10px;
        color: white;
[/class]

[comment]makes fade in text hidden until hovered over[/comment]
[class=hidden]
display:none;
[/class]

[comment]text fades in while hovered[/comment]
[script class=name on=mouseenter]
fadeIn 0500 name2
[/script]

[comment]text fades out when not hovered[/comment]
[script class=name on=mouseleave]
fadeOut 0500 name2
[/script]

[/nobr]
[div=position: relative; padding: 10px; left: 50%; box-sizing: border-box;transform: translateX(-50%);width:530px; height: 380px;border:1px solid #FFCFCF; border-radius:30px;][div class=rectangle]
[div class=pic1][/div]
[div class=pic2][/div]
[div class=pic3][/div]
[div class=pic4][/div]
[div class=pic5][/div]
[div class=pic6][/div]
[CENTER][div class=name][font=Reem Kufi]cha hakyeon[/font][div class="name2 hidden"]interactions: xxx[br][/br]mood: xxx[br][/br]outfit: xxx[/div][/div][/CENTER]
[div class=container][div class=textbox]Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Sit amet massa vitae tortor condimentum. Quis lectus nulla at volutpat diam ut venenatis tellus. Sagittis orci a scelerisque purus semper eget duis at tellus. Lacus suspendisse faucibus interdum posuere. Mattis pellentesque id nibh tortor id. A pellentesque sit amet porttitor eget dolor morbi. Volutpat odio facilisis mauris sit amet. Porta non pulvinar neque laoreet suspendisse. Imperdiet proin fermentum leo vel orci porta non pulvinar neque. Ultricies mi eget mauris pharetra et ultrices neque. Auctor eu augue ut lectus arcu bibendum at. Ut etiam sit amet nisl.

Vitae nunc sed velit dignissim sodales. Iaculis at erat pellentesque adipiscing commodo elit. Duis ut diam quam nulla porttitor. Sodales ut eu sem integer vitae justo eget. Urna et pharetra pharetra massa massa ultricies mi. Odio euismod lacinia at quis risus sed. Sagittis orci a scelerisque purus. Cras semper auctor neque vitae tempus quam pellentesque nec. Mattis molestie a iaculis at erat pellentesque. Mauris rhoncus aenean vel elit scelerisque. Neque aliquam vestibulum morbi blandit cursus risus at ultrices. Habitasse platea dictumst vestibulum rhoncus est. Placerat orci nulla pellentesque dignissim. Purus in massa tempor nec feugiat nisl pretium fusce. Eget mi proin sed libero enim sed faucibus. Bibendum arcu vitae elementum curabitur vitae nunc sed. Dictumst vestibulum rhoncus est pellentesque elit ullamcorper dignissim. Amet consectetur adipiscing elit duis tristique.

Sit amet consectetur adipiscing elit duis tristique sollicitudin nibh. Cursus eget nunc scelerisque viverra. Leo urna molestie at elementum eu. Nibh venenatis cras sed felis eget velit. Libero nunc consequat interdum varius sit. Arcu cursus vitae congue mauris rhoncus aenean vel elit scelerisque. Et magnis dis parturient montes nascetur ridiculus mus mauris. Commodo elit at imperdiet dui accumsan sit. Adipiscing elit ut aliquam purus sit amet luctus venenatis lectus. Duis convallis convallis tellus id interdum. Dignissim convallis aenean et tortor. Eget velit aliquet sagittis id consectetur purus ut faucibus pulvinar. Quam lacus suspendisse faucibus interdum posuere lorem. Commodo viverra maecenas accumsan lacus. Diam volutpat commodo sed egestas egestas fringilla.

Ullamcorper velit sed ullamcorper morbi tincidunt ornare massa eget. Nibh mauris cursus mattis molestie a iaculis at. Nulla at volutpat diam ut venenatis tellus. Leo integer malesuada nunc vel risus commodo viverra maecenas accumsan. Diam sit amet nisl suscipit adipiscing bibendum est. Nibh tellus molestie nunc non blandit massa. Tortor aliquam nulla facilisi cras. Tempus iaculis urna id volutpat lacus laoreet non curabitur. Vulputate eu scelerisque felis imperdiet proin. Risus commodo viverra maecenas accumsan lacus vel.

Risus pretium quam vulputate dignissim suspendisse. Bibendum at varius vel pharetra. Eros in cursus turpis massa tincidunt dui ut. Bibendum est ultricies integer quis auctor. Morbi tristique senectus et netus et malesuada fames. Quam vulputate dignissim suspendisse in est ante in nibh. Odio ut sem nulla pharetra diam sit amet. Viverra justo nec ultrices dui sapien. Amet commodo nulla facilisi nullam vehicula. Urna cursus eget nunc scelerisque viverra mauris in aliquam. Nisi porta lorem mollis aliquam ut porttitor leo. Velit sed ullamcorper morbi tincidunt ornare. Luctus venenatis lectus magna fringilla urna. In egestas erat imperdiet sed.[/div][/div]
[div class=credit]code by [USER=2383]sox[/USER][/div][/div][/div]
 
Last edited:
REVERIE - NOT MOBILE FRIENDLY

this one has some messy code tbh but it is what it is lmao both text boxes scroll, and if you hover over the image, there's a secondary image and room for a quote if you want! or just having a second face claim picture works too ~ this was the result of me not having enough work to do at my job so pls enjoy the offspring of my boredom!

[class=bkgd] position: relative; box-sizing: border-box; background: #000259; width: 740px; height: 630px; overflow: hidden; margin: auto; padding: 0; align-content: center; [/class] [class=bkgdpic] position: relative; box-sizing: border-box; background-image: url(https://media.giphy.com/media/UYBDCJjwOd9Re/giphy.gif); width: 740px; height: 630px; overflow: hidden; opacity: 0.7; margin: 0; padding: 0; align-content: center; [/class] [class=name] position: absolute; left: 55px; top: -8px; overflow: hidden; width: 294px; height: 80px; text-align: center; font-style: normal; font-weight: normal; font-size: 60px; color: #c5ecf1; align-content: center; text-shadow: 3px 3px #c24f66; [/class] [class=circlepic] position: absolute; overflow: visible; width: 245px; height: 245px; left: 75px; top: 80px; border-radius: 100%; background-image: url(https://66.media.tumblr.com/96a8d737e8d9c0a621927cd64fd25053/tumblr_nyabr9GcTP1us1c0qo1_1280.jpg); background-size: 180%; background-position: 60% 50%; border: 2px solid #c5ecf1; box-shadow: 5px 5px #c24f66; [/class] [class=circletext] position: absolute; overflow: visible; width: 100%; height: 100%; left: 0px; top: 0px; border-radius: 100%; background-image: url(https://66.media.tumblr.com/d05dfcef4f1b3486153ed5bd42e6830e/tumblr_ntf36pInAL1tchrkco1_500.gif); background-size: 250%; background-position: 60% 50%; border: 1px solid #c5ecf1; box-shadow: 5px 5px #c24f66; text-align: center; font-family: Calligraffitti; font-size: 12px; color: #c5ecf1; [/class] [class=hidden] display:none; [/class] [script class=circlepic on=mouseenter] fadeIn 0500 circletext [/script] [script class=circlepic on=mouseleave] fadeOut 0500 circletext [/script] [class=basics] position: absolute; overflow: auto; width: 330px; height: 210px; border-radius: 10px; background: #87bfd6; padding: 10px; font-size: 10px; line-height: 14px; [/class] [class=basicscontainer] position: absolute; overflow: hidden; width: 330px; height: 229px; left: 25px; top: 361px; border: 1px solid #c5ecf1; border-radius: 10px; background: #87bfd6; box-shadow: 5px 5px #c24f66; [/class] [class=pages] position: absolute; overflow: auto; width: 308px; height: 530px; border-radius: 10px; background: #87bfd6; padding: 10px; font-size: 10px; text-align: justify; line-height: 14px; [/class] [class=textcontainer] position: absolute; overflow: hidden; width: 310px; height: 545px; left: 400px; top: 45px; border: 1px solid #c5ecf1; border-radius: 10px; background: #87bfd6; box-shadow: 5px 5px #c24f66; [/class] [class=subtitle] height: 10px; display: inline-block; background: #000131; padding: 0px 4px 5px 3px; color: #c5ecf1; font-size: 10px; font-family: Source Sans Pro; font-weight: 200; box-shadow: 2px 2px #c24f66; text-transform: uppercase; margin: 2px; [/class] [class=header1] position: absolute; left: -22px; top: 336px; overflow: hidden; width: 294px; height: 60px; text-align: center; font-style: normal; font-family: Calligraffitti; font-weight: normal; font-size: 20px; color: #c5ecf1; align-content: center; text-shadow: 3px 3px #c24f66; [/class] [class=header2] position: absolute; left: 340px; top: 20px; overflow: hidden; width: 294px; height: 60px; text-align: center; font-style: normal; font-family: Calligraffitti; font-weight: normal; font-size: 20px; color: #c5ecf1; align-content: center; text-shadow: 3px 3px #c24f66; [/class] [class=credit] position: absolute; left: 260px; top: 610px; overflow: hidden; width: 225px; height: 26px; text-align: center; font-family: Segoe UI; font-style: normal; font-weight: normal; font-size: 8px; color: #730b29; [/class]
[div class=bkgd][div class=bkgdpic][/div]
[div class=name]reverie[/div]
[div class=circlepic][div class="circletext hidden"]



let's fall back in love
with the world and who we are,
and do the things we talked about
but never did before.

[/div][/div]
[div class=basicscontainer][div class=basics][div class=subtitle]full name[/div] it may be bittersweet

[div class=subtitle]nickname[/div] 'cause we're no longer seventeen

[div class=subtitle]age[/div] 23

[div class=subtitle]gender[/div] female

[div class=subtitle]sexuality[/div] bisexual

[div class=subtitle]role[/div] follow endlessly

[div class=subtitle]occupation[/div] searching

[div class=subtitle]height/weight[/div] 5'8" / 130lbs

[div class=subtitle]eye color[/div] black

[div class=subtitle]haircolor[/div] black
[/div][/div][div class=header1]how would you define me?[/div]
[div class=textcontainer][div class=pages][div class=subtitle]personality[/div]
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Nunc sed augue lacus viverra. Turpis egestas integer eget aliquet nibh praesent tristique magna sit. Vestibulum lectus mauris ultrices eros. Quam nulla porttitor massa id neque. Euismod lacinia at quis risus sed vulputate odio ut enim. Quam lacus suspendisse faucibus interdum posuere lorem ipsum dolor. Ultrices gravida dictum fusce ut placerat orci nulla pellentesque dignissim. Lobortis elementum nibh tellus molestie nunc non blandit massa. Tempus imperdiet nulla malesuada pellentesque elit eget gravida. Arcu non sodales neque sodales ut etiam. Sit amet cursus sit amet dictum. Mauris a diam maecenas sed. Elementum sagittis vitae et leo duis.

[div class=subtitle]likes[/div]
Augue mauris augue neque gravida in fermentum et sollicitudin ac. Semper feugiat nibh sed pulvinar proin gravida hendrerit. Accumsan lacus vel facilisis volutpat. Vel turpis nunc eget lorem dolor sed viverra ipsum. Morbi tempus iaculis urna id volutpat lacus laoreet non curabitur. Nunc vel risus commodo viverra. Arcu risus quis varius quam quisque id diam. Aenean pharetra magna ac placerat vestibulum. Senectus et netus et malesuada fames ac turpis egestas integer. Ornare massa eget egestas purus. Eleifend donec pretium vulputate sapien nec sagittis aliquam malesuada bibendum.

[div class=subtitle]dislikes[/div]
Lobortis scelerisque fermentum dui faucibus. Velit ut tortor pretium viverra suspendisse potenti nullam ac tortor. Sed odio morbi quis commodo odio aenean sed. Quis hendrerit dolor magna eget est. Ipsum faucibus vitae aliquet nec. Viverra aliquet eget sit amet tellus cras adipiscing enim eu. Aliquam etiam erat velit scelerisque. Vitae justo eget magna fermentum iaculis eu non diam phasellus. Porttitor eget dolor morbi non. Diam vel quam elementum pulvinar. Aliquam purus sit amet luctus. Molestie ac feugiat sed lectus vestibulum mattis ullamcorper velit. Quis viverra nibh cras pulvinar mattis nunc sed blandit libero. Tortor posuere ac ut consequat. Nulla facilisi etiam dignissim diam quis enim lobortis scelerisque. Risus in hendrerit gravida rutrum quisque. Condimentum vitae sapien pellentesque habitant morbi.

[div class=subtitle]strengths[/div]
Consectetur adipiscing elit duis tristique sollicitudin. In hendrerit gravida rutrum quisque. Pulvinar pellentesque habitant morbi tristique. Nulla at volutpat diam ut. Luctus venenatis lectus magna fringilla urna. Faucibus turpis in eu mi bibendum neque. Venenatis urna cursus eget nunc scelerisque viverra. Imperdiet massa tincidunt nunc pulvinar. Tortor at auctor urna nunc id cursus metus aliquam eleifend. Fringilla urna porttitor rhoncus dolor purus non enim. Mi ipsum faucibus vitae aliquet nec ullamcorper sit amet risus.

[div class=subtitle]weaknesses[/div]
Ipsum dolor sit amet consectetur adipiscing. Sed augue lacus viverra vitae congue. Eu tincidunt tortor aliquam nulla facilisi cras. Sit amet consectetur adipiscing elit pellentesque habitant morbi. Praesent tristique magna sit amet purus gravida. Iaculis at erat pellentesque adipiscing commodo elit at. Eget dolor morbi non arcu risus quis varius quam quisque. Id ornare arcu odio ut sem nulla pharetra diam. Aliquam malesuada bibendum arcu vitae. Ut diam quam nulla porttitor massa id. Aliquam malesuada bibendum arcu vitae elementum curabitur vitae nunc sed. Maecenas volutpat blandit aliquam etiam erat. Sit amet massa vitae tortor condimentum lacinia quis. Pulvinar sapien et ligula ullamcorper malesuada proin libero nunc consequat. Leo in vitae turpis massa sed elementum tempus. Urna et pharetra pharetra massa massa ultricies.

[div class=subtitle]habits[/div]
Integer feugiat scelerisque varius morbi. Quis blandit turpis cursus in hac habitasse. Enim ut sem viverra aliquet eget. Maecenas ultricies mi eget mauris pharetra et. Feugiat in ante metus dictum at tempor commodo. Amet nisl purus in mollis. Amet mattis vulputate enim nulla aliquet. Feugiat sed lectus vestibulum mattis. Ultricies mi eget mauris pharetra et ultrices neque ornare aenean. Non curabitur gravida arcu ac. Risus sed vulputate odio ut enim blandit. Fermentum leo vel orci porta non pulvinar neque laoreet suspendisse. Donec ultrices tincidunt arcu non sodales neque sodales.

[div class=subtitle]quirks[/div]
Nulla facilisi etiam dignissim diam. Sodales ut etiam sit amet nisl purus in mollis nunc. Quam id leo in vitae turpis massa sed elementum tempus. Arcu bibendum at varius vel pharetra vel turpis nunc. Sed ullamcorper morbi tincidunt ornare. Elit ullamcorper dignissim cras tincidunt lobortis feugiat vivamus. Sed felis eget velit aliquet sagittis id consectetur. Duis ut diam quam nulla porttitor massa. Mi quis hendrerit dolor magna eget est lorem ipsum dolor. Neque aliquam vestibulum morbi blandit cursus risus. Pulvinar neque laoreet suspendisse interdum consectetur libero id faucibus nisl. Volutpat blandit aliquam etiam erat velit scelerisque. Aliquam sem et tortor consequat id porta. Pulvinar pellentesque habitant morbi tristique senectus et netus. Mi tempus imperdiet nulla malesuada pellentesque elit eget gravida.

[div class=subtitle]fears[/div]
Commodo elit at imperdiet dui accumsan sit. Duis ultricies lacus sed turpis tincidunt. Egestas sed tempus urna et pharetra pharetra massa massa. Eu volutpat odio facilisis mauris. Arcu risus quis varius quam quisque id. Sit amet risus nullam eget felis eget. Commodo sed egestas egestas fringilla phasellus faucibus scelerisque. Vel turpis nunc eget lorem dolor sed viverra. Molestie nunc non blandit massa enim nec dui nunc mattis. Pellentesque dignissim enim sit amet venenatis urna cursus eget nunc. Cursus turpis massa tincidunt dui. Felis eget nunc lobortis mattis aliquam faucibus purus in massa. Gravida dictum fusce ut placerat orci nulla pellentesque dignissim. Massa vitae tortor condimentum lacinia quis vel. Praesent semper feugiat nibh sed. Mauris pellentesque pulvinar pellentesque habitant morbi tristique senectus. Vel elit scelerisque mauris pellentesque. Et ultrices neque ornare aenean.

[div class=subtitle]history[/div]
Augue mauris augue neque gravida in fermentum et sollicitudin ac. Semper feugiat nibh sed pulvinar proin gravida hendrerit. Accumsan lacus vel facilisis volutpat. Vel turpis nunc eget lorem dolor sed viverra ipsum. Morbi tempus iaculis urna id volutpat lacus laoreet non curabitur. Nunc vel risus commodo viverra. Arcu risus quis varius quam quisque id diam. Aenean pharetra magna ac placerat vestibulum. Senectus et netus et malesuada fames ac turpis egestas integer. Ornare massa eget egestas purus. Eleifend donec pretium vulputate sapien nec sagittis aliquam malesuada bibendum.

[div class=subtitle]motivations[/div]
Lobortis scelerisque fermentum dui faucibus. Velit ut tortor pretium viverra suspendisse potenti nullam ac tortor. Sed odio morbi quis commodo odio aenean sed. Quis hendrerit dolor magna eget est. Ipsum faucibus vitae aliquet nec. Viverra aliquet eget sit amet tellus cras adipiscing enim eu. Aliquam etiam erat velit scelerisque. Vitae justo eget magna fermentum iaculis eu non diam phasellus. Porttitor eget dolor morbi non.

[div class=subtitle]other[/div]
Consectetur adipiscing elit duis tristique sollicitudin. In hendrerit gravida rutrum quisque. Pulvinar pellentesque habitant morbi tristique. Nulla at volutpat diam ut. Luctus venenatis lectus magna fringilla urna. Faucibus turpis in eu mi bibendum neque. Venenatis urna cursus eget nunc scelerisque viverra. Imperdiet massa tincidunt nunc pulvinar. Tortor at auctor urna nunc id cursus metus aliquam eleifend. Fringilla urna porttitor rhoncus dolor purus non enim. Mi ipsum faucibus vitae aliquet nec ullamcorper sit amet risus.
[/div][/div][div class=header2]how would i define me?[/div]
[div class=credit]code by sox sox [/div]
[/div]
Code: 
[nobr]
    [class=bkgd]
        position: relative;
        box-sizing: border-box;
        background: #000259;
        width: 740px;
        height: 630px;
        overflow: hidden;
        margin: auto;
        padding: 0;
                align-content: center;
    [/class]
    [class=bkgdpic]
        position: relative;
        box-sizing: border-box;
                background-image: url(https://media.giphy.com/media/UYBDCJjwOd9Re/giphy.gif);
        width: 740px;
        height: 630px;
        overflow: hidden;
                opacity: 0.7;
        margin: 0;
        padding: 0;
                align-content: center;
    [/class]
    [class=name]
        position: absolute;
        left: 55px;
        top: -8px;
        overflow: hidden;
        width: 294px;
        height: 80px;
        text-align: center;
        font-style: normal;
        font-weight: normal;
        font-size: 60px;
        color: #c5ecf1;
                align-content: center;
                text-shadow: 3px 3px #c24f66;
    [/class]
    [class=circlepic]
        position: absolute;
        overflow: visible;
        width: 245px;
        height: 245px;
        left: 75px;
        top: 80px;
        border-radius: 100%;
                background-image: url(https://66.media.tumblr.com/96a8d737e8d9c0a621927cd64fd25053/tumblr_nyabr9GcTP1us1c0qo1_1280.jpg);
                background-size: 180%;
                background-position: 60% 50%;
        border: 2px solid #c5ecf1;
                box-shadow: 5px 5px #c24f66;
    [/class]
    [class=circletext]
        position: absolute;
        overflow: visible;
        width: 100%;
                height: 100%;
        left: 0px;
        top: 0px;
        border-radius: 100%;
                background-image: url(https://66.media.tumblr.com/d05dfcef4f1b3486153ed5bd42e6830e/tumblr_ntf36pInAL1tchrkco1_500.gif);
                background-size: 250%;
                background-position: 60% 50%;
        border: 1px solid #c5ecf1;
                box-shadow: 5px 5px #c24f66;
                text-align: center;
                font-family: Calligraffitti;
                font-size: 12px;
                color: #c5ecf1;
    [/class]
        [class=hidden]
                display:none;
        [/class]
        [script class=circlepic on=mouseenter]
                fadeIn 0500 circletext
        [/script]
        [script class=circlepic on=mouseleave]
                fadeOut 0500 circletext
        [/script]
    [class=basics]
        position: absolute;
        overflow: auto;
        width: 330px;
        height: 210px;
                border-radius: 10px;
                background: #87bfd6;
                padding: 10px;
                font-size: 10px;
                line-height: 14px;
        [/class]
        [class=basicscontainer]
                position: absolute;
        overflow: hidden;
        width: 330px;
        height: 229px;
        left: 25px;
        top: 361px;
        border: 1px solid #c5ecf1;
                border-radius: 10px;
                background: #87bfd6;
                box-shadow: 5px 5px #c24f66;
        [/class]
    [class=pages]
        position: absolute;
        overflow: auto;
        width: 308px;
        height: 530px;
                border-radius: 10px;
                background: #87bfd6;
                padding: 10px;
                font-size: 10px;
                text-align: justify;
                line-height: 14px;
    [/class]
        [class=textcontainer]
                position: absolute;
        overflow: hidden;
        width: 310px;
        height: 545px;
        left: 400px;
        top: 45px;
        border: 1px solid #c5ecf1;
                border-radius: 10px;
                background: #87bfd6;
                box-shadow: 5px 5px #c24f66;
[/class]
        [class=subtitle]
                height: 10px;
                display: inline-block;
                background: #000131;
                padding: 0px 4px 5px 3px;
                color: #c5ecf1;
                font-size: 10px;
                font-family: Source Sans Pro;
                font-weight: 200;
                box-shadow: 2px 2px #c24f66;
                text-transform: uppercase;
                margin: 2px;
        [/class]
    [class=header1]
        position: absolute;
        left: -22px;
        top: 336px;
        overflow: hidden;
        width: 294px;
        height: 60px;
        text-align: center;
        font-style: normal;
                font-family: Calligraffitti;
        font-weight: normal;
        font-size: 20px;
        color: #c5ecf1;
                align-content: center;
                text-shadow: 3px 3px #c24f66;
    [/class]
    [class=header2]
        position: absolute;
        left: 340px;
        top: 20px;
        overflow: hidden;
        width: 294px;
        height: 60px;
        text-align: center;
        font-style: normal;
                font-family: Calligraffitti;
        font-weight: normal;
        font-size: 20px;
        color: #c5ecf1;
                align-content: center;
                text-shadow: 3px 3px #c24f66;
    [/class]
        [class=credit]
        position: absolute;
        left: 260px;
        top: 610px;
        overflow: hidden;
        width: 225px;
        height: 26px;
        text-align: center;
        font-family: Segoe UI;
        font-style: normal;
        font-weight: normal;
        font-size: 8px;
        color: #730b29;
        [/class]
[/nobr]
[div class=bkgd][div class=bkgdpic][/div]
[div class=name][font=Calligraffitti]reverie[/font][/div]
[div class=circlepic][div class="circletext hidden"][br][/br][br][/br][br][/br]
let's fall back in love
with the world and who we are,
and do the things we talked about
but never did before.

[/div][/div]
[div class=basicscontainer][div class=basics][div class=subtitle]full name[/div] it may be bittersweet

[div class=subtitle]nickname[/div] 'cause we're no longer seventeen

[div class=subtitle]age[/div] 23

[div class=subtitle]gender[/div] female

[div class=subtitle]sexuality[/div] bisexual

[div class=subtitle]role[/div] follow endlessly

[div class=subtitle]occupation[/div] searching

[div class=subtitle]height/weight[/div] 5'8" / 130lbs

[div class=subtitle]eye color[/div] black

[div class=subtitle]haircolor[/div] black
[/div][/div][div class=header1]how would you define me?[/div]
[div class=textcontainer][div class=pages][div class=subtitle]personality[/div]
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Nunc sed augue lacus viverra. Turpis egestas integer eget aliquet nibh praesent tristique magna sit. Vestibulum lectus mauris ultrices eros. Quam nulla porttitor massa id neque. Euismod lacinia at quis risus sed vulputate odio ut enim. Quam lacus suspendisse faucibus interdum posuere lorem ipsum dolor. Ultrices gravida dictum fusce ut placerat orci nulla pellentesque dignissim. Lobortis elementum nibh tellus molestie nunc non blandit massa. Tempus imperdiet nulla malesuada pellentesque elit eget gravida. Arcu non sodales neque sodales ut etiam. Sit amet cursus sit amet dictum. Mauris a diam maecenas sed. Elementum sagittis vitae et leo duis.

[div class=subtitle]likes[/div]
Augue mauris augue neque gravida in fermentum et sollicitudin ac. Semper feugiat nibh sed pulvinar proin gravida hendrerit. Accumsan lacus vel facilisis volutpat. Vel turpis nunc eget lorem dolor sed viverra ipsum. Morbi tempus iaculis urna id volutpat lacus laoreet non curabitur. Nunc vel risus commodo viverra. Arcu risus quis varius quam quisque id diam. Aenean pharetra magna ac placerat vestibulum. Senectus et netus et malesuada fames ac turpis egestas integer. Ornare massa eget egestas purus. Eleifend donec pretium vulputate sapien nec sagittis aliquam malesuada bibendum.

[div class=subtitle]dislikes[/div]
Lobortis scelerisque fermentum dui faucibus. Velit ut tortor pretium viverra suspendisse potenti nullam ac tortor. Sed odio morbi quis commodo odio aenean sed. Quis hendrerit dolor magna eget est. Ipsum faucibus vitae aliquet nec. Viverra aliquet eget sit amet tellus cras adipiscing enim eu. Aliquam etiam erat velit scelerisque. Vitae justo eget magna fermentum iaculis eu non diam phasellus. Porttitor eget dolor morbi non. Diam vel quam elementum pulvinar. Aliquam purus sit amet luctus. Molestie ac feugiat sed lectus vestibulum mattis ullamcorper velit. Quis viverra nibh cras pulvinar mattis nunc sed blandit libero. Tortor posuere ac ut consequat. Nulla facilisi etiam dignissim diam quis enim lobortis scelerisque. Risus in hendrerit gravida rutrum quisque. Condimentum vitae sapien pellentesque habitant morbi.

[div class=subtitle]strengths[/div]
Consectetur adipiscing elit duis tristique sollicitudin. In hendrerit gravida rutrum quisque. Pulvinar pellentesque habitant morbi tristique. Nulla at volutpat diam ut. Luctus venenatis lectus magna fringilla urna. Faucibus turpis in eu mi bibendum neque. Venenatis urna cursus eget nunc scelerisque viverra. Imperdiet massa tincidunt nunc pulvinar. Tortor at auctor urna nunc id cursus metus aliquam eleifend. Fringilla urna porttitor rhoncus dolor purus non enim. Mi ipsum faucibus vitae aliquet nec ullamcorper sit amet risus.

[div class=subtitle]weaknesses[/div]
Ipsum dolor sit amet consectetur adipiscing. Sed augue lacus viverra vitae congue. Eu tincidunt tortor aliquam nulla facilisi cras. Sit amet consectetur adipiscing elit pellentesque habitant morbi. Praesent tristique magna sit amet purus gravida. Iaculis at erat pellentesque adipiscing commodo elit at. Eget dolor morbi non arcu risus quis varius quam quisque. Id ornare arcu odio ut sem nulla pharetra diam. Aliquam malesuada bibendum arcu vitae. Ut diam quam nulla porttitor massa id. Aliquam malesuada bibendum arcu vitae elementum curabitur vitae nunc sed. Maecenas volutpat blandit aliquam etiam erat. Sit amet massa vitae tortor condimentum lacinia quis. Pulvinar sapien et ligula ullamcorper malesuada proin libero nunc consequat. Leo in vitae turpis massa sed elementum tempus. Urna et pharetra pharetra massa massa ultricies.

[div class=subtitle]habits[/div]
Integer feugiat scelerisque varius morbi. Quis blandit turpis cursus in hac habitasse. Enim ut sem viverra aliquet eget. Maecenas ultricies mi eget mauris pharetra et. Feugiat in ante metus dictum at tempor commodo. Amet nisl purus in mollis. Amet mattis vulputate enim nulla aliquet. Feugiat sed lectus vestibulum mattis. Ultricies mi eget mauris pharetra et ultrices neque ornare aenean. Non curabitur gravida arcu ac. Risus sed vulputate odio ut enim blandit. Fermentum leo vel orci porta non pulvinar neque laoreet suspendisse. Donec ultrices tincidunt arcu non sodales neque sodales.

[div class=subtitle]quirks[/div]
Nulla facilisi etiam dignissim diam. Sodales ut etiam sit amet nisl purus in mollis nunc. Quam id leo in vitae turpis massa sed elementum tempus. Arcu bibendum at varius vel pharetra vel turpis nunc. Sed ullamcorper morbi tincidunt ornare. Elit ullamcorper dignissim cras tincidunt lobortis feugiat vivamus. Sed felis eget velit aliquet sagittis id consectetur. Duis ut diam quam nulla porttitor massa. Mi quis hendrerit dolor magna eget est lorem ipsum dolor. Neque aliquam vestibulum morbi blandit cursus risus. Pulvinar neque laoreet suspendisse interdum consectetur libero id faucibus nisl. Volutpat blandit aliquam etiam erat velit scelerisque. Aliquam sem et tortor consequat id porta. Pulvinar pellentesque habitant morbi tristique senectus et netus. Mi tempus imperdiet nulla malesuada pellentesque elit eget gravida.

[div class=subtitle]fears[/div]
Commodo elit at imperdiet dui accumsan sit. Duis ultricies lacus sed turpis tincidunt. Egestas sed tempus urna et pharetra pharetra massa massa. Eu volutpat odio facilisis mauris. Arcu risus quis varius quam quisque id. Sit amet risus nullam eget felis eget. Commodo sed egestas egestas fringilla phasellus faucibus scelerisque. Vel turpis nunc eget lorem dolor sed viverra. Molestie nunc non blandit massa enim nec dui nunc mattis. Pellentesque dignissim enim sit amet venenatis urna cursus eget nunc. Cursus turpis massa tincidunt dui. Felis eget nunc lobortis mattis aliquam faucibus purus in massa. Gravida dictum fusce ut placerat orci nulla pellentesque dignissim. Massa vitae tortor condimentum lacinia quis vel. Praesent semper feugiat nibh sed. Mauris pellentesque pulvinar pellentesque habitant morbi tristique senectus. Vel elit scelerisque mauris pellentesque. Et ultrices neque ornare aenean.

[div class=subtitle]history[/div]
Augue mauris augue neque gravida in fermentum et sollicitudin ac. Semper feugiat nibh sed pulvinar proin gravida hendrerit. Accumsan lacus vel facilisis volutpat. Vel turpis nunc eget lorem dolor sed viverra ipsum. Morbi tempus iaculis urna id volutpat lacus laoreet non curabitur. Nunc vel risus commodo viverra. Arcu risus quis varius quam quisque id diam. Aenean pharetra magna ac placerat vestibulum. Senectus et netus et malesuada fames ac turpis egestas integer. Ornare massa eget egestas purus. Eleifend donec pretium vulputate sapien nec sagittis aliquam malesuada bibendum.

[div class=subtitle]motivations[/div]
Lobortis scelerisque fermentum dui faucibus. Velit ut tortor pretium viverra suspendisse potenti nullam ac tortor. Sed odio morbi quis commodo odio aenean sed. Quis hendrerit dolor magna eget est. Ipsum faucibus vitae aliquet nec. Viverra aliquet eget sit amet tellus cras adipiscing enim eu. Aliquam etiam erat velit scelerisque. Vitae justo eget magna fermentum iaculis eu non diam phasellus. Porttitor eget dolor morbi non.

[div class=subtitle]other[/div]
Consectetur adipiscing elit duis tristique sollicitudin. In hendrerit gravida rutrum quisque. Pulvinar pellentesque habitant morbi tristique. Nulla at volutpat diam ut. Luctus venenatis lectus magna fringilla urna. Faucibus turpis in eu mi bibendum neque. Venenatis urna cursus eget nunc scelerisque viverra. Imperdiet massa tincidunt nunc pulvinar. Tortor at auctor urna nunc id cursus metus aliquam eleifend. Fringilla urna porttitor rhoncus dolor purus non enim. Mi ipsum faucibus vitae aliquet nec ullamcorper sit amet risus.
[/div][/div][div class=header2]how would i define me?[/div]
[div class=credit]code by [USER=2383]sox[/USER][/div]
[/div]
 
Last edited:
TWITTER - NOT MOBILE FRIENDLY

this was one of those codes where halfway through, i questioned my entire existence and purpose on this earth, but i was already too far into it to back out. the code is long as hell and difficult to navigate, but if you rly wanna use it, by all means be my guest lmao the tweets section scrolls, as do the bodies of each individual tweet. please do not remove the credit! i'm gonna go pretend i don't have carpal tunnel.


[class=twitterpage] position: relative; box-sizing: border-box; background: #E5E5E5; width: 808px; height: 700px; background-color: rgba(255,255,255,1); overflow: hidden; margin: auto; padding: 0; cursor: url(https://imgur.com/5ex8RXq.png), auto; [/class] [class=tweetsmedia] position: absolute; overflow: visible; width: 400px; height: 34px; left: 194px; top: 385px; font-family: Open Sans; line-height: 23px; font-size: 12px; color: #707070; [/class] [class=tweetpanel] position: relative; overflow: auto; width: 415px; height: 305px; top: 0px; left: 0px; background: #fff; [/class] [class=tweetpanelcontainer] position: absolute; overflow: hidden; width: 398px; height: 290px; left: 195px; top: 412px; background: #fff; border: 1px solid #CECECE; [/class] [class=twtribbon] position: absolute; overflow: visible; width: 400px; height: 42px; left: 194px; top: 48px; background: #fff; border: 1px solid #CECECE; [/class] [class=ribbon] position: absolute; overflow: visible; width: 809px; height: 48px; left: 0px; top: 0px; background: #b3b3b3; [/class] [class=url] position: absolute; overflow: visible; width: 715px; height: 23px; left: 76px; top: 13px; background: #fff; border: 1px solid #fff; border-radius: 15px; font-family: Open Sans; line-height: 23px; font-size: 10px; color: #707070; [/class] [class=leftpanel] position: absolute; overflow: visible; width: 194px; height: 652px; left: 0px; top: 48px; background: #fff; border: 1px solid #CECECE; [/class] [class=rightpanel] position: absolute; overflow: visible; width: 215px; height: 652px; left: 594px; top: 48px; background: #fff; border: 1px solid #CECECE; [/class] [class=header] position: absolute; overflow: visible; width: 400px; height: 132px; left: 195px; top: 90px; background-image: url(https://i.pinimg.com/564x/c3/7f/29/c37f29e840a1d8333bc15edffc1c2a37.jpg); background-size: 100%; background-position: 50% 60%; [/class] [class=pfp] position: absolute; overflow: visible; width: 97px; height: 97px; left: 204px; top: 174px; background-image: url(https://i.pinimg.com/564x/d7/b2/84/d7b28458a46981343a3e62d6e59852da.jpg); border: 3px solid #fff; border-radius: 50%; background-size: 100%; background-position: 50% 0%; [/class] [class=twticon] position: absolute; overflow: visible; width: 40px; height: 40px; left: 9px; top: 9px; background-image: url(https://cdn2.iconfinder.com/data/icons/minimalism/512/twitter.png); background-size: 100%; background-position: 50% 0%; [/class] [class=description] position: absolute; overflow: visible; width: 381px; height: 29px; left: 204px; top: 322px; color: #000; font-size: 11px; font-family: Open Sans; line-height: 14px; [/class] [class=menu] position: absolute; overflow: visible; width: 194px; height: 388px; left: 0px; top: 58px; background-image: url(https://imgur.com/OyQfYvR.png); background-size: 100%; background-position: 50% 0%; [/class] [class=writetweet] position: absolute; overflow: visible; width: 159px; height: 36px; left: 18px; top: 455px; background: #1DA1F2; border-radius: 25px; color: #fff; line-height: 35px; font-size: 14px; font-family: Source Sans Pro; text-align: center; [/class] [class=name] position: absolute; overflow: visible; width: 239px; height: 13px; left: 204px; top: 283px; color: #000; font-size: 16px; font-family: Source Sans Pro; [/class] [class=handle] position: absolute; overflow: visible; width: 239px; height: 13px; left: 204px; top: 303px; color: #707070; font-size: 11px; font-family: Open Sans; [/class] [class=follow] position: absolute; overflow: visible; width: 68px; height: 23px; left: 517px; top: 234px; border: 1px solid #1DA1F2; border-radius: 25px; color: #1DA1F2; line-height: 22px; font-size: 10px; font-family: Source Sans Pro; text-align: center; [/class] [class=searchbar] position: absolute; overflow: visible; width: 181px; height: 28px; left: 16px; top: 7px; background: #DEDEDE; border-radius: 25px; color: #828282; line-height: 28px; font-size: 12px; font-family: Open Sans; text-align: center; [/class] [class=sidepic1] position: absolute; overflow: visible; width: 60px; height: 60px; left: 17px; top: 49px; background-image: url(https://i.pinimg.com/originals/fe/24/bc/fe24bc9c689ffa906a30e8918403c686.gif); background-size: 100%; background-position: 50% 0%; border: 1px solid #fff; [/class] [class=sidepic2] position: absolute; overflow: visible; width: 60px; height: 60px; left: 77px; top: 49px; background-image: url(https://i.pinimg.com/564x/12/fe/b1/12feb1a16b5319d443dd802802ca217c.jpg); background-size: 100%; background-position: 50% 0%; border: 1px solid #fff; [/class] [class=sidepic3] position: absolute; overflow: visible; width: 60px; height: 60px; left: 137px; top: 49px; background-image: url(https://i.pinimg.com/originals/1e/97/a2/1e97a21493efe888c1ff799ee802fa8f.gif); background-size: 150%; background-position: 50% 50%; border: 1px solid #fff; [/class] [class=sidepic4] position: absolute; overflow: visible; width: 60px; height: 60px; left: 17px; top: 109px; background-image: url(https://i.pinimg.com/564x/ee/2b/aa/ee2baa8a5878e39adc1daaa6d757a365.jpg); background-size: 100%; background-position: 50% 0%; border: 1px solid #fff; [/class] [class=sidepic5] position: absolute; overflow: visible; width: 60px; height: 60px; left: 77px; top: 109px; background-image: url(https://i.pinimg.com/originals/34/ec/54/34ec543b0ae06a129efdad5412134fe9.gif); background-size: 100%; background-position: 50% 0%; border: 1px solid #fff; [/class] [class=sidepic6] position: absolute; overflow: visible; width: 60px; height: 60px; left: 137px; top: 109px; background-image: url(https://i.pinimg.com/564x/0c/d1/95/0cd1951d4c49405e2a1dbf74a00c6e47.jpg); background-size: 100%; background-position: 50% 0%; border: 1px solid #fff; [/class] [class=followcount] position: absolute; overflow: visible; width: 173px; height: 15px; left: 204px; top: 360px; color: #000; font-size: 12px; font-family: Open Sans; [/class] [class=tweet] position: relative; overflow: visible; width: 398px; height: 205px; left: 0px; top: 0px; background: #fff; border-bottom: 1px solid #cecece; [/class] [class=tweetpfp] position: absolute; overflow: visible; width: 29px; height: 28px; left: 7px; top: 7px; background-image: url(https://i.pinimg.com/564x/d7/b2/84/d7b28458a46981343a3e62d6e59852da.jpg); border-radius: 50%; background-size: 100%; background-position: 50% 0%; [/class] [class=tweetbody] position: absolute; overflow: auto; width: 355px; height: 150px; left: 0px; top: 0px; text-align: justify; color: #000; font-size: 10px; font-family: Open Sans; line-height: 12px; padding-right: 5px; [/class] [class=tweetbodycontainer] position: absolute; overflow: hidden; width: 343px; height: 150px; left: 42px; top: 26px; [/class] [class=tweetname] position: absolute; overflow: visible; width: 173px; height: 11px; left: 42px; top: 7px; color: #000; font-size: 12px; font-family: Source Sans Pro; [/class] [class=ribbonname] position: absolute; overflow: visible; width: 148px; height: 20px; left: 42px; top: 5px; color: #000; font-size: 14px; font-family: Source Sans Pro; text-align: left; [/class] [class=tweetcount] position: absolute; overflow: visible; width: 67px; height: 9px; left: 42px; top: 22px; color: #1f1f1f; font-size: 10px; font-style: Open Sans; text-align: left; [/class] [class=tos] position: absolute; overflow: visible; width: 181px; height: 35px; left: 17px; top: 175px; background-image: url(https://imgur.com/lCxkrS0.png); background-size: 100%; background-position: 10% 0%; [/class] [class=credit] position: absolute; overflow: visible; width: 148px; height: 15px; left: 22px; top: 210px; background: #fff; font-size: 6px; color: #dedede; [/class] [class=backhome] position: absolute; overflow: visible; width: 19px; height: 19px; left: 200px; top: 60px; background-image: url(http://pixsector.com/cache/a8009c95/av8a49a4f81c3318dc69d.png); background-size: 100%; background-position: 50% 0%; [/class] [class=back] position: absolute; overflow: visible; width: 19px; height: 19px; left: 9px; top: 15px; background-image: url(http://pixsector.com/cache/a8009c95/av8a49a4f81c3318dc69d.png); background-size: 115%; background-position: 50% 50%; [/class] [class=forward] position: absolute; overflow: visible; width: 19px; height: 19px; left: 30px; top: 15px; background-image: url(http://pixsector.com/cache/ef1ee4a1/av85f1b171d762037fe92.png); background-size: 100%; background-position: 50% 0%; [/class] [class=refresh] position: absolute; overflow: visible; width: 19px; height: 19px; left: 51px; top: 15px; background-image: url(https://www.pngrepo.com/download/178337/refresh-arrows.png); background-size: 100%; background-position: 50% 10%; [/class] [class=retweets] position: absolute; overflow: visible; width: 173px; height: 11px; left: 43px; top: 185px; [/class] [class=reply] position: absolute; overflow: visible; width: 14px; height: 13px; left: 0px; top: 0px; background-image: url(https://imgur.com/MOz3F5v.png); background-size: 100%; background-position: 50% 0%; [/class] [class=rt] position: absolute; overflow: visible; width: 16px; height: 11px; left: 50px; top: 0px; background-image: url(https://imgur.com/PHgTalR.png); background-size: 105%; background-position: 50% 0%; [/class] [class=like] position: absolute; overflow: visible; width: 14px; height: 13px; left: 100px; top: 0px; background-image: url(https://imgur.com/l9Sg3lD.png); background-size: 100%; background-position: 50% 0%; [/class] [div class=twitterpage] [div class=ribbon] [div class=forward][/div] [div class=back][/div] [div class=refresh][/div] [div class=url]---https:///twitter.corn/[/div] [/div] [div class=leftpanel] [div class=twticon][/div] [div class=menu][/div] [div class=writetweet]Tweet[/div] [/div] [div class=rightpanel] [div class=searchbar]Search Twitter[/div] [div class=sidepic1][/div] [div class=sidepic2][/div] [div class=sidepic3][/div] [div class=sidepic4][/div] [div class=sidepic5][/div] [div class=sidepic6][/div] [div class=tos][/div] [div class=credit]code by sox sox [/div] [/div] [div class=twtribbon][div class=ribbonname]Lee Taemin[/div][div class=tweetcount]1,988 Tweets[/div][/div] [div class=header][/div] [div class=backhome][/div] [div class=pfp][/div] [div class=follow]Follow[/div] [div class=name]Lee Taemin[/div] [div class=handle]@taeminlee[/div] [div class=description]not a single facial expression, not a single sentence can express all of you. we're perfect just the way we are. | singer-songwriter from korea[/div] [div class=followcount]23 Following----1.1M Followers[/div] [div class=tweetsmedia]--------Tweets-----------Tweets & Replies-----------Media-----------Likes[/div] [div class=tweetpanelcontainer][div class=tweetpanel] [div class=tweet] [div class=tweetpfp][/div] [div class=tweetname]Basics - @taeminlee[/div] [div class=tweetbodycontainer][div class=tweetbody]Name: Lee Taemin

Age: 26

Gender: Male

Sexuality: Heterosexual

Role: Male

Occupation: Singer-songwriter, professional dancer, and member of the South Korean group SHINee

Birthday: Male

Height: Male

Weight: Male

Body Type: Male

Hair Color: Brown

Eye Color: Brown

Body Mods: Ear piercings [/div][/div] [div class=retweets][div class=reply][/div][div class=rt][/div][div class=like][/div][/div] [/div] [div class=tweet] [div class=tweetpfp][/div] [div class=tweetname]Persona - @taeminlee[/div] [div class=tweetbodycontainer][div class=tweetbody]Personality: Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Venenatis lectus magna fringilla urna porttitor. Consectetur purus ut faucibus pulvinar elementum integer enim neque. Sed egestas egestas fringilla phasellus. Fames ac turpis egestas maecenas. Fermentum posuere urna nec tincidunt praesent semper. Nibh tortor id aliquet lectus proin nibh nisl condimentum. Malesuada pellentesque elit eget gravida cum. Leo vel fringilla est ullamcorper eget nulla facilisi etiam dignissim. Vel pharetra vel turpis nunc eget lorem. Tempor orci dapibus ultrices in iaculis nunc. Diam vel quam elementum pulvinar etiam non.

Likes: Faucibus purus in massa tempor. Aliquam sem et tortor consequat. Quis vel eros donec ac odio. Amet justo donec enim diam vulputate ut pharetra sit. Id leo in vitae turpis massa sed elementum. Ac feugiat sed lectus vestibulum mattis ullamcorper velit sed ullamcorper. Sit amet volutpat consequat mauris nunc congue nisi. Erat nam at lectus urna duis convallis. Nam aliquam sem et tortor consequat. Netus et malesuada fames ac turpis egestas. Magna eget est lorem ipsum. Eget mi proin sed libero enim sed faucibus. Nibh mauris cursus mattis molestie.

Dislikes: Fames ac turpis egestas maecenas. Fermentum posuere urna nec tincidunt praesent semper. Nibh tortor id aliquet lectus proin nibh nisl condimentum. Malesuada pellentesque elit eget gravida cum. Leo vel fringilla est ullamcorper eget nulla facilisi etiam dignissim. Vel pharetra vel turpis nunc eget lorem. Faucibus purus in massa tempor. Aliquam sem et tortor consequat. Quis vel eros donec ac odio. Amet justo donec enim diam vulputate ut pharetra sit. [/div][/div] [div class=retweets][div class=reply][/div][div class=rt][/div][div class=like][/div][/div] [/div] [div class=tweet] [div class=tweetpfp][/div] [div class=tweetname]Background - @taeminlee[/div] [div class=tweetbodycontainer][div class=tweetbody]History: Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Venenatis lectus magna fringilla urna porttitor. Consectetur purus ut faucibus pulvinar elementum integer enim neque. Sed egestas egestas fringilla phasellus. Fames ac turpis egestas maecenas. Fermentum posuere urna nec tincidunt praesent semper. Nibh tortor id aliquet lectus proin nibh nisl condimentum. Malesuada pellentesque elit eget gravida cum. Leo vel fringilla est ullamcorper eget nulla facilisi etiam dignissim. Vel pharetra vel turpis nunc eget lorem. Tempor orci dapibus ultrices in iaculis nunc. Diam vel quam elementum pulvinar etiam non.

Family: Faucibus purus in massa tempor. Aliquam sem et tortor consequat. Quis vel eros donec ac odio. Amet justo donec enim diam vulputate ut pharetra sit. Id leo in vitae turpis massa sed elementum. Ac feugiat sed lectus vestibulum mattis ullamcorper velit sed ullamcorper. Sit amet volutpat consequat mauris nunc congue nisi. Erat nam at lectus urna duis convallis. Nam aliquam sem et tortor consequat. Netus et malesuada fames ac turpis egestas. Magna eget est lorem ipsum. Eget mi proin sed libero enim sed faucibus. Nibh mauris cursus mattis molestie.

Relationships: Fames ac turpis egestas maecenas. Fermentum posuere urna nec tincidunt praesent semper. Nibh tortor id aliquet lectus proin nibh nisl condimentum. Malesuada pellentesque elit eget gravida cum. Leo vel fringilla est ullamcorper eget nulla facilisi etiam dignissim. Vel pharetra vel turpis nunc eget lorem. Faucibus purus in massa tempor. Aliquam sem et tortor consequat. Quis vel eros donec ac odio. Amet justo donec enim diam vulputate ut pharetra sit. [/div][/div] [div class=retweets][div class=reply][/div][div class=rt][/div][div class=like][/div][/div] [/div]
[/div][/div] [/div]
Pastebin: xxx​
 
Last edited:
VENOM - MOBILE FRIENDLY

a much simpler ic code for my own purposes but it's free to use! i rly like how this one turned out even tho its basic af. the picture is a hover, and the text box is a hidden scroll. please do not remove the credit! much appreciated and much love for u peeps.

[class=bkgd] position: relative; box-sizing: border-box; width: 400px; height: 500px; background-color: #0B1200; overflow: hidden; margin-left: auto; margin-right: auto; border: 10px solid #0b1003; border-radius: 2%; [/class] [class=bkgdpic] position: absolute; box-sizing: border-box; width: 400px; height: 500px; background: url(https://imgur.com/xOcLo2y.jpg); background-size: 100%; opacity: 0.25; overflow: hidden; margin-left: auto; margin-right: auto; [/class] [class=bkgdgif] position: relative; box-sizing: border-box; width: 100%; height:100%; background: url(https://imgur.com/FY5BCnc.gif); background-size: 100%; opacity: 0.25; overflow: hidden; margin-left: auto; margin-right: auto; [/class] [class=pic] position: relative; overflow: hidden; width: 150px; height: 150px; top: 5%; text-align: center; background: url(https://imgur.com/UCqwnum.jpg); background-size: 100%; margin-left: auto; margin-right: auto; border-radius: 50%; border: 2px solid #2f4224; [/class] [class=pictext] position: absolute; overflow: hidden; width: 100%; height: 100%; top: -2px; left: -2px; background-color: #0b1003; color: #99ab79; margin-left: auto; margin-right: auto; border-radius: 50%; border: 2px solid #2f4224; font-size: 10px; font-weight: 500; line-height: 14px; [/class] [class=hidden] display:none; [/class] [script class=pic on=mouseenter] fadeIn 0500 pictext [/script] [script class=pic on=mouseleave] fadeOut 0500 pictext [/script] [class=textcontainer] position: relative; overflow: hidden; width: 294px; height: 245px; background-color: #0b1003; border: 2px solid #2f4224; top: 0%; margin-left: auto; margin-right: auto; border-radius: 2%; font-size: 10px; text-align: justify; line-height: 10px; color: #b5bda8; [/class] [class=text] position: relative; overflow: auto; width: 301px; height: 250px; top: 0%; margin-left: auto; margin-right: auto; font-size: 10px; text-align: justify; line-height: 11px; color: #b5bda8; padding: 5px; [/class] [class=name] position: relative; font-size: 35px; font-weight: 500; color: #99ab79; top: -8%; text-align: center; transform: rotate(-10deg); [/class] [class=credit] position: relative; opacity: 0.7; overflow: hidden; text-align: center; font-family: Segoe UI; font-style: normal; font-weight: normal; font-size: 8px; color: #fff; margin-left: auto; margin-right: auto; [/class] [div class=bkgd] [div class=bkgdpic] [div class=bkgdgif][/div] [/div] [div class=pic] [div class="pictext hidden"]
outfit: xxx

mood: bitter

interactions: xxx [/div] [/div] [div class=name]our blood of venom[/div] [div class=textcontainer][div class=text]Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Rhoncus aenean vel elit scelerisque mauris pellentesque pulvinar. Phasellus egestas tellus rutrum tellus pellentesque eu tincidunt. Amet facilisis magna etiam tempor orci. Placerat duis ultricies lacus sed. Mollis aliquam ut porttitor leo a diam. Vel fringilla est ullamcorper eget nulla facilisi etiam dignissim diam. Pulvinar mattis nunc sed blandit. Lectus urna duis convallis convallis tellus id interdum. Phasellus vestibulum lorem sed risus. Urna et pharetra pharetra massa massa. A diam maecenas sed enim ut.

Fermentum leo vel orci porta non pulvinar neque laoreet suspendisse. Fusce id velit ut tortor pretium. Vehicula ipsum a arcu cursus vitae congue mauris rhoncus aenean. Eleifend mi in nulla posuere sollicitudin. Aliquet eget sit amet tellus cras adipiscing enim eu turpis. Ut diam quam nulla porttitor. Enim praesent elementum facilisis leo vel fringilla est ullamcorper. Vel pretium lectus quam id leo in vitae turpis. Pharetra sit amet aliquam id diam maecenas ultricies. Eget felis eget nunc lobortis mattis aliquam faucibus purus. Et sollicitudin ac orci phasellus egestas tellus rutrum tellus. Nec feugiat in fermentum posuere. Penatibus et magnis dis parturient montes. Diam vel quam elementum pulvinar etiam non quam lacus suspendisse. Nulla pellentesque dignissim enim sit amet venenatis urna cursus eget. Vitae congue mauris rhoncus aenean. Gravida rutrum quisque non tellus orci ac.

Id cursus metus aliquam eleifend mi in nulla. Viverra nibh cras pulvinar mattis nunc sed. Eu facilisis sed odio morbi quis commodo odio aenean sed. Vitae tortor condimentum lacinia quis. Fames ac turpis egestas integer. At augue eget arcu dictum varius duis at consectetur. Sed adipiscing diam donec adipiscing tristique risus nec feugiat. Nec ultrices dui sapien eget. In ante metus dictum at. Viverra adipiscing at in tellus integer feugiat. Amet consectetur adipiscing elit duis tristique. Morbi tempus iaculis urna id volutpat lacus laoreet non. Pulvinar pellentesque habitant morbi tristique senectus et. Erat imperdiet sed euismod nisi porta lorem. Fermentum iaculis eu non diam phasellus vestibulum lorem.

Porttitor eget dolor morbi non arcu. Diam sollicitudin tempor id eu nisl nunc mi ipsum. Nunc faucibus a pellentesque sit amet porttitor. Sed lectus vestibulum mattis ullamcorper velit sed ullamcorper morbi. Aliquam ultrices sagittis orci a scelerisque purus semper. Praesent elementum facilisis leo vel fringilla est ullamcorper. Eget nunc scelerisque viverra mauris in aliquam. Sit amet dictum sit amet justo donec enim diam. Quis risus sed vulputate odio ut enim blandit volutpat. Eu augue ut lectus arcu bibendum at varius. Venenatis urna cursus eget nunc scelerisque viverra mauris in. Egestas fringilla phasellus faucibus scelerisque. Turpis in eu mi bibendum. Eget mi proin sed libero enim sed faucibus. Arcu ac tortor dignissim convallis aenean et tortor. Et magnis dis parturient montes nascetur. Cursus mattis molestie a iaculis at erat pellentesque.

Semper quis lectus nulla at volutpat diam ut. Mollis aliquam ut porttitor leo a diam sollicitudin. Vitae aliquet nec ullamcorper sit amet. Amet facilisis magna etiam tempor orci. Pulvinar sapien et ligula ullamcorper. Felis eget velit aliquet sagittis id consectetur purus ut. Cursus vitae congue mauris rhoncus aenean. Elementum facilisis leo vel fringilla est ullamcorper eget. Vel risus commodo viverra maecenas accumsan lacus vel facilisis. Et odio pellentesque diam volutpat commodo sed. Integer quis auctor elit sed. Tempus iaculis urna id volutpat lacus laoreet.


[/div][/div] [/div][div class=credit]code by sox sox [/div]

Code: 
[nobr]
    [class=bkgd]
        position: relative;
        box-sizing: border-box;
        width: 400px;
        height: 500px;
        background-color: #0B1200;
        overflow: hidden;
        margin-left: auto;
        margin-right: auto;
        border: 10px solid #0b1003;
        border-radius: 2%;
    [/class]
    [class=bkgdpic]
        position: absolute;
        box-sizing: border-box;
        width: 400px;
        height: 500px;
        background: url(https://imgur.com/xOcLo2y.jpg);
        background-size: 100%;
        opacity: 0.25;
        overflow: hidden;
        margin-left: auto;
        margin-right: auto;
    [/class]
    [class=bkgdgif]
        position: relative;
        box-sizing: border-box;
        width: 100%;
        height:100%;
        background: url(https://imgur.com/FY5BCnc.gif);
        background-size: 100%;
        opacity: 0.25;
        overflow: hidden;
        margin-left: auto;
        margin-right: auto;
    [/class]
    [class=pic]
        position: relative;
        overflow: hidden;
        width: 150px;
        height: 150px;
        top: 5%;
        text-align: center;
        background: url(https://imgur.com/UCqwnum.jpg);
        background-size: 100%;
        margin-left: auto;
        margin-right: auto;
        border-radius: 50%;
        border: 2px solid #2f4224;
    [/class]
    [class=pictext]
        position: absolute;
        overflow: hidden;
        width: 100%;
        height: 100%;
        top: -2px;
        left: -2px;
        background-color: #0b1003;
        color: #99ab79;
        margin-left: auto;
        margin-right: auto;
        border-radius: 50%;
        border: 2px solid #2f4224;
        font-size: 10px;
        font-weight: 500;
        line-height: 14px;
    [/class]
    [class=hidden]
        display:none;
    [/class]
    [script class=pic on=mouseenter]
        fadeIn 0500 pictext
    [/script]
    [script class=pic on=mouseleave]
        fadeOut 0500 pictext
    [/script]
    [class=textcontainer]
        position: relative;
        overflow: hidden;
        width: 294px;
        height: 245px;
        background-color: #0b1003;
        border: 2px solid #2f4224;
        top: 0%;
        margin-left: auto;
        margin-right: auto;
        border-radius: 2%;
        font-size: 10px;
        text-align: justify;
        line-height: 10px;
        color: #b5bda8;
    [/class]
    [class=text]
        position: relative;
        overflow: auto;
        width: 301px;
        height: 250px;
        top: 0%;
        margin-left: auto;
        margin-right: auto;
        font-size: 10px;
        text-align: justify;
        line-height: 11px;
        color: #b5bda8;
        padding: 5px;
    [/class]
    [class=name]
        position: relative;
        font-size: 35px;
        font-weight: 500;
        color: #99ab79;
        top: -8%;
        text-align: center;
        transform: rotate(-10deg);
    [/class]
[class=credit]
        position: relative;
        opacity: 0.7;
        overflow: hidden;
        text-align: center;
        font-family: Segoe UI;
        font-style: normal;
        font-weight: normal;
        font-size: 8px;
        color: #fff;
        margin-left: auto;
        margin-right: auto;
[/class]
[div class=bkgd]
   [div class=bkgdpic]
      [div class=bkgdgif][/div]
   [/div]
   [div class=pic]
      [div class="pictext hidden"][font=Nanum Gothic]
         [br][/br][B]outfit:[/B] xxx
         [br][/br][br][/br][B]mood:[/B] bitter
         [br][/br][br][/br][B]interactions:[/B] xxx
      [/font][/div]
   [/div]
   [div class=name][font=Akronim]our blood of venom[/font][/div]
   [div class=textcontainer][div class=text][font=Nanum Gothic]Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Rhoncus aenean vel elit scelerisque mauris pellentesque pulvinar. Phasellus egestas tellus rutrum tellus pellentesque eu tincidunt. Amet facilisis magna etiam tempor orci. Placerat duis ultricies lacus sed. Mollis aliquam ut porttitor leo a diam. Vel fringilla est ullamcorper eget nulla facilisi etiam dignissim diam. Pulvinar mattis nunc sed blandit. Lectus urna duis convallis convallis tellus id interdum. Phasellus vestibulum lorem sed risus. Urna et pharetra pharetra massa massa. A diam maecenas sed enim ut.
[br][/br][br][/br]
Fermentum leo vel orci porta non pulvinar neque laoreet suspendisse. Fusce id velit ut tortor pretium. Vehicula ipsum a arcu cursus vitae congue mauris rhoncus aenean. Eleifend mi in nulla posuere sollicitudin. Aliquet eget sit amet tellus cras adipiscing enim eu turpis. Ut diam quam nulla porttitor. Enim praesent elementum facilisis leo vel fringilla est ullamcorper. Vel pretium lectus quam id leo in vitae turpis. Pharetra sit amet aliquam id diam maecenas ultricies. Eget felis eget nunc lobortis mattis aliquam faucibus purus. Et sollicitudin ac orci phasellus egestas tellus rutrum tellus. Nec feugiat in fermentum posuere. Penatibus et magnis dis parturient montes. Diam vel quam elementum pulvinar etiam non quam lacus suspendisse. Nulla pellentesque dignissim enim sit amet venenatis urna cursus eget. Vitae congue mauris rhoncus aenean. Gravida rutrum quisque non tellus orci ac.
[br][/br][br][/br]
Id cursus metus aliquam eleifend mi in nulla. Viverra nibh cras pulvinar mattis nunc sed. Eu facilisis sed odio morbi quis commodo odio aenean sed. Vitae tortor condimentum lacinia quis. Fames ac turpis egestas integer. At augue eget arcu dictum varius duis at consectetur. Sed adipiscing diam donec adipiscing tristique risus nec feugiat. Nec ultrices dui sapien eget. In ante metus dictum at. Viverra adipiscing at in tellus integer feugiat. Amet consectetur adipiscing elit duis tristique. Morbi tempus iaculis urna id volutpat lacus laoreet non. Pulvinar pellentesque habitant morbi tristique senectus et. Erat imperdiet sed euismod nisi porta lorem. Fermentum iaculis eu non diam phasellus vestibulum lorem.
[br][/br][br][/br]
Porttitor eget dolor morbi non arcu. Diam sollicitudin tempor id eu nisl nunc mi ipsum. Nunc faucibus a pellentesque sit amet porttitor. Sed lectus vestibulum mattis ullamcorper velit sed ullamcorper morbi. Aliquam ultrices sagittis orci a scelerisque purus semper. Praesent elementum facilisis leo vel fringilla est ullamcorper. Eget nunc scelerisque viverra mauris in aliquam. Sit amet dictum sit amet justo donec enim diam. Quis risus sed vulputate odio ut enim blandit volutpat. Eu augue ut lectus arcu bibendum at varius. Venenatis urna cursus eget nunc scelerisque viverra mauris in. Egestas fringilla phasellus faucibus scelerisque. Turpis in eu mi bibendum. Eget mi proin sed libero enim sed faucibus. Arcu ac tortor dignissim convallis aenean et tortor. Et magnis dis parturient montes nascetur. Cursus mattis molestie a iaculis at erat pellentesque.
[br][/br][br][/br]
Semper quis lectus nulla at volutpat diam ut. Mollis aliquam ut porttitor leo a diam sollicitudin. Vitae aliquet nec ullamcorper sit amet. Amet facilisis magna etiam tempor orci. Pulvinar sapien et ligula ullamcorper. Felis eget velit aliquet sagittis id consectetur purus ut. Cursus vitae congue mauris rhoncus aenean. Elementum facilisis leo vel fringilla est ullamcorper eget. Vel risus commodo viverra maecenas accumsan lacus vel facilisis. Et odio pellentesque diam volutpat commodo sed. Integer quis auctor elit sed. Tempus iaculis urna id volutpat lacus laoreet.
[br][/br][br][/br][br][/br]
[/font][/div][/div]
[div class=credit]code by [USER=2383]sox[/USER][/div][/div][/nobr]
[/spoiler][/center]
 
Last edited:
VOYAGER - NOT MOBILE FRIENDLY

yet another ic code that i built when i should've been working!! go me!! i love this color scheme a whole lot so i couldn't resist coding it all in one go. the picture on the left hovers, but the circle one doesn't. the text is also a hidden scroll. please do not remove the credit! much appreciated and pls enjoy this very bright and neon code.

[class=bkgd] position: relative; box-sizing: border-box; width: 800px; height: 500px; background-color: #0E0108; overflow: hidden; border-radius: 20px; border: 1px solid #FF0078; [/class] [class=bkgdborder] position: relative; box-sizing: border-box; width: 821px; height: 521px; padding: 10px; margin-left: auto; margin-right: auto; border-radius: 25px; border: 1px solid #42B4CD; [/class] [class=name] position: absolute; left: 333px; top: 5px; overflow: hidden; width: 467px; height: 70px; text-align: center; font-style: normal; font-weight: normal; font-size: 50px; text-transform: uppercase; color: #42B4CD; [/class] [class=textbox] position: absolute; overflow: auto; width: 415px; height: 305px; left: 0px; top: 5px; text-align: justify; font-style: normal; font-weight: normal; font-size: 10px; line-height: 11px; padding: 10px; color: #c699c0; [/class] [class=textcontainer] position: absolute; overflow: hidden; width: 418px; height: 342px; left: 358px; top: 130px; background-color: #2B0719; border-radius: 20px; border: 1px solid #FF0078; [/class] [class=role] position: absolute; overflow: visible; width: 239px; height: 22px; left: 448px; top: 80px; background-color: #2B0719; border-radius: 30px; text-align: center; font-style: normal; font-weight: normal; font-size: 14px; text-transform: uppercase; color: #FF0078; padding: 2px; [/class] [class=pic] position: absolute; overflow: hidden; width: 333px; height: 500px; left: 0px; top: 0px; background: url(https://images.pexels.com/photos/1083807/pexels-photo-1083807.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=650&w=940); background-size: 100%; border-right: 1px solid #FF0078; [/class] [class=pichover] position: absolute; overflow: hidden; width: 100%; height: 100%; left: 0px; top: 0px; background-color: #2B0719; border-right: 1px solid #FF0078; text-align: center; font-style: normal; font-weight: normal; font-size: 15px; line-height: 18px; color: #c699c0; padding-top: 80%; [/class] [class=hidden] display:none; [/class] [script class=pic on=mouseenter] fadeIn 0500 pichover [/script] [script class=pic on=mouseleave] fadeOut 0500 pichover [/script] [class=circlepic] position: absolute; width: 146px; height: 146px; left: 93.5px; top: 90px; border-radius: 100px; border: 1px solid #FF0078; background: url(https://images.pexels.com/photos/1977056/pexels-photo-1977056.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=650&w=940); background-size: 100%; [/class] [class=credit] position: absolute; top: 479px; left: 333px; overflow: hidden; width: 467px; height: 14px; text-align: center; font-style: normal; font-weight: normal; font-size: 8px; color: #42B4CD; opacity: 0.5; [/class]
[div class=bkgdborder][div class=bkgd]
[div class=pic][div class="pichover hidden"][div class=circlepic][/div]outfit: xxx

mood: adventurous

tags: xxx

mentions: xxx
[/div][/div]
[div class=name]find me, first[/div]
[div class=role]the voyager[/div]
[div class=textcontainer][div class=textbox]Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Purus faucibus ornare suspendisse sed nisi lacus sed viverra tellus. Volutpat ac tincidunt vitae semper quis lectus nulla at volutpat. Semper feugiat nibh sed pulvinar proin gravida hendrerit lectus a. Turpis egestas maecenas pharetra convallis posuere morbi leo urna. Lacinia quis vel eros donec ac odio tempor orci. Vitae tortor condimentum lacinia quis vel. Id interdum velit laoreet id. Mauris vitae ultricies leo integer malesuada nunc. Nibh praesent tristique magna sit amet purus. Vel eros donec ac odio tempor orci. Rhoncus est pellentesque elit ullamcorper dignissim cras tincidunt lobortis feugiat. Vel pretium lectus quam id leo in vitae turpis massa. Duis convallis convallis tellus id interdum velit laoreet.

At auctor urna nunc id cursus metus aliquam eleifend. Odio euismod lacinia at quis risus sed vulputate. Augue lacus viverra vitae congue eu consequat. Ac orci phasellus egestas tellus rutrum tellus pellentesque eu. Ac placerat vestibulum lectus mauris ultrices eros in cursus. Adipiscing commodo elit at imperdiet dui. Elit ut aliquam purus sit. Leo vel orci porta non pulvinar. Mattis nunc sed blandit libero. Mi eget mauris pharetra et ultrices neque ornare aenean. Est pellentesque elit ullamcorper dignissim cras. Quis risus sed vulputate odio ut enim. Amet volutpat consequat mauris nunc congue nisi. Cursus vitae congue mauris rhoncus aenean. Fusce ut placerat orci nulla pellentesque dignissim enim. Sollicitudin tempor id eu nisl nunc mi ipsum. Feugiat in ante metus dictum at tempor commodo ullamcorper. Sem et tortor consequat id porta nibh venenatis.

Quis varius quam quisque id diam vel quam elementum pulvinar. Rhoncus mattis rhoncus urna neque. Faucibus a pellentesque sit amet. Dui vivamus arcu felis bibendum ut tristique et egestas quis. Sit amet consectetur adipiscing elit pellentesque. Vulputate eu scelerisque felis imperdiet proin. Neque viverra justo nec ultrices dui. Integer feugiat scelerisque varius morbi. Quisque id diam vel quam. Viverra nam libero justo laoreet sit. Ridiculus mus mauris vitae ultricies. Turpis egestas maecenas pharetra convallis posuere. Tortor consequat id porta nibh venenatis cras. Purus in massa tempor nec feugiat nisl pretium fusce. Consectetur lorem donec massa sapien faucibus et molestie ac feugiat. Non curabitur gravida arcu ac tortor dignissim convallis aenean et. Bibendum enim facilisis gravida neque convallis a cras. Lobortis scelerisque fermentum dui faucibus in ornare quam viverra orci. Viverra maecenas accumsan lacus vel. Dolor sit amet consectetur adipiscing elit duis tristique sollicitudin.

Ut ornare lectus sit amet est placerat. Tellus in hac habitasse platea dictumst vestibulum rhoncus. Ultrices dui sapien eget mi proin sed libero enim sed. Pellentesque elit eget gravida cum sociis. Ipsum dolor sit amet consectetur adipiscing. Mattis ullamcorper velit sed ullamcorper morbi tincidunt. Ut morbi tincidunt augue interdum. Enim praesent elementum facilisis leo. Et malesuada fames ac turpis egestas maecenas pharetra convallis. Sed blandit libero volutpat sed. Feugiat nisl pretium fusce id. At tempor commodo ullamcorper a lacus vestibulum. Viverra accumsan in nisl nisi scelerisque eu ultrices vitae. Nisl vel pretium lectus quam. Amet aliquam id diam maecenas ultricies mi eget mauris. Lectus urna duis convallis convallis tellus id interdum velit. Morbi blandit cursus risus at ultrices mi tempus. Diam vulputate ut pharetra sit amet aliquam id diam. Quisque sagittis purus sit amet volutpat consequat mauris nunc.

Pharetra vel turpis nunc eget lorem dolor sed viverra ipsum. Ut tortor pretium viverra suspendisse potenti nullam. Tellus in metus vulputate eu. Magna sit amet purus gravida. Purus faucibus ornare suspendisse sed nisi lacus. Ornare aenean euismod elementum nisi quis eleifend quam. Gravida dictum fusce ut placerat orci nulla pellentesque dignissim. Nec feugiat in fermentum posuere urna. Id ornare arcu odio ut sem nulla. Tristique senectus et netus et malesuada. Quam adipiscing vitae proin sagittis nisl rhoncus mattis rhoncus. Purus in massa tempor nec feugiat nisl pretium fusce. Enim eu turpis egestas pretium. Volutpat maecenas volutpat blandit aliquam etiam. Ac ut consequat semper viverra nam libero justo laoreet. Tristique magna sit amet purus gravida quis blandit turpis.

[/div][/div]
[div class=credit]code by sox sox [/div][/div][/div]

Code: 
[nobr]
        [class=bkgd]
        position: relative;
        box-sizing: border-box;
        width: 800px;
        height: 500px;
        background-color: #0E0108;
        overflow: hidden;
                border-radius: 20px;
                border: 1px solid #FF0078;
        [/class]
        [class=bkgdborder]
        position: relative;
        box-sizing: border-box;
        width: 821px;
        height: 521px;
                padding: 10px;
        margin-left: auto;
                margin-right: auto;
                border-radius: 25px;
                border: 1px solid #42B4CD;
        [/class]
    [class=name]
        position: absolute;
        left: 333px;
        top: 5px;
        overflow: hidden;
        width: 467px;
        height: 70px;
        text-align: center;
        font-style: normal;
        font-weight: normal;
        font-size: 50px;
                text-transform: uppercase;
        color: #42B4CD;
        [/class]
    [class=textbox]
        position: absolute;
        overflow: auto;
        width: 415px;
        height: 305px;
        left: 0px;
        top: 5px;
        text-align: justify;
        font-style: normal;
        font-weight: normal;
        font-size: 10px;
                line-height: 11px;
                padding: 10px;
                color: #c699c0;
        [/class]
    [class=textcontainer]
        position: absolute;
        overflow: hidden;
        width: 418px;
        height: 342px;
        left: 358px;
        top: 130px;
        background-color: #2B0719;
                border-radius: 20px;
                border: 1px solid #FF0078;
        [/class]
    [class=role]
        position: absolute;
        overflow: visible;
        width: 239px;
        height: 22px;
        left: 448px;
        top: 80px;
        background-color: #2B0719;
                border-radius: 30px;
        text-align: center;
        font-style: normal;
        font-weight: normal;
        font-size: 14px;
                text-transform: uppercase;
        color: #FF0078;
                padding: 2px;
        [/class]
    [class=pic]
        position: absolute;
        overflow: hidden;
        width: 333px;
        height: 500px;
        left: 0px;
        top: 0px;
                background: url(https://images.pexels.com/photos/1083807/pexels-photo-1083807.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=650&w=940);
                background-size: 100%;
                border-right: 1px solid #FF0078;
        [/class]
    [class=pichover]
        position: absolute;
        overflow: hidden;
        width: 100%;
                height: 100%;
        left: 0px;
        top: 0px;
        background-color: #2B0719;
                border-right: 1px solid #FF0078;
        text-align: center;
        font-style: normal;
        font-weight: normal;
        font-size: 15px;
                line-height: 18px;
                color: #c699c0;
                padding-top: 80%;
        [/class]
        [class=hidden]
                display:none;
        [/class]
        [script class=pic on=mouseenter]
                fadeIn 0500 pichover
        [/script]
        [script class=pic on=mouseleave]
                fadeOut 0500 pichover
        [/script]
        [class=circlepic]
                position: absolute;
                width: 146px;
                height: 146px;
                left: 93.5px;
                top: 90px;
                border-radius: 100px;
                border: 1px solid #FF0078;
                background: url(https://images.pexels.com/photos/1977056/pexels-photo-1977056.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=650&w=940);
                background-size: 100%;
        [/class]
        [class=credit]
        position: absolute;
        top: 479px;
                left: 333px;
        overflow: hidden;
        width: 467px;
        height: 14px;
        text-align: center;
        font-style: normal;
        font-weight: normal;
        font-size: 8px;
        color: #42B4CD;
                opacity: 0.5;
        [/class]
[/nobr]
[div class=bkgdborder][div class=bkgd]
   [div class=pic][div class="pichover hidden"][div class=circlepic][/div][font=Righteous]outfit: xxx

mood: adventurous

tags: xxx

mentions: xxx
   [/font][/div][/div]
   [div class=name][font=Righteous]find me, first[/font][/div]
   [div class=role][font=Righteous]the voyager[/font][/div]
   [div class=textcontainer][div class=textbox][font=Raleway]Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Purus faucibus ornare suspendisse sed nisi lacus sed viverra tellus. Volutpat ac tincidunt vitae semper quis lectus nulla at volutpat. Semper feugiat nibh sed pulvinar proin gravida hendrerit lectus a. Turpis egestas maecenas pharetra convallis posuere morbi leo urna. Lacinia quis vel eros donec ac odio tempor orci. Vitae tortor condimentum lacinia quis vel. Id interdum velit laoreet id. Mauris vitae ultricies leo integer malesuada nunc. Nibh praesent tristique magna sit amet purus. Vel eros donec ac odio tempor orci. Rhoncus est pellentesque elit ullamcorper dignissim cras tincidunt lobortis feugiat. Vel pretium lectus quam id leo in vitae turpis massa. Duis convallis convallis tellus id interdum velit laoreet.

At auctor urna nunc id cursus metus aliquam eleifend. Odio euismod lacinia at quis risus sed vulputate. Augue lacus viverra vitae congue eu consequat. Ac orci phasellus egestas tellus rutrum tellus pellentesque eu. Ac placerat vestibulum lectus mauris ultrices eros in cursus. Adipiscing commodo elit at imperdiet dui. Elit ut aliquam purus sit. Leo vel orci porta non pulvinar. Mattis nunc sed blandit libero. Mi eget mauris pharetra et ultrices neque ornare aenean. Est pellentesque elit ullamcorper dignissim cras. Quis risus sed vulputate odio ut enim. Amet volutpat consequat mauris nunc congue nisi. Cursus vitae congue mauris rhoncus aenean. Fusce ut placerat orci nulla pellentesque dignissim enim. Sollicitudin tempor id eu nisl nunc mi ipsum. Feugiat in ante metus dictum at tempor commodo ullamcorper. Sem et tortor consequat id porta nibh venenatis.

Quis varius quam quisque id diam vel quam elementum pulvinar. Rhoncus mattis rhoncus urna neque. Faucibus a pellentesque sit amet. Dui vivamus arcu felis bibendum ut tristique et egestas quis. Sit amet consectetur adipiscing elit pellentesque. Vulputate eu scelerisque felis imperdiet proin. Neque viverra justo nec ultrices dui. Integer feugiat scelerisque varius morbi. Quisque id diam vel quam. Viverra nam libero justo laoreet sit. Ridiculus mus mauris vitae ultricies. Turpis egestas maecenas pharetra convallis posuere. Tortor consequat id porta nibh venenatis cras. Purus in massa tempor nec feugiat nisl pretium fusce. Consectetur lorem donec massa sapien faucibus et molestie ac feugiat. Non curabitur gravida arcu ac tortor dignissim convallis aenean et. Bibendum enim facilisis gravida neque convallis a cras. Lobortis scelerisque fermentum dui faucibus in ornare quam viverra orci. Viverra maecenas accumsan lacus vel. Dolor sit amet consectetur adipiscing elit duis tristique sollicitudin.

Ut ornare lectus sit amet est placerat. Tellus in hac habitasse platea dictumst vestibulum rhoncus. Ultrices dui sapien eget mi proin sed libero enim sed. Pellentesque elit eget gravida cum sociis. Ipsum dolor sit amet consectetur adipiscing. Mattis ullamcorper velit sed ullamcorper morbi tincidunt. Ut morbi tincidunt augue interdum. Enim praesent elementum facilisis leo. Et malesuada fames ac turpis egestas maecenas pharetra convallis. Sed blandit libero volutpat sed. Feugiat nisl pretium fusce id. At tempor commodo ullamcorper a lacus vestibulum. Viverra accumsan in nisl nisi scelerisque eu ultrices vitae. Nisl vel pretium lectus quam. Amet aliquam id diam maecenas ultricies mi eget mauris. Lectus urna duis convallis convallis tellus id interdum velit. Morbi blandit cursus risus at ultrices mi tempus. Diam vulputate ut pharetra sit amet aliquam id diam. Quisque sagittis purus sit amet volutpat consequat mauris nunc.

Pharetra vel turpis nunc eget lorem dolor sed viverra ipsum. Ut tortor pretium viverra suspendisse potenti nullam. Tellus in metus vulputate eu. Magna sit amet purus gravida. Purus faucibus ornare suspendisse sed nisi lacus. Ornare aenean euismod elementum nisi quis eleifend quam. Gravida dictum fusce ut placerat orci nulla pellentesque dignissim. Nec feugiat in fermentum posuere urna. Id ornare arcu odio ut sem nulla. Tristique senectus et netus et malesuada. Quam adipiscing vitae proin sagittis nisl rhoncus mattis rhoncus. Purus in massa tempor nec feugiat nisl pretium fusce. Enim eu turpis egestas pretium. Volutpat maecenas volutpat blandit aliquam etiam. Ac ut consequat semper viverra nam libero justo laoreet. Tristique magna sit amet purus gravida quis blandit turpis.

   [/font][/div][/div]
[div class=credit]code by [USER=2383]sox[/USER][/div][/div][/div]
 
Last edited:
chezmoi said:
TWITTER - NOT MOBILE FRIENDLY

this was one of those codes where halfway through, i questioned my entire existence and purpose on this earth, but i was already too far into it to back out. the code is long as hell and difficult to navigate, but if you rly wanna use it, by all means be my guest lmao the tweets section scrolls, as do the bodies of each individual tweet. please do not remove the credit! i'm gonna go pretend i don't have carpal tunnel.


[class=twitterpage] position: relative; box-sizing: border-box; background: #E5E5E5; width: 808px; height: 700px; background-color: rgba(255,255,255,1); overflow: hidden; margin: auto; padding: 0; cursor: url(https://imgur.com/5ex8RXq.png), auto; [/class] [class=tweetsmedia] position: absolute; overflow: visible; width: 400px; height: 34px; left: 194px; top: 385px; font-family: Open Sans; line-height: 23px; font-size: 12px; color: #707070; [/class] [class=tweetpanel] position: relative; overflow: auto; width: 415px; height: 305px; top: 0px; left: 0px; background: #fff; [/class] [class=tweetpanelcontainer] position: absolute; overflow: hidden; width: 398px; height: 290px; left: 195px; top: 412px; background: #fff; border: 1px solid #CECECE; [/class] [class=twtribbon] position: absolute; overflow: visible; width: 400px; height: 42px; left: 194px; top: 48px; background: #fff; border: 1px solid #CECECE; [/class] [class=ribbon] position: absolute; overflow: visible; width: 809px; height: 48px; left: 0px; top: 0px; background: #b3b3b3; [/class] [class=url] position: absolute; overflow: visible; width: 715px; height: 23px; left: 76px; top: 13px; background: #fff; border: 1px solid #fff; border-radius: 15px; font-family: Open Sans; line-height: 23px; font-size: 10px; color: #707070; [/class] [class=leftpanel] position: absolute; overflow: visible; width: 194px; height: 652px; left: 0px; top: 48px; background: #fff; border: 1px solid #CECECE; [/class] [class=rightpanel] position: absolute; overflow: visible; width: 215px; height: 652px; left: 594px; top: 48px; background: #fff; border: 1px solid #CECECE; [/class] [class=header] position: absolute; overflow: visible; width: 400px; height: 132px; left: 195px; top: 90px; background-image: url(https://i.pinimg.com/564x/c3/7f/29/c37f29e840a1d8333bc15edffc1c2a37.jpg); background-size: 100%; background-position: 50% 60%; [/class] [class=pfp] position: absolute; overflow: visible; width: 97px; height: 97px; left: 204px; top: 174px; background-image: url(https://i.pinimg.com/564x/d7/b2/84/d7b28458a46981343a3e62d6e59852da.jpg); border: 3px solid #fff; border-radius: 50%; background-size: 100%; background-position: 50% 0%; [/class] [class=twticon] position: absolute; overflow: visible; width: 40px; height: 40px; left: 9px; top: 9px; background-image: url(https://cdn2.iconfinder.com/data/icons/minimalism/512/twitter.png); background-size: 100%; background-position: 50% 0%; [/class] [class=description] position: absolute; overflow: visible; width: 381px; height: 29px; left: 204px; top: 322px; color: #000; font-size: 11px; font-family: Open Sans; line-height: 14px; [/class] [class=menu] position: absolute; overflow: visible; width: 194px; height: 388px; left: 0px; top: 58px; background-image: url(https://imgur.com/OyQfYvR.png); background-size: 100%; background-position: 50% 0%; [/class] [class=writetweet] position: absolute; overflow: visible; width: 159px; height: 36px; left: 18px; top: 455px; background: #1DA1F2; border-radius: 25px; color: #fff; line-height: 35px; font-size: 14px; font-family: Source Sans Pro; text-align: center; [/class] [class=name] position: absolute; overflow: visible; width: 239px; height: 13px; left: 204px; top: 283px; color: #000; font-size: 16px; font-family: Source Sans Pro; [/class] [class=handle] position: absolute; overflow: visible; width: 239px; height: 13px; left: 204px; top: 303px; color: #707070; font-size: 11px; font-family: Open Sans; [/class] [class=follow] position: absolute; overflow: visible; width: 68px; height: 23px; left: 517px; top: 234px; border: 1px solid #1DA1F2; border-radius: 25px; color: #1DA1F2; line-height: 22px; font-size: 10px; font-family: Source Sans Pro; text-align: center; [/class] [class=searchbar] position: absolute; overflow: visible; width: 181px; height: 28px; left: 16px; top: 7px; background: #DEDEDE; border-radius: 25px; color: #828282; line-height: 28px; font-size: 12px; font-family: Open Sans; text-align: center; [/class] [class=sidepic1] position: absolute; overflow: visible; width: 60px; height: 60px; left: 17px; top: 49px; background-image: url(https://i.pinimg.com/originals/fe/24/bc/fe24bc9c689ffa906a30e8918403c686.gif); background-size: 100%; background-position: 50% 0%; border: 1px solid #fff; [/class] [class=sidepic2] position: absolute; overflow: visible; width: 60px; height: 60px; left: 77px; top: 49px; background-image: url(https://i.pinimg.com/564x/12/fe/b1/12feb1a16b5319d443dd802802ca217c.jpg); background-size: 100%; background-position: 50% 0%; border: 1px solid #fff; [/class] [class=sidepic3] position: absolute; overflow: visible; width: 60px; height: 60px; left: 137px; top: 49px; background-image: url(https://i.pinimg.com/originals/1e/97/a2/1e97a21493efe888c1ff799ee802fa8f.gif); background-size: 150%; background-position: 50% 50%; border: 1px solid #fff; [/class] [class=sidepic4] position: absolute; overflow: visible; width: 60px; height: 60px; left: 17px; top: 109px; background-image: url(https://i.pinimg.com/564x/ee/2b/aa/ee2baa8a5878e39adc1daaa6d757a365.jpg); background-size: 100%; background-position: 50% 0%; border: 1px solid #fff; [/class] [class=sidepic5] position: absolute; overflow: visible; width: 60px; height: 60px; left: 77px; top: 109px; background-image: url(https://i.pinimg.com/originals/34/ec/54/34ec543b0ae06a129efdad5412134fe9.gif); background-size: 100%; background-position: 50% 0%; border: 1px solid #fff; [/class] [class=sidepic6] position: absolute; overflow: visible; width: 60px; height: 60px; left: 137px; top: 109px; background-image: url(https://i.pinimg.com/564x/0c/d1/95/0cd1951d4c49405e2a1dbf74a00c6e47.jpg); background-size: 100%; background-position: 50% 0%; border: 1px solid #fff; [/class] [class=followcount] position: absolute; overflow: visible; width: 173px; height: 15px; left: 204px; top: 360px; color: #000; font-size: 12px; font-family: Open Sans; [/class] [class=tweet] position: relative; overflow: visible; width: 398px; height: 205px; left: 0px; top: 0px; background: #fff; border-bottom: 1px solid #cecece; [/class] [class=tweetpfp] position: absolute; overflow: visible; width: 29px; height: 28px; left: 7px; top: 7px; background-image: url(https://i.pinimg.com/564x/d7/b2/84/d7b28458a46981343a3e62d6e59852da.jpg); border-radius: 50%; background-size: 100%; background-position: 50% 0%; [/class] [class=tweetbody] position: absolute; overflow: auto; width: 355px; height: 150px; left: 0px; top: 0px; text-align: justify; color: #000; font-size: 10px; font-family: Open Sans; line-height: 12px; padding-right: 5px; [/class] [class=tweetbodycontainer] position: absolute; overflow: hidden; width: 343px; height: 150px; left: 42px; top: 26px; [/class] [class=tweetname] position: absolute; overflow: visible; width: 173px; height: 11px; left: 42px; top: 7px; color: #000; font-size: 12px; font-family: Source Sans Pro; [/class] [class=ribbonname] position: absolute; overflow: visible; width: 148px; height: 20px; left: 42px; top: 5px; color: #000; font-size: 14px; font-family: Source Sans Pro; text-align: left; [/class] [class=tweetcount] position: absolute; overflow: visible; width: 67px; height: 9px; left: 42px; top: 22px; color: #1f1f1f; font-size: 10px; font-style: Open Sans; text-align: left; [/class] [class=tos] position: absolute; overflow: visible; width: 181px; height: 35px; left: 17px; top: 175px; background-image: url(https://imgur.com/lCxkrS0.png); background-size: 100%; background-position: 10% 0%; [/class] [class=credit] position: absolute; overflow: visible; width: 148px; height: 15px; left: 22px; top: 210px; background: #fff; font-size: 6px; color: #dedede; [/class] [class=backhome] position: absolute; overflow: visible; width: 19px; height: 19px; left: 200px; top: 60px; background-image: url(http://pixsector.com/cache/a8009c95/av8a49a4f81c3318dc69d.png); background-size: 100%; background-position: 50% 0%; [/class] [class=back] position: absolute; overflow: visible; width: 19px; height: 19px; left: 9px; top: 15px; background-image: url(http://pixsector.com/cache/a8009c95/av8a49a4f81c3318dc69d.png); background-size: 115%; background-position: 50% 50%; [/class] [class=forward] position: absolute; overflow: visible; width: 19px; height: 19px; left: 30px; top: 15px; background-image: url(http://pixsector.com/cache/ef1ee4a1/av85f1b171d762037fe92.png); background-size: 100%; background-position: 50% 0%; [/class] [class=refresh] position: absolute; overflow: visible; width: 19px; height: 19px; left: 51px; top: 15px; background-image: url(https://www.pngrepo.com/download/178337/refresh-arrows.png); background-size: 100%; background-position: 50% 10%; [/class] [class=retweets] position: absolute; overflow: visible; width: 173px; height: 11px; left: 43px; top: 185px; [/class] [class=reply] position: absolute; overflow: visible; width: 14px; height: 13px; left: 0px; top: 0px; background-image: url(https://imgur.com/MOz3F5v.png); background-size: 100%; background-position: 50% 0%; [/class] [class=rt] position: absolute; overflow: visible; width: 16px; height: 11px; left: 50px; top: 0px; background-image: url(https://imgur.com/PHgTalR.png); background-size: 105%; background-position: 50% 0%; [/class] [class=like] position: absolute; overflow: visible; width: 14px; height: 13px; left: 100px; top: 0px; background-image: url(https://imgur.com/l9Sg3lD.png); background-size: 100%; background-position: 50% 0%; [/class] [div class=twitterpage] [div class=ribbon] [div class=forward][/div] [div class=back][/div] [div class=refresh][/div] [div class=url]---https:///twitter.corn/[/div] [/div] [div class=leftpanel] [div class=twticon][/div] [div class=menu][/div] [div class=writetweet]Tweet[/div] [/div] [div class=rightpanel] [div class=searchbar]Search Twitter[/div] [div class=sidepic1][/div] [div class=sidepic2][/div] [div class=sidepic3][/div] [div class=sidepic4][/div] [div class=sidepic5][/div] [div class=sidepic6][/div] [div class=tos][/div] [div class=credit]code by sox sox [/div] [/div] [div class=twtribbon][div class=ribbonname]Lee Taemin[/div][div class=tweetcount]1,988 Tweets[/div][/div] [div class=header][/div] [div class=backhome][/div] [div class=pfp][/div] [div class=follow]Follow[/div] [div class=name]Lee Taemin[/div] [div class=handle]@taeminlee[/div] [div class=description]not a single facial expression, not a single sentence can express all of you. we're perfect just the way we are. | singer-songwriter from korea[/div] [div class=followcount]23 Following----1.1M Followers[/div] [div class=tweetsmedia]--------Tweets-----------Tweets & Replies-----------Media-----------Likes[/div] [div class=tweetpanelcontainer][div class=tweetpanel] [div class=tweet] [div class=tweetpfp][/div] [div class=tweetname]Basics - @taeminlee[/div] [div class=tweetbodycontainer][div class=tweetbody]Name: Lee Taemin

Age: 26

Gender: Male

Sexuality: Heterosexual

Role: Male

Occupation: Singer-songwriter, professional dancer, and member of the South Korean group SHINee

Birthday: Male

Height: Male

Weight: Male

Body Type: Male

Hair Color: Brown

Eye Color: Brown

Body Mods: Ear piercings [/div][/div] [div class=retweets][div class=reply][/div][div class=rt][/div][div class=like][/div][/div] [/div] [div class=tweet] [div class=tweetpfp][/div] [div class=tweetname]Persona - @taeminlee[/div] [div class=tweetbodycontainer][div class=tweetbody]Personality: Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Venenatis lectus magna fringilla urna porttitor. Consectetur purus ut faucibus pulvinar elementum integer enim neque. Sed egestas egestas fringilla phasellus. Fames ac turpis egestas maecenas. Fermentum posuere urna nec tincidunt praesent semper. Nibh tortor id aliquet lectus proin nibh nisl condimentum. Malesuada pellentesque elit eget gravida cum. Leo vel fringilla est ullamcorper eget nulla facilisi etiam dignissim. Vel pharetra vel turpis nunc eget lorem. Tempor orci dapibus ultrices in iaculis nunc. Diam vel quam elementum pulvinar etiam non.

Likes: Faucibus purus in massa tempor. Aliquam sem et tortor consequat. Quis vel eros donec ac odio. Amet justo donec enim diam vulputate ut pharetra sit. Id leo in vitae turpis massa sed elementum. Ac feugiat sed lectus vestibulum mattis ullamcorper velit sed ullamcorper. Sit amet volutpat consequat mauris nunc congue nisi. Erat nam at lectus urna duis convallis. Nam aliquam sem et tortor consequat. Netus et malesuada fames ac turpis egestas. Magna eget est lorem ipsum. Eget mi proin sed libero enim sed faucibus. Nibh mauris cursus mattis molestie.

Dislikes: Fames ac turpis egestas maecenas. Fermentum posuere urna nec tincidunt praesent semper. Nibh tortor id aliquet lectus proin nibh nisl condimentum. Malesuada pellentesque elit eget gravida cum. Leo vel fringilla est ullamcorper eget nulla facilisi etiam dignissim. Vel pharetra vel turpis nunc eget lorem. Faucibus purus in massa tempor. Aliquam sem et tortor consequat. Quis vel eros donec ac odio. Amet justo donec enim diam vulputate ut pharetra sit. [/div][/div] [div class=retweets][div class=reply][/div][div class=rt][/div][div class=like][/div][/div] [/div] [div class=tweet] [div class=tweetpfp][/div] [div class=tweetname]Background - @taeminlee[/div] [div class=tweetbodycontainer][div class=tweetbody]History: Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Venenatis lectus magna fringilla urna porttitor. Consectetur purus ut faucibus pulvinar elementum integer enim neque. Sed egestas egestas fringilla phasellus. Fames ac turpis egestas maecenas. Fermentum posuere urna nec tincidunt praesent semper. Nibh tortor id aliquet lectus proin nibh nisl condimentum. Malesuada pellentesque elit eget gravida cum. Leo vel fringilla est ullamcorper eget nulla facilisi etiam dignissim. Vel pharetra vel turpis nunc eget lorem. Tempor orci dapibus ultrices in iaculis nunc. Diam vel quam elementum pulvinar etiam non.

Family: Faucibus purus in massa tempor. Aliquam sem et tortor consequat. Quis vel eros donec ac odio. Amet justo donec enim diam vulputate ut pharetra sit. Id leo in vitae turpis massa sed elementum. Ac feugiat sed lectus vestibulum mattis ullamcorper velit sed ullamcorper. Sit amet volutpat consequat mauris nunc congue nisi. Erat nam at lectus urna duis convallis. Nam aliquam sem et tortor consequat. Netus et malesuada fames ac turpis egestas. Magna eget est lorem ipsum. Eget mi proin sed libero enim sed faucibus. Nibh mauris cursus mattis molestie.

Relationships: Fames ac turpis egestas maecenas. Fermentum posuere urna nec tincidunt praesent semper. Nibh tortor id aliquet lectus proin nibh nisl condimentum. Malesuada pellentesque elit eget gravida cum. Leo vel fringilla est ullamcorper eget nulla facilisi etiam dignissim. Vel pharetra vel turpis nunc eget lorem. Faucibus purus in massa tempor. Aliquam sem et tortor consequat. Quis vel eros donec ac odio. Amet justo donec enim diam vulputate ut pharetra sit. [/div][/div] [div class=retweets][div class=reply][/div][div class=rt][/div][div class=like][/div][/div] [/div]
[/div][/div] [/div]
Pastebin: xxx​
Click to expand...
taemin and a gorgeous code?? i'm in love
 
HEART THROB - NOT MOBILE FRIENDLY [MF VERSION INCLUDED]

it's a not basic cs for the first time ever!!!! i made this for vee's halloween rp but i rly like it so here ya go !! all the text boxes scroll and there are two different types of tags that you can use as headers in each subsection. there's a mobile friendly version down there too in the spoiler just bc : ) enjoy! also mf stands for mobile friendly not mofo ok bye

[class=bkgd] position: relative; box-sizing: border-box; width: 705px; height: 400px; background-color: #FF7F51; box-shadow: 3px 3px #8B002E; border-radius: 10px; overflow: hidden; margin-right: auto; margin-left: auto; padding: 0; [/class] [class=name] position: absolute; overflow: visible; width: 289px; height: 44px; left: 18px; top: 0px; font-size: 45px; text-transform: uppercase; color: #CE4257; text-shadow: 2.5px 2.5px #4F000B; [/class] [class=line] overflow: visible; position: absolute; top: 63px; left: 18px; width: 667px; height: 5px; background-color: #FFB078; border-radius: 10px; box-shadow: 2px 2px #8B002E; [/class] [class=role] position: absolute; overflow: visible; width: 400px; height: 27px; left: 285px; top: 26px; font-size: 25px; text-transform: uppercase; text-align: right; color: #8B002E; text-shadow: 1px 1px #4F000B; [/class] [class=basicscont] position: absolute; overflow: hidden; width: 243px; height: 126px; left: 18px; top: 97px; background-color: #CE4257; border-radius: 10px; box-shadow: 3px 3px #8B002E; [/class] [class=basicstext] position: relative; overflow: auto; width: 252px; height: 115px; font-size: 10px; text-transform: lowercase; line-height: 11px; color: #FFB078; padding: 5px; text-align: justify; [/class] [class=personacont] position: absolute; overflow: hidden; width: 243px; height: 126px; left: 18px; top: 256px; background-color: #CE4257; border-radius: 10px; box-shadow: 3px 3px #8B002E; [/class] [class=personatext] position: relative; overflow: auto; width: 252px; height: 115px; font-size: 10px; text-transform: lowercase; line-height: 11px; color: #FFB078; padding: 5px; text-align: justify; [/class] [class=histcont] position: absolute; overflow: hidden; width: 243px; height: 126px; top: 97px; left: 443px; background-color: #CE4257; border-radius: 10px; box-shadow: 3px 3px #8B002E; [/class] [class=histtext] position: relative; overflow: auto; width: 252px; height: 115px; font-size: 10px; text-transform: lowercase; line-height: 11px; color: #FFB078; padding: 5px; text-align: justify; [/class] [class=othercont] position: absolute; overflow: hidden; width: 243px; height: 126px; left: 443px; top: 256px; background-color: #CE4257; border-radius: 10px; box-shadow: 3px 3px #8B002E; [/class] [class=othertext] position: relative; overflow: auto; width: 252px; height: 115px; font-size: 10px; text-transform: lowercase; line-height: 11px; color: #FFB078; padding: 5px; text-align: justify; [/class] [class=pic] overflow: visible; position: absolute; top: 164px; left: 279px; width: 145px; height: 145px; background: url(https://imgur.com/IAhDnk4.png); background-size: 200%; background-position: 70% 0%; border: 2px solid #FF9B54; border-radius: 100px; box-shadow: 3px 3px #8B002E; [/class] [class=tag] display: inline-block; overflow: hidden; height: auto; background-color: #8B002E; border-radius: 10px; font-size: 10px; text-transform: uppercase; text-align: center; font-weight: 700; color: #FFB078; box-shadow: 1px 2px #4F000B; padding-left: 5px; padding-right: 5px; margin-right: 3px; [/class] [class=tagb] display: inline-block; overflow: hidden; width: 220px; height: auto; background-color: #8B002E; border-radius: 10px; font-size: 10px; text-transform: uppercase; text-align: center; font-weight: 700; color: #FFB078; box-shadow: 1px 2px #4F000B; padding-left: 5px; padding-right: 5px; margin-bottom: 4px; [/class] [class=basics] position: absolute; overflow: visible; width: 89px; height: 14px; left: 20px; top: 71px; text-shadow: 1px 1px #4F000B; font-size: 20px; text-transform: uppercase; color: #8B002E; [/class] [class=persona] position: absolute; overflow: visible; width: 89px; height: 18px; left: 18px; top: 230px; text-shadow: 1px 1px #4F000B; font-size: 20px; text-transform: uppercase; color: #8B002E; [/class] [class=hist] position: absolute; overflow: visible; width: 150px; height: 18px; left: 443px; top: 71px; text-shadow: 1px 1px #4F000B; font-size: 20px; text-transform: uppercase; color: #8B002E; [/class] [class=other] position: absolute; overflow: visible; width: 89px; height: 18px; left: 443px; top: 230px; text-shadow: 1px 1px #4F000B; font-size: 20px; text-transform: uppercase; color: #8B002E; [/class] [class=topleft] overflow: visible; position: absolute; top: 134.482px; left: 284.866px; width: 33.689px; height: 33.689px; background-color: #FFB078; border-radius: 100px; box-shadow: 2px 2px #8B002E; [/class] [class=toppic] overflow: visible; position: absolute; top: 97px; left: 322.97px; width: 57.091px; height: 57.171px; background: url(https://i.pinimg.com/564x/a6/99/86/a6998608bdc250f9d18b702febf61347.jpg); background-size: 300%; background-position: 35% 30%; border: 2px solid #FF9B54; border-radius: 100px; box-shadow: 3px 3px #8B002E; [/class] [class=topright] overflow: visible; position: absolute; top: 134.482px; left: 390.97px; width: 33.689px; height: 33.689px; background-color: #FFB078; border-radius: 100px; box-shadow: 2px 2px #8B002E; [/class] [class=bottompic] overflow: visible; position: absolute; top: 318px; left: 322.97px; width: 57.091px; height: 57.171px; background: url(https://i.pinimg.com/564x/e4/38/ae/e438ae2d9c2c2fba0382865792a8602b.jpg); background-size: 210%; background-position: 40% 10%; border: 2px solid #FF9B54; border-radius: 100px; box-shadow: 3px 3px #8B002E; [/class] [class=bottomleft] overflow: visible; position: absolute; top: 305.585px; left: 284.866px; width: 33.689px; height: 33.689px; background-color: #FFB078; border-radius: 100px; box-shadow: 2px 2px #8B002E; [/class] [class=bottomright] overflow: visible; position: absolute; top: 305.585px; left: 390.97px; width: 33.689px; height: 33.689px; background-color: #FFB078; border-radius: 100px; box-shadow: 2px 2px #8B002E; [/class] [class=credit] position: absolute; top: 384px; left: 120px; overflow: hidden; width: 467px; height: 14px; text-align: center; font-style: normal; font-weight: normal; font-size: 8px; color: #FFB078; opacity: 0.8; [/class]
[div class=bkgd]
[div class=name]rafael miller[/div]
[div class=role]the heart throb[/div]
[div class=line][/div]
[div class=basics]basics[/div]
[div class=persona]persona[/div]
[div class=hist]background[/div]
[div class=other]other[/div]
[div class=basicscont][div class=basicstext][div class=tag]name:[/div] rafael miller

[div class=tag]nickname:[/div] raffy, white water raff, windmill

[div class=tag]age:[/div] 22

[div class=tag]birthday:[/div] june 23

[div class=tag]gender:[/div] male

[div class=tag]sexuality:[/div] heterosexual

[div class=tag]role:[/div] generic hot guy

[div class=tag]hair color:[/div] dark brown

[div class=tag]eye color:[/div] light brown

[div class=tag]height:[/div] 6' 3"

[div class=tag]build/body type:[/div] Lean, extremely fit, but not too bulky | Mesomorph

[div class=tag]distinguishing features:[/div] tattoos xxx

[div class=tag]attire:[/div] xxx

[div class=tag]faceclaim:[/div] rafael miller
[/div][/div]
[div class=personacont][div class=personatext][div class=tagb]"So you wanna get to know me, do you now?"[/div]
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Eu volutpat odio facilisis mauris sit. Auctor urna nunc id cursus metus aliquam eleifend mi in. Mus mauris vitae ultricies leo integer. Adipiscing elit pellentesque habitant morbi tristique. Nam at lectus urna duis convallis. Diam vel quam elementum pulvinar etiam non quam. Duis ut diam quam nulla porttitor massa id neque. Et ultrices neque ornare aenean euismod. Nunc mi ipsum faucibus vitae aliquet. Non odio euismod lacinia at quis risus sed. Odio eu feugiat pretium nibh ipsum consequat nisl vel pretium.

Felis bibendum ut tristique et. Massa eget egestas purus viverra. Sed sed risus pretium quam. Dictum fusce ut placerat orci nulla pellentesque dignissim enim. Nibh tortor id aliquet lectus proin nibh nisl condimentum id. Id aliquet lectus proin nibh. Ultrices in iaculis nunc sed augue. Adipiscing elit pellentesque habitant morbi tristique. Mattis rhoncus urna neque viverra justo nec ultrices dui. Sodales neque sodales ut etiam sit amet nisl purus in. Congue eu consequat ac felis donec. Dapibus ultrices in iaculis nunc sed augue lacus. Gravida arcu ac tortor dignissim convallis aenean.

Morbi tincidunt augue interdum velit euismod. Nulla porttitor massa id neque aliquam vestibulum. Sed blandit libero volutpat sed cras. Enim eu turpis egestas pretium aenean. Sed odio morbi quis commodo. Nulla posuere sollicitudin aliquam ultrices. Venenatis urna cursus eget nunc. Tortor pretium viverra suspendisse potenti nullam ac. Orci a scelerisque purus semper eget. Habitant morbi tristique senectus et netus et malesuada fames. Ut venenatis tellus in metus vulputate eu scelerisque felis imperdiet. Ornare massa eget egestas purus viverra accumsan in nisl. At augue eget arcu dictum varius duis at consectetur. Id nibh tortor id aliquet lectus proin. Sagittis id consectetur purus ut. Pharetra et ultrices neque ornare aenean euismod elementum nisi quis. Suspendisse sed nisi lacus sed viverra tellus. Sodales neque sodales ut etiam sit amet nisl purus in.

Sem fringilla ut morbi tincidunt augue interdum. Egestas purus viverra accumsan in nisl nisi. Vitae purus faucibus ornare suspendisse sed nisi lacus sed viverra. Lacus vestibulum sed arcu non odio. Risus in hendrerit gravida rutrum quisque non tellus. Odio eu feugiat pretium nibh ipsum consequat nisl. Dignissim convallis aenean et tortor at risus viverra. Neque gravida in fermentum et sollicitudin ac. Nullam ac tortor vitae purus faucibus ornare suspendisse sed. Arcu dictum varius duis at consectetur lorem donec. Id eu nisl nunc mi. Placerat vestibulum lectus mauris ultrices eros in cursus. Vel pretium lectus quam id leo in vitae turpis. Neque laoreet suspendisse interdum consectetur libero id faucibus. Sagittis purus sit amet volutpat consequat mauris. Ultricies tristique nulla aliquet enim tortor at auctor urna nunc. Aliquam nulla facilisi cras fermentum odio eu feugiat. Eget arcu dictum varius duis at consectetur lorem.

Placerat duis ultricies lacus sed turpis tincidunt. Purus non enim praesent elementum facilisis leo vel fringilla. Duis ut diam quam nulla porttitor massa id. In fermentum et sollicitudin ac. Metus dictum at tempor commodo ullamcorper a lacus vestibulum. Varius sit amet mattis vulputate enim nulla aliquet porttitor. Dictum sit amet justo donec enim diam vulputate ut pharetra. In egestas erat imperdiet sed euismod nisi porta lorem mollis. In iaculis nunc sed augue lacus. Dictumst quisque sagittis purus sit amet. Varius duis at consectetur lorem. Et egestas quis ipsum suspendisse ultrices gravida dictum fusce ut. Donec et odio pellentesque diam. Laoreet id donec ultrices tincidunt arcu non. In arcu cursus euismod quis viverra nibh cras pulvinar mattis. Lorem ipsum dolor sit amet consectetur adipiscing elit duis. Metus vulputate eu scelerisque felis imperdiet proin fermentum leo vel. Cras sed felis eget velit aliquet sagittis id. Sagittis nisl rhoncus mattis rhoncus urna. Tellus at urna condimentum mattis pellentesque.

[div class=tagb]"So does everybody else."[/div]
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Eu volutpat odio facilisis mauris sit. Auctor urna nunc id cursus metus aliquam eleifend mi in. Mus mauris vitae ultricies leo integer. Adipiscing elit pellentesque habitant morbi tristique. Nam at lectus urna duis convallis. Diam vel quam elementum pulvinar etiam non quam. Duis ut diam quam nulla porttitor massa id neque. Et ultrices neque ornare aenean euismod. Nunc mi ipsum faucibus vitae aliquet. Non odio euismod lacinia at quis risus sed. Odio eu feugiat pretium nibh ipsum consequat nisl vel pretium.

Felis bibendum ut tristique et. Massa eget egestas purus viverra. Sed sed risus pretium quam. Dictum fusce ut placerat orci nulla pellentesque dignissim enim. Nibh tortor id aliquet lectus proin nibh nisl condimentum id. Id aliquet lectus proin nibh. Ultrices in iaculis nunc sed augue. Adipiscing elit pellentesque habitant morbi tristique. Mattis rhoncus urna neque viverra justo nec ultrices dui. Sodales neque sodales ut etiam sit amet nisl purus in. Congue eu consequat ac felis donec. Dapibus ultrices in iaculis nunc sed augue lacus. Gravida arcu ac tortor dignissim convallis aenean.

Morbi tincidunt augue interdum velit euismod. Nulla porttitor massa id neque aliquam vestibulum. Sed blandit libero volutpat sed cras. Enim eu turpis egestas pretium aenean. Sed odio morbi quis commodo. Nulla posuere sollicitudin aliquam ultrices. Venenatis urna cursus eget nunc. Tortor pretium viverra suspendisse potenti nullam ac. Orci a scelerisque purus semper eget. Habitant morbi tristique senectus et netus et malesuada fames. Ut venenatis tellus in metus vulputate eu scelerisque felis imperdiet. Ornare massa eget egestas purus viverra accumsan in nisl. At augue eget arcu dictum varius duis at consectetur. Id nibh tortor id aliquet lectus proin. Sagittis id consectetur purus ut. Pharetra et ultrices neque ornare aenean euismod elementum nisi quis. Suspendisse sed nisi lacus sed viverra tellus. Sodales neque sodales ut etiam sit amet nisl purus in.

Sem fringilla ut morbi tincidunt augue interdum. Egestas purus viverra accumsan in nisl nisi. Vitae purus faucibus ornare suspendisse sed nisi lacus sed viverra. Lacus vestibulum sed arcu non odio. Risus in hendrerit gravida rutrum quisque non tellus. Odio eu feugiat pretium nibh ipsum consequat nisl. Dignissim convallis aenean et tortor at risus viverra. Neque gravida in fermentum et sollicitudin ac. Nullam ac tortor vitae purus faucibus ornare suspendisse sed. Arcu dictum varius duis at consectetur lorem donec. Id eu nisl nunc mi. Placerat vestibulum lectus mauris ultrices eros in cursus. Vel pretium lectus quam id leo in vitae turpis. Neque laoreet suspendisse interdum consectetur libero id faucibus. Sagittis purus sit amet volutpat consequat mauris. Ultricies tristique nulla aliquet enim tortor at auctor urna nunc. Aliquam nulla facilisi cras fermentum odio eu feugiat. Eget arcu dictum varius duis at consectetur lorem.

Placerat duis ultricies lacus sed turpis tincidunt. Purus non enim praesent elementum facilisis leo vel fringilla. Duis ut diam quam nulla porttitor massa id. In fermentum et sollicitudin ac. Metus dictum at tempor commodo ullamcorper a lacus vestibulum. Varius sit amet mattis vulputate enim nulla aliquet porttitor. Dictum sit amet justo donec enim diam vulputate ut pharetra. In egestas erat imperdiet sed euismod nisi porta lorem mollis. In iaculis nunc sed augue lacus. Dictumst quisque sagittis purus sit amet. Varius duis at consectetur lorem. Et egestas quis ipsum suspendisse ultrices gravida dictum fusce ut. Donec et odio pellentesque diam. Laoreet id donec ultrices tincidunt arcu non. In arcu cursus euismod quis viverra nibh cras pulvinar mattis. Lorem ipsum dolor sit amet consectetur adipiscing elit duis. Metus vulputate eu scelerisque felis imperdiet proin fermentum leo vel. Cras sed felis eget velit aliquet sagittis id. Sagittis nisl rhoncus mattis rhoncus urna. Tellus at urna condimentum mattis pellentesque.

[/div][/div]
[div class=histcont][div class=histtext][div class=tag]Family:[/div] What's it to you, creep? He's got a family, and that's that.

[div class=tag]History:[/div] Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Eu volutpat odio facilisis mauris sit. Auctor urna nunc id cursus metus aliquam eleifend mi in. Mus mauris vitae ultricies leo integer. Adipiscing elit pellentesque habitant morbi tristique. Nam at lectus urna duis convallis. Diam vel quam elementum pulvinar etiam non quam. Duis ut diam quam nulla porttitor massa id neque. Et ultrices neque ornare aenean euismod. Nunc mi ipsum faucibus vitae aliquet. Non odio euismod lacinia at quis risus sed. Odio eu feugiat pretium nibh ipsum consequat nisl vel pretium.

Felis bibendum ut tristique et. Massa eget egestas purus viverra. Sed sed risus pretium quam. Dictum fusce ut placerat orci nulla pellentesque dignissim enim. Nibh tortor id aliquet lectus proin nibh nisl condimentum id. Id aliquet lectus proin nibh. Ultrices in iaculis nunc sed augue. Adipiscing elit pellentesque habitant morbi tristique. Mattis rhoncus urna neque viverra justo nec ultrices dui. Sodales neque sodales ut etiam sit amet nisl purus in. Congue eu consequat ac felis donec. Dapibus ultrices in iaculis nunc sed augue lacus. Gravida arcu ac tortor dignissim convallis aenean.

Morbi tincidunt augue interdum velit euismod. Nulla porttitor massa id neque aliquam vestibulum. Sed blandit libero volutpat sed cras. Enim eu turpis egestas pretium aenean. Sed odio morbi quis commodo. Nulla posuere sollicitudin aliquam ultrices. Venenatis urna cursus eget nunc. Tortor pretium viverra suspendisse potenti nullam ac. Orci a scelerisque purus semper eget. Habitant morbi tristique senectus et netus et malesuada fames. Ut venenatis tellus in metus vulputate eu scelerisque felis imperdiet. Ornare massa eget egestas purus viverra accumsan in nisl. At augue eget arcu dictum varius duis at consectetur. Id nibh tortor id aliquet lectus proin. Sagittis id consectetur purus ut. Pharetra et ultrices neque ornare aenean euismod elementum nisi quis. Suspendisse sed nisi lacus sed viverra tellus. Sodales neque sodales ut etiam sit amet nisl purus in.

Sem fringilla ut morbi tincidunt augue interdum. Egestas purus viverra accumsan in nisl nisi. Vitae purus faucibus ornare suspendisse sed nisi lacus sed viverra. Lacus vestibulum sed arcu non odio. Risus in hendrerit gravida rutrum quisque non tellus. Odio eu feugiat pretium nibh ipsum consequat nisl. Dignissim convallis aenean et tortor at risus viverra. Neque gravida in fermentum et sollicitudin ac. Nullam ac tortor vitae purus faucibus ornare suspendisse sed. Arcu dictum varius duis at consectetur lorem donec. Id eu nisl nunc mi. Placerat vestibulum lectus mauris ultrices eros in cursus. Vel pretium lectus quam id leo in vitae turpis. Neque laoreet suspendisse interdum consectetur libero id faucibus. Sagittis purus sit amet volutpat consequat mauris. Ultricies tristique nulla aliquet enim tortor at auctor urna nunc. Aliquam nulla facilisi cras fermentum odio eu feugiat. Eget arcu dictum varius duis at consectetur lorem.

Placerat duis ultricies lacus sed turpis tincidunt. Purus non enim praesent elementum facilisis leo vel fringilla. Duis ut diam quam nulla porttitor massa id. In fermentum et sollicitudin ac. Metus dictum at tempor commodo ullamcorper a lacus vestibulum. Varius sit amet mattis vulputate enim nulla aliquet porttitor. Dictum sit amet justo donec enim diam vulputate ut pharetra. In egestas erat imperdiet sed euismod nisi porta lorem mollis. In iaculis nunc sed augue lacus. Dictumst quisque sagittis purus sit amet. Varius duis at consectetur lorem. Et egestas quis ipsum suspendisse ultrices gravida dictum fusce ut. Donec et odio pellentesque diam. Laoreet id donec ultrices tincidunt arcu non. In arcu cursus euismod quis viverra nibh cras pulvinar mattis. Lorem ipsum dolor sit amet consectetur adipiscing elit duis. Metus vulputate eu scelerisque felis imperdiet proin fermentum leo vel. Cras sed felis eget velit aliquet sagittis id. Sagittis nisl rhoncus mattis rhoncus urna. Tellus at urna condimentum mattis pellentesque.

[/div][/div]
[div class=othercont][div class=othertext][div class=tag]Alignment:[/div] Lawful good

[div class=tag]Zodiac Sign:[/div] Cancer

[div class=tag]Theme Song:[/div] "Night Owl" by This Century

[div class=tagb]Moodboard:[/div]
Eb7w2ok.jpg


[div class=tagb]Relationships:[/div]
N/A

[/div][/div]
[div class=pic][/div]
[div class=toppic][/div]
[div class=bottompic][/div]
[div class=topleft][/div]
[div class=topright][/div]
[div class=bottomleft][/div]
[div class=bottomright][/div]
[div class=credit]code by sox sox [/div][/div]


Rafael Miller
The Heart Throb

BASICS
Name: Rafael Miller
Nickname: Raffy, White Water Faf, Windmill
Birthday | Age: June 23 | 22
Gender: Male
Sexuality: Heterosexual
Role: Generic Hot Guy
Hair color: Dark Brown
Eye color: Light Brown
Height: 6' 3"
Build | Body Type: Lean, extremely fit, but not too bulky | Mesomorph
Distinguishing features | Markings: Tattoos xxx
Attire: xxx
Faceclaim: Rafael Miller

IAhDnk4.png


PERSONA
"So you wanna get to know me, do you now?"
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Eu volutpat odio facilisis mauris sit. Auctor urna nunc id cursus metus aliquam eleifend mi in. Mus mauris vitae ultricies leo integer. Adipiscing elit pellentesque habitant morbi tristique. Nam at lectus urna duis convallis. Diam vel quam elementum pulvinar etiam non quam. Duis ut diam quam nulla porttitor massa id neque. Et ultrices neque ornare aenean euismod. Nunc mi ipsum faucibus vitae aliquet. Non odio euismod lacinia at quis risus sed. Odio eu feugiat pretium nibh ipsum consequat nisl vel pretium.

Felis bibendum ut tristique et. Massa eget egestas purus viverra. Sed sed risus pretium quam. Dictum fusce ut placerat orci nulla pellentesque dignissim enim. Nibh tortor id aliquet lectus proin nibh nisl condimentum id. Id aliquet lectus proin nibh. Ultrices in iaculis nunc sed augue. Adipiscing elit pellentesque habitant morbi tristique. Mattis rhoncus urna neque viverra justo nec ultrices dui. Sodales neque sodales ut etiam sit amet nisl purus in. Congue eu consequat ac felis donec. Dapibus ultrices in iaculis nunc sed augue lacus. Gravida arcu ac tortor dignissim convallis aenean.

Morbi tincidunt augue interdum velit euismod. Nulla porttitor massa id neque aliquam vestibulum. Sed blandit libero volutpat sed cras. Enim eu turpis egestas pretium aenean. Sed odio morbi quis commodo. Nulla posuere sollicitudin aliquam ultrices. Venenatis urna cursus eget nunc. Tortor pretium viverra suspendisse potenti nullam ac. Orci a scelerisque purus semper eget. Habitant morbi tristique senectus et netus et malesuada fames. Ut venenatis tellus in metus vulputate eu scelerisque felis imperdiet. Ornare massa eget egestas purus viverra accumsan in nisl. At augue eget arcu dictum varius duis at consectetur. Id nibh tortor id aliquet lectus proin. Sagittis id consectetur purus ut. Pharetra et ultrices neque ornare aenean euismod elementum nisi quis. Suspendisse sed nisi lacus sed viverra tellus. Sodales neque sodales ut etiam sit amet nisl purus in.

Sem fringilla ut morbi tincidunt augue interdum. Egestas purus viverra accumsan in nisl nisi. Vitae purus faucibus ornare suspendisse sed nisi lacus sed viverra. Lacus vestibulum sed arcu non odio. Risus in hendrerit gravida rutrum quisque non tellus. Odio eu feugiat pretium nibh ipsum consequat nisl. Dignissim convallis aenean et tortor at risus viverra. Neque gravida in fermentum et sollicitudin ac. Nullam ac tortor vitae purus faucibus ornare suspendisse sed. Arcu dictum varius duis at consectetur lorem donec. Id eu nisl nunc mi. Placerat vestibulum lectus mauris ultrices eros in cursus. Vel pretium lectus quam id leo in vitae turpis. Neque laoreet suspendisse interdum consectetur libero id faucibus. Sagittis purus sit amet volutpat consequat mauris. Ultricies tristique nulla aliquet enim tortor at auctor urna nunc. Aliquam nulla facilisi cras fermentum odio eu feugiat. Eget arcu dictum varius duis at consectetur lorem.

Placerat duis ultricies lacus sed turpis tincidunt. Purus non enim praesent elementum facilisis leo vel fringilla. Duis ut diam quam nulla porttitor massa id. In fermentum et sollicitudin ac. Metus dictum at tempor commodo ullamcorper a lacus vestibulum. Varius sit amet mattis vulputate enim nulla aliquet porttitor. Dictum sit amet justo donec enim diam vulputate ut pharetra. In egestas erat imperdiet sed euismod nisi porta lorem mollis. In iaculis nunc sed augue lacus. Dictumst quisque sagittis purus sit amet. Varius duis at consectetur lorem. Et egestas quis ipsum suspendisse ultrices gravida dictum fusce ut. Donec et odio pellentesque diam. Laoreet id donec ultrices tincidunt arcu non. In arcu cursus euismod quis viverra nibh cras pulvinar mattis. Lorem ipsum dolor sit amet consectetur adipiscing elit duis. Metus vulputate eu scelerisque felis imperdiet proin fermentum leo vel. Cras sed felis eget velit aliquet sagittis id. Sagittis nisl rhoncus mattis rhoncus urna. Tellus at urna condimentum mattis pellentesque.

"So does everyone else."
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Eu volutpat odio facilisis mauris sit. Auctor urna nunc id cursus metus aliquam eleifend mi in. Mus mauris vitae ultricies leo integer. Adipiscing elit pellentesque habitant morbi tristique. Nam at lectus urna duis convallis. Diam vel quam elementum pulvinar etiam non quam. Duis ut diam quam nulla porttitor massa id neque. Et ultrices neque ornare aenean euismod. Nunc mi ipsum faucibus vitae aliquet. Non odio euismod lacinia at quis risus sed. Odio eu feugiat pretium nibh ipsum consequat nisl vel pretium.

Felis bibendum ut tristique et. Massa eget egestas purus viverra. Sed sed risus pretium quam. Dictum fusce ut placerat orci nulla pellentesque dignissim enim. Nibh tortor id aliquet lectus proin nibh nisl condimentum id. Id aliquet lectus proin nibh. Ultrices in iaculis nunc sed augue. Adipiscing elit pellentesque habitant morbi tristique. Mattis rhoncus urna neque viverra justo nec ultrices dui. Sodales neque sodales ut etiam sit amet nisl purus in. Congue eu consequat ac felis donec. Dapibus ultrices in iaculis nunc sed augue lacus. Gravida arcu ac tortor dignissim convallis aenean.

Morbi tincidunt augue interdum velit euismod. Nulla porttitor massa id neque aliquam vestibulum. Sed blandit libero volutpat sed cras. Enim eu turpis egestas pretium aenean. Sed odio morbi quis commodo. Nulla posuere sollicitudin aliquam ultrices. Venenatis urna cursus eget nunc. Tortor pretium viverra suspendisse potenti nullam ac. Orci a scelerisque purus semper eget. Habitant morbi tristique senectus et netus et malesuada fames. Ut venenatis tellus in metus vulputate eu scelerisque felis imperdiet. Ornare massa eget egestas purus viverra accumsan in nisl. At augue eget arcu dictum varius duis at consectetur. Id nibh tortor id aliquet lectus proin. Sagittis id consectetur purus ut. Pharetra et ultrices neque ornare aenean euismod elementum nisi quis. Suspendisse sed nisi lacus sed viverra tellus. Sodales neque sodales ut etiam sit amet nisl purus in.

Sem fringilla ut morbi tincidunt augue interdum. Egestas purus viverra accumsan in nisl nisi. Vitae purus faucibus ornare suspendisse sed nisi lacus sed viverra. Lacus vestibulum sed arcu non odio. Risus in hendrerit gravida rutrum quisque non tellus. Odio eu feugiat pretium nibh ipsum consequat nisl. Dignissim convallis aenean et tortor at risus viverra. Neque gravida in fermentum et sollicitudin ac. Nullam ac tortor vitae purus faucibus ornare suspendisse sed. Arcu dictum varius duis at consectetur lorem donec. Id eu nisl nunc mi. Placerat vestibulum lectus mauris ultrices eros in cursus. Vel pretium lectus quam id leo in vitae turpis. Neque laoreet suspendisse interdum consectetur libero id faucibus. Sagittis purus sit amet volutpat consequat mauris. Ultricies tristique nulla aliquet enim tortor at auctor urna nunc. Aliquam nulla facilisi cras fermentum odio eu feugiat. Eget arcu dictum varius duis at consectetur lorem.

Placerat duis ultricies lacus sed turpis tincidunt. Purus non enim praesent elementum facilisis leo vel fringilla. Duis ut diam quam nulla porttitor massa id. In fermentum et sollicitudin ac. Metus dictum at tempor commodo ullamcorper a lacus vestibulum. Varius sit amet mattis vulputate enim nulla aliquet porttitor. Dictum sit amet justo donec enim diam vulputate ut pharetra. In egestas erat imperdiet sed euismod nisi porta lorem mollis. In iaculis nunc sed augue lacus. Dictumst quisque sagittis purus sit amet. Varius duis at consectetur lorem. Et egestas quis ipsum suspendisse ultrices gravida dictum fusce ut. Donec et odio pellentesque diam. Laoreet id donec ultrices tincidunt arcu non. In arcu cursus euismod quis viverra nibh cras pulvinar mattis. Lorem ipsum dolor sit amet consectetur adipiscing elit duis. Metus vulputate eu scelerisque felis imperdiet proin fermentum leo vel. Cras sed felis eget velit aliquet sagittis id. Sagittis nisl rhoncus mattis rhoncus urna. Tellus at urna condimentum mattis pellentesque.

BACKGROUND
Family: What's it to you, creep? He's got a family, and that's that.

History: Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Eu volutpat odio facilisis mauris sit. Auctor urna nunc id cursus metus aliquam eleifend mi in. Mus mauris vitae ultricies leo integer. Adipiscing elit pellentesque habitant morbi tristique. Nam at lectus urna duis convallis. Diam vel quam elementum pulvinar etiam non quam. Duis ut diam quam nulla porttitor massa id neque. Et ultrices neque ornare aenean euismod. Nunc mi ipsum faucibus vitae aliquet. Non odio euismod lacinia at quis risus sed. Odio eu feugiat pretium nibh ipsum consequat nisl vel pretium.

Felis bibendum ut tristique et. Massa eget egestas purus viverra. Sed sed risus pretium quam. Dictum fusce ut placerat orci nulla pellentesque dignissim enim. Nibh tortor id aliquet lectus proin nibh nisl condimentum id. Id aliquet lectus proin nibh. Ultrices in iaculis nunc sed augue. Adipiscing elit pellentesque habitant morbi tristique. Mattis rhoncus urna neque viverra justo nec ultrices dui. Sodales neque sodales ut etiam sit amet nisl purus in. Congue eu consequat ac felis donec. Dapibus ultrices in iaculis nunc sed augue lacus. Gravida arcu ac tortor dignissim convallis aenean.

Morbi tincidunt augue interdum velit euismod. Nulla porttitor massa id neque aliquam vestibulum. Sed blandit libero volutpat sed cras. Enim eu turpis egestas pretium aenean. Sed odio morbi quis commodo. Nulla posuere sollicitudin aliquam ultrices. Venenatis urna cursus eget nunc. Tortor pretium viverra suspendisse potenti nullam ac. Orci a scelerisque purus semper eget. Habitant morbi tristique senectus et netus et malesuada fames. Ut venenatis tellus in metus vulputate eu scelerisque felis imperdiet. Ornare massa eget egestas purus viverra accumsan in nisl. At augue eget arcu dictum varius duis at consectetur. Id nibh tortor id aliquet lectus proin. Sagittis id consectetur purus ut. Pharetra et ultrices neque ornare aenean euismod elementum nisi quis. Suspendisse sed nisi lacus sed viverra tellus. Sodales neque sodales ut etiam sit amet nisl purus in.

Sem fringilla ut morbi tincidunt augue interdum. Egestas purus viverra accumsan in nisl nisi. Vitae purus faucibus ornare suspendisse sed nisi lacus sed viverra. Lacus vestibulum sed arcu non odio. Risus in hendrerit gravida rutrum quisque non tellus. Odio eu feugiat pretium nibh ipsum consequat nisl. Dignissim convallis aenean et tortor at risus viverra. Neque gravida in fermentum et sollicitudin ac. Nullam ac tortor vitae purus faucibus ornare suspendisse sed. Arcu dictum varius duis at consectetur lorem donec. Id eu nisl nunc mi. Placerat vestibulum lectus mauris ultrices eros in cursus. Vel pretium lectus quam id leo in vitae turpis. Neque laoreet suspendisse interdum consectetur libero id faucibus. Sagittis purus sit amet volutpat consequat mauris. Ultricies tristique nulla aliquet enim tortor at auctor urna nunc. Aliquam nulla facilisi cras fermentum odio eu feugiat. Eget arcu dictum varius duis at consectetur lorem.

Placerat duis ultricies lacus sed turpis tincidunt. Purus non enim praesent elementum facilisis leo vel fringilla. Duis ut diam quam nulla porttitor massa id. In fermentum et sollicitudin ac. Metus dictum at tempor commodo ullamcorper a lacus vestibulum. Varius sit amet mattis vulputate enim nulla aliquet porttitor. Dictum sit amet justo donec enim diam vulputate ut pharetra. In egestas erat imperdiet sed euismod nisi porta lorem mollis. In iaculis nunc sed augue lacus. Dictumst quisque sagittis purus sit amet. Varius duis at consectetur lorem. Et egestas quis ipsum suspendisse ultrices gravida dictum fusce ut. Donec et odio pellentesque diam. Laoreet id donec ultrices tincidunt arcu non. In arcu cursus euismod quis viverra nibh cras pulvinar mattis. Lorem ipsum dolor sit amet consectetur adipiscing elit duis. Metus vulputate eu scelerisque felis imperdiet proin fermentum leo vel. Cras sed felis eget velit aliquet sagittis id. Sagittis nisl rhoncus mattis rhoncus urna. Tellus at urna condimentum mattis pellentesque.

OTHER
Alignment: Lawful good
Zodiac Sign: Cancer
Theme Song: "Night Owl" by This Century
Moodboard:
Eb7w2ok.jpg

Relationships:
N/A



Pastebin: xxx​
 
Last edited:
IDEALIST - NOT MOBILE FRIENDLY

i finally learned how to code buttons c: it's tedious as heck but hey we love more compact layouts!! the text boxes all scroll and the title and role boxes should automatically right align regardless of the text length (emphasis on should). please do not remove the credit! enjoy, you lovely people c:

[class=bkgd] position: relative; box-sizing: border-box; width: 600px; height: 400px; background-color: #7B9FAB; border: 3px solid #DFDEE6; overflow: hidden; margin-left: auto; margin-right: auto; padding: 0; border-radius: 10px; [/class] [class=pic] position: absolute; overflow: visible; width: 224px; height: 402px; left: 0px; top: -2px; background: url(https://i.pinimg.com/564x/ff/33/63/ff3363f86175e64b39494fd1ee34e117.jpg); background-size: 100%; border-right: 3px solid #DFDEE6; [/class] [class=title] position: absolute; left: 183px; top: 10px; overflow: hidden; width: 400px; height: auto; color: #EC9889; text-shadow: 2px 2px 0px #240A03; text-transform: uppercase; text-align: right; font-style: normal; font-weight: normal; font-size: 30px; padding-right: 3px; [/class] [class=role] position: absolute; left: 383px; top: 46px; overflow: hidden; width: 200px; height: auto; color: #8D220C; text-transform: uppercase; text-shadow: 1px 2px 0px #45130E; text-align: right; font-style: italic; font-weight: normal; font-size: 20px; padding-right: 3px; [/class] [class=underline] overflow: visible; position: absolute; top: 62.5px; left: 247px; width: 337px; height: 3px; border-radius: 10px; background-color: #DFDEE6; [/class] [class=tab] position: absolute; overflow: visible; width: 38px; height: 38px; background-color: #8D220C; border: 3px solid #DFDEE6; border-radius: 100px; color: #DFDEE6 font-size: 30px; line-height: 40px; text-align: center; font-weight: 700; [/class] [class=body] position: relative; overflow: auto; width: 297px; height: 240px; color: #DFDEE6; text-align: justify; text-transform: lowercase; line-height: 11px; font-size: 10px; padding: 5px; [/class] [class=bodycont] position: absolute; overflow: hidden; width: 290px; height: 256px; left: 270px; top: 119px; background-color: #194A60; box-shadow: 3px 3px 0px #001F2C; border-radius: 10px [/class] [class=sub1] position: absolute; left: 270px; top: 90px; overflow: hidden; width: auto; height: auto; text-align: left; text-transform: uppercase; font-style: normal; font-weight: normal; font-size: 20px; color: #DFDEE6; text-shadow: 1px 2px 0px #194A60; [/class] [class=sub2] position: absolute; left: 270px; top: 90px; overflow: hidden; width: auto; height: auto; text-align: left; text-transform: uppercase; font-style: normal; font-weight: normal; font-size: 20px; color: #DFDEE6; text-shadow: 1px 2px 0px #194A60; [/class] [class=sub3] position: absolute; left: 270px; top: 90px; overflow: hidden; width: auto; height: auto; text-align: left; text-transform: uppercase; font-style: normal; font-weight: normal; font-size: 20px; color: #DFDEE6; text-shadow: 1px 2px 0px #194A60; [/class] [class=sub4] position: absolute; left: 270px; top: 90px; overflow: hidden; width: auto; height: auto; text-align: left; text-transform: uppercase; font-style: normal; font-weight: normal; font-size: 20px; color: #DFDEE6; text-shadow: 1px 2px 0px #194A60; [/class] [class=tag] position: relative; overflow: hidden; width: auto; height: 10px; display: inline; background-color: #EC9889; border-radius: 50px; box-shadow: 2px 2px 0px #45130E; color: #8D220C; text-transform: uppercase; font-size: 10px; font-weight: 700; padding-right: 5px; padding-left: 5px; margin-right: 3px; [/class] [class=credit] position: relative; overflow: hidden; width: 100%; height: 10px; text-align: center; font-style: normal; font-weight: normal; font-size: 8px; color: #8D220C; opacity: 0.8; [/class] [class name=tab state=hover] background-color: #45130E; [/class] [script class=tab on=click] hide tabsContent set currentTab (getText) if (eq ${currentTab} 1) (show tabsContentBasics) if (eq ${currentTab} 1) (show sub1) if (eq ${currentTab} 1) (hide sub2) if (eq ${currentTab} 1) (hide sub3) if (eq ${currentTab} 1) (hide sub4) if (eq ${currentTab} 2) (show tabsContentPersona) if (eq ${currentTab} 2) (show sub2) if (eq ${currentTab} 2) (hide sub1) if (eq ${currentTab} 2) (hide sub3) if (eq ${currentTab} 2) (hide sub4) if (eq ${currentTab} 3) (show tabsContentBackground) if (eq ${currentTab} 3) (show sub3) if (eq ${currentTab} 3) (hide sub1) if (eq ${currentTab} 3) (hide sub2) if (eq ${currentTab} 3) (hide sub4) if (eq ${currentTab} 4) (show tabsContentOther) if (eq ${currentTab} 4) (show sub4) if (eq ${currentTab} 4) (hide sub1) if (eq ${currentTab} 4) (hide sub2) if (eq ${currentTab} 4) (hide sub3) [/script]
[div class=bkgd]
[div class=pic][/div]
[div class=title]somewhere like this[/div]
[div class=underline][/div]
[div class=role]the idealist[/div]
[div class=line][/div]
[div class=sub1]basics[/div]
[div class=sub2 style="display: none;"]persona[/div]
[div class=sub3 style="display: none;"]background[/div]
[div class=sub4 style="display: none;"]other[/div]

[div class=tabs][div class=tab style="left: 205px; top: 100px;"]1[/div][div class=tab style="left: 205px; top: 154px;"]2[/div][div class=tab style="left: 205px; top: 208px;"]3[/div][div class=tab style="left: 205px; top: 262px;"]4[/div][/div]

[div class=one]1[/div]
[div class=two]2[/div]
[div class=three]3[/div]
[div class=four]4[/div]

[div class="tabsContent tabsContentBasics"][div class=bodycont][div class=body]
[div class=tag]name[/div] for as long as i live

[div class=tag]nickname[/div] and as long as i love

[div class=tag]age[/div] 25

[div class=tag]gender[/div] female

[div class=tag]sexuality[/div] bisexual

[div class=tag]role[/div] i will never not think about you

[div class=tag]occupation[/div] inn manager

[div class=tag]hair color[/div] black

[div class=tag]eye color[/div] jade

[div class=tag]height[/div] 5' 8"

[div class=tag]weight[/div] 127 lbs.

[div class=tag]body mods[/div] tattoos and piercings

[div class=tag]attire[/div] x x x

[div class=tag]faceclaim[/div] lorelai gilmore

[/div][/div][/div]


[div class="tabsContent tabsContentPersona" style="display: none;"][div class=bodycont][div class=body]
[div class=tag]vices[/div] Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Non nisi est sit amet facilisis magna etiam. Odio morbi quis commodo odio aenean. Volutpat maecenas volutpat blandit aliquam etiam erat velit scelerisque in. Tincidunt arcu non sodales neque sodales. Eu turpis egestas pretium aenean pharetra magna ac placerat vestibulum. A diam sollicitudin tempor id eu nisl. Odio tempor orci dapibus ultrices in iaculis nunc. Urna cursus eget nunc scelerisque viverra mauris. Sollicitudin tempor id eu nisl nunc mi.

[div class=tag]virtues[/div] Condimentum lacinia quis vel eros donec. Odio ut sem nulla pharetra diam sit amet nisl suscipit. Tristique senectus et netus et. Nullam non nisi est sit. Dictum non consectetur a erat nam. In metus vulputate eu scelerisque felis. Tristique et egestas quis ipsum suspendisse ultrices gravida. Morbi tincidunt ornare massa eget. Proin sed libero enim sed. Leo vel orci porta non pulvinar neque. Quam lacus suspendisse faucibus interdum posuere lorem.

[div class=tag]strengths[/div] Diam donec adipiscing tristique risus nec feugiat. Ut consequat semper viverra nam libero justo. Sed lectus vestibulum mattis ullamcorper velit. Aliquam id diam maecenas ultricies. Nunc sed id semper risus in hendrerit gravida rutrum quisque. Facilisi cras fermentum odio eu feugiat pretium nibh. Tristique sollicitudin nibh sit amet commodo nulla facilisi nullam. Rhoncus aenean vel elit scelerisque mauris pellentesque. Tortor aliquam nulla facilisi cras fermentum odio. Lectus arcu bibendum at varius.

[div class=tag]weaknesses[/div] Aliquet sagittis id consectetur purus ut faucibus pulvinar. Aliquam ultrices sagittis orci a. Senectus et netus et malesuada fames ac. Nibh sit amet commodo nulla facilisi nullam vehicula. Cursus metus aliquam eleifend mi in nulla. Ornare arcu dui vivamus arcu felis bibendum ut. Dolor sit amet consectetur adipiscing elit pellentesque habitant morbi tristique. Tellus rutrum tellus pellentesque eu tincidunt tortor aliquam nulla facilisi. Adipiscing elit ut aliquam purus sit amet luctus venenatis. Facilisis gravida neque convallis a. In tellus integer feugiat scelerisque varius morbi. Adipiscing tristique risus nec feugiat in fermentum posuere urna. Blandit volutpat maecenas volutpat blandit aliquam etiam erat. Sed viverra ipsum nunc aliquet bibendum enim facilisis. Dignissim diam quis enim lobortis scelerisque fermentum dui. Amet luctus venenatis lectus magna fringilla. Eget arcu dictum varius duis at consectetur lorem donec massa.

[div class=tag]likes[/div] Imperdiet dui accumsan sit amet nulla facilisi morbi. Tempor orci eu lobortis elementum nibh tellus molestie nunc. Nulla aliquet enim tortor at auctor urna nunc id. Ipsum suspendisse ultrices gravida dictum fusce. Vel facilisis volutpat est velit egestas dui id ornare. Dictum fusce ut placerat orci nulla pellentesque dignissim enim sit. Sagittis purus sit amet volutpat consequat mauris nunc congue. Pellentesque elit eget gravida cum sociis. Scelerisque varius morbi enim nunc faucibus a pellentesque sit. Tristique nulla aliquet enim tortor. Elementum nisi quis eleifend quam adipiscing. Arcu odio ut sem nulla pharetra diam sit amet nisl. Arcu bibendum at varius vel pharetra vel turpis nunc eget.

[div class=tag]dislikes[/div] Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Non nisi est sit amet facilisis magna etiam. Odio morbi quis commodo odio aenean. Volutpat maecenas volutpat blandit aliquam etiam erat velit scelerisque in. Tincidunt arcu non sodales neque sodales. Eu turpis egestas pretium aenean pharetra magna ac placerat vestibulum. A diam sollicitudin tempor id eu nisl. Odio tempor orci dapibus ultrices in iaculis nunc. Urna cursus eget nunc scelerisque viverra mauris. Sollicitudin tempor id eu nisl nunc mi.

[div class=tag]habits[/div] Condimentum lacinia quis vel eros donec. Odio ut sem nulla pharetra diam sit amet nisl suscipit. Tristique senectus et netus et. Nullam non nisi est sit. Dictum non consectetur a erat nam. In metus vulputate eu scelerisque felis. Tristique et egestas quis ipsum suspendisse ultrices gravida. Morbi tincidunt ornare massa eget. Proin sed libero enim sed. Leo vel orci porta non pulvinar neque. Quam lacus suspendisse faucibus interdum posuere lorem.

[div class=tag]quirks[/div] Diam donec adipiscing tristique risus nec feugiat. Ut consequat semper viverra nam libero justo. Sed lectus vestibulum mattis ullamcorper velit. Aliquam id diam maecenas ultricies. Nunc sed id semper risus in hendrerit gravida rutrum quisque. Facilisi cras fermentum odio eu feugiat pretium nibh. Tristique sollicitudin nibh sit amet commodo nulla facilisi nullam. Rhoncus aenean vel elit scelerisque mauris pellentesque. Tortor aliquam nulla facilisi cras fermentum odio. Lectus arcu bibendum at varius.

[div class=tag]fears[/div] Imperdiet dui accumsan sit amet nulla facilisi morbi. Tempor orci eu lobortis elementum nibh tellus molestie nunc. Nulla aliquet enim tortor at auctor urna nunc id. Ipsum suspendisse ultrices gravida dictum fusce. Vel facilisis volutpat est velit egestas dui id ornare. Dictum fusce ut placerat orci nulla pellentesque dignissim enim sit. Sagittis purus sit amet volutpat consequat mauris nunc congue. Pellentesque elit eget gravida cum sociis. Scelerisque varius morbi enim nunc faucibus a pellentesque sit. Tristique nulla aliquet enim tortor. Elementum nisi quis eleifend quam adipiscing. Arcu odio ut sem nulla pharetra diam sit amet nisl. Arcu bibendum at varius vel pharetra vel turpis nunc eget.

[/div][/div][/div]


[div class="tabsContent tabsContentBackground" style="display: none;"][div class=bodycont][div class=body]
[div class=tag]history[/div] Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Non nisi est sit amet facilisis magna etiam. Odio morbi quis commodo odio aenean. Volutpat maecenas volutpat blandit aliquam etiam erat velit scelerisque in. Tincidunt arcu non sodales neque sodales. Eu turpis egestas pretium aenean pharetra magna ac placerat vestibulum. A diam sollicitudin tempor id eu nisl. Odio tempor orci dapibus ultrices in iaculis nunc. Urna cursus eget nunc scelerisque viverra mauris. Sollicitudin tempor id eu nisl nunc mi.

[div class=tag]family[/div] Condimentum lacinia quis vel eros donec. Odio ut sem nulla pharetra diam sit amet nisl suscipit. Tristique senectus et netus et. Nullam non nisi est sit. Dictum non consectetur a erat nam. In metus vulputate eu scelerisque felis. Tristique et egestas quis ipsum suspendisse ultrices gravida. Morbi tincidunt ornare massa eget. Proin sed libero enim sed. Leo vel orci porta non pulvinar neque. Quam lacus suspendisse faucibus interdum posuere lorem.

[div class=tag]education[/div] Diam donec adipiscing tristique risus nec feugiat. Ut consequat semper viverra nam libero justo. Sed lectus vestibulum mattis ullamcorper velit. Aliquam id diam maecenas ultricies. Nunc sed id semper risus in hendrerit gravida rutrum quisque. Facilisi cras fermentum odio eu feugiat pretium nibh. Tristique sollicitudin nibh sit amet commodo nulla facilisi nullam. Rhoncus aenean vel elit scelerisque mauris pellentesque. Tortor aliquam nulla facilisi cras fermentum odio. Lectus arcu bibendum at varius.

[div class=tag]relationships[/div] my lover: Diam donec adipiscing tristique risus nec feugiat. Ut consequat semper viverra nam libero justo. Sed lectus vestibulum mattis ullamcorper velit. Aliquam id diam maecenas ultricies. Nunc sed id semper risus in hendrerit gravida rutrum quisque. Facilisi cras fermentum odio eu feugiat pretium nibh. Tristique sollicitudin nibh sit amet commodo nulla facilisi nullam. Rhoncus aenean vel elit scelerisque mauris pellentesque. Tortor aliquam nulla facilisi cras fermentum odio. Lectus arcu bibendum at varius.

my nemesis: Condimentum lacinia quis vel eros donec. Odio ut sem nulla pharetra diam sit amet nisl suscipit. Tristique senectus et netus et. Nullam non nisi est sit. Dictum non consectetur a erat nam. In metus vulputate eu scelerisque felis. Tristique et egestas quis ipsum suspendisse ultrices gravida. Morbi tincidunt ornare massa eget. Proin sed libero enim sed. Leo vel orci porta non pulvinar neque. Quam lacus suspendisse faucibus interdum posuere lorem.

my soulmate: Diam donec adipiscing tristique risus nec feugiat. Ut consequat semper viverra nam libero justo. Sed lectus vestibulum mattis ullamcorper velit. Aliquam id diam maecenas ultricies. Nunc sed id semper risus in hendrerit gravida rutrum quisque. Facilisi cras fermentum odio eu feugiat pretium nibh. Tristique sollicitudin nibh sit amet commodo nulla facilisi nullam. Rhoncus aenean vel elit scelerisque mauris pellentesque. Tortor aliquam nulla facilisi cras fermentum odio. Lectus arcu bibendum at varius.

my side chick: Condimentum lacinia quis vel eros donec. Odio ut sem nulla pharetra diam sit amet nisl suscipit. Tristique senectus et netus et. Nullam non nisi est sit. Dictum non consectetur a erat nam. In metus vulputate eu scelerisque felis. Tristique et egestas quis ipsum suspendisse ultrices gravida. Morbi tincidunt ornare massa eget. Proin sed libero enim sed. Leo vel orci porta non pulvinar neque. Quam lacus suspendisse faucibus interdum posuere lorem.

my boss: Diam donec adipiscing tristique risus nec feugiat. Ut consequat semper viverra nam libero justo. Sed lectus vestibulum mattis ullamcorper velit. Aliquam id diam maecenas ultricies. Nunc sed id semper risus in hendrerit gravida rutrum quisque. Facilisi cras fermentum odio eu feugiat pretium nibh. Tristique sollicitudin nibh sit amet commodo nulla facilisi nullam. Rhoncus aenean vel elit scelerisque mauris pellentesque. Tortor aliquam nulla facilisi cras fermentum odio. Lectus arcu bibendum at varius.

my partner in crime: Condimentum lacinia quis vel eros donec. Odio ut sem nulla pharetra diam sit amet nisl suscipit. Tristique senectus et netus et. Nullam non nisi est sit. Dictum non consectetur a erat nam. In metus vulputate eu scelerisque felis. Tristique et egestas quis ipsum suspendisse ultrices gravida. Morbi tincidunt ornare massa eget. Proin sed libero enim sed. Leo vel orci porta non pulvinar neque. Quam lacus suspendisse faucibus interdum posuere lorem.

[/div][/div][/div]


[div class="tabsContent tabsContentOther" style="display: none;"][div class=bodycont][div class=body]
[div class=tag]theme song[/div] never not by lauv

[div class=tag]favorite food[/div] popcorn shrimp

[div class=tag]favorite drink[/div] passion fruit margs

[div class=tag]favorite book[/div] sapiens by yuval noah harari

[div class=tag]favorite movie[/div] mister nobody

[div class=tag]gallery[/div]
6531f220db24f3f5cf5f2e2e1207b862.jpg
0d807ae3aa5ba21fc146c58a483a9e20.jpg

9ea35c7f3079d0c5c472456563d9e4f5.jpg

7566de0e7115addc64aa756fc9e99e00.jpg


[/div][/div][/div]
[/div][div class=credit]code by sox sox [/div]
Code: 
[nobr]
    [class=bkgd]
        position: relative;
        box-sizing: border-box;
        width: 600px;
        height: 400px;
        background-color: #7B9FAB;
        border: 3px solid #DFDEE6;
        overflow: hidden;
        margin-left: auto;
        margin-right: auto;
        padding: 0;
        border-radius: 10px;
    [/class]
    [class=pic]
        position: absolute;
        overflow: visible;
        width: 224px;
        height: 402px;
        left: 0px;
        top: -2px;
        background: url(https://i.pinimg.com/564x/ff/33/63/ff3363f86175e64b39494fd1ee34e117.jpg);
        background-size: 100%;
        border-right: 3px solid #DFDEE6;
    [/class]
    [class=title]
        position: absolute;
        left: 183px;
        top: 10px;
        overflow: hidden;
        width: 400px;
        height: auto;
        color: #EC9889;
        text-shadow: 2px 2px 0px #240A03;
        text-transform: uppercase;
        text-align: right;
        font-style: normal;
        font-weight: normal;
        font-size: 30px;
        padding-right: 3px;
    [/class]
    [class=role]
        position: absolute;
        left: 383px;
        top: 46px;
        overflow: hidden;
        width: 200px;
        height: auto;
        color: #8D220C;
        text-transform: uppercase;
        text-shadow: 1px 2px 0px #45130E;
        text-align: right;
        font-style: italic;
        font-weight: normal;
        font-size: 20px;
        padding-right: 3px;
    [/class]
    [class=underline]
        overflow: visible;
        position: absolute;
        top: 62.5px;
        left: 247px;
        width: 337px;
        height: 3px;
        border-radius: 10px;
        background-color: #DFDEE6;
    [/class]
    [class=tab]
        position: absolute;
        overflow: visible;
        width: 38px;
        height: 38px;
        background-color: #8D220C;
        border: 3px solid #DFDEE6;
        border-radius: 100px;
        color: #DFDEE6
        font-size: 30px;
        line-height: 40px;
        text-align: center;
        font-weight: 700;
    [/class]
    [class=body]
        position: relative;
        overflow: auto;
        width: 297px;
        height: 240px;
        color: #DFDEE6;
        text-align: justify;
        text-transform: lowercase;
        line-height: 11px;
        font-size: 10px;
        padding: 5px;
    [/class]
    [class=bodycont]
        position: absolute;
        overflow: hidden;
        width: 290px;
        height: 256px;
        left: 270px;
        top: 119px;
        background-color: #194A60;
        box-shadow: 3px 3px 0px #001F2C;
        border-radius: 10px
    [/class]
    [class=sub1]
        position: absolute;
        left: 270px;
        top: 90px;
        overflow: hidden;
        width: auto;
        height: auto;
        text-align: left;
        text-transform: uppercase;
        font-style: normal;
        font-weight: normal;
        font-size: 20px;
        color: #DFDEE6;
        text-shadow: 1px 2px 0px #194A60;
    [/class]
    [class=sub2]
        position: absolute;
        left: 270px;
        top: 90px;
        overflow: hidden;
        width: auto;
        height: auto;
        text-align: left;
        text-transform: uppercase;
        font-style: normal;
        font-weight: normal;
        font-size: 20px;
        color: #DFDEE6;
        text-shadow: 1px 2px 0px #194A60;
    [/class]
    [class=sub3]
        position: absolute;
        left: 270px;
        top: 90px;
        overflow: hidden;
        width: auto;
        height: auto;
        text-align: left;
        text-transform: uppercase;
        font-style: normal;
        font-weight: normal;
        font-size: 20px;
        color: #DFDEE6;
        text-shadow: 1px 2px 0px #194A60;
    [/class]
    [class=sub4]
        position: absolute;
        left: 270px;
        top: 90px;
        overflow: hidden;
        width: auto;
        height: auto;
        text-align: left;
        text-transform: uppercase;
        font-style: normal;
        font-weight: normal;
        font-size: 20px;
        color: #DFDEE6;
        text-shadow: 1px 2px 0px #194A60;
    [/class]
    [class=tag]
        position: relative;
        overflow: hidden;
        width: auto;
        height: 10px;
        display: inline;
        background-color: #EC9889;
        border-radius: 50px;
        box-shadow: 2px 2px 0px #45130E;
        color: #8D220C;
        text-transform: uppercase;
        font-size: 10px;
        font-weight: 700;
        padding-right: 5px;
        padding-left: 5px;
        margin-right: 3px;
    [/class]
        [class=credit]
        position: relative;
        overflow: hidden;
        width: 100%;
        height: 10px;
        text-align: center;
        font-style: normal;
        font-weight: normal;
        font-size: 8px;
        color: #8D220C;
        opacity: 0.8;
        [/class]
    [class name=tab state=hover]
                background-color: #45130E;
    [/class] 
    [script class=tab on=click]
                hide tabsContent
                set currentTab (getText)
                if (eq ${currentTab} 1) (show tabsContentBasics)
                if (eq ${currentTab} 1) (show sub1)
                if (eq ${currentTab} 1) (hide sub2)
                if (eq ${currentTab} 1) (hide  sub3)
                if (eq ${currentTab} 1) (hide  sub4)
                if (eq ${currentTab} 2) (show tabsContentPersona)
                if (eq ${currentTab} 2) (show sub2)
                if (eq ${currentTab} 2) (hide  sub1)
                if (eq ${currentTab} 2) (hide  sub3)
                if (eq ${currentTab} 2) (hide sub4)
                if (eq ${currentTab} 3) (show tabsContentBackground)
                if (eq ${currentTab} 3) (show sub3)
                if (eq ${currentTab} 3) (hide sub1)
                if (eq ${currentTab} 3) (hide  sub2)
                if (eq ${currentTab} 3) (hide sub4)
                if (eq ${currentTab} 4) (show tabsContentOther)
                if (eq ${currentTab} 4) (show sub4)
                if (eq ${currentTab} 4) (hide  sub1)
                if (eq ${currentTab} 4) (hide sub2)
                if (eq ${currentTab} 4) (hide sub3)
    [/script]
[/nobr]
[div class=bkgd]
[div class=pic][/div]
[div class=title][font=Reem Kufi]somewhere like this[/font][/div]
[div class=underline][/div]
[div class=role][font=Reem Kufi]the idealist[/font][/div]
[div class=line][/div]
[div class=sub1][font=Reem Kufi]basics[/font][/div]
[div class=sub2  style="display: none;"][font=Reem Kufi]persona[/font][/div]
[div class=sub3  style="display: none;"][font=Reem Kufi]background[/font][/div]
[div class=sub4  style="display: none;"][font=Reem Kufi]other[/font][/div]

[div class=tabs][font=Reem Kufi][div class=tab style="left: 205px; top: 100px;"]1[/div][div class=tab style="left: 205px; top: 154px;"]2[/div][div class=tab style="left: 205px; top: 208px;"]3[/div][div class=tab style="left: 205px; top: 262px;"]4[/div][/font][/div]

[div class=one][font=Reem Kufi]1[/font][/div]
[div class=two][font=Reem Kufi]2[/font][/div]
[div class=three][font=Reem Kufi]3[/font][/div]
[div class=four][font=Reem Kufi]4[/font][/div]

[div class="tabsContent tabsContentBasics"][div class=bodycont][div class=body][font=Quicksand]
[div class=tag][font=Reem Kufi]name[/font][/div] for as long as i live

[div class=tag][font=Reem Kufi]nickname[/font][/div] and as long as i love

[div class=tag][font=Reem Kufi]age[/font][/div] 25

[div class=tag][font=Reem Kufi]gender[/font][/div] female

[div class=tag][font=Reem Kufi]sexuality[/font][/div] bisexual

[div class=tag][font=Reem Kufi]role[/font][/div] i will never not think about you

[div class=tag][font=Reem Kufi]occupation[/font][/div] inn manager

[div class=tag][font=Reem Kufi]hair color[/font][/div] black

[div class=tag][font=Reem Kufi]eye color[/font][/div] jade

[div class=tag][font=Reem Kufi]height[/font][/div] 5' 8"

[div class=tag][font=Reem Kufi]weight[/font][/div] 127 lbs.

[div class=tag][font=Reem Kufi]body mods[/font][/div] tattoos and piercings

[div class=tag][font=Reem Kufi]attire[/font][/div] x x x

[div class=tag][font=Reem Kufi]faceclaim[/font][/div] lorelai gilmore

[/font][/div][/div][/div]


[div class="tabsContent tabsContentPersona" style="display: none;"][div class=bodycont][div class=body][font=Quicksand]
[div class=tag][font=Reem Kufi]vices[/font][/div] Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Non nisi est sit amet facilisis magna etiam. Odio morbi quis commodo odio aenean. Volutpat maecenas volutpat blandit aliquam etiam erat velit scelerisque in. Tincidunt arcu non sodales neque sodales. Eu turpis egestas pretium aenean pharetra magna ac placerat vestibulum. A diam sollicitudin tempor id eu nisl. Odio tempor orci dapibus ultrices in iaculis nunc. Urna cursus eget nunc scelerisque viverra mauris. Sollicitudin tempor id eu nisl nunc mi.

[div class=tag][font=Reem Kufi]virtues[/font][/div] Condimentum lacinia quis vel eros donec. Odio ut sem nulla pharetra diam sit amet nisl suscipit. Tristique senectus et netus et. Nullam non nisi est sit. Dictum non consectetur a erat nam. In metus vulputate eu scelerisque felis. Tristique et egestas quis ipsum suspendisse ultrices gravida. Morbi tincidunt ornare massa eget. Proin sed libero enim sed. Leo vel orci porta non pulvinar neque. Quam lacus suspendisse faucibus interdum posuere lorem.

[div class=tag][font=Reem Kufi]strengths[/font][/div] Diam donec adipiscing tristique risus nec feugiat. Ut consequat semper viverra nam libero justo. Sed lectus vestibulum mattis ullamcorper velit. Aliquam id diam maecenas ultricies. Nunc sed id semper risus in hendrerit gravida rutrum quisque. Facilisi cras fermentum odio eu feugiat pretium nibh. Tristique sollicitudin nibh sit amet commodo nulla facilisi nullam. Rhoncus aenean vel elit scelerisque mauris pellentesque. Tortor aliquam nulla facilisi cras fermentum odio. Lectus arcu bibendum at varius.

[div class=tag][font=Reem Kufi]weaknesses[/font][/div] Aliquet sagittis id consectetur purus ut faucibus pulvinar. Aliquam ultrices sagittis orci a. Senectus et netus et malesuada fames ac. Nibh sit amet commodo nulla facilisi nullam vehicula. Cursus metus aliquam eleifend mi in nulla. Ornare arcu dui vivamus arcu felis bibendum ut. Dolor sit amet consectetur adipiscing elit pellentesque habitant morbi tristique. Tellus rutrum tellus pellentesque eu tincidunt tortor aliquam nulla facilisi. Adipiscing elit ut aliquam purus sit amet luctus venenatis. Facilisis gravida neque convallis a. In tellus integer feugiat scelerisque varius morbi. Adipiscing tristique risus nec feugiat in fermentum posuere urna. Blandit volutpat maecenas volutpat blandit aliquam etiam erat. Sed viverra ipsum nunc aliquet bibendum enim facilisis. Dignissim diam quis enim lobortis scelerisque fermentum dui. Amet luctus venenatis lectus magna fringilla. Eget arcu dictum varius duis at consectetur lorem donec massa.

[div class=tag][font=Reem Kufi]likes[/font][/div] Imperdiet dui accumsan sit amet nulla facilisi morbi. Tempor orci eu lobortis elementum nibh tellus molestie nunc. Nulla aliquet enim tortor at auctor urna nunc id. Ipsum suspendisse ultrices gravida dictum fusce. Vel facilisis volutpat est velit egestas dui id ornare. Dictum fusce ut placerat orci nulla pellentesque dignissim enim sit. Sagittis purus sit amet volutpat consequat mauris nunc congue. Pellentesque elit eget gravida cum sociis. Scelerisque varius morbi enim nunc faucibus a pellentesque sit. Tristique nulla aliquet enim tortor. Elementum nisi quis eleifend quam adipiscing. Arcu odio ut sem nulla pharetra diam sit amet nisl. Arcu bibendum at varius vel pharetra vel turpis nunc eget.

[div class=tag][font=Reem Kufi]dislikes[/font][/div] Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Non nisi est sit amet facilisis magna etiam. Odio morbi quis commodo odio aenean. Volutpat maecenas volutpat blandit aliquam etiam erat velit scelerisque in. Tincidunt arcu non sodales neque sodales. Eu turpis egestas pretium aenean pharetra magna ac placerat vestibulum. A diam sollicitudin tempor id eu nisl. Odio tempor orci dapibus ultrices in iaculis nunc. Urna cursus eget nunc scelerisque viverra mauris. Sollicitudin tempor id eu nisl nunc mi.

[div class=tag][font=Reem Kufi]habits[/font][/div] Condimentum lacinia quis vel eros donec. Odio ut sem nulla pharetra diam sit amet nisl suscipit. Tristique senectus et netus et. Nullam non nisi est sit. Dictum non consectetur a erat nam. In metus vulputate eu scelerisque felis. Tristique et egestas quis ipsum suspendisse ultrices gravida. Morbi tincidunt ornare massa eget. Proin sed libero enim sed. Leo vel orci porta non pulvinar neque. Quam lacus suspendisse faucibus interdum posuere lorem.

[div class=tag][font=Reem Kufi]quirks[/font][/div] Diam donec adipiscing tristique risus nec feugiat. Ut consequat semper viverra nam libero justo. Sed lectus vestibulum mattis ullamcorper velit. Aliquam id diam maecenas ultricies. Nunc sed id semper risus in hendrerit gravida rutrum quisque. Facilisi cras fermentum odio eu feugiat pretium nibh. Tristique sollicitudin nibh sit amet commodo nulla facilisi nullam. Rhoncus aenean vel elit scelerisque mauris pellentesque. Tortor aliquam nulla facilisi cras fermentum odio. Lectus arcu bibendum at varius.

[div class=tag][font=Reem Kufi]fears[/font][/div] Imperdiet dui accumsan sit amet nulla facilisi morbi. Tempor orci eu lobortis elementum nibh tellus molestie nunc. Nulla aliquet enim tortor at auctor urna nunc id. Ipsum suspendisse ultrices gravida dictum fusce. Vel facilisis volutpat est velit egestas dui id ornare. Dictum fusce ut placerat orci nulla pellentesque dignissim enim sit. Sagittis purus sit amet volutpat consequat mauris nunc congue. Pellentesque elit eget gravida cum sociis. Scelerisque varius morbi enim nunc faucibus a pellentesque sit. Tristique nulla aliquet enim tortor. Elementum nisi quis eleifend quam adipiscing. Arcu odio ut sem nulla pharetra diam sit amet nisl. Arcu bibendum at varius vel pharetra vel turpis nunc eget.

[/font][/div][/div][/div]


[div class="tabsContent tabsContentBackground" style="display: none;"][div class=bodycont][div class=body][font=Quicksand]
[div class=tag][font=Reem Kufi]history[/font][/div] Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Non nisi est sit amet facilisis magna etiam. Odio morbi quis commodo odio aenean. Volutpat maecenas volutpat blandit aliquam etiam erat velit scelerisque in. Tincidunt arcu non sodales neque sodales. Eu turpis egestas pretium aenean pharetra magna ac placerat vestibulum. A diam sollicitudin tempor id eu nisl. Odio tempor orci dapibus ultrices in iaculis nunc. Urna cursus eget nunc scelerisque viverra mauris. Sollicitudin tempor id eu nisl nunc mi.

[div class=tag][font=Reem Kufi]family[/font][/div] Condimentum lacinia quis vel eros donec. Odio ut sem nulla pharetra diam sit amet nisl suscipit. Tristique senectus et netus et. Nullam non nisi est sit. Dictum non consectetur a erat nam. In metus vulputate eu scelerisque felis. Tristique et egestas quis ipsum suspendisse ultrices gravida. Morbi tincidunt ornare massa eget. Proin sed libero enim sed. Leo vel orci porta non pulvinar neque. Quam lacus suspendisse faucibus interdum posuere lorem.

[div class=tag][font=Reem Kufi]education[/font][/div] Diam donec adipiscing tristique risus nec feugiat. Ut consequat semper viverra nam libero justo. Sed lectus vestibulum mattis ullamcorper velit. Aliquam id diam maecenas ultricies. Nunc sed id semper risus in hendrerit gravida rutrum quisque. Facilisi cras fermentum odio eu feugiat pretium nibh. Tristique sollicitudin nibh sit amet commodo nulla facilisi nullam. Rhoncus aenean vel elit scelerisque mauris pellentesque. Tortor aliquam nulla facilisi cras fermentum odio. Lectus arcu bibendum at varius.

[div class=tag][font=Reem Kufi]relationships[/font][/div] [b]my lover:[/b] Diam donec adipiscing tristique risus nec feugiat. Ut consequat semper viverra nam libero justo. Sed lectus vestibulum mattis ullamcorper velit. Aliquam id diam maecenas ultricies. Nunc sed id semper risus in hendrerit gravida rutrum quisque. Facilisi cras fermentum odio eu feugiat pretium nibh. Tristique sollicitudin nibh sit amet commodo nulla facilisi nullam. Rhoncus aenean vel elit scelerisque mauris pellentesque. Tortor aliquam nulla facilisi cras fermentum odio. Lectus arcu bibendum at varius.

[b]my nemesis:[/b] Condimentum lacinia quis vel eros donec. Odio ut sem nulla pharetra diam sit amet nisl suscipit. Tristique senectus et netus et. Nullam non nisi est sit. Dictum non consectetur a erat nam. In metus vulputate eu scelerisque felis. Tristique et egestas quis ipsum suspendisse ultrices gravida. Morbi tincidunt ornare massa eget. Proin sed libero enim sed. Leo vel orci porta non pulvinar neque. Quam lacus suspendisse faucibus interdum posuere lorem.

[b]my soulmate:[/b] Diam donec adipiscing tristique risus nec feugiat. Ut consequat semper viverra nam libero justo. Sed lectus vestibulum mattis ullamcorper velit. Aliquam id diam maecenas ultricies. Nunc sed id semper risus in hendrerit gravida rutrum quisque. Facilisi cras fermentum odio eu feugiat pretium nibh. Tristique sollicitudin nibh sit amet commodo nulla facilisi nullam. Rhoncus aenean vel elit scelerisque mauris pellentesque. Tortor aliquam nulla facilisi cras fermentum odio. Lectus arcu bibendum at varius.

[b]my side chick:[/b] Condimentum lacinia quis vel eros donec. Odio ut sem nulla pharetra diam sit amet nisl suscipit. Tristique senectus et netus et. Nullam non nisi est sit. Dictum non consectetur a erat nam. In metus vulputate eu scelerisque felis. Tristique et egestas quis ipsum suspendisse ultrices gravida. Morbi tincidunt ornare massa eget. Proin sed libero enim sed. Leo vel orci porta non pulvinar neque. Quam lacus suspendisse faucibus interdum posuere lorem.

[b]my boss:[/b] Diam donec adipiscing tristique risus nec feugiat. Ut consequat semper viverra nam libero justo. Sed lectus vestibulum mattis ullamcorper velit. Aliquam id diam maecenas ultricies. Nunc sed id semper risus in hendrerit gravida rutrum quisque. Facilisi cras fermentum odio eu feugiat pretium nibh. Tristique sollicitudin nibh sit amet commodo nulla facilisi nullam. Rhoncus aenean vel elit scelerisque mauris pellentesque. Tortor aliquam nulla facilisi cras fermentum odio. Lectus arcu bibendum at varius.

[b]my partner in crime:[/b] Condimentum lacinia quis vel eros donec. Odio ut sem nulla pharetra diam sit amet nisl suscipit. Tristique senectus et netus et. Nullam non nisi est sit. Dictum non consectetur a erat nam. In metus vulputate eu scelerisque felis. Tristique et egestas quis ipsum suspendisse ultrices gravida. Morbi tincidunt ornare massa eget. Proin sed libero enim sed. Leo vel orci porta non pulvinar neque. Quam lacus suspendisse faucibus interdum posuere lorem.

[/font][/div][/div][/div]


[div class="tabsContent tabsContentOther" style="display: none;"][div class=bodycont][div class=body][font=Quicksand]
[div class=tag][font=Reem Kufi]theme song[/font][/div] never not by lauv

[div class=tag][font=Reem Kufi]favorite food[/font][/div] popcorn shrimp

[div class=tag][font=Reem Kufi]favorite drink[/font][/div] passion fruit margs

[div class=tag][font=Reem Kufi]favorite book[/font][/div] sapiens by yuval noah harari

[div class=tag][font=Reem Kufi]favorite movie[/font][/div] mister nobody

[div class=tag][font=Reem Kufi]gallery[/font][/div]
[img]https://i.pinimg.com/564x/65/31/f2/6531f220db24f3f5cf5f2e2e1207b862.jpg[/img][img]https://i.pinimg.com/564x/0d/80/7a/0d807ae3aa5ba21fc146c58a483a9e20.jpg[/img]
[img]https://i.pinimg.com/564x/9e/a3/5c/9ea35c7f3079d0c5c472456563d9e4f5.jpg[/img]
[img]https://i.pinimg.com/564x/75/66/de/7566de0e7115addc64aa756fc9e99e00.jpg[/img]

[/font][/div][/div][/div]
[/div][div class=credit]code by [USER=2383][COLOR=#8D220C]sox[/COLOR][/USER][/div]
 
Last edited:
GONE - NOT MOBILE FRIENDLY

its peak procrastination hours and sox is back with another character sheet that no one asked for c: the text boxes all scroll and the buttons tab through all the pages! maybe one day i'll make a mobile friendly cs. maybe. please do not remove the credit! enjoy, friends! c:

[class=bkgd] position: relative; box-sizing: border-box; width: 600px; height: 400px; background: url(https://imgur.com/QeunQKm.jpg); overflow: hidden; margin-left: auto; margin-right: auto; border-radius: 8px; [/class] [class=textcontainer] position: absolute; overflow: hidden; width: 298px; height: 290px; left: 283.096px; top: 100.001px; [/class] [class=text] position: relative; overflow: auto; width: 295px; height: 265px; text-align: justify; font-family: Raleway; line-height: 12px; font-size: 10px; color: #3BF2F8; padding: 10px; text-transform: lowercase; [/class] [class=header] text-shadow: 2px 2px 0px #007A4D; position: absolute; left: 280px; top: 60px; overflow: visible; width: 300px; text-align: center; font-style: normal; font-weight: normal; font-size: 25px; color: #00FFA2; text-transform: uppercase; [/class] [class=five] position: absolute; overflow: visible; width: 32px; height: 32px; left: 164px; top: 92px; box-shadow: 3px 3px 0px #770043; border-radius: 50px; background-color: #FF0090; font-size: 15px; font-weight: 700; line-height: 30px; color: #770043; text-align: center; [/class] [class=four] position: absolute; overflow: visible; width: 32px; height: 32px; left: 126px; top: 92px; box-shadow: 3px 3px 0px #850085; border-radius: 50px; background-color: #FF00FF; font-size: 15px; font-weight: 700; line-height: 30px; color: #850085; text-align: center; [/class] [class=three] position: absolute; overflow: visible; width: 32px; height: 32px; left: 88px; top: 92px; box-shadow: 3px 3px 0px #003864; border-radius: 50px; background-color: #0090FF; font-size: 15px; font-weight: 700; line-height: 30px; color: #003864; text-align: center; [/class] [class=two] position: absolute; overflow: visible; width: 32px; height: 32px; left: 50px; top: 92px; box-shadow: 3px 3px 0px #026B6E; border-radius: 50px; background-color: #3BF2F8; font-size: 15px; font-weight: 700; line-height: 30px; color: #026B6E; text-align: center; [/class] [class=one] position: absolute; overflow: visible; width: 32px; height: 32px; left: 12px; top: 92px; box-shadow: 3px 3px 0px #007A4D; border-radius: 50px; background-color: #00FFA2; font-size: 15px; font-weight: 700; line-height: 30px; color: #007A4D; text-align: center; [/class] [class=pic2] position: absolute; overflow: visible; width: 100px; height: 100px; left: 510px; top: -23px; border: 2px solid #3BF2F8; box-shadow: 0px 3px 0px #026B6E; background: url(https://i.pinimg.com/564x/9e/de/f4/9edef4cb55bbf02a3567dbef220784b6.jpg); background-size: 100%; border-radius: 300px; [/class] [class=pic] position: absolute; overflow: visible; width: 303px; height: 300px; left: -50px; top: 150px; border: 3px solid #FF0090; box-shadow: 3px 0px 0px #770043; background: url(https://imgur.com/KPI4CNr.jpg); background-size: 120%; background-position: 0% 80%; border-radius: 300px; [/class] [class=role] filter: drop-shadow(2px 2px 0px rgba(0, 56, 100, 1)); position: absolute; left: 12px; top: 50px; overflow: visible; width: auto; text-align: left; font-style: italic; font-weight: normal; font-size: 20px; color: rgba(0,144,255,1); text-transform: uppercase; [/class] [class=title] filter: drop-shadow(3px 3px 0px rgba(133, 0, 133, 1)); position: absolute; left: 12px; top: 0px; overflow: visible; width: auto; text-align: left; font-weight: 700; font-size: 40px; color: rgba(245,59,248,1); text-transform: uppercase; [/class] [class=tag] position: relative; overflow: hidden; width: auto; height: auto; display: inline; background-color: #FF0090; border-radius: 50px; box-shadow: 2px 2px 0px #770043; color: #770043; text-transform: uppercase; font-size: 9px; font-weight: 700; padding-right: 5px; padding-left: 5px; margin-right: 3px; [/class] [class=tab] position: absolute; overflow: visible; [/class] [class name=tab state=hover] background-color: #fff; [/class] [class=credit] position: relative; overflow: hidden; width: 100%; height: 10px; text-align: center; font-style: normal; font-weight: normal; font-size: 8px; color: #026B6E; opacity: 0.8; [/class] [script class=tab on=click] hide tabsContent set currentTab (getText) if (eq ${currentTab} 1) (show tabsContentBasics) if (eq ${currentTab} 1) (show sub1) if (eq ${currentTab} 1) (hide sub2) if (eq ${currentTab} 1) (hide sub3) if (eq ${currentTab} 1) (hide sub4) if (eq ${currentTab} 1) (hide sub5) if (eq ${currentTab} 2) (show tabsContentPersona) if (eq ${currentTab} 2) (show sub2) if (eq ${currentTab} 2) (hide sub1) if (eq ${currentTab} 2) (hide sub3) if (eq ${currentTab} 2) (hide sub4) if (eq ${currentTab} 2) (hide sub5) if (eq ${currentTab} 3) (show tabsContentBackground) if (eq ${currentTab} 3) (show sub3) if (eq ${currentTab} 3) (hide sub1) if (eq ${currentTab} 3) (hide sub2) if (eq ${currentTab} 3) (hide sub4) if (eq ${currentTab} 3) (hide sub5) if (eq ${currentTab} 4) (show tabsContentOther) if (eq ${currentTab} 4) (show sub4) if (eq ${currentTab} 4) (hide sub1) if (eq ${currentTab} 4) (hide sub2) if (eq ${currentTab} 4) (hide sub3) if (eq ${currentTab} 4) (hide sub5) if (eq ${currentTab} 5) (show tabsContentGallery) if (eq ${currentTab} 5) (hide sub4) if (eq ${currentTab} 5) (hide sub1) if (eq ${currentTab} 5) (hide sub2) if (eq ${currentTab} 5) (hide sub3) if (eq ${currentTab} 5) (show sub5) [/script]
[div class=bkgd]
[div class="tabsContent tabsContentBasics"][div class=textcontainer][div class=text][div class=tag]name:[/div] never know tears for that sucker

[div class=tag]nickname:[/div] only one dick?

[div class=tag]age:[/div] that's a bummer

[div class=tag]gender:[/div] dancing all night

[div class=tag]sexuality:[/div] get guys' numbers

[div class=tag]role:[/div] you're better off

[div class=tag]faceclaim:[/div] im glad that he's gone

[div class=tag]ethnicity:[/div] bitch i love you

[div class=tag]nationality:[/div] he never loved you

[div class=tag]hair color:[/div] never saw the pretty things in you that i do

[div class=tag]eye color:[/div] i miss your madness

[div class=tag]height/weight:[/div] you're kinda ratchet

[div class=tag]body type/build:[/div] we used to go out every night

[div class=tag]body mods:[/div] get into bad shit
[/div][/div][/div]
[div class="tabsContent tabsContentPersona" style="display: none;"][div class=textcontainer][div class=text][div class=tag]personality:[/div] Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. A iaculis at erat pellentesque adipiscing commodo elit at. Sollicitudin aliquam ultrices sagittis orci a. Dictum non consectetur a erat nam at lectus urna duis. Id leo in vitae turpis massa sed. In eu mi bibendum neque egestas congue quisque egestas. Quis vel eros donec ac. In nisl nisi scelerisque eu ultrices vitae auctor. Posuere urna nec tincidunt praesent semper feugiat nibh sed pulvinar. Ligula ullamcorper malesuada proin libero nunc consequat. Purus ut faucibus pulvinar elementum integer enim neque volutpat ac. Augue mauris augue neque gravida in fermentum. Dictum sit amet justo donec. Facilisi morbi tempus iaculis urna id volutpat lacus laoreet non. Elementum curabitur vitae nunc sed velit dignissim sodales. Sagittis aliquam malesuada bibendum arcu vitae elementum curabitur. Eget sit amet tellus cras adipiscing enim eu turpis. Odio tempor orci dapibus ultrices in iaculis nunc sed augue.

[div class=tag]strengths:[/div] Tellus id interdum velit laoreet. Posuere ac ut consequat semper viverra nam. Nulla facilisi morbi tempus iaculis urna id volutpat lacus. Ut placerat orci nulla pellentesque dignissim enim sit amet. Platea dictumst vestibulum rhoncus est pellentesque elit ullamcorper dignissim. Feugiat vivamus at augue eget. Quis enim lobortis scelerisque fermentum dui faucibus in ornare. Turpis egestas integer eget aliquet nibh praesent tristique. Lectus quam id leo in vitae turpis. Ac placerat vestibulum lectus mauris ultrices eros in cursus. Eget sit amet tellus cras adipiscing.

[div class=tag]weaknesses:[/div] In metus vulputate eu scelerisque felis imperdiet proin fermentum leo. Porta non pulvinar neque laoreet suspendisse interdum. Egestas sed tempus urna et. Sit amet nisl purus in mollis nunc sed id. Lobortis feugiat vivamus at augue. Leo vel orci porta non pulvinar neque laoreet suspendisse. Pharetra diam sit amet nisl suscipit. Vel risus commodo viverra maecenas accumsan. Sagittis id consectetur purus ut faucibus pulvinar elementum integer enim. Maecenas sed enim ut sem viverra aliquet eget sit amet. Odio euismod lacinia at quis risus sed vulputate odio ut. Donec adipiscing tristique risus nec feugiat in fermentum. Hendrerit dolor magna eget est. Vel elit scelerisque mauris pellentesque pulvinar pellentesque habitant morbi tristique. Vulputate enim nulla aliquet porttitor. Pellentesque elit eget gravida cum sociis natoque. Elit ullamcorper dignissim cras tincidunt lobortis feugiat vivamus. Molestie nunc non blandit massa enim nec dui nunc mattis. Mattis pellentesque id nibh tortor id aliquet lectus. Scelerisque fermentum dui faucibus in ornare quam viverra orci sagittis.

[div class=tag]habits:[/div] Eu non diam phasellus vestibulum lorem sed. Tellus integer feugiat scelerisque varius morbi enim nunc. At tempor commodo ullamcorper a lacus vestibulum sed arcu non. Erat pellentesque adipiscing commodo elit at imperdiet dui accumsan. Molestie ac feugiat sed lectus. Elementum facilisis leo vel fringilla. Massa placerat duis ultricies lacus sed turpis. Egestas quis ipsum suspendisse ultrices. Felis donec et odio pellentesque diam volutpat commodo sed egestas. Enim sed faucibus turpis in eu mi. Ultricies mi quis hendrerit dolor magna eget est. Consectetur purus ut faucibus pulvinar elementum integer. Cursus mattis molestie a iaculis. Placerat duis ultricies lacus sed turpis tincidunt id aliquet risus. Amet mauris commodo quis imperdiet massa tincidunt nunc pulvinar. Imperdiet massa tincidunt nunc pulvinar sapien et ligula ullamcorper malesuada. Cras sed felis eget velit aliquet sagittis id. Tristique sollicitudin nibh sit amet commodo nulla facilisi nullam vehicula. Eget felis eget nunc lobortis mattis aliquam faucibus purus in. Mattis vulputate enim nulla aliquet porttitor lacus.

[div class=tag]quirks:[/div] Amet justo donec enim diam. Felis eget nunc lobortis mattis. Pretium viverra suspendisse potenti nullam ac. Proin sed libero enim sed faucibus. Consequat ac felis donec et odio pellentesque diam. Dignissim cras tincidunt lobortis feugiat vivamus at augue eget. Fames ac turpis egestas integer eget. Et odio pellentesque diam volutpat. Urna cursus eget nunc scelerisque viverra mauris. Platea dictumst vestibulum rhoncus est pellentesque elit ullamcorper dignissim cras. Turpis cursus in hac habitasse platea dictumst quisque. Nibh praesent tristique magna sit amet purus. Aliquam faucibus purus in massa tempor nec. Euismod elementum nisi quis eleifend quam adipiscing vitae proin.

[div class=tag]fears:[/div] Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. A iaculis at erat pellentesque adipiscing commodo elit at. Sollicitudin aliquam ultrices sagittis orci a. Dictum non consectetur a erat nam at lectus urna duis. Id leo in vitae turpis massa sed. In eu mi bibendum neque egestas congue quisque egestas. Quis vel eros donec ac. In nisl nisi scelerisque eu ultrices vitae auctor. Posuere urna nec tincidunt praesent semper feugiat nibh sed pulvinar. Ligula ullamcorper malesuada proin libero nunc consequat. Purus ut faucibus pulvinar elementum integer enim neque volutpat ac. Augue mauris augue neque gravida in fermentum. Dictum sit amet justo donec. Facilisi morbi tempus iaculis urna id volutpat lacus laoreet non. Elementum curabitur vitae nunc sed velit dignissim sodales. Sagittis aliquam malesuada bibendum arcu vitae elementum curabitur. Eget sit amet tellus cras adipiscing enim eu turpis. Odio tempor orci dapibus ultrices in iaculis nunc sed augue.

[div class=tag]motivations:[/div] Tellus id interdum velit laoreet. Posuere ac ut consequat semper viverra nam. Nulla facilisi morbi tempus iaculis urna id volutpat lacus. Ut placerat orci nulla pellentesque dignissim enim sit amet. Platea dictumst vestibulum rhoncus est pellentesque elit ullamcorper dignissim. Feugiat vivamus at augue eget. Quis enim lobortis scelerisque fermentum dui faucibus in ornare. Turpis egestas integer eget aliquet nibh praesent tristique. Lectus quam id leo in vitae turpis. Ac placerat vestibulum lectus mauris ultrices eros in cursus. Eget sit amet tellus cras adipiscing.

[div class=tag]likes:[/div] In metus vulputate eu scelerisque felis imperdiet proin fermentum leo. Porta non pulvinar neque laoreet suspendisse interdum. Egestas sed tempus urna et. Sit amet nisl purus in mollis nunc sed id. Lobortis feugiat vivamus at augue. Leo vel orci porta non pulvinar neque laoreet suspendisse. Pharetra diam sit amet nisl suscipit. Vel risus commodo viverra maecenas accumsan. Sagittis id consectetur purus ut faucibus pulvinar elementum integer enim. Maecenas sed enim ut sem viverra aliquet eget sit amet. Odio euismod lacinia at quis risus sed vulputate odio ut. Donec adipiscing tristique risus nec feugiat in fermentum. Hendrerit dolor magna eget est. Vel elit scelerisque mauris pellentesque pulvinar pellentesque habitant morbi tristique. Vulputate enim nulla aliquet porttitor. Pellentesque elit eget gravida cum sociis natoque. Elit ullamcorper dignissim cras tincidunt lobortis feugiat vivamus. Molestie nunc non blandit massa enim nec dui nunc mattis. Mattis pellentesque id nibh tortor id aliquet lectus. Scelerisque fermentum dui faucibus in ornare quam viverra orci sagittis.

[div class=tag]dislikes:[/div] Eu non diam phasellus vestibulum lorem sed. Tellus integer feugiat scelerisque varius morbi enim nunc. At tempor commodo ullamcorper a lacus vestibulum sed arcu non. Erat pellentesque adipiscing commodo elit at imperdiet dui accumsan. Molestie ac feugiat sed lectus. Elementum facilisis leo vel fringilla. Massa placerat duis ultricies lacus sed turpis. Egestas quis ipsum suspendisse ultrices. Felis donec et odio pellentesque diam volutpat commodo sed egestas. Enim sed faucibus turpis in eu mi. Ultricies mi quis hendrerit dolor magna eget est. Consectetur purus ut faucibus pulvinar elementum integer. Cursus mattis molestie a iaculis. Placerat duis ultricies lacus sed turpis tincidunt id aliquet risus. Amet mauris commodo quis imperdiet massa tincidunt nunc pulvinar. Imperdiet massa tincidunt nunc pulvinar sapien et ligula ullamcorper malesuada. Cras sed felis eget velit aliquet sagittis id. Tristique sollicitudin nibh sit amet commodo nulla facilisi nullam vehicula. Eget felis eget nunc lobortis mattis aliquam faucibus purus in. Mattis vulputate enim nulla aliquet porttitor lacus.
[/div][/div][/div]
[div class="tabsContent tabsContentBackground" style="display: none;"][div class=textcontainer][div class=text][div class=tag]history:[/div] Eu non diam phasellus vestibulum lorem sed. Tellus integer feugiat scelerisque varius morbi enim nunc. At tempor commodo ullamcorper a lacus vestibulum sed arcu non. Erat pellentesque adipiscing commodo elit at imperdiet dui accumsan. Molestie ac feugiat sed lectus. Elementum facilisis leo vel fringilla. Massa placerat duis ultricies lacus sed turpis. Egestas quis ipsum suspendisse ultrices. Felis donec et odio pellentesque diam volutpat commodo sed egestas. Enim sed faucibus turpis in eu mi. Ultricies mi quis hendrerit dolor magna eget est. Consectetur purus ut faucibus pulvinar elementum integer. Cursus mattis molestie a iaculis. Placerat duis ultricies lacus sed turpis tincidunt id aliquet risus. Amet mauris commodo quis imperdiet massa tincidunt nunc pulvinar. Imperdiet massa tincidunt nunc pulvinar sapien et ligula ullamcorper malesuada. Cras sed felis eget velit aliquet sagittis id. Tristique sollicitudin nibh sit amet commodo nulla facilisi nullam vehicula. Eget felis eget nunc lobortis mattis aliquam faucibus purus in. Mattis vulputate enim nulla aliquet porttitor lacus.

[div class=tag]family:[/div] Tellus id interdum velit laoreet. Posuere ac ut consequat semper viverra nam. Nulla facilisi morbi tempus iaculis urna id volutpat lacus. Ut placerat orci nulla pellentesque dignissim enim sit amet. Platea dictumst vestibulum rhoncus est pellentesque elit ullamcorper dignissim. Feugiat vivamus at augue eget. Quis enim lobortis scelerisque fermentum dui faucibus in ornare. Turpis egestas integer eget aliquet nibh praesent tristique. Lectus quam id leo in vitae turpis. Ac placerat vestibulum lectus mauris ultrices eros in cursus. Eget sit amet tellus cras adipiscing.

[div class=tag]occupation:[/div] In metus vulputate eu scelerisque felis imperdiet proin fermentum leo. Porta non pulvinar neque laoreet suspendisse interdum. Egestas sed tempus urna et. Sit amet nisl purus in mollis nunc sed id. Lobortis feugiat vivamus at augue. Leo vel orci porta non pulvinar neque laoreet suspendisse. Pharetra diam sit amet nisl suscipit. Vel risus commodo viverra maecenas accumsan. Sagittis id consectetur purus ut faucibus pulvinar elementum integer enim. Maecenas sed enim ut sem viverra aliquet eget sit amet. Odio euismod lacinia at quis risus sed vulputate odio ut. Donec adipiscing tristique risus nec feugiat in fermentum. Hendrerit dolor magna eget est. Vel elit scelerisque mauris pellentesque pulvinar pellentesque habitant morbi tristique. Vulputate enim nulla aliquet porttitor. Pellentesque elit eget gravida cum sociis natoque. Elit ullamcorper dignissim cras tincidunt lobortis feugiat vivamus. Molestie nunc non blandit massa enim nec dui nunc mattis. Mattis pellentesque id nibh tortor id aliquet lectus. Scelerisque fermentum dui faucibus in ornare quam viverra orci sagittis.

[div class=tag]romantic history:[/div] Eu non diam phasellus vestibulum lorem sed. Tellus integer feugiat scelerisque varius morbi enim nunc. At tempor commodo ullamcorper a lacus vestibulum sed arcu non. Erat pellentesque adipiscing commodo elit at imperdiet dui accumsan. Molestie ac feugiat sed lectus. Elementum facilisis leo vel fringilla. Massa placerat duis ultricies lacus sed turpis. Egestas quis ipsum suspendisse ultrices. Felis donec et odio pellentesque diam volutpat commodo sed egestas. Enim sed faucibus turpis in eu mi. Ultricies mi quis hendrerit dolor magna eget est. Consectetur purus ut faucibus pulvinar elementum integer. Cursus mattis molestie a iaculis. Placerat duis ultricies lacus sed turpis tincidunt id aliquet risus. Amet mauris commodo quis imperdiet massa tincidunt nunc pulvinar. Imperdiet massa tincidunt nunc pulvinar sapien et ligula ullamcorper malesuada. Cras sed felis eget velit aliquet sagittis id. Tristique sollicitudin nibh sit amet commodo nulla facilisi nullam vehicula. Eget felis eget nunc lobortis mattis aliquam faucibus purus in. Mattis vulputate enim nulla aliquet porttitor lacus.
[/div][/div][/div]
[div class="tabsContent tabsContentOther" style="display: none;"][div class=textcontainer][div class=text][div class=tag]theme song:[/div] glad he's gone - tove lo

[div class=tag]favorite drink:[/div] jager bombs

[div class=tag]favorite food:[/div] popcorn shrimp

[div class=tag]favorite movie:[/div] mister nobody

[div class=tag]favorite book:[/div] legend - marie lu

[div class=tag]relationships:[/div]
  • past lover 1:
  • past lover 2:
  • past lover 3:
  • love interest 1:
  • love interest 2:
  • love interest 3:
  • best friend 1:
  • best friend 2:
  • best friend 3:
  • rival 1:
  • rival 2:
  • rival 3:
[/div][/div][/div]
[div class="tabsContent tabsContentGallery" style="display: none;"][div class=textcontainer][div class=text][div class=tag]face/body:[/div]
8a2c62c34c8bc966976521cf0dc45b30.jpg

aab6bf7f29ae21feb5e82decf9a76784.jpg

8ad273f765b35161d0ed2990fcc03738.jpg


[div class=tag]fashion:[/div]
d8b6ab86826f100d6ec846d97684e3c2.jpg

16f833ee5728c8e4093a2229e4abaf27.jpg

b28c077d4dedb80c62a369ca4da9a011.jpg


[div class=tag]body mods:[/div]
3740772a94140ca155d4d394982064ff.jpg

5a34396a620b306f702e1e7042d77c5d.jpg

2ec7f48fb70bb5b272fd143d1b4301a9.jpg


[/div][/div][/div]
[div class="header sub1"]basics[/div]
[div class="header sub2" style="display: none;"]persona[/div]
[div class="header sub3" style="display: none;"]background[/div]
[div class="header sub4" style="display: none;"]other[/div]
[div class="header sub5" style="display: none;"]gallery[/div]
[div class=tabs]
[div class="five tab"]5[/div]
[div class="four tab"]4[/div]
[div class="three tab"]3[/div]
[div class="two tab"]2[/div]
[div class="one tab"]1[/div][/div]
[div class=pic2][/div]
[div class=pic][/div]
[div class=role]he never loved you[/div]
[div class=title]glad he's gone[/div]
[/div][div class=credit]code by sox sox [/div]

Code: 
[nobr]
[class=bkgd]
        position: relative;
        box-sizing: border-box;
        width: 600px;
        height: 400px;
        background: url(https://imgur.com/QeunQKm.jpg);
        overflow: hidden;
        margin-left: auto;
        margin-right: auto;
        border-radius: 8px;
[/class]
[class=textcontainer]
        position: absolute;
        overflow: hidden;
        width: 298px;
        height: 290px;
        left: 283.096px;
        top: 100.001px;
[/class]
[class=text]
        position: relative;
        overflow: auto;
        width: 295px;
        height: 265px;
        text-align: justify;
        font-family: Raleway;
        line-height: 12px;
        font-size: 10px;
        color: #3BF2F8;
        padding: 10px;
        text-transform: lowercase;
[/class]
[class=header]
        text-shadow: 2px 2px 0px #007A4D;
        position: absolute;
        left: 280px;
        top: 60px;
        overflow: visible;
        width: 300px;
        text-align: center;
        font-style: normal;
        font-weight: normal;
        font-size: 25px;
        color: #00FFA2;
        text-transform: uppercase;
[/class]
[class=five]
        position: absolute;
        overflow: visible;
        width: 32px;
        height: 32px;
        left: 164px;
        top: 92px;
        box-shadow: 3px 3px 0px #770043;
        border-radius: 50px;
        background-color: #FF0090;
        font-size: 15px;
        font-weight: 700;
        line-height: 30px;
        color: #770043;
        text-align: center;
[/class]
[class=four]
        position: absolute;
        overflow: visible;
        width: 32px;
        height: 32px;
        left: 126px;
        top: 92px;
        box-shadow: 3px 3px 0px #850085;
        border-radius: 50px;
        background-color: #FF00FF;
        font-size: 15px;
        font-weight: 700;
        line-height: 30px;
        color: #850085;
        text-align: center;
[/class]
[class=three]
        position: absolute;
        overflow: visible;
        width: 32px;
        height: 32px;
        left: 88px;
        top: 92px;
        box-shadow: 3px 3px 0px #003864;
        border-radius: 50px;
        background-color: #0090FF;
        font-size: 15px;
        font-weight: 700;
        line-height: 30px;
        color: #003864;
        text-align: center;
[/class]
[class=two]
        position: absolute;
        overflow: visible;
        width: 32px;
        height: 32px;
        left: 50px;
        top: 92px;
        box-shadow: 3px 3px 0px #026B6E;
        border-radius: 50px;
        background-color: #3BF2F8;
        font-size: 15px;
        font-weight: 700;
        line-height: 30px;
        color: #026B6E;
        text-align: center;
[/class]
[class=one]
        position: absolute;
        overflow: visible;
        width: 32px;
        height: 32px;
        left: 12px;
        top: 92px;
        box-shadow: 3px 3px 0px #007A4D;
        border-radius: 50px;
        background-color: #00FFA2;
        font-size: 15px;
        font-weight: 700;
        line-height: 30px;
        color: #007A4D;
        text-align: center;
[/class]
[class=pic2]
        position: absolute;
        overflow: visible;
        width: 100px;
        height: 100px;
        left: 510px;
        top: -23px;
        border: 2px solid #3BF2F8;
        box-shadow: 0px 3px 0px #026B6E;
        background: url(https://i.pinimg.com/564x/9e/de/f4/9edef4cb55bbf02a3567dbef220784b6.jpg);
        background-size: 100%;
        border-radius: 300px;
[/class]
[class=pic]
        position: absolute;
        overflow: visible;
        width: 303px;
        height: 300px;
        left: -50px;
        top: 150px;
        border: 3px solid #FF0090;
        box-shadow: 3px 0px 0px #770043;
        background: url(https://imgur.com/KPI4CNr.jpg);
        background-size: 120%;
        background-position: 0% 80%;
        border-radius: 300px;
[/class]
[class=role]
        filter: drop-shadow(2px 2px 0px rgba(0, 56, 100, 1));
        position: absolute;
        left: 12px;
        top: 50px;
        overflow: visible;
        width: auto;
        text-align: left;
        font-style: italic;
        font-weight: normal;
        font-size: 20px;
        color: rgba(0,144,255,1);
        text-transform: uppercase;
[/class]
[class=title]
        filter: drop-shadow(3px 3px 0px rgba(133, 0, 133, 1));
        position: absolute;
        left: 12px;
        top: 0px;
        overflow: visible;
        width: auto;
        text-align: left;
        font-weight: 700;
        font-size: 40px;
        color: rgba(245,59,248,1);
        text-transform: uppercase;
[/class]
[class=tag]
        position: relative;
        overflow: hidden;
        width: auto;
        height: auto;
        display: inline;
        background-color: #FF0090;
        border-radius: 50px;
        box-shadow: 2px 2px 0px #770043;
        color: #770043;
        text-transform: uppercase;
        font-size: 9px;
        font-weight: 700;
        padding-right: 5px;
        padding-left: 5px;
        margin-right: 3px;
[/class]
[class=tab]
        position: absolute;
        overflow: visible;
[/class]
[class name=tab state=hover]
        background-color: #fff;
[/class] 
[class=credit]
        position: relative;
        overflow: hidden;
        width: 100%;
        height: 10px;
        text-align: center;
        font-style: normal;
        font-weight: normal;
        font-size: 8px;
        color: #026B6E;
        opacity: 0.8;
[/class]
    [script class=tab on=click]
                hide tabsContent
                set currentTab (getText)
                if (eq ${currentTab} 1) (show tabsContentBasics)
                if (eq ${currentTab} 1) (show sub1)
                if (eq ${currentTab} 1) (hide sub2)
                if (eq ${currentTab} 1) (hide  sub3)
                if (eq ${currentTab} 1) (hide  sub4)
                if (eq ${currentTab} 1) (hide  sub5)
                if (eq ${currentTab} 2) (show tabsContentPersona)
                if (eq ${currentTab} 2) (show sub2)
                if (eq ${currentTab} 2) (hide  sub1)
                if (eq ${currentTab} 2) (hide  sub3)
                if (eq ${currentTab} 2) (hide sub4)
                if (eq ${currentTab} 2) (hide  sub5)
                if (eq ${currentTab} 3) (show tabsContentBackground)
                if (eq ${currentTab} 3) (show sub3)
                if (eq ${currentTab} 3) (hide sub1)
                if (eq ${currentTab} 3) (hide  sub2)
                if (eq ${currentTab} 3) (hide sub4)
                if (eq ${currentTab} 3) (hide  sub5)
                if (eq ${currentTab} 4) (show tabsContentOther)
                if (eq ${currentTab} 4) (show sub4)
                if (eq ${currentTab} 4) (hide  sub1)
                if (eq ${currentTab} 4) (hide sub2)
                if (eq ${currentTab} 4) (hide sub3)
                if (eq ${currentTab} 4) (hide  sub5)
                if (eq ${currentTab} 5) (show tabsContentGallery)
                if (eq ${currentTab} 5) (hide sub4)
                if (eq ${currentTab} 5) (hide  sub1)
                if (eq ${currentTab} 5) (hide sub2)
                if (eq ${currentTab} 5) (hide sub3)
                if (eq ${currentTab} 5) (show sub5)
    [/script]
[/nobr]
[div class=bkgd]
[div class="tabsContent tabsContentBasics"][div class=textcontainer][div class=text][div class=tag][font=Varela Round]name:[/font][/div] never know tears for that sucker

[div class=tag][font=Varela Round]nickname:[/font][/div] only one dick?

[div class=tag][font=Varela Round]age:[/font][/div] that's a bummer

[div class=tag][font=Varela Round]gender:[/font][/div] dancing all night

[div class=tag][font=Varela Round]sexuality:[/font][/div] get guys' numbers

[div class=tag][font=Varela Round]role:[/font][/div] you're better off

[div class=tag][font=Varela Round]faceclaim:[/font][/div] im glad that he's gone

[div class=tag][font=Varela Round]ethnicity:[/font][/div] bitch i love you

[div class=tag][font=Varela Round]nationality:[/font][/div] he never loved you

[div class=tag][font=Varela Round]hair color:[/font][/div] never saw the pretty things in you that i do

[div class=tag][font=Varela Round]eye color:[/font][/div] i miss your madness

[div class=tag][font=Varela Round]height/weight:[/font][/div] you're kinda ratchet

[div class=tag][font=Varela Round]body type/build:[/font][/div] we used to go out every night

[div class=tag][font=Varela Round]body mods:[/font][/div] get into bad shit
[/div][/div][/div]
[div class="tabsContent tabsContentPersona" style="display: none;"][div class=textcontainer][div class=text][div class=tag][font=Varela Round]personality:[/font][/div] Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. A iaculis at erat pellentesque adipiscing commodo elit at. Sollicitudin aliquam ultrices sagittis orci a. Dictum non consectetur a erat nam at lectus urna duis. Id leo in vitae turpis massa sed. In eu mi bibendum neque egestas congue quisque egestas. Quis vel eros donec ac. In nisl nisi scelerisque eu ultrices vitae auctor. Posuere urna nec tincidunt praesent semper feugiat nibh sed pulvinar. Ligula ullamcorper malesuada proin libero nunc consequat. Purus ut faucibus pulvinar elementum integer enim neque volutpat ac. Augue mauris augue neque gravida in fermentum. Dictum sit amet justo donec. Facilisi morbi tempus iaculis urna id volutpat lacus laoreet non. Elementum curabitur vitae nunc sed velit dignissim sodales. Sagittis aliquam malesuada bibendum arcu vitae elementum curabitur. Eget sit amet tellus cras adipiscing enim eu turpis. Odio tempor orci dapibus ultrices in iaculis nunc sed augue.

[div class=tag][font=Varela Round]strengths:[/font][/div] Tellus id interdum velit laoreet. Posuere ac ut consequat semper viverra nam. Nulla facilisi morbi tempus iaculis urna id volutpat lacus. Ut placerat orci nulla pellentesque dignissim enim sit amet. Platea dictumst vestibulum rhoncus est pellentesque elit ullamcorper dignissim. Feugiat vivamus at augue eget. Quis enim lobortis scelerisque fermentum dui faucibus in ornare. Turpis egestas integer eget aliquet nibh praesent tristique. Lectus quam id leo in vitae turpis. Ac placerat vestibulum lectus mauris ultrices eros in cursus. Eget sit amet tellus cras adipiscing.

[div class=tag][font=Varela Round]weaknesses:[/font][/div] In metus vulputate eu scelerisque felis imperdiet proin fermentum leo. Porta non pulvinar neque laoreet suspendisse interdum. Egestas sed tempus urna et. Sit amet nisl purus in mollis nunc sed id. Lobortis feugiat vivamus at augue. Leo vel orci porta non pulvinar neque laoreet suspendisse. Pharetra diam sit amet nisl suscipit. Vel risus commodo viverra maecenas accumsan. Sagittis id consectetur purus ut faucibus pulvinar elementum integer enim. Maecenas sed enim ut sem viverra aliquet eget sit amet. Odio euismod lacinia at quis risus sed vulputate odio ut. Donec adipiscing tristique risus nec feugiat in fermentum. Hendrerit dolor magna eget est. Vel elit scelerisque mauris pellentesque pulvinar pellentesque habitant morbi tristique. Vulputate enim nulla aliquet porttitor. Pellentesque elit eget gravida cum sociis natoque. Elit ullamcorper dignissim cras tincidunt lobortis feugiat vivamus. Molestie nunc non blandit massa enim nec dui nunc mattis. Mattis pellentesque id nibh tortor id aliquet lectus. Scelerisque fermentum dui faucibus in ornare quam viverra orci sagittis.

[div class=tag][font=Varela Round]habits:[/font][/div] Eu non diam phasellus vestibulum lorem sed. Tellus integer feugiat scelerisque varius morbi enim nunc. At tempor commodo ullamcorper a lacus vestibulum sed arcu non. Erat pellentesque adipiscing commodo elit at imperdiet dui accumsan. Molestie ac feugiat sed lectus. Elementum facilisis leo vel fringilla. Massa placerat duis ultricies lacus sed turpis. Egestas quis ipsum suspendisse ultrices. Felis donec et odio pellentesque diam volutpat commodo sed egestas. Enim sed faucibus turpis in eu mi. Ultricies mi quis hendrerit dolor magna eget est. Consectetur purus ut faucibus pulvinar elementum integer. Cursus mattis molestie a iaculis. Placerat duis ultricies lacus sed turpis tincidunt id aliquet risus. Amet mauris commodo quis imperdiet massa tincidunt nunc pulvinar. Imperdiet massa tincidunt nunc pulvinar sapien et ligula ullamcorper malesuada. Cras sed felis eget velit aliquet sagittis id. Tristique sollicitudin nibh sit amet commodo nulla facilisi nullam vehicula. Eget felis eget nunc lobortis mattis aliquam faucibus purus in. Mattis vulputate enim nulla aliquet porttitor lacus.

[div class=tag][font=Varela Round]quirks:[/font][/div] Amet justo donec enim diam. Felis eget nunc lobortis mattis. Pretium viverra suspendisse potenti nullam ac. Proin sed libero enim sed faucibus. Consequat ac felis donec et odio pellentesque diam. Dignissim cras tincidunt lobortis feugiat vivamus at augue eget. Fames ac turpis egestas integer eget. Et odio pellentesque diam volutpat. Urna cursus eget nunc scelerisque viverra mauris. Platea dictumst vestibulum rhoncus est pellentesque elit ullamcorper dignissim cras. Turpis cursus in hac habitasse platea dictumst quisque. Nibh praesent tristique magna sit amet purus. Aliquam faucibus purus in massa tempor nec. Euismod elementum nisi quis eleifend quam adipiscing vitae proin.

[div class=tag][font=Varela Round]fears:[/font][/div] Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. A iaculis at erat pellentesque adipiscing commodo elit at. Sollicitudin aliquam ultrices sagittis orci a. Dictum non consectetur a erat nam at lectus urna duis. Id leo in vitae turpis massa sed. In eu mi bibendum neque egestas congue quisque egestas. Quis vel eros donec ac. In nisl nisi scelerisque eu ultrices vitae auctor. Posuere urna nec tincidunt praesent semper feugiat nibh sed pulvinar. Ligula ullamcorper malesuada proin libero nunc consequat. Purus ut faucibus pulvinar elementum integer enim neque volutpat ac. Augue mauris augue neque gravida in fermentum. Dictum sit amet justo donec. Facilisi morbi tempus iaculis urna id volutpat lacus laoreet non. Elementum curabitur vitae nunc sed velit dignissim sodales. Sagittis aliquam malesuada bibendum arcu vitae elementum curabitur. Eget sit amet tellus cras adipiscing enim eu turpis. Odio tempor orci dapibus ultrices in iaculis nunc sed augue.

[div class=tag][font=Varela Round]motivations:[/font][/div] Tellus id interdum velit laoreet. Posuere ac ut consequat semper viverra nam. Nulla facilisi morbi tempus iaculis urna id volutpat lacus. Ut placerat orci nulla pellentesque dignissim enim sit amet. Platea dictumst vestibulum rhoncus est pellentesque elit ullamcorper dignissim. Feugiat vivamus at augue eget. Quis enim lobortis scelerisque fermentum dui faucibus in ornare. Turpis egestas integer eget aliquet nibh praesent tristique. Lectus quam id leo in vitae turpis. Ac placerat vestibulum lectus mauris ultrices eros in cursus. Eget sit amet tellus cras adipiscing.

[div class=tag][font=Varela Round]likes:[/font][/div] In metus vulputate eu scelerisque felis imperdiet proin fermentum leo. Porta non pulvinar neque laoreet suspendisse interdum. Egestas sed tempus urna et. Sit amet nisl purus in mollis nunc sed id. Lobortis feugiat vivamus at augue. Leo vel orci porta non pulvinar neque laoreet suspendisse. Pharetra diam sit amet nisl suscipit. Vel risus commodo viverra maecenas accumsan. Sagittis id consectetur purus ut faucibus pulvinar elementum integer enim. Maecenas sed enim ut sem viverra aliquet eget sit amet. Odio euismod lacinia at quis risus sed vulputate odio ut. Donec adipiscing tristique risus nec feugiat in fermentum. Hendrerit dolor magna eget est. Vel elit scelerisque mauris pellentesque pulvinar pellentesque habitant morbi tristique. Vulputate enim nulla aliquet porttitor. Pellentesque elit eget gravida cum sociis natoque. Elit ullamcorper dignissim cras tincidunt lobortis feugiat vivamus. Molestie nunc non blandit massa enim nec dui nunc mattis. Mattis pellentesque id nibh tortor id aliquet lectus. Scelerisque fermentum dui faucibus in ornare quam viverra orci sagittis.

[div class=tag][font=Varela Round]dislikes:[/font][/div] Eu non diam phasellus vestibulum lorem sed. Tellus integer feugiat scelerisque varius morbi enim nunc. At tempor commodo ullamcorper a lacus vestibulum sed arcu non. Erat pellentesque adipiscing commodo elit at imperdiet dui accumsan. Molestie ac feugiat sed lectus. Elementum facilisis leo vel fringilla. Massa placerat duis ultricies lacus sed turpis. Egestas quis ipsum suspendisse ultrices. Felis donec et odio pellentesque diam volutpat commodo sed egestas. Enim sed faucibus turpis in eu mi. Ultricies mi quis hendrerit dolor magna eget est. Consectetur purus ut faucibus pulvinar elementum integer. Cursus mattis molestie a iaculis. Placerat duis ultricies lacus sed turpis tincidunt id aliquet risus. Amet mauris commodo quis imperdiet massa tincidunt nunc pulvinar. Imperdiet massa tincidunt nunc pulvinar sapien et ligula ullamcorper malesuada. Cras sed felis eget velit aliquet sagittis id. Tristique sollicitudin nibh sit amet commodo nulla facilisi nullam vehicula. Eget felis eget nunc lobortis mattis aliquam faucibus purus in. Mattis vulputate enim nulla aliquet porttitor lacus.
[/div][/div][/div]
[div class="tabsContent tabsContentBackground" style="display: none;"][div class=textcontainer][div class=text][div class=tag][font=Varela Round]history:[/font][/div] Eu non diam phasellus vestibulum lorem sed. Tellus integer feugiat scelerisque varius morbi enim nunc. At tempor commodo ullamcorper a lacus vestibulum sed arcu non. Erat pellentesque adipiscing commodo elit at imperdiet dui accumsan. Molestie ac feugiat sed lectus. Elementum facilisis leo vel fringilla. Massa placerat duis ultricies lacus sed turpis. Egestas quis ipsum suspendisse ultrices. Felis donec et odio pellentesque diam volutpat commodo sed egestas. Enim sed faucibus turpis in eu mi. Ultricies mi quis hendrerit dolor magna eget est. Consectetur purus ut faucibus pulvinar elementum integer. Cursus mattis molestie a iaculis. Placerat duis ultricies lacus sed turpis tincidunt id aliquet risus. Amet mauris commodo quis imperdiet massa tincidunt nunc pulvinar. Imperdiet massa tincidunt nunc pulvinar sapien et ligula ullamcorper malesuada. Cras sed felis eget velit aliquet sagittis id. Tristique sollicitudin nibh sit amet commodo nulla facilisi nullam vehicula. Eget felis eget nunc lobortis mattis aliquam faucibus purus in. Mattis vulputate enim nulla aliquet porttitor lacus.

[div class=tag][font=Varela Round]family:[/font][/div] Tellus id interdum velit laoreet. Posuere ac ut consequat semper viverra nam. Nulla facilisi morbi tempus iaculis urna id volutpat lacus. Ut placerat orci nulla pellentesque dignissim enim sit amet. Platea dictumst vestibulum rhoncus est pellentesque elit ullamcorper dignissim. Feugiat vivamus at augue eget. Quis enim lobortis scelerisque fermentum dui faucibus in ornare. Turpis egestas integer eget aliquet nibh praesent tristique. Lectus quam id leo in vitae turpis. Ac placerat vestibulum lectus mauris ultrices eros in cursus. Eget sit amet tellus cras adipiscing.

[div class=tag][font=Varela Round]occupation:[/font][/div] In metus vulputate eu scelerisque felis imperdiet proin fermentum leo. Porta non pulvinar neque laoreet suspendisse interdum. Egestas sed tempus urna et. Sit amet nisl purus in mollis nunc sed id. Lobortis feugiat vivamus at augue. Leo vel orci porta non pulvinar neque laoreet suspendisse. Pharetra diam sit amet nisl suscipit. Vel risus commodo viverra maecenas accumsan. Sagittis id consectetur purus ut faucibus pulvinar elementum integer enim. Maecenas sed enim ut sem viverra aliquet eget sit amet. Odio euismod lacinia at quis risus sed vulputate odio ut. Donec adipiscing tristique risus nec feugiat in fermentum. Hendrerit dolor magna eget est. Vel elit scelerisque mauris pellentesque pulvinar pellentesque habitant morbi tristique. Vulputate enim nulla aliquet porttitor. Pellentesque elit eget gravida cum sociis natoque. Elit ullamcorper dignissim cras tincidunt lobortis feugiat vivamus. Molestie nunc non blandit massa enim nec dui nunc mattis. Mattis pellentesque id nibh tortor id aliquet lectus. Scelerisque fermentum dui faucibus in ornare quam viverra orci sagittis.

[div class=tag][font=Varela Round]romantic history:[/font][/div] Eu non diam phasellus vestibulum lorem sed. Tellus integer feugiat scelerisque varius morbi enim nunc. At tempor commodo ullamcorper a lacus vestibulum sed arcu non. Erat pellentesque adipiscing commodo elit at imperdiet dui accumsan. Molestie ac feugiat sed lectus. Elementum facilisis leo vel fringilla. Massa placerat duis ultricies lacus sed turpis. Egestas quis ipsum suspendisse ultrices. Felis donec et odio pellentesque diam volutpat commodo sed egestas. Enim sed faucibus turpis in eu mi. Ultricies mi quis hendrerit dolor magna eget est. Consectetur purus ut faucibus pulvinar elementum integer. Cursus mattis molestie a iaculis. Placerat duis ultricies lacus sed turpis tincidunt id aliquet risus. Amet mauris commodo quis imperdiet massa tincidunt nunc pulvinar. Imperdiet massa tincidunt nunc pulvinar sapien et ligula ullamcorper malesuada. Cras sed felis eget velit aliquet sagittis id. Tristique sollicitudin nibh sit amet commodo nulla facilisi nullam vehicula. Eget felis eget nunc lobortis mattis aliquam faucibus purus in. Mattis vulputate enim nulla aliquet porttitor lacus.
[/div][/div][/div]
[div class="tabsContent tabsContentOther" style="display: none;"][div class=textcontainer][div class=text][div class=tag][font=Varela Round]theme song:[/font][/div] glad he's gone - tove lo

[div class=tag][font=Varela Round]favorite drink:[/font][/div] jager bombs

[div class=tag][font=Varela Round]favorite food:[/font][/div] popcorn shrimp

[div class=tag][font=Varela Round]favorite movie:[/font][/div] mister nobody

[div class=tag][font=Varela Round]favorite book:[/font][/div] legend - marie lu

[div class=tag][font=Varela Round]relationships:[/font][/div] [LIST]
[*]past lover 1:
[*]past lover 2:
[*]past lover 3:
[*]love interest 1:
[*]love interest 2:
[*]love interest 3:
[*]best friend 1:
[*]best friend 2:
[*]best friend 3:
[*]rival 1:
[*]rival 2:
[*]rival 3:
[/LIST]
[/div][/div][/div]
[div class="tabsContent tabsContentGallery" style="display: none;"][div class=textcontainer][div class=text][div class=tag][font=Varela Round]face/body:[/font][/div]
[img]https://i.pinimg.com/564x/8a/2c/62/8a2c62c34c8bc966976521cf0dc45b30.jpg[/img]
[img]https://i.pinimg.com/564x/aa/b6/bf/aab6bf7f29ae21feb5e82decf9a76784.jpg[/img]
[img]https://i.pinimg.com/564x/8a/d2/73/8ad273f765b35161d0ed2990fcc03738.jpg[/img]

[div class=tag][font=Varela Round]fashion:[/font][/div]
[img]https://i.pinimg.com/564x/d8/b6/ab/d8b6ab86826f100d6ec846d97684e3c2.jpg[/img]
[img]https://i.pinimg.com/564x/16/f8/33/16f833ee5728c8e4093a2229e4abaf27.jpg[/img]
[img]https://i.pinimg.com/564x/b2/8c/07/b28c077d4dedb80c62a369ca4da9a011.jpg[/img]

[div class=tag][font=Varela Round]body mods:[/font][/div]
[img]https://i.pinimg.com/564x/37/40/77/3740772a94140ca155d4d394982064ff.jpg[/img]
[img]https://i.pinimg.com/564x/5a/34/39/5a34396a620b306f702e1e7042d77c5d.jpg[/img]
[img]https://i.pinimg.com/564x/2e/c7/f4/2ec7f48fb70bb5b272fd143d1b4301a9.jpg[/img]

[/div][/div][/div]
[div class="header sub1"][font=Varela Round]basics[/font][/div]
[div class="header sub2" style="display: none;"][font=Varela Round]persona[/font][/div]
[div class="header sub3" style="display: none;"][font=Varela Round]background[/font][/div]
[div class="header sub4" style="display: none;"][font=Varela Round]other[/font][/div]
[div class="header sub5" style="display: none;"][font=Varela Round]gallery[/font][/div]
[div class=tabs]
[div class="five tab"][font=Quicksand]5[/font][/div]
[div class="four tab"][font=Quicksand]4[/font][/div]
[div class="three tab"][font=Quicksand]3[/font][/div]
[div class="two tab"][font=Quicksand]2[/font][/div]
[div class="one tab"][font=Quicksand]1[/font][/div][/div]
[div class=pic2][/div]
[div class=pic][/div]
[div class=role][font=Varela Round]he never loved you[/font][/div]
[div class=title][font=Varela Round]glad he's gone[/font][/div]
[/div][div class=credit]code by [USER=2383][COLOR=#026B6E]sox[/COLOR][/USER][/div]
 
Last edited:
ROSE WATER - MOBILE FRIENDLY

its another cs i made for an rp c: this was for shruthi's heist rp which i wasn't gonna make my own code for, but the competition is tough man. the text boxes scroll, all the pictures hover, and the roses at the top are tabs to get to each page. i'm classifying this is mobile friendly, but the text does cut off a little on my phone when i turn it sideways, so use it as your own discretion! please do not remove the credit!

[class=bkgd] position: relative; box-sizing: border-box; width: 505px; height: 410px; background-color: #94A24B; overflow: hidden; margin-right: auto; margin-left: auto; padding: 0; border-radius: 10px; border: 3px solid #122303; [/class] [class=title] text-shadow: 3px 3px 0px #EBEAF0; position: absolute; left: 9px; top: -8px; overflow: hidden; width: 300px; height: auto; text-align: left; font-weight: 700; font-size: 40px; color: #731620; text-transform: uppercase; [/class] [class=role] text-shadow: 2px 2px 0px #122303; position: absolute; left: 9px; top: 42px; overflow: hidden; width: 200px; height: aut0; text-align: left; font-style: italic; font-weight: 700; font-size: 20px; color: #EBEAF0; text-transform: uppercase; [/class] [class=one] position: absolute; overflow: visible; width: 40px; height: 40px; left: 297px; top: 10px; background: url(https://imgur.com/YNfWSbC.png); background-size: 100%; [/class] [class=two] position: absolute; overflow: visible; width: 40px; height: 40px; left: 349px; top: 10px; background: url(https://imgur.com/f0GjNBo.png); background-size: 100%; [/class] [class=three] position: absolute; overflow: visible; width: 40px; height: 40px; left: 401px; top: 10px; background: url(https://imgur.com/IcNag7q.png); background-size: 100%; [/class] [class=four] position: absolute; overflow: visible; width: 40px; height: 40px; left: 453px; top: 10px; background: url(https://imgur.com/R10YRvb.png); background-size: 100%; [/class] [class=sub1] position: absolute; left: 228px; top: 370px; transform: rotate(-90deg); transform-origin: left; overflow: hidden; width: 200px; height: auto; text-align: left; font-style: italic; font-weight: 700; font-size: 20px; color: #EBEAF0; text-transform: uppercase; [/class] [class=sub2] position: absolute; left: 228px; top: 370px; transform: rotate(-90deg); transform-origin: left; overflow: hidden; width: 200px; height: auto; text-align: left; font-style: italic; font-weight: 700; font-size: 20px; color: #EBEAF0; text-transform: uppercase; [/class] [class=sub3] position: absolute; left: 228px; top: 370px; transform: rotate(-90deg); transform-origin: left; overflow: hidden; width: 200px; height: auto; text-align: left; font-style: italic; font-weight: 700; font-size: 20px; color: #EBEAF0; text-transform: uppercase; [/class] [class=sub4] position: absolute; left: 228px; top: 370px; transform: rotate(-90deg); transform-origin: left; overflow: hidden; width: 200px; height: auto; text-align: left; font-style: italic; font-weight: 700; font-size: 20px; color: #EBEAF0; text-transform: uppercase; [/class] [class=text] position: relative; overflow: auto; width: 249px; height: 305px; color: #EBEAF0; font-size: 10px; line-height: 12px; padding: 10px; text-align: justify; text-transform: lowercase; [/class] [class=textcont] position: absolute; overflow: hidden; width: 249px; height: 335px; left: 242px; top: 60px; box-shadow: 3px 3px 0px #122303; background-color: #406017; border-radius: 10px; [/class] [class=tag] position: relative; overflow: visible; display: inline; width: auto; height: auto; margin-right: 5px; border-radius: 100px; background-color: #731620; box-shadow: 2px 2px 0px #122303; color: #EBEAF0; font-size: 9px; padding-left: 5px; padding-right: 5px; text-align: center; text-transform: uppercase; font-weight: 700; [/class] [class=tagb] position: relative; overflow: visible; width: auto; height: auto; margin-bottom: 5px; border-radius: 100px; background-color: #731620; box-shadow: 2px 2px 0px #122303; color: #EBEAF0; font-size: 9px; padding-left: 5px; padding-right: 5px; text-align: center; text-transform: uppercase; font-weight: 700; [/class] [class=toppic] position: absolute; overflow: visible; width: 80px; height: 80px; left: 9px; top: 80px; box-shadow: 3px 3px 0px #122303; border-radius: 1000px; background: url(https://i.pinimg.com/564x/ea/3f/a2/ea3fa29511427a83f5b1a5004cc11e0a.jpg); border: 3px solid #3F6014; background-size: 120%; background-position: 100% 0%; [/class] [class name=toppic state=hover] background: url(https://i.pinimg.com/564x/c2/fa/76/c2fa7691a04ca9a1355251b58f5efde9.jpg); transition-duration: 0.3s; transform: scale(1.1); border: 3px solid #EBEAF0; box-shadow: 3px 3px 0px #731620; background-size: 100%; background-position: 0% 0%; [/class] [class=midpic] position: absolute; overflow: visible; width: 130px; height: 130px; left: 60px; top: 115px; box-shadow: 3px 3px 0px #122303; border-radius: 1000px; background: url(https://i.pinimg.com/564x/44/89/1c/44891cbdb1df37f4bb73e20e5a04b195.jpg); border: 3px solid #3F6014; background-size: 100%; background-position: 0% 0%; [/class] [class name=midpic state=hover] background: url(https://imgur.com/aBgi7vk.png); transition-duration: 0.3s; transform: scale(1.1); border: 3px solid #EBEAF0; box-shadow: 3px 3px 0px #731620; background-size: 100%; background-position: 0% 0%; [/class] [class=botpic] position: absolute; overflow: visible; width: 250px; height: 250px; left: -45px; top: 200px; box-shadow: 3px 3px 0px #122303; border-radius: 1000px; background: url(https://imgur.com/M1k66tP.png); border: 3px solid #3F6014; background-size: 100%; background-position: 0% 0%; [/class] [class name=botpic state=hover] background: url(https://imgur.com/xhnljOf.png); transition-duration: 0.3s; transform: scale(1.1); border: 3px solid #EBEAF0; box-shadow: 3px 3px 0px #731620; background-size: 100%; background-position: 0% 0%; [/class] [class=dec1] position: absolute; overflow: visible; width: 40px; height: 40px; left: 106px; top: 81px; box-shadow: 3px 3px 0px #122303; border-radius: 100px; background-color: #3F6014; [/class] [class name=dec1 state=hover] transition-duration: 0.2s; background-color: #731620; box-shadow: 3px 3px 0px #EBEAF0; [/class] [class=dec2] position: absolute; overflow: visible; width: 30px; height: 30px; left: 160px; top: 94px; box-shadow: 3px 3px 0px #122303; border-radius: 50px; background-color: #3F6014; [/class] [class name=dec2 state=hover] transition-duration: 0.2s; background-color: #731620; box-shadow: 3px 3px 0px #EBEAF0; [/class] [class=dec3] position: absolute; overflow: visible; width: 20px; height: 20px; left: 200px; top: 120px; box-shadow: 3px 3px 0px #122303; border-radius: 100px; background-color: #3F6014; [/class] [class name=dec3 state=hover] transition-duration: 0.2s; background-color: #731620; box-shadow: 3px 3px 0px #EBEAF0; [/class] [class=tab] position: absolute; overflow: visible; [/class] [class name=tab state=hover] transform: rotate(360deg) scale(1.3); transition-duration: 0.3s; [/class] [script class=tab on=click] hide tabsContent set currentTab (getText) if (eq ${currentTab} 1) (show tabsContentBasics) if (eq ${currentTab} 1) (show sub1) if (eq ${currentTab} 1) (hide sub2) if (eq ${currentTab} 1) (hide sub3) if (eq ${currentTab} 1) (hide sub4) if (eq ${currentTab} 2) (show tabsContentPersona) if (eq ${currentTab} 2) (show sub2) if (eq ${currentTab} 2) (hide sub1) if (eq ${currentTab} 2) (hide sub3) if (eq ${currentTab} 2) (hide sub4) if (eq ${currentTab} 3) (show tabsContentBackground) if (eq ${currentTab} 3) (show sub3) if (eq ${currentTab} 3) (hide sub1) if (eq ${currentTab} 3) (hide sub2) if (eq ${currentTab} 3) (hide sub4) if (eq ${currentTab} 4) (show tabsContentGallery) if (eq ${currentTab} 4) (show sub4) if (eq ${currentTab} 4) (hide sub1) if (eq ${currentTab} 4) (hide sub2) if (eq ${currentTab} 4) (hide sub3) [/script] [class=credit] position: relative; overflow: hidden; width: 100%; height: 10px; text-align: center; font-style: normal; font-weight: normal; font-size: 8px; color: #94A24B; opacity: 0.3; [/class]

[div class=bkgd]
[div class=title]rose water[/div]
[div class=role]she's so sweet[/div]
[div class="tab one"]
1
[/div]
[div class="tab two"]
2
[/div]
[div class="tab three"]
3
[/div]
[div class="tab four"]
4
[/div]
[div class=toppic][/div]
[div class=midpic][/div]
[div class=botpic][/div]
[div class=dec1][/div]
[div class=dec2][/div]
[div class=dec3][/div]
[div class=sub1]basics[/div]
[div class=sub2 style="display: none;"]persona[/div]
[div class=sub3 style="display: none;"]background[/div]
[div class=sub4 style="display: none;"]gallery[/div]

[div class="tabsContent tabsContentBasics"][div class=textcont][div class=text][div class=tag]name:[/div] Don't look at me

[div class=tag]nickname:[/div] with that light glance

[div class=tag]gender:[/div] Don't speak of love easily

[div class=tag]sexuality:[/div] If you want my heart

[div class=tag]role:[/div] you need to take my pain too

[div class=tag]height:[/div] Because you will be pricked

[div class=tag]weight:[/div] by my thorns someday

[div class=tag]eye color:[/div] Don't trust me too much

[div class=tag]hair color:[/div] You don't know me that well yet

[div class=tag]hair type:[/div] So just run away

[div class=tag]body type:[/div] Don't love me

[div class=tag]skin tone:[/div] Don't come to me

[div class=tag]dist. marks:[/div] Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Donec adipiscing tristique risus nec feugiat in fermentum posuere urna. Quis imperdiet massa tincidunt nunc pulvinar sapien et. Lobortis scelerisque fermentum dui faucibus in ornare quam.

[div class=tag]body mods:[/div] Arcu risus quis varius quam quisque id. Platea dictumst vestibulum rhoncus est pellentesque. Auctor neque vitae tempus quam pellentesque nec nam. Malesuada fames ac turpis egestas. Tempor orci eu lobortis elementum nibh tellus molestie nunc non. Nunc mi ipsum faucibus vitae aliquet nec ullamcorper sit.

[div class=tag]faceclaim:[/div] deepika padukone
[/div][/div][/div]

[div class="tabsContent tabsContentPersona" style="display: none;"][div class=textcont][div class=text][div class=tag]likes:[/div] Sed risus pretium quam vulputate dignissim suspendisse in. Nulla pellentesque dignissim enim sit amet. Sit amet nisl purus in mollis nunc sed id. Consectetur adipiscing elit pellentesque habitant morbi tristique senectus. Rutrum tellus pellentesque eu tincidunt tortor aliquam nulla facilisi cras. Tincidunt augue interdum velit euismod in pellentesque massa. Dis parturient montes nascetur ridiculus mus mauris vitae ultricies.

[div class=tag]dislikes:[/div] Arcu risus quis varius quam quisque id. Platea dictumst vestibulum rhoncus est pellentesque. Auctor neque vitae tempus quam pellentesque nec nam. Malesuada fames ac turpis egestas. Tempor orci eu lobortis elementum nibh tellus molestie nunc non. Nunc mi ipsum faucibus vitae aliquet nec ullamcorper sit. Dui accumsan sit amet nulla facilisi morbi tempus iaculis. Vivamus at augue eget arcu dictum varius duis at. Fames ac turpis egestas sed tempus urna et.

[div class=tag]vices:[/div] manipulative, exploitative, shameless, arrogant, stubborn, apathetic, dishonest, brash, and two-faced.

[div class=tag]virtues:[/div] intelligent, confident, fearless, loyal, independent, energetic, cunning, just, rational, charming, seductive, and humorous.

[div class=tag]fears:[/div] falling in love, getting her heart broken, never being loved for who she is, being used/taken advantage of, heights, really short people ("humans shouldn't be that small past puberty. change my mind."), and clowns.

[div class=tag]ambitions:[/div] getting back at the rich while living amongst the elite, finding someone on the same wavelength as her, uprooting society for shits and giggles ("as one does. didn't you ever read 'uglies'?"), and owning around 5 snakes and 5 cats, probably.

[div class=tagb]"So, the Louvre. Are you ready?"[/div]"you're asking me if i'm ready? in the past week alone, i've gone through twenty-three red bull yellows, incapacitated four of the mentors at my dojo, and redone my nails six separate times. of course i'm not ready, babe, but that's just how it is in this business. we gotta work in a very specific time frame, which means we can't wait around for our nerves to finally shit themselves before getting the job done. so, are you ready, sweet cheeks?"

[div class=tagb]"Glass half full or half empty?"[/div]"god, if i had a penny for every time i didn't care for this metaphor... it's all situational, isn't it? if the glass has got bird spit in it, half empty---miss me with that. if it's got cyanide, half full is more than enough to get the job done, so long as it isn't expired. how about it, love? is that a stupid enough answer for your stupid ass question? journalism degrees don't mean shit these days. a tragedy."

[div class=tagb]"What's your favorite movie?"[/div]"the babadook, probably. that whole premise is wild. or maybe mister nobody. who doesn't love getting mentally fucked? or any other type of fucked, for that matter."

[div class=tagb]"Weapon of choice?"[/div]"i carry around a Navy Seal S.O.G. Tactical Knife, since the bitch can do just about anything. it's also a survival, utility, combat, and hunting knife---the serrated edge makes it easy to cut through just about anything, and the anti-glare properties of the metal make it harder to detect in action. it also just kind of looks badass."

[div class=tagb]"What are your hopes for the future?"[/div]"oh, you know, evade prison, destroy some people's will to live, get a side bitch here and there, maybe mess around and buy a ranch. the usual aspirations, you know? ah, and loot the hell out of the louvre. that, too. baise les français!"
[/div][/div][/div]

[div class="tabsContent tabsContentBackground" style="display: none;"][div class=textcont][div class=text][div class=tagb]biography[/div]Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Donec adipiscing tristique risus nec feugiat in fermentum posuere urna. Quis imperdiet massa tincidunt nunc pulvinar sapien et. Lobortis scelerisque fermentum dui faucibus in ornare quam. Nibh sit amet commodo nulla facilisi nullam vehicula ipsum a. Amet mattis vulputate enim nulla. Molestie at elementum eu facilisis sed odio. Eget dolor morbi non arcu risus quis. Vulputate ut pharetra sit amet aliquam id. Pulvinar neque laoreet suspendisse interdum. Praesent elementum facilisis leo vel fringilla est. Sed risus pretium quam vulputate dignissim suspendisse in. Nulla pellentesque dignissim enim sit amet. Sit amet nisl purus in mollis nunc sed id. Consectetur adipiscing elit pellentesque habitant morbi tristique senectus. Rutrum tellus pellentesque eu tincidunt tortor aliquam nulla facilisi cras. Tincidunt augue interdum velit euismod in pellentesque massa. Dis parturient montes nascetur ridiculus mus mauris vitae ultricies.

Arcu risus quis varius quam quisque id. Platea dictumst vestibulum rhoncus est pellentesque. Auctor neque vitae tempus quam pellentesque nec nam. Malesuada fames ac turpis egestas. Tempor orci eu lobortis elementum nibh tellus molestie nunc non. Nunc mi ipsum faucibus vitae aliquet nec ullamcorper sit. Dui accumsan sit amet nulla facilisi morbi tempus iaculis. Vivamus at augue eget arcu dictum varius duis at. Fames ac turpis egestas sed tempus urna et. Interdum velit laoreet id donec ultrices tincidunt. Justo eget magna fermentum iaculis eu non diam. Senectus et netus et malesuada fames ac turpis. Amet tellus cras adipiscing enim eu. Cursus mattis molestie a iaculis at erat pellentesque. Curabitur vitae nunc sed velit dignissim sodales ut. Consequat ac felis donec et odio pellentesque diam. Tellus molestie nunc non blandit massa enim nec.

Cursus in hac habitasse platea dictumst quisque. At in tellus integer feugiat. Pellentesque elit ullamcorper dignissim cras tincidunt lobortis. Elementum tempus egestas sed sed risus pretium. Commodo nulla facilisi nullam vehicula ipsum a arcu. Enim blandit volutpat maecenas volutpat blandit aliquam etiam erat. Tempor nec feugiat nisl pretium. Imperdiet nulla malesuada pellentesque elit eget gravida cum. Tempor nec feugiat nisl pretium fusce id velit ut. Sit amet est placerat in egestas erat imperdiet. Purus sit amet volutpat consequat mauris nunc congue nisi. Sed arcu non odio euismod lacinia. Platea dictumst vestibulum rhoncus est pellentesque elit ullamcorper. Sed vulputate mi sit amet. Adipiscing vitae proin sagittis nisl rhoncus mattis. Nullam vehicula ipsum a arcu. Commodo quis imperdiet massa tincidunt. Sed odio morbi quis commodo odio aenean sed adipiscing diam. Enim diam vulputate ut pharetra sit amet aliquam id. Viverra nibh cras pulvinar mattis nunc sed blandit libero.

Sit amet tellus cras adipiscing enim eu. Maecenas sed enim ut sem viverra. Et netus et malesuada fames. Pulvinar neque laoreet suspendisse interdum consectetur libero id faucibus. Viverra ipsum nunc aliquet bibendum enim facilisis gravida. Aenean vel elit scelerisque mauris pellentesque pulvinar pellentesque. Etiam erat velit scelerisque in. Nec feugiat in fermentum posuere. A scelerisque purus semper eget duis. Mi quis hendrerit dolor magna. Adipiscing enim eu turpis egestas pretium aenean pharetra. Viverra tellus in hac habitasse platea dictumst vestibulum rhoncus. Molestie ac feugiat sed lectus vestibulum mattis ullamcorper velit. Aliquet enim tortor at auctor urna nunc. Sit amet commodo nulla facilisi nullam vehicula ipsum a. Tincidunt nunc pulvinar sapien et.

Tristique senectus et netus et. Rhoncus mattis rhoncus urna neque viverra justo nec ultrices dui. Maecenas ultricies mi eget mauris pharetra et ultrices neque. Pretium fusce id velit ut tortor pretium. Pellentesque nec nam aliquam sem et tortor consequat. Pellentesque id nibh tortor id aliquet lectus proin. Sem integer vitae justo eget magna fermentum iaculis eu non. Volutpat blandit aliquam etiam erat velit scelerisque in dictum non. Porttitor leo a diam sollicitudin tempor id eu. Mauris sit amet massa vitae.
[/div][/div][/div]

[div class="tabsContent tabsContentGallery" style="display: none;"][div class=textcont][div class=text][div class=tagb]face:[/div]
1ce8d2eb77a65f2f2030457410d6b08f.jpg

7d9a896e95c682df7b8dd8a2e4e485ff.jpg

31956d630ea9596e2b01d5c9ea607b6c.jpg

0a24d46cd3a3b10e0f82427f6c0f3dc7.jpg

0f571449281ca8c1814fd0f7d3fa40bb.jpg

3abdc435eeb87d997dae3f3f0bc55e1c.jpg

1432128b82aac005371f26a9e87a83b1.jpg



[div class=tagb]attire:[/div]
dd8a21de5228b21919d4ab42336d6784.jpg

74f293ac53d79c00ac2e16963c465277.jpg

ed5ee86d31d89f807d832163404b7f41.jpg

53ee49540ec3de73f57d7a4326c2f8db.jpg

15f3783f2176676a16267194dc89cb2e.jpg

f618204557199fd1186e7e2ee1a905cf.jpg

209c08485ada3042736cc0fe8042aabe.jpg

[/div][/div][/div][/div][div class=credit]code by sox sox [/div]

Code: 
[nobr]
    [class=bkgd]
        position: relative;
        box-sizing: border-box;
        width: 505px;
        height: 410px;
        background-color: #94A24B;
        overflow: hidden;
        margin-right: auto;
        margin-left: auto;
        padding: 0;
        border-radius: 10px;
        border: 3px solid #122303;
    [/class]
    [class=title]
        text-shadow: 3px 3px 0px #EBEAF0;
        position: absolute;
        left: 9px;
        top: -8px;
        overflow: hidden;
        width: 300px;
        height: auto;
        text-align: left;
        font-weight: 700;
        font-size: 40px;
        color: #731620;
        text-transform: uppercase;
    [/class]
    [class=role]
        text-shadow: 2px 2px 0px #122303;
        position: absolute;
        left: 9px;
        top: 42px;
        overflow: hidden;
        width: 200px;
        height: aut0;
        text-align: left;
        font-style: italic;
        font-weight: 700;
        font-size: 20px;
        color: #EBEAF0;
        text-transform: uppercase;
    [/class]
    [comment]vector credit to Vecteezy[/comment]
    [class=one]
        position: absolute;
        overflow: visible;
        width: 40px;
        height: 40px;
        left: 297px;
        top: 10px;
        background: url(https://imgur.com/YNfWSbC.png);
        background-size: 100%;
    [/class]
    [class=two]
        position: absolute;
        overflow: visible;
        width: 40px;
        height: 40px;
        left: 349px;
        top: 10px;
        background: url(https://imgur.com/f0GjNBo.png);
        background-size: 100%;
    [/class]
    [class=three]
        position: absolute;
        overflow: visible;
        width: 40px;
        height: 40px;
        left: 401px;
        top: 10px;
        background: url(https://imgur.com/IcNag7q.png);
        background-size: 100%;
    [/class]
    [class=four]
        position: absolute;
        overflow: visible;
        width: 40px;
        height: 40px;
        left: 453px;
        top: 10px;
        background: url(https://imgur.com/R10YRvb.png);
        background-size: 100%;
    [/class]
    [class=sub1]
        position: absolute;
        left: 228px;
        top: 370px;
        transform: rotate(-90deg);
        transform-origin: left;
        overflow: hidden;
        width: 200px;
        height: auto;
        text-align: left;
        font-style: italic;
        font-weight: 700;
        font-size: 20px;
        color: #EBEAF0;
        text-transform: uppercase;
    [/class]
    [class=sub2]
        position: absolute;
        left: 228px;
        top: 370px;
        transform: rotate(-90deg);
        transform-origin: left;
        overflow: hidden;
        width: 200px;
        height: auto;
        text-align: left;
        font-style: italic;
        font-weight: 700;
        font-size: 20px;
        color: #EBEAF0;
        text-transform: uppercase;
    [/class]
    [class=sub3]
        position: absolute;
        left: 228px;
        top: 370px;
        transform: rotate(-90deg);
        transform-origin: left;
        overflow: hidden;
        width: 200px;
        height: auto;
        text-align: left;
        font-style: italic;
        font-weight: 700;
        font-size: 20px;
        color: #EBEAF0;
        text-transform: uppercase;
    [/class]
    [class=sub4]
        position: absolute;
        left: 228px;
        top: 370px;
        transform: rotate(-90deg);
        transform-origin: left;
        overflow: hidden;
        width: 200px;
        height: auto;
        text-align: left;
        font-style: italic;
        font-weight: 700;
        font-size: 20px;
        color: #EBEAF0;
        text-transform: uppercase;
    [/class]
    [class=text]
        position: relative;
        overflow: auto;
        width: 249px;
        height: 305px;
        color: #EBEAF0;
        font-size: 10px;
        line-height: 12px;
        padding: 10px;
        text-align: justify;
        text-transform: lowercase;
    [/class]
    [class=textcont]
        position: absolute;
        overflow: hidden;
        width: 249px;
        height: 335px;
        left: 242px;
        top: 60px;
        box-shadow: 3px 3px 0px #122303;
        background-color: #406017;
        border-radius: 10px;
    [/class]
    [class=tag]
        position: relative;
        overflow: visible;
        display: inline;
        width: auto;
        height: auto;
        margin-right: 5px;
        border-radius: 100px;
        background-color: #731620;
        box-shadow: 2px 2px 0px #122303;
        color: #EBEAF0;
        font-size: 9px;
        padding-left: 5px;
        padding-right: 5px;
        text-align: center;
        text-transform: uppercase;
        font-weight: 700;
    [/class]
    [class=tagb]
        position: relative;
        overflow: visible;
        width: auto;
        height: auto;
        margin-bottom: 5px;
        border-radius: 100px;
        background-color: #731620;
        box-shadow: 2px 2px 0px #122303;
        color: #EBEAF0;
        font-size: 9px;
        padding-left: 5px;
        padding-right: 5px;
        text-align: center;
        text-transform: uppercase;
        font-weight: 700;
    [/class]
    [class=toppic]
        position: absolute;
        overflow: visible;
        width: 80px;
        height: 80px;
        left: 9px;
        top: 80px;
        box-shadow: 3px 3px 0px #122303;
        border-radius: 1000px;
        background: url(https://i.pinimg.com/564x/ea/3f/a2/ea3fa29511427a83f5b1a5004cc11e0a.jpg);
        border: 3px solid #3F6014;
        background-size: 120%;
        background-position: 100% 0%;
    [/class]
    [class name=toppic state=hover]
        background: url(https://i.pinimg.com/564x/c2/fa/76/c2fa7691a04ca9a1355251b58f5efde9.jpg);
        transition-duration: 0.3s;
        transform: scale(1.1);
        border: 3px solid #EBEAF0;
        box-shadow: 3px 3px 0px #731620;
        background-size: 100%;
        background-position: 0% 0%;
    [/class]
    [class=midpic]
        position: absolute;
        overflow: visible;
        width: 130px;
        height: 130px;
        left: 60px;
        top: 115px;
        box-shadow: 3px 3px 0px #122303;
        border-radius: 1000px;
        background: url(https://i.pinimg.com/564x/44/89/1c/44891cbdb1df37f4bb73e20e5a04b195.jpg);
        border: 3px solid #3F6014;
        background-size: 100%;
        background-position: 0% 0%;
    [/class]
    [class name=midpic state=hover]
        background: url(https://imgur.com/aBgi7vk.png);
        transition-duration: 0.3s;
        transform: scale(1.1);
        border: 3px solid #EBEAF0;
        box-shadow: 3px 3px 0px #731620;
        background-size: 100%;
        background-position: 0% 0%;
    [/class]
    [class=botpic]
        position: absolute;
        overflow: visible;
        width: 250px;
        height: 250px;
        left: -45px;
        top: 200px;
        box-shadow: 3px 3px 0px #122303;
        border-radius: 1000px;
        background: url(https://imgur.com/M1k66tP.png);
        border: 3px solid #3F6014;
        background-size: 100%;
        background-position: 0% 0%;
    [/class]
    [class name=botpic state=hover]
        background: url(https://imgur.com/xhnljOf.png);
        transition-duration: 0.3s;
        transform: scale(1.1);
        border: 3px solid #EBEAF0;
        box-shadow: 3px 3px 0px #731620;
        background-size: 100%;
        background-position: 0% 0%;
    [/class]
    [class=dec1]
        position: absolute;
        overflow: visible;
        width: 40px;
        height: 40px;
        left: 106px;
        top: 81px;
        box-shadow: 3px 3px 0px #122303;
        border-radius: 100px;
        background-color: #3F6014;
    [/class]
    [class name=dec1 state=hover]
        transition-duration: 0.2s;
        background-color: #731620;
        box-shadow: 3px 3px 0px #EBEAF0;
    [/class]
    [class=dec2]
        position: absolute;
        overflow: visible;
        width: 30px;
        height: 30px;
        left: 160px;
        top: 94px;
        box-shadow: 3px 3px 0px #122303;
        border-radius: 50px;
        background-color: #3F6014;
    [/class]
    [class name=dec2 state=hover]
        transition-duration: 0.2s;
        background-color: #731620;
        box-shadow: 3px 3px 0px #EBEAF0;
    [/class]
    [class=dec3]
        position: absolute;
        overflow: visible;
        width: 20px;
        height: 20px;
        left: 200px;
        top: 120px;
        box-shadow: 3px 3px 0px #122303;
        border-radius: 100px;
        background-color: #3F6014;
    [/class]
    [class name=dec3 state=hover]
        transition-duration: 0.2s;
        background-color: #731620;
        box-shadow: 3px 3px 0px #EBEAF0;
    [/class]
    [class=tab]
        position: absolute;
        overflow: visible;
    [/class]
    [class name=tab state=hover]
        transform: rotate(360deg) scale(1.3);
        transition-duration: 0.3s;
    [/class]
    [script class=tab on=click]
                hide tabsContent
                set currentTab (getText)
                if (eq ${currentTab} 1) (show tabsContentBasics)
                if (eq ${currentTab} 1) (show sub1)
                if (eq ${currentTab} 1) (hide sub2)
                if (eq ${currentTab} 1) (hide  sub3)
                if (eq ${currentTab} 1) (hide  sub4)
                if (eq ${currentTab} 2) (show tabsContentPersona)
                if (eq ${currentTab} 2) (show sub2)
                if (eq ${currentTab} 2) (hide  sub1)
                if (eq ${currentTab} 2) (hide  sub3)
                if (eq ${currentTab} 2) (hide sub4)
                if (eq ${currentTab} 3) (show tabsContentBackground)
                if (eq ${currentTab} 3) (show sub3)
                if (eq ${currentTab} 3) (hide sub1)
                if (eq ${currentTab} 3) (hide  sub2)
                if (eq ${currentTab} 3) (hide sub4)
                if (eq ${currentTab} 4) (show tabsContentGallery)
                if (eq ${currentTab} 4) (show sub4)
                if (eq ${currentTab} 4) (hide  sub1)
                if (eq ${currentTab} 4) (hide sub2)
                if (eq ${currentTab} 4) (hide sub3)
    [/script]
[class=credit]
        position: relative;
        overflow: hidden;
        width: 100%;
        height: 10px;
        text-align: center;
        font-style: normal;
        font-weight: normal;
        font-size: 8px;
        color: #94A24B;
        opacity: 0.5;
[/class]
[/nobr]

[div class=bkgd]
    [div class=title][font=Lato]rose water[/font][/div]
    [div class=role][font=Lato]she's so sweet[/font][/div]
    [div class="tab one"][div=opacity:0]1[/div][/div]
    [div class="tab two"][div=opacity:0]2[/div][/div]
    [div class="tab three"][div=opacity:0]3[/div][/div]
    [div class="tab four"][div=opacity:0]4[/div][/div]
    [div class=toppic][/div]
    [div class=midpic][/div]
    [div class=botpic][/div]
    [div class=dec1][/div]
    [div class=dec2][/div]
    [div class=dec3][/div]
    [div class=sub1][font=Lato]basics[/font][/div]
    [div class=sub2 style="display: none;"][font=Lato]persona[/font][/div]
    [div class=sub3 style="display: none;"][font=Lato]background[/font][/div]
    [div class=sub4 style="display: none;"][font=Lato]gallery[/font][/div]

    [div class="tabsContent tabsContentBasics"][div class=textcont][div class=text][font=Raleway][div class=tag][font=Lato]name:[/font][/div] Don't look at me

[div class=tag][font=Lato]nickname:[/font][/div] with that light glance

[div class=tag][font=Lato]gender:[/font][/div] Don't speak of love easily

[div class=tag][font=Lato]sexuality:[/font][/div] If you want my heart

[div class=tag][font=Lato]role:[/font][/div] you need to take my pain too

[div class=tag][font=Lato]height:[/font][/div] Because you will be pricked

[div class=tag][font=Lato]weight:[/font][/div] by my thorns someday

[div class=tag][font=Lato]eye color:[/font][/div] Don't trust me too much

[div class=tag][font=Lato]hair color:[/font][/div] You don't know me that well yet

[div class=tag][font=Lato]hair type:[/font][/div] So just run away

[div class=tag][font=Lato]body type:[/font][/div] Don't love me

[div class=tag][font=Lato]skin tone:[/font][/div] Don't come to me

[div class=tag][font=Lato]dist. marks:[/font][/div] Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Donec adipiscing tristique risus nec feugiat in fermentum posuere urna. Quis imperdiet massa tincidunt nunc pulvinar sapien et. Lobortis scelerisque fermentum dui faucibus in ornare quam.

[div class=tag][font=Lato]body mods:[/font][/div] Arcu risus quis varius quam quisque id. Platea dictumst vestibulum rhoncus est pellentesque. Auctor neque vitae tempus quam pellentesque nec nam. Malesuada fames ac turpis egestas. Tempor orci eu lobortis elementum nibh tellus molestie nunc non. Nunc mi ipsum faucibus vitae aliquet nec ullamcorper sit.

[div class=tag][font=Lato]faceclaim:[/font][/div] deepika padukone
[/font][/div][/div][/div]

[div class="tabsContent tabsContentPersona" style="display: none;"][div class=textcont][div class=text][font=Raleway][div class=tag][font=Lato]likes:[/font][/div] Sed risus pretium quam vulputate dignissim suspendisse in. Nulla pellentesque dignissim enim sit amet. Sit amet nisl purus in mollis nunc sed id. Consectetur adipiscing elit pellentesque habitant morbi tristique senectus. Rutrum tellus pellentesque eu tincidunt tortor aliquam nulla facilisi cras. Tincidunt augue interdum velit euismod in pellentesque massa. Dis parturient montes nascetur ridiculus mus mauris vitae ultricies.

[div class=tag][font=Lato]dislikes:[/font][/div] Arcu risus quis varius quam quisque id. Platea dictumst vestibulum rhoncus est pellentesque. Auctor neque vitae tempus quam pellentesque nec nam. Malesuada fames ac turpis egestas. Tempor orci eu lobortis elementum nibh tellus molestie nunc non. Nunc mi ipsum faucibus vitae aliquet nec ullamcorper sit. Dui accumsan sit amet nulla facilisi morbi tempus iaculis. Vivamus at augue eget arcu dictum varius duis at. Fames ac turpis egestas sed tempus urna et.

[div class=tag][font=Lato]vices:[/font][/div] manipulative, exploitative, shameless, arrogant, stubborn, apathetic, dishonest, brash, and two-faced.

[div class=tag][font=Lato]virtues:[/font][/div] intelligent, confident, fearless, loyal, independent, energetic, cunning, just, rational, charming, seductive, and humorous.

[div class=tag][font=Lato]fears:[/font][/div] falling in love, getting her heart broken, never being loved for who she is, being used/taken advantage of, heights, really short people ("humans shouldn't be that small past puberty. change my mind."), and clowns.

[div class=tag][font=Lato]ambitions:[/font][/div] getting back at the rich while living amongst the elite, finding someone on the same wavelength as her, uprooting society for shits and giggles ("as one does. didn't you ever read 'uglies'?"), and owning around 5 snakes and 5 cats, probably.

[div class=tagb][font=Lato]"So, the Louvre. Are you ready?"[/font][/div]"you're asking me if i'm ready? in the past week alone, i've gone through twenty-three red bull yellows, incapacitated four of the mentors at my dojo, and redone my nails six separate times. of course i'm not ready, babe, but that's just how it is in this business. we gotta work in a very specific time frame, which means we can't wait around for our nerves to finally shit themselves before getting the job done. so, are [I]you[/I] ready, sweet cheeks?"

[div class=tagb][font=Lato]"Glass half full or half empty?"[/font][/div]"god, if i had a penny for every time i didn't care for this metaphor... it's all situational, isn't it? if the glass has got bird spit in it, half empty---miss me with that. if it's got cyanide, half full is more than enough to get the job done, so long as it isn't expired. how about it, love? is that a stupid enough answer for your stupid ass question? journalism degrees don't mean shit these days. a tragedy."

[div class=tagb][font=Lato]"What's your favorite movie?"[/font][/div]"the babadook, probably. that whole premise is wild. or maybe mister nobody. who doesn't love getting mentally fucked? or any other type of fucked, for that matter."

[div class=tagb][font=Lato]"Weapon of choice?"[/font][/div]"i carry around a Navy Seal S.O.G. Tactical Knife, since the bitch can do just about anything. it's also a survival, utility, combat, and hunting knife---the serrated edge makes it easy to cut through just about anything, and the anti-glare properties of the metal make it harder to detect in action. it also just kind of looks badass."

[div class=tagb][font=Lato]"What are your hopes for the future?"[/font][/div]"oh, you know, evade prison, destroy some people's will to live, get a side bitch here and there, maybe mess around and buy a ranch. the usual aspirations, you know? ah, and loot the hell out of the louvre. that, too. [I]baise les français!"[/I]
[/font][/div][/div][/div]

[div class="tabsContent tabsContentBackground" style="display: none;"][div class=textcont][div class=text][font=Raleway][div class=tagb][font=Lato]biography[/font][/div]Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Donec adipiscing tristique risus nec feugiat in fermentum posuere urna. Quis imperdiet massa tincidunt nunc pulvinar sapien et. Lobortis scelerisque fermentum dui faucibus in ornare quam. Nibh sit amet commodo nulla facilisi nullam vehicula ipsum a. Amet mattis vulputate enim nulla. Molestie at elementum eu facilisis sed odio. Eget dolor morbi non arcu risus quis. Vulputate ut pharetra sit amet aliquam id. Pulvinar neque laoreet suspendisse interdum. Praesent elementum facilisis leo vel fringilla est. Sed risus pretium quam vulputate dignissim suspendisse in. Nulla pellentesque dignissim enim sit amet. Sit amet nisl purus in mollis nunc sed id. Consectetur adipiscing elit pellentesque habitant morbi tristique senectus. Rutrum tellus pellentesque eu tincidunt tortor aliquam nulla facilisi cras. Tincidunt augue interdum velit euismod in pellentesque massa. Dis parturient montes nascetur ridiculus mus mauris vitae ultricies.

Arcu risus quis varius quam quisque id. Platea dictumst vestibulum rhoncus est pellentesque. Auctor neque vitae tempus quam pellentesque nec nam. Malesuada fames ac turpis egestas. Tempor orci eu lobortis elementum nibh tellus molestie nunc non. Nunc mi ipsum faucibus vitae aliquet nec ullamcorper sit. Dui accumsan sit amet nulla facilisi morbi tempus iaculis. Vivamus at augue eget arcu dictum varius duis at. Fames ac turpis egestas sed tempus urna et. Interdum velit laoreet id donec ultrices tincidunt. Justo eget magna fermentum iaculis eu non diam. Senectus et netus et malesuada fames ac turpis. Amet tellus cras adipiscing enim eu. Cursus mattis molestie a iaculis at erat pellentesque. Curabitur vitae nunc sed velit dignissim sodales ut. Consequat ac felis donec et odio pellentesque diam. Tellus molestie nunc non blandit massa enim nec.

Cursus in hac habitasse platea dictumst quisque. At in tellus integer feugiat. Pellentesque elit ullamcorper dignissim cras tincidunt lobortis. Elementum tempus egestas sed sed risus pretium. Commodo nulla facilisi nullam vehicula ipsum a arcu. Enim blandit volutpat maecenas volutpat blandit aliquam etiam erat. Tempor nec feugiat nisl pretium. Imperdiet nulla malesuada pellentesque elit eget gravida cum. Tempor nec feugiat nisl pretium fusce id velit ut. Sit amet est placerat in egestas erat imperdiet. Purus sit amet volutpat consequat mauris nunc congue nisi. Sed arcu non odio euismod lacinia. Platea dictumst vestibulum rhoncus est pellentesque elit ullamcorper. Sed vulputate mi sit amet. Adipiscing vitae proin sagittis nisl rhoncus mattis. Nullam vehicula ipsum a arcu. Commodo quis imperdiet massa tincidunt. Sed odio morbi quis commodo odio aenean sed adipiscing diam. Enim diam vulputate ut pharetra sit amet aliquam id. Viverra nibh cras pulvinar mattis nunc sed blandit libero.

Sit amet tellus cras adipiscing enim eu. Maecenas sed enim ut sem viverra. Et netus et malesuada fames. Pulvinar neque laoreet suspendisse interdum consectetur libero id faucibus. Viverra ipsum nunc aliquet bibendum enim facilisis gravida. Aenean vel elit scelerisque mauris pellentesque pulvinar pellentesque. Etiam erat velit scelerisque in. Nec feugiat in fermentum posuere. A scelerisque purus semper eget duis. Mi quis hendrerit dolor magna. Adipiscing enim eu turpis egestas pretium aenean pharetra. Viverra tellus in hac habitasse platea dictumst vestibulum rhoncus. Molestie ac feugiat sed lectus vestibulum mattis ullamcorper velit. Aliquet enim tortor at auctor urna nunc. Sit amet commodo nulla facilisi nullam vehicula ipsum a. Tincidunt nunc pulvinar sapien et.

Tristique senectus et netus et. Rhoncus mattis rhoncus urna neque viverra justo nec ultrices dui. Maecenas ultricies mi eget mauris pharetra et ultrices neque. Pretium fusce id velit ut tortor pretium. Pellentesque nec nam aliquam sem et tortor consequat. Pellentesque id nibh tortor id aliquet lectus proin. Sem integer vitae justo eget magna fermentum iaculis eu non. Volutpat blandit aliquam etiam erat velit scelerisque in dictum non. Porttitor leo a diam sollicitudin tempor id eu. Mauris sit amet massa vitae.
[/font][/div][/div][/div]

[div class="tabsContent tabsContentGallery" style="display: none;"][div class=textcont][div class=text][font=Raleway][div class=tagb][font=Lato]face:[/font][/div][IMG]https://i.pinimg.com/564x/1c/e8/d2/1ce8d2eb77a65f2f2030457410d6b08f.jpg[/IMG]
[IMG]https://i.pinimg.com/564x/7d/9a/89/7d9a896e95c682df7b8dd8a2e4e485ff.jpg[/IMG]
[IMG]https://i.pinimg.com/564x/31/95/6d/31956d630ea9596e2b01d5c9ea607b6c.jpg[/IMG]
[IMG]https://i.pinimg.com/564x/0a/24/d4/0a24d46cd3a3b10e0f82427f6c0f3dc7.jpg[/IMG]
[IMG]https://i.pinimg.com/564x/0f/57/14/0f571449281ca8c1814fd0f7d3fa40bb.jpg[/IMG]
[IMG]https://i.pinimg.com/564x/3a/bd/c4/3abdc435eeb87d997dae3f3f0bc55e1c.jpg[/IMG]
[IMG]https://i.pinimg.com/564x/14/32/12/1432128b82aac005371f26a9e87a83b1.jpg[/IMG]


[div class=tagb][font=Lato]attire:[/font][/div][IMG]https://i.pinimg.com/564x/dd/8a/21/dd8a21de5228b21919d4ab42336d6784.jpg[/IMG]
[IMG]https://i.pinimg.com/564x/74/f2/93/74f293ac53d79c00ac2e16963c465277.jpg[/IMG]
[IMG]https://i.pinimg.com/564x/ed/5e/e8/ed5ee86d31d89f807d832163404b7f41.jpg[/IMG]
[IMG]https://i.pinimg.com/564x/53/ee/49/53ee49540ec3de73f57d7a4326c2f8db.jpg[/IMG]
[IMG]https://i.pinimg.com/564x/15/f3/78/15f3783f2176676a16267194dc89cb2e.jpg[/IMG]
[IMG]https://i.pinimg.com/564x/f6/18/20/f618204557199fd1186e7e2ee1a905cf.jpg[/IMG]
[IMG]https://i.pinimg.com/564x/20/9c/08/209c08485ada3042736cc0fe8042aabe.jpg[/IMG]
[/font][/div][/div][/div][/div][div class=credit]code by [USER=2383][COLOR=#94A24B]sox[/COLOR][/USER][/div]
 
Last edited:
hello everyone! just a heads-up that i'm comfortable taking requests! i do work full-time, so i may not be able to get it back to you within the same day, but my turnaround time should never be more than a couple of days! c:​
 
COLD CASE - NOT MOBILE FRIENDLY

my first interest check freebie! it's kinda BIG DUMB but thats ok because im just playing around rn. i'll make some of those nice compact pretty interest checks sometime i swear but for now, enjoy my big phat thicc juicy code. please do not remove the credit! enjoy, friends! c:

[class=bkgd] position: relative; box-sizing: border-box; width: 700px; height: 900px; background-color: #E0D5B1; overflow: hidden; margin-left: auto; margin-right: auto; box-shadow: 3px -2px 10px #000; [/class] [class=bkgdpic] top: 0; left: 0; width: 100%; height: 100%; position: absolute; background: url(https://imgur.com/ZUWXQud.jpg); background-size: 110%; opacity: 0.5; [/class] [class=card] position: absolute; overflow: visible; width: 302.649px; height: 330px; left: 35.675px; top: -4.095px; transform: rotate(11deg); transform-origin: left; background-color: #EEEEEE; box-shadow: 3px 3px 0px #000; [/class] [class=pic] position: absolute; overflow: visible; width: 257.936px; height: 257.936px; left: 62.23px; top: 16.436px; transform: rotate(11deg); transform-origin: left; background: url(https://i.pinimg.com/564x/87/1c/c0/871cc0be3e59b8b62013da7681b115f8.jpg); background-size: 100%; [/class] [class=paperclip] position: absolute; overflow: visible; width: 20.782px; height: 77.782px; left: 95.609px; top: -7.391px; transform: rotate(175deg); transform-origin: left; border: 2px solid #707070; border-radius: 100px; [/class] [class=title] position: absolute; left: 30px; top: 265px; transform: rotate(11deg); transform-origin: left; overflow: hidden; width: 251px; height: auto; text-align: center; font-style: normal; font-weight: bold; font-size: 40px; color: #000; text-transform: uppercase; [/class] [class=quote] position: absolute; left: 30px; top: 385px; overflow: hidden; width: 250px; height: auto; line-height: 16px; margin-top: -2.5px; text-align: left; font-style: normal; font-weight: 700; font-size: 15px; color: rgba(126,31,31,1); text-transform: uppercase; [/class] [class=plot] position: absolute; overflow: visible; width: 290px; height: 28px; left: 390px; top: 33px; background-color: #000; color: #fff; font-size: 20px; text-transform: uppercase; text-align: center; line-height: 28px; box-shadow: 3px 3px 0px #fff; [/class] [class=plottext] position: relative; overflow: auto; width: 265px; height: 290px; color: #000; font-size: 12px; line-height: 13px; text-align: justify; padding: 10px; [/class] [class=plotcont] position: absolute; overflow: hidden; width: 265px; height: 320px; left: 405px; top: 78px; background-color: #CDAE76; box-shadow: 2px 2px 0px #000; [/class] [class=one] position: absolute; overflow: visible; width: 60px; height: 110px; left: 600px; top: 500px; background: url(https://imgur.com/g1wwwwc.png); background-size: 100%; [/class] [class=two] position: absolute; overflow: visible; width: 60px; height: 110px; left: 590px; top: 630px; background: url(https://imgur.com/GrnXyxZ.png); background-size: 100%; [/class] [class=three] position: absolute; overflow: visible; width: 60px; height: 110px; left: 600px; top: 760px; background: url(https://imgur.com/5oDkMFP.png); background-size: 100%; [/class] [class=sub1] position: absolute; overflow: visible; width: 658px; height: 28px; left: 22px; top: 457px; background-color: #000; color: #fff; font-size: 20px; text-transform: uppercase; text-align: center; line-height: 28px; box-shadow: 3px 3px 0px #fff; [/class] [class=sub2] position: absolute; overflow: visible; width: 658px; height: 28px; left: 22px; top: 457px; background-color: #000; color: #fff; font-size: 20px; text-transform: uppercase; text-align: center; line-height: 28px; box-shadow: 3px 3px 0px #fff; [/class] [class=sub3] position: absolute; overflow: visible; width: 658px; height: 28px; left: 22px; top: 457px; background-color: #000; color: #fff; font-size: 20px; text-transform: uppercase; text-align: center; line-height: 28px; box-shadow: 3px 3px 0px #fff; [/class] [class=text] position: absolute; overflow: auto; width: 510px; height: 340px; color: #000; font-size: 12px; line-height: 13px; text-align: justify; padding: 10px; [/class] [class=textcont] position: absolute; overflow: hidden; width: 510px; height: 370px; left: 51px; top: 500px; background-color: #CDAE76; box-shadow: 2px 2px 0px #000; [/class] [class=tab] position: absolute; overflow: visible; [/class] [class=tab1] position: absolute; overflow: visible; [/class] [class=tab2] position: absolute; overflow: visible; [/class] [class=tab3] position: absolute; overflow: visible; [/class] [class name=tab state=hover] background-color: #fff; transition-duration: 0.3s; transform: scale(1.1); [/class] [class name=tab1 state=hover] background: url(https://imgur.com/NA7b0nM.png); background-size: 100%; [/class] [class name=tab2 state=hover] background: url(https://imgur.com/04doHcF.png); background-size: 100%; [/class] [class name=tab3 state=hover] background: url(https://imgur.com/5N0C7w8.png); background-size: 100%; [/class] [script class=tab on=click] hide tabsContent set currentTab (getText) if (eq ${currentTab} 1) (show tabsContent1) if (eq ${currentTab} 1) (show sub1) if (eq ${currentTab} 1) (hide sub2) if (eq ${currentTab} 1) (hide sub3) if (eq ${currentTab} 2) (show tabsContent2) if (eq ${currentTab} 2) (show sub2) if (eq ${currentTab} 2) (hide sub1) if (eq ${currentTab} 2) (hide sub3) if (eq ${currentTab} 3) (show tabsContent3) if (eq ${currentTab} 3) (show sub3) if (eq ${currentTab} 3) (hide sub1) if (eq ${currentTab} 3) (hide sub2) [/script] [class=credit] position: relative; overflow: hidden; width: 100%; height: 10px; text-align: center; font-style: normal; font-weight: normal; font-size: 8px; color: #7E1F1F; opacity: 0.5; [/class]
[div class=bkgd]
[div class=bkgdpic][/div]
[div class=card][/div]
[div class=pic][/div]
[div class=title]cold case[/div]
[div class=quote]name: unknown.
whereabouts: unknown.
threat level: extreme.[/div]
[div class=plot]plot[/div]
[div class=plotcont][div class=plottext]Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Sed euismod nisi porta lorem. Eget est lorem ipsum dolor sit amet. Amet venenatis urna cursus eget nunc scelerisque. Suspendisse in est ante in nibh mauris. Ornare aenean euismod elementum nisi quis eleifend quam. Quam vulputate dignissim suspendisse in est ante in nibh. Nulla aliquet porttitor lacus luctus accumsan tortor. Pulvinar etiam non quam lacus suspendisse faucibus interdum. Fames ac turpis egestas maecenas pharetra convallis posuere morbi leo. Augue lacus viverra vitae congue. Amet purus gravida quis blandit turpis cursus. Dapibus ultrices in iaculis nunc sed augue. Cursus sit amet dictum sit amet justo donec.

Volutpat blandit aliquam etiam erat velit scelerisque in. Sed velit dignissim sodales ut eu sem integer. Diam quis enim lobortis scelerisque fermentum. Feugiat pretium nibh ipsum consequat nisl vel pretium lectus quam. Fermentum posuere urna nec tincidunt praesent semper feugiat nibh sed. Nunc non blandit massa enim nec dui. Rhoncus mattis rhoncus urna neque viverra justo. Purus in mollis nunc sed id. Aliquet nec ullamcorper sit amet risus nullam eget. Ac felis donec et odio pellentesque diam volutpat. Ac tortor dignissim convallis aenean. Lectus quam id leo in. Lorem dolor sed viverra ipsum nunc aliquet bibendum.

Maecenas pharetra convallis posuere morbi leo urna molestie. Adipiscing vitae proin sagittis nisl rhoncus. Mattis vulputate enim nulla aliquet porttitor. Iaculis nunc sed augue lacus viverra vitae congue eu consequat. Nibh venenatis cras sed felis eget velit aliquet sagittis id. Sodales ut etiam sit amet nisl purus in mollis. Ornare arcu odio ut sem nulla pharetra. Congue nisi vitae suscipit tellus mauris a. Commodo sed egestas egestas fringilla phasellus faucibus. Morbi tristique senectus et netus et malesuada. Duis at consectetur lorem donec massa sapien. Placerat duis ultricies lacus sed turpis tincidunt id aliquet risus. Donec enim diam vulputate ut pharetra sit. Cursus metus aliquam eleifend mi in nulla posuere sollicitudin.

Viverra mauris in aliquam sem fringilla ut morbi tincidunt augue. Felis imperdiet proin fermentum leo. Morbi leo urna molestie at elementum eu facilisis sed. Vitae congue eu consequat ac felis donec et odio pellentesque. Habitant morbi tristique senectus et netus et. Quisque id diam vel quam elementum pulvinar etiam non. Habitasse platea dictumst vestibulum rhoncus. Accumsan tortor posuere ac ut consequat. Pharetra et ultrices neque ornare aenean euismod elementum nisi quis. Convallis tellus id interdum velit. Lacus sed turpis tincidunt id. Pellentesque pulvinar pellentesque habitant morbi tristique senectus et. Sit amet venenatis urna cursus eget nunc scelerisque viverra.

Tincidunt vitae semper quis lectus nulla at. Ornare arcu dui vivamus arcu felis bibendum ut tristique et. Enim neque volutpat ac tincidunt vitae. Posuere sollicitudin aliquam ultrices sagittis. Tristique sollicitudin nibh sit amet commodo nulla facilisi nullam. Nisi porta lorem mollis aliquam. Et leo duis ut diam quam nulla. Cursus metus aliquam eleifend mi in nulla posuere sollicitudin aliquam. At risus viverra adipiscing at in tellus integer. Diam in arcu cursus euismod. Euismod quis viverra nibh cras pulvinar mattis. Ullamcorper malesuada proin libero nunc consequat interdum varius sit. Faucibus pulvinar elementum integer enim neque volutpat ac tincidunt vitae. Egestas diam in arcu cursus euismod quis viverra. Aliquam ut porttitor leo a diam sollicitudin tempor id. Sagittis id consectetur purus ut faucibus pulvinar elementum integer. Risus sed vulputate odio ut enim blandit volutpat maecenas volutpat.
[/div][/div]
[div class=paperclip][/div]
[div class="tab tab1 one"]
1
[/div]
[div class="tab tab2 two"]
2
[/div]
[div class="tab tab3 three"]
3
[/div]
[div class=sub1]about[/div]
[div class=sub2 style="display: none;"]roles[/div]
[div class=sub3 style="display: none;"]guidelines[/div]
[div class="tabsContent tabsContent1"][div class=textcont][div class=text]Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Sed euismod nisi porta lorem. Eget est lorem ipsum dolor sit amet. Amet venenatis urna cursus eget nunc scelerisque. Suspendisse in est ante in nibh mauris. Ornare aenean euismod elementum nisi quis eleifend quam. Quam vulputate dignissim suspendisse in est ante in nibh. Nulla aliquet porttitor lacus luctus accumsan tortor. Pulvinar etiam non quam lacus suspendisse faucibus interdum. Fames ac turpis egestas maecenas pharetra convallis posuere morbi leo. Augue lacus viverra vitae congue. Amet purus gravida quis blandit turpis cursus. Dapibus ultrices in iaculis nunc sed augue. Cursus sit amet dictum sit amet justo donec.

Volutpat blandit aliquam etiam erat velit scelerisque in. Sed velit dignissim sodales ut eu sem integer. Diam quis enim lobortis scelerisque fermentum. Feugiat pretium nibh ipsum consequat nisl vel pretium lectus quam. Fermentum posuere urna nec tincidunt praesent semper feugiat nibh sed. Nunc non blandit massa enim nec dui. Rhoncus mattis rhoncus urna neque viverra justo. Purus in mollis nunc sed id. Aliquet nec ullamcorper sit amet risus nullam eget. Ac felis donec et odio pellentesque diam volutpat. Ac tortor dignissim convallis aenean. Lectus quam id leo in. Lorem dolor sed viverra ipsum nunc aliquet bibendum.

Maecenas pharetra convallis posuere morbi leo urna molestie. Adipiscing vitae proin sagittis nisl rhoncus. Mattis vulputate enim nulla aliquet porttitor. Iaculis nunc sed augue lacus viverra vitae congue eu consequat. Nibh venenatis cras sed felis eget velit aliquet sagittis id. Sodales ut etiam sit amet nisl purus in mollis. Ornare arcu odio ut sem nulla pharetra. Congue nisi vitae suscipit tellus mauris a. Commodo sed egestas egestas fringilla phasellus faucibus. Morbi tristique senectus et netus et malesuada. Duis at consectetur lorem donec massa sapien. Placerat duis ultricies lacus sed turpis tincidunt id aliquet risus. Donec enim diam vulputate ut pharetra sit. Cursus metus aliquam eleifend mi in nulla posuere sollicitudin.

Viverra mauris in aliquam sem fringilla ut morbi tincidunt augue. Felis imperdiet proin fermentum leo. Morbi leo urna molestie at elementum eu facilisis sed. Vitae congue eu consequat ac felis donec et odio pellentesque. Habitant morbi tristique senectus et netus et. Quisque id diam vel quam elementum pulvinar etiam non. Habitasse platea dictumst vestibulum rhoncus. Accumsan tortor posuere ac ut consequat. Pharetra et ultrices neque ornare aenean euismod elementum nisi quis. Convallis tellus id interdum velit. Lacus sed turpis tincidunt id. Pellentesque pulvinar pellentesque habitant morbi tristique senectus et. Sit amet venenatis urna cursus eget nunc scelerisque viverra.

Tincidunt vitae semper quis lectus nulla at. Ornare arcu dui vivamus arcu felis bibendum ut tristique et. Enim neque volutpat ac tincidunt vitae. Posuere sollicitudin aliquam ultrices sagittis. Tristique sollicitudin nibh sit amet commodo nulla facilisi nullam. Nisi porta lorem mollis aliquam. Et leo duis ut diam quam nulla. Cursus metus aliquam eleifend mi in nulla posuere sollicitudin aliquam. At risus viverra adipiscing at in tellus integer. Diam in arcu cursus euismod. Euismod quis viverra nibh cras pulvinar mattis. Ullamcorper malesuada proin libero nunc consequat interdum varius sit. Faucibus pulvinar elementum integer enim neque volutpat ac tincidunt vitae. Egestas diam in arcu cursus euismod quis viverra. Aliquam ut porttitor leo a diam sollicitudin tempor id. Sagittis id consectetur purus ut faucibus pulvinar elementum integer. Risus sed vulputate odio ut enim blandit volutpat maecenas volutpat.
[/div][/div][/div]

[div class="tabsContent tabsContent2" style="display: none;"][div class=textcont][div class=text]Ultrices neque ornare aenean euismod. Donec enim diam vulputate ut pharetra. Vitae congue eu consequat ac felis. Est pellentesque elit ullamcorper dignissim cras tincidunt lobortis. Amet nisl purus in mollis nunc sed. Enim sed faucibus turpis in eu mi. Enim ut sem viverra aliquet eget. Morbi non arcu risus quis varius quam quisque id. Augue neque gravida in fermentum et sollicitudin. Diam maecenas sed enim ut sem viverra aliquet. Elementum nisi quis eleifend quam adipiscing vitae proin. Aliquet risus feugiat in ante metus. Scelerisque eleifend donec pretium vulputate sapien. Massa eget egestas purus viverra accumsan in nisl. Nulla malesuada pellentesque elit eget. Dui vivamus arcu felis bibendum ut tristique.

Viverra nibh cras pulvinar mattis nunc. Proin libero nunc consequat interdum varius sit. Egestas diam in arcu cursus euismod. Sed cras ornare arcu dui vivamus arcu felis. Ullamcorper velit sed ullamcorper morbi tincidunt. Dolor sit amet consectetur adipiscing elit. Tempus iaculis urna id volutpat lacus laoreet non. Congue eu consequat ac felis donec. Tincidunt lobortis feugiat vivamus at augue. Metus dictum at tempor commodo ullamcorper. Aliquam ultrices sagittis orci a. Sagittis aliquam malesuada bibendum arcu vitae elementum curabitur vitae nunc.

Fringilla urna porttitor rhoncus dolor purus non enim praesent elementum. Ullamcorper velit sed ullamcorper morbi tincidunt ornare massa eget. Natoque penatibus et magnis dis parturient montes nascetur ridiculus. Est ultricies integer quis auctor elit sed vulputate mi. Adipiscing elit ut aliquam purus. Ornare aenean euismod elementum nisi. Id volutpat lacus laoreet non curabitur. Massa massa ultricies mi quis hendrerit dolor magna. Neque aliquam vestibulum morbi blandit cursus risus at ultrices mi. Justo eget magna fermentum iaculis eu. Egestas maecenas pharetra convallis posuere morbi leo urna. Enim neque volutpat ac tincidunt vitae. Egestas diam in arcu cursus euismod quis viverra nibh cras. Leo vel orci porta non pulvinar neque laoreet suspendisse. In hac habitasse platea dictumst quisque sagittis purus sit amet. Cras semper auctor neque vitae tempus quam pellentesque nec. Porta lorem mollis aliquam ut porttitor leo. Donec ac odio tempor orci dapibus. Sit amet luctus venenatis lectus.

Pulvinar sapien et ligula ullamcorper malesuada proin libero nunc. Quis varius quam quisque id diam. Massa eget egestas purus viverra accumsan in nisl. Neque volutpat ac tincidunt vitae. Convallis a cras semper auctor neque vitae tempus quam pellentesque. Sit amet justo donec enim diam vulputate ut pharetra. Pharetra magna ac placerat vestibulum lectus mauris ultrices. Tortor pretium viverra suspendisse potenti. Adipiscing tristique risus nec feugiat in fermentum posuere urna. Pretium fusce id velit ut tortor pretium. Id diam vel quam elementum pulvinar. Nulla malesuada pellentesque elit eget gravida. In eu mi bibendum neque egestas congue quisque egestas diam. Massa tincidunt nunc pulvinar sapien et ligula ullamcorper malesuada proin.
[/div][/div][/div]

[div class="tabsContent tabsContent3" style="display: none;"][div class=textcont][div class=text]Viverra nibh cras pulvinar mattis nunc. Proin libero nunc consequat interdum varius sit. Egestas diam in arcu cursus euismod. Sed cras ornare arcu dui vivamus arcu felis. Ullamcorper velit sed ullamcorper morbi tincidunt. Dolor sit amet consectetur adipiscing elit. Tempus iaculis urna id volutpat lacus laoreet non. Congue eu consequat ac felis donec. Tincidunt lobortis feugiat vivamus at augue. Metus dictum at tempor commodo ullamcorper. Aliquam ultrices sagittis orci a. Sagittis aliquam malesuada bibendum arcu vitae elementum curabitur vitae nunc.

Fringilla urna porttitor rhoncus dolor purus non enim praesent elementum. Ullamcorper velit sed ullamcorper morbi tincidunt ornare massa eget. Natoque penatibus et magnis dis parturient montes nascetur ridiculus. Est ultricies integer quis auctor elit sed vulputate mi. Adipiscing elit ut aliquam purus. Ornare aenean euismod elementum nisi. Id volutpat lacus laoreet non curabitur. Massa massa ultricies mi quis hendrerit dolor magna. Neque aliquam vestibulum morbi blandit cursus risus at ultrices mi. Justo eget magna fermentum iaculis eu. Egestas maecenas pharetra convallis posuere morbi leo urna. Enim neque volutpat ac tincidunt vitae. Egestas diam in arcu cursus euismod quis viverra nibh cras. Leo vel orci porta non pulvinar neque laoreet suspendisse. In hac habitasse platea dictumst quisque sagittis purus sit amet. Cras semper auctor neque vitae tempus quam pellentesque nec. Porta lorem mollis aliquam ut porttitor leo. Donec ac odio tempor orci dapibus. Sit amet luctus venenatis lectus.

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Sed euismod nisi porta lorem. Eget est lorem ipsum dolor sit amet. Amet venenatis urna cursus eget nunc scelerisque. Suspendisse in est ante in nibh mauris. Ornare aenean euismod elementum nisi quis eleifend quam. Quam vulputate dignissim suspendisse in est ante in nibh. Nulla aliquet porttitor lacus luctus accumsan tortor. Pulvinar etiam non quam lacus suspendisse faucibus interdum. Fames ac turpis egestas maecenas pharetra convallis posuere morbi leo. Augue lacus viverra vitae congue. Amet purus gravida quis blandit turpis cursus. Dapibus ultrices in iaculis nunc sed augue. Cursus sit amet dictum sit amet justo donec.

Volutpat blandit aliquam etiam erat velit scelerisque in. Sed velit dignissim sodales ut eu sem integer. Diam quis enim lobortis scelerisque fermentum. Feugiat pretium nibh ipsum consequat nisl vel pretium lectus quam. Fermentum posuere urna nec tincidunt praesent semper feugiat nibh sed. Nunc non blandit massa enim nec dui. Rhoncus mattis rhoncus urna neque viverra justo. Purus in mollis nunc sed id. Aliquet nec ullamcorper sit amet risus nullam eget. Ac felis donec et odio pellentesque diam volutpat. Ac tortor dignissim convallis aenean. Lectus quam id leo in. Lorem dolor sed viverra ipsum nunc aliquet bibendum.

Maecenas pharetra convallis posuere morbi leo urna molestie. Adipiscing vitae proin sagittis nisl rhoncus. Mattis vulputate enim nulla aliquet porttitor. Iaculis nunc sed augue lacus viverra vitae congue eu consequat. Nibh venenatis cras sed felis eget velit aliquet sagittis id. Sodales ut etiam sit amet nisl purus in mollis. Ornare arcu odio ut sem nulla pharetra. Congue nisi vitae suscipit tellus mauris a. Commodo sed egestas egestas fringilla phasellus faucibus. Morbi tristique senectus et netus et malesuada. Duis at consectetur lorem donec massa sapien. Placerat duis ultricies lacus sed turpis tincidunt id aliquet risus. Donec enim diam vulputate ut pharetra sit. Cursus metus aliquam eleifend mi in nulla posuere sollicitudin.

Viverra mauris in aliquam sem fringilla ut morbi tincidunt augue. Felis imperdiet proin fermentum leo. Morbi leo urna molestie at elementum eu facilisis sed. Vitae congue eu consequat ac felis donec et odio pellentesque. Habitant morbi tristique senectus et netus et. Quisque id diam vel quam elementum pulvinar etiam non. Habitasse platea dictumst vestibulum rhoncus. Accumsan tortor posuere ac ut consequat. Pharetra et ultrices neque ornare aenean euismod elementum nisi quis. Convallis tellus id interdum velit. Lacus sed turpis tincidunt id. Pellentesque pulvinar pellentesque habitant morbi tristique senectus et. Sit amet venenatis urna cursus eget nunc scelerisque viverra.

Tincidunt vitae semper quis lectus nulla at. Ornare arcu dui vivamus arcu felis bibendum ut tristique et. Enim neque volutpat ac tincidunt vitae. Posuere sollicitudin aliquam ultrices sagittis. Tristique sollicitudin nibh sit amet commodo nulla facilisi nullam. Nisi porta lorem mollis aliquam. Et leo duis ut diam quam nulla. Cursus metus aliquam eleifend mi in nulla posuere sollicitudin aliquam. At risus viverra adipiscing at in tellus integer. Diam in arcu cursus euismod. Euismod quis viverra nibh cras pulvinar mattis. Ullamcorper malesuada proin libero nunc consequat interdum varius sit. Faucibus pulvinar elementum integer enim neque volutpat ac tincidunt vitae. Egestas diam in arcu cursus euismod quis viverra. Aliquam ut porttitor leo a diam sollicitudin tempor id. Sagittis id consectetur purus ut faucibus pulvinar elementum integer. Risus sed vulputate odio ut enim blandit volutpat maecenas volutpat.
[/div][/div][/div]
[/div][div class=credit]code by sox sox [/div]

Code: 
[nobr]
    [class=bkgd]
        position: relative;
        box-sizing: border-box;
        width: 700px;
        height: 900px;
        background-color: #E0D5B1;
        overflow: hidden;
        margin-left: auto;
        margin-right: auto;
        box-shadow: 3px -2px 10px #000;
    [/class]
    [class=bkgdpic]
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        position: absolute;
        background: url(https://imgur.com/ZUWXQud.jpg);
        background-size: 110%;
        opacity: 0.5;
    [/class]
    [class=card]
        position: absolute;
        overflow: visible;
        width: 302.649px;
        height: 330px;
        left: 35.675px;
        top: -4.095px;
        transform: rotate(11deg);
        transform-origin: left;
        background-color: #EEEEEE;
        box-shadow: 3px 3px 0px #000;
    [/class]
    [class=pic]
        position: absolute;
        overflow: visible;
        width: 257.936px;
        height: 257.936px;
        left: 62.23px;
        top: 16.436px;
        transform: rotate(11deg);
        transform-origin: left;
        background: url(https://i.pinimg.com/564x/87/1c/c0/871cc0be3e59b8b62013da7681b115f8.jpg);
        background-size: 100%;
    [/class]
    [class=paperclip]
        position: absolute;
        overflow: visible;
        width: 20.782px;
        height: 77.782px;
        left: 95.609px;
        top: -7.391px;
        transform: rotate(175deg);
        transform-origin: left;
        border: 2px solid #707070;
        border-radius: 100px;
    [/class]
    [class=title]
        position: absolute;
        left: 30px;
        top: 265px;
        transform: rotate(11deg);
        transform-origin: left;
        overflow: hidden;
        width: 251px;
        height: auto;
        text-align: center;
        font-style: normal;
        font-weight: bold;
        font-size: 40px;
        color: #000;
        text-transform: uppercase;
    [/class]
    [class=quote]
        position: absolute;
        left: 30px;
        top: 385px;
        overflow: hidden;
        width: 250px;
        height: auto;
        line-height: 16px;
        margin-top: -2.5px;
        text-align: left;
        font-style: normal;
        font-weight: 700;
        font-size: 15px;
        color: rgba(126,31,31,1);
        text-transform: uppercase;
    [/class]
    [class=plot]
        position: absolute;
        overflow: visible;
        width: 290px;
        height: 28px;
        left: 390px;
        top: 33px;
        background-color: #000;
        color: #fff;
        font-size: 20px;
        text-transform: uppercase;
        text-align: center;
        line-height: 28px;
        box-shadow: 3px 3px 0px #fff;
    [/class]
    [class=plottext]
        position: relative;
        overflow: auto;
        width: 265px;
        height: 290px;
        color: #000;
        font-size: 12px;
        line-height: 13px;
        text-align: justify;
        padding: 10px;
    [/class]
    [class=plotcont]
        position: absolute;
        overflow: hidden;
        width: 265px;
        height: 320px;
        left: 405px;
        top: 78px;
        background-color: #CDAE76;
        box-shadow: 2px 2px 0px #000;
    [/class]
    [class=one]
        position: absolute;
        overflow: visible;
        width: 60px;
        height: 110px;
        left: 600px;
        top: 500px;
        background: url(https://imgur.com/g1wwwwc.png);
        background-size: 100%;
    [/class]
    [class=two]
        position: absolute;
        overflow: visible;
        width: 60px;
        height: 110px;
        left: 590px;
        top: 630px;
        background: url(https://imgur.com/GrnXyxZ.png);
        background-size: 100%;
    [/class]
    [class=three]
        position: absolute;
        overflow: visible;
        width: 60px;
        height: 110px;
        left: 600px;
        top: 760px;
        background: url(https://imgur.com/5oDkMFP.png);
        background-size: 100%;
    [/class]
    [class=sub1]
        position: absolute;
        overflow: visible;
        width: 658px;
        height: 28px;
        left: 22px;
        top: 457px;
        background-color: #000;
        color: #fff;
        font-size: 20px;
        text-transform: uppercase;
        text-align: center;
        line-height: 28px;
        box-shadow: 3px 3px 0px #fff;
    [/class]
    [class=sub2]
        position: absolute;
        overflow: visible;
        width: 658px;
        height: 28px;
        left: 22px;
        top: 457px;
        background-color: #000;
        color: #fff;
        font-size: 20px;
        text-transform: uppercase;
        text-align: center;
        line-height: 28px;
        box-shadow: 3px 3px 0px #fff;
    [/class]
    [class=sub3]
        position: absolute;
        overflow: visible;
        width: 658px;
        height: 28px;
        left: 22px;
        top: 457px;
        background-color: #000;
        color: #fff;
        font-size: 20px;
        text-transform: uppercase;
        text-align: center;
        line-height: 28px;
        box-shadow: 3px 3px 0px #fff;
    [/class]
    [class=text]
        position: absolute;
        overflow: auto;
        width: 510px;
        height: 340px;
        color: #000;
        font-size: 12px;
        line-height: 13px;
        text-align: justify;
        padding: 10px;
    [/class]
    [class=textcont]
        position: absolute;
        overflow: hidden;
        width: 510px;
        height: 370px;
        left: 51px;
        top: 500px;
        background-color: #CDAE76;
        box-shadow: 2px 2px 0px #000;
    [/class]
    [class=tab]
        position: absolute;
        overflow: visible;
    [/class]
    [class=tab1]
        position: absolute;
        overflow: visible;
    [/class]
    [class=tab2]
        position: absolute;
        overflow: visible;
    [/class]
    [class=tab3]
        position: absolute;
        overflow: visible;
    [/class]
    [class name=tab state=hover]
        background-color: #fff;
        transition-duration: 0.3s;
        transform: scale(1.1);
    [/class]
    [class name=tab1 state=hover]
        background: url(https://imgur.com/NA7b0nM.png);
        background-size: 100%;
    [/class]
    [class name=tab2 state=hover]
        background: url(https://imgur.com/04doHcF.png);
        background-size: 100%;
    [/class]
    [class name=tab3 state=hover]
        background: url(https://imgur.com/5N0C7w8.png);
        background-size: 100%;
    [/class]
    [script class=tab on=click]
                hide tabsContent
                set currentTab (getText)
                if (eq ${currentTab} 1) (show tabsContent1)
                if (eq ${currentTab} 1) (show sub1)
                if (eq ${currentTab} 1) (hide sub2)
                if (eq ${currentTab} 1) (hide  sub3)
                if (eq ${currentTab} 2) (show tabsContent2)
                if (eq ${currentTab} 2) (show sub2)
                if (eq ${currentTab} 2) (hide  sub1)
                if (eq ${currentTab} 2) (hide  sub3)
                if (eq ${currentTab} 3) (show tabsContent3)
                if (eq ${currentTab} 3) (show sub3)
                if (eq ${currentTab} 3) (hide sub1)
                if (eq ${currentTab} 3) (hide  sub2)
    [/script]
    [class=credit]
        position: relative;
        overflow: hidden;
        width: 100%;
        height: 10px;
        text-align: center;
        font-style: normal;
        font-weight: normal;
        font-size: 8px;
        color: #7E1F1F;
        opacity: 0.5;
    [/class]
[/nobr]
[div class=bkgd]
    [div class=bkgdpic][/div]
    [div class=card][/div]
    [div class=pic][/div]
    [div class=title][font=Permanent Marker]cold case[/font][/div]
    [div class=quote][font=Special Elite]name: unknown.
whereabouts: unknown.
threat level: extreme.[/font][/div]
    [div class=plot][font=Special Elite]plot[/font][/div]
    [div class=plotcont][div class=plottext][font=Ubuntu Mono]Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Sed euismod nisi porta lorem. Eget est lorem ipsum dolor sit amet. Amet venenatis urna cursus eget nunc scelerisque. Suspendisse in est ante in nibh mauris. Ornare aenean euismod elementum nisi quis eleifend quam. Quam vulputate dignissim suspendisse in est ante in nibh. Nulla aliquet porttitor lacus luctus accumsan tortor. Pulvinar etiam non quam lacus suspendisse faucibus interdum. Fames ac turpis egestas maecenas pharetra convallis posuere morbi leo. Augue lacus viverra vitae congue. Amet purus gravida quis blandit turpis cursus. Dapibus ultrices in iaculis nunc sed augue. Cursus sit amet dictum sit amet justo donec.

Volutpat blandit aliquam etiam erat velit scelerisque in. Sed velit dignissim sodales ut eu sem integer. Diam quis enim lobortis scelerisque fermentum. Feugiat pretium nibh ipsum consequat nisl vel pretium lectus quam. Fermentum posuere urna nec tincidunt praesent semper feugiat nibh sed. Nunc non blandit massa enim nec dui. Rhoncus mattis rhoncus urna neque viverra justo. Purus in mollis nunc sed id. Aliquet nec ullamcorper sit amet risus nullam eget. Ac felis donec et odio pellentesque diam volutpat. Ac tortor dignissim convallis aenean. Lectus quam id leo in. Lorem dolor sed viverra ipsum nunc aliquet bibendum.

Maecenas pharetra convallis posuere morbi leo urna molestie. Adipiscing vitae proin sagittis nisl rhoncus. Mattis vulputate enim nulla aliquet porttitor. Iaculis nunc sed augue lacus viverra vitae congue eu consequat. Nibh venenatis cras sed felis eget velit aliquet sagittis id. Sodales ut etiam sit amet nisl purus in mollis. Ornare arcu odio ut sem nulla pharetra. Congue nisi vitae suscipit tellus mauris a. Commodo sed egestas egestas fringilla phasellus faucibus. Morbi tristique senectus et netus et malesuada. Duis at consectetur lorem donec massa sapien. Placerat duis ultricies lacus sed turpis tincidunt id aliquet risus. Donec enim diam vulputate ut pharetra sit. Cursus metus aliquam eleifend mi in nulla posuere sollicitudin.

Viverra mauris in aliquam sem fringilla ut morbi tincidunt augue. Felis imperdiet proin fermentum leo. Morbi leo urna molestie at elementum eu facilisis sed. Vitae congue eu consequat ac felis donec et odio pellentesque. Habitant morbi tristique senectus et netus et. Quisque id diam vel quam elementum pulvinar etiam non. Habitasse platea dictumst vestibulum rhoncus. Accumsan tortor posuere ac ut consequat. Pharetra et ultrices neque ornare aenean euismod elementum nisi quis. Convallis tellus id interdum velit. Lacus sed turpis tincidunt id. Pellentesque pulvinar pellentesque habitant morbi tristique senectus et. Sit amet venenatis urna cursus eget nunc scelerisque viverra.

Tincidunt vitae semper quis lectus nulla at. Ornare arcu dui vivamus arcu felis bibendum ut tristique et. Enim neque volutpat ac tincidunt vitae. Posuere sollicitudin aliquam ultrices sagittis. Tristique sollicitudin nibh sit amet commodo nulla facilisi nullam. Nisi porta lorem mollis aliquam. Et leo duis ut diam quam nulla. Cursus metus aliquam eleifend mi in nulla posuere sollicitudin aliquam. At risus viverra adipiscing at in tellus integer. Diam in arcu cursus euismod. Euismod quis viverra nibh cras pulvinar mattis. Ullamcorper malesuada proin libero nunc consequat interdum varius sit. Faucibus pulvinar elementum integer enim neque volutpat ac tincidunt vitae. Egestas diam in arcu cursus euismod quis viverra. Aliquam ut porttitor leo a diam sollicitudin tempor id. Sagittis id consectetur purus ut faucibus pulvinar elementum integer. Risus sed vulputate odio ut enim blandit volutpat maecenas volutpat.
[/font][/div][/div]
    [div class=paperclip][/div]
    [div class="tab tab1 one"][div=opacity:0]1[/div][/div]
    [div class="tab tab2 two"][div=opacity:0]2[/div][/div]
    [div class="tab tab3 three"][div=opacity:0]3[/div][/div]
    [div class=sub1][font=Special Elite]about[/font][/div]
    [div class=sub2 style="display: none;"][font=Special Elite]roles[/font][/div]
    [div class=sub3 style="display: none;"][font=Special Elite]guidelines[/font][/div]
    [div class="tabsContent tabsContent1"][div class=textcont][div class=text][font=Ubuntu Mono]Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Sed euismod nisi porta lorem. Eget est lorem ipsum dolor sit amet. Amet venenatis urna cursus eget nunc scelerisque. Suspendisse in est ante in nibh mauris. Ornare aenean euismod elementum nisi quis eleifend quam. Quam vulputate dignissim suspendisse in est ante in nibh. Nulla aliquet porttitor lacus luctus accumsan tortor. Pulvinar etiam non quam lacus suspendisse faucibus interdum. Fames ac turpis egestas maecenas pharetra convallis posuere morbi leo. Augue lacus viverra vitae congue. Amet purus gravida quis blandit turpis cursus. Dapibus ultrices in iaculis nunc sed augue. Cursus sit amet dictum sit amet justo donec.

Volutpat blandit aliquam etiam erat velit scelerisque in. Sed velit dignissim sodales ut eu sem integer. Diam quis enim lobortis scelerisque fermentum. Feugiat pretium nibh ipsum consequat nisl vel pretium lectus quam. Fermentum posuere urna nec tincidunt praesent semper feugiat nibh sed. Nunc non blandit massa enim nec dui. Rhoncus mattis rhoncus urna neque viverra justo. Purus in mollis nunc sed id. Aliquet nec ullamcorper sit amet risus nullam eget. Ac felis donec et odio pellentesque diam volutpat. Ac tortor dignissim convallis aenean. Lectus quam id leo in. Lorem dolor sed viverra ipsum nunc aliquet bibendum.

Maecenas pharetra convallis posuere morbi leo urna molestie. Adipiscing vitae proin sagittis nisl rhoncus. Mattis vulputate enim nulla aliquet porttitor. Iaculis nunc sed augue lacus viverra vitae congue eu consequat. Nibh venenatis cras sed felis eget velit aliquet sagittis id. Sodales ut etiam sit amet nisl purus in mollis. Ornare arcu odio ut sem nulla pharetra. Congue nisi vitae suscipit tellus mauris a. Commodo sed egestas egestas fringilla phasellus faucibus. Morbi tristique senectus et netus et malesuada. Duis at consectetur lorem donec massa sapien. Placerat duis ultricies lacus sed turpis tincidunt id aliquet risus. Donec enim diam vulputate ut pharetra sit. Cursus metus aliquam eleifend mi in nulla posuere sollicitudin.

Viverra mauris in aliquam sem fringilla ut morbi tincidunt augue. Felis imperdiet proin fermentum leo. Morbi leo urna molestie at elementum eu facilisis sed. Vitae congue eu consequat ac felis donec et odio pellentesque. Habitant morbi tristique senectus et netus et. Quisque id diam vel quam elementum pulvinar etiam non. Habitasse platea dictumst vestibulum rhoncus. Accumsan tortor posuere ac ut consequat. Pharetra et ultrices neque ornare aenean euismod elementum nisi quis. Convallis tellus id interdum velit. Lacus sed turpis tincidunt id. Pellentesque pulvinar pellentesque habitant morbi tristique senectus et. Sit amet venenatis urna cursus eget nunc scelerisque viverra.

Tincidunt vitae semper quis lectus nulla at. Ornare arcu dui vivamus arcu felis bibendum ut tristique et. Enim neque volutpat ac tincidunt vitae. Posuere sollicitudin aliquam ultrices sagittis. Tristique sollicitudin nibh sit amet commodo nulla facilisi nullam. Nisi porta lorem mollis aliquam. Et leo duis ut diam quam nulla. Cursus metus aliquam eleifend mi in nulla posuere sollicitudin aliquam. At risus viverra adipiscing at in tellus integer. Diam in arcu cursus euismod. Euismod quis viverra nibh cras pulvinar mattis. Ullamcorper malesuada proin libero nunc consequat interdum varius sit. Faucibus pulvinar elementum integer enim neque volutpat ac tincidunt vitae. Egestas diam in arcu cursus euismod quis viverra. Aliquam ut porttitor leo a diam sollicitudin tempor id. Sagittis id consectetur purus ut faucibus pulvinar elementum integer. Risus sed vulputate odio ut enim blandit volutpat maecenas volutpat.
[/font][/div][/div][/div]

[div class="tabsContent tabsContent2" style="display: none;"][div class=textcont][div class=text][font=Ubuntu Mono]Ultrices neque ornare aenean euismod. Donec enim diam vulputate ut pharetra. Vitae congue eu consequat ac felis. Est pellentesque elit ullamcorper dignissim cras tincidunt lobortis. Amet nisl purus in mollis nunc sed. Enim sed faucibus turpis in eu mi. Enim ut sem viverra aliquet eget. Morbi non arcu risus quis varius quam quisque id. Augue neque gravida in fermentum et sollicitudin. Diam maecenas sed enim ut sem viverra aliquet. Elementum nisi quis eleifend quam adipiscing vitae proin. Aliquet risus feugiat in ante metus. Scelerisque eleifend donec pretium vulputate sapien. Massa eget egestas purus viverra accumsan in nisl. Nulla malesuada pellentesque elit eget. Dui vivamus arcu felis bibendum ut tristique.

Viverra nibh cras pulvinar mattis nunc. Proin libero nunc consequat interdum varius sit. Egestas diam in arcu cursus euismod. Sed cras ornare arcu dui vivamus arcu felis. Ullamcorper velit sed ullamcorper morbi tincidunt. Dolor sit amet consectetur adipiscing elit. Tempus iaculis urna id volutpat lacus laoreet non. Congue eu consequat ac felis donec. Tincidunt lobortis feugiat vivamus at augue. Metus dictum at tempor commodo ullamcorper. Aliquam ultrices sagittis orci a. Sagittis aliquam malesuada bibendum arcu vitae elementum curabitur vitae nunc.

Fringilla urna porttitor rhoncus dolor purus non enim praesent elementum. Ullamcorper velit sed ullamcorper morbi tincidunt ornare massa eget. Natoque penatibus et magnis dis parturient montes nascetur ridiculus. Est ultricies integer quis auctor elit sed vulputate mi. Adipiscing elit ut aliquam purus. Ornare aenean euismod elementum nisi. Id volutpat lacus laoreet non curabitur. Massa massa ultricies mi quis hendrerit dolor magna. Neque aliquam vestibulum morbi blandit cursus risus at ultrices mi. Justo eget magna fermentum iaculis eu. Egestas maecenas pharetra convallis posuere morbi leo urna. Enim neque volutpat ac tincidunt vitae. Egestas diam in arcu cursus euismod quis viverra nibh cras. Leo vel orci porta non pulvinar neque laoreet suspendisse. In hac habitasse platea dictumst quisque sagittis purus sit amet. Cras semper auctor neque vitae tempus quam pellentesque nec. Porta lorem mollis aliquam ut porttitor leo. Donec ac odio tempor orci dapibus. Sit amet luctus venenatis lectus.

Pulvinar sapien et ligula ullamcorper malesuada proin libero nunc. Quis varius quam quisque id diam. Massa eget egestas purus viverra accumsan in nisl. Neque volutpat ac tincidunt vitae. Convallis a cras semper auctor neque vitae tempus quam pellentesque. Sit amet justo donec enim diam vulputate ut pharetra. Pharetra magna ac placerat vestibulum lectus mauris ultrices. Tortor pretium viverra suspendisse potenti. Adipiscing tristique risus nec feugiat in fermentum posuere urna. Pretium fusce id velit ut tortor pretium. Id diam vel quam elementum pulvinar. Nulla malesuada pellentesque elit eget gravida. In eu mi bibendum neque egestas congue quisque egestas diam. Massa tincidunt nunc pulvinar sapien et ligula ullamcorper malesuada proin.
[/font][/div][/div][/div]

[div class="tabsContent tabsContent3" style="display: none;"][div class=textcont][div class=text][font=Ubuntu Mono]Viverra nibh cras pulvinar mattis nunc. Proin libero nunc consequat interdum varius sit. Egestas diam in arcu cursus euismod. Sed cras ornare arcu dui vivamus arcu felis. Ullamcorper velit sed ullamcorper morbi tincidunt. Dolor sit amet consectetur adipiscing elit. Tempus iaculis urna id volutpat lacus laoreet non. Congue eu consequat ac felis donec. Tincidunt lobortis feugiat vivamus at augue. Metus dictum at tempor commodo ullamcorper. Aliquam ultrices sagittis orci a. Sagittis aliquam malesuada bibendum arcu vitae elementum curabitur vitae nunc.

Fringilla urna porttitor rhoncus dolor purus non enim praesent elementum. Ullamcorper velit sed ullamcorper morbi tincidunt ornare massa eget. Natoque penatibus et magnis dis parturient montes nascetur ridiculus. Est ultricies integer quis auctor elit sed vulputate mi. Adipiscing elit ut aliquam purus. Ornare aenean euismod elementum nisi. Id volutpat lacus laoreet non curabitur. Massa massa ultricies mi quis hendrerit dolor magna. Neque aliquam vestibulum morbi blandit cursus risus at ultrices mi. Justo eget magna fermentum iaculis eu. Egestas maecenas pharetra convallis posuere morbi leo urna. Enim neque volutpat ac tincidunt vitae. Egestas diam in arcu cursus euismod quis viverra nibh cras. Leo vel orci porta non pulvinar neque laoreet suspendisse. In hac habitasse platea dictumst quisque sagittis purus sit amet. Cras semper auctor neque vitae tempus quam pellentesque nec. Porta lorem mollis aliquam ut porttitor leo. Donec ac odio tempor orci dapibus. Sit amet luctus venenatis lectus.

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Sed euismod nisi porta lorem. Eget est lorem ipsum dolor sit amet. Amet venenatis urna cursus eget nunc scelerisque. Suspendisse in est ante in nibh mauris. Ornare aenean euismod elementum nisi quis eleifend quam. Quam vulputate dignissim suspendisse in est ante in nibh. Nulla aliquet porttitor lacus luctus accumsan tortor. Pulvinar etiam non quam lacus suspendisse faucibus interdum. Fames ac turpis egestas maecenas pharetra convallis posuere morbi leo. Augue lacus viverra vitae congue. Amet purus gravida quis blandit turpis cursus. Dapibus ultrices in iaculis nunc sed augue. Cursus sit amet dictum sit amet justo donec.

Volutpat blandit aliquam etiam erat velit scelerisque in. Sed velit dignissim sodales ut eu sem integer. Diam quis enim lobortis scelerisque fermentum. Feugiat pretium nibh ipsum consequat nisl vel pretium lectus quam. Fermentum posuere urna nec tincidunt praesent semper feugiat nibh sed. Nunc non blandit massa enim nec dui. Rhoncus mattis rhoncus urna neque viverra justo. Purus in mollis nunc sed id. Aliquet nec ullamcorper sit amet risus nullam eget. Ac felis donec et odio pellentesque diam volutpat. Ac tortor dignissim convallis aenean. Lectus quam id leo in. Lorem dolor sed viverra ipsum nunc aliquet bibendum.

Maecenas pharetra convallis posuere morbi leo urna molestie. Adipiscing vitae proin sagittis nisl rhoncus. Mattis vulputate enim nulla aliquet porttitor. Iaculis nunc sed augue lacus viverra vitae congue eu consequat. Nibh venenatis cras sed felis eget velit aliquet sagittis id. Sodales ut etiam sit amet nisl purus in mollis. Ornare arcu odio ut sem nulla pharetra. Congue nisi vitae suscipit tellus mauris a. Commodo sed egestas egestas fringilla phasellus faucibus. Morbi tristique senectus et netus et malesuada. Duis at consectetur lorem donec massa sapien. Placerat duis ultricies lacus sed turpis tincidunt id aliquet risus. Donec enim diam vulputate ut pharetra sit. Cursus metus aliquam eleifend mi in nulla posuere sollicitudin.

Viverra mauris in aliquam sem fringilla ut morbi tincidunt augue. Felis imperdiet proin fermentum leo. Morbi leo urna molestie at elementum eu facilisis sed. Vitae congue eu consequat ac felis donec et odio pellentesque. Habitant morbi tristique senectus et netus et. Quisque id diam vel quam elementum pulvinar etiam non. Habitasse platea dictumst vestibulum rhoncus. Accumsan tortor posuere ac ut consequat. Pharetra et ultrices neque ornare aenean euismod elementum nisi quis. Convallis tellus id interdum velit. Lacus sed turpis tincidunt id. Pellentesque pulvinar pellentesque habitant morbi tristique senectus et. Sit amet venenatis urna cursus eget nunc scelerisque viverra.

Tincidunt vitae semper quis lectus nulla at. Ornare arcu dui vivamus arcu felis bibendum ut tristique et. Enim neque volutpat ac tincidunt vitae. Posuere sollicitudin aliquam ultrices sagittis. Tristique sollicitudin nibh sit amet commodo nulla facilisi nullam. Nisi porta lorem mollis aliquam. Et leo duis ut diam quam nulla. Cursus metus aliquam eleifend mi in nulla posuere sollicitudin aliquam. At risus viverra adipiscing at in tellus integer. Diam in arcu cursus euismod. Euismod quis viverra nibh cras pulvinar mattis. Ullamcorper malesuada proin libero nunc consequat interdum varius sit. Faucibus pulvinar elementum integer enim neque volutpat ac tincidunt vitae. Egestas diam in arcu cursus euismod quis viverra. Aliquam ut porttitor leo a diam sollicitudin tempor id. Sagittis id consectetur purus ut faucibus pulvinar elementum integer. Risus sed vulputate odio ut enim blandit volutpat maecenas volutpat.
[/font][/div][/div][/div]
[/div][div class=credit]code by [USER=2383][COLOR=#7E1F1F]sox[/COLOR][/USER][/div]
 
chezmoi said:
ROSE WATER - MOBILE FRIENDLY

its another cs i made for an rp c: this was for shruthi's heist rp which i wasn't gonna make my own code for, but the competition is tough man. the text boxes scroll, all the pictures hover, and the roses at the top are tabs to get to each page. i'm classifying this is mobile friendly, but the text does cut off a little on my phone when i turn it sideways, so use it as your own discretion! please do not remove the credit!

[class=bkgd] position: relative; box-sizing: border-box; width: 505px; height: 410px; background-color: #94A24B; overflow: hidden; margin-right: auto; margin-left: auto; padding: 0; border-radius: 10px; border: 3px solid #122303; [/class] [class=title] text-shadow: 3px 3px 0px #EBEAF0; position: absolute; left: 9px; top: -8px; overflow: hidden; width: 300px; height: auto; text-align: left; font-weight: 700; font-size: 40px; color: #731620; text-transform: uppercase; [/class] [class=role] text-shadow: 2px 2px 0px #122303; position: absolute; left: 9px; top: 42px; overflow: hidden; width: 200px; height: aut0; text-align: left; font-style: italic; font-weight: 700; font-size: 20px; color: #EBEAF0; text-transform: uppercase; [/class] [class=one] position: absolute; overflow: visible; width: 40px; height: 40px; left: 297px; top: 10px; background: url(https://imgur.com/YNfWSbC.png); background-size: 100%; [/class] [class=two] position: absolute; overflow: visible; width: 40px; height: 40px; left: 349px; top: 10px; background: url(https://imgur.com/f0GjNBo.png); background-size: 100%; [/class] [class=three] position: absolute; overflow: visible; width: 40px; height: 40px; left: 401px; top: 10px; background: url(https://imgur.com/IcNag7q.png); background-size: 100%; [/class] [class=four] position: absolute; overflow: visible; width: 40px; height: 40px; left: 453px; top: 10px; background: url(https://imgur.com/R10YRvb.png); background-size: 100%; [/class] [class=sub1] position: absolute; left: 228px; top: 370px; transform: rotate(-90deg); transform-origin: left; overflow: hidden; width: 200px; height: auto; text-align: left; font-style: italic; font-weight: 700; font-size: 20px; color: #EBEAF0; text-transform: uppercase; [/class] [class=sub2] position: absolute; left: 228px; top: 370px; transform: rotate(-90deg); transform-origin: left; overflow: hidden; width: 200px; height: auto; text-align: left; font-style: italic; font-weight: 700; font-size: 20px; color: #EBEAF0; text-transform: uppercase; [/class] [class=sub3] position: absolute; left: 228px; top: 370px; transform: rotate(-90deg); transform-origin: left; overflow: hidden; width: 200px; height: auto; text-align: left; font-style: italic; font-weight: 700; font-size: 20px; color: #EBEAF0; text-transform: uppercase; [/class] [class=sub4] position: absolute; left: 228px; top: 370px; transform: rotate(-90deg); transform-origin: left; overflow: hidden; width: 200px; height: auto; text-align: left; font-style: italic; font-weight: 700; font-size: 20px; color: #EBEAF0; text-transform: uppercase; [/class] [class=text] position: relative; overflow: auto; width: 249px; height: 305px; color: #EBEAF0; font-size: 10px; line-height: 12px; padding: 10px; text-align: justify; text-transform: lowercase; [/class] [class=textcont] position: absolute; overflow: hidden; width: 249px; height: 335px; left: 242px; top: 60px; box-shadow: 3px 3px 0px #122303; background-color: #406017; border-radius: 10px; [/class] [class=tag] position: relative; overflow: visible; display: inline; width: auto; height: auto; margin-right: 5px; border-radius: 100px; background-color: #731620; box-shadow: 2px 2px 0px #122303; color: #EBEAF0; font-size: 9px; padding-left: 5px; padding-right: 5px; text-align: center; text-transform: uppercase; font-weight: 700; [/class] [class=tagb] position: relative; overflow: visible; width: auto; height: auto; margin-bottom: 5px; border-radius: 100px; background-color: #731620; box-shadow: 2px 2px 0px #122303; color: #EBEAF0; font-size: 9px; padding-left: 5px; padding-right: 5px; text-align: center; text-transform: uppercase; font-weight: 700; [/class] [class=toppic] position: absolute; overflow: visible; width: 80px; height: 80px; left: 9px; top: 80px; box-shadow: 3px 3px 0px #122303; border-radius: 1000px; background: url(https://i.pinimg.com/564x/ea/3f/a2/ea3fa29511427a83f5b1a5004cc11e0a.jpg); border: 3px solid #3F6014; background-size: 120%; background-position: 100% 0%; [/class] [class name=toppic state=hover] background: url(https://i.pinimg.com/564x/c2/fa/76/c2fa7691a04ca9a1355251b58f5efde9.jpg); transition-duration: 0.3s; transform: scale(1.1); border: 3px solid #EBEAF0; box-shadow: 3px 3px 0px #731620; background-size: 100%; background-position: 0% 0%; [/class] [class=midpic] position: absolute; overflow: visible; width: 130px; height: 130px; left: 60px; top: 115px; box-shadow: 3px 3px 0px #122303; border-radius: 1000px; background: url(https://i.pinimg.com/564x/44/89/1c/44891cbdb1df37f4bb73e20e5a04b195.jpg); border: 3px solid #3F6014; background-size: 100%; background-position: 0% 0%; [/class] [class name=midpic state=hover] background: url(https://imgur.com/aBgi7vk.png); transition-duration: 0.3s; transform: scale(1.1); border: 3px solid #EBEAF0; box-shadow: 3px 3px 0px #731620; background-size: 100%; background-position: 0% 0%; [/class] [class=botpic] position: absolute; overflow: visible; width: 250px; height: 250px; left: -45px; top: 200px; box-shadow: 3px 3px 0px #122303; border-radius: 1000px; background: url(https://imgur.com/M1k66tP.png); border: 3px solid #3F6014; background-size: 100%; background-position: 0% 0%; [/class] [class name=botpic state=hover] background: url(https://imgur.com/xhnljOf.png); transition-duration: 0.3s; transform: scale(1.1); border: 3px solid #EBEAF0; box-shadow: 3px 3px 0px #731620; background-size: 100%; background-position: 0% 0%; [/class] [class=dec1] position: absolute; overflow: visible; width: 40px; height: 40px; left: 106px; top: 81px; box-shadow: 3px 3px 0px #122303; border-radius: 100px; background-color: #3F6014; [/class] [class name=dec1 state=hover] transition-duration: 0.2s; background-color: #731620; box-shadow: 3px 3px 0px #EBEAF0; [/class] [class=dec2] position: absolute; overflow: visible; width: 30px; height: 30px; left: 160px; top: 94px; box-shadow: 3px 3px 0px #122303; border-radius: 50px; background-color: #3F6014; [/class] [class name=dec2 state=hover] transition-duration: 0.2s; background-color: #731620; box-shadow: 3px 3px 0px #EBEAF0; [/class] [class=dec3] position: absolute; overflow: visible; width: 20px; height: 20px; left: 200px; top: 120px; box-shadow: 3px 3px 0px #122303; border-radius: 100px; background-color: #3F6014; [/class] [class name=dec3 state=hover] transition-duration: 0.2s; background-color: #731620; box-shadow: 3px 3px 0px #EBEAF0; [/class] [class=tab] position: absolute; overflow: visible; [/class] [class name=tab state=hover] transform: rotate(360deg) scale(1.3); transition-duration: 0.3s; [/class] [script class=tab on=click] hide tabsContent set currentTab (getText) if (eq ${currentTab} 1) (show tabsContentBasics) if (eq ${currentTab} 1) (show sub1) if (eq ${currentTab} 1) (hide sub2) if (eq ${currentTab} 1) (hide sub3) if (eq ${currentTab} 1) (hide sub4) if (eq ${currentTab} 2) (show tabsContentPersona) if (eq ${currentTab} 2) (show sub2) if (eq ${currentTab} 2) (hide sub1) if (eq ${currentTab} 2) (hide sub3) if (eq ${currentTab} 2) (hide sub4) if (eq ${currentTab} 3) (show tabsContentBackground) if (eq ${currentTab} 3) (show sub3) if (eq ${currentTab} 3) (hide sub1) if (eq ${currentTab} 3) (hide sub2) if (eq ${currentTab} 3) (hide sub4) if (eq ${currentTab} 4) (show tabsContentGallery) if (eq ${currentTab} 4) (show sub4) if (eq ${currentTab} 4) (hide sub1) if (eq ${currentTab} 4) (hide sub2) if (eq ${currentTab} 4) (hide sub3) [/script] [class=credit] position: relative; overflow: hidden; width: 100%; height: 10px; text-align: center; font-style: normal; font-weight: normal; font-size: 8px; color: #94A24B; opacity: 0.3; [/class]

[div class=bkgd]
[div class=title]rose water[/div]
[div class=role]she's so sweet[/div]
[div class="tab one"]
1
[/div]
[div class="tab two"]
2
[/div]
[div class="tab three"]
3
[/div]
[div class="tab four"]
4
[/div]
[div class=toppic][/div]
[div class=midpic][/div]
[div class=botpic][/div]
[div class=dec1][/div]
[div class=dec2][/div]
[div class=dec3][/div]
[div class=sub1]basics[/div]
[div class=sub2 style="display: none;"]persona[/div]
[div class=sub3 style="display: none;"]background[/div]
[div class=sub4 style="display: none;"]gallery[/div]

[div class="tabsContent tabsContentBasics"][div class=textcont][div class=text][div class=tag]name:[/div] Don't look at me

[div class=tag]nickname:[/div] with that light glance

[div class=tag]gender:[/div] Don't speak of love easily

[div class=tag]sexuality:[/div] If you want my heart

[div class=tag]role:[/div] you need to take my pain too

[div class=tag]height:[/div] Because you will be pricked

[div class=tag]weight:[/div] by my thorns someday

[div class=tag]eye color:[/div] Don't trust me too much

[div class=tag]hair color:[/div] You don't know me that well yet

[div class=tag]hair type:[/div] So just run away

[div class=tag]body type:[/div] Don't love me

[div class=tag]skin tone:[/div] Don't come to me

[div class=tag]dist. marks:[/div] Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Donec adipiscing tristique risus nec feugiat in fermentum posuere urna. Quis imperdiet massa tincidunt nunc pulvinar sapien et. Lobortis scelerisque fermentum dui faucibus in ornare quam.

[div class=tag]body mods:[/div] Arcu risus quis varius quam quisque id. Platea dictumst vestibulum rhoncus est pellentesque. Auctor neque vitae tempus quam pellentesque nec nam. Malesuada fames ac turpis egestas. Tempor orci eu lobortis elementum nibh tellus molestie nunc non. Nunc mi ipsum faucibus vitae aliquet nec ullamcorper sit.

[div class=tag]faceclaim:[/div] deepika padukone
[/div][/div][/div]

[div class="tabsContent tabsContentPersona" style="display: none;"][div class=textcont][div class=text][div class=tag]likes:[/div] Sed risus pretium quam vulputate dignissim suspendisse in. Nulla pellentesque dignissim enim sit amet. Sit amet nisl purus in mollis nunc sed id. Consectetur adipiscing elit pellentesque habitant morbi tristique senectus. Rutrum tellus pellentesque eu tincidunt tortor aliquam nulla facilisi cras. Tincidunt augue interdum velit euismod in pellentesque massa. Dis parturient montes nascetur ridiculus mus mauris vitae ultricies.

[div class=tag]dislikes:[/div] Arcu risus quis varius quam quisque id. Platea dictumst vestibulum rhoncus est pellentesque. Auctor neque vitae tempus quam pellentesque nec nam. Malesuada fames ac turpis egestas. Tempor orci eu lobortis elementum nibh tellus molestie nunc non. Nunc mi ipsum faucibus vitae aliquet nec ullamcorper sit. Dui accumsan sit amet nulla facilisi morbi tempus iaculis. Vivamus at augue eget arcu dictum varius duis at. Fames ac turpis egestas sed tempus urna et.

[div class=tag]vices:[/div] manipulative, exploitative, shameless, arrogant, stubborn, apathetic, dishonest, brash, and two-faced.

[div class=tag]virtues:[/div] intelligent, confident, fearless, loyal, independent, energetic, cunning, just, rational, charming, seductive, and humorous.

[div class=tag]fears:[/div] falling in love, getting her heart broken, never being loved for who she is, being used/taken advantage of, heights, really short people ("humans shouldn't be that small past puberty. change my mind."), and clowns.

[div class=tag]ambitions:[/div] getting back at the rich while living amongst the elite, finding someone on the same wavelength as her, uprooting society for shits and giggles ("as one does. didn't you ever read 'uglies'?"), and owning around 5 snakes and 5 cats, probably.

[div class=tagb]"So, the Louvre. Are you ready?"[/div]"you're asking me if i'm ready? in the past week alone, i've gone through twenty-three red bull yellows, incapacitated four of the mentors at my dojo, and redone my nails six separate times. of course i'm not ready, babe, but that's just how it is in this business. we gotta work in a very specific time frame, which means we can't wait around for our nerves to finally shit themselves before getting the job done. so, are you ready, sweet cheeks?"

[div class=tagb]"Glass half full or half empty?"[/div]"god, if i had a penny for every time i didn't care for this metaphor... it's all situational, isn't it? if the glass has got bird spit in it, half empty---miss me with that. if it's got cyanide, half full is more than enough to get the job done, so long as it isn't expired. how about it, love? is that a stupid enough answer for your stupid ass question? journalism degrees don't mean shit these days. a tragedy."

[div class=tagb]"What's your favorite movie?"[/div]"the babadook, probably. that whole premise is wild. or maybe mister nobody. who doesn't love getting mentally fucked? or any other type of fucked, for that matter."

[div class=tagb]"Weapon of choice?"[/div]"i carry around a Navy Seal S.O.G. Tactical Knife, since the bitch can do just about anything. it's also a survival, utility, combat, and hunting knife---the serrated edge makes it easy to cut through just about anything, and the anti-glare properties of the metal make it harder to detect in action. it also just kind of looks badass."

[div class=tagb]"What are your hopes for the future?"[/div]"oh, you know, evade prison, destroy some people's will to live, get a side bitch here and there, maybe mess around and buy a ranch. the usual aspirations, you know? ah, and loot the hell out of the louvre. that, too. baise les français!"
[/div][/div][/div]

[div class="tabsContent tabsContentBackground" style="display: none;"][div class=textcont][div class=text][div class=tagb]biography[/div]Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Donec adipiscing tristique risus nec feugiat in fermentum posuere urna. Quis imperdiet massa tincidunt nunc pulvinar sapien et. Lobortis scelerisque fermentum dui faucibus in ornare quam. Nibh sit amet commodo nulla facilisi nullam vehicula ipsum a. Amet mattis vulputate enim nulla. Molestie at elementum eu facilisis sed odio. Eget dolor morbi non arcu risus quis. Vulputate ut pharetra sit amet aliquam id. Pulvinar neque laoreet suspendisse interdum. Praesent elementum facilisis leo vel fringilla est. Sed risus pretium quam vulputate dignissim suspendisse in. Nulla pellentesque dignissim enim sit amet. Sit amet nisl purus in mollis nunc sed id. Consectetur adipiscing elit pellentesque habitant morbi tristique senectus. Rutrum tellus pellentesque eu tincidunt tortor aliquam nulla facilisi cras. Tincidunt augue interdum velit euismod in pellentesque massa. Dis parturient montes nascetur ridiculus mus mauris vitae ultricies.

Arcu risus quis varius quam quisque id. Platea dictumst vestibulum rhoncus est pellentesque. Auctor neque vitae tempus quam pellentesque nec nam. Malesuada fames ac turpis egestas. Tempor orci eu lobortis elementum nibh tellus molestie nunc non. Nunc mi ipsum faucibus vitae aliquet nec ullamcorper sit. Dui accumsan sit amet nulla facilisi morbi tempus iaculis. Vivamus at augue eget arcu dictum varius duis at. Fames ac turpis egestas sed tempus urna et. Interdum velit laoreet id donec ultrices tincidunt. Justo eget magna fermentum iaculis eu non diam. Senectus et netus et malesuada fames ac turpis. Amet tellus cras adipiscing enim eu. Cursus mattis molestie a iaculis at erat pellentesque. Curabitur vitae nunc sed velit dignissim sodales ut. Consequat ac felis donec et odio pellentesque diam. Tellus molestie nunc non blandit massa enim nec.

Cursus in hac habitasse platea dictumst quisque. At in tellus integer feugiat. Pellentesque elit ullamcorper dignissim cras tincidunt lobortis. Elementum tempus egestas sed sed risus pretium. Commodo nulla facilisi nullam vehicula ipsum a arcu. Enim blandit volutpat maecenas volutpat blandit aliquam etiam erat. Tempor nec feugiat nisl pretium. Imperdiet nulla malesuada pellentesque elit eget gravida cum. Tempor nec feugiat nisl pretium fusce id velit ut. Sit amet est placerat in egestas erat imperdiet. Purus sit amet volutpat consequat mauris nunc congue nisi. Sed arcu non odio euismod lacinia. Platea dictumst vestibulum rhoncus est pellentesque elit ullamcorper. Sed vulputate mi sit amet. Adipiscing vitae proin sagittis nisl rhoncus mattis. Nullam vehicula ipsum a arcu. Commodo quis imperdiet massa tincidunt. Sed odio morbi quis commodo odio aenean sed adipiscing diam. Enim diam vulputate ut pharetra sit amet aliquam id. Viverra nibh cras pulvinar mattis nunc sed blandit libero.

Sit amet tellus cras adipiscing enim eu. Maecenas sed enim ut sem viverra. Et netus et malesuada fames. Pulvinar neque laoreet suspendisse interdum consectetur libero id faucibus. Viverra ipsum nunc aliquet bibendum enim facilisis gravida. Aenean vel elit scelerisque mauris pellentesque pulvinar pellentesque. Etiam erat velit scelerisque in. Nec feugiat in fermentum posuere. A scelerisque purus semper eget duis. Mi quis hendrerit dolor magna. Adipiscing enim eu turpis egestas pretium aenean pharetra. Viverra tellus in hac habitasse platea dictumst vestibulum rhoncus. Molestie ac feugiat sed lectus vestibulum mattis ullamcorper velit. Aliquet enim tortor at auctor urna nunc. Sit amet commodo nulla facilisi nullam vehicula ipsum a. Tincidunt nunc pulvinar sapien et.

Tristique senectus et netus et. Rhoncus mattis rhoncus urna neque viverra justo nec ultrices dui. Maecenas ultricies mi eget mauris pharetra et ultrices neque. Pretium fusce id velit ut tortor pretium. Pellentesque nec nam aliquam sem et tortor consequat. Pellentesque id nibh tortor id aliquet lectus proin. Sem integer vitae justo eget magna fermentum iaculis eu non. Volutpat blandit aliquam etiam erat velit scelerisque in dictum non. Porttitor leo a diam sollicitudin tempor id eu. Mauris sit amet massa vitae.
[/div][/div][/div]

[div class="tabsContent tabsContentGallery" style="display: none;"][div class=textcont][div class=text][div class=tagb]face:[/div]
1ce8d2eb77a65f2f2030457410d6b08f.jpg

7d9a896e95c682df7b8dd8a2e4e485ff.jpg

31956d630ea9596e2b01d5c9ea607b6c.jpg

0a24d46cd3a3b10e0f82427f6c0f3dc7.jpg

0f571449281ca8c1814fd0f7d3fa40bb.jpg

3abdc435eeb87d997dae3f3f0bc55e1c.jpg

1432128b82aac005371f26a9e87a83b1.jpg



[div class=tagb]attire:[/div]
dd8a21de5228b21919d4ab42336d6784.jpg

74f293ac53d79c00ac2e16963c465277.jpg

ed5ee86d31d89f807d832163404b7f41.jpg

53ee49540ec3de73f57d7a4326c2f8db.jpg

15f3783f2176676a16267194dc89cb2e.jpg

f618204557199fd1186e7e2ee1a905cf.jpg

209c08485ada3042736cc0fe8042aabe.jpg

[/div][/div][/div][/div][div class=credit]code by sox sox [/div]

Code: 
[nobr]
    [class=bkgd]
        position: relative;
        box-sizing: border-box;
        width: 505px;
        height: 410px;
        background-color: #94A24B;
        overflow: hidden;
        margin-right: auto;
        margin-left: auto;
        padding: 0;
        border-radius: 10px;
        border: 3px solid #122303;
    [/class]
    [class=title]
        text-shadow: 3px 3px 0px #EBEAF0;
        position: absolute;
        left: 9px;
        top: -8px;
        overflow: hidden;
        width: 300px;
        height: auto;
        text-align: left;
        font-weight: 700;
        font-size: 40px;
        color: #731620;
        text-transform: uppercase;
    [/class]
    [class=role]
        text-shadow: 2px 2px 0px #122303;
        position: absolute;
        left: 9px;
        top: 42px;
        overflow: hidden;
        width: 200px;
        height: aut0;
        text-align: left;
        font-style: italic;
        font-weight: 700;
        font-size: 20px;
        color: #EBEAF0;
        text-transform: uppercase;
    [/class]
    [comment]vector credit to Vecteezy[/comment]
    [class=one]
        position: absolute;
        overflow: visible;
        width: 40px;
        height: 40px;
        left: 297px;
        top: 10px;
        background: url(https://imgur.com/YNfWSbC.png);
        background-size: 100%;
    [/class]
    [class=two]
        position: absolute;
        overflow: visible;
        width: 40px;
        height: 40px;
        left: 349px;
        top: 10px;
        background: url(https://imgur.com/f0GjNBo.png);
        background-size: 100%;
    [/class]
    [class=three]
        position: absolute;
        overflow: visible;
        width: 40px;
        height: 40px;
        left: 401px;
        top: 10px;
        background: url(https://imgur.com/IcNag7q.png);
        background-size: 100%;
    [/class]
    [class=four]
        position: absolute;
        overflow: visible;
        width: 40px;
        height: 40px;
        left: 453px;
        top: 10px;
        background: url(https://imgur.com/R10YRvb.png);
        background-size: 100%;
    [/class]
    [class=sub1]
        position: absolute;
        left: 228px;
        top: 370px;
        transform: rotate(-90deg);
        transform-origin: left;
        overflow: hidden;
        width: 200px;
        height: auto;
        text-align: left;
        font-style: italic;
        font-weight: 700;
        font-size: 20px;
        color: #EBEAF0;
        text-transform: uppercase;
    [/class]
    [class=sub2]
        position: absolute;
        left: 228px;
        top: 370px;
        transform: rotate(-90deg);
        transform-origin: left;
        overflow: hidden;
        width: 200px;
        height: auto;
        text-align: left;
        font-style: italic;
        font-weight: 700;
        font-size: 20px;
        color: #EBEAF0;
        text-transform: uppercase;
    [/class]
    [class=sub3]
        position: absolute;
        left: 228px;
        top: 370px;
        transform: rotate(-90deg);
        transform-origin: left;
        overflow: hidden;
        width: 200px;
        height: auto;
        text-align: left;
        font-style: italic;
        font-weight: 700;
        font-size: 20px;
        color: #EBEAF0;
        text-transform: uppercase;
    [/class]
    [class=sub4]
        position: absolute;
        left: 228px;
        top: 370px;
        transform: rotate(-90deg);
        transform-origin: left;
        overflow: hidden;
        width: 200px;
        height: auto;
        text-align: left;
        font-style: italic;
        font-weight: 700;
        font-size: 20px;
        color: #EBEAF0;
        text-transform: uppercase;
    [/class]
    [class=text]
        position: relative;
        overflow: auto;
        width: 249px;
        height: 305px;
        color: #EBEAF0;
        font-size: 10px;
        line-height: 12px;
        padding: 10px;
        text-align: justify;
        text-transform: lowercase;
    [/class]
    [class=textcont]
        position: absolute;
        overflow: hidden;
        width: 249px;
        height: 335px;
        left: 242px;
        top: 60px;
        box-shadow: 3px 3px 0px #122303;
        background-color: #406017;
        border-radius: 10px;
    [/class]
    [class=tag]
        position: relative;
        overflow: visible;
        display: inline;
        width: auto;
        height: auto;
        margin-right: 5px;
        border-radius: 100px;
        background-color: #731620;
        box-shadow: 2px 2px 0px #122303;
        color: #EBEAF0;
        font-size: 9px;
        padding-left: 5px;
        padding-right: 5px;
        text-align: center;
        text-transform: uppercase;
        font-weight: 700;
    [/class]
    [class=tagb]
        position: relative;
        overflow: visible;
        width: auto;
        height: auto;
        margin-bottom: 5px;
        border-radius: 100px;
        background-color: #731620;
        box-shadow: 2px 2px 0px #122303;
        color: #EBEAF0;
        font-size: 9px;
        padding-left: 5px;
        padding-right: 5px;
        text-align: center;
        text-transform: uppercase;
        font-weight: 700;
    [/class]
    [class=toppic]
        position: absolute;
        overflow: visible;
        width: 80px;
        height: 80px;
        left: 9px;
        top: 80px;
        box-shadow: 3px 3px 0px #122303;
        border-radius: 1000px;
        background: url(https://i.pinimg.com/564x/ea/3f/a2/ea3fa29511427a83f5b1a5004cc11e0a.jpg);
        border: 3px solid #3F6014;
        background-size: 120%;
        background-position: 100% 0%;
    [/class]
    [class name=toppic state=hover]
        background: url(https://i.pinimg.com/564x/c2/fa/76/c2fa7691a04ca9a1355251b58f5efde9.jpg);
        transition-duration: 0.3s;
        transform: scale(1.1);
        border: 3px solid #EBEAF0;
        box-shadow: 3px 3px 0px #731620;
        background-size: 100%;
        background-position: 0% 0%;
    [/class]
    [class=midpic]
        position: absolute;
        overflow: visible;
        width: 130px;
        height: 130px;
        left: 60px;
        top: 115px;
        box-shadow: 3px 3px 0px #122303;
        border-radius: 1000px;
        background: url(https://i.pinimg.com/564x/44/89/1c/44891cbdb1df37f4bb73e20e5a04b195.jpg);
        border: 3px solid #3F6014;
        background-size: 100%;
        background-position: 0% 0%;
    [/class]
    [class name=midpic state=hover]
        background: url(https://imgur.com/aBgi7vk.png);
        transition-duration: 0.3s;
        transform: scale(1.1);
        border: 3px solid #EBEAF0;
        box-shadow: 3px 3px 0px #731620;
        background-size: 100%;
        background-position: 0% 0%;
    [/class]
    [class=botpic]
        position: absolute;
        overflow: visible;
        width: 250px;
        height: 250px;
        left: -45px;
        top: 200px;
        box-shadow: 3px 3px 0px #122303;
        border-radius: 1000px;
        background: url(https://imgur.com/M1k66tP.png);
        border: 3px solid #3F6014;
        background-size: 100%;
        background-position: 0% 0%;
    [/class]
    [class name=botpic state=hover]
        background: url(https://imgur.com/xhnljOf.png);
        transition-duration: 0.3s;
        transform: scale(1.1);
        border: 3px solid #EBEAF0;
        box-shadow: 3px 3px 0px #731620;
        background-size: 100%;
        background-position: 0% 0%;
    [/class]
    [class=dec1]
        position: absolute;
        overflow: visible;
        width: 40px;
        height: 40px;
        left: 106px;
        top: 81px;
        box-shadow: 3px 3px 0px #122303;
        border-radius: 100px;
        background-color: #3F6014;
    [/class]
    [class name=dec1 state=hover]
        transition-duration: 0.2s;
        background-color: #731620;
        box-shadow: 3px 3px 0px #EBEAF0;
    [/class]
    [class=dec2]
        position: absolute;
        overflow: visible;
        width: 30px;
        height: 30px;
        left: 160px;
        top: 94px;
        box-shadow: 3px 3px 0px #122303;
        border-radius: 50px;
        background-color: #3F6014;
    [/class]
    [class name=dec2 state=hover]
        transition-duration: 0.2s;
        background-color: #731620;
        box-shadow: 3px 3px 0px #EBEAF0;
    [/class]
    [class=dec3]
        position: absolute;
        overflow: visible;
        width: 20px;
        height: 20px;
        left: 200px;
        top: 120px;
        box-shadow: 3px 3px 0px #122303;
        border-radius: 100px;
        background-color: #3F6014;
    [/class]
    [class name=dec3 state=hover]
        transition-duration: 0.2s;
        background-color: #731620;
        box-shadow: 3px 3px 0px #EBEAF0;
    [/class]
    [class=tab]
        position: absolute;
        overflow: visible;
    [/class]
    [class name=tab state=hover]
        transform: rotate(360deg) scale(1.3);
        transition-duration: 0.3s;
    [/class]
    [script class=tab on=click]
                hide tabsContent
                set currentTab (getText)
                if (eq ${currentTab} 1) (show tabsContentBasics)
                if (eq ${currentTab} 1) (show sub1)
                if (eq ${currentTab} 1) (hide sub2)
                if (eq ${currentTab} 1) (hide  sub3)
                if (eq ${currentTab} 1) (hide  sub4)
                if (eq ${currentTab} 2) (show tabsContentPersona)
                if (eq ${currentTab} 2) (show sub2)
                if (eq ${currentTab} 2) (hide  sub1)
                if (eq ${currentTab} 2) (hide  sub3)
                if (eq ${currentTab} 2) (hide sub4)
                if (eq ${currentTab} 3) (show tabsContentBackground)
                if (eq ${currentTab} 3) (show sub3)
                if (eq ${currentTab} 3) (hide sub1)
                if (eq ${currentTab} 3) (hide  sub2)
                if (eq ${currentTab} 3) (hide sub4)
                if (eq ${currentTab} 4) (show tabsContentGallery)
                if (eq ${currentTab} 4) (show sub4)
                if (eq ${currentTab} 4) (hide  sub1)
                if (eq ${currentTab} 4) (hide sub2)
                if (eq ${currentTab} 4) (hide sub3)
    [/script]
[class=credit]
        position: relative;
        overflow: hidden;
        width: 100%;
        height: 10px;
        text-align: center;
        font-style: normal;
        font-weight: normal;
        font-size: 8px;
        color: #94A24B;
        opacity: 0.5;
[/class]
[/nobr]

[div class=bkgd]
    [div class=title][font=Lato]rose water[/font][/div]
    [div class=role][font=Lato]she's so sweet[/font][/div]
    [div class="tab one"][div=opacity:0]1[/div][/div]
    [div class="tab two"][div=opacity:0]2[/div][/div]
    [div class="tab three"][div=opacity:0]3[/div][/div]
    [div class="tab four"][div=opacity:0]4[/div][/div]
    [div class=toppic][/div]
    [div class=midpic][/div]
    [div class=botpic][/div]
    [div class=dec1][/div]
    [div class=dec2][/div]
    [div class=dec3][/div]
    [div class=sub1][font=Lato]basics[/font][/div]
    [div class=sub2 style="display: none;"][font=Lato]persona[/font][/div]
    [div class=sub3 style="display: none;"][font=Lato]background[/font][/div]
    [div class=sub4 style="display: none;"][font=Lato]gallery[/font][/div]

    [div class="tabsContent tabsContentBasics"][div class=textcont][div class=text][font=Raleway][div class=tag][font=Lato]name:[/font][/div] Don't look at me

[div class=tag][font=Lato]nickname:[/font][/div] with that light glance

[div class=tag][font=Lato]gender:[/font][/div] Don't speak of love easily

[div class=tag][font=Lato]sexuality:[/font][/div] If you want my heart

[div class=tag][font=Lato]role:[/font][/div] you need to take my pain too

[div class=tag][font=Lato]height:[/font][/div] Because you will be pricked

[div class=tag][font=Lato]weight:[/font][/div] by my thorns someday

[div class=tag][font=Lato]eye color:[/font][/div] Don't trust me too much

[div class=tag][font=Lato]hair color:[/font][/div] You don't know me that well yet

[div class=tag][font=Lato]hair type:[/font][/div] So just run away

[div class=tag][font=Lato]body type:[/font][/div] Don't love me

[div class=tag][font=Lato]skin tone:[/font][/div] Don't come to me

[div class=tag][font=Lato]dist. marks:[/font][/div] Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Donec adipiscing tristique risus nec feugiat in fermentum posuere urna. Quis imperdiet massa tincidunt nunc pulvinar sapien et. Lobortis scelerisque fermentum dui faucibus in ornare quam.

[div class=tag][font=Lato]body mods:[/font][/div] Arcu risus quis varius quam quisque id. Platea dictumst vestibulum rhoncus est pellentesque. Auctor neque vitae tempus quam pellentesque nec nam. Malesuada fames ac turpis egestas. Tempor orci eu lobortis elementum nibh tellus molestie nunc non. Nunc mi ipsum faucibus vitae aliquet nec ullamcorper sit.

[div class=tag][font=Lato]faceclaim:[/font][/div] deepika padukone
[/font][/div][/div][/div]

[div class="tabsContent tabsContentPersona" style="display: none;"][div class=textcont][div class=text][font=Raleway][div class=tag][font=Lato]likes:[/font][/div] Sed risus pretium quam vulputate dignissim suspendisse in. Nulla pellentesque dignissim enim sit amet. Sit amet nisl purus in mollis nunc sed id. Consectetur adipiscing elit pellentesque habitant morbi tristique senectus. Rutrum tellus pellentesque eu tincidunt tortor aliquam nulla facilisi cras. Tincidunt augue interdum velit euismod in pellentesque massa. Dis parturient montes nascetur ridiculus mus mauris vitae ultricies.

[div class=tag][font=Lato]dislikes:[/font][/div] Arcu risus quis varius quam quisque id. Platea dictumst vestibulum rhoncus est pellentesque. Auctor neque vitae tempus quam pellentesque nec nam. Malesuada fames ac turpis egestas. Tempor orci eu lobortis elementum nibh tellus molestie nunc non. Nunc mi ipsum faucibus vitae aliquet nec ullamcorper sit. Dui accumsan sit amet nulla facilisi morbi tempus iaculis. Vivamus at augue eget arcu dictum varius duis at. Fames ac turpis egestas sed tempus urna et.

[div class=tag][font=Lato]vices:[/font][/div] manipulative, exploitative, shameless, arrogant, stubborn, apathetic, dishonest, brash, and two-faced.

[div class=tag][font=Lato]virtues:[/font][/div] intelligent, confident, fearless, loyal, independent, energetic, cunning, just, rational, charming, seductive, and humorous.

[div class=tag][font=Lato]fears:[/font][/div] falling in love, getting her heart broken, never being loved for who she is, being used/taken advantage of, heights, really short people ("humans shouldn't be that small past puberty. change my mind."), and clowns.

[div class=tag][font=Lato]ambitions:[/font][/div] getting back at the rich while living amongst the elite, finding someone on the same wavelength as her, uprooting society for shits and giggles ("as one does. didn't you ever read 'uglies'?"), and owning around 5 snakes and 5 cats, probably.

[div class=tagb][font=Lato]"So, the Louvre. Are you ready?"[/font][/div]"you're asking me if i'm ready? in the past week alone, i've gone through twenty-three red bull yellows, incapacitated four of the mentors at my dojo, and redone my nails six separate times. of course i'm not ready, babe, but that's just how it is in this business. we gotta work in a very specific time frame, which means we can't wait around for our nerves to finally shit themselves before getting the job done. so, are [I]you[/I] ready, sweet cheeks?"

[div class=tagb][font=Lato]"Glass half full or half empty?"[/font][/div]"god, if i had a penny for every time i didn't care for this metaphor... it's all situational, isn't it? if the glass has got bird spit in it, half empty---miss me with that. if it's got cyanide, half full is more than enough to get the job done, so long as it isn't expired. how about it, love? is that a stupid enough answer for your stupid ass question? journalism degrees don't mean shit these days. a tragedy."

[div class=tagb][font=Lato]"What's your favorite movie?"[/font][/div]"the babadook, probably. that whole premise is wild. or maybe mister nobody. who doesn't love getting mentally fucked? or any other type of fucked, for that matter."

[div class=tagb][font=Lato]"Weapon of choice?"[/font][/div]"i carry around a Navy Seal S.O.G. Tactical Knife, since the bitch can do just about anything. it's also a survival, utility, combat, and hunting knife---the serrated edge makes it easy to cut through just about anything, and the anti-glare properties of the metal make it harder to detect in action. it also just kind of looks badass."

[div class=tagb][font=Lato]"What are your hopes for the future?"[/font][/div]"oh, you know, evade prison, destroy some people's will to live, get a side bitch here and there, maybe mess around and buy a ranch. the usual aspirations, you know? ah, and loot the hell out of the louvre. that, too. [I]baise les français!"[/I]
[/font][/div][/div][/div]

[div class="tabsContent tabsContentBackground" style="display: none;"][div class=textcont][div class=text][font=Raleway][div class=tagb][font=Lato]biography[/font][/div]Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Donec adipiscing tristique risus nec feugiat in fermentum posuere urna. Quis imperdiet massa tincidunt nunc pulvinar sapien et. Lobortis scelerisque fermentum dui faucibus in ornare quam. Nibh sit amet commodo nulla facilisi nullam vehicula ipsum a. Amet mattis vulputate enim nulla. Molestie at elementum eu facilisis sed odio. Eget dolor morbi non arcu risus quis. Vulputate ut pharetra sit amet aliquam id. Pulvinar neque laoreet suspendisse interdum. Praesent elementum facilisis leo vel fringilla est. Sed risus pretium quam vulputate dignissim suspendisse in. Nulla pellentesque dignissim enim sit amet. Sit amet nisl purus in mollis nunc sed id. Consectetur adipiscing elit pellentesque habitant morbi tristique senectus. Rutrum tellus pellentesque eu tincidunt tortor aliquam nulla facilisi cras. Tincidunt augue interdum velit euismod in pellentesque massa. Dis parturient montes nascetur ridiculus mus mauris vitae ultricies.

Arcu risus quis varius quam quisque id. Platea dictumst vestibulum rhoncus est pellentesque. Auctor neque vitae tempus quam pellentesque nec nam. Malesuada fames ac turpis egestas. Tempor orci eu lobortis elementum nibh tellus molestie nunc non. Nunc mi ipsum faucibus vitae aliquet nec ullamcorper sit. Dui accumsan sit amet nulla facilisi morbi tempus iaculis. Vivamus at augue eget arcu dictum varius duis at. Fames ac turpis egestas sed tempus urna et. Interdum velit laoreet id donec ultrices tincidunt. Justo eget magna fermentum iaculis eu non diam. Senectus et netus et malesuada fames ac turpis. Amet tellus cras adipiscing enim eu. Cursus mattis molestie a iaculis at erat pellentesque. Curabitur vitae nunc sed velit dignissim sodales ut. Consequat ac felis donec et odio pellentesque diam. Tellus molestie nunc non blandit massa enim nec.

Cursus in hac habitasse platea dictumst quisque. At in tellus integer feugiat. Pellentesque elit ullamcorper dignissim cras tincidunt lobortis. Elementum tempus egestas sed sed risus pretium. Commodo nulla facilisi nullam vehicula ipsum a arcu. Enim blandit volutpat maecenas volutpat blandit aliquam etiam erat. Tempor nec feugiat nisl pretium. Imperdiet nulla malesuada pellentesque elit eget gravida cum. Tempor nec feugiat nisl pretium fusce id velit ut. Sit amet est placerat in egestas erat imperdiet. Purus sit amet volutpat consequat mauris nunc congue nisi. Sed arcu non odio euismod lacinia. Platea dictumst vestibulum rhoncus est pellentesque elit ullamcorper. Sed vulputate mi sit amet. Adipiscing vitae proin sagittis nisl rhoncus mattis. Nullam vehicula ipsum a arcu. Commodo quis imperdiet massa tincidunt. Sed odio morbi quis commodo odio aenean sed adipiscing diam. Enim diam vulputate ut pharetra sit amet aliquam id. Viverra nibh cras pulvinar mattis nunc sed blandit libero.

Sit amet tellus cras adipiscing enim eu. Maecenas sed enim ut sem viverra. Et netus et malesuada fames. Pulvinar neque laoreet suspendisse interdum consectetur libero id faucibus. Viverra ipsum nunc aliquet bibendum enim facilisis gravida. Aenean vel elit scelerisque mauris pellentesque pulvinar pellentesque. Etiam erat velit scelerisque in. Nec feugiat in fermentum posuere. A scelerisque purus semper eget duis. Mi quis hendrerit dolor magna. Adipiscing enim eu turpis egestas pretium aenean pharetra. Viverra tellus in hac habitasse platea dictumst vestibulum rhoncus. Molestie ac feugiat sed lectus vestibulum mattis ullamcorper velit. Aliquet enim tortor at auctor urna nunc. Sit amet commodo nulla facilisi nullam vehicula ipsum a. Tincidunt nunc pulvinar sapien et.

Tristique senectus et netus et. Rhoncus mattis rhoncus urna neque viverra justo nec ultrices dui. Maecenas ultricies mi eget mauris pharetra et ultrices neque. Pretium fusce id velit ut tortor pretium. Pellentesque nec nam aliquam sem et tortor consequat. Pellentesque id nibh tortor id aliquet lectus proin. Sem integer vitae justo eget magna fermentum iaculis eu non. Volutpat blandit aliquam etiam erat velit scelerisque in dictum non. Porttitor leo a diam sollicitudin tempor id eu. Mauris sit amet massa vitae.
[/font][/div][/div][/div]

[div class="tabsContent tabsContentGallery" style="display: none;"][div class=textcont][div class=text][font=Raleway][div class=tagb][font=Lato]face:[/font][/div][IMG]https://i.pinimg.com/564x/1c/e8/d2/1ce8d2eb77a65f2f2030457410d6b08f.jpg[/IMG]
[IMG]https://i.pinimg.com/564x/7d/9a/89/7d9a896e95c682df7b8dd8a2e4e485ff.jpg[/IMG]
[IMG]https://i.pinimg.com/564x/31/95/6d/31956d630ea9596e2b01d5c9ea607b6c.jpg[/IMG]
[IMG]https://i.pinimg.com/564x/0a/24/d4/0a24d46cd3a3b10e0f82427f6c0f3dc7.jpg[/IMG]
[IMG]https://i.pinimg.com/564x/0f/57/14/0f571449281ca8c1814fd0f7d3fa40bb.jpg[/IMG]
[IMG]https://i.pinimg.com/564x/3a/bd/c4/3abdc435eeb87d997dae3f3f0bc55e1c.jpg[/IMG]
[IMG]https://i.pinimg.com/564x/14/32/12/1432128b82aac005371f26a9e87a83b1.jpg[/IMG]


[div class=tagb][font=Lato]attire:[/font][/div][IMG]https://i.pinimg.com/564x/dd/8a/21/dd8a21de5228b21919d4ab42336d6784.jpg[/IMG]
[IMG]https://i.pinimg.com/564x/74/f2/93/74f293ac53d79c00ac2e16963c465277.jpg[/IMG]
[IMG]https://i.pinimg.com/564x/ed/5e/e8/ed5ee86d31d89f807d832163404b7f41.jpg[/IMG]
[IMG]https://i.pinimg.com/564x/53/ee/49/53ee49540ec3de73f57d7a4326c2f8db.jpg[/IMG]
[IMG]https://i.pinimg.com/564x/15/f3/78/15f3783f2176676a16267194dc89cb2e.jpg[/IMG]
[IMG]https://i.pinimg.com/564x/f6/18/20/f618204557199fd1186e7e2ee1a905cf.jpg[/IMG]
[IMG]https://i.pinimg.com/564x/20/9c/08/209c08485ada3042736cc0fe8042aabe.jpg[/IMG]
[/font][/div][/div][/div][/div][div class=credit]code by [USER=2383][COLOR=#94A24B]sox[/COLOR][/USER][/div]
Click to expand...
this hoe whole ass mentioned me in her thread bro bow down i got mentioned by a legend
 
COOKIE - MOBILE FRIENDLY

oh hey look sox never uses placeholder codes but here she is, making a placeholder code regardless of the fact. tbh i just wanted to make something quick and pretty and minimal, and this is the result lmao. nothing fancy, no hovers, just a bunch of boxes. please do not remove the credit! enjoy, friends! c:

[class=bkgd] position: relative; box-sizing: border-box; width: 400px; height: 420px; overflow: hidden; margin-left: auto; margin-right: auto; padding: 0; [/class] [class=roleback] overflow: visible; position: absolute; top: 191px; left: 131px; width: 198.597px; height: 190px; background-color: #D8B148; border: 10px solid #C22725; [/class] [class=rolepref] position: absolute; left: 120px; top: 358px; transform: rotate(-90deg); transform-origin: left; overflow: hidden; width: 100px; height: auto; text-align: left; font-style: italic; font-weight: 700; font-size: 40px; color: #DFE4E7; [/class] [class=role] position: absolute; left: 138px; top: 342px; overflow: hidden; width: 200px; height: 67px; text-align: left; font-style: italic; font-weight: 700; font-size: 40px; line-height: 20px; color: #1F1F1F; [/class] [class=pic] position: absolute; overflow: visible; width: 165px; height: 293px; left: 33px; top: 21px; background: url(https://i.pinimg.com/originals/f3/f5/a0/f3f5a0482c60d78a663ba179152db87b.jpg); background-size: 100%; border: 3px solid #DFE4E7; [/class] [class=namecard] position: absolute; overflow: visible; width: 217px; height: 78px; left: 151px; top: 79px; background-color: #DFE4E7; [/class] [class=serifname] position: absolute; width: 400px; height: 78px; left: 158px; top: 65px; overflow: visible white-space: nowrap; text-align: left; font-style: normal; font-weight: normal; font-size: 55px; color: #D8B148; text-transform: uppercase; letter-spacing: -1px; [/class] [class=ssname] position: absolute; width: 217px; height: 78px; left: 151px; top: 40px; overflow: visible; white-space: nowrap; text-align: center; font-style: normal; font-weight: normal; font-size: 80px; color: #382D31; letter-spacing: 0.8px; [/class] [class=namebar] position: absolute; overflow: visible; width: 217px; height: 18px; left: 151px; top: 56px; background-color: #C22725 [/class] [class=credit] position: absolute; overflow: hidden; width: 100px; height: 10px; top: 400px; left: 278px; text-align: center; font-style: normal; font-weight: normal; font-size: 8px; color: #C22725; opacity: 0.3; [/class]
[div class=bkgd]
[div class=roleback][/div]
[div class=rolepref]the[/div]
[div class=role]chosen
one[/div]
[div class=pic][/div]
[div class=namecard][/div]
[div class=serifname]cookie[/div]
[div class=ssname]cookie[/div]
[div class=namebar][/div][div class=credit]code by sox sox [/div][/div]

Code: 
[nobr]
    [class=bkgd]
        position: relative;
        box-sizing: border-box;
        width: 400px;
        height: 420px;
        overflow: hidden;
        margin-left: auto;
        margin-right: auto;
        padding: 0;
    [/class]
    [class=roleback]
        overflow: visible;
        position: absolute;
        top: 191px;
        left: 131px;
        width: 198.597px;
        height: 190px;
        background-color: #D8B148;
        border: 10px solid #C22725;
    [/class]
    [class=rolepref]
        position: absolute;
        left: 120px;
        top: 358px;
        transform: rotate(-90deg);
        transform-origin: left;
        overflow: hidden;
        width: 100px;
        height: auto;
        text-align: left;
        font-style: italic;
        font-weight: 700;
        font-size: 40px;
        color: #DFE4E7;
    [/class]
    [class=role]
        position: absolute;
        left: 138px;
        top: 342px;
        overflow: hidden;
        width: 200px;
        height: 67px;
        text-align: left;
        font-style: italic;
        font-weight: 700;
        font-size: 40px;
        line-height: 20px;
        color: #1F1F1F;
    [/class]
    [class=pic]
        position: absolute;
        overflow: visible;
        width: 165px;
        height: 293px;
        left: 33px;
        top: 21px;
        background: url(https://i.pinimg.com/originals/f3/f5/a0/f3f5a0482c60d78a663ba179152db87b.jpg);
        background-size: 100%;
        border: 3px solid #DFE4E7;
    [/class]
    [class=namecard]
        position: absolute;
        overflow: visible;
        width: 217px;
        height: 78px;
        left: 151px;
        top: 79px;
        background-color: #DFE4E7;
    [/class]
    [class=serifname]
        position: absolute;
        width: 400px;
        height: 78px;
        left: 158px;
        top: 65px;
        overflow: visible
        white-space: nowrap;
        text-align: left;
        font-style: normal;
        font-weight: normal;
        font-size: 55px;
        color: #D8B148;
        text-transform: uppercase;
        letter-spacing: -1px;
    [/class]
    [class=ssname]
        position: absolute;
        width: 217px;
        height: 78px;
        left: 151px;
        top: 40px;
        overflow: visible;
        white-space: nowrap;
        text-align: center;
        font-style: normal;
        font-weight: normal;
        font-size: 80px;
        color: #382D31;
        letter-spacing: 0.8px;
    [/class]
    [class=namebar]
        position: absolute;
        overflow: visible;
        width: 217px;
        height: 18px;
        left: 151px;
        top: 56px;
        background-color: #C22725
    [/class]
    [class=credit]
        position: absolute;
        overflow: hidden;
        width: 100px;
        height: 10px;
        top: 400px;
        left: 278px;
        text-align: center;
        font-style: normal;
        font-weight: normal;
        font-size: 8px;
        color: #C22725;
        opacity: 0.3;
    [/class]
[/nobr]
    [div class=bkgd]
    [div class=roleback][/div]
    [div class=rolepref][font=Pragati Narrow]the[/font][/div]
    [div class=role][font=Pragati Narrow]chosen[br][/br]one[/font][/div]
    [div class=pic][/div]
    [div class=namecard][/div]
    [div class=serifname][font=Playfair Display]cookie[/font][/div]
    [div class=ssname][font=Dawning of a New Day]cookie[/font][/div]
    [div class=namebar][/div][div class=credit]code by [USER=2383][COLOR=#C22725]sox[/COLOR][/USER][/div][/div]
 
You must log in or register to reply here.

Users who are viewing this thread

Total: 3 (members: 0, guests: 3)

Similar threads

CHUUYAS_HAT
Help What images to add in BBCode - FIXED
Replies
5
Views
174
Otto Levin
Otto Levin
Bill123456789
Help Background
Replies
3
Views
116
Idea
Idea
Daddy Dream
Help Post Template Help/Request
Replies
3
Views
130
Daddy Dream
Daddy Dream
Bill123456789
Help How do I make code for Japanese
Replies
2
Views
132
Uxie
Uxie
DaydreamNarrator
Closed found the solution
Replies
0
Views
57
DaydreamNarrator
DaydreamNarrator
Back
Top