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

LadybirdMooch · Jan 9, 2020

nO you're gonna me me cry tooooooo T-T

sox · Jan 9, 2020

moonchild. said:
for someone who had several meltdowns over this most recent code, it sure turned out nice

erised · Jan 9, 2020

chezmoi said:
View attachment 666004

oh so i'm the boss now? ( ͡° ͜ʖ ͡°)

sox · Jan 9, 2020

moonchild. said:
oh so i'm the boss now? ( ͡° ͜ʖ ͡°)

h-hai, moon-sama (>.<)

erised · Jan 9, 2020

chezmoi said:
h-hai, moon-sama (>.<)

was gonna say something that's definitely not rpn appropriate but i managed to restrain myself

logastellus · Jan 9, 2020

hun lets get these codes~

sox · Jan 28, 2020

JUGGERNAUT - MOBILE FRIENDLY

how long has it been since i made an ic code??? i made this for my own use which is why it's a littttttttle hacky. i also was so desperate to avoid animations that i used a v unconventional method so pls forgive me if it makes you wanna vomit. other than that, you scroll to get to the text, and hovering over the pic shows character stats. the circular pic hovers too! i put a comment about this inside the code, but if you want the name to be centered and it's not already, you have to increase/decrease the letter-spacing property in the "name" class, which is currently set at 5px. also, to change the colors, just change the two hex values at the top of the code in the "container" class. please do not remove the credit! enjoy peeps and lmk if u have any requests! c:

[class=container] --main: #C1C6CC; --accent: #12161F; position: relative; overflow: hidden; width: 18.5em; height: 25em; margin-left: auto; margin-right: auto; background-color: var(--main); padding: 0.5em; box-shadow: 5px 5px 0px var(--accent); [/class] [class=pic] position: relative; width: 97%; height: 100%; color: #fff; background: url('https://rp-online.de/imgs/32/5/6/2/9/2/5/0/7/tok_f1a8d88c1cf0435009076ddec9aa3766/w1900_h2375_x888_y817_YANGYANG-36739e0e24d2c1db.jpg'); background-size: 135%; text-align: left; [/class] [class=name] position: relative; width: auto; height: 1.5em; font-size: 1.5em; color: var(--accent); text-transform: lowercase; text-align: left; padding-top: 14em; font-weight: 700; text-shadow: 2px 2px 0px white; overflow: hidden; padding-left: 1.5em; letter-spacing: 5px; transition-duration: 0.3s; [/class] [class name=name state=hover] padding-top: 1em; padding-bottom: 15em; background-color: var(--main); transition-duration: 0.3s; [/class] [class=text] position: relative; height: auto; color: var(--accent); overflow: visible; padding: 15px 5px 15px 5px; font-size: 10px; line-height: 12px; text-align: justify; [/class] [class=circlepic] width: 5em; height: 5em; border-radius: 30em; margin-left: 2em; background: url(https://ih0.redbubble.net/image.835646940.1663/flat,1000x1000,075,f.u1.jpg); background-size: 100%; margin-top: 1em; box-shadow: 3px 3px 0px var(--accent); transition-duration: 0.1s; [/class] [class name=circlepic state=hover] background: url(https://i.pinimg.com/originals/39/d1/f9/39d1f980b89ce1ea661e94e36ba1c87b.jpg); background-size: 150%; background-position: 30% 10%; transition-duration: 0.1s; [/class] [class=content] position: relative; overflow: auto; width: 20em; height: 25em; color: #fff; padding-right: 2em; [/class] [class=postinfo] font-size: 0.5em; color: var(--accent); text-align: center; margin-left: -3em; line-height: 2em; text-shadow: 0.75px 0.75px 0px white; letter-spacing: 0em; [/class] [class=credit] position: relative; overflow: hidden; width: 100%; height: 10px; text-align: center; font-style: normal; font-weight: normal; font-size: 8px; color: #dedede; opacity: 0.25; [/class] [div class=container][div class=content] [div class=pic] [div class=name]

↓ juggernaut.

[div class=circlepic][/div]
[div class=postinfo]outfit: robes
mood: x
interactions: none
tags: none [/div] [/div] [/div] [div class=text]

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Sodales ut etiam sit amet nisl. Praesent elementum facilisis leo vel. Tellus cras adipiscing enim eu turpis. Diam vulputate ut pharetra sit amet. Non tellus orci ac auctor augue mauris augue neque. Adipiscing elit pellentesque habitant morbi tristique senectus. Blandit cursus risus at ultrices mi tempus. Vel elit scelerisque mauris pellentesque pulvinar pellentesque. Nec dui nunc mattis enim ut tellus. Vivamus at augue eget arcu dictum varius duis. Nascetur ridiculus mus mauris vitae. Tristique nulla aliquet enim tortor. Nunc congue nisi vitae suscipit tellus mauris a. Tristique et egestas quis ipsum suspendisse ultrices gravida. Eu lobortis elementum nibh tellus molestie nunc non.

Sed nisi lacus sed viverra tellus in hac. In hendrerit gravida rutrum quisque non tellus orci ac. Ut pharetra sit amet aliquam id diam maecenas. Nulla facilisi cras fermentum odio eu feugiat. Leo integer malesuada nunc vel risus commodo viverra. Cursus sit amet dictum sit amet. Amet luctus venenatis lectus magna fringilla. Vulputate eu scelerisque felis imperdiet. Urna et pharetra pharetra massa massa ultricies mi quis hendrerit. Amet mattis vulputate enim nulla aliquet porttitor lacus. Amet massa vitae tortor condimentum lacinia. Vitae congue mauris rhoncus aenean vel. Donec enim diam vulputate ut pharetra sit amet aliquam. Id cursus metus aliquam eleifend mi in nulla. Enim lobortis scelerisque fermentum dui. Nec ultrices dui sapien eget mi. Quisque sagittis purus sit amet. Tempus quam pellentesque nec nam. Eu ultrices vitae auctor eu augue.

Quam vulputate dignissim suspendisse in. Adipiscing at in tellus integer feugiat. Phasellus vestibulum lorem sed risus ultricies tristique nulla aliquet enim. Volutpat lacus laoreet non curabitur gravida arcu ac. Varius duis at consectetur lorem. Aliquam eleifend mi in nulla posuere sollicitudin. Vitae et leo duis ut diam. Mauris cursus mattis molestie a iaculis at. Ultrices vitae auctor eu augue. Sed egestas egestas fringilla phasellus faucibus scelerisque eleifend donec pretium. Sed velit dignissim sodales ut eu sem integer vitae justo. Eu facilisis sed odio morbi quis commodo odio aenean. Odio ut enim blandit volutpat maecenas volutpat blandit aliquam etiam. Consectetur a erat nam at lectus urna duis convallis. Id eu nisl nunc mi ipsum faucibus vitae aliquet. Elit scelerisque mauris pellentesque pulvinar pellentesque habitant. Bibendum arcu vitae elementum curabitur vitae nunc sed velit. Fringilla phasellus faucibus scelerisque eleifend. Diam vulputate ut pharetra sit amet aliquam.

Nunc mattis enim ut tellus elementum sagittis vitae et. Leo integer malesuada nunc vel risus commodo viverra maecenas accumsan. Volutpat sed cras ornare arcu dui vivamus arcu. Ut ornare lectus sit amet est placerat in egestas. Velit aliquet sagittis id consectetur. Eget nulla facilisi etiam dignissim diam quis enim. Euismod nisi porta lorem mollis. Lacinia at quis risus sed vulputate odio. Est pellentesque elit ullamcorper dignissim cras. Sodales neque sodales ut etiam sit amet nisl purus in. Donec et odio pellentesque diam volutpat. Sit amet nulla facilisi morbi tempus. Justo nec ultrices dui sapien eget mi proin sed libero. Lectus nulla at volutpat diam ut venenatis. Leo in vitae turpis massa sed elementum tempus egestas sed. Quam quisque id diam vel. Risus viverra adipiscing at in tellus integer feugiat scelerisque varius. Lacus viverra vitae congue eu consequat. Velit dignissim sodales ut eu sem integer vitae justo eget.

Velit scelerisque in dictum non consectetur a. Elementum facilisis leo vel fringilla est ullamcorper eget nulla facilisi. Nec ullamcorper sit amet risus nullam eget felis. Eu ultrices vitae auctor eu augue ut lectus. Vitae tortor condimentum lacinia quis vel eros donec. Ipsum dolor sit amet consectetur adipiscing. Pellentesque habitant morbi tristique senectus et netus. Sagittis aliquam malesuada bibendum arcu vitae elementum. Pretium viverra suspendisse potenti nullam ac tortor vitae. Pellentesque habitant morbi tristique senectus. Sit amet justo donec enim diam. Mattis ullamcorper velit sed ullamcorper morbi. Arcu vitae elementum curabitur vitae nunc sed. A iaculis at erat pellentesque adipiscing commodo elit. Iaculis nunc sed augue lacus viverra.

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

sox [/div]

Code:

[nobr]
    [class=container]
        --main: #C1C6CC;
        --accent: #12161F;
        position: relative;
        overflow: hidden;
        width: 18.5em;
        height: 25em;
        margin-left: auto;
        margin-right: auto;
        background-color: var(--main);
        padding: 0.5em;
        box-shadow: 5px 5px 0px var(--accent);
    [/class]
