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

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

Realistic or Modern | 𝚃𝚊𝚒𝚗𝚝𝚎𝚍 𝚂𝚎𝚘𝚞𝚕: 𝙲𝚑𝚊𝚛𝚊𝚌𝚝𝚎𝚛 𝚂𝚑𝚎𝚎𝚝𝚜 |

Main
Here
Lore
Here

TerrorKitty

◢ Kitty ◤
Helper
Supporter


This code was specially edited to fit the RP but it's not required. All posts must include their ranking in the survival show 1 - 50 (it's ok if you have the same number as someone else, it will be settled when the RP starts) and their bus number. Bus 1 and 3 are girls only and bus 2 is boys.

I ask for skills habits and other things to be realistic and it's fine to add some trait that might make them good at surviving the apocalypse but it should make sense and be realistic.

No need to write too much or make them too in depth we'll learn about them in the RP.

And finally, the CS's instagram/media posts should be from your character before everything went to hell.

P.S - No Character Limit and character age is 16 - 25









I'm covered in blood and it's not mine

Click Here











given name

answer here






s. name

answer here






age

answer here






rank #

answer here






sexuality

answer here






gender

answer here



















  • a.


















    visage







    hair

    answer






    eyes

    answer






    height

    answer






    weight

    answer




    Build

    answer






    Physicality

    answer















    username


















    username

    caption!











    username


















    username

    caption!











    username


















    username

    caption!






















a.



b.



c.



d.
















♡coded by uxie♡


The CS Code
Code:
[comment]coded by uxie! & edited by TerrorKitty for this RP, also tell Uxie how amazing she is or I'll be mad at u 

fonts used:
[font=Inter]buttons[/font]
[font=Inter]headers[/font]
[font=Karla]body text[/font]

to replace fonts, add/replace them here, and then in the variables below under *fonts; check uxie's tech support in nine lives for more details ( ‾́ ◡ ‾́ )

[/comment][border=transparent;
/*top header background colour*/
--bg-color-1: #5f6b60;
/*bottom section background colour*/
--bg-color-2: #61755a;
/*text container background colour*/
--bg-color-3: #acb5af;

/*first accent colour -- make it contrast w color-2 and bg-color-1*/
--color-1: #000000;
/*second accent colour -- main splash of colour. contrast w color-1 and bg-color-2/3*/
--color-2: #ebdfce;
/*third accent colour -- not used for much, currently slightly darker variation of bg-color-2*/
--color-3: #424a42;
/*fourth accent colour -- advise to keep as bg-color-1 unless it looks weird due to other colours used*/
--color-4: var(--bg-color-1);

/*header colour 1 -- contrast w color-2 and bg-color-1*/
--h1: #000000;
/*header colour 2*/
--h2: var(--color-2);
/*text colour -- contrast w bg-color-3*/
--t-color: #000000;

/*fonts used*/
--button: 'Inter', sans-serif;
--header: 'Inter', sans-serif;
--body: 'Karla', sans-serif;

/*images/icons on each tab! img-1 is in the header, img-2 is on psyche page, img-3 is on history page*/
--img-1: url('https://i.imgur.com/JtbawEG.gif');
--img-2: url('https://i.imgur.com/JtbawEG.gif');
--img-3: url('https://i.imgur.com/JtbawEG.gif');

/*instagram gallery images -- to make a new one, just follow the format and change the numbers*/
--icon: url('https://i.imgur.com/JtbawEG.gif');
--gimg-1: url('https://i.imgur.com/JtbawEG.gif');
--gimg-2: url('https://i.imgur.com/JtbawEG.gif');
--gimg-3: url('https://i.imgur.com/JtbawEG.gif');

/*music player image*/
--music: url('https://i.imgur.com/JtbawEG.gif');

/*relationship images -- to make a new one, just follow the format and change the numbers*/
--r1: url('https://i.imgur.com/JtbawEG.gif');
--r2: url('https://i.imgur.com/JtbawEG.gif');


height:auto; width:100%; padding:0; line-height:0; overflow-x:auto; background-size:cover;][border=transparent; height:auto; width:100%; max-width:430px; padding:0; box-sizing:border-box; display:flex; flex-flow:row wrap; justify-content:center; position:relative; margin:20px auto; border-radius:5px; overflow:hidden;

--f1: 28; --f2: 72; --f1m: 120px; --f2m: 230px; --f1mw: 260px;]

   [comment]----row one----[/comment]
   [border=transparent; height:auto; width:100%; padding:5px; box-sizing:border-box; display:flex; flex-flow:row-reverse wrap; justify-content:center; background: var(--bg-color-1);]
      [comment]----image (basics)----[/comment]
      [border=transparent; height:120px; flex: var(--f2); min-width: var(--f2m); max-width:clamp(180px, 100vw, 268px); padding:0; border-radius:5px; margin:8px;

position:relative; overflow:hidden;][border=transparent; height:100%; width:100%; padding:0; background: var(--img-1); background-size:cover; pointer-events:none;

/*edit the following to adjust the cropping of the image*/ background-position:50% 40%;

position:absolute; top:0; left:0; z-index:2;][border=transparent; height:100%; width:100%; padding:0; background: var(--bg-color-2); opacity:0.2;][/border][/border][border=transparent; height:calc(100% + 130px); width:100%; padding:0; box-sizing:border-box; margin:15px -7px 0 -7px; display:flex; flex-flow:column nowrap; justify-content:flex-end;][accordion=100%;]

         {slide=[border=transparent; height:245px; width:100%; padding:10px; box-sizing:border-box; font-weight:normal; font-variant:none; margin:20px 0 0 0; pointer-events:auto; display:flex; flex-flow:column nowrap; align-items:center;]

[comment]----slide one----[/comment]
[border=transparent; height:120px; width:100%; padding:0; display:flex; flex-flow:row nowrap; align-items:flex-start; justify-content:flex-start; position:relative;][border=transparent; height:auto; width:fit-content; max-width:140px; padding:0; position:relative; z-index:3; margin:4px 0 120px 0;][border=transparent; height:auto; width:auto; display:inline; padding:3px 7px 3px 7px; box-sizing:border-box; background: var(--color-2); color: var(--color-1); font-family: var(--header); text-transform:uppercase; letter-spacing:2px; line-height:150%; font-size:11px; font-weight:bold; border-radius:3px; -webkit-box-decoration-break: clone;][comment]

----* * * name/role here----

[/comment]I'm covered in blood and it's not mine[/border]
[/border][border=transparent; height:auto; width:auto; padding:0; color: var(--color-1); font-size:8px; font-weight:bold; text-transform:uppercase; position:absolute; top:100px; left:0; z-index:3; letter-spacing:2px; opacity:0.8;][B]Click Here[/B][/border][/border]

[comment]----slide two (basics)----[/comment]
[border=transparent; height:120px; width:100%; padding:3px; box-sizing:border-box; display:flex; flex-flow:row nowrap; align-items:center; justify-content:flex-start; margin-top:auto;]
   [border=transparent; height:95px; width:clamp(180px, 100vw - 20px, 241px); padding:6px 7px; box-sizing:border-box; position:relative; z-index:3; border-radius:3px; overflow:hidden; display:flex; flex-flow:row nowrap;][border=transparent; height:100%; width:100%; padding:0; background: var(--bg-color-3); opacity:0.7; position:absolute; top:0; left:0; z-index:1;][/border]

      [comment]----content----[/comment]
      [border=transparent; height:100%; flex:1; padding:0; margin-right:3px; position:relative; z-index:3; display:flex; flex-direction:column; overflow:hidden;][border=transparent; height:100%; width:200%; padding:0; overflow-y:scroll;][border=transparent; height:auto; width:50%; padding:0; display:flex; flex-flow:row wrap;]

         [comment]----copy this whole thing to get another tag----[/comment]
         [border=transparent; height:auto; flex:1 0; min-width:45%; padding:0; display:flex; flex-flow:column nowrap; margin:4px 3px;]
[border=transparent; height:fit-content; width:auto; max-width:86px; padding:1px 4px; box-sizing:border-box; background: var(--color-2); border-radius:2px; color: var(--h1); text-transform:uppercase; font-weight:bold; font-size:11px; letter-spacing:1px; line-height:14px; margin-right:auto; font-family: var(--body);][comment]

----* * * info title here----

[/comment]given name[/border]
[border=transparent; height:auto; flex:1; padding:0; color: var(--t-color); font-size:12px; line-height:14px; margin:4px 0 0 2px; font-family: var(--body); text-transform:uppercase;][comment]

----* * * info contents here----

[/comment]answer here[/border]
         [/border]
         [comment]----copy me too!----[/comment]

         [comment]----copy this whole thing to get another tag----[/comment]
         [border=transparent; height:auto; flex:1 0; min-width:45%; padding:0; display:flex; flex-flow:column nowrap; margin:4px 3px;]
[border=transparent; height:fit-content; width:auto; max-width:86px; padding:1px 4px; box-sizing:border-box; background: var(--color-2); border-radius:2px; color: var(--h1); text-transform:uppercase; font-weight:bold; font-size:11px; letter-spacing:1px; line-height:14px; margin-right:auto; font-family: var(--body);][comment]

----* * * info title here----

[/comment]s. name[/border]
[border=transparent; height:auto; flex:1; padding:0; color: var(--t-color); font-size:12px; line-height:14px; margin:4px 0 0 2px; font-family: var(--body); text-transform:uppercase;][comment]

----* * * info contents here----

[/comment]answer here[/border]
         [/border]
         [comment]----copy me too!----[/comment]

         [comment]----copy this whole thing to get another tag----[/comment]
         [border=transparent; height:auto; flex:1 0; min-width:45%; padding:0; display:flex; flex-flow:column nowrap; margin:4px 3px;]
[border=transparent; height:fit-content; width:auto; max-width:86px; padding:1px 4px; box-sizing:border-box; background: var(--color-2); border-radius:2px; color: var(--h1); text-transform:uppercase; font-weight:bold; font-size:11px; letter-spacing:1px; line-height:14px; margin-right:auto; font-family: var(--body);][comment]

----* * * info title here----

[/comment]age[/border]
[border=transparent; height:auto; flex:1; padding:0; color: var(--t-color); font-size:12px; line-height:14px; margin:4px 0 0 2px; font-family: var(--body); text-transform:uppercase;][comment]

----* * * info contents here----

[/comment]answer here[/border]
         [/border]
         [comment]----copy me too!----[/comment]

         [comment]----copy this whole thing to get another tag----[/comment]
         [border=transparent; height:auto; flex:1 0; min-width:45%; padding:0; display:flex; flex-flow:column nowrap; margin:4px 3px;]
[border=transparent; height:fit-content; width:auto; max-width:86px; padding:1px 4px; box-sizing:border-box; background: var(--color-2); border-radius:2px; color: var(--h1); text-transform:uppercase; font-weight:bold; font-size:11px; letter-spacing:1px; line-height:14px; margin-right:auto; font-family: var(--body);][comment]

----* * * info title here----

[/comment]rank #[/border]
[border=transparent; height:auto; flex:1; padding:0; color: var(--t-color); font-size:12px; line-height:14px; margin:4px 0 0 2px; font-family: var(--body); text-transform:uppercase;][comment]

----* * * info contents here----

[/comment]answer here[/border]
         [/border]
         [comment]----copy me too!----[/comment]

         [comment]----copy this whole thing to get another tag----[/comment]
         [border=transparent; height:auto; flex:1 0; min-width:45%; padding:0; display:flex; flex-flow:column nowrap; margin:4px 3px;]
[border=transparent; height:fit-content; width:auto; max-width:86px; padding:1px 4px; box-sizing:border-box; background: var(--color-2); border-radius:2px; color: var(--h1); text-transform:uppercase; font-weight:bold; font-size:11px; letter-spacing:1px; line-height:14px; margin-right:auto; font-family: var(--body);][comment]

----* * * info title here----

[/comment]sexuality[/border]
[border=transparent; height:auto; flex:1; padding:0; color: var(--t-color); font-size:12px; line-height:14px; margin:4px 0 0 2px; font-family: var(--body); text-transform:uppercase;][comment]

----* * * info contents here----

[/comment]answer here[/border]
         [/border]
         [comment]----copy me too!----[/comment]

         [comment]----copy this whole thing to get another tag----[/comment]
         [border=transparent; height:auto; flex:1 0; min-width:45%; padding:0; display:flex; flex-flow:column nowrap; margin:4px 3px;]
[border=transparent; height:fit-content; width:auto; max-width:86px; padding:1px 4px; box-sizing:border-box; background: var(--color-2); border-radius:2px; color: var(--h1); text-transform:uppercase; font-weight:bold; font-size:11px; letter-spacing:1px; line-height:14px; margin-right:auto; font-family: var(--body);][comment]

----* * * info title here----

[/comment]gender[/border]
[border=transparent; height:auto; flex:1; padding:0; color: var(--t-color); font-size:12px; line-height:14px; margin:4px 0 0 2px; font-family: var(--body); text-transform:uppercase;][comment]

----* * * info contents here----

[/comment]answer here[/border]
         [/border]
         [comment]----copy me too!----[/comment]

      [/border][/border][/border]
      [comment]----content end----[/comment]
   [/border]
[/border]
[comment]----slide two end----[/comment]
         [/border]}[border=transparent; height:107px; width:100%; padding:0; pointer-events:none; position:relative; z-index:3;][/border]{/slide}

      [/accordion][/border][/border]
      [comment]----image end----[/comment]

      [comment]----tabs----[/comment]
      [border=transparent; height:clamp(40px, 15vw, 115px); flex: var(--f1); min-width: var(--f1m); max-width: var(--f1mw); padding:0; box-sizing:border-box; margin:clamp(7px, 2vw, 12px) 8px 8px 8px;][border=transparent; height:100%; width:100%; padding:0; overflow:hidden;][border=transparent; padding:0; margin:7px -40px 0 -15px; letter-spacing:2px; line-height:46px;][tabs]

      [comment]----tab one----[/comment]
      [tab=.][border=transparent; height:100%; width:100%; padding:0; box-sizing:border-box; position:absolute; top:0; left:0; z-index:4; display:flex; flex-flow:row wrap; justify-content:center; pointer-events:none; line-height:0; letter-spacing:0;]

         [comment]----button select----[/comment]
         [border=transparent; height:auto; width:100%; padding:5px; box-sizing:border-box; display:flex; flex-flow:row-reverse wrap; justify-content:center; margin-bottom:auto;][border=transparent; height:120px; flex: var(--f2); min-width: var(--f2m); padding:0; margin:8px;][/border][border=transparent; height:clamp(40px, 16vw, 115px); flex: var(--f1); min-width: var(--f1m); max-width: var(--f1mw); padding:0; box-sizing:border-box; margin:12px 8px 8px 8px; display:flex; flex-flow:row wrap; align-items:flex-end; align-content:center; border-radius:4px; justify-content:center;]

