• This section is for roleplays only.
    ALL interest checks/recruiting threads must go in the Recruit Here section.

    Please remember to credit artists when using works not your own.

Realistic or Modern High Society (Characters)

Main
Here

LittleDarkness

Come and kiss me, salt water
Roleplay Type(s)
I do not own this character sheet. However, I would love for you to use this templet for your sheets.
You may post sheets here once they are finished.
BEFORE YOU MAKE YOUR CHARACTER, MAKE SURE YOU'VE BEEN APPROVED.
CODE

[class=container] --accent-1: #A0C9C9; --accent-2: #B2E0E0; --accent-3: #333; --image-1: url(https://via.placeholder.com/150/000000/FFFFFF/?text=IMAGE 1); --image-2: url(https://via.placeholder.com/92/000000/FFFFFF/?text=IMAGE 2); --image-3: url(https://via.placeholder.com/92/000000/FFFFFF/?text=IMAGE 3); --image-4: url(https://via.placeholder.com/92/000000/FFFFFF/?text=IMAGE 4); --image-5: url(https://via.placeholder.com/92/000000/FFFFFF/?text=IMAGE 5); --image-6: url(https://via.placeholder.com/92/000000/FFFFFF/?text=IMAGE 6); --image-7: url(https://via.placeholder.com/92/000000/FFFFFF/?text=IMAGE 7); --image-8: url(https://via.placeholder.com/92/000000/FFFFFF/?text=IMAGE 8); --image-9: url(https://via.placeholder.com/92/000000/FFFFFF/?text=IMAGE 9); --image-10: url(https://via.placeholder.com/92/000000/FFFFFF/?text=IMAGE 10); --image-11: url(https://via.placeholder.com/92/000000/FFFFFF/?text=IMAGE 11); --image-12: url(https://via.placeholder.com/92/000000/FFFFFF/?text=IMAGE 12); --image-13: url(https://via.placeholder.com/92/000000/FFFFFF/?text=IMAGE 13); --image-14: url(https://via.placeholder.com/92/000000/FFFFFF/?text=IMAGE 14); --image-15: url(https://via.placeholder.com/92/000000/FFFFFF/?text=IMAGE 15); --image-16: url(https://via.placeholder.com/92/000000/FFFFFF/?text=IMAGE 16); [/class] [div class=credit][/div][div class=credit2 style="display: none;"]code + design by constellation constellation [/div] [class=credit]position: absolute; top: 0px; left: 0px; font-size: 15px; color: #b2e0e0; transition: 1s;[/class] [class=credit2]position: absolute; z-index: 2; top: 5px; left: 15px; max-width: 160px; margin: 15px; font-size: 10px; letter-spacing: 3px; text-align: center; font-weight: 500; text-transform: lowercase; padding: 25px 30px; color: #333; border: 1px solid #e2e2e2; background: white;[/class] [class name="credit" state="hover"]cursor: url(https://66.media.tumblr.com/6fb38fc5e97353c67e3fc3a2e2b29bf9/tumblr_inline_ol4nwisGdu1uxxza6_75sq.png), auto!important; color: #A0C9C9; transitions: 1s;[/class] [script class=credit on=mouseenter]fadeIn 1000 credit2[/script][script class=credit on=mouseleave]fadeOut 1000 credit2[/script]
[div class=container][div class=border][div class=charactername]CHARACTERS NAME
[div class=icon][/div] [div class=role]Other[/div] [div class=sideword]ROLE[/div] [div class="tabContents tabContents1"][div class=textbox][div class=scroll][div class=tag]full name.[/div] information here [div class=tag]nicknames.[/div] information here [div class=tag]age.[/div] information here [div class=tag]birthdate.[/div] information here [div class=tag]gender[/div] information here [div class=tag]country.[/div] information here [div class=tag]sexuality.[/div] information here [div class=tag]relationship status.[/div] information here [div class=tag]Theme Songs.[/div] information here [/div][/div] [div class=column][div class=images style="background: var(--image-2); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-3); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-4); background-size: cover; background-position: center;"][/div][/div][/div] [div class="tabContents tabContents2"][div class=textbox][div class=scroll][div class=tag]eyes.[/div] information here. [div class=tag]hair.[/div] information here [div class=tag]height.[/div] information here [div class=tag]body build.[/div] information here [div class=tag]distinguishing marks.[/div] information here [div class=tag]attire.[/div] information here [/div][/div] [div class=column][div class=images style="background: var(--image-5); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-6); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-7); background-size: cover; background-position: center;"][/div][/div][/div] [div class="tabContents tabContents3"][div class=textbox][div class=scroll][div class=tag]enneagram.[/div] information here [div class=tag]positive traits.[/div] information here [div class=tag]negative traits.[/div] information here [div class=tag]love language.[/div] information here [div class=tag]greatest fear.[/div] information here [div class=tag]priorities, goals and ambitions.[/div] information here [div class=tag]likes.[/div] information here [div class=tag]dislikes.[/div] information here [/div][/div] [div class=column][div class=images style="background: var(--image-8); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-9); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-10); background-size: cover; background-position: center;"][/div][/div][/div] [div class="tabContents tabContents4"][div class=textbox][div class=scroll][div class=tag]the backstory.[/div] Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras sollicitudin tempor felis, id hendrerit tortor consequat ultricies. Quisque eget purus lobortis, facilisis nisi sed, vehicula nisl. Cras pellentesque dictum sollicitudin. Nunc posuere ex a elit malesuada, vel condimentum quam sagittis. Suspendisse ipsum risus, laoreet ut pretium vitae, elementum eget ipsum. Phasellus felis lectus, pretium eu nibh quis, consectetur egestas turpis. Sed dignissim felis et sapien vulputate dapibus. Proin orci risus, tristique quis ante et, ultricies maximus purus. Phasellus ultricies, felis at facilisis iaculis, nulla massa vestibulum nunc, et malesuada tellus nisi eu arcu. Fusce rhoncus odio et velit pellentesque, et efficitur odio condimentum. Phasellus pharetra mi et laoreet iaculis. Quisque pulvinar nulla sit amet pretium faucibus. Suspendisse sit amet venenatis urna, ut egestas justo. Maecenas et aliquet nisl, ac posuere felis. Nam eget tincidunt erat. Phasellus tincidunt lobortis nisi, volutpat suscipit dolor rhoncus vitae. Praesent quis est sit amet arcu commodo elementum eget mollis magna. Vestibulum dictum scelerisque quam id volutpat. In hac habitasse platea dictumst. In hac habitasse platea dictumst. Maecenas malesuada tellus vel ultrices accumsan. Mauris quam nunc, mattis id tristique sit amet, pulvinar a mauris. Duis at porta lectus. Curabitur porta, sem non molestie lobortis, arcu augue gravida lacus, at congue libero lacus vel est. Pellentesque ornare, enim at maximus elementum, libero nunc aliquet est, nec convallis erat orci eu diam. [/div][/div] [div class=column][div class=images style="background: var(--image-11); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-12); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-13); background-size: cover; background-position: center;"][/div][/div][/div] [div class="tabContents tabContents5"][div class=textbox][div class=scroll][div class=tag]father.[/div] information here [div class=tag]mother.[/div] information here [div class=tag]sister.[/div] information here [div class=tag]brother.[/div] information here [/div][/div] [div class=column][div class=images style="background: var(--image-14); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-15); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-16); background-size: cover; background-position: center;"][/div][/div][/div] [div class="tab tab1" style="left: 12px; bottom: -30px;"][/div] [div class="tab tab2" style="left: 85px; bottom: -30px;"][/div] [div class="tab tab3" style="left: 158px; bottom: -30px;"][/div] [div class="tab tab4" style="left: 231px; bottom: -30px;"][/div] [div class="tab tab5" style="left: 304px; bottom: -30px;"][/div] [div class="tab tab6" style="left: 377px; bottom: -30px;"][/div] [/div][/div][/div] [class=container] width: 450px; height: 450px; margin: auto; cursor: url(https://66.media.tumblr.com/232c090ebdd37ae4bc17adb54e1e0344/tumblr_inline_ol4nwhvSwg1uxxza6_75sq.png), auto!important; [/class] [class=border] position: absolute; width: 450px; height: 450px; border: 1px solid #ccc; outline: 1px solid #fafafa; background: #f1f1f1; margin: auto; overflow: hidden; [/class] [class=charactername] position: absolute; width: 450px; top: 75px; right: 0; text-align: center; font-size: 30px; text-transform: uppercase; color: var(--accent-2); font-weight: 900; text-align: center; transition: ease 1s; white-space: nowrap; transition-delay: 1s; [/class] [class=icon] width: 150px; height: 150px; background: var(--image-1); background-size: cover; background-position: center; border-radius: 100%; position: absolute; left: 145px; top: 145px; z-index: 2; border: 5px solid var(--accent-1); transform: rotateY(0deg); transition: ease 1s; cursor: url(https://66.media.tumblr.com/6fb38fc5e97353c67e3fc3a2e2b29bf9/tumblr_inline_ol4nwisGdu1uxxza6_75sq.png), auto!important; [/class] [class=role] position: absolute; bottom: 90px; width: 450px; height: 10px; text-align: center; color: var(--accent-2); font-size: 11px; line-height: 10px; transition: ease 1s; transition-delay: 1s; text-transform: uppercase; [/class] [class=charname] font-size: 15px; top: 34px; right: 10px; width: 170px; transition-delay: 0s; [/class] [class=roledown] bottom: -20px; transition-delay: 0s; [/class] [class=sideword] position: absolute; width: 170px; left: -170px; top: 34px; font: 15px; text-transform: uppercase; color: var(--accent-2); font-weight: 900; text-align: center; transition: ease 1s; box-sizing: border-box; padding-right: 0px; transition-delay: 1s; [/class] [class=swordin] left: 10px; transition-delay: 0s; [/class] [class=spin] top: 15px; left: 190px; width: 60px; height: 60px; transform: rotateY(360deg); transition-delay: 1s; border-width: 2px; [/class] [class=tab] position: absolute; background: var(--accent-1); width: 61px; height: 30px; border-radius: 3px; display: inline-block; transition: ease 0.5s; line-height: 30px; text-align: center; font-size: 12px; color: var(--accent-3); cursor: url(https://66.media.tumblr.com/6fb38fc5e97353c67e3fc3a2e2b29bf9/tumblr_inline_ol4nwisGdu1uxxza6_75sq.png), auto!important; [/class] [class=up] margin-bottom: 40px; transition: ease 0.5s; [/class] [class=stab1] transition-delay: 2.2s; [/class] [class=stab2] transition-delay: 2.4s; [/class] [class=stab3] transition-delay: 2.6s; [/class] [class=stab4] transition-delay: 2.8s; [/class] [class=stab5] transition-delay: 3s; [/class] [class=stab6] transition-delay: 3.2s; [/class] [class=tabContents] position: absolute; top: 85px; left: 20px; height: 320px; width: 410px; transition: all .5s; opacity: 0; [/class] [class=fadein] opacity: 1; z-index: 1; transition: all 1.5s; transition-delay: 3.6s; [/class] [class=column] height: 320px; width: 96px; display: flex; justify-content: space-evenly; position: absolute; right: 0; flex-direction: column; [/class] [class=images] height: 92px; width: 92px; border: 2px solid var(--accent-2); [/class] [class=images2] height: 92px; width: 92px; border: 2px solid var(--accent-1); [/class] [class=textbox] position: absolute; left: 0; top: 7px; width: 315px; height: 305px; overflow: hidden; font-size: 12px; white-space: pre-line; line-height: 130%; text-transform: lowercase; [/class] [class=scroll] width: 100%; height: 100%; overflow-y: scroll; padding-right: 17px; color: var(--accent-3); [/class] [class=tag] text-transform: uppercase; display: inline; font-size: 12px; letter-spacing: 1px; text-align: left; font-weight: 600; color: var(--accent-1); [/class] [class name=tab state=hover] background: var(--accent-3); color: var(--accent-1); transition: ease .5s; [/class] [class=chosen] background: var(--accent-3); color: var(--accent-1); transition: ease .5s; [/class] [class=chosen1] background: var(--accent-3); color: var(--accent-1); transition: ease .5s; transition-delay: 2.2s; [/class] [class=show] opacity: 1; transition: all 1s; z-index: 1; [/class] [class=none] pointer-events: none; [/class] [script class=tab on=mouseenter] removeClass stab1 tab1 removeClass stab2 tab2 removeClass stab3 tab3 removeClass stab4 tab4 removeClass stab5 tab5 removeClass stab6 tab6 [/script] [script class=icon on=click] addClass charname charactername addClass roledown role addClass swordin sideword addClass spin icon addClass up tab addClass stab1 tab1 addClass stab2 tab2 addClass stab3 tab3 addClass stab4 tab4 addClass stab5 tab5 addClass stab6 tab6 addClass fadein tabContents1 addClass chosen1 tab1 addClass none icon [/script] [script class=tab1 on=click] addClass show tabContents1 addClass chosen tab1 removeClass show tabContents2 removeClass show tabContents3 removeClass show tabContents4 removeClass show tabContents5 removeClass fadein tabContents1 removeClass chosen tab2 removeClass chosen tab3 removeClass chosen tab4 removeClass chosen tab5 removeClass chosen1 tab1 [/script] [script class=tab2 on=click] addClass show tabContents2 addClass chosen tab2 removeClass show tabContents1 removeClass show tabContents3 removeClass show tabContents4 removeClass show tabContents5 removeClass fadein tabContents1 removeClass chosen tab1 removeClass chosen tab3 removeClass chosen tab4 removeClass chosen tab5 removeClass chosen1 tab1 [/script] [script class=tab3 on=click] addClass show tabContents3 addClass chosen tab3 removeClass show tabContents1 removeClass show tabContents2 removeClass show tabContents4 removeClass show tabContents5 removeClass fadein tabContents1 removeClass chosen tab1 removeClass chosen tab2 removeClass chosen tab4 removeClass chosen tab5 removeClass chosen1 tab1 [/script] [script class=tab4 on=click] addClass show tabContents4 addClass chosen tab4 removeClass show tabContents1 removeClass show tabContents2 removeClass show tabContents3 removeClass show tabContents5 removeClass fadein tabContents1 removeClass chosen tab1 removeClass chosen tab2 removeClass chosen tab3 removeClass chosen tab5 removeClass chosen1 tab1 [/script] [script class=tab5 on=click] addClass show tabContents5 addClass chosen tab5 removeClass show tabContents1 removeClass show tabContents2 removeClass show tabContents3 removeClass show tabContents4 removeClass fadein tabContents1 removeClass chosen tab1 removeClass chosen tab2 removeClass chosen tab3 removeClass chosen tab4 removeClass chosen1 tab1 [/script] [script class=tab6 on=click] removeClass charname charactername removeClass roledown role removeClass swordin sideword removeClass spin icon removeClass up tab removeClass fadein tabContents removeClass show tabContents removeClass chosen1 tab1 removeClass chosen tab removeClass none icon [/script]
 
Last edited:
[class=container] --accent-1: #ddb2e0; --accent-2: #ddb2e0; --accent-3: #333; --image-1: url(https://33.media.tumblr.com/5013b9f198dfe8c6950635e5bc8c7740/tumblr_nob0f7rzZK1r1z45bo2_r1_500.gif); --image-2: url(https://i.pinimg.com/originals/f1/2c/77/f12c776fb63614741c25019016522d88.jpg); --image-3: url(https://media.giphy.com/media/l2QEinJucvW769RZK/giphy.gif); --image-4: url(https://www.nailpro.com/wp-content/uploads/2019/02/2019-Grammy-Awards-Anna-Kendrick-essie-nail-art-e1549913681295.jpg); --image-5: url(https://i.pinimg.com/originals/a9/53/b6/a953b6eabfdf68ca125f144f21962967.jpg); --image-6: url(https://media3.giphy.com/media/z8Sacp6IvU4OA/source.gif); --image-7: url(https://thoughtcatalog.files.wordpress.com/2016/06/anna-kendrick.png?w=1140&h=771); --image-8: url(https://66.media.tumblr.com/cc729d6601472e4fc60053e11f3f9edd/tumblr_pmknqt6LsZ1x7nqo5o6_400.png); --image-9: url(https://66.media.tumblr.com/eb66abfcd92e3509537dd14470adde1f/tumblr_oqe9a1LYVV1v0lt2xo7_250.gifv); --image-10: url(https://dankanator.com/wp-content/uploads/2019/02/anna-kendrick.jpg); --image-11: url(https://data1.ibtimes.co.in/cache-img-600-0-photo/en/full/67253/1496472306_latest-stills-anna-kendrick.jpg); --image-12: url(https://wordsandthensome.files.wordpress.com/2015/05/annakendmindblown.gif); --image-13: url(https://i.redd.it/6mww7lcst9ky.jpg); --image-14: url(https://pbs.twimg.com/media/Dk9ZI8RX4AAr4rD.jpg); --image-15: url(https://thumbs.gfycat.com/ColossalSimilarLamprey-size_restricted.gif); --image-16: url(https://annakendrick1985.files.wordpress.com/2016/12/anna_kendrick_2016_playboy_20q_01.jpg); [/class] [div class=credit][/div][div class=credit2 style="display: none;"]code + design by constellation constellation [/div] [class=credit]position: absolute; top: 0px; left: 0px; font-size: 15px; color: #ddb2e0; transition: 1s;[/class] [class=credit2]position: absolute; z-index: 2; top: 5px; left: 15px; max-width: 160px; margin: 15px; font-size: 10px; letter-spacing: 3px; text-align: center; font-weight: 500; text-transform: lowercase; padding: 25px 30px; color: #333; border: 1px solid #e2e2e2; background: white;[/class] [class name="credit" state="hover"]cursor: url(https://66.media.tumblr.com/6fb38fc5e97353c67e3fc3a2e2b29bf9/tumblr_inline_ol4nwisGdu1uxxza6_75sq.png), auto!important; color: #A0C9C9; transitions: 1s;[/class] [script class=credit on=mouseenter]fadeIn 1000 credit2[/script][script class=credit on=mouseleave]fadeOut 1000 credit2[/script]
[div class=container][div class=border][div class=charactername]Gianna De Leon
[div class=icon][/div] [div class=role]The Responsible one[/div] [div class=sideword]The Responsible One[/div] [div class="tabContents tabContents1"][div class=textbox][div class=scroll][div class=tag]full name.[/div] Gianna Jade De Leon [div class=tag]nicknames.[/div] Gigi (Preferred) Gia (Preferred) Anna|Ann (Dislikes) [div class=tag]age.[/div] Twenty-Three [div class=tag]birthdate.[/div] March 8th ♓ [div class=tag]gender[/div] Female [div class=tag]sexuality.[/div] Heterosexual [div class=tag]relationship status.[/div] It's Complicated [div class=tag]Face Claim[/div] Anna Kendrick [div class=tag]Theme Songs[/div] I love me ❀ Demi Lovato guardian ❀ alanis morissette reasons why i drink ❀ alanis morissette [/div][/div] [div class=column][div class=images style="background: var(--image-2); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-3); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-4); background-size: cover; background-position: center;"][/div][/div][/div] [div class="tabContents tabContents2"][div class=textbox][div class=scroll][div class=tag]eyes.[/div] Amber, with gold flakes when you look closer. [div class=tag]hair.[/div] Light Brown [div class=tag]height.[/div] 5'3 (160.02 cm) [div class=tag]body build.[/div] Petite [div class=tag]distinguishing marks.[/div] Scars: none of importance. Piercings: Right Ear || Left Ear || Belly Button Tattoos: Left side, front of shoulder || Middle of back, just above bra strap || Inside of right elbow, the words 'Free Spirit' [div class=tag]attire.[/div] Her wardrobe mostly consists of designer clothes from Vera Wang to Versace. Example 1 || Example 2 || Example 3 || Example 4 [/div][/div] [div class=column][div class=images style="background: var(--image-5); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-6); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-7); background-size: cover; background-position: center;"][/div][/div][/div] [div class="tabContents tabContents3"][div class=textbox][div class=scroll][div class=tag]enneagram.[/div] The Loyalist (Committed. Security-Oriented. Engaging. Responsible. Anxious. Suspicious.) [div class=tag]positive traits.[/div] ⁎Happy-go-lucky ⁎creative ⁎optimistic ⁎Loyal ⁎Trustworthy ⁎Responsible ⁎Friendly ⁎nurturing ⁎committed ⁎wants to see the good in everyone [div class=tag]negative traits.[/div] ⁎ Suspicious ⁎Addict ⁎Anxious ⁎Self-Destructive ⁎Secretive ⁎Keeps emotions pint up ⁎Doesn't Trust Others Easily [div class=tag]love language.[/div] Words of Affirmation [div class=tag]greatest fear.[/div] ➤Losing her sisters ➤Dying of an overdose ➤Her sister's finding out about her addictions [div class=tag]priorities, goals and ambitions.[/div] ➤ Making her own money, not relying on the family fortune. ➤Traveling the World. ➤ Get certified as a Yoga instructor. ➤ Finish a her Masters in Arts [div class=tag]likes.[/div] ▵Iced Coffee ▵Bad Boys ▵Tattoos ▵Chick Flicks ▵Helping Others▵Horseback Riding ▵ Designer Clothes ▵ Her Maine Coon, Huck ▵Traveling ▵ Yoga ▵Social Events ▵ Dressing up ▵ Designer Drugs ▵ Hard Liquor ▵ Her BMW ▵Activism [div class=tag]dislikes.[/div] ▿Loneliness ▿Feeling out of Control ▿Her Depression/Anxiety▿Sour Candy ▿ Being Cold▿ Diet Soda ▿M&Ms▿ Herself (Sometimes) ▿Sexism ▿ Horror Movies▿ Politics ▿ Judgmental People▿ Showing her emotions [/div][/div] [div class=column][div class=images style="background: var(--image-8); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-9); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-10); background-size: cover; background-position: center;"][/div][/div][/div] [div class="tabContents tabContents4"][div class=textbox][div class=scroll][div class=tag]the backstory.[/div] Growing up in Ravenpoint was always a bit like being in a soap opera. You had the house wife drama, the secret affairs, and the mysterious dark family histories that no one wanted to talk about. Gianna however did her best to stay out of all of that. She focused on schooling and for most of her younger years, she was the ideal daughter. Often times, other parents would comment on what a dream she was. It wasn't until her mother passed away in her early teens, that things got a bit muddy for her. Her father seemed to always have an excuse as to why he couldn't come home for long periods of time, leaving her in charge to care for her sisters, all the while still having to get through school. This was when she started experimenting with drugs. Their just wasn't enough time in the day to take care of her younger sisters and focus on homework. Adderall very quickly became a useful substance for her, at seventeen she moved from adderall to cocaine, which worked even better at keeping her awake for days at a time. Her addiction didn't cease, yet she was able to keep herself level headed enough to keep her addictions to herself and a secret from her sisters and everyone else. In college she let go a bit, not enough to really get herself in trouble, because her sisters were still her responsibility. Still, she dropped the good girl act a bit, which only ended up on her letting in shitty guys who used and abused her; beating down her confidence and causing her to turn to drugs and liquor a little more. Despite this, she managed to graduate with a BA in Arts. Currently she's still living at home, taking care of her sisters and keeping them out of trouble, to the best of her ability. She's an ambassador for Unicef, she adores yoga and wants to become a certified teacher, and eventually she wants to get her Masters degree. However, that will all have to wait, considering she's letting herself get a little too involved in Ravenpoints drama lately. [/div][/div] [div class=column][div class=images style="background: var(--image-11); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-12); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-13); background-size: cover; background-position: center;"][/div][/div][/div] [div class="tabContents tabContents5"][div class=textbox][div class=scroll][div class=tag]Andre De Leon || father || Living[/div] Being the first born, she had a special relationship with her dad. Although she was aware of the fact that her father had wished she was a boy. She'd always lived with trying to up hold to a standard her father would approve of, running herself into the ground a lot. When her mother passed away, her and her father became a bit more distant, leaving her to watch after her younger sisters. She does her best not to resent him. [div class=tag]Gracie Ricci || mother ||Deceased[/div] It wasn't that Gia didn't love her mother, she did. They just never quite could get along. Her mother was always incredibly hard on her, driving into her that she was a role model to her siblings. She was of course devastated when her mother passed away, but at the same time, she almost felt guilt for feeling relived that her mother was no longer breathing down her neck. [div class=tag]Sisters|| Living[/div] She's never favored one sister over the other and she has a unique relationship with both of them. She does he best to play her role as mother, but also to play the role of their big sister, she's aware they need both. She would give her life for both of them in a heartbeat and sometimes forgets to take care of herself, because all of her energy is spent making sure they have what they need and taking care of them. [/div][/div] [div class=column][div class=images style="background: var(--image-14); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-15); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-16); background-size: cover; background-position: center;"][/div][/div][/div] [div class="tab tab1" style="left: 12px; bottom: -30px;"][/div] [div class="tab tab2" style="left: 85px; bottom: -30px;"][/div] [div class="tab tab3" style="left: 158px; bottom: -30px;"][/div] [div class="tab tab4" style="left: 231px; bottom: -30px;"][/div] [div class="tab tab5" style="left: 304px; bottom: -30px;"][/div] [div class="tab tab6" style="left: 377px; bottom: -30px;"][/div] [/div][/div][/div] [class=container] width: 450px; height: 450px; margin: auto; cursor: url(https://66.media.tumblr.com/232c090ebdd37ae4bc17adb54e1e0344/tumblr_inline_ol4nwhvSwg1uxxza6_75sq.png), auto!important; [/class] [class=border] position: absolute; width: 450px; height: 450px; border: 1px solid #ccc; outline: 1px solid #ddb2e0; background: #f1f1f1; margin: auto; overflow: hidden; [/class] [class=charactername] position: absolute; width: 450px; top: 75px; right: 0; text-align: center; font-size: 30px; text-transform: uppercase; color: var(--accent-2); font-weight: 900; text-align: center; transition: ease 1s; white-space: nowrap; transition-delay: 1s; [/class] [class=icon] width: 150px; height: 150px; background: var(--image-1); background-size: cover; background-position: center; border-radius: 100%; position: absolute; left: 145px; top: 145px; z-index: 2; border: 5px solid var(--accent-1); transform: rotateY(0deg); transition: ease 1s; cursor: url(https://66.media.tumblr.com/6fb38fc5e97353c67e3fc3a2e2b29bf9/tumblr_inline_ol4nwisGdu1uxxza6_75sq.png), auto!important; [/class] [class=role] position: absolute; bottom: 90px; width: 450px; height: 10px; text-align: center; color: var(--accent-2); font-size: 11px; line-height: 10px; transition: ease 1s; transition-delay: 1s; text-transform: uppercase; [/class] [class=charname] font-size: 15px; top: 34px; right: 10px; width: 170px; transition-delay: 0s; [/class] [class=roledown] bottom: -20px; transition-delay: 0s; [/class] [class=sideword] position: absolute; width: 170px; left: -170px; top: 34px; font: 15px; text-transform: uppercase; color: var(--accent-2); font-weight: 900; text-align: center; transition: ease 1s; box-sizing: border-box; padding-right: 0px; transition-delay: 1s; [/class] [class=swordin] left: 10px; transition-delay: 0s; [/class] [class=spin] top: 15px; left: 190px; width: 60px; height: 60px; transform: rotateY(360deg); transition-delay: 1s; border-width: 2px; [/class] [class=tab] position: absolute; background: var(--accent-1); width: 61px; height: 30px; border-radius: 3px; display: inline-block; transition: ease 0.5s; line-height: 30px; text-align: center; font-size: 12px; color: var(--accent-3); cursor: url(https://66.media.tumblr.com/6fb38fc5e97353c67e3fc3a2e2b29bf9/tumblr_inline_ol4nwisGdu1uxxza6_75sq.png), auto!important; [/class] [class=up] margin-bottom: 40px; transition: ease 0.5s; [/class] [class=stab1] transition-delay: 2.2s; [/class] [class=stab2] transition-delay: 2.4s; [/class] [class=stab3] transition-delay: 2.6s; [/class] [class=stab4] transition-delay: 2.8s; [/class] [class=stab5] transition-delay: 3s; [/class] [class=stab6] transition-delay: 3.2s; [/class] [class=tabContents] position: absolute; top: 85px; left: 20px; height: 320px; width: 410px; transition: all .5s; opacity: 0; [/class] [class=fadein] opacity: 1; z-index: 1; transition: all 1.5s; transition-delay: 3.6s; [/class] [class=column] height: 320px; width: 96px; display: flex; justify-content: space-evenly; position: absolute; right: 0; flex-direction: column; [/class] [class=images] height: 92px; width: 92px; border: 2px solid var(--accent-2); [/class] [class=images2] height: 92px; width: 92px; border: 2px solid var(--accent-1); [/class] [class=textbox] position: absolute; left: 0; top: 7px; width: 315px; height: 305px; overflow: hidden; font-size: 12px; white-space: pre-line; line-height: 130%; text-transform: lowercase; [/class] [class=scroll] width: 100%; height: 100%; overflow-y: scroll; padding-right: 17px; color: var(--accent-3); [/class] [class=tag] text-transform: uppercase; display: inline; font-size: 12px; letter-spacing: 1px; text-align: left; font-weight: 600; color: var(--accent-1); [/class] [class name=tab state=hover] background: var(--accent-3); color: var(--accent-1); transition: ease .5s; [/class] [class=chosen] background: var(--accent-3); color: var(--accent-1); transition: ease .5s; [/class] [class=chosen1] background: var(--accent-3); color: var(--accent-1); transition: ease .5s; transition-delay: 2.2s; [/class] [class=show] opacity: 1; transition: all 1s; z-index: 1; [/class] [class=none] pointer-events: none; [/class] [script class=tab on=mouseenter] removeClass stab1 tab1 removeClass stab2 tab2 removeClass stab3 tab3 removeClass stab4 tab4 removeClass stab5 tab5 removeClass stab6 tab6 [/script] [script class=icon on=click] addClass charname charactername addClass roledown role addClass swordin sideword addClass spin icon addClass up tab addClass stab1 tab1 addClass stab2 tab2 addClass stab3 tab3 addClass stab4 tab4 addClass stab5 tab5 addClass stab6 tab6 addClass fadein tabContents1 addClass chosen1 tab1 addClass none icon [/script] [script class=tab1 on=click] addClass show tabContents1 addClass chosen tab1 removeClass show tabContents2 removeClass show tabContents3 removeClass show tabContents4 removeClass show tabContents5 removeClass fadein tabContents1 removeClass chosen tab2 removeClass chosen tab3 removeClass chosen tab4 removeClass chosen tab5 removeClass chosen1 tab1 [/script] [script class=tab2 on=click] addClass show tabContents2 addClass chosen tab2 removeClass show tabContents1 removeClass show tabContents3 removeClass show tabContents4 removeClass show tabContents5 removeClass fadein tabContents1 removeClass chosen tab1 removeClass chosen tab3 removeClass chosen tab4 removeClass chosen tab5 removeClass chosen1 tab1 [/script] [script class=tab3 on=click] addClass show tabContents3 addClass chosen tab3 removeClass show tabContents1 removeClass show tabContents2 removeClass show tabContents4 removeClass show tabContents5 removeClass fadein tabContents1 removeClass chosen tab1 removeClass chosen tab2 removeClass chosen tab4 removeClass chosen tab5 removeClass chosen1 tab1 [/script] [script class=tab4 on=click] addClass show tabContents4 addClass chosen tab4 removeClass show tabContents1 removeClass show tabContents2 removeClass show tabContents3 removeClass show tabContents5 removeClass fadein tabContents1 removeClass chosen tab1 removeClass chosen tab2 removeClass chosen tab3 removeClass chosen tab5 removeClass chosen1 tab1 [/script] [script class=tab5 on=click] addClass show tabContents5 addClass chosen tab5 removeClass show tabContents1 removeClass show tabContents2 removeClass show tabContents3 removeClass show tabContents4 removeClass fadein tabContents1 removeClass chosen tab1 removeClass chosen tab2 removeClass chosen tab3 removeClass chosen tab4 removeClass chosen1 tab1 [/script] [script class=tab6 on=click] removeClass charname charactername removeClass roledown role removeClass swordin sideword removeClass spin icon removeClass up tab removeClass fadein tabContents removeClass show tabContents removeClass chosen1 tab1 removeClass chosen tab removeClass none icon [/script]
 
[class=container] --accent-1: #A0C9C9; --accent-2: #B2E0E0; --accent-3: #333; --image-1: url(https://pbs.twimg.com/profile_images/884034199942033408/FZqazQ84_400x400.jpg); --image-2: url(https://data.whicdn.com/images/285447091/original.gif); --image-3: url(https://66.media.tumblr.com/a671be346722c876dd44925912bc51d6/tumblr_oqe6e7lSeC1u0xntco2_250.gifv); --image-4: url(https://i.pinimg.com/originals/03/18/fe/0318fe136f29b91d150e26ea4aa57f39.gif); --image-5: url(https://thumbs.gfycat.com/BriskDependentBordercollie-size_restricted.gif); --image-6: url(https://66.media.tumblr.com/733b044f416a081fa55d2024237d74ac/tumblr_osrhcsFalB1qdoyv4o3_r1_540.gifv); --image-7: url(https://media0.giphy.com/media/JIMeYFSxSrd1C/source.gif); --image-8: url(https://i.gifer.com/6gZT.gif); --image-9: url(https://i.pinimg.com/originals/5f/a1/d3/5fa1d386104fd719a7e0ef7527d11486.gif); --image-10: url(https://media.giphy.com/media/FcEHwMPEebLck/giphy.gif); --image-11: url(https://i.pinimg.com/originals/c8/b8/08/c8b808c02f2df08c8893c581bd20764e.gif); --image-12: url(https://thumbs.gfycat.com/HelpfulTimelyGlowworm-size_restricted.gif); --image-13: url(https://media1.tenor.com/images/d58f6ff4250d0fef45e8a0a806e843eb/tenor.gif?itemid=7891156); --image-14: url(https://66.media.tumblr.com/7bb286fb3e7418dd7c7ff0181996797e/tumblr_o2j88ktMva1r75gygo7_r1_250.gifv); --image-15: url(https://i.pinimg.com/originals/af/61/a2/af61a2a8e4cd6398316b38d14229ff7d.gif); --image-16: url(https://i.pinimg.com/originals/1f/c7/0d/1fc70d35df5a1385b0d50adcd5ee5653.gif); [/class] [div class=credit][/div][div class=credit2 style="display: none;"]code + design by constellation constellation [/div] [class=credit]position: absolute; top: 0px; left: 0px; font-size: 15px; color: #b2e0e0; transition: 1s;[/class] [class=credit2]position: absolute; z-index: 2; top: 5px; left: 15px; max-width: 160px; margin: 15px; font-size: 10px; letter-spacing: 3px; text-align: center; font-weight: 500; text-transform: lowercase; padding: 25px 30px; color: #333; border: 1px solid #e2e2e2; background: white;[/class] [class name="credit" state="hover"]cursor: url(https://66.media.tumblr.com/6fb38fc5e97353c67e3fc3a2e2b29bf9/tumblr_inline_ol4nwisGdu1uxxza6_75sq.png), auto!important; color: #A0C9C9; transitions: 1s;[/class] [script class=credit on=mouseenter]fadeIn 1000 credit2[/script][script class=credit on=mouseleave]fadeOut 1000 credit2[/script]
[div class=container][div class=border][div class=charactername]Annaliese
[div class=icon][/div] [div class=role]The Rebellious One[/div] [div class=sideword]Rebel[/div] [div class="tabContents tabContents1"][div class=textbox][div class=scroll][div class=tag]full name.[/div] Annaliese Fiona De Leon [div class=tag]nicknames.[/div] Ana [div class=tag]age.[/div] Twenty-one [div class=tag]birthdate.[/div] November 4th [div class=tag]gender.[/div] cis female [div class=tag]sexuality.[/div] bi-curious [div class=tag]relationship status.[/div] single [div class=tag]faceclaim.[/div] Emma Watson [div class=tag]theme songs.[/div] Yeah RIght | Joji Hurt - Oliver Tree Cash Machine - Oliver Tree [/div][/div] [div class=column][div class=images style="background: var(--image-2); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-3); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-4); background-size: cover; background-position: center;"][/div][/div][/div] [div class="tabContents tabContents2"][div class=textbox][div class=scroll][div class=tag]eyes.[/div] Brown [div class=tag]hair.[/div] Brown [div class=tag]height.[/div] 5'4" [div class=tag]body build.[/div] petite [div class=tag]distinguishing marks.[/div] Scars | None Piercings |Nose, Ear Tattoos | Arm [div class=tag]attire.[/div] Her outfit choice depends on her mood. For the most part, she prefers to wear casual brand name clothing. If she and her friends were to go out she'd dress pretty nice making sure to put extra attention into her appearance. | One - Two - Three - Four [/div][/div] [div class=column][div class=images style="background: var(--image-5); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-6); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-7); background-size: cover; background-position: center;"][/div][/div][/div] [div class="tabContents tabContents3"][div class=textbox][div class=scroll][div class=tag]enneagram.[/div] The Individualist [div class=tag]positive traits.[/div] ➳ Daring ➳ Loyal ➳ Self-assured ➳ Sociable ➳ Curious ➳ Creative ➳ Appreciative [div class=tag]negative traits.[/div] ➳ Emotional ➳ Distrusting ➳ Commitment Issues ➳ Compulsive ➳ Impatient ➳ Irresponsible [div class=tag]love language.[/div] Physical Touch [div class=tag]greatest fear.[/div] Losing her sisters [div class=tag]priorities, goals and ambitions.[/div] ➳Her current priority is to simply live life, because what's the point in being mundane when you are just gonna sooner or later. ➳Get enough money to never have to see her father again. ➳Be okay again. [div class=tag]likes.[/div] ➳Drinking & Drugs ➳Partying ➳Shop lifting ➳Her friends ➳Chinese food [div class=tag]dislikes.[/div] ➳Flip-flops. ➳Hoop earrings. ➳People refusing to take risks. ➳Being told she is messing up her life. ➳Her Father. Honestly fuck him. [/div][/div] [div class=column][div class=images style="background: var(--image-8); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-9); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-10); background-size: cover; background-position: center;"][/div][/div][/div] [div class="tabContents tabContents4"][div class=textbox][div class=scroll][div class=tag]the backstory.[/div] Bright-eyed and carefree, Annaliese was once a bubbly happy child. It was rare to see her walking around without a smile especially around her father. As a young child, Annaliese loved the idea of helping people, she loved to pretend to be a doctor, usually roping her sisters into being a sick patient. While her younger sister often stayed glued to her mother she often followed Gianna around begging her to do something together. When her mother died she was distraught and looked to their father for comfort only to be rejected as he continued to abandon them over and over again. Feeling alone she tried to reach out to Gianna for support, but there was only so much her sister could do. Everything suddenly became unclear as the world around her seemed to crash in every possible way. Annaliese started acting out in school, her steady grades slowly dropping as the school year went on. Even with her acting out her father didn't care. Hurt and confused, Annaliese began to shut out those close to her, turning towards friends that are ultimately toxic and wouldn't hesitate to drop her. The dreams of once becoming a doctor turned into a distant memory as partying and drinking soon took over her life. She hates her father for leaving her when she needed him most and vows to never forgive him. [/div][/div] [div class=column][div class=images style="background: var(--image-11); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-12); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-13); background-size: cover; background-position: center;"][/div][/div][/div] [div class="tabContents tabContents5"][div class=textbox][div class=scroll][div class=tag]father.[/div] Annaliese loved her father more than anything, always trying to get him to do things with her. Though he often turned her down she was thrilled the few times he would take time out of his day to spend time with her. together they would have little tea parties with all of her stuff animals as guests. Nowadays she feels only a bitter resentment when she thinks back to those memories, knowing his love for his children only went so far. Whenever he is home they only argue, though she tries to stay somewhere else for his short visits. [div class=tag]mother.[/div] her mother meant a lot to her, even if Annaliese was closer to her father. whenever Annaliese was feeling down her mother was quick to take her to get a treat of some sort, be it clothes or desserts. her mother often would scold her for running somewhere to fast or being too hyper "for her own good". [div class=tag]older sister.[/div] tbd. [div class=tag]younger sister.[/div] tbd. [div class=tag]friends.[/div] information here [/div][/div] [div class=column][div class=images style="background: var(--image-14); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-15); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-16); background-size: cover; background-position: center;"][/div][/div][/div] [div class="tab tab1" style="left: 12px; bottom: -30px;"][/div] [div class="tab tab2" style="left: 85px; bottom: -30px;"][/div] [div class="tab tab3" style="left: 158px; bottom: -30px;"][/div] [div class="tab tab4" style="left: 231px; bottom: -30px;"][/div] [div class="tab tab5" style="left: 304px; bottom: -30px;"][/div] [div class="tab tab6" style="left: 377px; bottom: -30px;"][/div] [/div][/div][/div] [class=container] width: 450px; height: 450px; margin: auto; cursor: url(https://66.media.tumblr.com/232c090ebdd37ae4bc17adb54e1e0344/tumblr_inline_ol4nwhvSwg1uxxza6_75sq.png), auto!important; [/class] [class=border] position: absolute; width: 450px; height: 450px; border: 1px solid #ccc; outline: 1px solid #fafafa; background: #f1f1f1; margin: auto; overflow: hidden; [/class] [class=charactername] position: absolute; width: 450px; top: 75px; right: 0; text-align: center; font-size: 30px; text-transform: uppercase; color: var(--accent-2); font-weight: 900; text-align: center; transition: ease 1s; white-space: nowrap; transition-delay: 1s; [/class] [class=icon] width: 150px; height: 150px; background: var(--image-1); background-size: cover; background-position: center; border-radius: 100%; position: absolute; left: 145px; top: 145px; z-index: 2; border: 5px solid var(--accent-1); transform: rotateY(0deg); transition: ease 1s; cursor: url(https://66.media.tumblr.com/6fb38fc5e97353c67e3fc3a2e2b29bf9/tumblr_inline_ol4nwisGdu1uxxza6_75sq.png), auto!important; [/class] [class=role] position: absolute; bottom: 90px; width: 450px; height: 10px; text-align: center; color: var(--accent-2); font-size: 11px; line-height: 10px; transition: ease 1s; transition-delay: 1s; text-transform: uppercase; [/class] [class=charname] font-size: 15px; top: 34px; right: 10px; width: 170px; transition-delay: 0s; [/class] [class=roledown] bottom: -20px; transition-delay: 0s; [/class] [class=sideword] position: absolute; width: 170px; left: -170px; top: 34px; font: 15px; text-transform: uppercase; color: var(--accent-2); font-weight: 900; text-align: center; transition: ease 1s; box-sizing: border-box; padding-right: 0px; transition-delay: 1s; [/class] [class=swordin] left: 10px; transition-delay: 0s; [/class] [class=spin] top: 15px; left: 190px; width: 60px; height: 60px; transform: rotateY(360deg); transition-delay: 1s; border-width: 2px; [/class] [class=tab] position: absolute; background: var(--accent-1); width: 61px; height: 30px; border-radius: 3px; display: inline-block; transition: ease 0.5s; line-height: 30px; text-align: center; font-size: 12px; color: var(--accent-3); cursor: url(https://66.media.tumblr.com/6fb38fc5e97353c67e3fc3a2e2b29bf9/tumblr_inline_ol4nwisGdu1uxxza6_75sq.png), auto!important; [/class] [class=up] margin-bottom: 40px; transition: ease 0.5s; [/class] [class=stab1] transition-delay: 2.2s; [/class] [class=stab2] transition-delay: 2.4s; [/class] [class=stab3] transition-delay: 2.6s; [/class] [class=stab4] transition-delay: 2.8s; [/class] [class=stab5] transition-delay: 3s; [/class] [class=stab6] transition-delay: 3.2s; [/class] [class=tabContents] position: absolute; top: 85px; left: 20px; height: 320px; width: 410px; transition: all .5s; opacity: 0; [/class] [class=fadein] opacity: 1; z-index: 1; transition: all 1.5s; transition-delay: 3.6s; [/class] [class=column] height: 320px; width: 96px; display: flex; justify-content: space-evenly; position: absolute; right: 0; flex-direction: column; [/class] [class=images] height: 92px; width: 92px; border: 2px solid var(--accent-2); [/class] [class=images2] height: 92px; width: 92px; border: 2px solid var(--accent-1); [/class] [class=textbox] position: absolute; left: 0; top: 7px; width: 315px; height: 305px; overflow: hidden; font-size: 12px; white-space: pre-line; line-height: 130%; text-transform: lowercase; [/class] [class=scroll] width: 100%; height: 100%; overflow-y: scroll; padding-right: 17px; color: var(--accent-3); [/class] [class=tag] text-transform: uppercase; display: inline; font-size: 12px; letter-spacing: 1px; text-align: left; font-weight: 600; color: var(--accent-1); [/class] [class name=tab state=hover] background: var(--accent-3); color: var(--accent-1); transition: ease .5s; [/class] [class=chosen] background: var(--accent-3); color: var(--accent-1); transition: ease .5s; [/class] [class=chosen1] background: var(--accent-3); color: var(--accent-1); transition: ease .5s; transition-delay: 2.2s; [/class] [class=show] opacity: 1; transition: all 1s; z-index: 1; [/class] [class=none] pointer-events: none; [/class] [script class=tab on=mouseenter] removeClass stab1 tab1 removeClass stab2 tab2 removeClass stab3 tab3 removeClass stab4 tab4 removeClass stab5 tab5 removeClass stab6 tab6 [/script] [script class=icon on=click] addClass charname charactername addClass roledown role addClass swordin sideword addClass spin icon addClass up tab addClass stab1 tab1 addClass stab2 tab2 addClass stab3 tab3 addClass stab4 tab4 addClass stab5 tab5 addClass stab6 tab6 addClass fadein tabContents1 addClass chosen1 tab1 addClass none icon [/script] [script class=tab1 on=click] addClass show tabContents1 addClass chosen tab1 removeClass show tabContents2 removeClass show tabContents3 removeClass show tabContents4 removeClass show tabContents5 removeClass fadein tabContents1 removeClass chosen tab2 removeClass chosen tab3 removeClass chosen tab4 removeClass chosen tab5 removeClass chosen1 tab1 [/script] [script class=tab2 on=click] addClass show tabContents2 addClass chosen tab2 removeClass show tabContents1 removeClass show tabContents3 removeClass show tabContents4 removeClass show tabContents5 removeClass fadein tabContents1 removeClass chosen tab1 removeClass chosen tab3 removeClass chosen tab4 removeClass chosen tab5 removeClass chosen1 tab1 [/script] [script class=tab3 on=click] addClass show tabContents3 addClass chosen tab3 removeClass show tabContents1 removeClass show tabContents2 removeClass show tabContents4 removeClass show tabContents5 removeClass fadein tabContents1 removeClass chosen tab1 removeClass chosen tab2 removeClass chosen tab4 removeClass chosen tab5 removeClass chosen1 tab1 [/script] [script class=tab4 on=click] addClass show tabContents4 addClass chosen tab4 removeClass show tabContents1 removeClass show tabContents2 removeClass show tabContents3 removeClass show tabContents5 removeClass fadein tabContents1 removeClass chosen tab1 removeClass chosen tab2 removeClass chosen tab3 removeClass chosen tab5 removeClass chosen1 tab1 [/script] [script class=tab5 on=click] addClass show tabContents5 addClass chosen tab5 removeClass show tabContents1 removeClass show tabContents2 removeClass show tabContents3 removeClass show tabContents4 removeClass fadein tabContents1 removeClass chosen tab1 removeClass chosen tab2 removeClass chosen tab3 removeClass chosen tab4 removeClass chosen1 tab1 [/script] [script class=tab6 on=click] removeClass charname charactername removeClass roledown role removeClass swordin sideword removeClass spin icon removeClass up tab removeClass fadein tabContents removeClass show tabContents removeClass chosen1 tab1 removeClass chosen tab removeClass none icon [/script]
 
Last edited:
[class=container] --accent-1: #027576; --accent-2: #07A7A9; --accent-3: #333; --image-1: url(https://i.pinimg.com/564x/9a/7f/3c/9a7f3c4e19fa6b59802bd22120e89e96.jpg); --image-2: url(https://i.pinimg.com/564x/87/b3/38/87b338eab11b9eecb2769d62548b043f.jpg); --image-3: url(https://i.pinimg.com/564x/78/ca/0c/78ca0ce82871d8e8d71e1e17f6afde97.jpg); --image-4: url(https://i.pinimg.com/564x/c6/46/a0/c646a059340593d6d71157f847ba82b9.jpg); --image-5: url(https://i.pinimg.com/564x/1e/a5/54/1ea554d17b7439c10a095b51673ac7ea.jpg); --image-6: url(https://i.pinimg.com/564x/10/ab/b4/10abb4ee00a7a9f39c8039d8029f915e.jpg); --image-7: url(https://i.pinimg.com/564x/29/b5/56/29b5568b1d9a9e8155c736194e6a5469.jpg); --image-8: url(https://i.pinimg.com/564x/1e/80/00/1e8000419e2eca34255067169edc3bc7.jpg); --image-9: url(https://i.pinimg.com/564x/8f/c6/3e/8fc63e4003771d4905a21e5ea5725fdc.jpg); --image-10: url(https://i.pinimg.com/564x/f7/2a/39/f72a395bbfff9c4143352d38308d7792.jpg); --image-11: url(https://i.pinimg.com/564x/bc/9d/62/bc9d62416a083f469c87250e4f325ac9.jpg); --image-12: url(https://i.pinimg.com/564x/96/46/9e/96469e5c1e9dd38611acb2dbf4b53906.jpg); --image-13: url(https://i.pinimg.com/564x/3c/c3/d0/3cc3d08be946c8d05c6b32b3c07df5e5.jpg); --image-14: url(https://i.pinimg.com/564x/9a/d6/fd/9ad6fd43f9b13b281ac0d54f699a636b.jpg); --image-15: url(https://i.pinimg.com/564x/6a/53/2a/6a532a0ece48fb5b2a1dffcd189aa862.jpg); --image-16: url(https://i.pinimg.com/564x/42/6d/d7/426dd796f83b0b92918c93b9e4c6b2a0.jpg); [/class] [div class=credit][/div][div class=credit2 style="display: none;"]code + design by constellation constellation [/div] [class=credit]position: absolute; top: 0px; left: 0px; font-size: 15px; color: #b2e0e0; transition: 1s;[/class] [class=credit2]position: absolute; z-index: 2; top: 5px; left: 15px; max-width: 160px; margin: 15px; font-size: 10px; letter-spacing: 3px; text-align: center; font-weight: 500; text-transform: lowercase; padding: 25px 30px; color: #333; border: 1px solid #e2e2e2; background: white;[/class] [class name="credit" state="hover"]cursor: url(https://66.media.tumblr.com/6fb38fc5e97353c67e3fc3a2e2b29bf9/tumblr_inline_ol4nwisGdu1uxxza6_75sq.png), auto!important; color: #A0C9C9; transitions: 1s;[/class] [script class=credit on=mouseenter]fadeIn 1000 credit2[/script][script class=credit on=mouseleave]fadeOut 1000 credit2[/script]
[div class=container][div class=border][div class=charactername]allegra de leon
[div class=icon][/div] [div class=role]the obsessive one[/div] [div class=sideword]the obsessive one[/div] [div class="tabContents tabContents1"][div class=textbox][div class=scroll][div class=tag]full name.[/div]
allegra luna de leon​
[div class=tag]nicknames.[/div]
al/ally/legra (she is not fond of nicknames, though)​
[div class=tag]age.[/div]
seventeen​
[div class=tag]birthdate.[/div]
september 16th​
[div class=tag]gender[/div]
female​
[div class=tag]sexuality.[/div]
heterosexual​
[div class=tag]relationship status.[/div]
ha! single.​
[div class=tag]face claim.[/div]
kiernan shipka​
[div class=tag]theme songs.[/div]
[/div][/div] [div class=column][div class=images style="background: var(--image-2); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-3); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-4); background-size: cover; background-position: center;"][/div][/div][/div] [div class="tabContents tabContents2"][div class=textbox][div class=scroll][div class=tag]eyes.[/div]
hazel​
[div class=tag]hair.[/div]
dyed blonde (naturally brown)
[div class=tag]height.[/div]
5'2​
[div class=tag]body build.[/div]
petite​
[div class=tag]distinguishing marks.[/div]
no noticeable marks​
[div class=tag]attire.[/div]
allegra isn't picky when it comes to clothes. if she likes it, she'll wear it. she doesn't care about brands, her wardrobe is a mix of designer items, regular brands, and vintage finds. style board
[/div][/div] [div class=column][div class=images style="background: var(--image-5); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-6); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-7); background-size: cover; background-position: center;"][/div][/div][/div] [div class="tabContents tabContents3"][div class=textbox][div class=scroll][div class=tag]enneagram.[/div]
the helper​
[div class=tag]positive traits.[/div]
⁎kind ⁎empathetic ⁎discreet ⁎intelligent ⁎hard-working ⁎loyal ⁎accepting ⁎organized ⁎easy-going ⁎fair​
[div class=tag]negative traits.[/div]
⁎shy ⁎obsessive ⁎naive ⁎sensitive ⁎passive ⁎nosy ⁎moody ⁎impatient​
[div class=tag]love language.[/div]
physical touch​
[div class=tag]greatest fear.[/div]
being completely alone in life​
[div class=tag]priorities, goals and ambitions.[/div]
most of all, she wants to be a doctor. she isn't set on a specialty (she's saving that for med school). otherwise, she wants to be happy, have a healthy relationship, and to help people.​
[div class=tag]likes.[/div]
⁎her bby girl dog, gouda ⁎books ⁎horror movies ⁎old movies ⁎candid photos ⁎learning about the medical field ⁎driving (her car) ⁎fresh fruit ⁎vintage things ⁎cuddling​
[div class=tag]dislikes.[/div]
⁎being involved in drama ⁎being ignored ⁎hard liquor ⁎mushrooms ⁎fast food ⁎judgement ⁎being underestimated ⁎when her loved ones are hurt ⁎injustice ⁎being bored​
[/div][/div] [div class=column][div class=images style="background: var(--image-8); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-9); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-10); background-size: cover; background-position: center;"][/div][/div][/div] [div class="tabContents tabContents4"][div class=textbox][div class=scroll][div class=tag]the backstory.[/div]
allegra was the third and final child of andre and gracie. she was a happy, albeit shy child. she was often glued to her mother's leg, trying to hide behind her when she was meeting new people. honestly, losing her mother was the most unexpected and unfathomable experience for allegra. she thought surgery was going to make her mother better, not cause her death. allegra was devastated. allegra never grew out of her shy, clingy phase. she was now terrified something was going to happen to the people she cared most about. her father never being around didn't help. she began to develop issues with attachment. she'd be afraid to let go of people, things, ideas, etc. for example, she slept with her baby blanket until she was fourteen. even though she knew she didn't need it and was even a little embarrassed by it. her confusion surrounding her mother's death began to clear up as she grew older and began to understand the risks associated with surgery and the recovery following. this interest in what had caused her mother's death sparked an interest in the medical field for allegra. she knew she wanted to be a doctor when she is older. that desire has not changed and continues to motivate her in school. an already bright girl, allegra takes her schoolwork seriously, maintaining impressive grades in order to put her on the right path for her career aspirations. she is a quiet and introspective girl and doesn't have many friends. however, it doesn't bother her. the medically insane is her best friend and she is fine with him and a few acquaintances. she isn't quite sure why, but people tend to say things in front of her she shouldn't be overhearing. maybe because she's quiet, maybe because they assume she doesn't have friends, she isn't sure. but she has overheard plenty of interesting things through her school years. eventually, she began to keep track of the drama she overhears, creating a google doc where she jots it all down and organizes it. she never spreads it, but just observes and records it. it's something she keeps to herself (for her own good). the only person who knows about it is the medically insane, but she doesn't let him read it. she doesn't want anyone to access it, especially with the intention of hurting someone else. for her it's just interesting, almost a hobby. some people journal... she does this. she wouldn't be honest with herself if she believed she wasn't a bit obsessive. from her interest in medicine to her crushes, she dives headfirst into everything. her attachment issues shine in this aspect of her life. no, she doesn't like dig through her crush's trash, create a shrine, or anything like that (basically nothing that would get her arrested or served with a restraining order). but, she does social media stalk them, finds excuses to be around them, and fantasizes romantically about the person she likes. she is too shy to ever really approach them or say how she feels. her ideas of romance come from what she reads in her books and sees in movies or on tv, so she is a bit naive in that aspect. in the end, she just wants someone to feel the same way about her that she feels for them.​
[/div][/div] [div class=column][div class=images style="background: var(--image-11); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-12); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-13); background-size: cover; background-position: center;"][/div][/div][/div] [div class="tabContents tabContents5"][div class=textbox][div class=scroll][div class=tag]andre de leon // father.[/div]
allegra's relationship with her father is confusing to say the least. she loves her dad and is quite attached, as she is with the rest of her family. however, underneath that, there is deep rooted resentment for never being around and shoving his responsibilities onto her older sisters, especially gianna. this mix of emotions regarding her father lead to intense mood swings towards him. one minute she has an attitude towards him and the next she is as sweet as pie. while it may be confusing to others, it is most confusing to allegra. you're supposed to love your family and she is deeply afraid of losing him like her mother, but the anger towards him bubbles over and she can't quite make sense of it all.​
[div class=tag]gracie ricci // mother.[/div]
allegra was little when she lost her mother. she was the baby and she was a shy kid, so she was often glued to her mother. allegra looked up to her mother and was quite close to her. she really didn't have the same pressures gianna had, so there wasn't the same tension. allegra was definitely crushed when she lost her mother, but she was young enough where she didn't fully understand. sure, she knew what death was and that she wouldn't see her mama anymore, but she couldn't understand why she died. she thought she was supposed to be getting better, so when she didn't recover it left her with a lot of questions and confusion that wouldn't be cleared up until she got older. to this day, she still thinks of her mother the same as she did when she was young. she even still refers to her as "mama" because that relationship wasn't able to mature like all of her other ones.​
[div class=tag]gianna // oldest sister.[/div]
there isn't anyone in the world who allegra loves more than her sisters. though they have their moments (as sisters do), allegra trusts nobody more than gianna. as she grew older, she realized how much her sister sacrificed for her and their other sister. gianna is kind of her hero. allegra would do anything for her.​
[div class=tag]the rebellious one // older sister.[/div]
tbd with plotting​
[/div][/div] [div class=column][div class=images style="background: var(--image-14); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-15); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-16); background-size: cover; background-position: center;"][/div][/div][/div] [div class="tab tab1" style="left: 12px; bottom: -30px;"][/div] [div class="tab tab2" style="left: 85px; bottom: -30px;"][/div] [div class="tab tab3" style="left: 158px; bottom: -30px;"][/div] [div class="tab tab4" style="left: 231px; bottom: -30px;"][/div] [div class="tab tab5" style="left: 304px; bottom: -30px;"][/div] [div class="tab tab6" style="left: 377px; bottom: -30px;"][/div] [/div][/div][/div] [class=container] width: 450px; height: 450px; margin: auto; cursor: url(https://66.media.tumblr.com/232c090ebdd37ae4bc17adb54e1e0344/tumblr_inline_ol4nwhvSwg1uxxza6_75sq.png), auto!important; [/class] [class=border] position: absolute; width: 450px; height: 450px; border: 1px solid #ccc; outline: 1px solid #fafafa; background: #f1f1f1; margin: auto; overflow: hidden; [/class] [class=charactername] position: absolute; width: 450px; top: 75px; right: 0; text-align: center; font-size: 30px; text-transform: uppercase; color: var(--accent-2); font-weight: 900; text-align: center; transition: ease 1s; white-space: nowrap; transition-delay: 1s; [/class] [class=icon] width: 150px; height: 150px; background: var(--image-1); background-size: cover; background-position: center; border-radius: 100%; position: absolute; left: 145px; top: 145px; z-index: 2; border: 5px solid var(--accent-1); transform: rotateY(0deg); transition: ease 1s; cursor: url(https://66.media.tumblr.com/6fb38fc5e97353c67e3fc3a2e2b29bf9/tumblr_inline_ol4nwisGdu1uxxza6_75sq.png), auto!important; [/class] [class=role] position: absolute; bottom: 90px; width: 450px; height: 10px; text-align: center; color: var(--accent-2); font-size: 11px; line-height: 10px; transition: ease 1s; transition-delay: 1s; text-transform: uppercase; [/class] [class=charname] font-size: 15px; top: 34px; right: 10px; width: 170px; transition-delay: 0s; [/class] [class=roledown] bottom: -20px; transition-delay: 0s; [/class] [class=sideword] position: absolute; width: 170px; left: -170px; top: 34px; font: 15px; text-transform: uppercase; color: var(--accent-2); font-weight: 900; text-align: center; transition: ease 1s; box-sizing: border-box; padding-right: 0px; transition-delay: 1s; [/class] [class=swordin] left: 10px; transition-delay: 0s; [/class] [class=spin] top: 15px; left: 190px; width: 60px; height: 60px; transform: rotateY(360deg); transition-delay: 1s; border-width: 2px; [/class] [class=tab] position: absolute; background: var(--accent-1); width: 61px; height: 30px; border-radius: 3px; display: inline-block; transition: ease 0.5s; line-height: 30px; text-align: center; font-size: 12px; color: var(--accent-3); cursor: url(https://66.media.tumblr.com/6fb38fc5e97353c67e3fc3a2e2b29bf9/tumblr_inline_ol4nwisGdu1uxxza6_75sq.png), auto!important; [/class] [class=up] margin-bottom: 40px; transition: ease 0.5s; [/class] [class=stab1] transition-delay: 2.2s; [/class] [class=stab2] transition-delay: 2.4s; [/class] [class=stab3] transition-delay: 2.6s; [/class] [class=stab4] transition-delay: 2.8s; [/class] [class=stab5] transition-delay: 3s; [/class] [class=stab6] transition-delay: 3.2s; [/class] [class=tabContents] position: absolute; top: 85px; left: 20px; height: 320px; width: 410px; transition: all .5s; opacity: 0; [/class] [class=fadein] opacity: 1; z-index: 1; transition: all 1.5s; transition-delay: 3.6s; [/class] [class=column] height: 320px; width: 96px; display: flex; justify-content: space-evenly; position: absolute; right: 0; flex-direction: column; [/class] [class=images] height: 92px; width: 92px; border: 2px solid var(--accent-2); [/class] [class=images2] height: 92px; width: 92px; border: 2px solid var(--accent-1); [/class] [class=textbox] position: absolute; left: 0; top: 7px; width: 315px; height: 305px; overflow: hidden; font-size: 12px; white-space: pre-line; line-height: 130%; text-transform: lowercase; [/class] [class=scroll] width: 100%; height: 100%; overflow-y: scroll; padding-right: 17px; color: var(--accent-3); [/class] [class=tag] text-transform: uppercase; display: inline; font-size: 12px; letter-spacing: 1px; text-align: left; font-weight: 600; color: var(--accent-1); [/class] [class name=tab state=hover] background: var(--accent-3); color: var(--accent-1); transition: ease .5s; [/class] [class=chosen] background: var(--accent-3); color: var(--accent-1); transition: ease .5s; [/class] [class=chosen1] background: var(--accent-3); color: var(--accent-1); transition: ease .5s; transition-delay: 2.2s; [/class] [class=show] opacity: 1; transition: all 1s; z-index: 1; [/class] [class=none] pointer-events: none; [/class] [script class=tab on=mouseenter] removeClass stab1 tab1 removeClass stab2 tab2 removeClass stab3 tab3 removeClass stab4 tab4 removeClass stab5 tab5 removeClass stab6 tab6 [/script] [script class=icon on=click] addClass charname charactername addClass roledown role addClass swordin sideword addClass spin icon addClass up tab addClass stab1 tab1 addClass stab2 tab2 addClass stab3 tab3 addClass stab4 tab4 addClass stab5 tab5 addClass stab6 tab6 addClass fadein tabContents1 addClass chosen1 tab1 addClass none icon [/script] [script class=tab1 on=click] addClass show tabContents1 addClass chosen tab1 removeClass show tabContents2 removeClass show tabContents3 removeClass show tabContents4 removeClass show tabContents5 removeClass fadein tabContents1 removeClass chosen tab2 removeClass chosen tab3 removeClass chosen tab4 removeClass chosen tab5 removeClass chosen1 tab1 [/script] [script class=tab2 on=click] addClass show tabContents2 addClass chosen tab2 removeClass show tabContents1 removeClass show tabContents3 removeClass show tabContents4 removeClass show tabContents5 removeClass fadein tabContents1 removeClass chosen tab1 removeClass chosen tab3 removeClass chosen tab4 removeClass chosen tab5 removeClass chosen1 tab1 [/script] [script class=tab3 on=click] addClass show tabContents3 addClass chosen tab3 removeClass show tabContents1 removeClass show tabContents2 removeClass show tabContents4 removeClass show tabContents5 removeClass fadein tabContents1 removeClass chosen tab1 removeClass chosen tab2 removeClass chosen tab4 removeClass chosen tab5 removeClass chosen1 tab1 [/script] [script class=tab4 on=click] addClass show tabContents4 addClass chosen tab4 removeClass show tabContents1 removeClass show tabContents2 removeClass show tabContents3 removeClass show tabContents5 removeClass fadein tabContents1 removeClass chosen tab1 removeClass chosen tab2 removeClass chosen tab3 removeClass chosen tab5 removeClass chosen1 tab1 [/script] [script class=tab5 on=click] addClass show tabContents5 addClass chosen tab5 removeClass show tabContents1 removeClass show tabContents2 removeClass show tabContents3 removeClass show tabContents4 removeClass fadein tabContents1 removeClass chosen tab1 removeClass chosen tab2 removeClass chosen tab3 removeClass chosen tab4 removeClass chosen1 tab1 [/script] [script class=tab6 on=click] removeClass charname charactername removeClass roledown role removeClass swordin sideword removeClass spin icon removeClass up tab removeClass fadein tabContents removeClass show tabContents removeClass chosen1 tab1 removeClass chosen tab removeClass none icon [/script]
 
Last edited:
[class=container] --accent-1: #f7c48d; --accent-2: #f7c48d; --accent-3: #333; --image-1: url(https://i.imgur.com/w8fDEoJ.gif); --image-2: url(https://theboombox.com/files/2016/02/Drake_Grant-Lamos-IV.jpg); --image-3: url(https://thefashiontag.com/wp-content/uploads/2015/10/drake-sweater-hotline-bling-14.gif); --image-4: url(http://cdn01.cdn.justjared.com/wp-content/uploads/headlines/2018/05/drake-upset.jpg); --image-5: url(https://imageproxy.themaven.net/https%3A%2F%2Fs3-us-west-2.amazonaws.com%2Fmaven-user-photos%2Fallhiphop%2Fmusic%2Fu28YIMIOqEO0Dv-AwdMODw%2FcW23NWjMkEi5WMsxtxlvRw); --image-6: url(https://www.usmagazine.com/wp-content/uploads/drake-bad-blood-aa7961e6-517a-478a-b2f4-a14d6e18c7af.gif); --image-7: url(https://i.imgur.com/J89bEZR.gif); --image-8: url(https://upload.wikimedia.org/wikipedia/commons/thumb/0/09/Jorja_Smith_and_Drake_at_the_Velvet_Underground_-_2017_%2835960868694%29_%28cropped%29.jpg/220px-Jorja_Smith_and_Drake_at_the_Velvet_Underground_-_2017_%2835960868694%29_%28cropped%29.jpg); --image-9: url(https://66.media.tumblr.com/tumblr_m04p8mLhCm1qd1oovo1_500.gif); --image-10: url(http://1.bp.blogspot.com/-4x2W4kR9Ki0/TyBTKJHunBI/AAAAAAAAARs/t1FaOeJgk1Q/s1600/IMG_4309resize.jpg); --image-11: url(https://static.vibe.com/files/2018/05/drake-2018-march-4-billboard-1548-1527397119-188x188.jpg); --image-12: url(https://www.overthinkingit.com/wp-content/uploads/2016/01/doasisay.gif); --image-13: url(https://dlisted.com/wp-content/uploads/2019/04/drakeoutfit2019.jpg); --image-14: url(https://www.maxim.com/.image/c_limit%2Ccs_srgb%2Cfl_progressive%2Cq_auto:good%2Cw_700/MTY0MDYxMzEyMDE0MzYyNDIz/gettyimages-1097588788.jpg); --image-15: url(https://cdn.firstwefeast.com/assets/2014/04/esset.gif); --image-16: url(https://urbanislandz.com/wp-content/uploads/2018/06/drake-2018.jpg); [/class] [div class=credit][/div][div class=credit2 style="display: none;"]code + design by constellation constellation [/div] [class=credit]position: absolute; top: 0px; left: 0px; font-size: 15px; color: #f7c48d; transition: 1s;[/class] [class=credit2]position: absolute; z-index: 2; top: 5px; left: 15px; max-width: 160px; margin: 15px; font-size: 10px; letter-spacing: 3px; text-align: center; font-weight: 500; text-transform: lowercase; padding: 25px 30px; color: #333; border: 1px solid #e2e2e2; background: white;[/class] [class name="credit" state="hover"]cursor: url(https://66.media.tumblr.com/6fb38fc5e97353c67e3fc3a2e2b29bf9/tumblr_inline_ol4nwisGdu1uxxza6_75sq.png), auto!important; color: #A0C9C9; transitions: 1s;[/class] [script class=credit on=mouseenter]fadeIn 1000 credit2[/script][script class=credit on=mouseleave]fadeOut 1000 credit2[/script]
[div class=container][div class=border][div class=charactername]Isaías Hart
[div class=icon][/div] [div class=role]The Player[/div] [div class=sideword]The Player[/div] [div class="tabContents tabContents1"][div class=textbox][div class=scroll][div class=tag]full name.[/div] Isaías Valentino Hart [div class=tag]nicknames.[/div] Tino (Preferred) Izzy (Dislikes) [div class=tag]age.[/div] 25 [div class=tag]birthdate.[/div] September 23th ♍ [div class=tag]gender[/div] Male [div class=tag]sexuality.[/div] Heterosexual [div class=tag]relationship status.[/div] Kinda Single...Kinda not...who is asking? [div class=tag]Face Claim[/div] Drake [div class=tag]Theme Songs[/div] Skywalker by Miguel Kings Dead by Jay Rock, Future, Kendrick Lamar, James Blake Ball for Me by Post Malone (feat Nicki Minaj) [/div][/div] [div class=column][div class=images style="background: var(--image-2); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-3); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-4); background-size: cover; background-position: center;"][/div][/div][/div] [div class="tabContents tabContents2"][div class=textbox][div class=scroll][div class=tag]eyes.[/div] Brown [div class=tag]hair.[/div] Black [div class=tag]height.[/div] 6'1 (160.02 cm) [div class=tag]body build.[/div] Toned [div class=tag]distinguishing marks.[/div] Scars: none of importance. Piercings: None Tattoo None [div class=tag]attire.[/div] With his EXAMPLES 1 | 2 | 3 | 4| 5 [/div][/div] [div class=column][div class=images style="background: var(--image-5); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-6); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-7); background-size: cover; background-position: center;"][/div][/div][/div] [div class="tabContents tabContents3"][div class=textbox][div class=scroll][div class=tag]enneagram.[/div] The Achiever (Success Oriented. Pragmatic. Adaptable. Excelling. Driven. Image Conscious.) [div class=tag]positive traits.[/div] ⁎Ambitious ⁎Gregarious ⁎Outgoing ⁎Perceptive ⁎Meticulous ⁎Philanthropic ⁎Witty ⁎Visionary ⁎Charming ⁎Hard Working [div class=tag]negative traits.[/div] ⁎Fickle ⁎Manipulative ⁎Promiscuous ⁎Avaricious ⁎Evasive ⁎Insincere ⁎Wily ⁎Self Centered ⁎Stubborn [div class=tag]love language.[/div] Physical Touch [div class=tag]greatest fear.[/div] ➤Losing his money/status ➤Falling in Love ➤Being Forgotten ➤Dying Young [div class=tag]priorities, goals and ambitions.[/div] ➤Become a successful politician ➤Gain even greater influence ➤Satiate his boredom [div class=tag]likes.[/div] Parties▿Neon lights▿Sports▿Cars ▿Night▿Fast Food▿Jewlery ▿Social Gatherings▿Amusement Parks▿Money ▿Women▿Power▿Horror Movies ▿Gambling▿Writing▿Fashion [div class=tag]dislikes.[/div] Clingy people▿Laziness▿Hangovers▿Losing ▿Being Embarrassed▿Anyone who would hit a woman ▿Being drunk▿Labels▿Being placed in a box▿Spiders ▿Surprises▿Politics [/div][/div] [div class=column][div class=images style="background: var(--image-8); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-9); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-10); background-size: cover; background-position: center;"][/div][/div][/div] [div class="tabContents tabContents4"][div class=textbox][div class=scroll][div class=tag]the backstory.[/div] Tino was never around for the hard times. The real ones, not the difficulties that come along with being rich and powerful, but the problems that arise when all you have to your name is faith, a dream, and an insane drive. By the time Tino was conscious, his family was already taking their foothold in Ravenpoint. Of course, since he was cursed with being the first born he was often in close proximity to his parents workplace. TO that end he was often the target of their ire whenever he screwed up. Failure was not an option in any area of his life, and he often learned that the hard way. Although, others wouldn't call it much of childhood, Tino was happy he was allowed to spend time with his family, even if it was usually work related. Nevertheless, there were many times he could not be with his parents which most likely lead to his independence now. Although he learned many things such as leadership, philanthropy, business acumen, and ambition, he also saw the shadow behind the light. He saw false promises, deception, cut throat decisions, and manipulation. He saw his parents come close to blows...sometimes more than close, only for them to be kissing, dancing and laughing an hour later at a formal ball. On the road to success did love, desire, and dreams matter at all? Life was like a game of chess, and he was beginning to wonder if any of it was real. As he grew older and wiser he was given more responsibility. He would have input on major decisions, given more freedom, and eventually would even act as a spokesperson for his family at times. Sure there was pressure, and a sense of responsibility, especially since his only brother was pretty much out of the picture in regards to inheritance, but Tino did not mind the burden of these expectations. He realized that there were people who would literally kill to be in the position he was in right now. As the oldest and only capable son, he had a duty to be successful. "Work so hard that it seems easy." It was his fathers favorite phrase, and Tino embraced it to the fullest, graduating college, conducting interviews, hosting parties, attending high profile meetings, all while having the time to tend to his favorite groupies and past times. One could only wonder if he ever got enough sleep. Somewhere along the lin the game became to easy. Money had lost its shine; now he juggled with influence. A pretty face was just a pretty face, and a fancy building was just another container. The world was becoming grey. The person who was once content to simply follow the safe path that had been paved and decided for him was deteriorating day by day. Doing things the conventional way was no longer enough, and he wanted to forge his own path even if he had to step over his own family to do it. Unknowingly, he had begun to take greater risks whether it was business, relationships, gambling, or illegal drugs. Whatever he could do to find that rush in this small town, he would do it, but nothing he does ever seems to be enough. [/div][/div] [div class=column][div class=images style="background: var(--image-11); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-12); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-13); background-size: cover; background-position: center;"][/div][/div][/div] [div class="tabContents tabContents5"][div class=textbox][div class=scroll][div class=tag]Travis Hart || father || Living[/div] His relationship with his father could only be described as businesslike. He has great respect for him, and doesn't display any noticeable resentment. Tino understands his position and the sacrifices that come along with it. [div class=tag]Marina Hart || mother ||Living[/div] He has a closer relationship with his mother as opposed to his father since she was easier on him; moreover, she rarely forced her occupation onto him. Nevertheless, it could be better. [div class=tag]Brother|| Living[/div] TBD [/div][/div] [div class=column][div class=images style="background: var(--image-14); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-15); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-16); background-size: cover; background-position: center;"][/div][/div][/div] [div class="tab tab1" style="left: 12px; bottom: -30px;"][/div] [div class="tab tab2" style="left: 85px; bottom: -30px;"][/div] [div class="tab tab3" style="left: 158px; bottom: -30px;"][/div] [div class="tab tab4" style="left: 231px; bottom: -30px;"][/div] [div class="tab tab5" style="left: 304px; bottom: -30px;"][/div] [div class="tab tab6" style="left: 377px; bottom: -30px;"][/div] [/div][/div][/div] [class=container] width: 450px; height: 450px; margin: auto; cursor: url(https://66.media.tumblr.com/232c090ebdd37ae4bc17adb54e1e0344/tumblr_inline_ol4nwhvSwg1uxxza6_75sq.png), auto!important; [/class] [class=border] position: absolute; width: 450px; height: 450px; border: 1px solid #ccc; outline: 1px solid #ddb2e0; background: #f1f1f1; margin: auto; overflow: hidden; [/class] [class=charactername] position: absolute; width: 450px; top: 75px; right: 0; text-align: center; font-size: 30px; text-transform: uppercase; color: var(--accent-2); font-weight: 900; text-align: center; transition: ease 1s; white-space: nowrap; transition-delay: 1s; [/class] [class=icon] width: 150px; height: 150px; background: var(--image-1); background-size: cover; background-position: center; border-radius: 100%; position: absolute; left: 145px; top: 145px; z-index: 2; border: 5px solid var(--accent-1); transform: rotateY(0deg); transition: ease 1s; cursor: url(https://66.media.tumblr.com/6fb38fc5e97353c67e3fc3a2e2b29bf9/tumblr_inline_ol4nwisGdu1uxxza6_75sq.png), auto!important; [/class] [class=role] position: absolute; bottom: 90px; width: 450px; height: 10px; text-align: center; color: var(--accent-2); font-size: 11px; line-height: 10px; transition: ease 1s; transition-delay: 1s; text-transform: uppercase; [/class] [class=charname] font-size: 15px; top: 34px; right: 10px; width: 170px; transition-delay: 0s; [/class] [class=roledown] bottom: -20px; transition-delay: 0s; [/class] [class=sideword] position: absolute; width: 170px; left: -170px; top: 34px; font: 15px; text-transform: uppercase; color: var(--accent-2); font-weight: 900; text-align: center; transition: ease 1s; box-sizing: border-box; padding-right: 0px; transition-delay: 1s; [/class] [class=swordin] left: 10px; transition-delay: 0s; [/class] [class=spin] top: 15px; left: 190px; width: 60px; height: 60px; transform: rotateY(360deg); transition-delay: 1s; border-width: 2px; [/class] [class=tab] position: absolute; background: var(--accent-1); width: 61px; height: 30px; border-radius: 3px; display: inline-block; transition: ease 0.5s; line-height: 30px; text-align: center; font-size: 12px; color: var(--accent-3); cursor: url(https://66.media.tumblr.com/6fb38fc5e97353c67e3fc3a2e2b29bf9/tumblr_inline_ol4nwisGdu1uxxza6_75sq.png), auto!important; [/class] [class=up] margin-bottom: 40px; transition: ease 0.5s; [/class] [class=stab1] transition-delay: 2.2s; [/class] [class=stab2] transition-delay: 2.4s; [/class] [class=stab3] transition-delay: 2.6s; [/class] [class=stab4] transition-delay: 2.8s; [/class] [class=stab5] transition-delay: 3s; [/class] [class=stab6] transition-delay: 3.2s; [/class] [class=tabContents] position: absolute; top: 85px; left: 20px; height: 320px; width: 410px; transition: all .5s; opacity: 0; [/class] [class=fadein] opacity: 1; z-index: 1; transition: all 1.5s; transition-delay: 3.6s; [/class] [class=column] height: 320px; width: 96px; display: flex; justify-content: space-evenly; position: absolute; right: 0; flex-direction: column; [/class] [class=images] height: 92px; width: 92px; border: 2px solid var(--accent-2); [/class] [class=images2] height: 92px; width: 92px; border: 2px solid var(--accent-1); [/class] [class=textbox] position: absolute; left: 0; top: 7px; width: 315px; height: 305px; overflow: hidden; font-size: 12px; white-space: pre-line; line-height: 130%; text-transform: lowercase; [/class] [class=scroll] width: 100%; height: 100%; overflow-y: scroll; padding-right: 17px; color: var(--accent-3); [/class] [class=tag] text-transform: uppercase; display: inline; font-size: 12px; letter-spacing: 1px; text-align: left; font-weight: 600; color: var(--accent-1); [/class] [class name=tab state=hover] background: var(--accent-3); color: var(--accent-1); transition: ease .5s; [/class] [class=chosen] background: var(--accent-3); color: var(--accent-1); transition: ease .5s; [/class] [class=chosen1] background: var(--accent-3); color: var(--accent-1); transition: ease .5s; transition-delay: 2.2s; [/class] [class=show] opacity: 1; transition: all 1s; z-index: 1; [/class] [class=none] pointer-events: none; [/class] [script class=tab on=mouseenter] removeClass stab1 tab1 removeClass stab2 tab2 removeClass stab3 tab3 removeClass stab4 tab4 removeClass stab5 tab5 removeClass stab6 tab6 [/script] [script class=icon on=click] addClass charname charactername addClass roledown role addClass swordin sideword addClass spin icon addClass up tab addClass stab1 tab1 addClass stab2 tab2 addClass stab3 tab3 addClass stab4 tab4 addClass stab5 tab5 addClass stab6 tab6 addClass fadein tabContents1 addClass chosen1 tab1 addClass none icon [/script] [script class=tab1 on=click] addClass show tabContents1 addClass chosen tab1 removeClass show tabContents2 removeClass show tabContents3 removeClass show tabContents4 removeClass show tabContents5 removeClass fadein tabContents1 removeClass chosen tab2 removeClass chosen tab3 removeClass chosen tab4 removeClass chosen tab5 removeClass chosen1 tab1 [/script] [script class=tab2 on=click] addClass show tabContents2 addClass chosen tab2 removeClass show tabContents1 removeClass show tabContents3 removeClass show tabContents4 removeClass show tabContents5 removeClass fadein tabContents1 removeClass chosen tab1 removeClass chosen tab3 removeClass chosen tab4 removeClass chosen tab5 removeClass chosen1 tab1 [/script] [script class=tab3 on=click] addClass show tabContents3 addClass chosen tab3 removeClass show tabContents1 removeClass show tabContents2 removeClass show tabContents4 removeClass show tabContents5 removeClass fadein tabContents1 removeClass chosen tab1 removeClass chosen tab2 removeClass chosen tab4 removeClass chosen tab5 removeClass chosen1 tab1 [/script] [script class=tab4 on=click] addClass show tabContents4 addClass chosen tab4 removeClass show tabContents1 removeClass show tabContents2 removeClass show tabContents3 removeClass show tabContents5 removeClass fadein tabContents1 removeClass chosen tab1 removeClass chosen tab2 removeClass chosen tab3 removeClass chosen tab5 removeClass chosen1 tab1 [/script] [script class=tab5 on=click] addClass show tabContents5 addClass chosen tab5 removeClass show tabContents1 removeClass show tabContents2 removeClass show tabContents3 removeClass show tabContents4 removeClass fadein tabContents1 removeClass chosen tab1 removeClass chosen tab2 removeClass chosen tab3 removeClass chosen tab4 removeClass chosen1 tab1 [/script] [script class=tab6 on=click] removeClass charname charactername removeClass roledown role removeClass swordin sideword removeClass spin icon removeClass up tab removeClass fadein tabContents removeClass show tabContents removeClass chosen1 tab1 removeClass chosen tab removeClass none icon [/script]
 
Last edited:
[class=container] --accent-0: #F9C0CE; --accent-1: #FFC2D1; --accent-2: #FFC2D1; --accent-3: #333; --accent-4: #FFC2D1; --image-1: url(https://imgur.com/2iM9Kgl.png); --image-2: url(https://imgur.com/hhUc0xP.png); --image-3: url(https://imgur.com/Tk1JDZV.png); --image-4: url(https://imgur.com/ymfETX9.png); --image-5: url(https://imgur.com/EFwvHAb.png); --image-6: url(https://imgur.com/TxJ9XsJ.png); --image-7: url(https://imgur.com/tsjhbDP.png); --image-8: url(https://via.placeholder.com/92/000000/FFFFFF/?text=IMAGE 8); --image-9: url(https://via.placeholder.com/92/000000/FFFFFF/?text=IMAGE 9); --image-10: url(https://via.placeholder.com/92/000000/FFFFFF/?text=IMAGE 10); --image-11: url(https://via.placeholder.com/92/000000/FFFFFF/?text=IMAGE 11); --image-12: url(https://via.placeholder.com/92/000000/FFFFFF/?text=IMAGE 12); --image-13: url(https://via.placeholder.com/92/000000/FFFFFF/?text=IMAGE 13); --image-14: url(https://via.placeholder.com/92/000000/FFFFFF/?text=IMAGE 14); --image-15: url(https://via.placeholder.com/92/000000/FFFFFF/?text=IMAGE 15); --image-16: url(https://via.placeholder.com/92/000000/FFFFFF/?text=IMAGE 16); [/class] [div class=credit][/div][div class=credit2 style="display: none;"]code + design by constellation constellation [/div] [class=credit]position: absolute; top: 0px; left: 0px; font-size: 15px; color: #FFC2D1; transition: 1s;[/class] [class=credit2]position: absolute; z-index: 2; top: 5px; left: 15px; max-width: 160px; margin: 15px; font-size: 10px; letter-spacing: 3px; text-align: center; font-weight: 500; text-transform: lowercase; padding: 25px 30px; color: #333; border: 1px solid #e2e2e2; background: white;[/class] [class name="credit" state="hover"]cursor: url(https://66.media.tumblr.com/6fb38fc5e97353c67e3fc3a2e2b29bf9/tumblr_inline_ol4nwisGdu1uxxza6_75sq.png), auto!important; color: #A0C9C9; transitions: 1s;[/class] [script class=credit on=mouseenter]fadeIn 1000 credit2[/script][script class=credit on=mouseleave]fadeOut 1000 credit2[/script]
[div class=container][div class=border][div class=charactername]Samara Cambridge
[div class=icon][/div] [div class=role]The Hopeless Romantic[/div][div class=sideword]True Romance[/div] [div class="tabContents tabContents1"][div class=textbox][div class=scroll][div class=tag]full name.[/div] samara shae frances cambridge [div class=tag]nicknames.[/div] sam [div class=tag]age.[/div] 17 [div class=tag]birthdate.[/div] april 23rd [div class=tag]gender[/div] female [div class=tag]sexuality.[/div] heterosexual [div class=tag]relationship status.[/div] single [div class=tag]spoken languages.[/div] english & french [div class=tag]theme songs.[/div] uhhhh yes [/div][/div] [div class=column][div class=images style="background: var(--image-2); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-3); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-4); background-size: cover; background-position: center;"][/div][/div][/div] [div class="tabContents tabContents2"][div class=textbox][div class=scroll][div class=tag]eyes.[/div] dark brown [div class=tag]hair.[/div] thick, straight, and brown [div class=tag]height.[/div] 5'4" [div class=tag]body build.[/div] endomorph body type, and a banana/rectangle body shape [div class=tag]distinguishing marks.[/div] a small, dark birthmark in the center of her right cheek [div class=tag]attire.[/div] information here [/div][/div] [div class=column][div class=images style="background: var(--image-5); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-6); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-7); background-size: cover; background-position: center;"][/div][/div][/div] [div class="tabContents tabContents3"][div class=textbox][div class=scroll][div class=tag]enneagram.[/div] information here [div class=tag]positive traits.[/div] information here [div class=tag]negative traits.[/div] information here [div class=tag]love language.[/div] information here [div class=tag]greatest fear.[/div] information here [div class=tag]priorities, goals and ambitions.[/div] information here [div class=tag]likes.[/div] information here [div class=tag]dislikes.[/div] information here [/div][/div] [div class=column][div class=images style="background: var(--image-8); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-9); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-10); background-size: cover; background-position: center;"][/div][/div][/div] [div class="tabContents tabContents4"][div class=textbox][div class=scroll][div class=tag]the backstory.[/div] There's a lot and a doc is more organized (if you turn on outline) so click here [/div][/div] [div class=column][div class=images style="background: var(--image-11); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-12); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-13); background-size: cover; background-position: center;"][/div][/div][/div] [div class="tabContents tabContents5"][div class=textbox][div class=scroll][div class=tag]FATHER || MICHEAL CAMBRIDGE[/div] do [div class=tag]MOTHER || SADIE SHAFFER[/div] you [div class=tag]BROTHER || THE BAD-BOY[/div] even [div class=tag]BROTHER || THE GOODIE-GOODIE[/div] skate, dude? [/div][/div] [div class=column][div class=images style="background: var(--image-14); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-15); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-16); background-size: cover; background-position: center;"][/div][/div][/div] [div class="tab tab1" style="left: 12px; bottom: -30px;"][/div] [div class="tab tab2" style="left: 85px; bottom: -30px;"][/div] [div class="tab tab3" style="left: 158px; bottom: -30px;"][/div] [div class="tab tab4" style="left: 231px; bottom: -30px;"][/div] [div class="tab tab5" style="left: 304px; bottom: -30px;"][/div] [div class="tab tab6" style="left: 377px; bottom: -30px;"][/div] [/div][/div][/div] [class=container] width: 450px; height: 450px; margin: auto; cursor: url(https://66.media.tumblr.com/232c090ebdd37ae4bc17adb54e1e0344/tumblr_inline_ol4nwhvSwg1uxxza6_75sq.png), auto!important; [/class] [class=border] position: absolute; width: 450px; height: 450px; border: 1px solid #FFC2D1; outline: 1px solid #FFC2D1; background: #F5F5F5; margin: auto; overflow: hidden; [/class] [class=charactername] position: absolute; width: 450px; top: 75px; right: 0; text-align: center; font-size: 30px; text-transform: uppercase; color: var(--accent-1); font-weight: 900; text-align: center; transition: ease 1s; white-space: nowrap; transition-delay: 1s; [/class] [class=icon] width: 150px; height: 150px; background: var(--image-1); background-size: cover; background-position: center; border-radius: 100%; position: absolute; left: 145px; top: 145px; z-index: 2; border: 5px solid var(--accent-4); transform: rotateY(0deg); transition: ease 1s; cursor: url(https://66.media.tumblr.com/6fb38fc5e97353c67e3fc3a2e2b29bf9/tumblr_inline_ol4nwisGdu1uxxza6_75sq.png), auto!important; [/class] [class=role] position: absolute; bottom: 90px; width: 450px; height: 10px; text-align: center; color: var(--accent-2); font-size: 11px; line-height: 10px; transition: ease 1s; transition-delay: 1s; text-transform: uppercase; [/class] [class=charname] font-size: 15px; top: 34px; right: 10px; width: 170px; transition-delay: 0s; [/class] [class=roledown] bottom: -20px; transition-delay: 0s; [/class] [class=sideword] position: absolute; width: 170px; left: -170px; top: 34px; font: 15px; text-transform: uppercase; color: var(--accent-1); font-weight: 900; text-align: center; transition: ease 1s; box-sizing: border-box; padding-right: 0px; transition-delay: 1s; [/class] [class=swordin] left: 10px; transition-delay: 0s; [/class] [class=spin] top: 15px; left: 190px; width: 60px; height: 60px; transform: rotateY(360deg); transition-delay: 1s; border-width: 2px; [/class] [class=tab] position: absolute; background: var(--accent-1); width: 61px; height: 30px; border-radius: 3px; border: .5px solid var(--accent-1); display: inline-block; transition: ease 0.5s; line-height: 30px; text-align: center; font-size: 12px; color: #f1f1f1; cursor: url(https://66.media.tumblr.com/6fb38fc5e97353c67e3fc3a2e2b29bf9/tumblr_inline_ol4nwisGdu1uxxza6_75sq.png), auto!important; [/class] [class=up] margin-bottom: 40px; transition: ease 0.5s; [/class] [class=stab1] transition-delay: 2.2s; [/class] [class=stab2] transition-delay: 2.4s; [/class] [class=stab3] transition-delay: 2.6s; [/class] [class=stab4] transition-delay: 2.8s; [/class] [class=stab5] transition-delay: 3s; [/class] [class=stab6] transition-delay: 3.2s; [/class] [class=tabContents] position: absolute; top: 85px; left: 20px; height: 320px; width: 410px; transition: all .5s; opacity: 0; [/class] [class=fadein] opacity: 1; z-index: 1; transition: all 1.5s; transition-delay: 3.6s; [/class] [class=column] height: 320px; width: 96px; display: flex; justify-content: space-evenly; position: absolute; right: 0; flex-direction: column; [/class] [class=images] height: 92px; width: 92px; border: 2px solid var(--accent-2); [/class] [class=images2] height: 92px; width: 92px; border: 2px solid var(--accent-2); [/class] [class=textbox] position: absolute; left: 0; top: 7px; width: 315px; height: 305px; overflow: hidden; font-size: 12px; white-space: pre-line; line-height: 130%; color: purple; [/class] [class=scroll] width: 100%; height: 100%; overflow-y: scroll; padding-right: 17px; color: #747474; [/class] [class=tag] display: inline; font-size: 12px; letter-spacing: 1px; text-align: left; font-weight: 600; color: var(--accent-0); [/class] [class name=tab state=hover] background: #F5F5F5; color: var(--accent-2); border: .5px solid var(--accent-1); transition: ease .5s; [/class] [class=chosen] background: #F5F5F5; border: .5px solid var(--accent-1); color: var(--accent-2); transition: ease .5s; [/class] [class=chosen1] background: #F5F5F5; border: .5px solid var(--accent-1); color: var(--accent-2); transition: ease .5s; transition-delay: 2.2s; [/class] [class=show] opacity: 1; transition: all 1s; z-index: 1; [/class] [class=none] pointer-events: none; [/class] [script class=tab on=mouseenter] removeClass stab1 tab1 removeClass stab2 tab2 removeClass stab3 tab3 removeClass stab4 tab4 removeClass stab5 tab5 removeClass stab6 tab6 [/script] [script class=icon on=click] addClass charname charactername addClass roledown role addClass swordin sideword addClass spin icon addClass up tab addClass stab1 tab1 addClass stab2 tab2 addClass stab3 tab3 addClass stab4 tab4 addClass stab5 tab5 addClass stab6 tab6 addClass fadein tabContents1 addClass chosen1 tab1 addClass none icon [/script] [script class=tab1 on=click] addClass show tabContents1 addClass chosen tab1 removeClass show tabContents2 removeClass show tabContents3 removeClass show tabContents4 removeClass show tabContents5 removeClass fadein tabContents1 removeClass chosen tab2 removeClass chosen tab3 removeClass chosen tab4 removeClass chosen tab5 removeClass chosen1 tab1 [/script] [script class=tab2 on=click] addClass show tabContents2 addClass chosen tab2 removeClass show tabContents1 removeClass show tabContents3 removeClass show tabContents4 removeClass show tabContents5 removeClass fadein tabContents1 removeClass chosen tab1 removeClass chosen tab3 removeClass chosen tab4 removeClass chosen tab5 removeClass chosen1 tab1 [/script] [script class=tab3 on=click] addClass show tabContents3 addClass chosen tab3 removeClass show tabContents1 removeClass show tabContents2 removeClass show tabContents4 removeClass show tabContents5 removeClass fadein tabContents1 removeClass chosen tab1 removeClass chosen tab2 removeClass chosen tab4 removeClass chosen tab5 removeClass chosen1 tab1 [/script] [script class=tab4 on=click] addClass show tabContents4 addClass chosen tab4 removeClass show tabContents1 removeClass show tabContents2 removeClass show tabContents3 removeClass show tabContents5 removeClass fadein tabContents1 removeClass chosen tab1 removeClass chosen tab2 removeClass chosen tab3 removeClass chosen tab5 removeClass chosen1 tab1 [/script] [script class=tab5 on=click] addClass show tabContents5 addClass chosen tab5 removeClass show tabContents1 removeClass show tabContents2 removeClass show tabContents3 removeClass show tabContents4 removeClass fadein tabContents1 removeClass chosen tab1 removeClass chosen tab2 removeClass chosen tab3 removeClass chosen tab4 removeClass chosen1 tab1 [/script] [script class=tab6 on=click] removeClass charname charactername removeClass roledown role removeClass swordin sideword removeClass spin icon removeClass up tab removeClass fadein tabContents removeClass show tabContents removeClass chosen1 tab1 removeClass chosen tab removeClass none icon [/script]
 
AlphaHelios AlphaHelios
[class=container] --accent-1: #499982; --accent-2: #499982; --accent-3: #333; --image-1: url(https://66.media.tumblr.com/a07e44de573677b92e05aa4020de0ad9/tumblr_ptgvtptFfH1rxkzk5o4_250.gifv); --image-2: url(https://i.pinimg.com/originals/b9/af/d8/b9afd8beab3a06215797e8385d8a7932.jpg); --image-3: url(https://media.tenor.com/images/4bba53e00e1298d1ebed0477012f8a4d/tenor.gif); --image-4: url(https://www.rollingstone.com/wp-content/uploads/2018/11/20180822_ROLLING_STONE_SHAWN_MENDES_S02_048.jpg?w=800); --image-5: url(https://media.wonderlandmagazine.com/uploads/2018/06/180416_SCALA_SHAWN_MENDES_01_156.jpg); --image-6: url(https://data.whicdn.com/images/331812034/original.gif); --image-7: url(https://i.pinimg.com/originals/5b/83/dc/5b83dc1d82551b92af1d4b9f00f5a98b.jpg); --image-8: url(https://pbs.twimg.com/profile_images/883481374094745600/Wm0CPx5u_400x400.jpg); --image-9: url(https://66.media.tumblr.com/40c0aaae89287b2d99f7fb2466de9aa5/tumblr_inline_prqm979cPP1vcy6pe_540.gifv); --image-10: url(https://media.wonderlandmagazine.com/uploads/2018/06/180416_SCALA_SHAWN_MENDES_12_032.jpg); --image-11: url(https://lh3.googleusercontent.com/proxy/gq6_GNvl7Htwb0PISbWCYBrcjxPsoGRLL5nIxzWSSUO-dQFcn-wfEn9Nv7NmG9nqtCVUO_IB9CvjKV-jRqyTUBk0D-LDy5w9-7vy_ADqDK06Trjf-d4tkZul_GugkeL5dAJwlanVELah-8-mPgyeu0bORF3gD0M-T8PUJJUpui-jMg3yRBQVCqJzL69G_Y2kovC0y8VHXlSBIi6tiuC9wfopS5-bpfetfThzoRdELRLhaXq25MAdndvxdDap9yCbEDAC); --image-12: url(https://66.media.tumblr.com/1a9fd4f4478aabe1c15799da42e13a0c/tumblr_pn53b0Anon1xzvb8wo3_r1_400.gif); --image-13: url(https://i.pinimg.com/originals/d0/7e/58/d07e5891bb56668090cb6ed398bebbaa.jpg); --image-14: url(https://besthqwallpapers.com/Uploads/28-10-2019/109491/thumb2-shawn-mendes-portrait-canadian-singer-photoshoot-popular-canadian-singers.jpg); --image-15: url(https://data.whicdn.com/images/304503413/original.gif); --image-16: url(https://i.pinimg.com/474x/f1/c2/d4/f1c2d4905e236c7cb351ff17f969c694--dance-shawn-mendes.jpg); [/class] [div class=credit][/div][div class=credit2 style="display: none;"]code + design by constellation constellation [/div] [class=credit]position: absolute; top: 0px; left: 0px; font-size: 15px; color: #ddb2e0; transition: 1s;[/class] [class=credit2]position: absolute; z-index: 2; top: 5px; left: 15px; max-width: 160px; margin: 15px; font-size: 10px; letter-spacing: 3px; text-align: center; font-weight: 500; text-transform: lowercase; padding: 25px 30px; color: #333; border: 1px solid #e2e2e2; background: white;[/class] [class name="credit" state="hover"]cursor: url(https://66.media.tumblr.com/6fb38fc5e97353c67e3fc3a2e2b29bf9/tumblr_inline_ol4nwisGdu1uxxza6_75sq.png), auto!important; color: #A0C9C9; transitions: 1s;[/class] [script class=credit on=mouseenter]fadeIn 1000 credit2[/script][script class=credit on=mouseleave]fadeOut 1000 credit2[/script]
[div class=container][div class=border][div class=charactername]Joshua Saito
[div class=icon][/div] [div class=role]The Pretty Boy[/div] [div class=sideword]The Pretty Boy[/div] [div class="tabContents tabContents1"][div class=textbox][div class=scroll][div class=tag]full name.[/div] Joshua Saito [div class=tag]nicknames.[/div] Joss, J.J [div class=tag]age.[/div] 20 [div class=tag]birthdate.[/div] 18th July [div class=tag]gender[/div] Male [div class=tag]sexuality.[/div] Heterosexual [div class=tag]relationship status.[/div] Going through breakup hell [div class=tag]Spoken Languages [/div] English, Japanese, French [div class=tag]Face Claim[/div] Shawn Mendes [div class=tag]Theme Songs[/div] --- [/div][/div] [div class=column][div class=images style="background: var(--image-2); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-3); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-4); background-size: cover; background-position: center;"][/div][/div][/div] [div class="tabContents tabContents2"][div class=textbox][div class=scroll][div class=tag]eyes.[/div] Hazel [div class=tag]hair.[/div] Short Wavy Brunette [div class=tag]height.[/div] 6'4 [div class=tag]body build.[/div] Well toned and Muscular [div class=tag]distinguishing marks.[/div] A star-shaped birthmark on his left shoulder | Tattoo around left bicep reading “Mors Sola”| Tattoo of his sister’s initials at the base of his skull. [div class=tag]attire.[/div] A well balanced mix of casual as well as luxury designer brands. His personal favourites are Prada and Kenzo. [/div][/div] [div class=column][div class=images style="background: var(--image-5); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-6); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-7); background-size: cover; background-position: center;"][/div][/div][/div] [div class="tabContents tabContents3"][div class=textbox][div class=scroll][div class=tag]enneagram.[/div] ‘The Challenger’ - Challengers see themselves as strong and powerful and seek to stand up for what they believe in. [div class=tag]positive traits.[/div]
  1. Trustworthy
  2. Loyal
  3. Protective
  4. Understanding
  5. Free spirited
  6. Caring
[div class=tag]negative traits.[/div]
  1. Narcissistic
  2. Showboat
  3. Suspicious
  4. Excessive pride
  5. Procrastinator
[div class=tag]love language.[/div] Acts of Service [div class=tag]greatest fear.[/div]
  1. Being pushed to the edge of complete helplessness.
  2. Parting with his sister
[div class=tag]priorities, goals and ambitions.[/div]
  • To always stay fit and healthy
  • To stand by his friends and close ones
  • Get a Masters in Economics
  • Take over and expand the family business
[div class=tag]likes.[/div] Designer clothes, Sports cars, football, teasing others, showing off, reading mystery novels, sweet foods, spending time with his sister, Visiting new places. [div class=tag]dislikes.[/div] High places, spicy foods, People who look down on him, obsessive behaviour, dull people, Alcohol, chick flicks
[/div][/div] [div class=column][div class=images style="background: var(--image-8); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-9); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-10); background-size: cover; background-position: center;"][/div][/div][/div] [div class="tabContents tabContents4"][div class=textbox][div class=scroll][div class=tag]the backstory.[/div] Being the only male heir to the Saito group, one could easily claim that Joshua was born with a platinum spoon in his mouth. However, things are never as smooth as they seem from a distance. Groomed from a young age to take over the family business one day, excellence was something naturally expected from him. For the most part, Joshua did not let down the expectations placed on him. Being equally able in sports and academics, Joshua drew a lot of attention from his peers and mates likewise. Unfortunately in Ravenpoint, attracting attention is never a good thing. Pranks, practical jokes, and humiliation began rolling in more frequently. For a young Joshua though, this was a learning experience. He justified all these negative actions by assuming that he was the target, simply because he was ‘better’ than others. Thus began his strife to achieve perfection and narcissistic tendencies began to seep into his psyche. This was not to say that, he thought he was better than everybody. Rather, this helped him realize the value of real friends, and better understand the shallowness of human nature on display around him. His constant companion, through most of his life, was his sister. Since childhood, the siblings shared some of their best memories together and grew up much closer than usual twins. He has rarely hidden anything from her, encompassing the most intimate details. That is not to say his sister has always kept his faith, even outing several embarrassing details of his to the public eye. But there is nothing he wouldn’t forgive her for. His relations with the rest of the family are more ‘normal’ in nature, though he is much closer to his mother than his father. Joshua’s relationships can be described as few in number but intense in nature. As a result, he always fully commits to them. This is a bit of a double-edged sword according to him, as any breakups or estrangement hurt a lot more. A good example of this is his recent breakup with Samara Cambridge, which has left him on edge and feeling deeply betrayed. [/div][/div] [div class=column][div class=images style="background: var(--image-11); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-12); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-13); background-size: cover; background-position: center;"][/div][/div][/div] [div class="tabContents tabContents5"][div class=textbox][div class=scroll][div class=tag]Wren Saito (48)[/div] [div class=tag]Luanna Saito (46)[/div] [/div][/div] [div class=column][div class=images style="background: var(--image-14); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-15); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-16); background-size: cover; background-position: center;"][/div][/div][/div] [div class="tab tab1" style="left: 12px; bottom: -30px;"][/div] [div class="tab tab2" style="left: 85px; bottom: -30px;"][/div] [div class="tab tab3" style="left: 158px; bottom: -30px;"][/div] [div class="tab tab4" style="left: 231px; bottom: -30px;"][/div] [div class="tab tab5" style="left: 304px; bottom: -30px;"][/div] [div class="tab tab6" style="left: 377px; bottom: -30px;"][/div] [/div][/div][/div] [class=container] width: 450px; height: 450px; margin: auto; cursor: url(https://66.media.tumblr.com/232c090ebdd37ae4bc17adb54e1e0344/tumblr_inline_ol4nwhvSwg1uxxza6_75sq.png), auto!important; [/class] [class=border] position: absolute; width: 450px; height: 450px; border: 1px solid #ccc; outline: 1px solid #499982; background: #f1f1f1; margin: auto; overflow: hidden; [/class] [class=charactername] position: absolute; width: 450px; top: 75px; right: 0; text-align: center; font-size: 30px; text-transform: uppercase; color: var(--accent-2); font-weight: 900; text-align: center; transition: ease 1s; white-space: nowrap; transition-delay: 1s; [/class] [class=icon] width: 150px; height: 150px; background: var(--image-1); background-size: cover; background-position: center; border-radius: 100%; position: absolute; left: 145px; top: 145px; z-index: 2; border: 5px solid var(--accent-1); transform: rotateY(0deg); transition: ease 1s; cursor: url(https://66.media.tumblr.com/6fb38fc5e97353c67e3fc3a2e2b29bf9/tumblr_inline_ol4nwisGdu1uxxza6_75sq.png), auto!important; [/class] [class=role] position: absolute; bottom: 90px; width: 450px; height: 10px; text-align: center; color: var(--accent-2); font-size: 11px; line-height: 10px; transition: ease 1s; transition-delay: 1s; text-transform: uppercase; [/class] [class=charname] font-size: 15px; top: 34px; right: 10px; width: 170px; transition-delay: 0s; [/class] [class=roledown] bottom: -20px; transition-delay: 0s; [/class] [class=sideword] position: absolute; width: 170px; left: -170px; top: 34px; font: 15px; text-transform: uppercase; color: var(--accent-2); font-weight: 900; text-align: center; transition: ease 1s; box-sizing: border-box; padding-right: 0px; transition-delay: 1s; [/class] [class=swordin] left: 10px; transition-delay: 0s; [/class] [class=spin] top: 15px; left: 190px; width: 60px; height: 60px; transform: rotateY(360deg); transition-delay: 1s; border-width: 2px; [/class] [class=tab] position: absolute; background: var(--accent-1); width: 61px; height: 30px; border-radius: 3px; display: inline-block; transition: ease 0.5s; line-height: 30px; text-align: center; font-size: 12px; color: var(--accent-3); cursor: url(https://66.media.tumblr.com/6fb38fc5e97353c67e3fc3a2e2b29bf9/tumblr_inline_ol4nwisGdu1uxxza6_75sq.png), auto!important; [/class] [class=up] margin-bottom: 40px; transition: ease 0.5s; [/class] [class=stab1] transition-delay: 2.2s; [/class] [class=stab2] transition-delay: 2.4s; [/class] [class=stab3] transition-delay: 2.6s; [/class] [class=stab4] transition-delay: 2.8s; [/class] [class=stab5] transition-delay: 3s; [/class] [class=stab6] transition-delay: 3.2s; [/class] [class=tabContents] position: absolute; top: 85px; left: 20px; height: 320px; width: 410px; transition: all .5s; opacity: 0; [/class] [class=fadein] opacity: 1; z-index: 1; transition: all 1.5s; transition-delay: 3.6s; [/class] [class=column] height: 320px; width: 96px; display: flex; justify-content: space-evenly; position: absolute; right: 0; flex-direction: column; [/class] [class=images] height: 92px; width: 92px; border: 2px solid var(--accent-2); [/class] [class=images2] height: 92px; width: 92px; border: 2px solid var(--accent-1); [/class] [class=textbox] position: absolute; left: 0; top: 7px; width: 315px; height: 305px; overflow: hidden; font-size: 12px; white-space: pre-line; line-height: 130%; text-transform: lowercase; [/class] [class=scroll] width: 100%; height: 100%; overflow-y: scroll; padding-right: 17px; color: var(--accent-3); [/class] [class=tag] text-transform: uppercase; display: inline; font-size: 12px; letter-spacing: 1px; text-align: left; font-weight: 600; color: var(--accent-1); [/class] [class name=tab state=hover] background: var(--accent-3); color: var(--accent-1); transition: ease .5s; [/class] [class=chosen] background: var(--accent-3); color: var(--accent-1); transition: ease .5s; [/class] [class=chosen1] background: var(--accent-3); color: var(--accent-1); transition: ease .5s; transition-delay: 2.2s; [/class] [class=show] opacity: 1; transition: all 1s; z-index: 1; [/class] [class=none] pointer-events: none; [/class] [script class=tab on=mouseenter] removeClass stab1 tab1 removeClass stab2 tab2 removeClass stab3 tab3 removeClass stab4 tab4 removeClass stab5 tab5 removeClass stab6 tab6 [/script] [script class=icon on=click] addClass charname charactername addClass roledown role addClass swordin sideword addClass spin icon addClass up tab addClass stab1 tab1 addClass stab2 tab2 addClass stab3 tab3 addClass stab4 tab4 addClass stab5 tab5 addClass stab6 tab6 addClass fadein tabContents1 addClass chosen1 tab1 addClass none icon [/script] [script class=tab1 on=click] addClass show tabContents1 addClass chosen tab1 removeClass show tabContents2 removeClass show tabContents3 removeClass show tabContents4 removeClass show tabContents5 removeClass fadein tabContents1 removeClass chosen tab2 removeClass chosen tab3 removeClass chosen tab4 removeClass chosen tab5 removeClass chosen1 tab1 [/script] [script class=tab2 on=click] addClass show tabContents2 addClass chosen tab2 removeClass show tabContents1 removeClass show tabContents3 removeClass show tabContents4 removeClass show tabContents5 removeClass fadein tabContents1 removeClass chosen tab1 removeClass chosen tab3 removeClass chosen tab4 removeClass chosen tab5 removeClass chosen1 tab1 [/script] [script class=tab3 on=click] addClass show tabContents3 addClass chosen tab3 removeClass show tabContents1 removeClass show tabContents2 removeClass show tabContents4 removeClass show tabContents5 removeClass fadein tabContents1 removeClass chosen tab1 removeClass chosen tab2 removeClass chosen tab4 removeClass chosen tab5 removeClass chosen1 tab1 [/script] [script class=tab4 on=click] addClass show tabContents4 addClass chosen tab4 removeClass show tabContents1 removeClass show tabContents2 removeClass show tabContents3 removeClass show tabContents5 removeClass fadein tabContents1 removeClass chosen tab1 removeClass chosen tab2 removeClass chosen tab3 removeClass chosen tab5 removeClass chosen1 tab1 [/script] [script class=tab5 on=click] addClass show tabContents5 addClass chosen tab5 removeClass show tabContents1 removeClass show tabContents2 removeClass show tabContents3 removeClass show tabContents4 removeClass fadein tabContents1 removeClass chosen tab1 removeClass chosen tab2 removeClass chosen tab3 removeClass chosen tab4 removeClass chosen1 tab1 [/script] [script class=tab6 on=click] removeClass charname charactername removeClass roledown role removeClass swordin sideword removeClass spin icon removeClass up tab removeClass fadein tabContents removeClass show tabContents removeClass chosen1 tab1 removeClass chosen tab removeClass none icon [/script]
 
[class=container] --accent-1: #A0C9C9; --accent-2: #B2E0E0; --accent-3: #333; --image-1: url(https://em.wattpad.com/0cccda616836dc4ae386ee43f074610f95bba077/68747470733a2f2f73332e616d617a6f6e6177732e636f6d2f776174747061642d6d656469612d736572766963652f53746f7279496d6167652f344332616148624c6c386b6331673d3d2d3330313132373232392e313465626639316663333565376430663733383836363437363636352e676966?s=fit&w=720&h=720); --image-2: url(https://pbs.twimg.com/profile_images/981592379638640641/GgpHQTKm_400x400.jpg); --image-3: url(https://i.pinimg.com/originals/b4/b0/6b/b4b06b990ddf1ced8b6e9219ac331c4f.gif); --image-4: url(https://i.pinimg.com/originals/b2/d5/99/b2d599f6ebb4ecfdfb67ee9989d5b02b.jpg); --image-5: url(https://i.imgur.com/lWymMLw.jpg); --image-6: url(https://66.media.tumblr.com/283259006192d6e9813990eb3d69b5cd/tumblr_inline_p7go7r35YT1t40kq9_250.gifv); --image-7: url(https://www.simonclemengerphotography.com/wp-content/uploads/2016/03/magdalena-zalejska-rings-hey-girl-magazine-2.jpg); --image-8: url(https://i.imgur.com/vK6NSCF.jpg); --image-9: url(https://gifimage.net/wp-content/uploads/2017/10/magdalena-zalejska-gif-3.gif); --image-10: url(https://encrypted-tbn0.gstatic.com/images?q=tbn%3AANd9GcTqiAsthdHeeMUPPyDAvN90tSzQpLpOiBoMRFemZL3ofG1t6bof); --image-11: url(https://pbs.twimg.com/media/Ck4X6-MUoAAwsoH.jpg); --image-12: url(https://66.media.tumblr.com/74e5324ee489954efd14719cbd3d08c3/tumblr_inline_p7go6p2BGE1t40kq9_250.gifv); --image-13: url(https://66.media.tumblr.com/ff0632627c947dc9a1f674ef4a4509d6/tumblr_o42byp0Ror1snxr0oo1_400.jpg); --image-14: url(https://pbs.twimg.com/media/CeagWgFWEAA2hZN.jpg); --image-15: url(https://d.wattpad.com/story_parts/298589754/images/14a56399828a54ea566423277634.gif); --image-16: url(https://www.simonclemengerphotography.com/wp-content/uploads/2016/03/magdalena-zalejska-hey-girl-magazine-5.jpg); [/class] [div class=credit][/div][div class=credit2 style="display: none;"]code + design by constellation constellation [/div] [class=credit]position: absolute; top: 0px; left: 0px; font-size: 15px; color: #b2e0e0; transition: 1s;[/class] [class=credit2]position: absolute; z-index: 2; top: 5px; left: 15px; max-width: 160px; margin: 15px; font-size: 10px; letter-spacing: 3px; text-align: center; font-weight: 500; text-transform: lowercase; padding: 25px 30px; color: #333; border: 1px solid #e2e2e2; background: white;[/class] [class name="credit" state="hover"]cursor: url(https://66.media.tumblr.com/6fb38fc5e97353c67e3fc3a2e2b29bf9/tumblr_inline_ol4nwisGdu1uxxza6_75sq.png), auto!important; color: #A0C9C9; transitions: 1s;[/class] [script class=credit on=mouseenter]fadeIn 1000 credit2[/script][script class=credit on=mouseleave]fadeOut 1000 credit2[/script]
[div class=container][div class=border][div class=charactername]Clover
[div class=icon][/div] [div class=role]The High Maintenance[/div] [div class=sideword]Daddy's Girl[/div] [div class="tabContents tabContents1"][div class=textbox][div class=scroll][div class=tag]full name.[/div] Clover Elizabeth Lexington [div class=tag]nicknames.[/div] Clo Lexie [div class=tag]age.[/div] 20 [div class=tag]birthdate.[/div] August 14, 1996 [div class=tag]gender[/div] Female [div class=tag]country.[/div] United Kingdom [div class=tag]sexuality.[/div] Straight [div class=tag]relationship status.[/div] It's complicated...or not. I don't see how that's your business, darling. [div class=tag]face claim.[/div] Magdalena Zalejska [div class=tag]spoken languages.[/div] French, Italian [div class=tag]theme songs.[/div] Icona Pop - I Love It Cher Lloyd - Swagger Jagger Lily Allen - Sheezus [/div][/div] [div class=column][div class=images style="background: var(--image-2); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-3); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-4); background-size: cover; background-position: center;"][/div][/div][/div] [div class="tabContents tabContents2"][div class=textbox][div class=scroll][div class=tag]eyes.[/div] blue [div class=tag]hair.[/div] brown [div class=tag]height.[/div] 5'9'' [div class=tag]body build.[/div] fairly lean, fit, athletic [div class=tag]distinguishing marks.[/div] tattoo on left wrist and neck pierced ear [div class=tag]attire.[/div] exclusively designer pieces, tailor-made clothing, nothing off-the-rack, her pieces have to be original, otherwise, it's not even worthy wearing; the second she sees someone wearing or having the same piece of clothing, jewelry or accesory, she throws it away, there can only be one ORIGINAL 1 2 3 4 5 6 7 [/div][/div] [div class=column][div class=images style="background: var(--image-5); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-6); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-7); background-size: cover; background-position: center;"][/div][/div][/div] [div class="tabContents tabContents3"][div class=textbox][div class=scroll][div class=tag]enneagram.[/div] the challenger [div class=tag]positive traits.[/div] ●determined ●motivated ●high amount of self-esteem ●confident ●self-assured ●committed (when the cause benefits her) ●practically awesome [div class=tag]negative traits.[/div] ●spoiled ●overly honest (practically bitchy) ●over-achiever ●impatient ●entitled ●condescending [div class=tag]love language.[/div] receiving gifts [div class=tag]greatest fear.[/div] losing her status and becoming poor [div class=tag]priorities, goals and ambitions.[/div] ●all Clo wants is to have comfortable life and she doesn't care how she will get it, she is on great way there, being an heiress of the title but her plans also inlude probably marrying well ●she is at the college, studying business but not doing much studying - she is planning on graduating magna cum laude though and her name and background should help a lot [div class=tag]likes.[/div] ●partying ●shopping ●designer clothes ●gossip ●meddling with lives of others ●Abby ●mint cigarettes ●money ●bourbon ●troublemakers ●Italian food [div class=tag]dislikes.[/div] ●the word 'no' ●cheap alcohol ●idiots ●wedges ●people resisting her ●things not happening as she wishes ●Chinese food [/div][/div] [div class=column][div class=images style="background: var(--image-8); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-9); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-10); background-size: cover; background-position: center;"][/div][/div][/div] [div class="tabContents tabContents4"][div class=textbox][div class=scroll][div class=tag]the backstory. Clover lived in London for most of her young life. She was the only daughter of esteemed Duke Lexington. Being the rich kid, only child and the heiress, her parents really cared about their precious daughter to have it all. Daddy was always the best. He treated his little princess with presents and material things from early childhood and Clo got very used to it. Her mother loved her dearly as well but she also cared about her education and status, making Clover attend many additional classes. By the age of five, Clo was attending ballet, horse riding and ballroom classes plus etiquette as every future Duchess should do. As Clo was getting older, the gifts from daddy was getting better and more expensive. She dropped from all of her classes which angered her mother but then, daddy said Clo didn’t have to go there and it was decided. Clover developed this habit of asking her father for everything that occurred to her, no matter how ridiculous the requirement was. And daddy always made all of her dreams and wishes come true without even asking. He spoiled her rotten and everyone except him saw it. Her mom no longer had a say and all she could do was simply nod to everything her daughter came up with as it didn’t matter if she approved or not. When Clo was 16, her mother died. She was actually very sweet woman but the cancer was a bitch. It hit the young girl quite hard but she would never admit it to anyone. Her heart became even harder and she started to overcompensate with her needs and wants which her daddy happily obliged to. Anything for his little princess, anything to make her happy. The sentence starting with ‘Hey, daddy, I would like…’ became the daily routine and was never followed by no. Around this time, the Lexingtons moved to America. Clover immediately found her crowd, whether they admired her for her red Porsche, flawless closet or status, or they hated her but couldn’t resist being close to her. She started on building her queen bee status immediately, making the right friends. She only let two girls close, one of them being Annaliese de Leon. Clover walks over dead bodies, not caring what happens to others. Her only and the highest interest is herself and whatever she wants, she gets it. Someone gets hurt? Oh my, she really is sorry…not sorry.[/div] [/div] [/div] [div class=column][div class=images style="background: var(--image-11); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-12); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-13); background-size: cover; background-position: center;"][/div][/div] [/div] [div class="tabContents tabContents5"][div class=textbox][div class=scroll][div class=tag]father.[/div] Duke William Christopher Lexington Of course, daddy has been the greatest figure in Clover's life. He is the most essential person she needs and she even loves him. In her own selfish way, she does. Though she treats him the same as others, seemingly without respect, if it wasn't for him, Clo wouldn't have sich comfortable life. And she knows it very well. In a way, Clover is very attached to him, mostly in terms of fulfilling every whimsy she comes up with but also, she needs to have this father figure in her life, even though she wouldn't admit it for the world. [div class=tag]mother.[/div] Duchess Heather Olivia Lexington (deceased) Duchess Lexington was a true lady. Born and raised. And she wanted to do the same with her one and only. Heather had plans how Clover would grow up a fine young lady, her mother would find her an equally fine young duke or earl or someone truly worthy and her daughter would live happily ever after in the English countryside. The plan would have worked if Clover hadn't been such an opinionated girl. And if daddy wasn't entirely on her side. The relationship between the two was...fine. That's the only way to describe it. It wasn't hate but it wasn't the true love mothers usually share with their daughters. [div class=tag]sister.[/div] N/A [div class=tag]brother.[/div] N/A [/div][/div] [div class=column][div class=images style="background: var(--image-14); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-15); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-16); background-size: cover; background-position: center;"][/div][/div][/div] [div class="tab tab1" style="left: 12px; bottom: -30px;"][/div] [div class="tab tab2" style="left: 85px; bottom: -30px;"][/div] [div class="tab tab3" style="left: 158px; bottom: -30px;"][/div] [div class="tab tab4" style="left: 231px; bottom: -30px;"][/div] [div class="tab tab5" style="left: 304px; bottom: -30px;"][/div] [div class="tab tab6" style="left: 377px; bottom: -30px;"][/div] [/div] [/div] [/div] [class=container] width: 450px; height: 450px; margin: auto; cursor: url(https://66.media.tumblr.com/232c090ebdd37ae4bc17adb54e1e0344/tumblr_inline_ol4nwhvSwg1uxxza6_75sq.png), auto!important; [/class] [class=border] position: absolute; width: 450px; height: 450px; border: 1px solid #ccc; outline: 1px solid #fafafa; background: #f1f1f1; margin: auto; overflow: hidden; [/class] [class=charactername] position: absolute; width: 450px; top: 75px; right: 0; text-align: center; font-size: 30px; text-transform: uppercase; color: var(--accent-2); font-weight: 900; text-align: center; transition: ease 1s; white-space: nowrap; transition-delay: 1s; [/class] [class=icon] width: 150px; height: 150px; background: var(--image-1); background-size: cover; background-position: center; border-radius: 100%; position: absolute; left: 145px; top: 145px; z-index: 2; border: 5px solid var(--accent-1); transform: rotateY(0deg); transition: ease 1s; cursor: url(https://66.media.tumblr.com/6fb38fc5e97353c67e3fc3a2e2b29bf9/tumblr_inline_ol4nwisGdu1uxxza6_75sq.png), auto!important; [/class] [class=role] position: absolute; bottom: 90px; width: 450px; height: 10px; text-align: center; color: var(--accent-2); font-size: 11px; line-height: 10px; transition: ease 1s; transition-delay: 1s; text-transform: uppercase; [/class] [class=charname] font-size: 15px; top: 34px; right: 10px; width: 170px; transition-delay: 0s; [/class] [class=roledown] bottom: -20px; transition-delay: 0s; [/class] [class=sideword] position: absolute; width: 170px; left: -170px; top: 34px; font: 15px; text-transform: uppercase; color: var(--accent-2); font-weight: 900; text-align: center; transition: ease 1s; box-sizing: border-box; padding-right: 0px; transition-delay: 1s; [/class] [class=swordin] left: 10px; transition-delay: 0s; [/class] [class=spin] top: 15px; left: 190px; width: 60px; height: 60px; transform: rotateY(360deg); transition-delay: 1s; border-width: 2px; [/class] [class=tab] position: absolute; background: var(--accent-1); width: 61px; height: 30px; border-radius: 3px; display: inline-block; transition: ease 0.5s; line-height: 30px; text-align: center; font-size: 12px; color: var(--accent-3); cursor: url(https://66.media.tumblr.com/6fb38fc5e97353c67e3fc3a2e2b29bf9/tumblr_inline_ol4nwisGdu1uxxza6_75sq.png), auto!important; [/class] [class=up] margin-bottom: 40px; transition: ease 0.5s; [/class] [class=stab1] transition-delay: 2.2s; [/class] [class=stab2] transition-delay: 2.4s; [/class] [class=stab3] transition-delay: 2.6s; [/class] [class=stab4] transition-delay: 2.8s; [/class] [class=stab5] transition-delay: 3s; [/class] [class=stab6] transition-delay: 3.2s; [/class] [class=tabContents] position: absolute; top: 85px; left: 20px; height: 320px; width: 410px; transition: all .5s; opacity: 0; [/class] [class=fadein] opacity: 1; z-index: 1; transition: all 1.5s; transition-delay: 3.6s; [/class] [class=column] height: 320px; width: 96px; display: flex; justify-content: space-evenly; position: absolute; right: 0; flex-direction: column; [/class] [class=images] height: 92px; width: 92px; border: 2px solid var(--accent-2); [/class] [class=images2] height: 92px; width: 92px; border: 2px solid var(--accent-1); [/class] [class=textbox] position: absolute; left: 0; top: 7px; width: 315px; height: 305px; overflow: hidden; font-size: 12px; white-space: pre-line; line-height: 130%; text-transform: lowercase; [/class] [class=scroll] width: 100%; height: 100%; overflow-y: scroll; padding-right: 17px; color: var(--accent-3); [/class] [class=tag] text-transform: uppercase; display: inline; font-size: 12px; letter-spacing: 1px; text-align: left; font-weight: 600; color: var(--accent-1); [/class] [class name=tab state=hover] background: var(--accent-3); color: var(--accent-1); transition: ease .5s; [/class] [class=chosen] background: var(--accent-3); color: var(--accent-1); transition: ease .5s; [/class] [class=chosen1] background: var(--accent-3); color: var(--accent-1); transition: ease .5s; transition-delay: 2.2s; [/class] [class=show] opacity: 1; transition: all 1s; z-index: 1; [/class] [class=none] pointer-events: none; [/class] [script class=tab on=mouseenter] removeClass stab1 tab1 removeClass stab2 tab2 removeClass stab3 tab3 removeClass stab4 tab4 removeClass stab5 tab5 removeClass stab6 tab6 [/script] [script class=icon on=click] addClass charname charactername addClass roledown role addClass swordin sideword addClass spin icon addClass up tab addClass stab1 tab1 addClass stab2 tab2 addClass stab3 tab3 addClass stab4 tab4 addClass stab5 tab5 addClass stab6 tab6 addClass fadein tabContents1 addClass chosen1 tab1 addClass none icon [/script] [script class=tab1 on=click] addClass show tabContents1 addClass chosen tab1 removeClass show tabContents2 removeClass show tabContents3 removeClass show tabContents4 removeClass show tabContents5 removeClass fadein tabContents1 removeClass chosen tab2 removeClass chosen tab3 removeClass chosen tab4 removeClass chosen tab5 removeClass chosen1 tab1 [/script] [script class=tab2 on=click] addClass show tabContents2 addClass chosen tab2 removeClass show tabContents1 removeClass show tabContents3 removeClass show tabContents4 removeClass show tabContents5 removeClass fadein tabContents1 removeClass chosen tab1 removeClass chosen tab3 removeClass chosen tab4 removeClass chosen tab5 removeClass chosen1 tab1 [/script] [script class=tab3 on=click] addClass show tabContents3 addClass chosen tab3 removeClass show tabContents1 removeClass show tabContents2 removeClass show tabContents4 removeClass show tabContents5 removeClass fadein tabContents1 removeClass chosen tab1 removeClass chosen tab2 removeClass chosen tab4 removeClass chosen tab5 removeClass chosen1 tab1 [/script] [script class=tab4 on=click] addClass show tabContents4 addClass chosen tab4 removeClass show tabContents1 removeClass show tabContents2 removeClass show tabContents3 removeClass show tabContents5 removeClass fadein tabContents1 removeClass chosen tab1 removeClass chosen tab2 removeClass chosen tab3 removeClass chosen tab5 removeClass chosen1 tab1 [/script] [script class=tab5 on=click] addClass show tabContents5 addClass chosen tab5 removeClass show tabContents1 removeClass show tabContents2 removeClass show tabContents3 removeClass show tabContents4 removeClass fadein tabContents1 removeClass chosen tab1 removeClass chosen tab2 removeClass chosen tab3 removeClass chosen tab4 removeClass chosen1 tab1 [/script] [script class=tab6 on=click] removeClass charname charactername removeClass roledown role removeClass swordin sideword removeClass spin icon removeClass up tab removeClass fadein tabContents removeClass show tabContents removeClass chosen1 tab1 removeClass chosen tab removeClass none icon [/script]
 
[class=container] --accent-1: #A0C9C9; --accent-2: #B2E0E0; --accent-3: #333; --image-1: url(https://suburbanmen.com/wp-content/uploads/2019/10/instagram-crush-isabelle-mathers-101.jpg); --image-2: url(https://i.imgur.com/oHdaIQN.jpg); --image-3: url(https://data.whicdn.com/images/330806326/original.jpg); --image-4: url(https://pbs.twimg.com/profile_images/1188736980382650368/drquggjf_400x400.jpg); --image-5: url(https://i.pinimg.com/originals/41/1d/f8/411df8d6c50d29d17d0b43f817015cca.jpg); --image-6: url(https://iv1.lisimg.com/image/19498222/320full.jpg); --image-7: url(https://surveymonkey-assets.s3.amazonaws.com/survey/158552767/image_choice/5e6999af-e723-426a-9a3f-ea7b9310f364.jpg); --image-8: url(https://files.thehandbook.com/uploads/2019/07/60383847_383747075817177_9196349519967551488_n-300x300.jpg); --image-9: url(https://i.pinimg.com/originals/24/f5/47/24f547fdf164a351b67bcc2f6e814613.jpg); --image-10: url(https://data.whicdn.com/images/334911680/original.jpg); --image-11: url(https://ilarge.lisimg.com/image/15102435/1080full-isabelle-mathers.jpg); --image-12: url(https://i.pinimg.com/originals/49/01/f0/4901f01e76223db767b97b21565c940a.jpg); --image-13: url(https://bikininewsdaily.com/street/tho/eb99aac33a7fa69469f94c96baaed126c5b60a54015fbdafe211157980532b5b.jpg?i=409); --image-14: url(https://em.wattpad.com/81bba0bfa1c184b140e7aa857b866d256931cc9b/68747470733a2f2f73332e616d617a6f6e6177732e636f6d2f776174747061642d6d656469612d736572766963652f53746f7279496d6167652f7a306a573330416e6b33554c55673d3d2d3634393833333131322e313536333661613163373832373536333439363433383139323830302e6a7067?s=fit&w=720&h=720); --image-15: url(https://i.pinimg.com/originals/da/12/72/da127243c8e7b1a8b4b53b49a04b4255.jpg); --image-16: url(https://pic.kissgoddess.com/girl/25598/25598.jpg); [/class] [div class=credit][/div][div class=credit2 style="display: none;"]code + design by constellation constellation [/div] [class=credit]position: absolute; top: 0px; left: 0px; font-size: 15px; color: #b2e0e0; transition: 1s;[/class] [class=credit2]position: absolute; z-index: 2; top: 5px; left: 15px; max-width: 160px; margin: 15px; font-size: 10px; letter-spacing: 3px; text-align: center; font-weight: 500; text-transform: lowercase; padding: 25px 30px; color: #333; border: 1px solid #e2e2e2; background: white;[/class] [class name="credit" state="hover"]cursor: url(https://66.media.tumblr.com/6fb38fc5e97353c67e3fc3a2e2b29bf9/tumblr_inline_ol4nwisGdu1uxxza6_75sq.png), auto!important; color: #A0C9C9; transitions: 1s;[/class] [script class=credit on=mouseenter]fadeIn 1000 credit2[/script][script class=credit on=mouseleave]fadeOut 1000 credit2[/script]
[div class=container][div class=border][div class=charactername]elena
[div class=icon][/div] [div class=role]the drama queen[/div] [div class=sideword]the drama queen[/div] [div class="tabContents tabContents1"][div class=textbox][div class=scroll][div class=tag]full name.[/div]
elena renee saito​
[div class=tag]nicknames.[/div]
lena, don't call her el unless you're daddy (she hates it)​
[div class=tag]age.[/div]
20​
[div class=tag]birthdate.[/div]
july 18th​
[div class=tag]gender[/div]
cis-female​
[div class=tag]country.[/div]
u.s.​
[div class=tag]sexuality.[/div]
heterosexual​
[div class=tag]relationship status.[/div]
it's complicated​
[div class=tag]spoken languages.[/div]
english, japanese, french​
[div class=tag]face claim[/div]
isabelle mathers​
[div class=tag]theme song[/div]
indigo by niki how to be a heartbreaker by marina and the diamonds don't call me angel by lana del rey​
[/div][/div] [div class=column][div class=images style="background: var(--image-2); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-3); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-4); background-size: cover; background-position: center;"][/div][/div][/div] [div class="tabContents tabContents2"][div class=textbox][div class=scroll][div class=tag]eyes.[/div]
sea green​
[div class=tag]hair.[/div]
brunette w/ blonde balayage, beachy waves, waist length​
[div class=tag]height.[/div]
5'7"​
[div class=tag]body build.[/div]
slim, slightly curvy​
[div class=tag]distinguishing marks.[/div]
none, but has a cartilage piercing on her right ear and doubles on both ears​
[div class=tag]attire.[/div]
think serena vanderwoodsen- high end and flirty (showing off her body only when appropriate), with a gucci or louis vuitton belt + a designer bag and heels to match, all topped off with her signature chanel "gabrielle" perfume​
[/div][/div] [div class=column][div class=images style="background: var(--image-5); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-6); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-7); background-size: cover; background-position: center;"][/div][/div][/div] [div class="tabContents tabContents3"][div class=textbox][div class=scroll][div class=tag]enneagram.[/div]
information here​
[div class=tag]positive traits.[/div]
information here​
[div class=tag]negative traits.[/div]
information here​
[div class=tag]love language.[/div]
quality time​
[div class=tag]greatest fear.[/div]
becoming another piece of shallow, self centered high society (sitting still and looking pretty- not becoming something great)​
[div class=tag]priorities, goals and ambitions.[/div]
becoming successful and great (maybe modeling or starting her own fashion company) finding love​
[div class=tag]likes.[/div]
information here​
[div class=tag]dislikes.[/div]
information here​
[/div][/div] [div class=column][div class=images style="background: var(--image-8); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-9); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-10); background-size: cover; background-position: center;"][/div][/div][/div] [div class="tabContents tabContents4"][div class=textbox][div class=scroll][div class=tag]the backstory.[/div]
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras sollicitudin tempor felis, id hendrerit tortor consequat ultricies. Quisque eget purus lobortis, facilisis nisi sed, vehicula nisl. Cras pellentesque dictum sollicitudin. Nunc posuere ex a elit malesuada, vel condimentum quam sagittis. Suspendisse ipsum risus, laoreet ut pretium vitae, elementum eget ipsum. Phasellus felis lectus, pretium eu nibh quis, consectetur egestas turpis. Sed dignissim felis et sapien vulputate dapibus. Proin orci risus, tristique quis ante et, ultricies maximus purus. Phasellus ultricies, felis at facilisis iaculis, nulla massa vestibulum nunc, et malesuada tellus nisi eu arcu. Fusce rhoncus odio et velit pellentesque, et efficitur odio condimentum. Phasellus pharetra mi et laoreet iaculis. Quisque pulvinar nulla sit amet pretium faucibus. Suspendisse sit amet venenatis urna, ut egestas justo. Maecenas et aliquet nisl, ac posuere felis. Nam eget tincidunt erat. Phasellus tincidunt lobortis nisi, volutpat suscipit dolor rhoncus vitae. Praesent quis est sit amet arcu commodo elementum eget mollis magna. Vestibulum dictum scelerisque quam id volutpat. In hac habitasse platea dictumst. In hac habitasse platea dictumst. Maecenas malesuada tellus vel ultrices accumsan. Mauris quam nunc, mattis id tristique sit amet, pulvinar a mauris. Duis at porta lectus. Curabitur porta, sem non molestie lobortis, arcu augue gravida lacus, at congue libero lacus vel est. Pellentesque ornare, enim at maximus elementum, libero nunc aliquet est, nec convallis erat orci eu diam.​
[/div][/div] [div class=column][div class=images style="background: var(--image-11); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-12); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-13); background-size: cover; background-position: center;"][/div][/div][/div] [div class="tabContents tabContents5"][div class=textbox][div class=scroll][div class=tag]father.[/div]
~wren santo~ daddy issues lemme tell ya​
[div class=tag]mother.[/div]
~luanna santo~ was close but now strained​
[div class=tag]brother.[/div]
~joshua saito~ her rock​
[/div][/div] [div class=column][div class=images style="background: var(--image-14); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-15); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-16); background-size: cover; background-position: center;"][/div][/div][/div] [div class="tab tab1" style="left: 12px; bottom: -30px;"][/div] [div class="tab tab2" style="left: 85px; bottom: -30px;"][/div] [div class="tab tab3" style="left: 158px; bottom: -30px;"][/div] [div class="tab tab4" style="left: 231px; bottom: -30px;"][/div] [div class="tab tab5" style="left: 304px; bottom: -30px;"][/div] [div class="tab tab6" style="left: 377px; bottom: -30px;"][/div] [/div][/div][/div] [class=container] width: 450px; height: 450px; margin: auto; cursor: url(https://66.media.tumblr.com/232c090ebdd37ae4bc17adb54e1e0344/tumblr_inline_ol4nwhvSwg1uxxza6_75sq.png), auto!important; [/class] [class=border] position: absolute; width: 450px; height: 450px; border: 1px solid #ccc; outline: 1px solid #fafafa; background: #f1f1f1; margin: auto; overflow: hidden; [/class] [class=charactername] position: absolute; width: 450px; top: 75px; right: 0; text-align: center; font-size: 30px; text-transform: uppercase; color: var(--accent-2); font-weight: 900; text-align: center; transition: ease 1s; white-space: nowrap; transition-delay: 1s; [/class] [class=icon] width: 150px; height: 150px; background: var(--image-1); background-size: cover; background-position: center; border-radius: 100%; position: absolute; left: 145px; top: 145px; z-index: 2; border: 5px solid var(--accent-1); transform: rotateY(0deg); transition: ease 1s; cursor: url(https://66.media.tumblr.com/6fb38fc5e97353c67e3fc3a2e2b29bf9/tumblr_inline_ol4nwisGdu1uxxza6_75sq.png), auto!important; [/class] [class=role] position: absolute; bottom: 90px; width: 450px; height: 10px; text-align: center; color: var(--accent-2); font-size: 11px; line-height: 10px; transition: ease 1s; transition-delay: 1s; text-transform: uppercase; [/class] [class=charname] font-size: 15px; top: 34px; right: 10px; width: 170px; transition-delay: 0s; [/class] [class=roledown] bottom: -20px; transition-delay: 0s; [/class] [class=sideword] position: absolute; width: 170px; left: -170px; top: 34px; font: 15px; text-transform: uppercase; color: var(--accent-2); font-weight: 900; text-align: center; transition: ease 1s; box-sizing: border-box; padding-right: 0px; transition-delay: 1s; [/class] [class=swordin] left: 10px; transition-delay: 0s; [/class] [class=spin] top: 15px; left: 190px; width: 60px; height: 60px; transform: rotateY(360deg); transition-delay: 1s; border-width: 2px; [/class] [class=tab] position: absolute; background: var(--accent-1); width: 61px; height: 30px; border-radius: 3px; display: inline-block; transition: ease 0.5s; line-height: 30px; text-align: center; font-size: 12px; color: var(--accent-3); cursor: url(https://66.media.tumblr.com/6fb38fc5e97353c67e3fc3a2e2b29bf9/tumblr_inline_ol4nwisGdu1uxxza6_75sq.png), auto!important; [/class] [class=up] margin-bottom: 40px; transition: ease 0.5s; [/class] [class=stab1] transition-delay: 2.2s; [/class] [class=stab2] transition-delay: 2.4s; [/class] [class=stab3] transition-delay: 2.6s; [/class] [class=stab4] transition-delay: 2.8s; [/class] [class=stab5] transition-delay: 3s; [/class] [class=stab6] transition-delay: 3.2s; [/class] [class=tabContents] position: absolute; top: 85px; left: 20px; height: 320px; width: 410px; transition: all .5s; opacity: 0; [/class] [class=fadein] opacity: 1; z-index: 1; transition: all 1.5s; transition-delay: 3.6s; [/class] [class=column] height: 320px; width: 96px; display: flex; justify-content: space-evenly; position: absolute; right: 0; flex-direction: column; [/class] [class=images] height: 92px; width: 92px; border: 2px solid var(--accent-2); [/class] [class=images2] height: 92px; width: 92px; border: 2px solid var(--accent-1); [/class] [class=textbox] position: absolute; left: 0; top: 7px; width: 315px; height: 305px; overflow: hidden; font-size: 12px; white-space: pre-line; line-height: 130%; text-transform: lowercase; [/class] [class=scroll] width: 100%; height: 100%; overflow-y: scroll; padding-right: 17px; color: var(--accent-3); [/class] [class=tag] text-transform: uppercase; display: inline; font-size: 12px; letter-spacing: 1px; text-align: left; font-weight: 600; color: var(--accent-1); [/class] [class name=tab state=hover] background: var(--accent-3); color: var(--accent-1); transition: ease .5s; [/class] [class=chosen] background: var(--accent-3); color: var(--accent-1); transition: ease .5s; [/class] [class=chosen1] background: var(--accent-3); color: var(--accent-1); transition: ease .5s; transition-delay: 2.2s; [/class] [class=show] opacity: 1; transition: all 1s; z-index: 1; [/class] [class=none] pointer-events: none; [/class] [script class=tab on=mouseenter] removeClass stab1 tab1 removeClass stab2 tab2 removeClass stab3 tab3 removeClass stab4 tab4 removeClass stab5 tab5 removeClass stab6 tab6 [/script] [script class=icon on=click] addClass charname charactername addClass roledown role addClass swordin sideword addClass spin icon addClass up tab addClass stab1 tab1 addClass stab2 tab2 addClass stab3 tab3 addClass stab4 tab4 addClass stab5 tab5 addClass stab6 tab6 addClass fadein tabContents1 addClass chosen1 tab1 addClass none icon [/script] [script class=tab1 on=click] addClass show tabContents1 addClass chosen tab1 removeClass show tabContents2 removeClass show tabContents3 removeClass show tabContents4 removeClass show tabContents5 removeClass fadein tabContents1 removeClass chosen tab2 removeClass chosen tab3 removeClass chosen tab4 removeClass chosen tab5 removeClass chosen1 tab1 [/script] [script class=tab2 on=click] addClass show tabContents2 addClass chosen tab2 removeClass show tabContents1 removeClass show tabContents3 removeClass show tabContents4 removeClass show tabContents5 removeClass fadein tabContents1 removeClass chosen tab1 removeClass chosen tab3 removeClass chosen tab4 removeClass chosen tab5 removeClass chosen1 tab1 [/script] [script class=tab3 on=click] addClass show tabContents3 addClass chosen tab3 removeClass show tabContents1 removeClass show tabContents2 removeClass show tabContents4 removeClass show tabContents5 removeClass fadein tabContents1 removeClass chosen tab1 removeClass chosen tab2 removeClass chosen tab4 removeClass chosen tab5 removeClass chosen1 tab1 [/script] [script class=tab4 on=click] addClass show tabContents4 addClass chosen tab4 removeClass show tabContents1 removeClass show tabContents2 removeClass show tabContents3 removeClass show tabContents5 removeClass fadein tabContents1 removeClass chosen tab1 removeClass chosen tab2 removeClass chosen tab3 removeClass chosen tab5 removeClass chosen1 tab1 [/script] [script class=tab5 on=click] addClass show tabContents5 addClass chosen tab5 removeClass show tabContents1 removeClass show tabContents2 removeClass show tabContents3 removeClass show tabContents4 removeClass fadein tabContents1 removeClass chosen tab1 removeClass chosen tab2 removeClass chosen tab3 removeClass chosen tab4 removeClass chosen1 tab1 [/script] [script class=tab6 on=click] removeClass charname charactername removeClass roledown role removeClass swordin sideword removeClass spin icon removeClass up tab removeClass fadein tabContents removeClass show tabContents removeClass chosen1 tab1 removeClass chosen tab removeClass none icon [/script]
 
Last edited:
[class=container] --accent-1: #82E0AA; --accent-2: #82E0AA; --accent-3: #333; --image-1: url(https://i.imgur.com/EiLPh3l.jpg); --image-2: url(https://i.imgur.com/vlYElx2.jpg); --image-3: url(https://i.imgur.com/DtbCBG5.jpg); --image-4: url(https://i.imgur.com/ykoxIeZ.gif); --image-5: url(https://i.imgur.com/lFKNmoB.gif); --image-6: url(https://i.imgur.com/Pi7FI3e.gif); --image-7: url(https://i.imgur.com/F6SewOI.gif); --image-8: url(https://i.imgur.com/6etALvL.gif); --image-9: url(https://i.imgur.com/7W0GL3m.gif); --image-10: url(https://i.imgur.com/TXY9RSo.jpg); --image-11: url(https://i.imgur.com/ljKxwnP.gif); --image-12: url(https://i.imgur.com/DnZ9AeW.gif); --image-13: url(https://i.imgur.com/GR836lS.gif); --image-14: url(https://i.imgur.com/RNMrhfk.gif); --image-15: url(https://i.imgur.com/e9hr08H.gif); --image-16: url(https://i.imgur.com/LxNzK3L.gif); [/class] [div class=credit][/div][div class=credit2 style="display: none;"]code + design by constellation constellation [/div] [class=credit]position: absolute; top: 0px; left: 0px; font-size: 15px; color: #b2e0e0; transition: 1s;[/class] [class=credit2]position: absolute; z-index: 2; top: 5px; left: 15px; max-width: 160px; margin: 15px; font-size: 10px; letter-spacing: 3px; text-align: center; font-weight: 500; text-transform: lowercase; padding: 25px 30px; color: #333; border: 1px solid #e2e2e2; background: white;[/class] [class name="credit" state="hover"]cursor: url(https://66.media.tumblr.com/6fb38fc5e97353c67e3fc3a2e2b29bf9/tumblr_inline_ol4nwisGdu1uxxza6_75sq.png), auto!important; color: #A0C9C9; transitions: 1s;[/class] [script class=credit on=mouseenter]fadeIn 1000 credit2[/script][script class=credit on=mouseleave]fadeOut 1000 credit2[/script]
[div class=container][div class=border][div class=charactername]Michelangelo
[div class=icon][/div] [div class=role]The Medically Insane[/div] [div class=sideword]The Medically Insane[/div] [div class="tabContents tabContents1"][div class=textbox][div class=scroll][div class=tag]full name.[/div]
Michelangelo Hart​
[div class=tag]nicknames.[/div]
Angel​
[div class=tag]age.[/div]
19​
[div class=tag]birthdate.[/div]
December 18​
[div class=tag]gender[/div]
Male​
[div class=tag]country.[/div]
America​
[div class=tag]sexuality.[/div]
bisexual​
[div class=tag]relationship status.[/div]
single​
[div class=tag]spoken languages.[/div]
English​
[/div][/div] [div class=column][div class=images style="background: var(--image-2); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-3); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-4); background-size: cover; background-position: center;"][/div][/div][/div] [div class="tabContents tabContents2"][div class=textbox][div class=scroll][div class=tag]eyes.[/div]
brown.​
[div class=tag]hair.[/div]
curly, brown​
[div class=tag]height.[/div]
6'0​
[div class=tag]body build.[/div]
Athletic​
[div class=tag]distinguishing marks.[/div]
light freckles​
[div class=tag]attire.[/div]
Expensive casual. He dresses pretty nice, especially since his mother is in the fashion scene. Nothing too formal. Just some shorts, pants, and a hoodie or some top.​
[/div][/div] [div class=column][div class=images style="background: var(--image-5); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-6); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-7); background-size: cover; background-position: center;"][/div][/div][/div] [div class="tabContents tabContents3"][div class=textbox][div class=scroll][div class=tag]enneagram.[/div]
information here​
[div class=tag]positive traits.[/div]
~fun loving​
~inquisitive​
~resourceful​
~easy going​
[div class=tag]negative traits.[/div]
~cynical​
~evasive​
~judgmental​
~volatile​
~no impulse control​
[div class=tag]love language.[/div]
information here​
[div class=tag]greatest fear.[/div]
succumbing to his illness​
[div class=tag]priorities, goals and ambitions.[/div]
information here​
[div class=tag]likes.[/div]
information here​
[div class=tag]dislikes.[/div]
information here​
[/div][/div] [div class=column][div class=images style="background: var(--image-8); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-9); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-10); background-size: cover; background-position: center;"][/div][/div][/div] [div class="tabContents tabContents4"][div class=textbox][div class=scroll][div class=tag]the backstory.[/div]
Growing up in the spotlight of a political family made Angel cynical of life and people early on. He saw the dark side of people and what they would do to reach the top. But maybe that's just the life of the wealthy, considering he met his fair share of rich entitled assholes, not that he wasn't one, during his time at school. He only went to the best schools to prepare him for success. His parents made sure that his education came first and drilled into his head how important it was to be well educated.​
However he did find the time to enjoy himself. He's always been up for a good time and was never particular shy.​
Mostly he's really just trying to get by and get though the day. He doesn't usually care enough to spread rumors but he won't say no to some good gossip or even a bit of eavesdropping if something particularly interesting catches his ear. He's careful around some of the people in this town. He dated The Bitch for gods sake. He knows first hand who these people are and what kind of backstabbing they're willing to do to climb the social ladder. And while they may have broken up he does still respect her a bit if only for the fact that she's willing to tell it like it is. Something he;'s personally a fan of. Though through the years he's learned to hold his tongue in certain situations and in front of certain people as not to piss them off and star a war he isn't prepared to fight.​
When he was young he was sent away to a highly regarded prep school out of state where he did most of his schooling. Before he was sent away he had been getting in trouble at home for his behavior, which was written off as childhood playfulness and "boys being boys". And at the time he had started having major mood swings. It wasn't until he had been at boarding school that his symptoms had gotten worse, having not been addressed. He had his first manic episode while away at school and was sent to hospital.​
His parents didn't really understand how to deal with whatever was going on with him and they couldn't leave him at school while they figured it out so they made the decision, along with his doctor, to send him to a psychiatric facility for a few months. This was the first of many times he would be admitted to a facility through his life. However he did get to the point where he could go to school and live a relatively normal life if he continued to take his medication and see the psychologist provided by the school.​
While attending school his grades were good and he made a few friends. As the school year was winding down his dad had a few positions that he could get him but Angel turned them down. That lead to an argument about him needing to be more proactive and ready to get a good job. Angel never saw the need to rush, though. If his dad could get him the position once he could do it again. It wasn't like he needed money desperately. It was also a bit of him not knowing what to do. He didn't want to take up politics like his dad and his mothers path of fashion wasn't what he wanted. He was lost and just needed some time to think and hope that his parents allowed him the grace period he so desperately needed.​
After graduating he returned to his family home, to his parents disappointment. He decided to take a leap year and enjoy time with his best Friend The Obsessive One and just take in all of the beauty and the drama that is his lovely small hometown town. But as much as he'd rather watch the fireworks from a distance one can never sit back and enjoy the show without somehow ending up somewhere in the middle of the fray just as the drama goes off. He hadn't expected anything less, though. This is Ravenpoint after all.​
[/div][/div] [div class=column][div class=images style="background: var(--image-11); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-12); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-13); background-size: cover; background-position: center;"][/div][/div][/div] [div class="tabContents tabContents5"][div class=textbox][div class=scroll][div class=tag]Travis Hart II Living.[/div]
...​
[div class=tag]Marina Hart.[/div]
...​
[div class=tag]N/A[/div]
N/A​
[div class=tag]ISAÍAS HART.[/div]
...​
[/div][/div] [div class=column][div class=images style="background: var(--image-14); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-15); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-16); background-size: cover; background-position: center;"][/div][/div][/div] [div class="tab tab1" style="left: 12px; bottom: -30px;"][/div] [div class="tab tab2" style="left: 85px; bottom: -30px;"][/div] [div class="tab tab3" style="left: 158px; bottom: -30px;"][/div] [div class="tab tab4" style="left: 231px; bottom: -30px;"][/div] [div class="tab tab5" style="left: 304px; bottom: -30px;"][/div] [div class="tab tab6" style="left: 377px; bottom: -30px;"][/div] [/div][/div][/div] [class=container] width: 450px; height: 450px; margin: auto; cursor: url(https://66.media.tumblr.com/232c090ebdd37ae4bc17adb54e1e0344/tumblr_inline_ol4nwhvSwg1uxxza6_75sq.png), auto!important; [/class] [class=border] position: absolute; width: 450px; height: 450px; border: 1px solid #ccc; outline: 1px solid #fafafa; background: #f1f1f1; margin: auto; overflow: hidden; [/class] [class=charactername] position: absolute; width: 450px; top: 75px; right: 0; text-align: center; font-size: 30px; text-transform: uppercase; color: var(--accent-2); font-weight: 900; text-align: center; transition: ease 1s; white-space: nowrap; transition-delay: 1s; [/class] [class=icon] width: 150px; height: 150px; background: var(--image-1); background-size: cover; background-position: center; border-radius: 100%; position: absolute; left: 145px; top: 145px; z-index: 2; border: 5px solid var(--accent-1); transform: rotateY(0deg); transition: ease 1s; cursor: url(https://66.media.tumblr.com/6fb38fc5e97353c67e3fc3a2e2b29bf9/tumblr_inline_ol4nwisGdu1uxxza6_75sq.png), auto!important; [/class] [class=role] position: absolute; bottom: 90px; width: 450px; height: 10px; text-align: center; color: var(--accent-2); font-size: 11px; line-height: 10px; transition: ease 1s; transition-delay: 1s; text-transform: uppercase; [/class] [class=charname] font-size: 15px; top: 34px; right: 10px; width: 170px; transition-delay: 0s; [/class] [class=roledown] bottom: -20px; transition-delay: 0s; [/class] [class=sideword] position: absolute; width: 170px; left: -170px; top: 34px; font: 15px; text-transform: uppercase; color: var(--accent-2); font-weight: 900; text-align: center; transition: ease 1s; box-sizing: border-box; padding-right: 0px; transition-delay: 1s; [/class] [class=swordin] left: 10px; transition-delay: 0s; [/class] [class=spin] top: 15px; left: 190px; width: 60px; height: 60px; transform: rotateY(360deg); transition-delay: 1s; border-width: 2px; [/class] [class=tab] position: absolute; background: var(--accent-1); width: 61px; height: 30px; border-radius: 3px; display: inline-block; transition: ease 0.5s; line-height: 30px; text-align: center; font-size: 12px; color: var(--accent-3); cursor: url(https://66.media.tumblr.com/6fb38fc5e97353c67e3fc3a2e2b29bf9/tumblr_inline_ol4nwisGdu1uxxza6_75sq.png), auto!important; [/class] [class=up] margin-bottom: 40px; transition: ease 0.5s; [/class] [class=stab1] transition-delay: 2.2s; [/class] [class=stab2] transition-delay: 2.4s; [/class] [class=stab3] transition-delay: 2.6s; [/class] [class=stab4] transition-delay: 2.8s; [/class] [class=stab5] transition-delay: 3s; [/class] [class=stab6] transition-delay: 3.2s; [/class] [class=tabContents] position: absolute; top: 85px; left: 20px; height: 320px; width: 410px; transition: all .5s; opacity: 0; [/class] [class=fadein] opacity: 1; z-index: 1; transition: all 1.5s; transition-delay: 3.6s; [/class] [class=column] height: 320px; width: 96px; display: flex; justify-content: space-evenly; position: absolute; right: 0; flex-direction: column; [/class] [class=images] height: 92px; width: 92px; border: 2px solid var(--accent-2); [/class] [class=images2] height: 92px; width: 92px; border: 2px solid var(--accent-1); [/class] [class=textbox] position: absolute; left: 0; top: 7px; width: 315px; height: 305px; overflow: hidden; font-size: 12px; white-space: pre-line; line-height: 130%; text-transform: lowercase; [/class] [class=scroll] width: 100%; height: 100%; overflow-y: scroll; padding-right: 17px; color: var(--accent-3); [/class] [class=tag] text-transform: uppercase; display: inline; font-size: 12px; letter-spacing: 1px; text-align: left; font-weight: 600; color: var(--accent-1); [/class] [class name=tab state=hover] background: var(--accent-3); color: var(--accent-1); transition: ease .5s; [/class] [class=chosen] background: var(--accent-3); color: var(--accent-1); transition: ease .5s; [/class] [class=chosen1] background: var(--accent-3); color: var(--accent-1); transition: ease .5s; transition-delay: 2.2s; [/class] [class=show] opacity: 1; transition: all 1s; z-index: 1; [/class] [class=none] pointer-events: none; [/class] [script class=tab on=mouseenter] removeClass stab1 tab1 removeClass stab2 tab2 removeClass stab3 tab3 removeClass stab4 tab4 removeClass stab5 tab5 removeClass stab6 tab6 [/script] [script class=icon on=click] addClass charname charactername addClass roledown role addClass swordin sideword addClass spin icon addClass up tab addClass stab1 tab1 addClass stab2 tab2 addClass stab3 tab3 addClass stab4 tab4 addClass stab5 tab5 addClass stab6 tab6 addClass fadein tabContents1 addClass chosen1 tab1 addClass none icon [/script] [script class=tab1 on=click] addClass show tabContents1 addClass chosen tab1 removeClass show tabContents2 removeClass show tabContents3 removeClass show tabContents4 removeClass show tabContents5 removeClass fadein tabContents1 removeClass chosen tab2 removeClass chosen tab3 removeClass chosen tab4 removeClass chosen tab5 removeClass chosen1 tab1 [/script] [script class=tab2 on=click] addClass show tabContents2 addClass chosen tab2 removeClass show tabContents1 removeClass show tabContents3 removeClass show tabContents4 removeClass show tabContents5 removeClass fadein tabContents1 removeClass chosen tab1 removeClass chosen tab3 removeClass chosen tab4 removeClass chosen tab5 removeClass chosen1 tab1 [/script] [script class=tab3 on=click] addClass show tabContents3 addClass chosen tab3 removeClass show tabContents1 removeClass show tabContents2 removeClass show tabContents4 removeClass show tabContents5 removeClass fadein tabContents1 removeClass chosen tab1 removeClass chosen tab2 removeClass chosen tab4 removeClass chosen tab5 removeClass chosen1 tab1 [/script] [script class=tab4 on=click] addClass show tabContents4 addClass chosen tab4 removeClass show tabContents1 removeClass show tabContents2 removeClass show tabContents3 removeClass show tabContents5 removeClass fadein tabContents1 removeClass chosen tab1 removeClass chosen tab2 removeClass chosen tab3 removeClass chosen tab5 removeClass chosen1 tab1 [/script] [script class=tab5 on=click] addClass show tabContents5 addClass chosen tab5 removeClass show tabContents1 removeClass show tabContents2 removeClass show tabContents3 removeClass show tabContents4 removeClass fadein tabContents1 removeClass chosen tab1 removeClass chosen tab2 removeClass chosen tab3 removeClass chosen tab4 removeClass chosen1 tab1 [/script] [script class=tab6 on=click] removeClass charname charactername removeClass roledown role removeClass swordin sideword removeClass spin icon removeClass up tab removeClass fadein tabContents removeClass show tabContents removeClass chosen1 tab1 removeClass chosen tab removeClass none icon [/script]
 
[class=container] --accent-1: #A0C9C9; --accent-2: #B2E0E0; --accent-3: #333; --image-1: url(https://therevolutionhasbegunmusic.files.wordpress.com/2018/09/tumblr_pf2ho4wrom1rrwrx4o1_500.gif); --image-2: url(https://media2.giphy.com/media/gearvt0BMcYaA/source.gif); --image-3: url(https://data.whicdn.com/images/107930131/original.gif); --image-4: url(https://media0.giphy.com/media/YU1cRfWoJZn7a/source.gif); --image-5: url(https://media1.giphy.com/media/ebp0EIgPWfHY4/source.gif); --image-6: url(https://media3.giphy.com/media/11yQZgTT6g4kuc/source.gif); --image-7: url(https://media3.giphy.com/media/ZtdR978tIcvGo/source.gif); --image-8: url(https://media3.giphy.com/media/3ccrf8FaSk9gY/source.gif); --image-9: url(https://media1.giphy.com/media/g0EviFmHgiVuojakwQ/source.gif); --image-10: url(https://66.media.tumblr.com/0622cd16b9e39a4b6fc83f9fd118b70f/tumblr_n1fdjrT0yg1qb1gbco3_250.gif); --image-11: url(https://data.whicdn.com/images/122782074/original.gif); --image-12: url(https://data.whicdn.com/images/282363751/original.gif); --image-13: url(https://media0.giphy.com/media/12UnrttDqIUDqo/source.gif); --image-14: url(https://media.giphy.com/media/1l47wBNocyh9u/giphy.gif); --image-15: url(https://media0.giphy.com/media/rGI6yK4hm4kiQ/source.gif); --image-16: url(https://i.pinimg.com/originals/da/ea/5e/daea5ef2348c2433498cafac14f1079e.gif); [/class] [div class=credit][/div][div class=credit2 style="display: none;"]code + design by constellation constellation [/div] [class=credit]position: absolute; top: 0px; left: 0px; font-size: 15px; color: #b2e0e0; transition: 1s;[/class] [class=credit2]position: absolute; z-index: 2; top: 5px; left: 15px; max-width: 160px; margin: 15px; font-size: 10px; letter-spacing: 3px; text-align: center; font-weight: 500; text-transform: lowercase; padding: 25px 30px; color: #333; border: 1px solid #e2e2e2; background: white;[/class] [class name="credit" state="hover"]cursor: url(https://66.media.tumblr.com/6fb38fc5e97353c67e3fc3a2e2b29bf9/tumblr_inline_ol4nwisGdu1uxxza6_75sq.png), auto!important; color: #A0C9C9; transitions: 1s;[/class] [script class=credit on=mouseenter]fadeIn 1000 credit2[/script][script class=credit on=mouseleave]fadeOut 1000 credit2[/script]
[div class=container][div class=border][div class=charactername]Ander Cambridge
[div class=icon][/div] [div class=role]The Bad Boy[/div] [div class=sideword]The Bad Boy[/div] [div class="tabContents tabContents1"][div class=textbox][div class=scroll][div class=tag]full name.[/div]
Ander Hector Cambridge​
[div class=tag]nicknames.[/div]
AC​
[div class=tag]age.[/div]
22​
[div class=tag]birthdate.[/div]
12-03-1998​
[div class=tag]gender[/div]
Male​
[div class=tag]country.[/div]
America​
[div class=tag]sexuality.[/div]
Bisexual​
[div class=tag]relationship status.[/div]
Single​
[div class=tag]spoken languages.[/div]
English​
[/div][/div] [div class=column][div class=images style="background: var(--image-2); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-3); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-4); background-size: cover; background-position: center;"][/div][/div][/div] [div class="tabContents tabContents2"][div class=textbox][div class=scroll][div class=tag]eyes.[/div]
information here.​
[div class=tag]hair.[/div]
Brown​
[div class=tag]height.[/div]
5'7​
[div class=tag]body build.[/div]
Toned and slightly built​
[div class=tag]distinguishing marks.[/div]
information here​
[div class=tag]attire.[/div]
Smart Classic. Ander likes to make sure people know what class he comes from. His style has been known to be flamboyant at times to draw attention and be controversial​
[/div][/div] [div class=column][div class=images style="background: var(--image-5); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-6); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-7); background-size: cover; background-position: center;"][/div][/div][/div] [div class="tabContents tabContents3"][div class=textbox][div class=scroll][div class=tag]enneagram.[/div]
1​
[div class=tag]positive traits.[/div]
Loyal, Supportive, Empathetic​
[div class=tag]negative traits.[/div]
Perfectionist, Quick to temper, Selfish​
[div class=tag]love language.[/div]
information here​
[div class=tag]greatest fear.[/div]
Only being known for his family name​
[div class=tag]priorities, goals and ambitions.[/div]
Ander wants to create an empire like his family but with his reckless attitute he doesnt know where to start. He has the drive to work with his families business and be successful but he wants to create something of his own. The thing is, he doesnt know what.​
[div class=tag]likes.[/div]
Narcotics legal and illegal, vintage cars and smoking​
[div class=tag]dislikes.[/div]
Rules, people outside his social class and colege​
[/div][/div] [div class=column][div class=images style="background: var(--image-8); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-9); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-10); background-size: cover; background-position: center;"][/div][/div][/div] [div class="tabContents tabContents4"][div class=textbox][div class=scroll][div class=tag]the backstory.[/div]
Ander Cambridge is the eldest and most infamous child of the Cambridge siblings. Since he was a child Ander wanted for nothing. His Mother and Father both doted on him and quickly learned that he possessed a wild streak that his siblings didnt. Ander graduated Highschool having barely reached his full potential having chosen parties, drugs and girls as his main studies. While in school he became widely popular for his parties but never became close friends with anyone in his year. He graduated and was to attend an Ivy League college like his parents but things took a different turn. Before he was to go his Father and Mother told him that they saw him as a man of the house now. That the Cambridge family stood with him and that he should stand with his family. His father went on to say how he wanted Ander to ‘rise to the occasion’ and help the family before he left for college. Ander agreed and was quickly told what he must do. There was a rival company to his Fathers. One that was about to buy a majority holding of his fathers company. The plan was to send Ander to meet with the son of the rival company, have Ander show him a wild party and try and get something out of him they could use to stop the deal going ahead. Ander did as he was told and “bumped” into the son at a hotel in the city. The pair had a drink together in the lobby before they began to talk, share and even laugh. Ander found the man to be different to what his fmaily made him out to be and so asked the man to head out for a night on the town! The man agreed and he and Ander spent the night doing anything they could. When the pair stumbled back to the hotel they found themselves about the call it a night when Ander, never one to turn down an impulse, kissed the man. They both stayed in the same room that night. They spent the next week doing whatever they wanted to do together. Both had never been with someone of the same sex and found themselves unable to be apart. Ander returned home ready to tell his family that the deal was off but when he got home they told him that it was too late. Ander had let something slip to their rivals son and he was actually trying to get informaiton out of Ander. Unable to take it all in, Ander explained that he would never as the two have spent the past week as more or less a couple. His Father and Mother both agreed they would use that as blackmail as the man Ander was with was actually engaged to a woman. Anger swept up in Ander and he told his parents if they went ahead with this he wasnt going to their Ivy League college and he was leaving. The pair felt he needed time to cool off as this was a positive thing for the family. That night, Ander left the house and flew to Europe to let everything cool off and for his parents to do whatever they needed to do. Now, Ander is back and no one knows what he’s been up to. Why did he leave? Where was he? Why did he leave? Better yet, why is he back? One thing’s for sure, if anyone knows, it’s his sisters...​
[/div][/div] [div class=column][div class=images style="background: var(--image-11); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-12); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-13); background-size: cover; background-position: center;"][/div][/div][/div] [div class="tabContents tabContents5"][div class=textbox][div class=scroll][div class=tag]father.[/div]
information here​
[div class=tag]mother.[/div]
information here​
[div class=tag]sister.[/div]
information here​
[div class=tag]brother.[/div]
information here​
[/div][/div] [div class=column][div class=images style="background: var(--image-14); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-15); background-size: cover; background-position: center;"][/div] [div class=images style="background: var(--image-16); background-size: cover; background-position: center;"][/div][/div][/div] [div class="tab tab1" style="left: 12px; bottom: -30px;"][/div] [div class="tab tab2" style="left: 85px; bottom: -30px;"][/div] [div class="tab tab3" style="left: 158px; bottom: -30px;"][/div] [div class="tab tab4" style="left: 231px; bottom: -30px;"][/div] [div class="tab tab5" style="left: 304px; bottom: -30px;"][/div] [div class="tab tab6" style="left: 377px; bottom: -30px;"][/div] [/div][/div][/div] [class=container] width: 450px; height: 450px; margin: auto; cursor: url(https://66.media.tumblr.com/232c090ebdd37ae4bc17adb54e1e0344/tumblr_inline_ol4nwhvSwg1uxxza6_75sq.png), auto!important; [/class] [class=border] position: absolute; width: 450px; height: 450px; border: 1px solid #ccc; outline: 1px solid #fafafa; background: #f1f1f1; margin: auto; overflow: hidden; [/class] [class=charactername] position: absolute; width: 450px; top: 75px; right: 0; text-align: center; font-size: 30px; text-transform: uppercase; color: var(--accent-2); font-weight: 900; text-align: center; transition: ease 1s; white-space: nowrap; transition-delay: 1s; [/class] [class=icon] width: 150px; height: 150px; background: var(--image-1); background-size: cover; background-position: center; border-radius: 100%; position: absolute; left: 145px; top: 145px; z-index: 2; border: 5px solid var(--accent-1); transform: rotateY(0deg); transition: ease 1s; cursor: url(https://66.media.tumblr.com/6fb38fc5e97353c67e3fc3a2e2b29bf9/tumblr_inline_ol4nwisGdu1uxxza6_75sq.png), auto!important; [/class] [class=role] position: absolute; bottom: 90px; width: 450px; height: 10px; text-align: center; color: var(--accent-2); font-size: 11px; line-height: 10px; transition: ease 1s; transition-delay: 1s; text-transform: uppercase; [/class] [class=charname] font-size: 15px; top: 34px; right: 10px; width: 170px; transition-delay: 0s; [/class] [class=roledown] bottom: -20px; transition-delay: 0s; [/class] [class=sideword] position: absolute; width: 170px; left: -170px; top: 34px; font: 15px; text-transform: uppercase; color: var(--accent-2); font-weight: 900; text-align: center; transition: ease 1s; box-sizing: border-box; padding-right: 0px; transition-delay: 1s; [/class] [class=swordin] left: 10px; transition-delay: 0s; [/class] [class=spin] top: 15px; left: 190px; width: 60px; height: 60px; transform: rotateY(360deg); transition-delay: 1s; border-width: 2px; [/class] [class=tab] position: absolute; background: var(--accent-1); width: 61px; height: 30px; border-radius: 3px; display: inline-block; transition: ease 0.5s; line-height: 30px; text-align: center; font-size: 12px; color: var(--accent-3); cursor: url(https://66.media.tumblr.com/6fb38fc5e97353c67e3fc3a2e2b29bf9/tumblr_inline_ol4nwisGdu1uxxza6_75sq.png), auto!important; [/class] [class=up] margin-bottom: 40px; transition: ease 0.5s; [/class] [class=stab1] transition-delay: 2.2s; [/class] [class=stab2] transition-delay: 2.4s; [/class] [class=stab3] transition-delay: 2.6s; [/class] [class=stab4] transition-delay: 2.8s; [/class] [class=stab5] transition-delay: 3s; [/class] [class=stab6] transition-delay: 3.2s; [/class] [class=tabContents] position: absolute; top: 85px; left: 20px; height: 320px; width: 410px; transition: all .5s; opacity: 0; [/class] [class=fadein] opacity: 1; z-index: 1; transition: all 1.5s; transition-delay: 3.6s; [/class] [class=column] height: 320px; width: 96px; display: flex; justify-content: space-evenly; position: absolute; right: 0; flex-direction: column; [/class] [class=images] height: 92px; width: 92px; border: 2px solid var(--accent-2); [/class] [class=images2] height: 92px; width: 92px; border: 2px solid var(--accent-1); [/class] [class=textbox] position: absolute; left: 0; top: 7px; width: 315px; height: 305px; overflow: hidden; font-size: 12px; white-space: pre-line; line-height: 130%; text-transform: lowercase; [/class] [class=scroll] width: 100%; height: 100%; overflow-y: scroll; padding-right: 17px; color: var(--accent-3); [/class] [class=tag] text-transform: uppercase; display: inline; font-size: 12px; letter-spacing: 1px; text-align: left; font-weight: 600; color: var(--accent-1); [/class] [class name=tab state=hover] background: var(--accent-3); color: var(--accent-1); transition: ease .5s; [/class] [class=chosen] background: var(--accent-3); color: var(--accent-1); transition: ease .5s; [/class] [class=chosen1] background: var(--accent-3); color: var(--accent-1); transition: ease .5s; transition-delay: 2.2s; [/class] [class=show] opacity: 1; transition: all 1s; z-index: 1; [/class] [class=none] pointer-events: none; [/class] [script class=tab on=mouseenter] removeClass stab1 tab1 removeClass stab2 tab2 removeClass stab3 tab3 removeClass stab4 tab4 removeClass stab5 tab5 removeClass stab6 tab6 [/script] [script class=icon on=click] addClass charname charactername addClass roledown role addClass swordin sideword addClass spin icon addClass up tab addClass stab1 tab1 addClass stab2 tab2 addClass stab3 tab3 addClass stab4 tab4 addClass stab5 tab5 addClass stab6 tab6 addClass fadein tabContents1 addClass chosen1 tab1 addClass none icon [/script] [script class=tab1 on=click] addClass show tabContents1 addClass chosen tab1 removeClass show tabContents2 removeClass show tabContents3 removeClass show tabContents4 removeClass show tabContents5 removeClass fadein tabContents1 removeClass chosen tab2 removeClass chosen tab3 removeClass chosen tab4 removeClass chosen tab5 removeClass chosen1 tab1 [/script] [script class=tab2 on=click] addClass show tabContents2 addClass chosen tab2 removeClass show tabContents1 removeClass show tabContents3 removeClass show tabContents4 removeClass show tabContents5 removeClass fadein tabContents1 removeClass chosen tab1 removeClass chosen tab3 removeClass chosen tab4 removeClass chosen tab5 removeClass chosen1 tab1 [/script] [script class=tab3 on=click] addClass show tabContents3 addClass chosen tab3 removeClass show tabContents1 removeClass show tabContents2 removeClass show tabContents4 removeClass show tabContents5 removeClass fadein tabContents1 removeClass chosen tab1 removeClass chosen tab2 removeClass chosen tab4 removeClass chosen tab5 removeClass chosen1 tab1 [/script] [script class=tab4 on=click] addClass show tabContents4 addClass chosen tab4 removeClass show tabContents1 removeClass show tabContents2 removeClass show tabContents3 removeClass show tabContents5 removeClass fadein tabContents1 removeClass chosen tab1 removeClass chosen tab2 removeClass chosen tab3 removeClass chosen tab5 removeClass chosen1 tab1 [/script] [script class=tab5 on=click] addClass show tabContents5 addClass chosen tab5 removeClass show tabContents1 removeClass show tabContents2 removeClass show tabContents3 removeClass show tabContents4 removeClass fadein tabContents1 removeClass chosen tab1 removeClass chosen tab2 removeClass chosen tab3 removeClass chosen tab4 removeClass chosen1 tab1 [/script] [script class=tab6 on=click] removeClass charname charactername removeClass roledown role removeClass swordin sideword removeClass spin icon removeClass up tab removeClass fadein tabContents removeClass show tabContents removeClass chosen1 tab1 removeClass chosen tab removeClass none icon [/script]
 

Users who are viewing this thread

Back
Top