[class=pic]
        position: relative;
        width: 97%;
        height: 100%;
        color: #fff;
        background: url('https://rp-online.de/imgs/32/5/6/2/9/2/5/0/7/tok_f1a8d88c1cf0435009076ddec9aa3766/w1900_h2375_x888_y817_YANGYANG-36739e0e24d2c1db.jpg');
        background-size: 135%;
        text-align: left;
    [/class]
    [class=name]
        position: relative;
        width: auto;
        height: 1.5em;
        font-size: 1.5em;
        color: var(--accent);
        text-transform: lowercase;
        text-align: left;
        padding-top: 14em;
        font-weight: 700;
        text-shadow: 2px 2px 0px white;
        overflow: hidden;
        padding-left: 1.5em;
        letter-spacing: 5px;
        transition-duration: 0.3s;
    [/class]
    [class name=name state=hover]
        padding-top: 1em;
        padding-bottom: 15em;
        background-color: var(--main);
        transition-duration: 0.3s;
    [/class]
    [class=text]
        position: relative;
        height: auto;
        color: var(--accent);
        overflow: visible;
        padding: 15px 5px 15px 5px;
        font-size: 10px;
        line-height: 12px;
        text-align: justify;
    [/class]
    [class=circlepic]
        width: 5em;
        height: 5em;
        border-radius: 30em;
        margin-left: 2em;
        background: url(https://ih0.redbubble.net/image.835646940.1663/flat,1000x1000,075,f.u1.jpg);
        background-size: 100%;
        margin-top: 1em;
        box-shadow: 3px 3px 0px var(--accent);
        transition-duration: 0.1s;
    [/class]
    [class name=circlepic state=hover]
        background: url(https://i.pinimg.com/originals/39/d1/f9/39d1f980b89ce1ea661e94e36ba1c87b.jpg);
        background-size: 150%;
        background-position: 30% 10%;
        transition-duration: 0.1s;
    [/class]
    [class=content]
        position: relative;
        overflow: auto;
        width: 20em;
        height: 25em;
        color: #fff;
        padding-right: 2em;
    [/class]
    [class=postinfo]
        font-size: 0.5em;
        color: var(--accent);
        text-align: center;
        margin-left: -3em;
        line-height: 2em;
        text-shadow: 0.75px 0.75px 0px white;
        letter-spacing: 0em;
    [/class]
[class=credit]
        position: relative;
        overflow: hidden;
        width: 100%;
        height: 10px;
        text-align: center;
        font-style: normal;
        font-weight: normal;
        font-size: 8px;
        color: #dedede;
        opacity: 0.25;
[/class]
   [div class=container][div class=content]
      [div class=pic]
         [div class=name][comment] you can adjust the "letter-spacing: 5px" property to have the name spread out enough that it's centered when you hover over it, if the name is too short or too long. [/comment]
            [div=background-color: var(--main);width:auto;padding-left: 0.5em;][font=Athiti]↓ juggernaut.[/font][/div]
            [div class=circlepic][/div][br][/br]
            [div class=postinfo]outfit: [URL='https://i.imgur.com/1YOY9bn.png'][color=#5d73a8]robes[/color][/URL]
               [br][/br]mood: x
               [br][/br]interactions: none
               [br][/br]tags: none
            [/div]
         [/div]
      [/div]
      [div class=text][div=width: 95%; padding-left:1%;][font=Quicksand]Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Sodales ut etiam sit amet nisl. Praesent elementum facilisis leo vel. Tellus cras adipiscing enim eu turpis. Diam vulputate ut pharetra sit amet. Non tellus orci ac auctor augue mauris augue neque. Adipiscing elit pellentesque habitant morbi tristique senectus. Blandit cursus risus at ultrices mi tempus. Vel elit scelerisque mauris pellentesque pulvinar pellentesque. Nec dui nunc mattis enim ut tellus. Vivamus at augue eget arcu dictum varius duis. Nascetur ridiculus mus mauris vitae. Tristique nulla aliquet enim tortor. Nunc congue nisi vitae suscipit tellus mauris a. Tristique et egestas quis ipsum suspendisse ultrices gravida. Eu lobortis elementum nibh tellus molestie nunc non.
[br][/br][br][/br]
Sed nisi lacus sed viverra tellus in hac. In hendrerit gravida rutrum quisque non tellus orci ac. Ut pharetra sit amet aliquam id diam maecenas. Nulla facilisi cras fermentum odio eu feugiat. Leo integer malesuada nunc vel risus commodo viverra. Cursus sit amet dictum sit amet. Amet luctus venenatis lectus magna fringilla. Vulputate eu scelerisque felis imperdiet. Urna et pharetra pharetra massa massa ultricies mi quis hendrerit. Amet mattis vulputate enim nulla aliquet porttitor lacus. Amet massa vitae tortor condimentum lacinia. Vitae congue mauris rhoncus aenean vel. Donec enim diam vulputate ut pharetra sit amet aliquam. Id cursus metus aliquam eleifend mi in nulla. Enim lobortis scelerisque fermentum dui. Nec ultrices dui sapien eget mi. Quisque sagittis purus sit amet. Tempus quam pellentesque nec nam. Eu ultrices vitae auctor eu augue.
[br][/br][br][/br]
Quam vulputate dignissim suspendisse in. Adipiscing at in tellus integer feugiat. Phasellus vestibulum lorem sed risus ultricies tristique nulla aliquet enim. Volutpat lacus laoreet non curabitur gravida arcu ac. Varius duis at consectetur lorem. Aliquam eleifend mi in nulla posuere sollicitudin. Vitae et leo duis ut diam. Mauris cursus mattis molestie a iaculis at. Ultrices vitae auctor eu augue. Sed egestas egestas fringilla phasellus faucibus scelerisque eleifend donec pretium. Sed velit dignissim sodales ut eu sem integer vitae justo. Eu facilisis sed odio morbi quis commodo odio aenean. Odio ut enim blandit volutpat maecenas volutpat blandit aliquam etiam. Consectetur a erat nam at lectus urna duis convallis. Id eu nisl nunc mi ipsum faucibus vitae aliquet. Elit scelerisque mauris pellentesque pulvinar pellentesque habitant. Bibendum arcu vitae elementum curabitur vitae nunc sed velit. Fringilla phasellus faucibus scelerisque eleifend. Diam vulputate ut pharetra sit amet aliquam.
[br][/br][br][/br]
Nunc mattis enim ut tellus elementum sagittis vitae et. Leo integer malesuada nunc vel risus commodo viverra maecenas accumsan. Volutpat sed cras ornare arcu dui vivamus arcu. Ut ornare lectus sit amet est placerat in egestas. Velit aliquet sagittis id consectetur. Eget nulla facilisi etiam dignissim diam quis enim. Euismod nisi porta lorem mollis. Lacinia at quis risus sed vulputate odio. Est pellentesque elit ullamcorper dignissim cras. Sodales neque sodales ut etiam sit amet nisl purus in. Donec et odio pellentesque diam volutpat. Sit amet nulla facilisi morbi tempus. Justo nec ultrices dui sapien eget mi proin sed libero. Lectus nulla at volutpat diam ut venenatis. Leo in vitae turpis massa sed elementum tempus egestas sed. Quam quisque id diam vel. Risus viverra adipiscing at in tellus integer feugiat scelerisque varius. Lacus viverra vitae congue eu consequat. Velit dignissim sodales ut eu sem integer vitae justo eget.
[br][/br][br][/br]
Velit scelerisque in dictum non consectetur a. Elementum facilisis leo vel fringilla est ullamcorper eget nulla facilisi. Nec ullamcorper sit amet risus nullam eget felis. Eu ultrices vitae auctor eu augue ut lectus. Vitae tortor condimentum lacinia quis vel eros donec. Ipsum dolor sit amet consectetur adipiscing. Pellentesque habitant morbi tristique senectus et netus. Sagittis aliquam malesuada bibendum arcu vitae elementum. Pretium viverra suspendisse potenti nullam ac tortor vitae. Pellentesque habitant morbi tristique senectus. Sit amet justo donec enim diam. Mattis ullamcorper velit sed ullamcorper morbi. Arcu vitae elementum curabitur vitae nunc sed. A iaculis at erat pellentesque adipiscing commodo elit. Iaculis nunc sed augue lacus viverra.
      [/font][/div][/div]
   [/div][/div][/nobr][div class=credit]code by [USER=2383][COLOR=#dedede]sox[/COLOR][/USER][/div]

sox · Jan 30, 2020

REDAMANCY - MOBILE FRIENDLY

here's an extremely simple placeholder code that i made bc i was bored in my poli sci class lol idek anymore. i do have an idea for a pair of twin codes that i'm working on tho so pls anticipate it! please do not remove the credit! enjoy peeps and lmk if u have any requests! c:

[class=bkgd] --text-color: #8ca345; --shift-color: #a34b45; position: relative; margin-left: auto; margin-right: auto; width: 20em; height: auto; padding-top: 2em; [/class] [class=pic] position: relative; width: 8em; height: 8em; border-radius: 10em; background: url(https://i.pinimg.com/474x/23/07/03/230703cb64cf0491d84709eb87bc108d.jpg); background-size: 100%; background-position: 50% 50%; margin-left: auto; margin-right: auto; box-shadow: 3px 3px 0px #000; animation: {post_id}hover 2s linear infinite; [/class] [class=shadow] position: relative; overflow: visible; margin-right: auto; margin-bottom: 1.5em; margin-left: auto; width: 6em; height: .5em; top: 1em; background: #000; border-radius: 100%; animation: {post_id}resize 2s linear infinite; [/class] [class=content] position: relative; width: 100%; height: auto; color: var(--text-color); animation: {post_id}textresize 2s linear infinite; [/class] [class=credit] position: relative; overflow: hidden; width: 100%; height: 10px; text-align: center; font-style: normal; font-weight: normal; font-size: 5px; color: #dedede; opacity: 0.1; [/class] [animation=hover] [keyframe=0]transform: translateY(0.3em);[/keyframe] [keyframe=50]transform: translateY(-0.3em);[/keyframe] [keyframe=100]transform: translateY(0.3em);[/keyframe] [/animation] [animation=resize] [keyframe=0]transform: scale(1.1);[/keyframe] [keyframe=50]transform: scale(0.9);[/keyframe] [keyframe=100]transform: scale(1.1);[/keyframe] [/animation] [animation=textresize] [keyframe=0]transform: scale(1.01);[/keyframe] [keyframe=50]transform: scale(0.99);[/keyframe] [keyframe=100]transform: scale(1.01);[/keyframe] [/animation] [class=name] position: relative; width: 100%; height: auto; text-align: center; font-size: 35px; text-transform: uppercase; line-height: 30px; margin-top: 10px; text-shadow: 3px 3px 0px #000; [/class] [class=role] position: relative; width: 100%; height: auto; text-align: center; font-size: 20px; text-transform: uppercase; line-height: 22px; margin-top: 2px; [/class] [class=fc] position: relative; width: 100%; height: auto; text-align: center; font-size: 12px; text-transform: uppercase; line-height: 12px; margin-top: 2px; [/class] [div class=bkgd] [div class=pic][/div] [div class=shadow][/div] [div class=content] [div class=name]redamancy[/div] [div class=role]the team captain[/div] [div class=fc]fc: kim hongjoong[/div] [/div] [/div] [div class=credit]code by

sox [/div]

Code:

[nobr]
[class=bkgd]
     --text-color: #8ca345;
     --shift-color: #a34b45;
     position: relative;
     margin-left: auto;
     margin-right: auto;
     width: 20em;
     height: auto;
     padding-top: 2em;
[/class]

[class=pic]
     position: relative;
     width: 8em;
     height: 8em;
     border-radius: 10em;
     background: url(https://i.pinimg.com/474x/23/07/03/230703cb64cf0491d84709eb87bc108d.jpg);
     background-size: 100%;
     background-position: 50% 50%;
     margin-left: auto;
     margin-right: auto;
     box-shadow: 3px 3px 0px #000;
     animation: {post_id}hover 2s linear infinite;
[/class]

[class=shadow]
     position: relative;
     overflow: visible;
     margin-right: auto;
     margin-bottom: 1.5em;
     margin-left: auto;
     width: 6em;
     height: .5em;
     top: 1em;
     background: #000;
     border-radius: 100%;
     animation: {post_id}resize 2s linear infinite;
[/class]

[class=content]
     position: relative;
     width: 100%;
     height: auto;
     color: var(--text-color);
     animation: {post_id}textresize 2s linear infinite;
[/class]

[class=credit]
        position: relative;
        overflow: hidden;
        width: 100%;
        height: 10px;
        text-align: center;
        font-style: normal;
        font-weight: normal;
        font-size: 5px;
        color: #dedede;
        opacity: 0.1;
[/class]

[animation=hover]
   [keyframe=0]transform: translateY(0.3em);[/keyframe]
   [keyframe=50]transform: translateY(-0.3em);[/keyframe]
   [keyframe=100]transform: translateY(0.3em);[/keyframe]
[/animation]

[animation=resize]
   [keyframe=0]transform: scale(1.1);[/keyframe]
   [keyframe=50]transform: scale(0.9);[/keyframe]
   [keyframe=100]transform: scale(1.1);[/keyframe]
[/animation]

[animation=textresize]
   [keyframe=0]transform: scale(1.01);[/keyframe]
   [keyframe=50]transform: scale(0.99);[/keyframe]
   [keyframe=100]transform: scale(1.01);[/keyframe]
[/animation]

[class=name]
     position: relative;
     width: 100%;
     height: auto;
     text-align: center;
     font-size: 35px;
     text-transform: uppercase;
     line-height: 30px;
     margin-top: 10px;
     text-shadow: 3px 3px 0px #000;
[/class]

[class=role]
     position: relative;
     width: 100%;
     height: auto;
     text-align: center;
     font-size: 20px;
     text-transform: uppercase;
     line-height: 22px;
     margin-top: 2px;
[/class]

[class=fc]
     position: relative;
     width: 100%;
     height: auto;
     text-align: center;
     font-size: 12px;
     text-transform: uppercase;
     line-height: 12px;
     margin-top: 2px;
[/class]

[div class=bkgd]
     [div class=pic][/div]
     [div class=shadow][/div]
     [div class=content]
          [div class=name][font=Alatsi]redamancy[/font][/div]
          [div class=role][font=Alatsi]the team captain[/font][/div]
          [div class=fc][font=Alatsi]fc: kim hongjoong[/font][/div]
     [/div]
[/div]
[/nobr][div class=credit]code by [USER=2383][COLOR=#dedede]sox[/COLOR][/USER][/div]

constellation · Jan 30, 2020

sox · Jan 30, 2020

constellation said:

if you don't stop being my favorite i'm gonna have to kith kith. this is ur warning

constellation · Jan 30, 2020

chezmoi said:
if you don't stop being my favorite i'm gonna have to kith kith. this is ur warning

i am... not opposed to this though..

so here u go, take my monies please

sox · Jan 31, 2020

NYCTOPHILIAC - MOBILE FRIENDLY

part one! a cute lil character sheet i made in one go bc i felt inspired this week and desperately needed some more mobile friendly codes. click on the name, moon, or pic to enter the sheet, and the text scrolls c: please do not remove the credit! enjoy peeps and lmk if u have any requests! c:

[class=content] position: relative; width: 300px; height: 400px; margin-right: auto; margin-left: auto; overflow: hidden; --bkgd-color: #00142E; --text-color: #fff; --accent-color: #f53d59; cursor: url('https://i.imgur.com/FMvuswx.png'), auto; [/class] [class=homebkgd] box-sizing: border-box; position: absolute; width: 100%; height: 100%; background-color: var(--bkgd-color); [/class] [class=intro] position: absolute; width: 100%; height: auto; color: var(--text-color); font-size: 10px; letter-spacing: 5px; text-transform: uppercase; text-align: center; top: 10%; [/class] [class=name] position: absolute; width: 100%; height: auto; color: var(--text-color); font-size: 22px; letter-spacing: 5px; text-transform: uppercase; text-align: center; text-shadow: 2px 2px 0px var(--accent-color); top: 13%; [/class] [class=role] position: absolute; width: 100%; height: auto; color: var(--text-color); font-size: 15px; letter-spacing: 5px; text-transform: uppercase; text-align: center; top: 20%; [/class] [class=line] position: absolute; width: 80%; height: 1px; border-radius: 10px; background-color: var(--accent-color); top: 28%; left: 10%; [/class] [class=icon] position: absolute; width: 5%; height: 15px; background: url(https://imgur.com/8ynbcEf.png); background-size: 100%; top: 32%; left: 47.5%; transition-duration: 0.5s; animation:{post_id}throb 10s linear infinite; [/class] [class=pic] position: absolute; width: 80%; height: 52%; background: url(https://i.pinimg.com/474x/6a/3d/ea/6a3dea6b244e6494ff6580f7d1fb48d1.jpg); background-size: 130%; background-position: 0% 30%; top: 40%; left: 10%; border: 0.5px solid var(--accent-color); [/class] [animation=throb] [keyframe=0]transform: scale(1.5);[/keyframe] [keyframe=10]transform: scale(0.95);[/keyframe] [keyframe=20]transform: scale(1.5);[/keyframe] [keyframe=30]transform: scale(0.95);[/keyframe] [keyframe=40]transform: scale(1.5);[/keyframe] [keyframe=50]transform: scale(0.95);[/keyframe] [keyframe=60]transform: scale(1.5);[/keyframe] [keyframe=70]transform: scale(0.95);[/keyframe] [keyframe=80]transform: scale(1.5);[/keyframe] [keyframe=90]transform: scale(0.95);[/keyframe] [keyframe=100]transform: scale(1.5);[/keyframe] [/animation] [script class=button on=click] addClass slideup homebkgd [/script] [class=slideup] animation-name: {post_id}slup; animation-duration: 1.7s; animation-fill-mode: forwards; [/class] [animation=slup] [keyframe=0]transform: translateY(0%);[/keyframe] [keyframe=100]transform: translateY(-100%);visibility:hidden;[/keyframe] [/animation] [class=bkgd] position: absolute; width: 100%; height: 100%; background-color: var(--bkgd-color); [/class] [class=header] position: absolute; width: 80%; height: auto; color: var(--text-color); font-size: 22px; letter-spacing: 0px; text-transform: uppercase; text-align: left; top: 6%; left: 10%; [/class] [class=tabcontainer] position: absolute; height: 20px; width: auto; top: 7.2%; left: 63%; [/class] [class=tab] position: relative; color: var(--text-color); width: 20px; height: 10px; display: inline; font-size: 15px; padding: 0px 5px 0px 6px; transition-duration: 0.3s; [/class] [class name=tab state=hover] color: var(--accent-color); transition-duration: 0.3s; [/class] [class=textcontainer] position: absolute; overflow: hidden; top: 18%; left: 10%; width: 90%; height: 75%; [/class] [class=text] position: relative; overflow: auto; width: 255px; height: 100%; font-size: 10px; line-height: 12px; color: var(--text-color); text-align: justify; text-transform: lowercase; padding-right: 50px; [/class] [class=tag] position: relative; display: inline; width: auto; height: auto; color: var(--accent-color); text-transform: uppercase; margin-right: 5px; text-decoration: underline; font-weight: 700; [/class] [class=credit] position: relative; overflow: hidden; width: 100%; height: 10px; text-align: center; font-style: normal; font-weight: normal; font-size: 8px; color: #dedede; opacity: 0.25; [/class] [script class=tab on=click] hide tabsContent set currentTab (getText) if (eq ${currentTab} 1) (fadeIn 500 tabsContent1) if (eq ${currentTab} 2) (fadeIn 500 tabsContent2) if (eq ${currentTab} 3) (fadeIn 500 tabsContent3) if (eq ${currentTab} 4) (fadeIn 500 tabsContent4) [/script] [div class=content] [div class=bkgd] [div class=line style="top: 5%;"][/div] [div class="header tabsContent tabsContent1"]basics[/div] [div class="header tabsContent tabsContent2" style="display:none;"]persona[/div] [div class="header tabsContent tabsContent3" style="display:none;"]backstory[/div] [div class="header tabsContent tabsContent4" style="display:none;"]misc.[/div] [div class=line style="top: 15%;"][/div] [div class=tabcontainer] [div class=tab]1[/div] [div class=tab]2[/div] [div class=tab]3[/div] [div class=tab]4[/div] [/div] [div class="textcontainer tabsContent tabsContent1"][div class=text] [div class=tag]name:[/div] jung wooyoung

[div class=tag]nickname:[/div] woo to his close friends, wooyoung to everyone else

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

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

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

[div class=tag]role:[/div] the hunter

[div class=tag]faceclaim:[/div] jung wooyoung

[div class=tag]d.o.b:[/div] 11-26-99

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

[div class=tag]weight:[/div] 160lbs

[div class=tag]hair color:[/div] silver

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

[div class=tag]dist. marks:[/div] dimples

[div class=tag]body mods:[/div] several ear piercings [/div][/div] [div class="textcontainer tabsContent tabsContent2" style="display:none;"][div class=text] [div class=tag]vices:[/div] Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Lacus luctus accumsan tortor posuere. Tristique et egestas quis ipsum suspendisse. Mattis rhoncus urna neque viverra. Imperdiet proin fermentum leo vel orci porta non. In arcu cursus euismod quis viverra nibh cras pulvinar. Fringilla ut morbi tincidunt augue interdum velit euismod in pellentesque. Molestie nunc non blandit massa enim nec. Purus non enim praesent elementum. Mauris commodo quis imperdiet massa tincidunt nunc. Nunc aliquet bibendum enim facilisis gravida neque. Mi tempus imperdiet nulla malesuada pellentesque elit eget gravida cum. Imperdiet massa tincidunt nunc pulvinar sapien. Ipsum a arcu cursus vitae.

[div class=tag]virtues:[/div] A cras semper auctor neque vitae tempus. Nunc mi ipsum faucibus vitae aliquet. Tempus iaculis urna id volutpat lacus laoreet non. Turpis egestas integer eget aliquet. Amet luctus venenatis lectus magna fringilla urna porttitor rhoncus. A iaculis at erat pellentesque adipiscing commodo. Duis at consectetur lorem donec massa sapien faucibus et molestie. Posuere morbi leo urna molestie at. Ridiculus mus mauris vitae ultricies leo. Porta nibh venenatis cras sed felis eget velit aliquet.

[div class=tag]strengths:[/div] Purus faucibus ornare suspendisse sed nisi lacus sed. Mi ipsum faucibus vitae aliquet nec ullamcorper sit amet. Mauris commodo quis imperdiet massa tincidunt nunc pulvinar sapien. Euismod in pellentesque massa placerat duis.

[div class=tag]weaknesses:[/div] Id eu nisl nunc mi ipsum. Euismod elementum nisi quis eleifend quam adipiscing vitae. Nibh nisl condimentum id venenatis a condimentum vitae sapien pellentesque. Lacus laoreet non curabitur gravida arcu ac tortor. Convallis aenean et tortor at risus viverra.

[div class=tag]fears:[/div] Vulputate enim nulla aliquet porttitor lacus luctus accumsan tortor. Sapien pellentesque habitant morbi tristique senectus et.

[div class=tag]ambitions:[/div] Mauris vitae ultricies leo integer malesuada nunc vel. Turpis egestas pretium aenean pharetra magna ac placerat vestibulum lectus. Malesuada fames ac turpis egestas sed. Sagittis eu volutpat odio facilisis mauris sit amet.

[div class=tag]likes:[/div] Fringilla est ullamcorper eget nulla. Vulputate sapien nec sagittis aliquam malesuada bibendum arcu vitae elementum. Molestie at elementum eu facilisis sed odio morbi. Arcu risus quis varius quam quisque id diam vel quam.

[div class=tag]dislikes:[/div] Scelerisque felis imperdiet proin fermentum leo vel. Sit amet mauris commodo quis imperdiet massa tincidunt nunc. Integer feugiat scelerisque varius morbi enim nunc faucibus a. Morbi tristique senectus et netus et malesuada. Sagittis nisl rhoncus mattis rhoncus urna neque.

[div class=tag]habits/quirks:[/div] Vel elit scelerisque mauris pellentesque pulvinar pellentesque habitant. Aenean pharetra magna ac placerat.

[div class=tag]ailments:[/div] Sed augue lacus viverra vitae. Urna et pharetra pharetra massa massa ultricies. Senectus et netus et malesuada fames ac. [/div][/div] [div class="textcontainer tabsContent tabsContent3" style="display:none;"][div class=text] [div class=tag]family:[/div] Turpis egestas integer eget aliquet. Amet luctus venenatis lectus magna.

[div class=tag]residence:[/div] A cras semper auctor.

[div class=tag]education:[/div] Purus faucibus ornare suspendisse.

[div class=tag]history:[/div] Duis at consectetur lorem donec massa sapien faucibus et molestie. Posuere morbi leo urna molestie at. Ridiculus mus mauris vitae ultricies leo. Porta nibh venenatis cras sed felis eget velit aliquet. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Lacus luctus accumsan tortor posuere. Tristique et egestas quis ipsum suspendisse. Mattis rhoncus urna neque viverra. Imperdiet proin fermentum leo vel orci porta non. In arcu cursus euismod quis viverra nibh cras pulvinar. Fringilla ut morbi tincidunt augue interdum velit euismod in pellentesque. Molestie nunc non blandit massa enim nec. Purus non enim praesent elementum. Mauris commodo quis imperdiet massa tincidunt nunc. Nunc aliquet bibendum enim facilisis gravida neque. Mi tempus imperdiet nulla malesuada pellentesque elit eget gravida cum. Imperdiet massa tincidunt nunc pulvinar sapien. Ipsum a arcu cursus vitae. Id eu nisl nunc mi ipsum. Euismod elementum nisi quis eleifend quam adipiscing vitae. Nibh nisl condimentum id venenatis a condimentum vitae sapien pellentesque. Lacus laoreet non curabitur gravida arcu ac tortor. Convallis aenean et tortor at risus viverra.

[div class=tag]relationships:[/div]

Vulputate: enim nulla aliquet porttitor
lacus: luctus accumsan tortor
Sapien: pellentesque habitant
morbi: tristique senectus et

[/div][/div] [div class="textcontainer tabsContent tabsContent4" style="display:none;"][div class=text] [div class=tag]theme song:[/div] twilight by ateez

[div class=tag]enneagram type:[/div] 2

[div class=tag]mbti type:[/div] enfj

[div class=tag]gallery:[/div] ↓

[/div][/div] [/div] [div class=homebkgd] [div class=intro]introducing[/div] [div class="name button"]nyctophiliac[/div] [div class=role]the hunter[/div] [div class=line][/div] [div class="icon button"][/div] [div class="pic button"][/div] [/div] [/div][div class=credit]code by

sox [/div]

pastebin: xxx

sox · Jan 31, 2020

HELIOPHILIAC - MOBILE FRIENDLY

part two! same code as nyctophiliac but sun themed rather than moon themed. click on the name, sun, or pic to enter the sheet, and the text scrolls c: please do not remove the credit! enjoy peeps and lmk if u have any requests! c:

[class=content] position: relative; width: 300px; height: 400px; margin-right: auto; margin-left: auto; overflow: hidden; --bkgd-color: #FFE7AD; --text-color: #000; --accent-color: #00A68C; cursor: url('https://i.imgur.com/eyUJ9gM.png'), auto; [/class] [class=homebkgd] box-sizing: border-box; position: absolute; width: 100%; height: 100%; background-color: var(--bkgd-color); [/class] [class=intro] position: absolute; width: 100%; height: auto; color: var(--text-color); font-size: 10px; letter-spacing: 5px; text-transform: uppercase; text-align: center; top: 10%; [/class] [class=name] position: absolute; width: 100%; height: auto; color: var(--text-color); font-size: 22px; letter-spacing: 5px; text-transform: uppercase; text-align: center; text-shadow: 2px 2px 0px var(--accent-color); top: 13%; [/class] [class=role] position: absolute; width: 100%; height: auto; color: var(--text-color); font-size: 15px; letter-spacing: 5px; text-transform: uppercase; text-align: center; top: 20%; [/class] [class=line] position: absolute; width: 80%; height: 1px; border-radius: 10px; background-color: var(--accent-color); top: 28%; left: 10%; [/class] [class=icon] position: absolute; width: 5%; height: 15px; background: url(https://imgur.com/EHavE1R.png); background-size: 100%; top: 32%; left: 47.5%; transition-duration: 0.5s; animation:{post_id}throb 10s linear infinite; [/class] [class=pic] position: absolute; width: 80%; height: 52%; background: url(https://i.pinimg.com/564x/f8/e5/e7/f8e5e7a7ae9e2d57ac4a2194477b3f7b.jpg); background-size: 100%; background-position: 0% 40%; top: 40%; left: 10%; border: 0.5px solid var(--accent-color); [/class] [animation=throb] [keyframe=0]transform: scale(1.5);[/keyframe] [keyframe=10]transform: scale(0.95);[/keyframe] [keyframe=20]transform: scale(1.5);[/keyframe] [keyframe=30]transform: scale(0.95);[/keyframe] [keyframe=40]transform: scale(1.5);[/keyframe] [keyframe=50]transform: scale(0.95);[/keyframe] [keyframe=60]transform: scale(1.5);[/keyframe] [keyframe=70]transform: scale(0.95);[/keyframe] [keyframe=80]transform: scale(1.5);[/keyframe] [keyframe=90]transform: scale(0.95);[/keyframe] [keyframe=100]transform: scale(1.5);[/keyframe] [/animation] [script class=button on=click] addClass slideup homebkgd [/script] [class=slideup] animation-name: {post_id}slup; animation-duration: 1.7s; animation-fill-mode: forwards; [/class] [animation=slup] [keyframe=0]transform: translateY(0%);[/keyframe] [keyframe=100]transform: translateY(-100%);visibility:hidden;[/keyframe] [/animation] [class=bkgd] position: absolute; width: 100%; height: 100%; background-color: var(--bkgd-color); [/class] [class=header] position: absolute; width: 80%; height: auto; color: var(--text-color); font-size: 22px; letter-spacing: 0px; text-transform: uppercase; text-align: left; top: 6%; left: 10%; [/class] [class=tabcontainer] position: absolute; height: 20px; width: auto; top: 7.2%; left: 63%; [/class] [class=tab] position: relative; color: var(--text-color); width: 20px; height: 10px; display: inline; font-size: 15px; padding: 0px 5px 0px 6px; transition-duration: 0.3s; [/class] [class name=tab state=hover] color: var(--accent-color); transition-duration: 0.3s; [/class] [class=textcontainer] position: absolute; overflow: hidden; top: 18%; left: 10%; width: 90%; height: 75%; [/class] [class=text] position: relative; overflow: auto; width: 255px; height: 100%; font-size: 10px; line-height: 12px; color: var(--text-color); text-align: justify; text-transform: lowercase; padding-right: 50px; [/class] [class=tag] position: relative; display: inline; width: auto; height: auto; color: var(--accent-color); text-transform: uppercase; margin-right: 5px; text-decoration: underline; font-weight: 700; [/class] [class=credit] position: relative; overflow: hidden; width: 100%; height: 10px; text-align: center; font-style: normal; font-weight: normal; font-size: 8px; color: #dedede; opacity: 0.25; [/class] [script class=tab on=click] hide tabsContent set currentTab (getText) if (eq ${currentTab} 1) (fadeIn 500 tabsContent1) if (eq ${currentTab} 2) (fadeIn 500 tabsContent2) if (eq ${currentTab} 3) (fadeIn 500 tabsContent3) if (eq ${currentTab} 4) (fadeIn 500 tabsContent4) [/script] [div class=content] [div class=bkgd] [div class=line style="top: 5%;"][/div] [div class="header tabsContent tabsContent1"]basics[/div] [div class="header tabsContent tabsContent2" style="display:none;"]persona[/div] [div class="header tabsContent tabsContent3" style="display:none;"]backstory[/div] [div class="header tabsContent tabsContent4" style="display:none;"]misc.[/div] [div class=line style="top: 15%;"][/div] [div class=tabcontainer] [div class=tab]1[/div] [div class=tab]2[/div] [div class=tab]3[/div] [div class=tab]4[/div] [/div] [div class="textcontainer tabsContent tabsContent1"][div class=text] [div class=tag]name:[/div] choi san

[div class=tag]nickname:[/div] sannie to his close friends, san to everyone else

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

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

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

[div class=tag]role:[/div] the messenger

[div class=tag]faceclaim:[/div] jung wooyoung

[div class=tag]d.o.b:[/div] 7-10-99

[div class=tag]height:[/div] 5' 9"

[div class=tag]weight:[/div] 160lbs

[div class=tag]hair color:[/div] blonde

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

[div class=tag]dist. marks:[/div] sharp jaw line

[div class=tag]body mods:[/div] several ear piercings [/div][/div] [div class="textcontainer tabsContent tabsContent2" style="display:none;"][div class=text] [div class=tag]vices:[/div] Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Lacus luctus accumsan tortor posuere. Tristique et egestas quis ipsum suspendisse. Mattis rhoncus urna neque viverra. Imperdiet proin fermentum leo vel orci porta non. In arcu cursus euismod quis viverra nibh cras pulvinar. Fringilla ut morbi tincidunt augue interdum velit euismod in pellentesque. Molestie nunc non blandit massa enim nec. Purus non enim praesent elementum. Mauris commodo quis imperdiet massa tincidunt nunc. Nunc aliquet bibendum enim facilisis gravida neque. Mi tempus imperdiet nulla malesuada pellentesque elit eget gravida cum. Imperdiet massa tincidunt nunc pulvinar sapien. Ipsum a arcu cursus vitae.

[div class=tag]virtues:[/div] A cras semper auctor neque vitae tempus. Nunc mi ipsum faucibus vitae aliquet. Tempus iaculis urna id volutpat lacus laoreet non. Turpis egestas integer eget aliquet. Amet luctus venenatis lectus magna fringilla urna porttitor rhoncus. A iaculis at erat pellentesque adipiscing commodo. Duis at consectetur lorem donec massa sapien faucibus et molestie. Posuere morbi leo urna molestie at. Ridiculus mus mauris vitae ultricies leo. Porta nibh venenatis cras sed felis eget velit aliquet.

[div class=tag]strengths:[/div] Purus faucibus ornare suspendisse sed nisi lacus sed. Mi ipsum faucibus vitae aliquet nec ullamcorper sit amet. Mauris commodo quis imperdiet massa tincidunt nunc pulvinar sapien. Euismod in pellentesque massa placerat duis.

[div class=tag]weaknesses:[/div] Id eu nisl nunc mi ipsum. Euismod elementum nisi quis eleifend quam adipiscing vitae. Nibh nisl condimentum id venenatis a condimentum vitae sapien pellentesque. Lacus laoreet non curabitur gravida arcu ac tortor. Convallis aenean et tortor at risus viverra.

[div class=tag]fears:[/div] Vulputate enim nulla aliquet porttitor lacus luctus accumsan tortor. Sapien pellentesque habitant morbi tristique senectus et.

[div class=tag]ambitions:[/div] Mauris vitae ultricies leo integer malesuada nunc vel. Turpis egestas pretium aenean pharetra magna ac placerat vestibulum lectus. Malesuada fames ac turpis egestas sed. Sagittis eu volutpat odio facilisis mauris sit amet.

[div class=tag]likes:[/div] Fringilla est ullamcorper eget nulla. Vulputate sapien nec sagittis aliquam malesuada bibendum arcu vitae elementum. Molestie at elementum eu facilisis sed odio morbi. Arcu risus quis varius quam quisque id diam vel quam.

[div class=tag]dislikes:[/div] Scelerisque felis imperdiet proin fermentum leo vel. Sit amet mauris commodo quis imperdiet massa tincidunt nunc. Integer feugiat scelerisque varius morbi enim nunc faucibus a. Morbi tristique senectus et netus et malesuada. Sagittis nisl rhoncus mattis rhoncus urna neque.

[div class=tag]habits/quirks:[/div] Vel elit scelerisque mauris pellentesque pulvinar pellentesque habitant. Aenean pharetra magna ac placerat.

[div class=tag]ailments:[/div] Sed augue lacus viverra vitae. Urna et pharetra pharetra massa massa ultricies. Senectus et netus et malesuada fames ac. [/div][/div] [div class="textcontainer tabsContent tabsContent3" style="display:none;"][div class=text] [div class=tag]family:[/div] Turpis egestas integer eget aliquet. Amet luctus venenatis lectus magna.

[div class=tag]residence:[/div] A cras semper auctor.

[div class=tag]education:[/div] Purus faucibus ornare suspendisse.

[div class=tag]history:[/div] Duis at consectetur lorem donec massa sapien faucibus et molestie. Posuere morbi leo urna molestie at. Ridiculus mus mauris vitae ultricies leo. Porta nibh venenatis cras sed felis eget velit aliquet. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Lacus luctus accumsan tortor posuere. Tristique et egestas quis ipsum suspendisse. Mattis rhoncus urna neque viverra. Imperdiet proin fermentum leo vel orci porta non. In arcu cursus euismod quis viverra nibh cras pulvinar. Fringilla ut morbi tincidunt augue interdum velit euismod in pellentesque. Molestie nunc non blandit massa enim nec. Purus non enim praesent elementum. Mauris commodo quis imperdiet massa tincidunt nunc. Nunc aliquet bibendum enim facilisis gravida neque. Mi tempus imperdiet nulla malesuada pellentesque elit eget gravida cum. Imperdiet massa tincidunt nunc pulvinar sapien. Ipsum a arcu cursus vitae. Id eu nisl nunc mi ipsum. Euismod elementum nisi quis eleifend quam adipiscing vitae. Nibh nisl condimentum id venenatis a condimentum vitae sapien pellentesque. Lacus laoreet non curabitur gravida arcu ac tortor. Convallis aenean et tortor at risus viverra.

[div class=tag]relationships:[/div]

Vulputate: enim nulla aliquet porttitor
lacus: luctus accumsan tortor
Sapien: pellentesque habitant
morbi: tristique senectus et

[/div][/div] [div class="textcontainer tabsContent tabsContent4" style="display:none;"][div class=text] [div class=tag]theme song:[/div] twilight by ateez

[div class=tag]enneagram type:[/div] 2

[div class=tag]mbti type:[/div] enfj

[div class=tag]gallery:[/div] ↓

[/div][/div] [/div] [div class=homebkgd] [div class=intro]introducing[/div] [div class="name button"]heliophiliac[/div] [div class=role]the messenger[/div] [div class=line][/div] [div class="icon button"][/div] [div class="pic button"][/div] [/div] [/div][div class=credit]code by

sox [/div]

pastebin: xxx

sox · Feb 4, 2020

SUNDAY MORNING - MOBILE FRIENDLY

i'm on my mobile friendly kick c: another ic code! click the little flower to go to the text, and click the arrows on the top left to go back. text also scrolls ofc! please do not remove the credit! enjoy and lmk if u have any requests! c:

[class=bkgd] --main: #E3FFDD; --accent: #408f3f; --accent2: #90c454; position: relative; margin-left: auto; margin-right: auto; width: 320px; height: 400px; background-color: var(--main); border-radius: 10px; box-shadow: 5px 5px 0px var(--accent); overflow: hidden; margin-bottom: 5px; cursor: url('https://i.imgur.com/eyUJ9gM.png'), auto; [/class] [class=pic] position: absolute; top: 42px; left: 65px; width: 200px; height: 200px; border-radius: 300px; background: url(https://i.pinimg.com/474x/aa/85/c5/aa85c502985973f47fdc33cc83fb8491.jpg); background-size: 100%; background-position: 0% 10%; [/class] [class=picdecoration] position: absolute; top: 2px; left: 38px; width: 239px; height: 260px; background: url(https://imgur.com/XBe9pwi.png); background-size: 100%; [/class] [class=textcontainer] position: absolute; top: 20px; width: 300px; height: 325px; left: 25px; overflow: hidden; [/class] [class=text] position: relative; width: 280px; height: 320px; color: var(--accent); font-size: 10px; line-height: 12px; text-align: justify; overflow: auto; padding-right: 50px; [/class] [class=name] position: absolute; top: 260px; width: 100%; height: auto; color: var(--accent2); text-shadow: 1.5px 1.5px 0px var(--accent); text-align: center; font-size: 35px; line-height: 37px; text-transform: lowercase; [/class] [class=tab1] position: absolute; top: 325px; left: 130px; width: 60px; height: 50px; background: url(https://4vector.com/i/free-vector-lotus-flower_102121_Lotus_flower.png); background-size: 100%; background-repeat: no-repeat; color: white; animation: {post_id}shake 1s linear infinite; [/class] [class=tab2] position: absolute; top: 5px; left: 10px; width: 60px; height: 50px; font-size: 10px; color: var(--accent2); animation: {post_id}fade 3s linear infinite; [/class] [class name=tab2 state=hover] color: var(--accent); [/class] [class=stats] position: absolute; top: 350px; left: 10%; width: 80%; height: auto; color: var(--accent2); text-shadow: 0.5px 0.5px 0px var(--accent); text-align: center; font-size: 9px; text-transform: lowercase; [/class] [class=credit] position: relative; overflow: hidden; width: 100%; height: 10px; text-align: center; font-style: normal; font-weight: normal; font-size: 8px; color: #dedede; opacity: 0.25; [/class] [script class=tab on=click] hide tabsContent set currentTab (getText) if (eq ${currentTab} 1) (fadeIn 500 tabsContent1) if (eq ${currentTab} 2) (fadeIn 500 tabsContent2) [/script] [animation=shake] [keyframe=0]transform: rotate(3deg);[/keyframe] [keyframe=50]transform: rotate(-3deg);[/keyframe] [keyframe=100]transform: rotate(3deg);[/keyframe] [/animation] [animation=fade] [keyframe=0]opacity: 1;[/keyframe] [keyframe=10]opacity: 0.8;[/keyframe] [keyframe=20]opacity: 0.6;[/keyframe] [keyframe=30]opacity: 0.4;[/keyframe] [keyframe=40]opacity: 0.2;[/keyframe] [keyframe=50]opacity: 0.0;[/keyframe] [keyframe=50]opacity: 0.2;[/keyframe] [keyframe=70]opacity: 0.4;[/keyframe] [keyframe=80]opacity: 0.6;[/keyframe] [keyframe=90]opacity: 0.8;[/keyframe] [keyframe=100]opacity: 1;[/keyframe] [/animation] [div class=bkgd] [div class="pic tabsContent tabsContent1"][/div] [div class="picdecoration tabsContent tabsContent1"][/div] [div class="name tabsContent tabsContent1"]sunday morning[/div] [div class="tab1 tab tabsContent tabsContent1"]

2

[/div] [div class="tab2 tab tabsContent tabsContent2" style="display:none;"]

1

[/div] [div class="stats tabsContent tabsContent2" style="display:none;"]mood: peaceful | outfit: xx | interactions: sox and all her sock kids | tags: xx xx xx [/div] [div class="textcontainer tabsContent tabsContent2" style="display:none;"][div class=text]Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Sit amet justo donec enim diam vulputate. Egestas tellus rutrum tellus pellentesque eu tincidunt tortor. Mattis enim ut tellus elementum sagittis vitae et leo. Facilisis sed odio morbi quis commodo odio aenean sed adipiscing. Eu non diam phasellus vestibulum. Vestibulum mattis ullamcorper velit sed ullamcorper morbi tincidunt ornare. Volutpat est velit egestas dui id. Cursus in hac habitasse platea dictumst quisque sagittis. Vehicula ipsum a arcu cursus vitae. Tempus iaculis urna id volutpat lacus laoreet non. Accumsan in nisl nisi scelerisque eu ultrices vitae. Nibh ipsum consequat nisl vel pretium lectus quam. Sed risus ultricies tristique nulla aliquet enim tortor. Ut consequat semper viverra nam libero justo laoreet. Adipiscing vitae proin sagittis nisl rhoncus. Purus in massa tempor nec feugiat nisl pretium fusce id. Dapibus ultrices in iaculis nunc sed augue. Gravida dictum fusce ut placerat orci nulla pellentesque dignissim enim.

Fringilla est ullamcorper eget nulla facilisi etiam dignissim diam. Enim neque volutpat ac tincidunt vitae semper quis lectus nulla. Rutrum tellus pellentesque eu tincidunt tortor aliquam nulla. Dapibus ultrices in iaculis nunc sed augue lacus viverra vitae. Sed egestas egestas fringilla phasellus faucibus. Scelerisque eleifend donec pretium vulputate sapien nec sagittis. Amet luctus venenatis lectus magna fringilla urna. Nunc mi ipsum faucibus vitae aliquet nec ullamcorper sit amet. Pellentesque sit amet porttitor eget dolor morbi non. Nisl vel pretium lectus quam id leo in. Sit amet consectetur adipiscing elit duis tristique sollicitudin nibh. Ipsum dolor sit amet consectetur adipiscing elit. Faucibus nisl tincidunt eget nullam non nisi est. Dui accumsan sit amet nulla facilisi morbi tempus iaculis urna. Aenean sed adipiscing diam donec adipiscing tristique risus. Nunc eget lorem dolor sed viverra ipsum nunc aliquet.

Nunc mi ipsum faucibus vitae aliquet nec ullamcorper sit amet. Nunc sed augue lacus viverra. Magna eget est lorem ipsum dolor. Dui vivamus arcu felis bibendum. Quis enim lobortis scelerisque fermentum dui faucibus in. Sed adipiscing diam donec adipiscing tristique risus nec. Fermentum posuere urna nec tincidunt praesent semper feugiat nibh. Et malesuada fames ac turpis egestas integer eget aliquet nibh. In nibh mauris cursus mattis molestie a iaculis at erat. Vulputate sapien nec sagittis aliquam. Aliquam vestibulum morbi blandit cursus. Facilisis leo vel fringilla est ullamcorper. Tempor orci eu lobortis elementum nibh. Aliquam id diam maecenas ultricies mi eget mauris pharetra. Magnis dis parturient montes nascetur ridiculus mus mauris vitae. Sem fringilla ut morbi tincidunt. Congue eu consequat ac felis donec et odio. Arcu risus quis varius quam quisque id diam. Ut pharetra sit amet aliquam id diam.

In hendrerit gravida rutrum quisque. Ornare suspendisse sed nisi lacus sed. Nunc sed id semper risus in hendrerit. Venenatis a condimentum vitae sapien pellentesque habitant. Diam quam nulla porttitor massa id neque aliquam. Blandit volutpat maecenas volutpat blandit aliquam etiam erat velit scelerisque. Erat imperdiet sed euismod nisi porta lorem mollis. Gravida rutrum quisque non tellus orci. Aliquet enim tortor at auctor urna nunc id cursus metus. Id diam vel quam elementum pulvinar etiam non quam. Quis enim lobortis scelerisque fermentum dui faucibus in. Scelerisque viverra mauris in aliquam sem fringilla ut. Pharetra vel turpis nunc eget lorem. Quis imperdiet massa tincidunt nunc. Tristique nulla aliquet enim tortor at auctor urna nunc.

In mollis nunc sed id semper risus in hendrerit gravida. Vel fringilla est ullamcorper eget nulla facilisi. Nulla facilisi etiam dignissim diam quis. Sit amet consectetur adipiscing elit duis. Nisl tincidunt eget nullam non nisi est sit amet facilisis. Augue mauris augue neque gravida in. Aenean sed adipiscing diam donec adipiscing tristique risus nec. Vestibulum sed arcu non odio euismod lacinia at quis risus. Dui id ornare arcu odio ut sem nulla pharetra diam. Viverra tellus in hac habitasse platea dictumst vestibulum. Aliquet eget sit amet tellus cras. Ac felis donec et odio. Massa sed elementum tempus egestas sed sed. Et malesuada fames ac turpis egestas. [/div][/div] [/div][div class=credit]code by

sox [/div]

Code:

[nobr]
[class=bkgd]
   --main: #E3FFDD;
   --accent: #408f3f;
   --accent2: #90c454;
   position: relative;
   margin-left: auto;
   margin-right: auto;
   width: 320px;
   height: 400px;
   background-color: var(--main);
   border-radius: 10px;
   box-shadow: 5px 5px 0px var(--accent);
   overflow: hidden;
   margin-bottom: 5px;
   cursor: url('https://i.imgur.com/eyUJ9gM.png'), auto;
[/class]

[class=pic]
   position: absolute;
   top: 42px;
   left: 65px;
   width: 200px;
   height: 200px;
   border-radius: 300px;
   background: url(https://i.pinimg.com/474x/aa/85/c5/aa85c502985973f47fdc33cc83fb8491.jpg);
   background-size: 100%;
   background-position: 0% 10%;
[/class]

[class=picdecoration]
   position: absolute;
   top: 2px;
   left: 38px;
   width: 239px;
   height: 260px;
   background: url(https://imgur.com/XBe9pwi.png);
   background-size: 100%;
[/class]

[class=textcontainer]
   position: absolute;
   top: 20px;
   width: 300px;
   height: 325px;
   left: 25px;
   overflow: hidden;
[/class]

[class=text]
   position: relative;
   width: 280px;
   height: 320px;
   color: var(--accent);
   font-size: 10px;
   line-height: 12px;
   text-align: justify;
   overflow: auto;
   padding-right: 50px;
[/class]

[class=name]
   position: absolute;
   top: 260px;
   width: 100%;
   height: auto;
   color: var(--accent2);
   text-shadow: 1.5px 1.5px 0px var(--accent);
   text-align: center;
   font-size: 35px;
   line-height: 37px;
   text-transform: lowercase;
[/class]

[class=tab1]
   position: absolute;
   top: 325px;
   left: 130px;
   width: 60px;
   height: 50px;
   background: url(https://4vector.com/i/free-vector-lotus-flower_102121_Lotus_flower.png);
   background-size: 100%;
   background-repeat: no-repeat;
   color: white;
   animation: {post_id}shake 1s linear infinite;
[/class]

[class=tab2]
   position: absolute;
   top: 5px;
   left: 10px;
   width: 60px;
   height: 50px;
   font-size: 10px;
   color: var(--accent2);
   animation: {post_id}fade 3s linear infinite;
[/class]

[class name=tab2 state=hover]
   color: var(--accent);
[/class]

[class=stats]
   position: absolute;
   top: 350px;
   left: 10%;
   width: 80%;
   height: auto;
   color: var(--accent2);
   text-shadow: 0.5px 0.5px 0px var(--accent);
   text-align: center;
   font-size: 9px;
   text-transform: lowercase;
[/class]

[class=credit]
        position: relative;
        overflow: hidden;
        width: 100%;
        height: 10px;
        text-align: center;
        font-style: normal;
        font-weight: normal;
        font-size: 8px;
        color: #dedede;
        opacity: 0.25;
[/class]

[script class=tab on=click]
     hide tabsContent
     set currentTab (getText)
     if (eq ${currentTab} 1) (fadeIn 500 tabsContent1)
     if (eq ${currentTab} 2) (fadeIn 500 tabsContent2)
[/script]

    [animation=shake]
        [keyframe=0]transform: rotate(3deg);[/keyframe]
        [keyframe=50]transform: rotate(-3deg);[/keyframe]
        [keyframe=100]transform: rotate(3deg);[/keyframe]
    [/animation]

    [animation=fade]
        [keyframe=0]opacity: 1;[/keyframe]
        [keyframe=10]opacity: 0.8;[/keyframe]
        [keyframe=20]opacity: 0.6;[/keyframe]
        [keyframe=30]opacity: 0.4;[/keyframe]
        [keyframe=40]opacity: 0.2;[/keyframe]
        [keyframe=50]opacity: 0.0;[/keyframe]
        [keyframe=50]opacity: 0.2;[/keyframe]
        [keyframe=70]opacity: 0.4;[/keyframe]
        [keyframe=80]opacity: 0.6;[/keyframe]
        [keyframe=90]opacity: 0.8;[/keyframe]
        [keyframe=100]opacity: 1;[/keyframe]
    [/animation]

[div class=bkgd]
[div class="pic tabsContent tabsContent1"][/div]
[div class="picdecoration tabsContent tabsContent1"][/div]
[div class="name tabsContent tabsContent1"][font=La Belle Aurore]sunday morning[/font][/div]
[div class="tab1 tab tabsContent tabsContent1"][div=opacity:0]2[/div][/div]

[div class="tab2 tab tabsContent tabsContent2" style="display:none;"][fa]fa-angle-double-left[/fa][div=opacity:0]1[/div][/div]

[div class="stats tabsContent tabsContent2" style="display:none;"][font=Alata]mood: peaceful  |  outfit: [URL='https://i.pinimg.com/474x/60/9d/9e/609d9ef98c6b006a30857158d2f4577c.jpg']xx  [/URL]|  interactions: sox and all her sock kids | tags: xx xx xx
[/font][/div]

[div class="textcontainer tabsContent tabsContent2" style="display:none;"][div class=text][font=Raleway]Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Sit amet justo donec enim diam vulputate. Egestas tellus rutrum tellus pellentesque eu tincidunt tortor. Mattis enim ut tellus elementum sagittis vitae et leo. Facilisis sed odio morbi quis commodo odio aenean sed adipiscing. Eu non diam phasellus vestibulum. Vestibulum mattis ullamcorper velit sed ullamcorper morbi tincidunt ornare. Volutpat est velit egestas dui id. Cursus in hac habitasse platea dictumst quisque sagittis. Vehicula ipsum a arcu cursus vitae. Tempus iaculis urna id volutpat lacus laoreet non. Accumsan in nisl nisi scelerisque eu ultrices vitae. Nibh ipsum consequat nisl vel pretium lectus quam. Sed risus ultricies tristique nulla aliquet enim tortor. Ut consequat semper viverra nam libero justo laoreet. Adipiscing vitae proin sagittis nisl rhoncus. Purus in massa tempor nec feugiat nisl pretium fusce id. Dapibus ultrices in iaculis nunc sed augue. Gravida dictum fusce ut placerat orci nulla pellentesque dignissim enim.
[br][/br][br][/br]
Fringilla est ullamcorper eget nulla facilisi etiam dignissim diam. Enim neque volutpat ac tincidunt vitae semper quis lectus nulla. Rutrum tellus pellentesque eu tincidunt tortor aliquam nulla. Dapibus ultrices in iaculis nunc sed augue lacus viverra vitae. Sed egestas egestas fringilla phasellus faucibus. Scelerisque eleifend donec pretium vulputate sapien nec sagittis. Amet luctus venenatis lectus magna fringilla urna. Nunc mi ipsum faucibus vitae aliquet nec ullamcorper sit amet. Pellentesque sit amet porttitor eget dolor morbi non. Nisl vel pretium lectus quam id leo in. Sit amet consectetur adipiscing elit duis tristique sollicitudin nibh. Ipsum dolor sit amet consectetur adipiscing elit. Faucibus nisl tincidunt eget nullam non nisi est. Dui accumsan sit amet nulla facilisi morbi tempus iaculis urna. Aenean sed adipiscing diam donec adipiscing tristique risus. Nunc eget lorem dolor sed viverra ipsum nunc aliquet.
[br][/br][br][/br]
Nunc mi ipsum faucibus vitae aliquet nec ullamcorper sit amet. Nunc sed augue lacus viverra. Magna eget est lorem ipsum dolor. Dui vivamus arcu felis bibendum. Quis enim lobortis scelerisque fermentum dui faucibus in. Sed adipiscing diam donec adipiscing tristique risus nec. Fermentum posuere urna nec tincidunt praesent semper feugiat nibh. Et malesuada fames ac turpis egestas integer eget aliquet nibh. In nibh mauris cursus mattis molestie a iaculis at erat. Vulputate sapien nec sagittis aliquam. Aliquam vestibulum morbi blandit cursus. Facilisis leo vel fringilla est ullamcorper. Tempor orci eu lobortis elementum nibh. Aliquam id diam maecenas ultricies mi eget mauris pharetra. Magnis dis parturient montes nascetur ridiculus mus mauris vitae. Sem fringilla ut morbi tincidunt. Congue eu consequat ac felis donec et odio. Arcu risus quis varius quam quisque id diam. Ut pharetra sit amet aliquam id diam.
[br][/br][br][/br]
In hendrerit gravida rutrum quisque. Ornare suspendisse sed nisi lacus sed. Nunc sed id semper risus in hendrerit. Venenatis a condimentum vitae sapien pellentesque habitant. Diam quam nulla porttitor massa id neque aliquam. Blandit volutpat maecenas volutpat blandit aliquam etiam erat velit scelerisque. Erat imperdiet sed euismod nisi porta lorem mollis. Gravida rutrum quisque non tellus orci. Aliquet enim tortor at auctor urna nunc id cursus metus. Id diam vel quam elementum pulvinar etiam non quam. Quis enim lobortis scelerisque fermentum dui faucibus in. Scelerisque viverra mauris in aliquam sem fringilla ut. Pharetra vel turpis nunc eget lorem. Quis imperdiet massa tincidunt nunc. Tristique nulla aliquet enim tortor at auctor urna nunc.
[br][/br][br][/br]
In mollis nunc sed id semper risus in hendrerit gravida. Vel fringilla est ullamcorper eget nulla facilisi. Nulla facilisi etiam dignissim diam quis. Sit amet consectetur adipiscing elit duis. Nisl tincidunt eget nullam non nisi est sit amet facilisis. Augue mauris augue neque gravida in. Aenean sed adipiscing diam donec adipiscing tristique risus nec. Vestibulum sed arcu non odio euismod lacinia at quis risus. Dui id ornare arcu odio ut sem nulla pharetra diam. Viverra tellus in hac habitasse platea dictumst vestibulum. Aliquet eget sit amet tellus cras. Ac felis donec et odio. Massa sed elementum tempus egestas sed sed. Et malesuada fames ac turpis egestas.
[/font][/div][/div]
[/div][/nobr][div class=credit]code by [USER=2383][COLOR=#dedede]sox[/COLOR][/USER][/div]

deer · Feb 4, 2020

♡

logastellus · Feb 4, 2020

She’s finally back!!!!!

sox · Feb 6, 2020

SERENDIPITY - MOBILE FRIENDLY

hi this was an impulse code once again created while bored in my poli sci class c: i saw an edit on pinterest that was galaxy themed and the muse took me over ya know? text scrolls, icons on the side are tabs, and ye its a bit of a messy code but i hope y'all like it! please do not remove the credit! enjoy and lmk if u have any requests! c:

[class=bkgd] --dec-color: #fff; --accent-color: #f28fa6; --dark-color: #251e3d; position: relative; margin-right: auto; margin-left: auto; margin-top: 10px; margin-bottom: 5px; width: 300px; height: 400px; background: url(https://i.pinimg.com/474x/21/bd/b5/21bdb5e4b57f8d7df3b6592366983261.jpg); background-size: 150%; background-position: 100% 60%; overflow: visible; border-radius: 10px; cursor: url('https://i.imgur.com/FMvuswx.png'), auto; [/class] [class=bkgdtrace] position: absolute; width: 300px; height: 400px; border: 1px solid var(--dec-color); border-radius: 20px; overflow: visible; [/class] [class=star] position: absolute; width: 100px; height: 100px; color: var(--dec-color); overflow: visible; font-size: 15px; left: 190px; top: 10px; text-shadow: 2px 2px 0px var(--dark-color); [/class] [class=pic] position: absolute; width: 80px; height: 80px; left: 200px; top: 20px; background: url(https://i.pinimg.com/474x/dd/75/88/dd758861eb7fb277bc4a8ee0fb8367ae.jpg); background-size: 100%; background-position: 50% 50%; border-radius: 100%; border: 1px solid var(--dec-color); box-shadow: 2px 2px 0px var(--accent-color); [/class] [class=picdec] position: absolute; width: 95px; height: 65px; left: 192px; top: 28px; border: 1px solid var(--dec-color); border-radius: 100%; transform: rotate(10deg); [/class] [class=spinny] animation: {post_id}spin 10s linear infinite; [/class] [class=name] position: absolute; width: 100%; height: auto; color: var(--dec-color); overflow: visible; font-size: 30px; left: 30px; top: 10px; text-transform: lowercase; text-shadow: 2px 2px 0px var(--dark-color); [/class] [class=role] position: absolute; width: 130px; height: auto; color: var(--accent-color); overflow: visible; font-size: 20px; line-height: 15px; left: 60px; top: 45px; text-transform: lowercase; text-shadow: 1px 1px 0px var(--dark-color); [/class] [class=tab] position: absolute; left: 260px; font-size: 20px; color: var(--dec-color); transition-duration: 0.3s; text-shadow: 1px 1px 0px var(--dark-color); text-align: center; [/class] [class name=tab state=hover] color: var(--accent-color); transition-duration: 0.3s; text-shadow: 1px 1px 0px var(--dark-color); [/class] [class=textcontainer] position: absolute; width: 220px; height: 250px; overflow: hidden; left: 35px; top: 120px; [/class] [class=text] position: relative; width: 210px; height: 250px; color: var(--dec-color); overflow: auto; font-size: 10px; line-height: 12px; text-transform: lowercase; text-align: justify; padding-right: 40px; [/class] [class=hidden] display:none; [/class] [class=tag] position: relative; display: inline; width: auto; height: auto; color: var(--accent-color); text-transform: lowercase; margin-right: 5px; text-decoration: underline; font-weight: 700; font-size: 12px; text-shadow: 0.5px 0.5px 0px var(--dark-color); [/class] [class=credit] position: relative; overflow: hidden; width: 100%; height: 10px; text-align: center; font-style: normal; font-weight: normal; font-size: 8px; color: #dedede; opacity: 0.2; [/class] [class=accentcolor] color: var(--accent-color); text-shadow: 0.5px 0.5px 0px var(--dark-color); display: inline; [/class] [class=header] position: absolute; color: var(--dec-color); width: 200px; height: auto; line-height: 21px; top: 86px; left: 35px; font-size: 22px; text-transform: lowercase; text-shadow: 1px 1px 0px var(--dark-color); [/class] [class=tabstar] position: absolute; width: 30px; height: 30px; color: var(--dec-color); overflow: visible; font-size: 3px; left: 255px; text-shadow: 1px 1px 0px var(--dark-color); [/class] [class=tabspinny1] animation: {post_id}spin 20s linear infinite; [/class] [class=tabspinny2] animation: {post_id}spin 15s linear infinite; [/class] [class=tabspinny3] animation: {post_id}spin 25s linear infinite; [/class] [class=tabspinny4] animation: {post_id}spin 10s linear infinite; [/class] [script class=tab on=click] hide tabsContent set currentTab (getText) if (eq ${currentTab} 1) (fadeIn 500 tabsContent1) if (eq ${currentTab} 2) (fadeIn 500 tabsContent2) if (eq ${currentTab} 3) (fadeIn 500 tabsContent3) if (eq ${currentTab} 4) (fadeIn 500 tabsContent4) [/script] [animation=spin] [keyframe=0]transform: rotate(0deg);[/keyframe] [keyframe=100]transform: rotate(360deg);[/keyframe] [/animation] [div class=bkgd] [div class=bkgdtrace style="transform: rotate(-2deg);"][/div] [div class=bkgdtrace style="transform: rotate(2deg);"][/div] [div class=bkgdtrace style="border: 0px solid white;"] [div class="star spinny"][/div] [div class=pic][/div] [div class=picdec][/div] [div class=name]serendipity[/div] [div class=role]i'm your calico cat[/div] [div class="tabstar tabspinny1" style="top:140px;"][/div] [div class="tabstar tabspinny2" style="top:200px;"][/div] [div class="tabstar tabspinny3" style="top:260px;"][/div] [div class="tabstar tabspinny4" style="top:320px;"][/div] [div class=tab style="top:140px;"]

1

[/div] [div class=tab style="top:200px;"]

2

[/div] [div class=tab style="top:260px;"]

3

[/div] [div class=tab style="top:320px;"]

4

[/div] [div class="star tabsContent tabsContent1 tabsContent2 tabsContent3 tabsContent4" style="top: 94px; left: 20px; font-size: 8px; color: var(--accent-color);"][/div] [div class="header tabsContent tabsContent1"]basics[/div] [div class="header tabsContent tabsContent2 hidden"]persona[/div] [div class="header tabsContent tabsContent3 hidden"]background[/div] [div class="header tabsContent tabsContent4 hidden"]miscellaneous[/div] [div class="textcontainer tabsContent tabsContent1"][div class=text] [div class=tag]name:[/div] all this is no coincidence

[div class=tag]nickname:[/div] just by my feeling

[div class=tag]age:[/div] the whole world is different from yesterday

[div class=tag]gender:[/div] just with your joy

[div class=tag]sexuality:[/div] when you called me

[div class=tag]role:[/div] i became your flower

[div class=tag]faceclaim:[/div] as if we were waiting

[div class=tag]d.o.b:[/div] we bloom until we ache

[div class=tag]height:[/div] maybe it’s the providence of the universe

[div class=tag]weight:[/div] it just had to be that

[div class=tag]hair color:[/div] you know, i know

[div class=tag]eye color:[/div] you are me, i am you

[div class=tag]dist. marks:[/div] as much as my heart flutters, I’m worried

[div class=tag]body mods:[/div] destiny is jealous of us [/div][/div] [div class="textcontainer tabsContent tabsContent2 hidden"][div class=text] [div class=tag]vices:[/div] Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Lacus luctus accumsan tortor posuere. Tristique et egestas quis ipsum suspendisse. Mattis rhoncus urna neque viverra. Imperdiet proin fermentum leo vel orci porta non. In arcu cursus euismod quis viverra nibh cras pulvinar. Fringilla ut morbi tincidunt augue interdum velit euismod in pellentesque. Molestie nunc non blandit massa enim nec. Purus non enim praesent elementum. Mauris commodo quis imperdiet massa tincidunt nunc. Nunc aliquet bibendum enim facilisis gravida neque. Mi tempus imperdiet nulla malesuada pellentesque elit eget gravida cum. Imperdiet massa tincidunt nunc pulvinar sapien. Ipsum a arcu cursus vitae.

[div class=tag]virtues:[/div] A cras semper auctor neque vitae tempus. Nunc mi ipsum faucibus vitae aliquet. Tempus iaculis urna id volutpat lacus laoreet non. Turpis egestas integer eget aliquet. Amet luctus venenatis lectus magna fringilla urna porttitor rhoncus. A iaculis at erat pellentesque adipiscing commodo. Duis at consectetur lorem donec massa sapien faucibus et molestie. Posuere morbi leo urna molestie at. Ridiculus mus mauris vitae ultricies leo. Porta nibh venenatis cras sed felis eget velit aliquet.

[div class=tag]strengths:[/div] Purus faucibus ornare suspendisse sed nisi lacus sed. Mi ipsum faucibus vitae aliquet nec ullamcorper sit amet. Mauris commodo quis imperdiet massa tincidunt nunc pulvinar sapien. Euismod in pellentesque massa placerat duis.

[div class=tag]weaknesses:[/div] Id eu nisl nunc mi ipsum. Euismod elementum nisi quis eleifend quam adipiscing vitae. Nibh nisl condimentum id venenatis a condimentum vitae sapien pellentesque. Lacus laoreet non curabitur gravida arcu ac tortor. Convallis aenean et tortor at risus viverra.

[div class=tag]fears:[/div] Vulputate enim nulla aliquet porttitor lacus luctus accumsan tortor. Sapien pellentesque habitant morbi tristique senectus et.

[div class=tag]ambitions:[/div] Mauris vitae ultricies leo integer malesuada nunc vel. Turpis egestas pretium aenean pharetra magna ac placerat vestibulum lectus. Malesuada fames ac turpis egestas sed. Sagittis eu volutpat odio facilisis mauris sit amet.

[div class=tag]likes:[/div] Fringilla est ullamcorper eget nulla. Vulputate sapien nec sagittis aliquam malesuada bibendum arcu vitae elementum. Molestie at elementum eu facilisis sed odio morbi. Arcu risus quis varius quam quisque id diam vel quam.

[div class=tag]dislikes:[/div] Scelerisque felis imperdiet proin fermentum leo vel. Sit amet mauris commodo quis imperdiet massa tincidunt nunc. Integer feugiat scelerisque varius morbi enim nunc faucibus a. Morbi tristique senectus et netus et malesuada. Sagittis nisl rhoncus mattis rhoncus urna neque.

[div class=tag]habits/quirks:[/div] Vel elit scelerisque mauris pellentesque pulvinar pellentesque habitant. Aenean pharetra magna ac placerat.

[div class=tag]ailments:[/div] Sed augue lacus viverra vitae. Urna et pharetra pharetra massa massa ultricies. Senectus et netus et malesuada fames ac. [/div][/div] [div class="textcontainer tabsContent tabsContent3 hidden"][div class=text] [div class=tag]family:[/div] Turpis egestas integer eget aliquet. Amet luctus venenatis lectus magna.

[div class=tag]residence:[/div] A cras semper auctor.

[div class=tag]education:[/div] Purus faucibus ornare suspendisse.

[div class=tag]history:[/div] Duis at consectetur lorem donec massa sapien faucibus et molestie. Posuere morbi leo urna molestie at. Ridiculus mus mauris vitae ultricies leo. Porta nibh venenatis cras sed felis eget velit aliquet. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Lacus luctus accumsan tortor posuere. Tristique et egestas quis ipsum suspendisse. Mattis rhoncus urna neque viverra. Imperdiet proin fermentum leo vel orci porta non. In arcu cursus euismod quis viverra nibh cras pulvinar. Fringilla ut morbi tincidunt augue interdum velit euismod in pellentesque. Molestie nunc non blandit massa enim nec. Purus non enim praesent elementum. Mauris commodo quis imperdiet massa tincidunt nunc. Nunc aliquet bibendum enim facilisis gravida neque. Mi tempus imperdiet nulla malesuada pellentesque elit eget gravida cum. Imperdiet massa tincidunt nunc pulvinar sapien. Ipsum a arcu cursus vitae. Id eu nisl nunc mi ipsum. Euismod elementum nisi quis eleifend quam adipiscing vitae. Nibh nisl condimentum id venenatis a condimentum vitae sapien pellentesque. Lacus laoreet non curabitur gravida arcu ac tortor. Convallis aenean et tortor at risus viverra.

[div class=tag]relationships:[/div]

[div class=accentcolor]Vulputate:[/div] enim nulla aliquet porttitor
lacus: luctus accumsan tortor
Sapien: pellentesque habitant
morbi: tristique senectus et

[/div][/div] [div class="textcontainer tabsContent tabsContent4 hidden"][div class=text] [div class=tag]theme song:[/div] serendipity by bts

[div class=tag]enneagram type:[/div] 2

[div class=tag]mbti type:[/div] enfj

[div class=tag]gallery:[/div] ↓

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

sox [/div]

pastebin: xxx

screaming.virgo · Feb 6, 2020

sox said:
SERENDIPITY - MOBILE FRIENDLY

hi this was an impulse code once again created while bored in my poli sci class c: i saw an edit on pinterest that was galaxy themed and the muse took me over ya know? text scrolls, icons on the side are tabs, and ye its a bit of a messy code but i hope y'all like it! please do not remove the credit! enjoy and lmk if u have any requests! c:

[class=bkgd] --dec-color: #fff; --accent-color: #f28fa6; --dark-color: #251e3d; position: relative; margin-right: auto; margin-left: auto; margin-top: 10px; margin-bottom: 5px; width: 300px; height: 400px; background: url(https://i.pinimg.com/474x/21/bd/b5/21bdb5e4b57f8d7df3b6592366983261.jpg); background-size: 150%; background-position: 100% 60%; overflow: visible; border-radius: 10px; [/class] [class=bkgdtrace] position: absolute; width: 300px; height: 400px; border: 1px solid var(--dec-color); border-radius: 20px; overflow: visible; [/class] [class=star] position: absolute; width: 100px; height: 100px; color: var(--dec-color); overflow: visible; font-size: 15px; left: 190px; top: 10px; text-shadow: 2px 2px 0px var(--dark-color); [/class] [class=pic] position: absolute; width: 80px; height: 80px; left: 200px; top: 20px; background: url(https://i.pinimg.com/474x/dd/75/88/dd758861eb7fb277bc4a8ee0fb8367ae.jpg); background-size: 100%; background-position: 50% 50%; border-radius: 100%; border: 1px solid var(--dec-color); box-shadow: 2px 2px 0px var(--accent-color); [/class] [class=picdec] position: absolute; width: 95px; height: 65px; left: 192px; top: 28px; border: 1px solid var(--dec-color); border-radius: 100%; transform: rotate(10deg); [/class] [class=spinny] animation: {post_id}spin 10s linear infinite; [/class] [class=name] position: absolute; width: 100%; height: auto; color: var(--dec-color); overflow: visible; font-size: 30px; left: 30px; top: 10px; text-transform: lowercase; text-shadow: 2px 2px 0px var(--dark-color); [/class] [class=role] position: absolute; width: 130px; height: auto; color: var(--accent-color); overflow: visible; font-size: 20px; line-height: 15px; left: 60px; top: 45px; text-transform: lowercase; text-shadow: 1px 1px 0px var(--dark-color); [/class] [class=tab] position: absolute; left: 260px; font-size: 20px; color: var(--dec-color); transition-duration: 0.3s; text-shadow: 1px 1px 0px var(--dark-color); text-align: center; [/class] [class name=tab state=hover] color: var(--accent-color); transition-duration: 0.3s; text-shadow: 1px 1px 0px var(--dark-color); [/class] [class=textcontainer] position: absolute; width: 220px; height: 250px; overflow: hidden; left: 35px; top: 120px; [/class] [class=text] position: relative; width: 210px; height: 250px; color: var(--dec-color); overflow: auto; font-size: 10px; line-height: 12px; text-transform: lowercase; text-align: justify; padding-right: 40px; [/class] [class=hidden] display:none; [/class] [class=tag] position: relative; display: inline; width: auto; height: auto; color: var(--accent-color); text-transform: lowercase; margin-right: 5px; text-decoration: underline; font-weight: 700; font-size: 12px; text-shadow: 0.5px 0.5px 0px var(--dark-color); [/class] [class=credit] position: relative; overflow: hidden; width: 100%; height: 10px; text-align: center; font-style: normal; font-weight: normal; font-size: 8px; color: #dedede; opacity: 0.2; [/class] [class=accentcolor] color: var(--accent-color); text-shadow: 0.5px 0.5px 0px var(--dark-color); display: inline; [/class] [class=header] position: absolute; color: var(--dec-color); width: 200px; height: auto; line-height: 21px; top: 86px; left: 35px; font-size: 22px; text-transform: lowercase; text-shadow: 1px 1px 0px var(--dark-color); [/class] [class=tabstar] position: absolute; width: 30px; height: 30px; color: var(--dec-color); overflow: visible; font-size: 3px; left: 255px; text-shadow: 1px 1px 0px var(--dark-color); [/class] [class=tabspinny1] animation: {post_id}spin 20s linear infinite; [/class] [class=tabspinny2] animation: {post_id}spin 15s linear infinite; [/class] [class=tabspinny3] animation: {post_id}spin 25s linear infinite; [/class] [class=tabspinny4] animation: {post_id}spin 10s linear infinite; [/class] [script class=tab on=click] hide tabsContent set currentTab (getText) if (eq ${currentTab} 1) (fadeIn 500 tabsContent1) if (eq ${currentTab} 2) (fadeIn 500 tabsContent2) if (eq ${currentTab} 3) (fadeIn 500 tabsContent3) if (eq ${currentTab} 4) (fadeIn 500 tabsContent4) [/script] [animation=spin] [keyframe=0]transform: rotate(0deg);[/keyframe] [keyframe=100]transform: rotate(360deg);[/keyframe] [/animation] [div class=bkgd] [div class=bkgdtrace style="transform: rotate(-2deg);"][/div] [div class=bkgdtrace style="transform: rotate(2deg);"][/div] [div class=bkgdtrace style="border: 0px solid white;"] [div class="star spinny"][/div] [div class=pic][/div] [div class=picdec][/div] [div class=name]serendipity[/div] [div class=role]i'm your calico cat[/div] [div class="tabstar tabspinny1" style="top:140px;"][/div] [div class="tabstar tabspinny2" style="top:200px;"][/div] [div class="tabstar tabspinny3" style="top:260px;"][/div] [div class="tabstar tabspinny4" style="top:320px;"][/div] [div class=tab style="top:140px;"]
1
[/div] [div class=tab style="top:200px;"]
2
[/div] [div class=tab style="top:260px;"]
3
[/div] [div class=tab style="top:320px;"]
4
[/div] [div class="star tabsContent tabsContent1 tabsContent2 tabsContent3 tabsContent4" style="top: 94px; left: 20px; font-size: 8px; color: var(--accent-color);"][/div] [div class="header tabsContent tabsContent1"]basics[/div] [div class="header tabsContent tabsContent2 hidden"]persona[/div] [div class="header tabsContent tabsContent3 hidden"]background[/div] [div class="header tabsContent tabsContent4 hidden"]miscellaneous[/div] [div class="textcontainer tabsContent tabsContent1"][div class=text] [div class=tag]name:[/div] all this is no coincidence

[div class=tag]nickname:[/div] just by my feeling

[div class=tag]age:[/div] the whole world is different from yesterday

[div class=tag]gender:[/div] just with your joy

[div class=tag]sexuality:[/div] when you called me

[div class=tag]role:[/div] i became your flower

[div class=tag]faceclaim:[/div] as if we were waiting

[div class=tag]d.o.b:[/div] we bloom until we ache

[div class=tag]height:[/div] maybe it’s the providence of the universe

[div class=tag]weight:[/div] it just had to be that

[div class=tag]hair color:[/div] you know, i know

[div class=tag]eye color:[/div] you are me, i am you

[div class=tag]dist. marks:[/div] as much as my heart flutters, I’m worried

[div class=tag]body mods:[/div] destiny is jealous of us [/div][/div] [div class="textcontainer tabsContent tabsContent2 hidden"][div class=text] [div class=tag]vices:[/div] Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Lacus luctus accumsan tortor posuere. Tristique et egestas quis ipsum suspendisse. Mattis rhoncus urna neque viverra. Imperdiet proin fermentum leo vel orci porta non. In arcu cursus euismod quis viverra nibh cras pulvinar. Fringilla ut morbi tincidunt augue interdum velit euismod in pellentesque. Molestie nunc non blandit massa enim nec. Purus non enim praesent elementum. Mauris commodo quis imperdiet massa tincidunt nunc. Nunc aliquet bibendum enim facilisis gravida neque. Mi tempus imperdiet nulla malesuada pellentesque elit eget gravida cum. Imperdiet massa tincidunt nunc pulvinar sapien. Ipsum a arcu cursus vitae.

[div class=tag]virtues:[/div] A cras semper auctor neque vitae tempus. Nunc mi ipsum faucibus vitae aliquet. Tempus iaculis urna id volutpat lacus laoreet non. Turpis egestas integer eget aliquet. Amet luctus venenatis lectus magna fringilla urna porttitor rhoncus. A iaculis at erat pellentesque adipiscing commodo. Duis at consectetur lorem donec massa sapien faucibus et molestie. Posuere morbi leo urna molestie at. Ridiculus mus mauris vitae ultricies leo. Porta nibh venenatis cras sed felis eget velit aliquet.

[div class=tag]strengths:[/div] Purus faucibus ornare suspendisse sed nisi lacus sed. Mi ipsum faucibus vitae aliquet nec ullamcorper sit amet. Mauris commodo quis imperdiet massa tincidunt nunc pulvinar sapien. Euismod in pellentesque massa placerat duis.

[div class=tag]weaknesses:[/div] Id eu nisl nunc mi ipsum. Euismod elementum nisi quis eleifend quam adipiscing vitae. Nibh nisl condimentum id venenatis a condimentum vitae sapien pellentesque. Lacus laoreet non curabitur gravida arcu ac tortor. Convallis aenean et tortor at risus viverra.

[div class=tag]fears:[/div] Vulputate enim nulla aliquet porttitor lacus luctus accumsan tortor. Sapien pellentesque habitant morbi tristique senectus et.

[div class=tag]ambitions:[/div] Mauris vitae ultricies leo integer malesuada nunc vel. Turpis egestas pretium aenean pharetra magna ac placerat vestibulum lectus. Malesuada fames ac turpis egestas sed. Sagittis eu volutpat odio facilisis mauris sit amet.

[div class=tag]likes:[/div] Fringilla est ullamcorper eget nulla. Vulputate sapien nec sagittis aliquam malesuada bibendum arcu vitae elementum. Molestie at elementum eu facilisis sed odio morbi. Arcu risus quis varius quam quisque id diam vel quam.

[div class=tag]dislikes:[/div] Scelerisque felis imperdiet proin fermentum leo vel. Sit amet mauris commodo quis imperdiet massa tincidunt nunc. Integer feugiat scelerisque varius morbi enim nunc faucibus a. Morbi tristique senectus et netus et malesuada. Sagittis nisl rhoncus mattis rhoncus urna neque.

[div class=tag]habits/quirks:[/div] Vel elit scelerisque mauris pellentesque pulvinar pellentesque habitant. Aenean pharetra magna ac placerat.

[div class=tag]ailments:[/div] Sed augue lacus viverra vitae. Urna et pharetra pharetra massa massa ultricies. Senectus et netus et malesuada fames ac. [/div][/div] [div class="textcontainer tabsContent tabsContent3 hidden"][div class=text] [div class=tag]family:[/div] Turpis egestas integer eget aliquet. Amet luctus venenatis lectus magna.

[div class=tag]residence:[/div] A cras semper auctor.

[div class=tag]education:[/div] Purus faucibus ornare suspendisse.

[div class=tag]history:[/div] Duis at consectetur lorem donec massa sapien faucibus et molestie. Posuere morbi leo urna molestie at. Ridiculus mus mauris vitae ultricies leo. Porta nibh venenatis cras sed felis eget velit aliquet. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Lacus luctus accumsan tortor posuere. Tristique et egestas quis ipsum suspendisse. Mattis rhoncus urna neque viverra. Imperdiet proin fermentum leo vel orci porta non. In arcu cursus euismod quis viverra nibh cras pulvinar. Fringilla ut morbi tincidunt augue interdum velit euismod in pellentesque. Molestie nunc non blandit massa enim nec. Purus non enim praesent elementum. Mauris commodo quis imperdiet massa tincidunt nunc. Nunc aliquet bibendum enim facilisis gravida neque. Mi tempus imperdiet nulla malesuada pellentesque elit eget gravida cum. Imperdiet massa tincidunt nunc pulvinar sapien. Ipsum a arcu cursus vitae. Id eu nisl nunc mi ipsum. Euismod elementum nisi quis eleifend quam adipiscing vitae. Nibh nisl condimentum id venenatis a condimentum vitae sapien pellentesque. Lacus laoreet non curabitur gravida arcu ac tortor. Convallis aenean et tortor at risus viverra.

[div class=tag]relationships:[/div]

[div class=accentcolor]Vulputate:[/div] enim nulla aliquet porttitor

lacus: luctus accumsan tortor

Sapien: pellentesque habitant

morbi: tristique senectus et

[/div][/div] [div class="textcontainer tabsContent tabsContent4 hidden"][div class=text] [div class=tag]theme song:[/div] serendipity by bts

[div class=tag]enneagram type:[/div] 2

[div class=tag]mbti type:[/div] enfj

[div class=tag]gallery:[/div] ↓

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

pastebin: xxx

S T U N N I N G

sox · Feb 6, 2020

screaming.virgo said:
S T U N N I N G

NO U

screaming.virgo · Feb 6, 2020

sox said:
NO U

blackout · Feb 8, 2020

sox said:
SERENDIPITY - MOBILE FRIENDLY

hi this was an impulse code once again created while bored in my poli sci class c: i saw an edit on pinterest that was galaxy themed and the muse took me over ya know? text scrolls, icons on the side are tabs, and ye its a bit of a messy code but i hope y'all like it! please do not remove the credit! enjoy and lmk if u have any requests! c:

[class=bkgd] --dec-color: #fff; --accent-color: #f28fa6; --dark-color: #251e3d; position: relative; margin-right: auto; margin-left: auto; margin-top: 10px; margin-bottom: 5px; width: 300px; height: 400px; background: url(https://i.pinimg.com/474x/21/bd/b5/21bdb5e4b57f8d7df3b6592366983261.jpg); background-size: 150%; background-position: 100% 60%; overflow: visible; border-radius: 10px; cursor: url('https://i.imgur.com/FMvuswx.png'), auto; [/class] [class=bkgdtrace] position: absolute; width: 300px; height: 400px; border: 1px solid var(--dec-color); border-radius: 20px; overflow: visible; [/class] [class=star] position: absolute; width: 100px; height: 100px; color: var(--dec-color); overflow: visible; font-size: 15px; left: 190px; top: 10px; text-shadow: 2px 2px 0px var(--dark-color); [/class] [class=pic] position: absolute; width: 80px; height: 80px; left: 200px; top: 20px; background: url(https://i.pinimg.com/474x/dd/75/88/dd758861eb7fb277bc4a8ee0fb8367ae.jpg); background-size: 100%; background-position: 50% 50%; border-radius: 100%; border: 1px solid var(--dec-color); box-shadow: 2px 2px 0px var(--accent-color); [/class] [class=picdec] position: absolute; width: 95px; height: 65px; left: 192px; top: 28px; border: 1px solid var(--dec-color); border-radius: 100%; transform: rotate(10deg); [/class] [class=spinny] animation: {post_id}spin 10s linear infinite; [/class] [class=name] position: absolute; width: 100%; height: auto; color: var(--dec-color); overflow: visible; font-size: 30px; left: 30px; top: 10px; text-transform: lowercase; text-shadow: 2px 2px 0px var(--dark-color); [/class] [class=role] position: absolute; width: 130px; height: auto; color: var(--accent-color); overflow: visible; font-size: 20px; line-height: 15px; left: 60px; top: 45px; text-transform: lowercase; text-shadow: 1px 1px 0px var(--dark-color); [/class] [class=tab] position: absolute; left: 260px; font-size: 20px; color: var(--dec-color); transition-duration: 0.3s; text-shadow: 1px 1px 0px var(--dark-color); text-align: center; [/class] [class name=tab state=hover] color: var(--accent-color); transition-duration: 0.3s; text-shadow: 1px 1px 0px var(--dark-color); [/class] [class=textcontainer] position: absolute; width: 220px; height: 250px; overflow: hidden; left: 35px; top: 120px; [/class] [class=text] position: relative; width: 210px; height: 250px; color: var(--dec-color); overflow: auto; font-size: 10px; line-height: 12px; text-transform: lowercase; text-align: justify; padding-right: 40px; [/class] [class=hidden] display:none; [/class] [class=tag] position: relative; display: inline; width: auto; height: auto; color: var(--accent-color); text-transform: lowercase; margin-right: 5px; text-decoration: underline; font-weight: 700; font-size: 12px; text-shadow: 0.5px 0.5px 0px var(--dark-color); [/class] [class=credit] position: relative; overflow: hidden; width: 100%; height: 10px; text-align: center; font-style: normal; font-weight: normal; font-size: 8px; color: #dedede; opacity: 0.2; [/class] [class=accentcolor] color: var(--accent-color); text-shadow: 0.5px 0.5px 0px var(--dark-color); display: inline; [/class] [class=header] position: absolute; color: var(--dec-color); width: 200px; height: auto; line-height: 21px; top: 86px; left: 35px; font-size: 22px; text-transform: lowercase; text-shadow: 1px 1px 0px var(--dark-color); [/class] [class=tabstar] position: absolute; width: 30px; height: 30px; color: var(--dec-color); overflow: visible; font-size: 3px; left: 255px; text-shadow: 1px 1px 0px var(--dark-color); [/class] [class=tabspinny1] animation: {post_id}spin 20s linear infinite; [/class] [class=tabspinny2] animation: {post_id}spin 15s linear infinite; [/class] [class=tabspinny3] animation: {post_id}spin 25s linear infinite; [/class] [class=tabspinny4] animation: {post_id}spin 10s linear infinite; [/class] [script class=tab on=click] hide tabsContent set currentTab (getText) if (eq ${currentTab} 1) (fadeIn 500 tabsContent1) if (eq ${currentTab} 2) (fadeIn 500 tabsContent2) if (eq ${currentTab} 3) (fadeIn 500 tabsContent3) if (eq ${currentTab} 4) (fadeIn 500 tabsContent4) [/script] [animation=spin] [keyframe=0]transform: rotate(0deg);[/keyframe] [keyframe=100]transform: rotate(360deg);[/keyframe] [/animation] [div class=bkgd] [div class=bkgdtrace style="transform: rotate(-2deg);"][/div] [div class=bkgdtrace style="transform: rotate(2deg);"][/div] [div class=bkgdtrace style="border: 0px solid white;"] [div class="star spinny"][/div] [div class=pic][/div] [div class=picdec][/div] [div class=name]serendipity[/div] [div class=role]i'm your calico cat[/div] [div class="tabstar tabspinny1" style="top:140px;"][/div] [div class="tabstar tabspinny2" style="top:200px;"][/div] [div class="tabstar tabspinny3" style="top:260px;"][/div] [div class="tabstar tabspinny4" style="top:320px;"][/div] [div class=tab style="top:140px;"]
1
[/div] [div class=tab style="top:200px;"]
2
[/div] [div class=tab style="top:260px;"]
3
[/div] [div class=tab style="top:320px;"]
4
[/div] [div class="star tabsContent tabsContent1 tabsContent2 tabsContent3 tabsContent4" style="top: 94px; left: 20px; font-size: 8px; color: var(--accent-color);"][/div] [div class="header tabsContent tabsContent1"]basics[/div] [div class="header tabsContent tabsContent2 hidden"]persona[/div] [div class="header tabsContent tabsContent3 hidden"]background[/div] [div class="header tabsContent tabsContent4 hidden"]miscellaneous[/div] [div class="textcontainer tabsContent tabsContent1"][div class=text] [div class=tag]name:[/div] all this is no coincidence

[div class=tag]nickname:[/div] just by my feeling

[div class=tag]age:[/div] the whole world is different from yesterday

[div class=tag]gender:[/div] just with your joy

[div class=tag]sexuality:[/div] when you called me

[div class=tag]role:[/div] i became your flower

[div class=tag]faceclaim:[/div] as if we were waiting

[div class=tag]d.o.b:[/div] we bloom until we ache

[div class=tag]height:[/div] maybe it’s the providence of the universe

[div class=tag]weight:[/div] it just had to be that

[div class=tag]hair color:[/div] you know, i know

[div class=tag]eye color:[/div] you are me, i am you

[div class=tag]dist. marks:[/div] as much as my heart flutters, I’m worried

[div class=tag]body mods:[/div] destiny is jealous of us [/div][/div] [div class="textcontainer tabsContent tabsContent2 hidden"][div class=text] [div class=tag]vices:[/div] Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Lacus luctus accumsan tortor posuere. Tristique et egestas quis ipsum suspendisse. Mattis rhoncus urna neque viverra. Imperdiet proin fermentum leo vel orci porta non. In arcu cursus euismod quis viverra nibh cras pulvinar. Fringilla ut morbi tincidunt augue interdum velit euismod in pellentesque. Molestie nunc non blandit massa enim nec. Purus non enim praesent elementum. Mauris commodo quis imperdiet massa tincidunt nunc. Nunc aliquet bibendum enim facilisis gravida neque. Mi tempus imperdiet nulla malesuada pellentesque elit eget gravida cum. Imperdiet massa tincidunt nunc pulvinar sapien. Ipsum a arcu cursus vitae.

[div class=tag]virtues:[/div] A cras semper auctor neque vitae tempus. Nunc mi ipsum faucibus vitae aliquet. Tempus iaculis urna id volutpat lacus laoreet non. Turpis egestas integer eget aliquet. Amet luctus venenatis lectus magna fringilla urna porttitor rhoncus. A iaculis at erat pellentesque adipiscing commodo. Duis at consectetur lorem donec massa sapien faucibus et molestie. Posuere morbi leo urna molestie at. Ridiculus mus mauris vitae ultricies leo. Porta nibh venenatis cras sed felis eget velit aliquet.

[div class=tag]strengths:[/div] Purus faucibus ornare suspendisse sed nisi lacus sed. Mi ipsum faucibus vitae aliquet nec ullamcorper sit amet. Mauris commodo quis imperdiet massa tincidunt nunc pulvinar sapien. Euismod in pellentesque massa placerat duis.

[div class=tag]weaknesses:[/div] Id eu nisl nunc mi ipsum. Euismod elementum nisi quis eleifend quam adipiscing vitae. Nibh nisl condimentum id venenatis a condimentum vitae sapien pellentesque. Lacus laoreet non curabitur gravida arcu ac tortor. Convallis aenean et tortor at risus viverra.

[div class=tag]fears:[/div] Vulputate enim nulla aliquet porttitor lacus luctus accumsan tortor. Sapien pellentesque habitant morbi tristique senectus et.

[div class=tag]ambitions:[/div] Mauris vitae ultricies leo integer malesuada nunc vel. Turpis egestas pretium aenean pharetra magna ac placerat vestibulum lectus. Malesuada fames ac turpis egestas sed. Sagittis eu volutpat odio facilisis mauris sit amet.

[div class=tag]likes:[/div] Fringilla est ullamcorper eget nulla. Vulputate sapien nec sagittis aliquam malesuada bibendum arcu vitae elementum. Molestie at elementum eu facilisis sed odio morbi. Arcu risus quis varius quam quisque id diam vel quam.

[div class=tag]dislikes:[/div] Scelerisque felis imperdiet proin fermentum leo vel. Sit amet mauris commodo quis imperdiet massa tincidunt nunc. Integer feugiat scelerisque varius morbi enim nunc faucibus a. Morbi tristique senectus et netus et malesuada. Sagittis nisl rhoncus mattis rhoncus urna neque.

[div class=tag]habits/quirks:[/div] Vel elit scelerisque mauris pellentesque pulvinar pellentesque habitant. Aenean pharetra magna ac placerat.

[div class=tag]ailments:[/div] Sed augue lacus viverra vitae. Urna et pharetra pharetra massa massa ultricies. Senectus et netus et malesuada fames ac. [/div][/div] [div class="textcontainer tabsContent tabsContent3 hidden"][div class=text] [div class=tag]family:[/div] Turpis egestas integer eget aliquet. Amet luctus venenatis lectus magna.

[div class=tag]residence:[/div] A cras semper auctor.

[div class=tag]education:[/div] Purus faucibus ornare suspendisse.

[div class=tag]history:[/div] Duis at consectetur lorem donec massa sapien faucibus et molestie. Posuere morbi leo urna molestie at. Ridiculus mus mauris vitae ultricies leo. Porta nibh venenatis cras sed felis eget velit aliquet. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Lacus luctus accumsan tortor posuere. Tristique et egestas quis ipsum suspendisse. Mattis rhoncus urna neque viverra. Imperdiet proin fermentum leo vel orci porta non. In arcu cursus euismod quis viverra nibh cras pulvinar. Fringilla ut morbi tincidunt augue interdum velit euismod in pellentesque. Molestie nunc non blandit massa enim nec. Purus non enim praesent elementum. Mauris commodo quis imperdiet massa tincidunt nunc. Nunc aliquet bibendum enim facilisis gravida neque. Mi tempus imperdiet nulla malesuada pellentesque elit eget gravida cum. Imperdiet massa tincidunt nunc pulvinar sapien. Ipsum a arcu cursus vitae. Id eu nisl nunc mi ipsum. Euismod elementum nisi quis eleifend quam adipiscing vitae. Nibh nisl condimentum id venenatis a condimentum vitae sapien pellentesque. Lacus laoreet non curabitur gravida arcu ac tortor. Convallis aenean et tortor at risus viverra.

[div class=tag]relationships:[/div]

[div class=accentcolor]Vulputate:[/div] enim nulla aliquet porttitor

lacus: luctus accumsan tortor

Sapien: pellentesque habitant

morbi: tristique senectus et

[/div][/div] [div class="textcontainer tabsContent tabsContent4 hidden"][div class=text] [div class=tag]theme song:[/div] serendipity by bts

[div class=tag]enneagram type:[/div] 2

[div class=tag]mbti type:[/div] enfj

[div class=tag]gallery:[/div] ↓

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

pastebin: xxx

shut UPPP shut UPPP shut UPPPPPPPPPPPP this is so good i am about to CRY sox you must've really done sold your soul to make codes this good

sox · Feb 8, 2020

fated said:
shut UPPP shut UPPP shut UPPPPPPPPPPPP this is so good i am about to CRY sox you must've really done sold your soul to make codes this good

SSTOPPPP IM CRYING WTF srsly tho thank u sm im gonna combust

sox · Feb 10, 2020

COLD-BLOODED - MOBILE FRIENDLY

i made this for an rp i just put up (y'all should definitely check it out cough cough) but i figured i'd throw it up here too for y'all jungle enthusiasts lol there's tabs on the bottom and all the text scrolls. please do not remove the credit! enjoy and lmk if u have any requests! c:

[class=bkgd] --light-color: #B7D69E; --accent-color: #882825; --dark-color: #0A1008; position: relative; margin-left: auto; margin-right: auto; margin-bottom: 6px; width: 350px; height: 250px; background: url(https://i.pinimg.com/564x/3f/1d/66/3f1d661fba9eb6b0f83888d5e5243448.jpg); filter: grayscale(20%); background-size: 100%; border: 8px solid var(--light-color); cursor: url('https://i.imgur.com/FMvuswx.png'), auto; box-shadow: 5px 5px 0px var(--accent-color); [/class] [class=title] position: absolute; text-align: center; top: 35%; width: 100%; height: auto; font-size: 35px; color: var(--light-color); text-transform: uppercase; text-shadow: 3px 3px 0px var(--accent-color); font-weight: 700; [/class] [class=titleback] position: absolute; top: 37%; width: 100%; height: 20%; background-color: var(--dark-color); opacity: 1; border-top: 2px solid var(--light-color); border-bottom: 2px solid var(--light-color); [/class] [class=header] position: absolute; text-align: left; top: 3%; left: 5%; width: 100%; height: auto; font-size: 20px; color: var(--light-color); text-transform: uppercase; text-shadow: 2px 2px 0px var(--accent-color); font-style: italic; font-weight: 700; [/class] [class=textcontainer] position: absolute; top: 10%; width: 100%; height: 65%; background-color: var(--dark-color); opacity: 1; padding-top: 20px; overflow: hidden; [/class] [class=text] position: relative; width: 84%; height: 90%; overflow: auto; color: #fff; font-size: 10px; line-height: 12px; text-align: justify; padding-left: 30px; padding-right: 60px; [/class] [class=tab] position: absolute; width: 15px; height: 8.5px; background-color: var(--light-color); top: 90%; border-radius: 10%; transition-duration: 0.3s; [/class] [class name=tab state=hover] background-color: var(--accent-color); transition-duration: 0.3s; [/class] [class=tabback] position: absolute; top: 87%; width: 100%; height: 8.5%; background-color: var(--dark-color); opacity: 1; [/class] [class=credit] position: relative; overflow: hidden; width: 100%; height: 10px; text-align: center; font-style: normal; font-weight: normal; font-size: 8px; color: #dedede; opacity: 0.2; [/class] [script class=tab on=click] hide tabsContent set currentTab (getText) if (eq ${currentTab} 1) (fadeIn 300 tabsContent1) if (eq ${currentTab} 2) (fadeIn 300 tabsContent2) if (eq ${currentTab} 3) (fadeIn 300 tabsContent3) if (eq ${currentTab} 4) (fadeIn 300 tabsContent4) if (eq ${currentTab} 5) (fadeIn 300 tabsContent5) [/script] [div class=bkgd] [div class="titleback tabsContent tabsContent1"][/div] [div class="title tabsContent tabsContent1"]cold-blooded.[/div] [div class=tabback][/div] [div class=tab style="left: 130px;"]

1

[/div] [div class=tab style="left: 150px;"]

2

[/div] [div class=tab style="left: 170px;"]

3

[/div] [div class=tab style="left: 190px;"]

4

[/div] [div class=tab style="left: 210px;"]

5

[/div] [div class="textcontainer tabsContent tabsContent2" style="display: none;"][div class=text] Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Libero justo laoreet sit amet cursus sit amet. Tristique sollicitudin nibh sit amet commodo nulla. Aliquam ultrices sagittis orci a scelerisque.

Tristique senectus et netus et malesuada fames. Bibendum ut tristique et egestas quis ipsum suspendisse ultrices. Malesuada pellentesque elit eget gravida cum sociis natoque penatibus. Interdum velit euismod in pellentesque massa placerat. Eget dolor morbi non arcu risus quis varius quam. Viverra mauris in aliquam sem fringilla ut morbi tincidunt.

Elementum sagittis vitae et leo. Tincidunt tortor aliquam nulla facilisi cras fermentum odio. Ipsum consequat nisl vel pretium lectus quam id leo. Accumsan sit amet nulla facilisi morbi tempus. Tempor nec feugiat nisl pretium. Lacus laoreet non curabitur gravida arcu ac tortor. Sit amet porttitor eget dolor morbi. Vivamus arcu felis bibendum ut tristique.

Tristique senectus et netus et malesuada fames. Fusce id velit ut tortor pretium. Risus sed vulputate odio ut enim. Sagittis nisl rhoncus mattis rhoncus urna. Habitant morbi tristique senectus et netus et malesuada. Vulputate eu scelerisque felis imperdiet proin. Quam id leo in vitae turpis. Pharetra et ultrices neque ornare aenean euismod elementum nisi quis. Justo donec enim diam vulputate ut pharetra. Mauris in aliquam sem fringilla ut morbi.

Duis at tellus at urna condimentum mattis pellentesque. Gravida quis blandit turpis cursus in hac habitasse. Enim blandit volutpat maecenas volutpat blandit aliquam. Tincidunt id aliquet risus feugiat in. Ac tortor dignissim convallis aenean et. Iaculis urna id volutpat lacus. Id consectetur purus ut faucibus pulvinar. Aliquam ultrices sagittis orci a scelerisque purus. Placerat in egestas erat imperdiet sed. Senectus et netus et malesuada fames. Tincidunt arcu non sodales neque sodales ut. A diam sollicitudin tempor id. Sit amet aliquam id diam maecenas ultricies mi eget mauris. [/div][/div] [div class="textcontainer tabsContent tabsContent3" style="display: none;"][div class=text]

Role 1:
- Libero justo laoreet sit amet cursus sit amet. Tristique sollicitudin nibh sit amet commodo nulla. Massa massa ultricies mi quis. Nulla facilisi etiam dignissim diam quis enim.
Role 2:
- Justo laoreet sit amet cursus sit amet. Tristique sollicitudin nibh sit amet commodo nulla. Massa massa ultricies mi quis. Nulla facilisi etiam dignissim diam quis enim.
Role 3:
- Laoreet sit amet cursus sit amet. Tristique sollicitudin nibh sit amet commodo nulla. Massa massa ultricies mi quis. Nulla facilisi etiam dignissim diam quis enim.

[/div][/div] [div class="textcontainer tabsContent tabsContent4" style="display: none;"][div class=text]Auctor augue mauris augue neque gravida in fermentum. Vulputate mi sit amet mauris commodo quis imperdiet massa. Ac feugiat sed lectus vestibulum mattis ullamcorper. Amet volutpat consequat mauris nunc congue nisi. Massa id neque aliquam vestibulum morbi blandit cursus. Non pulvinar neque laoreet suspendisse interdum. Venenatis cras sed felis eget velit aliquet sagittis id consectetur. Pharetra vel turpis nunc eget lorem. Duis convallis convallis tellus id interdum velit. Feugiat sed lectus vestibulum mattis. In hendrerit gravida rutrum quisque non tellus orci ac. Sed cras ornare arcu dui vivamus arcu. Adipiscing tristique risus nec feugiat. Viverra orci sagittis eu volutpat odio facilisis mauris sit. Pellentesque nec nam aliquam sem et tortor consequat.

Magna etiam tempor orci eu lobortis elementum nibh tellus. Ultricies mi quis hendrerit dolor magna eget est. Fermentum leo vel orci porta. Mattis rhoncus urna neque viverra justo. Velit aliquet sagittis id consectetur purus ut. Neque gravida in fermentum et sollicitudin. Sed elementum tempus egestas sed. Elit duis tristique sollicitudin nibh. Pharetra diam sit amet nisl. Urna neque viverra justo nec ultrices dui sapien. Leo vel fringilla est ullamcorper eget.

Sed vulputate odio ut enim blandit volutpat. Malesuada fames ac turpis egestas. Mauris rhoncus aenean vel elit scelerisque mauris pellentesque. Sit amet luctus venenatis lectus magna fringilla urna. Aliquet sagittis id consectetur purus ut faucibus pulvinar. Feugiat scelerisque varius morbi enim. Sed velit dignissim sodales ut eu sem integer. Eget arcu dictum varius duis. Nulla aliquet porttitor lacus luctus accumsan tortor posuere. Diam phasellus vestibulum lorem sed risus. In fermentum et sollicitudin ac orci phasellus egestas.

Ac turpis egestas maecenas pharetra convallis posuere. Tempor orci dapibus ultrices in iaculis nunc sed augue lacus. Nibh praesent tristique magna sit amet purus gravida quis. Laoreet non curabitur gravida arcu ac. Placerat vestibulum lectus mauris ultrices. At erat pellentesque adipiscing commodo elit at imperdiet dui. Mattis molestie a iaculis at erat pellentesque adipiscing. Nisl nisi scelerisque eu ultrices vitae auctor. Sapien eget mi proin sed libero enim. A diam sollicitudin tempor id eu nisl. Morbi leo urna molestie at. Blandit volutpat maecenas volutpat blandit aliquam etiam erat.

Leo duis ut diam quam. Sed augue lacus viverra vitae congue eu consequat ac felis. Mauris a diam maecenas sed enim. Pretium aenean pharetra magna ac placerat vestibulum lectus mauris ultrices. Et malesuada fames ac turpis egestas integer eget. At varius vel pharetra vel. Sodales ut etiam sit amet nisl purus in. Adipiscing vitae proin sagittis nisl rhoncus mattis rhoncus urna neque. Leo in vitae turpis massa sed. Nulla aliquet enim tortor at auctor urna nunc id cursus. Nisl vel pretium lectus quam id leo in vitae. Cras tincidunt lobortis feugiat vivamus. Porttitor rhoncus dolor purus non enim praesent elementum facilisis leo. Ornare massa eget egestas purus viverra accumsan in nisl nisi. Id neque aliquam vestibulum morbi blandit cursus risus. Adipiscing elit pellentesque habitant morbi tristique senectus et netus. [/div][/div] [div class="textcontainer tabsContent tabsContent5" style="display: none;"][div class=text]

Rule 1: Amet volutpat consequat mauris nunc congue nisi. Massa id neque aliquam vestibulum morbi blandit cursus.
Rule 2: Ullamcorper. Amet volutpat consequat mauris nunc congue nisi. Massa id neque aliquam vestibulum morbi blandit cursus.
Rule 3: Mattis ullamcorper. Amet volutpat consequat mauris nunc congue nisi. Massa id neque aliquam vestibulum morbi blandit cursus.
Rule 4: Feugiat sed lectus vestibulum mattis ullamcorper. Amet volutpat consequat mauris nunc congue nisi. Massa id neque aliquam vestibulum morbi blandit cursus.
Rule 5: Vestibulum mattis ullamcorper. Amet volutpat consequat mauris nunc congue nisi. Massa id neque aliquam vestibulum morbi blandit cursus.
Rule 6: Sed lectus vestibulum mattis ullamcorper. Amet volutpat consequat mauris nunc congue nisi. Massa id neque aliquam vestibulum morbi blandit cursus.
Rule 7: Ac feugiat sed lectus vestibulum mattis ullamcorper. Amet volutpat consequat mauris nunc congue nisi. Massa id neque aliquam vestibulum morbi blandit cursus.

[/div][/div] [div class="header tabsContent tabsContent2" style="display: none;"]plot.[/div] [div class="header tabsContent tabsContent3" style="display: none;"]roles.[/div] [div class="header tabsContent tabsContent4" style="display: none;"]lore.[/div] [div class="header tabsContent tabsContent5" style="display: none;"]rules.[/div] [/div] [div class=credit]code by

sox [/div]

Code:

[nobr]
[class=bkgd]
   --light-color: #B7D69E;
   --accent-color: #882825;
   --dark-color: #0A1008;
   position: relative;
   margin-left: auto;
   margin-right: auto;
   margin-bottom: 6px;
   width: 350px;
   height: 250px;
   background: url(https://i.pinimg.com/564x/3f/1d/66/3f1d661fba9eb6b0f83888d5e5243448.jpg);
   filter: grayscale(20%);
   background-size: 100%;
   border: 8px solid var(--light-color);
   cursor: url('https://i.imgur.com/FMvuswx.png'), auto;
   box-shadow: 5px 5px 0px var(--accent-color);
[/class]

[class=title]
   position: absolute;
   text-align: center;
   top: 35%;
   width: 100%;
   height: auto;
   font-size: 35px;
   color: var(--light-color);
   text-transform: uppercase;
   text-shadow: 3px 3px 0px var(--accent-color);
   font-weight: 700;
[/class]

[class=titleback]
   position: absolute;
   top: 37%;
   width: 100%;
   height: 20%;
   background-color: var(--dark-color);
   opacity: 1;
   border-top: 2px solid var(--light-color);
   border-bottom: 2px solid var(--light-color);
[/class]

[class=header]
   position: absolute;
   text-align: left;
   top: 3%;
   left: 5%;
   width: 100%;
   height: auto;
   font-size: 20px;
   color: var(--light-color);
   text-transform: uppercase;
   text-shadow: 2px 2px 0px var(--accent-color);
   font-style: italic;
   font-weight: 700;
[/class]

[class=textcontainer]
   position: absolute;
   top: 10%;
   width: 100%;
   height: 65%;
   background-color: var(--dark-color);
   opacity: 1;
   padding-top: 20px;
   overflow: hidden;
[/class]

[class=text]
   position: relative;
   width: 84%;
   height: 90%;
   overflow: auto;
   color: #fff;
   font-size: 10px;
   line-height: 12px;
   text-align: justify;
   padding-left: 30px;
   padding-right: 60px;
[/class]

[class=tab]
   position: absolute;
   width: 15px;
   height: 8.5px;
   background-color: var(--light-color);
   top: 90%;
   border-radius: 10%;
   transition-duration: 0.3s;
[/class]

[class name=tab state=hover]
   background-color: var(--accent-color);
   transition-duration: 0.3s;
[/class]

[class=tabback]
   position: absolute;
   top: 87%;
   width: 100%;
   height: 8.5%;
   background-color: var(--dark-color);
   opacity: 1;
[/class]

[class=credit]
        position: relative;
        overflow: hidden;
        width: 100%;
        height: 10px;
        text-align: center;
        font-style: normal;
        font-weight: normal;
        font-size: 8px;
        color: #dedede;
        opacity: 0.2;
[/class]

[script class=tab on=click]
     hide tabsContent
     set currentTab (getText)
     if (eq ${currentTab} 1) (fadeIn 300 tabsContent1)
     if (eq ${currentTab} 2) (fadeIn 300 tabsContent2)
     if (eq ${currentTab} 3) (fadeIn 300 tabsContent3)
     if (eq ${currentTab} 4) (fadeIn 300 tabsContent4)
     if (eq ${currentTab} 5) (fadeIn 300 tabsContent5)
[/script]

[div class=bkgd]
   [div class="titleback tabsContent tabsContent1"][/div]
   [div class="title tabsContent tabsContent1"][font=Viga]cold-blooded.[/font][/div]
   [div class=tabback][/div]
   [div class=tab style="left: 130px;"][div=opacity:0]1[/div][/div]
   [div class=tab style="left: 150px;"][div=opacity:0]2[/div][/div]
   [div class=tab style="left: 170px;"][div=opacity:0]3[/div][/div]
   [div class=tab style="left: 190px;"][div=opacity:0]4[/div][/div]
   [div class=tab style="left: 210px;"][div=opacity:0]5[/div][/div]

   [div class="textcontainer tabsContent tabsContent2" style="display: none;"][div class=text][font=Raleway]
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Libero justo laoreet sit amet cursus sit amet. Tristique sollicitudin nibh sit amet commodo nulla. Aliquam ultrices sagittis orci a scelerisque.
[br][/br][br][/br]
Tristique senectus et netus et malesuada fames. Bibendum ut tristique et egestas quis ipsum suspendisse ultrices. Malesuada pellentesque elit eget gravida cum sociis natoque penatibus. Interdum velit euismod in pellentesque massa placerat. Eget dolor morbi non arcu risus quis varius quam. Viverra mauris in aliquam sem fringilla ut morbi tincidunt.
[br][/br][br][/br]
Elementum sagittis vitae et leo. Tincidunt tortor aliquam nulla facilisi cras fermentum odio. Ipsum consequat nisl vel pretium lectus quam id leo. Accumsan sit amet nulla facilisi morbi tempus. Tempor nec feugiat nisl pretium. Lacus laoreet non curabitur gravida arcu ac tortor. Sit amet porttitor eget dolor morbi. Vivamus arcu felis bibendum ut tristique.
[br][/br][br][/br]
Tristique senectus et netus et malesuada fames. Fusce id velit ut tortor pretium. Risus sed vulputate odio ut enim. Sagittis nisl rhoncus mattis rhoncus urna. Habitant morbi tristique senectus et netus et malesuada. Vulputate eu scelerisque felis imperdiet proin. Quam id leo in vitae turpis. Pharetra et ultrices neque ornare aenean euismod elementum nisi quis. Justo donec enim diam vulputate ut pharetra. Mauris in aliquam sem fringilla ut morbi.
[br][/br][br][/br]
Duis at tellus at urna condimentum mattis pellentesque. Gravida quis blandit turpis cursus in hac habitasse. Enim blandit volutpat maecenas volutpat blandit aliquam. Tincidunt id aliquet risus feugiat in. Ac tortor dignissim convallis aenean et. Iaculis urna id volutpat lacus. Id consectetur purus ut faucibus pulvinar. Aliquam ultrices sagittis orci a scelerisque purus. Placerat in egestas erat imperdiet sed. Senectus et netus et malesuada fames. Tincidunt arcu non sodales neque sodales ut. A diam sollicitudin tempor id. Sit amet aliquam id diam maecenas ultricies mi eget mauris.
   [/font][/div][/div]

   [div class="textcontainer tabsContent tabsContent3" style="display: none;"][div class=text][font=Raleway]
[LIST]
[*][B]Role 1:[/B]
[LIST]
[*]Libero justo laoreet sit amet cursus sit amet. Tristique sollicitudin nibh sit amet commodo nulla. Massa massa ultricies mi quis. Nulla facilisi etiam dignissim diam quis enim. 
[/LIST]
[*][B]Role 2:[/B]
[LIST]
[*]Justo laoreet sit amet cursus sit amet. Tristique sollicitudin nibh sit amet commodo nulla. Massa massa ultricies mi quis. Nulla facilisi etiam dignissim diam quis enim. 
[/LIST]
[*][B]Role 3:[/B]
[LIST]
[*]Laoreet sit amet cursus sit amet. Tristique sollicitudin nibh sit amet commodo nulla. Massa massa ultricies mi quis. Nulla facilisi etiam dignissim diam quis enim. 
[/LIST]
[/LIST]
   [/font][/div][/div]

   [div class="textcontainer tabsContent tabsContent4" style="display: none;"][div class=text][font=Raleway]Auctor augue mauris augue neque gravida in fermentum. Vulputate mi sit amet mauris commodo quis imperdiet massa. Ac feugiat sed lectus vestibulum mattis ullamcorper. Amet volutpat consequat mauris nunc congue nisi. Massa id neque aliquam vestibulum morbi blandit cursus. Non pulvinar neque laoreet suspendisse interdum. Venenatis cras sed felis eget velit aliquet sagittis id consectetur. Pharetra vel turpis nunc eget lorem. Duis convallis convallis tellus id interdum velit. Feugiat sed lectus vestibulum mattis. In hendrerit gravida rutrum quisque non tellus orci ac. Sed cras ornare arcu dui vivamus arcu. Adipiscing tristique risus nec feugiat. Viverra orci sagittis eu volutpat odio facilisis mauris sit. Pellentesque nec nam aliquam sem et tortor consequat.
[br][/br][br][/br]
Magna etiam tempor orci eu lobortis elementum nibh tellus. Ultricies mi quis hendrerit dolor magna eget est. Fermentum leo vel orci porta. Mattis rhoncus urna neque viverra justo. Velit aliquet sagittis id consectetur purus ut. Neque gravida in fermentum et sollicitudin. Sed elementum tempus egestas sed. Elit duis tristique sollicitudin nibh. Pharetra diam sit amet nisl. Urna neque viverra justo nec ultrices dui sapien. Leo vel fringilla est ullamcorper eget.
[br][/br][br][/br]
Sed vulputate odio ut enim blandit volutpat. Malesuada fames ac turpis egestas. Mauris rhoncus aenean vel elit scelerisque mauris pellentesque. Sit amet luctus venenatis lectus magna fringilla urna. Aliquet sagittis id consectetur purus ut faucibus pulvinar. Feugiat scelerisque varius morbi enim. Sed velit dignissim sodales ut eu sem integer. Eget arcu dictum varius duis. Nulla aliquet porttitor lacus luctus accumsan tortor posuere. Diam phasellus vestibulum lorem sed risus. In fermentum et sollicitudin ac orci phasellus egestas.
[br][/br][br][/br]
Ac turpis egestas maecenas pharetra convallis posuere. Tempor orci dapibus ultrices in iaculis nunc sed augue lacus. Nibh praesent tristique magna sit amet purus gravida quis. Laoreet non curabitur gravida arcu ac. Placerat vestibulum lectus mauris ultrices. At erat pellentesque adipiscing commodo elit at imperdiet dui. Mattis molestie a iaculis at erat pellentesque adipiscing. Nisl nisi scelerisque eu ultrices vitae auctor. Sapien eget mi proin sed libero enim. A diam sollicitudin tempor id eu nisl. Morbi leo urna molestie at. Blandit volutpat maecenas volutpat blandit aliquam etiam erat.
[br][/br][br][/br]
Leo duis ut diam quam. Sed augue lacus viverra vitae congue eu consequat ac felis. Mauris a diam maecenas sed enim. Pretium aenean pharetra magna ac placerat vestibulum lectus mauris ultrices. Et malesuada fames ac turpis egestas integer eget. At varius vel pharetra vel. Sodales ut etiam sit amet nisl purus in. Adipiscing vitae proin sagittis nisl rhoncus mattis rhoncus urna neque. Leo in vitae turpis massa sed. Nulla aliquet enim tortor at auctor urna nunc id cursus. Nisl vel pretium lectus quam id leo in vitae. Cras tincidunt lobortis feugiat vivamus. Porttitor rhoncus dolor purus non enim praesent elementum facilisis leo. Ornare massa eget egestas purus viverra accumsan in nisl nisi. Id neque aliquam vestibulum morbi blandit cursus risus. Adipiscing elit pellentesque habitant morbi tristique senectus et netus.
   [/font][/div][/div]

   [div class="textcontainer tabsContent tabsContent5" style="display: none;"][div class=text][font=Raleway]
[LIST]
[*]Rule 1: Amet volutpat consequat mauris nunc congue nisi. Massa id neque aliquam vestibulum morbi blandit cursus. 
[*]Rule 2: Ullamcorper. Amet volutpat consequat mauris nunc congue nisi. Massa id neque aliquam vestibulum morbi blandit cursus. 
[*]Rule 3: Mattis ullamcorper. Amet volutpat consequat mauris nunc congue nisi. Massa id neque aliquam vestibulum morbi blandit cursus. 
[*]Rule 4: Feugiat sed lectus vestibulum mattis ullamcorper. Amet volutpat consequat mauris nunc congue nisi. Massa id neque aliquam vestibulum morbi blandit cursus. 
[*]Rule 5: Vestibulum mattis ullamcorper. Amet volutpat consequat mauris nunc congue nisi. Massa id neque aliquam vestibulum morbi blandit cursus. 
[*]Rule 6: Sed lectus vestibulum mattis ullamcorper. Amet volutpat consequat mauris nunc congue nisi. Massa id neque aliquam vestibulum morbi blandit cursus. 
[*]Rule 7: Ac feugiat sed lectus vestibulum mattis ullamcorper. Amet volutpat consequat mauris nunc congue nisi. Massa id neque aliquam vestibulum morbi blandit cursus. 
[/LIST]
   [/font][/div][/div]

   [div class="header tabsContent tabsContent2" style="display: none;"][font=Viga]plot.[/font][/div]
   [div class="header tabsContent tabsContent3" style="display: none;"][font=Viga]roles.[/font][/div]
   [div class="header tabsContent tabsContent4" style="display: none;"][font=Viga]lore.[/font][/div]
   [div class="header tabsContent tabsContent5" style="display: none;"][font=Viga]rules.[/font][/div]
[/div]
[/nobr][div class=credit]code by [USER=2383][COLOR=#dedede]sox[/COLOR][/USER][/div]

logastellus · Feb 10, 2020

*on knees praising her codes* oh thank you skilled code goddess for praising us with your beauties.

sox · Feb 10, 2020

irenic said:
*on knees praising her codes* oh thank you skilled code goddess for praising us with your beauties.

it is my only purpose in life

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

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

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

big and complex pls

complex AND mobile friendly step it up sox

space baby.

فلسطين حرة

𝙥𝙖𝙨𝙨𝙞𝙤𝙣 𝙮𝙤𝙪𝙣𝙜 𝙛𝙚𝙫𝙚𝙧

فلسطين حرة

𝙥𝙖𝙨𝙨𝙞𝙤𝙣 𝙮𝙤𝙪𝙣𝙜 𝙛𝙚𝙫𝙚𝙧

.

فلسطين حرة

فلسطين حرة

𝖺 𝗌𝗁𝗂𝗇𝗒 𝗌𝗍𝖺𝗋

فلسطين حرة

𝖺 𝗌𝗁𝗂𝗇𝗒 𝗌𝗍𝖺𝗋

فلسطين حرة

فلسطين حرة

فلسطين حرة

✩

.

فلسطين حرة

A bit of a mess.

فلسطين حرة

A bit of a mess.

midnight reel

فلسطين حرة

فلسطين حرة

.

فلسطين حرة

Users who are viewing this thread

Similar threads