[comment]----selected button----[/comment]
[border=transparent; height:44px; width:44px; padding:3px 0 3px 3px; box-sizing:border-box; margin:3px 4px; position:relative; display:flex; justify-content:center; background: var(--bg-color-1);][border=transparent; height:37px; width:37px; padding:0; background: var(--color-2); opacity:1; position:absolute; top:-4px; left:-6px; z-index:1; border-radius:50%;][/border][border=transparent; height:auto; width:auto; padding:0; font-family: var(--button); color: var(--color-1); font-size:32px; font-weight:bold; -webkit-text-stroke:0.5px var(--color-1); white-space:nowrap; text-transform:uppercase; line-height:100%; letter-spacing:3px; position:relative; z-index:2;]a.[/border][/border]

[comment]----filler button----[/comment]
[border=transparent; height:44px; width:44px; padding:0; margin:3px 4px;][/border]
[comment]----filler button----[/comment]
[border=transparent; height:44px; width:44px; padding:0; margin:3px 4px;][/border]
[comment]----filler button----[/comment]
[border=transparent; height:44px; width:44px; padding:0; margin:3px 4px;][/border]

         [/border][/border]
         [comment]----button select end----[/comment]

         [comment]----tab contents----[/comment]
         [border=transparent; min-height:306px; max-height:500px; width:100%; padding:5px; box-sizing:border-box; display:flex; flex-flow:row wrap; justify-content:center; pointer-events:auto;]

[comment]----appearance container----[/comment]
[border=transparent; height:clamp(190px, 38vw, 280px); flex:55; min-width:200px; padding:0; display:flex; flex-flow:column-reverse nowrap; margin:8px; border-radius:3px; overflow:hidden; background: var(--bg-color-3);]
   [comment]----container title----[/comment]
   [border=transparent; height:28px; width:100%; padding:2px 8px 10px 8px; box-sizing:border-box; display:flex; align-items:center; justify-content:flex-end;][border=transparent; height:auto; width:fit-content; width:-moz-fit-content; padding:4px 7px; box-sizing:border-box; background: var(--bg-color-1); color: var(--h1); font-size:13px; font-family: var(--header); text-transform:uppercase; letter-spacing:2px; line-height:100%; font-weight:bold; border-radius:2px;][comment]

----* * * container title here----

[/comment]visage[/border][/border]

   [comment]----appearance contents----[/comment]
   [border=transparent; height:calc(100% - 28px); width:100%; padding:9px 0; box-sizing:border-box; display:flex; flex-direction:column; overflow:hidden;][border=transparent; height:100%; width:200%; padding:0; overflow-y:scroll;][border=transparent; height:auto; width:50%; padding:0 clamp(1px, 20px - 3.5vw, 9px) 0 9px; box-sizing:border-box; display:flex; flex-flow:column nowrap;][border=transparent; height:0; width:100%; padding:0; margin-bottom:-7px;][/border]

      [comment]----copy this whole thing to make another tag----[/comment]
      [border=transparent; height:auto; width:100%; padding:0; display:flex; flex-flow:row nowrap; margin-top:7px;]
         [border=transparent; height:fit-content; width:auto; max-width:84px; padding:1px 0; box-sizing:border-box; flex-shrink:0;][border=transparent; height:auto; width:auto; padding:1px 4px 2px 4px; box-sizing:border-box; background: var(--color-2); border-radius:2px; color: var(--h1); text-transform:uppercase; font-weight:bold; font-size:11px; letter-spacing:1px; line-height:15px; font-family: var(--body); display:inline; -webkit-box-decoration-break:clone;][comment]

----* * * info title here----

[/comment]hair[/border][/border]
         [border=transparent; height:auto; flex:1; padding:0; margin:1px 0 0 10px; color: var(--t-color); font-size:11px; line-height:14px; font-family: var(--body); text-align:justify;][comment]

----* * * info contents here----

[/comment]answer[/border]
      [/border]
      [comment]---copy me too!----[/comment]

      [comment]----copy this whole thing to make another tag----[/comment]
      [border=transparent; height:auto; width:100%; padding:0; display:flex; flex-flow:row nowrap; margin-top:7px;]
         [border=transparent; height:fit-content; width:auto; max-width:84px; padding:1px 0; box-sizing:border-box; flex-shrink:0;][border=transparent; height:auto; width:auto; padding:1px 4px 2px 4px; box-sizing:border-box; background: var(--color-2); border-radius:2px; color: var(--h1); text-transform:uppercase; font-weight:bold; font-size:11px; letter-spacing:1px; line-height:15px; font-family: var(--body); display:inline; -webkit-box-decoration-break:clone;][comment]

----* * * info title here----

[/comment]eyes[/border][/border]
         [border=transparent; height:auto; flex:1; padding:0; margin:1px 0 0 10px; color: var(--t-color); font-size:11px; line-height:14px; font-family: var(--body); text-align:justify;][comment]

----* * * info contents here----

[/comment]answer[/border]
      [/border]
      [comment]---copy me too!----[/comment]

      [comment]----copy this whole thing to make another tag----[/comment]
      [border=transparent; height:auto; width:100%; padding:0; display:flex; flex-flow:row nowrap; margin-top:7px;]
         [border=transparent; height:fit-content; width:auto; max-width:84px; padding:1px 0; box-sizing:border-box; flex-shrink:0;][border=transparent; height:auto; width:auto; padding:1px 4px 2px 4px; box-sizing:border-box; background: var(--color-2); border-radius:2px; color: var(--h1); text-transform:uppercase; font-weight:bold; font-size:11px; letter-spacing:1px; line-height:15px; font-family: var(--body); display:inline; -webkit-box-decoration-break:clone;][comment]

----* * * info title here----

[/comment]height[/border][/border]
         [border=transparent; height:auto; flex:1; padding:0; margin:1px 0 0 10px; color: var(--t-color); font-size:11px; line-height:14px; font-family: var(--body); text-align:justify;][comment]

----* * * info contents here----

[/comment]answer[/border]
      [/border]
      [comment]---copy me too!----[/comment]

      [comment]----copy this whole thing to make another tag----[/comment]
      [border=transparent; height:auto; width:100%; padding:0; display:flex; flex-flow:row nowrap; margin-top:7px;]
         [border=transparent; height:fit-content; width:auto; max-width:84px; padding:1px 0; box-sizing:border-box; flex-shrink:0;][border=transparent; height:auto; width:auto; padding:1px 4px 2px 4px; box-sizing:border-box; background: var(--color-2); border-radius:2px; color: var(--h1); text-transform:uppercase; font-weight:bold; font-size:11px; letter-spacing:1px; line-height:15px; font-family: var(--body); display:inline; -webkit-box-decoration-break:clone;][comment]

----* * * info title here----

[/comment]weight[/border][/border]
         [border=transparent; height:auto; flex:1; padding:0; margin:1px 0 0 10px; color: var(--t-color); font-size:11px; line-height:14px; font-family: var(--body); text-align:justify;][comment]

----* * * info contents here----

[/comment]answer[/border]
      [/border]
      [comment]---copy me too!----[/comment] [comment]----copy this whole thing to make another tag----[/comment]
      [border=transparent; height:auto; width:100%; padding:0; display:flex; flex-flow:row nowrap; margin-top:7px;]
         [border=transparent; height:fit-content; width:auto; max-width:84px; padding:1px 0; box-sizing:border-box; flex-shrink:0;][border=transparent; height:auto; width:auto; padding:1px 4px 2px 4px; box-sizing:border-box; background: var(--color-2); border-radius:2px; color: var(--h1); text-transform:uppercase; font-weight:bold; font-size:11px; letter-spacing:1px; line-height:15px; font-family: var(--body); display:inline; -webkit-box-decoration-break:clone;][comment]

----* * * info title here----

[/comment]Build[/border][/border] 
         [border=transparent; height:auto; flex:1; padding:0; margin:1px 0 0 10px; color: var(--t-color); font-size:11px; line-height:14px; font-family: var(--body); text-align:justify;][comment]

----* * * info contents here----

[/comment]answer[/border]
      [/border]
      [comment]---copy me too!----[/comment]

[comment]---copy me too!----[/comment] [comment]----copy this whole thing to make another tag----[/comment]
      [border=transparent; height:auto; width:100%; padding:0; display:flex; flex-flow:row nowrap; margin-top:7px;]
         [border=transparent; height:fit-content; width:auto; max-width:84px; padding:1px 0; box-sizing:border-box; flex-shrink:0;][border=transparent; height:auto; width:auto; padding:1px 4px 2px 4px; box-sizing:border-box; background: var(--color-2); border-radius:2px; color: var(--h1); text-transform:uppercase; font-weight:bold; font-size:11px; letter-spacing:1px; line-height:15px; font-family: var(--body); display:inline; -webkit-box-decoration-break:clone;][comment]

----* * * info title here----

[/comment]Physicality[/border][/border] 
         [border=transparent; height:auto; flex:1; padding:0; margin:1px 0 0 10px; color: var(--t-color); font-size:11px; line-height:14px; font-family: var(--body); text-align:justify;][comment]

----* * * info contents here----

[/comment]answer[/border]
      [/border]
      [comment]---copy me too!----[/comment]

   [/border][/border][/border]
   [comment]----appearance contents end----[/comment]
[/border]
[comment]----appearance container end----[/comment]

[comment]----instagram gallery----[/comment]
[border=transparent; min-height:230px; max-height:280px; flex:45; min-width:150px; max-width:250px; padding:5px 0; box-sizing:border-box; margin:8px; background: var(--bg-color-3); border-radius:4px; display:flex; flex-direction:column; overflow:hidden;][border=transparent; height:100%; width:200%; padding:0; overflow-y:scroll; scroll-snap-type:y mandatory;][border=transparent; height:0; width:100%; padding:0; margin-bottom:-10px;][/border]

   [comment]----copy this whole thing to make another post----[/comment]
   [border=transparent; height:100%; width:clamp(165px, 50% + 8px, 250px); padding:0 5px; box-sizing:border-box; display:flex; flex-flow:column nowrap; scroll-snap-align:start; margin-top:10px;]
      [comment]----username----[/comment]
      [border=transparent; height:auto; width:100%; padding:2px 3px 7px 3px; box-sizing:border-box; display:flex; flex-flow:row nowrap; align-items:center;][border=transparent; height:25px; width:25px; padding:1px; box-sizing:border-box; border:1px solid var(--color-2); border-radius:50%;][border=transparent; height:100%; width:100%; padding:0; background: var(--icon); background-size:cover; background-position:50% 50%; flex-shrink:0; border-radius:50%;][/border][/border][border=transparent; height:auto; flex:1; margin-left:8px; padding:0; flex-shrink:0; color: var(--t-color); font-size:10px; font-weight:bold; letter-spacing:1px; line-height:100%; font-family: var(--header); display:flex; align-items:flex-end;][comment]

----* * * username here----

[/comment]username[/border][/border]

      [comment]----post image----[/comment]
      [border=transparent; flex:1; min-height:50px; width:100%; padding:0; 

/*edit the following to match the image in the variables*/ background: var(--gimg-1);

 background-size:cover; 

/*edit the following to adjust the cropping of the image*/ background-position:50% 50%;][/border]

      [comment]----post contents----[/comment]
      [border=transparent; height:auto; min-height:30px; padding:8px 3px; box-sizing:border-box; display:flex; flex-flow:column nowrap;]
         [comment]----icons----[/comment]
         [border=transparent; height:auto; width:100%; padding:0; display:flex; flex-flow:row nowrap; font-size:13px;]
[border=transparent; height:auto; width:auto; padding:0; margin-right:8px; color: var(--color-2);][fa]fas fa-heart[/fa][/border]
[border=transparent; height:auto; width:auto; padding:0; margin-right:8px; color: var(--color-3);][fa]far fa-comment[/fa][/border]
[border=transparent; height:auto; width:auto; padding:0; margin-right:8px; color: var(--color-3);][fa]far fa-paper-plane[/fa][/border]
[border=transparent; height:auto; width:auto; padding:0; margin-left:auto; color: var(--color-3);][fa]far fa-bookmark[/fa][/border]
         [/border]

         [comment]----caption----[/comment]
         [border=transparent; height:auto; width:100%; padding:10px 0 0 0; box-sizing:border-box; display:flex; flex-flow:row nowrap; align-items:center;]
[comment]----username----[/comment]
[border=transparent; height:auto; width:auto; margin-right:8px; padding:0; flex-shrink:0; color: var(--t-color); font-size:10px; font-weight:bold; letter-spacing:0.5px; line-height:12px; font-family: var(--header); flex-shrink:0;][comment]

----* * * username here----

[/comment]username[/border]
[border=transparent; height:auto; flex:1; padding:0; color: var(--t-color); font-size:11px; font-family: var(--body); line-height:12px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; margin:2px 0;][comment]

----* * * caption here----

[/comment]caption![/border]
          [/border]
         [comment]----caption end----[/comment]
      [/border]
      [comment]----post contents end----[/comment]
   [/border]
   [comment]----copy me too!----[/comment]

   [comment]----copy this whole thing to make another post----[/comment]
   [border=transparent; height:100%; width:clamp(165px, 50% + 8px, 250px); padding:0 5px; box-sizing:border-box; display:flex; flex-flow:column nowrap; scroll-snap-align:start; margin-top:10px;]
      [comment]----username----[/comment]
      [border=transparent; height:auto; width:100%; padding:2px 3px 7px 3px; box-sizing:border-box; display:flex; flex-flow:row nowrap; align-items:center;][border=transparent; height:25px; width:25px; padding:1px; box-sizing:border-box; border:1px solid var(--color-2); border-radius:50%;][border=transparent; height:100%; width:100%; padding:0; background: var(--icon); background-size:cover; background-position:50% 50%; flex-shrink:0; border-radius:50%;][/border][/border][border=transparent; height:auto; flex:1; margin-left:8px; padding:0; flex-shrink:0; color: var(--t-color); font-size:10px; font-weight:bold; letter-spacing:1px; line-height:100%; font-family: var(--header); display:flex; align-items:flex-end;][comment]

----* * * username here----

[/comment]username[/border][/border]

      [comment]----post image----[/comment]
      [border=transparent; flex:1; min-height:50px; width:100%; padding:0; 

/*edit the following to match the image in the variables*/ background: var(--gimg-2);

background-size:cover; 

/*edit the following to adjust the cropping of the image*/ background-position:50% 50%;][/border]

      [comment]----post contents----[/comment]
      [border=transparent; height:auto; min-height:30px; padding:8px 3px; box-sizing:border-box; display:flex; flex-flow:column nowrap;]
         [comment]----icons----[/comment]
         [border=transparent; height:auto; width:100%; padding:0; display:flex; flex-flow:row nowrap; font-size:13px;]
[border=transparent; height:auto; width:auto; padding:0; margin-right:8px; color: var(--color-2);][fa]fas fa-heart[/fa][/border]
[border=transparent; height:auto; width:auto; padding:0; margin-right:8px; color: var(--color-3);][fa]far fa-comment[/fa][/border]
[border=transparent; height:auto; width:auto; padding:0; margin-right:8px; color: var(--color-3);][fa]far fa-paper-plane[/fa][/border]
[border=transparent; height:auto; width:auto; padding:0; margin-left:auto; color: var(--color-3);][fa]far fa-bookmark[/fa][/border]
         [/border]

         [comment]----caption----[/comment]
         [border=transparent; height:auto; width:100%; padding:10px 0 0 0; box-sizing:border-box; display:flex; flex-flow:row nowrap; align-items:center;]
[comment]----username----[/comment]
[border=transparent; height:auto; width:auto; margin-right:8px; padding:0; flex-shrink:0; color: var(--t-color); font-size:10px; font-weight:bold; letter-spacing:0.5px; line-height:12px; font-family: var(--header); flex-shrink:0;][comment]

----* * * username here----

[/comment]username[/border]
[border=transparent; height:auto; flex:1; padding:0; color: var(--t-color); font-size:11px; font-family: var(--body); line-height:12px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; margin:2px 0;][comment]

----* * * caption here----

[/comment]caption![/border]
          [/border]
         [comment]----caption end----[/comment]
      [/border]
      [comment]----post contents end----[/comment]
   [/border]
   [comment]----copy me too!----[/comment]

   [comment]----copy this whole thing to make another post----[/comment]
   [border=transparent; height:100%; width:clamp(165px, 50% + 8px, 250px); padding:0 5px; box-sizing:border-box; display:flex; flex-flow:column nowrap; scroll-snap-align:start; margin-top:10px;]
      [comment]----username----[/comment]
      [border=transparent; height:auto; width:100%; padding:2px 3px 7px 3px; box-sizing:border-box; display:flex; flex-flow:row nowrap; align-items:center;][border=transparent; height:25px; width:25px; padding:1px; box-sizing:border-box; border:1px solid var(--color-2); border-radius:50%;][border=transparent; height:100%; width:100%; padding:0; background: var(--icon); background-size:cover; background-position:50% 50%; flex-shrink:0; border-radius:50%;][/border][/border][border=transparent; height:auto; flex:1; margin-left:8px; padding:0; flex-shrink:0; color: var(--t-color); font-size:10px; font-weight:bold; letter-spacing:1px; line-height:100%; font-family: var(--header); display:flex; align-items:flex-end;][comment]

----* * * username here----

[/comment]username[/border][/border]

      [comment]----post image----[/comment]
      [border=transparent; flex:1; min-height:50px; width:100%; padding:0; 

/*edit the following to match the image in the variables*/ background: var(--gimg-3);

background-size:cover; 

/*edit the following to adjust the cropping of the image*/ background-position:50% 50%;][/border]

      [comment]----post contents----[/comment]
      [border=transparent; height:auto; min-height:30px; padding:8px 3px; box-sizing:border-box; display:flex; flex-flow:column nowrap;]
         [comment]----icons----[/comment]
         [border=transparent; height:auto; width:100%; padding:0; display:flex; flex-flow:row nowrap; font-size:13px;]
[border=transparent; height:auto; width:auto; padding:0; margin-right:8px; color: var(--color-2);][fa]fas fa-heart[/fa][/border]
[border=transparent; height:auto; width:auto; padding:0; margin-right:8px; color: var(--color-3);][fa]far fa-comment[/fa][/border]
[border=transparent; height:auto; width:auto; padding:0; margin-right:8px; color: var(--color-3);][fa]far fa-paper-plane[/fa][/border]
[border=transparent; height:auto; width:auto; padding:0; margin-left:auto; color: var(--color-3);][fa]far fa-bookmark[/fa][/border]
         [/border]

         [comment]----caption----[/comment]
         [border=transparent; height:auto; width:100%; padding:10px 0 0 0; box-sizing:border-box; display:flex; flex-flow:row nowrap; align-items:center;]
[comment]----username----[/comment]
[border=transparent; height:auto; width:auto; margin-right:8px; padding:0; flex-shrink:0; color: var(--t-color); font-size:10px; font-weight:bold; letter-spacing:0.5px; line-height:12px; font-family: var(--header); flex-shrink:0;][comment]

----* * * username here----

[/comment]username[/border]
[border=transparent; height:auto; flex:1; padding:0; color: var(--t-color); font-size:11px; font-family: var(--body); line-height:12px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; margin:2px 0;][comment]

----* * * caption here----

[/comment]caption![/border]
          [/border]
         [comment]----caption end----[/comment]
      [/border]
      [comment]----post contents end----[/comment]
   [/border]
   [comment]----copy me too!----[/comment]

[/border][/border]
[comment]----instagram gallery end----[/comment]
         [/border]
         [comment]----tab contents end----[/comment]

      [/border][/tab]
      [comment]----tab one end----[/comment]


      [comment]----tab two----[/comment]
      [tab=.][border=transparent; height:100%; width:100%; padding:0; box-sizing:border-box; position:absolute; top:0; left:0; z-index:4; display:flex; flex-flow:row wrap; justify-content:center; pointer-events:none; line-height:0; letter-spacing:0;]

         [comment]----button select----[/comment]
         [border=transparent; height:auto; width:100%; padding:5px; box-sizing:border-box; display:flex; flex-flow:row-reverse wrap; justify-content:center; margin-bottom:auto;][border=transparent; height:120px; flex: var(--f2); min-width: var(--f2m); padding:0; margin:8px;][/border][border=transparent; height:clamp(40px, 16vw, 115px); flex: var(--f1); min-width: var(--f1m); max-width: var(--f1mw); padding:0; box-sizing:border-box; margin:12px 8px 8px 8px; display:flex; flex-flow:row wrap; align-items:flex-end; align-content:center; border-radius:4px; justify-content:center;]
[comment]----filler button----[/comment]
[border=transparent; height:44px; width:44px; padding:0; margin:3px 4px;][/border]

[comment]----selected button----[/comment]
[border=transparent; height:44px; width:44px; padding:3px 0 3px 3px; box-sizing:border-box; margin:3px 4px; position:relative; display:flex; justify-content:center; background: var(--bg-color-1);][border=transparent; height:37px; width:37px; padding:0; background: var(--color-2); opacity:1; position:absolute; top:-4px; left:-6px; z-index:1; border-radius:50%;][/border][border=transparent; height:auto; width:auto; padding:0; font-family: var(--button); color: var(--color-1); font-size:32px; font-weight:bold; -webkit-text-stroke:0.5px var(--color-1); white-space:nowrap; text-transform:uppercase; line-height:100%; letter-spacing:3px; position:relative; z-index:2;]b.[/border][/border]

[comment]----filler button----[/comment]
[border=transparent; height:44px; width:44px; padding:0; margin:3px 4px;][/border]
[comment]----filler button----[/comment]
[border=transparent; height:44px; width:44px; padding:0; margin:3px 4px;][/border]

         [/border][/border]
         [comment]----button select end----[/comment]


         [comment]----tab contents----[/comment]
         [border=transparent; min-height:306px; max-height:500px; width:100%; padding:5px; box-sizing:border-box; display:flex; flex-flow:row wrap; justify-content:center; pointer-events:auto;]

[comment]----left----[/comment]
[border=transparent; min-height:200px; max-height:clamp(200px, 34vw, 306px); flex:32; min-width:150px; max-width:240px; padding:0; margin:clamp(0px, 1.5vw, 8px) clamp(0px, 25px - 3.2vw, 8px) 8px 8px; display:flex; flex-flow:column nowrap; align-items:center;]

   [comment]----text message container----[/comment]
   [border=transparent; height:70%; max-width:100%; width:100%; padding:0; display:flex; flex-flow:column nowrap;]
      [border=transparent; height:auto; width:calc(100% - 8px); padding:7px 8px; box-sizing:border-box; background: var(--bg-color-3); border-radius:3px; font-family: var(--header); color: var(--h2); font-size:11px; text-transform:uppercase; letter-spacing:1px; line-height:100%; font-weight:bold; text-align:center; margin-right:8px; white-space:nowrap; overflow:hidden;][comment]

----* * * contact name here----

[/comment][plain]@username[/plain][/border]
      [border=transparent; height:90%; width:100%; padding:0; display:flex; flex-direction:column; overflow:hidden; margin-top:8px;][border=transparent; height:100%; width:200%; padding:0; overflow-y:scroll;][border=transparent; height:auto; width:50%; padding:0; display:flex; flex-flow:column nowrap;][border=transparent; height:0; width:100%; padding:0; margin-bottom:-6px;][/border]

         [comment]----copy this whole thing to get another sent text----[/comment]
         [border=transparent; height:auto; width:auto; max-width:clamp(130px, 85%, 185px); padding:4px 6px; box-sizing:border-box; background: var(--color-2); color: var(--h1); font-size:11px; line-height:14px; border-radius:6px 6px 0 6px; margin:6px 0 0 auto; font-family: var(--body);][comment]

----* * * text contents here----

[/comment]sent text here[/border]
        [comment]----copy me too!----[/comment]

         [comment]----copy this whole thing to get another received text----[/comment]
         [border=transparent; height:auto; width:auto; max-width:clamp(130px, 85%, 185px); padding:4px 6px; box-sizing:border-box; background: var(--color-3); color: var(--t-color); font-size:11px; line-height:14px; border-radius:6px 6px 6px 0; margin:6px auto 0 0; font-family: var(--body);][comment]

----* * * text contents here----

[/comment]received text here[/border]
        [comment]----copy me too!----[/comment]

     [/border][/border][/border]
   [/border]
   [comment]----text message container end----[/comment]

   [comment]----persona image----[/comment]
   [border=transparent; height:clamp(45px, 30%, 80px); width:calc(100% - 8px); padding:0; background: var(--img-2); background-size:cover; margin:12px 8px 0 0;

/*edit the following to adjust the cropping of the image*/ background-position:50% 50%;

flex-shrink:0; border-radius:3px;][border=transparent; height:100%; width:100%; padding:0; background: var(--bg-color-2); opacity:0.2;][/border][/border]
[/border]
[comment]----left end----[/comment]

[comment]----right (personality container)----[/comment]
[border=transparent; height:clamp(265px, 38vw, 280px); flex:68; min-width:200px; padding:0; margin:8px clamp(0px, 25px - 3.2vw, 8px) 8px 8px; display:flex; flex-direction:column; overflow:hidden; border-radius:3px;][border=transparent; height:100%; width:200%; padding:0; overflow-y:scroll;][border=transparent; height:0; width:100%; padding:0; margin-bottom:-12px;][/border]

   [comment]----personality contents container----[/comment]
   [border=transparent; height:100%; width:50%; padding:2px 0; display:flex; flex-flow:column nowrap; border-radius:3px; overflow:hidden; background: var(--bg-color-3); margin-top:12px;]
      [comment]----container title----[/comment]
      [border=transparent; height:28px; width:100%; padding:10px 8px 2px 8px; box-sizing:border-box; display:flex; align-items:center; justify-content:flex-end;][border=transparent; height:auto; width:fit-content; width:-moz-fit-content; padding:4px 7px; box-sizing:border-box; background: var(--bg-color-1); color: var(--h1); font-size:13px; font-family: var(--header); text-transform:uppercase; letter-spacing:2px; line-height:100%; font-weight:bold; border-radius:2px;][comment]

----* * * container title here----

[/comment]psyche[/border][/border]

      [comment]----personality contents----[/comment]
      [border=transparent; height:90%; width:100%; padding:9px 0; box-sizing:border-box; display:flex; flex-direction:column; overflow:hidden;][border=transparent; height:100%; width:200%; padding:0; overflow-y:scroll;][border=transparent; height:auto; width:50%; padding:0 clamp(1px, 20px - 3.5vw, 9px) 0 9px; box-sizing:border-box; color: var(--t-color); line-height:15px; text-align:justify; font-family: var(--body); font-size:11px;][comment]

----* * * text starts here----

[/comment]Not to long, just tell me what kind of person they are and it can be as vague as you want
      [/border][/border][/border]
   [/border]
   [comment]----personality contents container end----[/comment]

   [comment]----copy this whole thing to make another small container----[/comment]
   [border=transparent; height:auto; width:50%; padding:0; background: var(--bg-color-3); margin-top:12px; display:flex; flex-flow:column nowrap; border-radius:3px;]
      [comment]----container title----[/comment]
      [border=transparent; height:23px; width:100%; padding:10px 0 2px 2px; box-sizing:border-box; display:flex; align-items:center; justify-content:flex-start;][border=transparent; height:auto; width:fit-content; width:-moz-fit-content; padding:4px 7px; box-sizing:border-box; color: var(--color-4); font-size:12px; font-family: var(--header); text-transform:uppercase; letter-spacing:1px; line-height:100%; font-weight:bold; border-radius:2px;][comment]

----* * * container title here----

[/comment]skills[/border][/border]

      [comment]----container contents----[/comment]
      [border=transparent; height:auto; max-height:54px; width:100%; padding:5px 0 7px 0; box-sizing:border-box; display:flex; flex-direction:column; overflow:hidden;][border=transparent; height:100%; width:200%; padding:0; overflow-y:scroll;][border=transparent; height:auto; width:50%; padding:0 0 0 6px; box-sizing:border-box; display:flex; flex-flow:row wrap; align-content:flex-start;]

         [comment]----copy this whole thing to make another item----[/comment]
         [border=transparent; height:auto; width:auto; flex-shrink:0; padding:1px 4px 2px 4px; box-sizing:border-box; background: var(--color-2); border-radius:2px; color: var(--h1); margin:2px 3px; text-transform:uppercase; font-weight:bold; font-size:10px; letter-spacing:1px; line-height:15px; font-family: var(--body);][comment]

----* * * trait here----

[/comment]skill[/border]
         [comment]----copy me too!----[/comment]

         [comment]----copy this whole thing to make another item----[/comment]
         [border=transparent; height:auto; width:auto; flex-shrink:0; padding:1px 4px 2px 4px; box-sizing:border-box; background: var(--color-2); border-radius:2px; color: var(--h1); margin:2px 3px; text-transform:uppercase; font-weight:bold; font-size:10px; letter-spacing:1px; line-height:15px; font-family: var(--body);][comment]

----* * * trait here----

[/comment]skill[/border]
         [comment]----copy me too!----[/comment]

         [comment]----copy this whole thing to make another item----[/comment]
         [border=transparent; height:auto; width:auto; flex-shrink:0; padding:1px 4px 2px 4px; box-sizing:border-box; background: var(--color-2); border-radius:2px; color: var(--h1); margin:2px 3px; text-transform:uppercase; font-weight:bold; font-size:10px; letter-spacing:1px; line-height:15px; font-family: var(--body);][comment]

----* * * trait here----

[/comment]skill[/border]
         [comment]----copy me too!----[/comment]

      [/border][/border][/border]
      [comment]----container contents end----[/comment]
   [/border]
   [comment]----copy me too!----[/comment]

   [comment]----copy this whole thing to make another small container----[/comment]
   [border=transparent; height:auto; width:50%; padding:0; background: var(--bg-color-3); margin-top:12px; display:flex; flex-flow:column nowrap; border-radius:3px;]
      [comment]----container title----[/comment]
      [border=transparent; height:23px; width:100%; padding:10px 0 2px 2px; box-sizing:border-box; display:flex; align-items:center; justify-content:flex-start;][border=transparent; height:auto; width:fit-content; width:-moz-fit-content; padding:4px 7px; box-sizing:border-box; color: var(--color-4); font-size:12px; font-family: var(--header); text-transform:uppercase; letter-spacing:1px; line-height:100%; font-weight:bold; border-radius:2px;][comment]

----* * * container title here----

[/comment]habits[/border][/border]

      [comment]----container contents----[/comment]
      [border=transparent; height:auto; max-height:54px; width:100%; padding:5px 0 7px 0; box-sizing:border-box; display:flex; flex-direction:column; overflow:hidden;][border=transparent; height:100%; width:200%; padding:0; overflow-y:scroll;][border=transparent; height:auto; width:50%; padding:0 0 0 6px; box-sizing:border-box; display:flex; flex-flow:row wrap; align-content:flex-start;]

         [comment]----copy this whole thing to make another item----[/comment]
         [border=transparent; height:auto; width:auto; flex-shrink:0; padding:1px 4px 2px 4px; box-sizing:border-box; background: var(--color-2); border-radius:2px; color: var(--h1); margin:2px 3px; text-transform:uppercase; font-weight:bold; font-size:10px; letter-spacing:1px; line-height:15px; font-family: var(--body);][comment]

----* * * trait here----

[/comment]habit[/border]
         [comment]----copy me too!----[/comment]

         [comment]----copy this whole thing to make another item----[/comment]
         [border=transparent; height:auto; width:auto; flex-shrink:0; padding:1px 4px 2px 4px; box-sizing:border-box; background: var(--color-2); border-radius:2px; color: var(--h1); margin:2px 3px; text-transform:uppercase; font-weight:bold; font-size:10px; letter-spacing:1px; line-height:15px; font-family: var(--body);][comment]

----* * * trait here----

[/comment]habit[/border]
         [comment]----copy me too!----[/comment]

         [comment]----copy this whole thing to make another item----[/comment]
         [border=transparent; height:auto; width:auto; flex-shrink:0; padding:1px 4px 2px 4px; box-sizing:border-box; background: var(--color-2); border-radius:2px; color: var(--h1); margin:2px 3px; text-transform:uppercase; font-weight:bold; font-size:10px; letter-spacing:1px; line-height:15px; font-family: var(--body);][comment]

----* * * trait here----

[/comment]habit[/border]
         [comment]----copy me too!----[/comment]

      [/border][/border][/border]
      [comment]----container contents end----[/comment]
   [/border]
   [comment]----copy me too!----[/comment]

   [comment]----copy this whole thing to make another medium container----[/comment]
   [border=transparent; height:auto; width:50%; padding:9px 0; box-sizing:border-box; background: var(--bg-color-3); margin-top:12px; display:flex; flex-flow:column nowrap; border-radius:3px; overflow:hidden;][border=transparent; height:100%; width:200%; padding:0; overflow-y:scroll;][border=transparent; height:auto; width:50%; padding:0 clamp(1px, 20px - 3.5vw, 9px) 0 9px; box-sizing:border-box; display:flex; flex-flow:column nowrap;][border=transparent; height:0; width:100%; padding:0; margin-bottom:-7px;][/border]

      [comment]----copy this whole thing to make another tag----[/comment]
      [border=transparent; height:auto; width:100%; padding:0; display:flex; flex-flow:row nowrap; margin-top:7px;]
         [border=transparent; height:fit-content; width:auto; max-width:84px; padding:1px 0; box-sizing:border-box; flex-shrink:0;][border=transparent; height:auto; width:auto; padding:1px 4px 2px 4px; box-sizing:border-box; background: var(--color-2); border-radius:2px; color: var(--h1); text-transform:uppercase; font-weight:bold; font-size:11px; letter-spacing:1px; line-height:15px; font-family: var(--body); display:inline; -webkit-box-decoration-break:clone;][comment]

----* * * info title here----

[/comment]likes[/border][/border]
         [border=transparent; height:auto; flex:1; padding:0; margin:1px 0 0 10px; color: var(--t-color); font-size:11px; line-height:14px; font-family: var(--body); text-align:justify;][comment]

----* * * info contents here----

[/comment]answer here[/border]
      [/border]
      [comment]---copy me too!----[/comment]

      [comment]----copy this whole thing to make another tag----[/comment]
      [border=transparent; height:auto; width:100%; padding:0; display:flex; flex-flow:row nowrap; margin-top:7px;]
         [border=transparent; height:fit-content; width:auto; max-width:80px; padding:1px 0; box-sizing:border-box; flex-shrink:0;][border=transparent; height:auto; width:auto; padding:1px 4px 2px 4px; box-sizing:border-box; background: var(--color-2); border-radius:2px; color: var(--h1); text-transform:uppercase; font-weight:bold; font-size:11px; letter-spacing:1px; line-height:15px; font-family: var(--body); display:inline; -webkit-box-decoration-break:clone;][comment]

----* * * info title here----

[/comment]dislikes[/border][/border]
         [border=transparent; height:auto; flex:1; padding:0; margin:1px 0 0 10px; color: var(--t-color); font-size:11px; line-height:14px; font-family: var(--body); text-align:justify;][comment]

----* * * info contents here----

[/comment]answer here[/border]
      [/border]
      [comment]---copy me too!----[/comment]

      [comment]----copy this whole thing to make another tag----[/comment]
      [border=transparent; height:auto; width:100%; padding:0; display:flex; flex-flow:row nowrap; margin-top:7px;]
         [border=transparent; height:fit-content; width:auto; max-width:84px; padding:1px 0; box-sizing:border-box; flex-shrink:0;][border=transparent; height:auto; width:auto; padding:1px 4px 2px 4px; box-sizing:border-box; background: var(--color-2); border-radius:2px; color: var(--h1); text-transform:uppercase; font-weight:bold; font-size:11px; letter-spacing:1px; line-height:15px; font-family: var(--body); display:inline; -webkit-box-decoration-break:clone;][comment]

----* * * info title here----

[/comment]quirks[/border][/border]
         [border=transparent; height:auto; flex:1; padding:0; margin:1px 0 0 10px; color: var(--t-color); font-size:11px; line-height:14px; font-family: var(--body); text-align:justify;][comment]

----* * * info contents here----

[/comment]answer here[/border]
      [/border]
      [comment]---copy me too!----[/comment]

      [comment]----copy this whole thing to make another tag----[/comment]
      [border=transparent; height:auto; width:100%; padding:0; display:flex; flex-flow:row nowrap; margin-top:7px;]
         [border=transparent; height:fit-content; width:auto; max-width:84px; padding:1px 0; box-sizing:border-box; flex-shrink:0;][border=transparent; height:auto; width:auto; padding:1px 4px 2px 4px; box-sizing:border-box; background: var(--color-2); border-radius:2px; color: var(--h1); text-transform:uppercase; font-weight:bold; font-size:11px; letter-spacing:1px; line-height:15px; font-family: var(--body); display:inline; -webkit-box-decoration-break:clone;][comment]

----* * * info title here----

[/comment]fears[/border][/border]
         [border=transparent; height:auto; flex:1; padding:0; margin:1px 0 0 10px; color: var(--t-color); font-size:11px; line-height:14px; font-family: var(--body); text-align:justify;][comment]

----* * * info contents here----

[/comment]answer here[/border]
      [/border]
      [comment]---copy me too!----[/comment]

   [/border][/border][/border]
   [comment]----copy me too!----[/comment]


[/border][/border]
[comment]----right end----[/comment]

         [/border]
         [comment]----tab contents end----[/comment]
      [/border][/tab]
      [comment]----tab two end----[/comment]


      [comment]----tab three----[/comment]
      [tab=.][border=transparent; height:100%; width:100%; padding:0; box-sizing:border-box; position:absolute; top:0; left:0; z-index:4; display:flex; flex-flow:row wrap; justify-content:center; pointer-events:none; line-height:0; letter-spacing:0;]

         [comment]----button select----[/comment]
         [border=transparent; height:auto; width:100%; padding:5px; box-sizing:border-box; display:flex; flex-flow:row-reverse wrap; justify-content:center; margin-bottom:auto;][border=transparent; height:120px; flex: var(--f2); min-width: var(--f2m); padding:0; margin:8px;][/border][border=transparent; height:clamp(40px, 16vw, 115px); flex: var(--f1); min-width: var(--f1m); max-width: var(--f1mw); padding:0; box-sizing:border-box; margin:12px 8px 8px 8px; display:flex; flex-flow:row wrap; align-items:flex-end; align-content:center; border-radius:4px; justify-content:center;]
[comment]----filler button----[/comment]
[border=transparent; height:44px; width:44px; padding:0; margin:3px 4px;][/border]
[comment]----filler button----[/comment]
[border=transparent; height:44px; width:44px; padding:0; margin:3px 4px;][/border]

[comment]----selected button----[/comment]
[border=transparent; height:44px; width:44px; padding:3px 0 3px 3px; box-sizing:border-box; margin:3px 4px; position:relative; display:flex; justify-content:center; background: var(--bg-color-1);][border=transparent; height:37px; width:37px; padding:0; background: var(--color-2); opacity:1; position:absolute; top:-4px; left:-6px; z-index:1; border-radius:50%;][/border][border=transparent; height:auto; width:auto; padding:0; font-family: var(--button); color: var(--color-1); font-size:32px; font-weight:bold; -webkit-text-stroke:0.5px var(--color-1); white-space:nowrap; text-transform:uppercase; line-height:100%; letter-spacing:3px; position:relative; z-index:2;]c.[/border][/border]

[comment]----filler button----[/comment]
[border=transparent; height:44px; width:44px; padding:0; margin:3px 4px;][/border]
         [/border][/border]
         [comment]----button select end----[/comment]


         [comment]----tab contents----[/comment]
         [border=transparent; min-height:306px; max-height:500px; width:100%; padding:5px; box-sizing:border-box; display:flex; flex-flow:row-reverse wrap; pointer-events:auto;]
[comment]----right----[/comment]
[border=transparent; height:clamp(280px, 800px - 90vw, 355px); flex:76; padding:0; min-width:250px; display:flex; flex-flow:column nowrap; margin:8px;]
   [comment]----history container----[/comment]
   [border=transparent; height:90%; width:100%; padding:0; display:flex; flex-flow:column nowrap; border-radius:3px; overflow:hidden; background: var(--bg-color-3);]
      [comment]----container title----[/comment]
      [border=transparent; height:28px; width:100%; padding:10px 8px 2px 8px; box-sizing:border-box; display:flex; align-items:center; justify-content:flex-start;][border=transparent; height:auto; width:fit-content; width:-moz-fit-content; padding:4px 7px; box-sizing:border-box; background: var(--bg-color-1); color: var(--h1); font-size:13px; font-family: var(--header); text-transform:uppercase; letter-spacing:2px; line-height:100%; font-weight:bold; border-radius:2px;][comment]

----* * * container title here----

[/comment]Time - 0:00[/border][/border]

      [comment]----history contents----[/comment]
      [border=transparent; height:calc(100% - 28px); width:100%; padding:9px 0; box-sizing:border-box; display:flex; flex-direction:column; overflow:hidden;][border=transparent; height:100%; width:200%; padding:0; overflow-y:scroll;][border=transparent; height:auto; width:50%; padding:0 clamp(1px, 20px - 3.5vw, 9px) 0 9px; box-sizing:border-box; display:flex; flex-flow:column nowrap;][border=transparent; height:0; width:100%; padding:0; margin-bottom:-12px;][/border]

         [comment]----copy this whole thing to make another section----[/comment]
         [border=transparent; height:auto; width:100%; padding:0; display:flex; flex-flow:column nowrap; margin-top:10px;][border=transparent; height:auto; width:90%; padding:0; text-align:right; color: var(--color-2); margin:5px 0 5px 0; font-family: var(--header); letter-spacing:1.5px; text-transform:uppercase; font-size:11px; line-height:15px; font-weight:bold; margin-left:auto;][comment]

----* * * section title here----

[/comment]Before the Survival Show[/border]
[border=transparent; height:auto; width:100%; padding:0; line-height:15px; font-size:11px; text-align:justify; color: var(--t-color); font-family: var(--body);][comment]

----* * * text starts here----

[/comment] Seriously these can as short as you need
[/border]
         [/border]
         [comment]----copy me too!----[/comment]

[comment]----copy this whole thing to make another section----[/comment]
         [border=transparent; height:auto; width:100%; padding:0; display:flex; flex-flow:column nowrap; margin-top:10px;][border=transparent; height:auto; width:90%; padding:0; text-align:right; color: var(--color-2); margin:5px 0 5px 0; font-family: var(--header); letter-spacing:1.5px; text-transform:uppercase; font-size:11px; line-height:15px; font-weight:bold; margin-left:auto;][comment]

----* * * section title here----

[/comment]During the Survival Show[/border]
[border=transparent; height:auto; width:100%; padding:0; line-height:15px; font-size:11px; text-align:justify; color: var(--t-color); font-family: var(--body);][comment]

----* * * text starts here----

[/comment] Seriously these can as short as you need
[/border]
         [/border]
         [comment]----copy me too!----[/comment]

[comment]----copy this whole thing to make another section----[/comment]
         [border=transparent; height:auto; width:100%; padding:0; display:flex; flex-flow:column nowrap; margin-top:10px;][border=transparent; height:auto; width:90%; padding:0; text-align:right; color: var(--color-2); margin:5px 0 5px 0; font-family: var(--header); letter-spacing:1.5px; text-transform:uppercase; font-size:11px; line-height:15px; font-weight:bold; margin-left:auto;][comment]

----* * * section title here----

[/comment]Currently - On Bus (Bus 1 and 3 for girls, 2 for boys)[/border]
[border=transparent; height:auto; width:100%; padding:0; line-height:15px; font-size:11px; text-align:justify; color: var(--t-color); font-family: var(--body);][comment]

----* * * text starts here----

[/comment] Seriously these can as short as you need, for example = [b]Sleeping[/b]
[/border]
         [/border]
         [comment]----copy me too!----[/comment]

      [/border][/border][/border]
      [comment]----history contents end----[/comment]
   [/border]
   [comment]----history container end----[/comment]

   [comment]----quote----[/comment]
   [border=transparent; height:53px; width:100%; padding:6px; box-sizing:border-box; background: var(--bg-color-3); display:flex; flex-flow:row nowrap; align-items:center; margin-top:12px; border-radius:3px; flex-shrink:0;][border=transparent; height:35px; width:35px; padding:5px; box-sizing:border-box; color: var(--h1); font-size:21px; display:flex; align-items:flex-end; justify-content:center; flex-shrink:0; position:relative;][border=transparent; height:28px; width:28px; padding:0; background: var(--color-4); position:absolute; top:1px; left:1px; z-index:1;border-radius:50%;][/border][border=transparent; height:auto; width:auto; padding:0; position:relative; z-index:2; left:3px; text-shadow:2px 2px var(--color-4);][fa]far fa-quote-left[/fa][/border][/border][border=transparent; height:auto; max-height:28px; overflow:hidden; flex:1; padding:0; margin-left:12px; color: var(--t-color); font-size:11px; font-family: var(--body); line-height:14px;][comment]

----* * * quote here----

[/comment]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam volutpat ex nibh, id accumsan lacus varius ac. Duis vel lacinia elit. Aliquam sodales, augue nec maximus interdum, urna purus interdum massa, a accumsan erat quam id mauris.
   [/border][/border]
   [comment]----quote end----[/comment]
[/border]
[comment]----right end----[/comment]

[comment]----history image----[/comment]
[border=transparent; min-height:110px; max-height:280px; flex:24; padding:0; min-width:100px; background: var(--img-3); background-size:cover; margin:8px; border-radius:3px; overflow:hidden;

/*edit the following to adjust the cropping of the image*/ background-position:50% 20%;

flex-shrink:0;][border=transparent; height:100%; width:100%; padding:0; background: var(--bg-color-2); opacity:0.2;][/border][/border]
         [/border]
         [comment]----tab contents end----[/comment]
      [/border][/tab]
      [comment]----tab three end----[/comment]


      [comment]----tab four----[/comment]
      [tab=.][border=transparent; height:100%; width:100%; padding:0; box-sizing:border-box; position:absolute; top:0; left:0; z-index:4; display:flex; flex-flow:row wrap; justify-content:center; pointer-events:none; line-height:0; letter-spacing:0;]

         [comment]----button select----[/comment]
         [border=transparent; height:auto; width:100%; padding:5px; box-sizing:border-box; display:flex; flex-flow:row-reverse wrap; justify-content:center; margin-bottom:auto;][border=transparent; height:120px; flex: var(--f2); min-width: var(--f2m); padding:0; margin:8px;][/border][border=transparent; height:clamp(40px, 16vw, 115px); flex: var(--f1); min-width: var(--f1m); max-width: var(--f1mw); padding:0; box-sizing:border-box; margin:12px 8px 8px 8px; display:flex; flex-flow:row wrap; align-items:flex-end; align-content:center; border-radius:4px; justify-content:center;]
[comment]----filler button----[/comment]
[border=transparent; height:44px; width:44px; padding:0; margin:3px 4px;][/border]
[comment]----filler button----[/comment]
[border=transparent; height:44px; width:44px; padding:0; margin:3px 4px;][/border]
[comment]----filler button----[/comment]
[border=transparent; height:44px; width:44px; padding:0; margin:3px 4px;][/border]

[comment]----selected button----[/comment]
[border=transparent; height:44px; width:44px; padding:3px 0 3px 3px; box-sizing:border-box; margin:3px 4px; position:relative; display:flex; justify-content:center; background: var(--bg-color-1);][border=transparent; height:37px; width:37px; padding:0; background: var(--color-2); opacity:1; position:absolute; top:-4px; left:-6px; z-index:1; border-radius:50%;][/border][border=transparent; height:auto; width:auto; padding:0; font-family: var(--button); color: var(--color-1); font-size:32px; font-weight:bold; -webkit-text-stroke:0.5px var(--color-1); white-space:nowrap; text-transform:uppercase; line-height:100%; letter-spacing:3px; position:relative; z-index:2;]d.[/border][/border]

         [/border][/border]
         [comment]----button select end----[/comment]


         [comment]----tab contents----[/comment]
         [border=transparent; min-height:306px; max-height:500px; width:100%; padding:5px; box-sizing:border-box; display:flex; flex-flow:row wrap; justify-content:center; pointer-events:auto;]

[comment]----left-----[/comment]
[border=transparent; height:clamp(240px, 38vw, 280px); max-height:280px; flex:30; min-width:160px; padding:0; display:flex; flex-flow:column nowrap; align-items:center; margin:8px;]

   [comment]----music player----[/comment]
   [border=transparent; height:97px; width:100%; max-width:180px; padding:10px; box-sizing:border-box; border-radius:3px; background: var(--bg-color-3); display:flex; flex-flow:column nowrap;]
      [comment]----music info container----[/comment]
      [border=transparent; height:50px; width:100%; padding:0; display:flex; flex-flow:row nowrap;]
         [comment]----music image----[/comment]
         [border=transparent; height:50px; width:50px; padding:3px; box-sizing:border-box; border:3px solid transparent; border-top:3px solid var(--color-3); animation:fa-spin 5s linear infinite; border-radius:50%; flex-shrink:0;][border=transparent; height:100%; width:100%; padding:0; background: var(--music); background-size:cover; background-position:50% 50%; animation:fa-spin 5s linear infinite reverse; border-radius:50%; overflow:hidden;][border=transparent; height:100%; width:100%; padding:0; background: var(--bg-color-2); opacity:0.2;][/border][/border][/border]

         [comment]----music info----[/comment]
         [border=transparent; height:auto; max-height:50px; flex:1; padding:0 5px 0 5px; box-sizing:border-box; display:flex; flex-flow:column nowrap; align-items:center; justify-content:center;]
[border=transparent; height:auto; max-height:26px; overflow:hidden; width:100%; padding:0; color: var(--t-color); font-size:13px; font-weight:bold; letter-spacing:0.5px; font-family: var(--header); line-height:100%; text-align:center;][comment]

----* * * song title here----

[/comment]song[/border]
[border=transparent; height:auto; width:100%; padding:0; color: var(--t-color); font-size:9px; text-transform:uppercase; font-family: var(--body); line-height:100%; margin-top:3px; letter-spacing:1px; text-align:center; opacity:0.7;][comment]


----* * * song artist here----

[/comment]artist[/border]
         [/border]
         [comment]----music info end----[/comment]
      [/border]
      [comment]----music info container end----[/comment]

      [comment]----play button----[/comment]
      [border=transparent; height:auto; width:100%; padding:0; display:flex; flex-flow:row nowrap; justify-content:center; align-items:center; color: var(--color-2); pointer-events:none; margin-top:3px;]
         [border=transparent; height:auto; width:auto; padding:0; font-size:13px;][fa]fas fa-backward[/fa][/border]
         [border=transparent; height:25px; width:25px; padding:0; overflow:hidden; position:relative; margin:0 10px 0 12px]
[border=transparent; height:100%; width:100%; padding:0; position:relative; z-index:2; display:flex; align-items:center; justify-content:center; font-size:17px; background: var(--bg-color-3);][fa]fas fa-play[/fa][/border]

[comment]----actual media player----[/comment]
[border=transparent; height:100%; width:100%; padding:0; pointer-events:auto; position:absolute; top:0; left:0; z-index:1; opacity:0.1%;]
   [comment]----soundcloud (replace the soundcloud link within media tag with your own)----[/comment]
   [border=transparent; height:80px; width:180px; padding:0; margin-top:-20px; margin-left:-20px; position:absolute; top:0; left:0;]
[media=soundcloud]replace with soundcloud link[/media]
   [/border]

   [comment]----google drive (replace the google file code within media tag with your own)----[/comment]
   [border=transparent; height:500px; width:500px; margin-top:-175px; margin-left:-99px; padding:0px; /*remove this to use me, and add it to the other*/ display:none;]
[media=googledrive]replace with google file code[/MEDIA]
    [/border]
[/border]
[comment]----actual media player end----[/comment]
         [/border]
         [border=transparent; height:auto; width:auto; padding:0; font-size:13px;][fa]fas fa-forward[/fa][/border]
      [/border]
      [comment]----play button end----[/comment]
   [/border]
   [comment]----music player end----[/comment]

   [comment]----misc container----[/comment]
   [border=transparent; height:calc(100% - 97px); width:100%; max-width:230px; padding:0; display:flex; flex-flow:column nowrap; margin-top:12px; border-radius:3px; overflow:hidden; background: var(--bg-color-3);]
      [comment]----container title----[/comment]
      [border=transparent; height:28px; width:100%; padding:10px 8px 2px 8px; box-sizing:border-box; display:flex; align-items:center; justify-content:flex-end;][border=transparent; height:auto; width:fit-content; width:-moz-fit-content; padding:4px 7px; box-sizing:border-box; background: var(--bg-color-1); color: var(--h1); font-size:13px; font-family: var(--header); text-transform:uppercase; letter-spacing:2px; line-height:100%; font-weight:bold; border-radius:2px;][comment]

----* * * container title here----

[/comment]extra[/border][/border]

   [comment]----misc contents----[/comment]
   [border=transparent; height:calc(100% - 28px); width:100%; padding:9px 0; box-sizing:border-box; display:flex; flex-direction:column; overflow:hidden;][border=transparent; height:100%; width:200%; padding:0; overflow-y:scroll;][border=transparent; height:auto; width:50%; padding:0 clamp(1px, 20px - 3.5vw, 9px) 0 9px; box-sizing:border-box; display:flex; flex-flow:column nowrap;][border=transparent; height:0; width:100%; padding:0; margin-bottom:-8px;][/border]

      [comment]----copy this whole thing to make another tag----[/comment]
      [border=transparent; height:auto; width:100%; padding:0; display:flex; flex-flow:row wrap; margin-top:7px;]
         [border=transparent; height:fit-content; width:auto; max-width:80px; padding:1px 0; box-sizing:border-box; flex-shrink:0; margin:1px 10px 1px 0;][border=transparent; height:auto; width:auto; padding:1px 4px 2px 4px; box-sizing:border-box; background: var(--color-2); border-radius:2px; color: var(--h1); text-transform:uppercase; font-weight:bold; font-size:11px; letter-spacing:1px; line-height:15px; font-family: var(--body); display:inline; -webkit-box-decoration-break:clone;][comment]

----* * * info title here----

[/comment]hello[/border][/border]
         [border=transparent; height:auto; flex:1; min-width:fit-content; padding:0; margin:2px 0 0 0; color: var(--t-color); font-size:11px; line-height:14px; font-family: var(--body); text-align:justify;][comment]

----* * * info contents here----

[/comment]goodbye too loonng what happens when it gets to long[/border]
      [/border]
      [comment]---copy me too!----[/comment]

      [/border][/border][/border]
      [comment]----misc contents end----[/comment]
   [/border]
   [comment]----misc container end----[/comment]

[/border]
[comment]----left end----[/comment]

[comment]----right----[/comment]
[border=transparent; min-height:227px; max-height:clamp(227px, 35vw, 280px); flex:70; min-width:200px; padding:0; display:flex; flex-direction:column; overflow:hidden; margin:8px clamp(0px, 30px - 4.5vw, 8px) 8px 8px;][border=transparent; height:100%; width:200%; padding:0; overflow-y:scroll; scroll-snap-type:y mandatory; scroll-padding:38.5px; scroll-behavior: smooth;][border=transparent; height:auto; width:50%; padding:0; position:relative; font-size:0; visibility:hidden;][accordion=100%]

         [comment]----copy this whole thing to make another relationship----[/comment]
         {slide=[border=transparent; height:auto; max-height:30px; width:auto; padding:9px 12px; background: var(--color-2); border-radius:4px; font-family: var(--header); font-weight:bold; font-variant: normal; line-height:100%; text-transform:uppercase; margin:-7px -7px 0px -7px; visibility:visible; color: var(--h1); font-size:13px; letter-spacing:2px; white-space:nowrap; overflow:hidden; position:relative; z-index:10;][comment]

---* * * relationship title here---

[/comment]relationship title[/border]

}[border=transparent; height:auto; width:auto; padding:0; background: var(--bg-color-3); visibility:visible; margin:-5px -7px 4px -7px; position:relative; overflow:hidden; border-radius:4px; scroll-snap-align:start;][border=transparent; max-height:clamp(190px, 29vw, 242px); width:100%; padding:8px 0 8px 8px; box-sizing:border-box; display:flex; flex-flow:column nowrap;]

   [comment]----top----[/comment]
   [border=transparent; height:71px; width:100%; padding:0 8px 0 0; box-sizing:border-box; display:flex; flex-flow:row nowrap; flex-shrink:0; align-items:center;]
      [comment]----icon----[/comment]
      [border=transparent; height:71px; width:71px; padding:0; border-radius:3px; flex-shrink:0;

/*edit the number in rX to match the variables*/ background: var(--r1);

background-size:cover;

/*edit the following to adjust the cropping of the image*/ background-position:50% 50%;][/border]
      [comment]----details----[/comment]
      [border=transparent; height:auto; max-height:71px; flex:1; max-width:190px; padding:0; margin-left:12px; display:flex; flex-flow:column nowrap;]
         [border=transparent; height:auto; max-height:28px; width:100%; padding:0; color: var(--h2); font-size:13px; text-transform:uppercase; letter-spacing:1px; font-weight:bold; line-height:14px; font-family: var(--header); overflow:hidden;][comment]

----* * * character name here----

[/comment]character name[/border]
         [border=transparent; height:auto; width:100%; padding:0; box-sizing:border-box; color: var(--color-4); font-size:10px; text-transform:uppercase; font-weight:bold; line-height:14px; font-family: var(--header); letter-spacing:1px; margin-top:3px; white-space:nowrap; overflow:hidden;][comment]

----* * * character relationship here----

[/comment]relationship[/border]

         [border=transparent; height:14px; width:100%; padding:0 3px 0 0; display:flex; flex-flow:row-reverse nowrap; align-items:center; margin-top:5px;][border=transparent; height:auto; width:auto; padding:0; flex-shrink:0; color: var(--color-3); font-size:13px;][fa]fas fa-heart[/fa][/border][border=transparent; height:14px; flex:1; margin-right:8px; padding:2px 2px 2px 2px; box-sizing:border-box; border:1px solid var(--color-3); border-radius:2px;][border=transparent; height:100%; padding:0; border-radius:1px;

/*edit the following to adjust the relationship bar*/ width:30%;

background: var(--color-4);][/border][/border][/border]
      [/border]
      [comment]----details end----[/comment]
   [/border]
   [comment]----top end----[/comment]

   [comment]----bottom (character description)----[/comment]
   [border=transparent; height:70%; width:100%; padding:0; display:flex; flex-direction:column; overflow:hidden; margin-top:12px;][border=transparent; height:100%; width:200%; padding:0; overflow-y:scroll;][border=transparent; height:auto; width:50%; padding:0; color: var(--t-color); font-size:11px; text-align:justify; font-family: var(--body); line-height:15px;][comment]

----* * * text starts here----

[/comment]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam volutpat ex nibh, id accumsan lacus varius ac. Duis vel lacinia elit. Aliquam sodales, augue nec maximus interdum, urna purus interdum massa, a accumsan erat quam id mauris. Integer gravida est sit amet erat lobortis pharetra. Mauris sapien tortor, fermentum vel auctor in, eleifend ut enim. Nam dui nibh, suscipit vitae neque eu, imperdiet convallis dolor.
   [/border][/border][/border]
   [comment]----bottom end----[/comment]
[/border][/border]
         {/slide}
         [comment]----copy me too!----[/comment]

         [comment]----copy this whole thing to make another relationship----[/comment]
         {slide=[border=transparent; height:auto; max-height:30px; width:auto; padding:9px 12px; background: var(--color-2); border-radius:4px; font-family: var(--header); font-weight:bold; font-variant: normal; line-height:100%; text-transform:uppercase; margin:-7px -7px 0px -7px; visibility:visible; color: var(--h1); font-size:13px; letter-spacing:2px; white-space:nowrap; overflow:hidden; position:relative; z-index:10;][comment]

---* * * relationship title here---

[/comment]relationship title[/border]

}[border=transparent; height:auto; width:auto; padding:0; background: var(--bg-color-3); visibility:visible; margin:-5px -7px 4px -7px; position:relative; overflow:hidden; border-radius:4px; scroll-snap-align:start;][border=transparent; height:clamp(190px, 29vw, 243px); width:100%; padding:8px 0 8px 8px; box-sizing:border-box; display:flex; flex-flow:column nowrap;]

   [comment]----top----[/comment]
   [border=transparent; height:71px; width:100%; padding:0 8px 0 0; box-sizing:border-box; display:flex; flex-flow:row nowrap; flex-shrink:0; align-items:center;]
      [comment]----icon----[/comment]
      [border=transparent; height:71px; width:71px; padding:0; border-radius:3px; flex-shrink:0;

/*edit the number in rX to match the variables*/ background: var(--r2);

background-size:cover;

/*edit the following to adjust the cropping of the image*/ background-position:50% 50%;][/border]
      [comment]----details----[/comment]
      [border=transparent; height:auto; max-height:71px; flex:1; max-width:190px; padding:0; margin-left:12px; display:flex; flex-flow:column nowrap;]
         [border=transparent; height:auto; max-height:28px; width:100%; padding:0; color: var(--h2); font-size:13px; text-transform:uppercase; letter-spacing:1px; font-weight:bold; line-height:14px; font-family: var(--header); overflow:hidden;][comment]

----* * * character name here----

[/comment]character name[/border]
         [border=transparent; height:auto; width:100%; padding:0; box-sizing:border-box; color: var(--color-4); font-size:10px; text-transform:uppercase; font-weight:bold; line-height:14px; font-family: var(--header); letter-spacing:1px; margin-top:3px; white-space:nowrap; overflow:hidden;][comment]

----* * * character relationship here----

[/comment]relationship[/border]

         [border=transparent; height:14px; width:100%; padding:0 3px 0 0; display:flex; flex-flow:row-reverse nowrap; align-items:center; margin-top:5px;][border=transparent; height:auto; width:auto; padding:0; flex-shrink:0; color: var(--color-3); font-size:13px;][fa]fas fa-heart[/fa][/border][border=transparent; height:14px; flex:1; margin-right:8px; padding:2px 2px 2px 2px; box-sizing:border-box; border:1px solid var(--color-3); border-radius:2px;][border=transparent; height:100%; padding:0; border-radius:1px;

/*edit the following to adjust the relationship bar*/ width:30%;

background: var(--color-4);][/border][/border][/border]
      [/border]
      [comment]----details end----[/comment]
   [/border]
   [comment]----top end----[/comment]

   [comment]----bottom (character description)----[/comment]
   [border=transparent; height:70%; width:100%; padding:0; display:flex; flex-direction:column; overflow:hidden; margin-top:12px;][border=transparent; height:100%; width:200%; padding:0; overflow-y:scroll;][border=transparent; height:auto; width:50%; padding:0; color: var(--t-color); font-size:11px; text-align:justify; font-family: var(--body); line-height:15px;][comment]

----* * * text starts here----

[/comment]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam volutpat ex nibh, id accumsan lacus varius ac. Duis vel lacinia elit. Aliquam sodales, augue nec maximus interdum, urna purus interdum massa, a accumsan erat quam id mauris. Integer gravida est sit amet erat lobortis pharetra. Mauris sapien tortor, fermentum vel auctor in, eleifend ut enim. Nam dui nibh, suscipit vitae neque eu, imperdiet convallis dolor. Donec vitae nunc ac urna vestibulum ultrices. Nulla quis finibus ante. Nullam malesuada eros a accumsan molestie. Donec vehicula erat iaculis erat faucibus tempus. Fusce ligula leo, aliquet et posuere ut, consectetur nec sapien. Suspendisse cursus massa ac urna tempor venenatis. Nulla facilisi. Nullam cursus interdum risus quis rutrum. Ut a felis facilisis, ultrices mauris a, imperdiet turpis.

Quisque eget euismod purus. Morbi at scelerisque nunc. Sed pulvinar libero risus, sed lacinia risus imperdiet eu. In eu urna pulvinar, vehicula tortor vel, consequat nisi. Integer orci leo, fermentum ac metus a, mattis scelerisque erat. Fusce ac euismod ante, in placerat ex. Suspendisse vel faucibus ligula.
   [/border][/border][/border]
   [comment]----bottom end----[/comment]
[/border][/border]
         {/slide}
         [comment]----copy me too!----[/comment]

[/accordion][/border][/border][/border]
[comment]----right end----[/comment]

         [/border]
         [comment]----tab contents end----[/comment]
      [/border][/tab]
      [comment]----tab four end----[/comment]


      [/tabs][/border][/border][/border]
      [comment]----tabs end----[/comment]
   [/border]
   [comment]----row one end----[/comment]

   [comment]----tab cover----[/comment]
   [border=transparent; height:100%; width:100%; padding:0; box-sizing:border-box; position:absolute; top:0; left:0; z-index:2; display:flex; flex-flow:row wrap; justify-content:center; pointer-events:none;][border=transparent; height:auto; width:100%; padding:5px; box-sizing:border-box; display:flex; flex-flow:row-reverse wrap; justify-content:center;][border=transparent; height:120px; flex: var(--f2); min-width: var(--f2m); padding:0; margin:8px;][/border][border=transparent; height:clamp(40px, 16vw, 115px); flex: var(--f1); min-width: var(--f1m); max-width: var(--f1mw); padding:0; box-sizing:border-box; margin:12px 8px 8px 8px; display:flex; flex-flow:row wrap; align-items:flex-end; align-content:center; border-radius:4px; justify-content:center; background: var(--bg-color-1);]

      [comment]----button----[/comment]
      [border=transparent; height:44px; width:44px; padding:3px 0 3px 3px; box-sizing:border-box; font-family: var(--button); color: var(--color-1); font-size:32px; font-weight:bold; -webkit-text-stroke:0.5px var(--color-1); white-space:nowrap; text-transform:uppercase; line-height:100%; margin:3px 4px; border-radius:50%; position:relative; letter-spacing:3px; display:flex; justify-content:center;]a.[/border]

      [comment]----button----[/comment]
      [border=transparent; height:44px; width:44px; padding:3px 0 3px 3px; box-sizing:border-box; font-family: var(--button); color: var(--color-1); font-size:32px; font-weight:bold; -webkit-text-stroke:0.5px var(--color-1); white-space:nowrap; text-transform:uppercase; line-height:100%; margin:3px 4px; border-radius:50%; position:relative; letter-spacing:3px; display:flex; justify-content:center;]b.[/border]

      [comment]----button----[/comment]
      [border=transparent; height:44px; width:44px; padding:3px 0 3px 3px; box-sizing:border-box; font-family: var(--button); color: var(--color-1); font-size:32px; font-weight:bold; -webkit-text-stroke:0.5px var(--color-1); white-space:nowrap; text-transform:uppercase; line-height:100%; margin:3px 4px; border-radius:50%; position:relative; background:transparent; letter-spacing:3px; display:flex; justify-content:center;]c.[/border]

      [comment]----button----[/comment]
      [border=transparent; height:44px; width:44px; padding:3px 0 3px 3px; box-sizing:border-box; font-family: var(--button); color: var(--color-1); font-size:32px; font-weight:bold; -webkit-text-stroke:0.5px var(--color-1); white-space:nowrap; text-transform:uppercase; line-height:100%; margin:3px 4px; border-radius:50%; position:relative; background:transparent; letter-spacing:3px; display:flex; justify-content:center;]d.[/border]

   [/border][/border]
   [comment]----filler/row two----[/comment]
   [border=transparent; height:auto; width:100%; padding:5px; box-sizing:border-box; display:flex; flex-flow:row wrap;]
      [border=transparent; height:280px; flex:1; min-width:180px; padding:0; margin:8px;][/border]
      [border=transparent; min-height:200px; flex:1; min-width:180px; padding:0;margin:8px;][/border]
   [/border][/border]
   [comment]----tab cover end----[/comment]

   [comment]----filler/row two----[/comment]
   [border=transparent; height:auto; width:100%; padding:5px; box-sizing:border-box; display:flex; flex-flow:row wrap; background: var(--bg-color-2);]
      [border=transparent; height:280px; flex:1; min-width:180px; padding:0; margin:8px;][/border]
      [border=transparent; min-height:200px; flex:1; min-width:180px; padding:0; margin:8px;][/border]
   [/border]

[comment]
----signature! do not remove
[/comment][bg=transparent; height:auto; width:auto; padding:0; position:absolute;z-index:6;opacity:0.2;color: var(--color-1); font-size:clamp(9px, 1.2vw, 10px); top:14px; left:15px; line-height:100%;][font=Open Sans][b]♡coded by uxie♡[/b][/font][/bg][/border][/border]
 
Last edited:








Fuck. Who's gonna feed my cats?

Click Here











given name

Jimin 지민






s. name

Kim 김






age

22






rank #

8th






sexuality

Pansexual






gender

Female



















  • a.


















    visage







    hair

    Black - Full Back Length






    eyes

    Dark Brown






    height

    168 cm (5’6″)






    weight

    55 kg (121 lb)




    Build

    Medium - Full






    Physicality

    Athletic















    BadB***


















    BadB***

    I'm better than your sister











    BadB***


















    BadB***

    Bite me I dare you, I need a leash











    BadB***


















    BadB***

    Audition Today... Fuck.






















a.



b.



c.



d.
















♡coded by uxie♡
 








Ready to run when you are!

Click Here











given name

Su-Jin






s. name

Jung






age

19






rank #

5th






sexuality

Pansexual






gender

Female



















  • a.


















    visage







    hair

    Past her shoulders, dark brown






    eyes

    Dark brown






    height

    5'8" (172.72 cm)






    weight

    126 kbs (57 kg)




    Build

    Su-Jin is a woman of decent height, finding that she is usually one of the taller members of her friend group. She has a lean build with a decent amount of muscle on her from her track and field days.






    Physicality

    Athletic















    JinRummy


















    JinRummy

    Early start











    JinRummy


















    JinRummy

    With the girls











    JinRummy


















    JinRummy

    Time for a show!






















a.



b.



c.



d.
















♡coded by uxie♡
 
Last edited:








How am I not number one?

Click Here











given name

Seong-Hun 成勛






s. name

Mae 매






age

19






rank #

16






sexuality

Bisexual






gender

Male [he/him]



















  • a.


















    visage







    hair

    Blue black - side part






    eyes

    Black






    height

    180 cm






    weight

    76.5 kg




    Build

    Long and lean






    Physicality

    Sharp with a touch of femininity















    Studio.King👑


















    Kitty._.Meow

    Another perfect photo shoot!👏👏











    Studio.King👑


















    Studio.King👑

    Angry look~











    Studio.King👑


















    Jessy🐩

    😍😍😍






















a.



b.



c.



d.
















♡coded by uxie♡
 
Last edited:








lives in a dream

Click Here











given name

Hanamaru (Winnie)






s. name

Ito






age

20






rank #

10th






sexuality

bisexual






gender

female



















  • a.


















    visage







    hair

    long orange hair






    eyes

    brown






    height

    5'7" (170cm)






    weight

    58kg




    Build

    slim and fit

















    winnnnie


















    winnnnie

    fleurs











    winnnnie


















    winnnnie

    look at these cute bunny ears











    winnnnie


















    winnnnie

    see you all tomorrow!!






















a.



b.



c.



d.
















♡coded by uxie♡
 
Last edited:








I'll do whatever it takes

Click Here











given name

Jong-soo






s. name

Baek






age

19






rank #

4th






sexuality

Curious






gender

Male



















  • a.


















    visage







    hair

    neck length pink hair






    eyes

    brown






    height

    5'10 (177.8 cm)






    weight

    152 lbs




    Build

    slim






    Physicality

    athletic















    jong-so0


















    jong-so0

    a crown fit for a king











    jong-so0


















    jong-so0

    how curious..











    jong-so0


















    jong-se0

    so young but so old






















a.



b.



c.



d.
















♡coded by uxie♡
 








Why so serious?

Click Here











given name

Eun






s. name

Gyeon






age

21






rank #

50






sexuality

pansexual






gender

male he/him/they



















  • a.


















    visage







    hair

    black and white






    eyes

    brown, though usually wears blue contacts(most people think its naturally blue)






    height

    5'8(173cm)






    weight

    109lbs(50kg)




    Build

    slim, lanky






    Physicality

    underweight















    Eungboi


















    Eungboi

    new piercing :]











    Eungboi


















    Eungboi

    cosplay colab with @ffoueyes











    Eungboi


















    Eungboi

    :]






















a.



b.



c.



d.
















♡coded by uxie♡
 

Users who are viewing this thread

Back
Top