[comment]coded by uxie!

fonts used:
[font=Inconsolata]headers & subheaders[/font]
[font=Josefin Sans]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;
/*background colour*/
--bg-color: #f2d4c9;

/*button border*/
--color-1: #848484;
/*background accent*/
--color-2: #3D1412;
/*textbox backgrounds*/
--color-3: #f7edea;
/*main accent colour*/
--color-4: #db362e;

/*headers/subheader colour*/
--h1: var(--color-2);
/*body text colour*/
--t-color: #2b0d0c;

/*fonts used*/
--header: 'Inconsolata', sans-serif;
--body: 'Josefin Sans', sans-serif;
--button: 'Inconsolata', sans-serif;

/*big image*/
--img-1: url('https://66.media.tumblr.com/73427cd011555e4007f6a5aa8cf18605/tumblr_oxh5il9VdN1w6f1yao6_400.png');
/*basics image and appearance image (tab 1)*/
--img-2: url('https://66.media.tumblr.com/3dee3c3c3e94651193e409e1146061d6/tumblr_oxh5il9VdN1w6f1yao1_400.png');
--img-3: url('https://66.media.tumblr.com/0b82d0252948bfe5b5a91175a98f64e2/tumblr_oxh5il9VdN1w6f1yao9_400.png');
/*quote image (tab 3)*/
--img-4: url('https://66.media.tumblr.com/92a30badf6ceccf1681e15901d0b73f4/tumblr_oxh5il9VdN1w6f1yao3_400.png');

/*gallery images (tab 4)*/
--gimg-1: url('https://66.media.tumblr.com/52256407e9b6e4ba82a49a29654043f4/tumblr_oxh5il9VdN1w6f1yao5_400.png');
--gimg-2: url('https://66.media.tumblr.com/df1f10a080e40529f7fab6697dadfb71/tumblr_oxh5il9VdN1w6f1yao7_400.png');
--gimg-3: url('https://66.media.tumblr.com/1bea347d85c9d82c44b46910e5c25ca5/tumblr_oxh5il9VdN1w6f1yao2_400.png');
--gimg-4: url('https://66.media.tumblr.com/6b7802f8b90d1ea9a9ac08ff43e83d10/tumblr_oxh5il9VdN1w6f1yao4_400.png');

height:auto; width:100%; max-width:620px; margin:auto; border-radius:4px; background-color: var(--bg-color); position:relative; line-height:0%; padding:clamp(8px, 4vw, 14px); box-sizing:border-box; position:relative;][border=transparent; height:auto; width:100%; max-width:620px; padding:0; position:relative; z-index:2; display:flex; flex-flow: row wrap; justify-content:center;]

    [comment]-----sidebar-----[/comment]
    [border=transparent; height:350px; width:100%; flex:32; min-width:180px; max-width:215px; background-color: var(--color-3); border-radius:4px; padding:0px; display:flex; flex-flow:column nowrap; align-items:flex-start; align-content:flex-start; margin:10px;]

          [comment]----image----[/comment]
          [border=transparent; width:100%; height:66%; background: var(--img-1); background-size:cover; background-position: 50% 0%; border-top-left-radius:4px; border-top-right-radius:4px; padding:0px; margin-bottom:25px; position:relative; z-index:3;]

[comment]----name here----[/comment]
[border=transparent; font-size:18px; background-color: var(--color-4); height:fit-content; width:fit-content; max-width:clamp(100px, 100% - 20px, 160px); font-weight:bold; letter-spacing:0.5px; padding:4px 5px 4px 15px; position:absolute; bottom:-13px; left:-10px; border-radius:0px 2.5px 2.5px 0px; color: var(--h1); line-height:19px; font-family: var(--header);][comment]

----* * * name here----
[/comment]* name here[/border]
          [/border]

          [comment]----decoration----[/comment]
          [border=transparent; width:100%; height:15px; padding:0px; display:flex; flex-flow: row nowrap; justify-content:space-around; align-items:center; flex:auto 0; margin:1px 0 8px 0;]
               [border=transparent; height:0.5px; width:33%; padding:0px; background-color: var(--color-2);][/border]
               [border=transparent; padding:0px; font-weight:bold; font-size:13px; color: var(--color-2); text-align:center; line-height:120%;][fa]fas fa-cloud[/fa][/border]
               [border=transparent; height:0.5px; width:33%; padding:0px; background-color: var(--color-2);][/border]
         [/border]

         [comment]----tabs----[/comment]
         [border=transparent; width:100%; height:14%; padding:0; overflow:hidden; margin:auto 0 15px 0;][border=transparent; line-height:150%; letter-spacing:clamp(1px, 30px - 5.5vw, 8px); padding:0px; margin:-2px -40px 0 clamp(-8px, -18px + 2.6vw, -1px);][tabs]

     [comment]----tab one (requisite)----[/comment]
     [tab=1ai][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; line-height:0; letter-spacing:0; pointer-events:none;]
   [comment]----button select (ignore!)----[/comment]
   [border=transparent; height:350px; width:100%; flex:32; min-width:180px;  max-width:215px; border-radius:4px; padding:0px; display:flex; flex-flow:column nowrap; align-items:flex-start; align-content:flex-start; margin:10px;][border=transparent; height:14%; width:100%; margin:auto 0 15px 0; display:flex; flex-flow: row wrap; align-items:center; align-content:center; justify-content:center; padding:5px 10px; box-sizing:border-box; color: var(--h1); border-radius:0px 0px 4px 4px; line-height:0%;]

      [comment]----selected button----[/comment]
      [border=transparent; border:1px solid var(--color-1); height:20px; width:45%; margin:2.5px; font-size:12px; letter-spacing:1px; text-align:center; padding:3px 0px 3px 0px; box-sizing:border-box; font-family:  var(--button); line-height:12px; background: var(--color-4);]req.[/border]

      [comment]----filler button----[/comment]
      [border=transparent; height:20px; width:45%; margin:2.5px; padding:0;][/border]
      [comment]----filler button----[/comment]
      [border=transparent; height:20px; width:45%; margin:2.5px; padding:0;][/border]
      [comment]----filler button----[/comment]
      [border=transparent; height:20px; width:45%; margin:2.5px; padding:0;][/border]
   [/border][/border]
   [comment]----button select end----[/comment]


   [comment]----tab contents----[/comment]
   [border=transparent; height:350px; width:100%; flex:68; min-width:220px; max-width:365px; padding:5px 0 0 0; box-sizing:border-box; margin:10px; pointer-events:auto; display:flex; flex-flow:column nowrap;]

         [comment]----basics----[/comment]
         [border=transparent; height:33%; width:100%; font-size:9.5px; padding:0px; position:relative; display:flex; flex-flow: row-reverse nowrap;]

[comment]----basics image----[/comment]
[border=transparent; flex:auto 0; width:clamp(60px, 28%, 100px); min-width:clamp(60px, 28%, 100px); padding:0;][border=transparent; padding:0; padding-top:100%; background: var(--img-2); border-radius:4px; position:relative; background-size:cover; margin-top:5px;
/*edit the following to adjust the cropping of the image*/ background-position:50% 50%;]
    [border=transparent; background-color: var(--color-4); color: var(--h1); font-size:11.5px; font-weight:bold; border-radius:3px; font-family: var(--header); height:fit-content; width:fit-content; max-width:calc(100% - 5px); padding:1px 3px 1px 3px; letter-spacing:0.5px; text-transform:uppercase; line-height:120%; position:absolute; bottom:clamp(-10px, -1.5vw, -8px); left:clamp(5px, 1.5vw, 13px);][comment]

----* * * mini caption----

[/comment]#over it[/border]
[/border][/border]

[comment]----basics container----[/comment]
[border=transparent; height:100%; flex:1; max-width:clamp(145px, 72% - 15px, 265px); background-color: var(--color-3); margin-right:15px; padding:8px clamp(4px, 1.8vw, 8px); box-sizing:border-box; border-radius:4px;]

     [comment]----basics contents----[/comment]
     [border=transparent; height:calc(100% - 24px); width:100%; padding:0; overflow:hidden; display:flex; flex-direction:column; margin-bottom:6px;][border=transparent; height:100%; width:200%; padding:0; overflow-y:scroll;][border=transparent; height:auto; width:50%; padding:0; line-height:15px; font-family: var(--body); color: #000; font-size:11px;][comment]

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

[/comment][comment]----copy this to get a tag----
[/comment][border=transparent; background-color: var(--color-4); font-weight:bold; border-radius:3px; font-family: var(--header); padding:0px 3px 0px 3px; letter-spacing:0.5px; display:inline-block; color: var(--h1); margin:2px 4px 2px 0;][comment]

----* * * tag title here----

[/comment]* n.name(s)[/border][comment]
----put text after this comment----
[/comment] hello
[comment]----copy this to get a tag----
[/comment][border=transparent; background-color: var(--color-4); font-weight:bold; border-radius:3px; font-family: var(--header); padding:0px 3px 0px 3px; letter-spacing:0.5px; display:inline-block; color: var(--h1); margin:2px 4px 2px 0;][comment]

----* * * tag title here----

[/comment]* d.o.b.[/border][comment]
----put text after this comment----
[/comment] hello
[comment]----copy this to get a tag----
[/comment][border=transparent; background-color: var(--color-4); font-weight:bold; border-radius:3px; font-family: var(--header); padding:0px 3px 0px 3px; letter-spacing:0.5px; display:inline-block; color: var(--h1); margin:2px 4px 2px 0;][comment]

----* * * tag title here----

[/comment]* p.o.b.[/border][comment]
----put text after this comment----
[/comment] hello
[comment]----copy this to get a tag----
[/comment][border=transparent; background-color: var(--color-4); font-weight:bold; border-radius:3px; font-family: var(--header); padding:0px 3px 0px 3px; letter-spacing:0.5px; display:inline-block; margin-right:4px; color: var(--h1); margin:2px 0;][comment]

----* * * tag title here----

[/comment]* n.name(s)[/border][comment]
----put text after this comment----
[/comment] hello
[comment]----copy this to get a tag----
[/comment][border=transparent; background-color: var(--color-4); font-weight:bold; border-radius:3px; font-family: var(--header); padding:0px 3px 0px 3px; letter-spacing:0.5px; display:inline-block; color: var(--h1); margin:2px 4px 2px 0;][comment]

----* * * tag title here----

[/comment]* question[/border][comment]
----put text after this comment----
[/comment] answer
     [/border][/border][/border]
     [comment]----basics contents end----[/comment]

     [comment]----extra info----[/comment]
     [border=transparent; height:20px; width:100%; max-width:100%; padding:0; display:flex; flex-direction:row; overflow:hidden;][border=transparent; height:37px; width:100%; padding:0; overflow-x:scroll;][border=transparent; height:20px; width:auto; min-width:100%; padding:0;  display:flex; flex-flow: row nowrap; justify-content:flex-start; align-items:center;][border=transparent; height:20px; width:0; padding:0; margin-right:-2.5px;][/border]

         [comment]----copy this to get an info tag----[/comment]
         [border=transparent; background-color: var(--color-4); color: var(--h1); font-size:11px; font-weight:bold; border-radius:3px; font-family: var(--header); height:fit-content; width:fit-content; padding:1px 3px 1px 3px; text-transform:uppercase; line-height:120%; letter-spacing:0.5px; margin:0 2.5px; white-space:nowrap;][comment]

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

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

         [comment]----copy this to get an info tag----[/comment]
         [border=transparent; background-color: var(--color-4); color: var(--h1); font-size:11px; font-weight:bold; border-radius:3px; font-family: var(--header); height:fit-content; width:fit-content; padding:1px 3px 1px 3px; text-transform:uppercase; line-height:120%; letter-spacing:0.5px; margin:0 2.5px; white-space:nowrap;][comment]

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

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

         [comment]----copy this to get an info tag----[/comment]
         [border=transparent; background-color: var(--color-4); color: var(--h1); font-size:11px; font-weight:bold; border-radius:3px; font-family: var(--header); height:fit-content; width:fit-content; padding:1px 3px 1px 3px; text-transform:uppercase; line-height:120%; letter-spacing:0.5px; margin:0 2.5px; white-space:nowrap;][comment]

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

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

         [comment]----copy this to get an info tag----[/comment]
         [border=transparent; background-color: var(--color-4); color: var(--h1); font-size:11px; font-weight:bold; border-radius:3px; font-family: var(--header); height:fit-content; width:fit-content; padding:1px 3px 1px 3px; text-transform:uppercase; line-height:120%; letter-spacing:0.5px; margin:0 2.5px; white-space:nowrap;][comment]

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

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

     [/border][/border][/border]
[/border]
[comment]----basics container end----[/comment]
         [/border]
         [comment]----basics end----[/comment]

         [comment]-----appearance-----[/comment]
         [border=transparent; height:calc(67% - 20px); width:100%; margin-top:20px; padding:0px; box-sizing:border-box; display:flex; flex-flow: row nowrap;]
[comment]----appearance img----[/comment]
[border=transparent; height:100%; width:26%; min-width:65px; background: var(--img-3) 60% 0%; background-size:cover; padding:0px; border-radius:4px;][/border]

[comment]----appearance content----[/comment]
[border=transparent; margin-left:10px; line-height:0%; height:100%; flex-grow:1; background-color: var(--color-3); padding:10px 0; box-sizing:border-box; border-radius:4px; display:flex; flex-direction:column; overflow:hidden;][border=transparent; height:100%; width:200%; overflow-y:scroll; padding:0;][border=transparent; height:auto; width:50%; padding:0 10px; box-sizing:border-box; line-height:140%; font-family: var(--body); color: #000; font-size:11px;][comment]

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

[/comment][comment]----copy this to get a tag----
[/comment][border=transparent; background-color: var(--color-4); font-weight:bold; border-radius:3px; font-family: var(--header); padding:0px 3px 0px 3px; letter-spacing:0.5px; display:inline-block; color: var(--h1); margin:2px 4px 2px 0;][comment]

----* * * tag title here----

[/comment]* height[/border][comment]
----put text after this comment----
[/comment] hello
[comment]----copy this to get a tag----
[/comment][border=transparent; background-color: var(--color-4); font-weight:bold; border-radius:3px; font-family: var(--header); padding:0px 3px 0px 3px; letter-spacing:0.5px; display:inline-block; color: var(--h1); margin:2px 4px 2px 0;][comment]

----* * * tag title here----

[/comment]* weight[/border][comment]
----put text after this comment----
[/comment] hello
[comment]----copy this to get a tag----
[/comment][border=transparent; background-color: var(--color-4); font-weight:bold; border-radius:3px; font-family: var(--header); padding:0px 3px 0px 3px; letter-spacing:0.5px; display:inline-block; color: var(--h1); margin:2px 4px 2px 0;][comment]

----* * * tag title here----

[/comment]* build[/border][comment]
----put text after this comment----
[/comment] hello
[comment]----copy this to get a tag----
[/comment][border=transparent; background-color: var(--color-4); font-weight:bold; border-radius:3px; font-family: var(--header); padding:0px 3px 0px 3px; letter-spacing:0.5px; display:inline-block; color: var(--h1); margin:2px 4px 2px 0;][comment]

----* * * tag title here----

[/comment]* hair colour[/border][comment]
----put text after this comment----
[/comment] hello
[comment]----copy this to get a tag----
[/comment][border=transparent; background-color: var(--color-4); font-weight:bold; border-radius:3px; font-family: var(--header); padding:0px 3px 0px 3px; letter-spacing:0.5px; display:inline-block; color: var(--h1); margin:2px 4px 2px 0;][comment]

----* * * tag title here----

[/comment]* eye colour[/border][comment]
----put text after this comment----
[/comment] hello

[/border][/border][/border]
[comment]----appearance content end----[/comment]
         [/border]

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


     [comment]----tab two (persona)----[/comment]
     [tab=2ai][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; line-height:0; letter-spacing:0; pointer-events:none;]
   [comment]----button select (ignore!)----[/comment]
   [border=transparent; height:350px; width:100%; flex:32; min-width:180px; max-width:215px; border-radius:4px; padding:0px; display:flex; flex-flow:column nowrap; align-items:flex-start; align-content:flex-start; margin:10px;][border=transparent; height:14%; width:100%; margin:auto 0 15px 0; display:flex; flex-flow: row wrap; align-items:center; align-content:center; justify-content:center; padding:5px 10px; box-sizing:border-box; color: var(--h1); border-radius:0px 0px 4px 4px; line-height:0%;]
      [comment]----filler button----[/comment]
      [border=transparent; height:20px; width:45%; margin:2.5px; padding:0;][/border]

      [comment]----selected button----[/comment]
      [border=transparent; border:1px solid var(--color-1); height:20px; width:45%; margin:2.5px; font-size:12px; letter-spacing:1px; text-align:center; padding:3px 0px 3px 0px; box-sizing:border-box; font-family: var(--button); line-height:12px; background: var(--color-4);]pers.[/border]

      [comment]----filler button----[/comment]
      [border=transparent; height:20px; width:45%; margin:2.5px; padding:0;][/border]
      [comment]----filler button----[/comment]
      [border=transparent; height:20px; width:45%; margin:2.5px; padding:0;][/border]
   [/border][/border]
   [comment]----button select end----[/comment]


   [comment]----tab contents----[/comment]
   [border=transparent; height:350px; width:100%; flex:68; min-width:220px; max-width:365px; padding:5px 0 0 0; box-sizing:border-box; margin:10px; pointer-events:auto; display:flex; flex-flow:column nowrap; align-items:center;]

         [comment]----likes----[/comment]
         [border=transparent; height:fit-content; width:clamp(210px, 90%, 365px); padding:8px; box-sizing:border-box; background-color: var(--color-3); border-radius:4px; font-size:12px; text-transform:uppercase; font-weight:bold; color: #000; font-family: var(--body); display:flex; flex-flow: row wrap; align-items:center; align-content:center; flex:auto 0;]
[comment]----box title----[/comment]
[border=transparent; height:fit-content; width:100%; padding:0px; line-height:130%; margin-bottom:2px;][comment]
----* * * title here----
[/comment]likes[/border]

[comment]----box contents----[/comment]
[border=transparent; height:16px; width:100%; padding:0px; overflow:hidden; display:flex;][border=transparent; height:34px; width:100%; padding:0; overflow-x:scroll;][border=transparent; height:16px; width:auto; padding:0; display:flex; flex-flow: row nowrap; align-items:center;][border=transparent; height:100%; width:0; padding:0; margin-right:-2.5px;][/border]

     [comment]----box info----[/comment]
     [border=transparent; background-color: var(--color-4); color: var(--h1); font-size:11px; font-weight:bold; border-radius:3px; font-family: var(--header); height:fit-content; width:fit-content; padding:1px 3px 1px 3px; text-transform:uppercase; line-height:13px; flex:auto 0; margin:0 2.5px; white-space:nowrap;][comment]

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

[/comment]#like 1[/border]

     [comment]----box info----[/comment]
     [border=transparent; background-color: var(--color-4); color: var(--h1); font-size:11px; font-weight:bold; border-radius:3px; font-family: var(--header); height:fit-content; width:fit-content; padding:1px 3px 1px 3px; text-transform:uppercase; line-height:13px; flex:auto 0; margin:0 2.5px; white-space:nowrap;][comment]

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

[/comment]#like 2[/border]

     [comment]----box info----[/comment]
     [border=transparent; background-color: var(--color-4); color: var(--h1); font-size:11px; font-weight:bold; border-radius:3px; font-family: var(--header); height:fit-content; width:fit-content; padding:1px 3px 1px 3px; text-transform:uppercase; line-height:13px; flex:auto 0; margin:0 2.5px; white-space:nowrap;][comment]

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

[/comment]#like 3[/border]

[/border][/border][/border]
[comment]----box contents end----[/comment]
         [/border]
         [comment]----likes end----[/comment]

         [comment]----dislikes----[/comment]
         [border=transparent; margin-top:5px; height:fit-content; width:clamp(210px, 90%, 365px); padding:8px; box-sizing:border-box; background-color: var(--color-3); border-radius:4px; font-size:12px; text-transform:uppercase; font-weight:bold; color: #000; font-family: var(--body); display:flex; flex-flow: row wrap; align-items:center; align-content:center; flex:auto 0;]
[comment]----box title----[/comment]
[border=transparent; height:fit-content; width:100%; padding:0px; line-height:130%; margin-bottom:2px;][comment]
----* * * title here----
[/comment]dislikes[/border]

[comment]----box contents----[/comment]
[border=transparent; height:16px; width:100%; padding:0px; overflow:hidden; display:flex;][border=transparent; height:34px; width:100%; padding:0; overflow-x:scroll;][border=transparent; height:16px; width:auto; padding:0; display:flex; flex-flow: row nowrap; align-items:center;][border=transparent; height:100%; width:0; padding:0; margin-right:-2.5px;][/border]

     [comment]----box info----[/comment]
     [border=transparent; background-color: var(--color-4); color: var(--h1); font-size:11px; font-weight:bold; border-radius:3px; font-family: var(--header); height:fit-content; width:fit-content; padding:1px 3px 1px 3px; text-transform:uppercase; line-height:13px; flex:auto 0; margin:0 2.5px; white-space:nowrap;][comment]

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

[/comment]#dlike 1[/border]

     [comment]----box info----[/comment]
     [border=transparent; background-color: var(--color-4); color: var(--h1); font-size:11px; font-weight:bold; border-radius:3px; font-family: var(--header); height:fit-content; width:fit-content; padding:1px 3px 1px 3px; text-transform:uppercase; line-height:13px; flex:auto 0; margin:0 2.5px; white-space:nowrap;][comment]

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

[/comment]#dlike 2[/border]

     [comment]----box info----[/comment]
     [border=transparent; background-color: var(--color-4); color: var(--h1); font-size:11px; font-weight:bold; border-radius:3px; font-family: var(--header); height:fit-content; width:fit-content; padding:1px 3px 1px 3px; text-transform:uppercase; line-height:13px; flex:auto 0; margin:0 2.5px; white-space:nowrap;][comment]

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

[/comment]#dlike 3[/border]

[/border][/border][/border]
[comment]----box contents end----[/comment]
         [/border]
         [comment]----dislikes end----[/comment]

         [comment]----fears----[/comment]
         [border=transparent; margin-top:5px; height:fit-content; width:clamp(210px, 90%, 365px); padding:8px; box-sizing:border-box; background-color: var(--color-3); border-radius:4px; font-size:12px; text-transform:uppercase; font-weight:bold; color: #000; font-family: var(--body); display:flex; flex-flow: row wrap; align-items:center; align-content:center; flex:auto 0;]
[comment]----box title----[/comment]
[border=transparent; height:fit-content; width:100%; padding:0px; line-height:130%; margin-bottom:2px;][comment]
----* * * title here----
[/comment]fears[/border]

[comment]----box contents----[/comment]
[border=transparent; height:16px; width:100%; padding:0px; overflow:hidden; display:flex;][border=transparent; height:34px; width:100%; padding:0; overflow-x:scroll;][border=transparent; height:16px; width:auto; padding:0; display:flex; flex-flow: row nowrap; align-items:center;][border=transparent; height:100%; width:0; padding:0; margin-right:-2.5px;][/border]

     [comment]----box info----[/comment]
     [border=transparent; background-color: var(--color-4); color: var(--h1); font-size:11px; font-weight:bold; border-radius:3px; font-family: var(--header); height:fit-content; width:fit-content; padding:1px 3px 1px 3px; text-transform:uppercase; line-height:13px; flex:auto 0; margin:0 2.5px; white-space:nowrap;][comment]

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

[/comment]#fear 1[/border]

     [comment]----box info----[/comment]
     [border=transparent; background-color: var(--color-4); color: var(--h1); font-size:11px; font-weight:bold; border-radius:3px; font-family: var(--header); height:fit-content; width:fit-content; padding:1px 3px 1px 3px; text-transform:uppercase; line-height:13px; flex:auto 0; margin:0 2.5px; white-space:nowrap;][comment]

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

[/comment]#fear 2[/border]

     [comment]----box info----[/comment]
     [border=transparent; background-color: var(--color-4); color: var(--h1); font-size:11px; font-weight:bold; border-radius:3px; font-family: var(--header); height:fit-content; width:fit-content; padding:1px 3px 1px 3px; text-transform:uppercase; line-height:13px; flex:auto 0; margin:0 2.5px; white-space:nowrap;][comment]

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

[/comment]#fear 3[/border]

[/border][/border][/border]
[comment]----box contents end----[/comment]
         [/border]
         [comment]----fears end----[/comment]

         [comment]----persona content----[/comment]
         [border=transparent; height:55%; width:clamp(210px, 100%, 365px); margin-top:20px; padding:4px 0 3px 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 5px; box-sizing:border-box; line-height:15px; text-align:justify; font-family: var(--body); text-align:justify; font-size:11px; color: var(--t-color);][comment]----copy this to get a tag----
[/comment][border=transparent; background-color: var(--color-4); font-weight:bold; border-radius:3px; font-family: var(--header); padding:0px 3px 0px 3px; letter-spacing:0.5px; display:inline-block; color: var(--h1); margin:2px 4px 2px 0;][comment]

----* * * tag title here----

[/comment]* personality[/border][comment]
----put text after this comment----
[/comment] Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras hendrerit, tellus vel molestie pretium, tellus lorem pellentesque nunc, in porta lorem justo eu diam. Praesent urna velit, efficitur vel nisi vel, blandit suscipit dolor. Donec ut cursus dui, non dignissim urna. Proin fermentum, dui a ornare viverra, quam enim euismod ante, ut ultricies justo sapien in orci. Phasellus efficitur nunc non sollicitudin commodo. Proin tempus, sapien id tempor imperdiet, ipsum urna malesuada neque, ut efficitur diam leo ut risus. Vestibulum euismod lobortis massa ut dictum. Etiam hendrerit commodo velit in volutpat.

Integer viverra est eu aliquet aliquam. Sed varius eros lacus, a posuere felis aliquam sed. Proin vitae diam pharetra, aliquet metus ut, blandit mauris. Aenean mattis lacus eu ex rutrum, vel sodales ligula elementum. Curabitur cursus odio a ullamcorper feugiat. Fusce quis sem sagittis, imperdiet odio in, mollis urna. Suspendisse potenti. Nulla elementum erat vel nibh consequat, a elementum ligula faucibus.

Quisque cursus dolor et odio convallis condimentum. Fusce aliquam dapibus purus, et auctor ante consectetur a. Nunc eget lobortis neque, et auctor orci. Etiam sit amet nisi efficitur ligula lacinia condimentum. Nunc lacinia erat at est volutpat sagittis. Maecenas semper eleifend ipsum, vitae scelerisque est porttitor eu. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Mauris et ante quis est dictum tincidunt consectetur quis orci.

         [/border][/border][/border]
         [comment]----persona content end----[/comment]

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


     [comment]----tab three (history)----[/comment]
     [tab=3ai][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; line-height:0; letter-spacing:0; pointer-events:none;]
   [comment]----button select (ignore!)----[/comment]
   [border=transparent; height:350px; width:100%; flex:32; min-width:180px; max-width:215px; border-radius:4px; padding:0px; display:flex; flex-flow:column nowrap; align-items:flex-start; align-content:flex-start; margin:10px;][border=transparent; height:14%; width:100%; margin:auto 0 15px 0; display:flex; flex-flow: row wrap; align-items:center; align-content:center; justify-content:center; padding:5px 10px; box-sizing:border-box; color: var(--h1); border-radius:0px 0px 4px 4px; line-height:0%;]
      [comment]----filler button----[/comment]
      [border=transparent; height:20px; width:45%; margin:2.5px; padding:0;][/border]
      [comment]----filler button----[/comment]
      [border=transparent; height:20px; width:45%; margin:2.5px; padding:0;][/border]

      [comment]----selected button----[/comment]
      [border=transparent; border:1px solid var(--color-1); height:20px; width:45%; margin:2.5px; font-size:12px; letter-spacing:1px; text-align:center; padding:3px 0px 3px 0px; box-sizing:border-box; font-family:  var(--button); line-height:12px; background: var(--color-4);]hist.[/border]

      [comment]----filler button----[/comment]
      [border=transparent; height:20px; width:45%; margin:2.5px; padding:0;][/border]
   [/border][/border]
   [comment]----button select end----[/comment]


   [comment]----tab contents----[/comment]
   [border=transparent; height:350px; width:100%; flex:68; min-width:220px; max-width:365px; padding:5px 0 0 0; box-sizing:border-box; margin:10px; pointer-events:auto; display:flex; flex-flow:column nowrap; align-items:center;]
         [comment]----quote----[/comment]
         [border=transparent; height:44%; width:100%; padding:0 clamp(8px, 2vw, 20px); box-sizing:border-box; display:flex; flex-flow: row nowrap; justify-content:center; align-items:center;]

[comment]----quote image----[/comment]
[border=transparent; flex-shrink:0; width:clamp(60px, 30%, 90px); padding:0; margin-right:10px;][border=transparent; padding:0; padding-top:100%; border-radius:4px; background: var(--img-4); background-size:100%;

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

][/border][/border]

[comment]----quote contents----[/comment]
[border=transparent; height:fit-content; flex-grow:1; padding:0px; display:flex; flex-flow: row wrap; line-height:0%;]
    [border=transparent; background-color: var(--color-4); color: var(--h1); font-size:12px; font-weight:bold; border-radius:3px; font-family: var(--header); height:fit-content; width:fit-content; padding:3px 5px 3px 5px; line-height:120%; margin-bottom:5px;][comment]

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

[/comment]#bee says . . .[/border]
    [border=transparent; height:fit-content; max-height:55px; width:100%; padding:8px 25px 8px 25px; box-sizing:border-box; border-radius:4px; background-color: var(--color-3); position:relative; color:#000; font-family: var(--body); font-size:11px; text-align:justify;]
        [border=transparent; padding:0px; position:absolute; top:15px; left:5px; color:var(--color-2); font-size:20px;]❝[/border]
        [border=transparent; padding:0px; max-height:40px; overflow:hidden; line-height:130%;][comment]

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

[/comment]we're not dating. stop texting me. and ur not allowed to call me bee.[/border]
        [border=transparent; padding:0px; position:absolute; bottom:3px; right:5px; color:var(--color-2); font-size:20px;]❞[/border]
    [/border]
[/border]
         [/border]
         [comment]----quote end----[/comment]

         [comment]----history contents----[/comment]
         [border=transparent; height:62%; width:100%; padding:5px 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 5px; box-sizing:border-box; line-height:130%; font-family: var(--body); text-align:justify; color:var(--t-color); font-size:11px;][comment]

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

[/comment][comment]----copy this to get a tag----
[/comment][border=transparent; background-color: var(--color-4); font-weight:bold; border-radius:3px; font-family: var(--header); padding:0px 3px 0px 3px; letter-spacing:0.5px; display:inline-block; color: var(--h1); margin:2px 4px 2px 0;][comment]

----* * * tag title here----

[/comment]* history[/border][comment]
----put text after this comment----
[/comment] Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam sit amet lectus purus. Pellentesque elementum mattis arcu, id porta nibh pretium sed. Praesent non molestie elit, molestie faucibus tortor. In hendrerit varius neque at semper. Donec bibendum ornare arcu, sed tincidunt purus luctus vel. Ut pretium odio sagittis venenatis consectetur. Sed auctor sapien rutrum, ornare dolor id, luctus quam. Etiam orci tellus, euismod dapibus enim sit amet, placerat tincidunt massa. Proin suscipit, arcu sed lobortis pulvinar, ante massa porttitor orci, eget molestie eros nisl ac est.

Integer viverra est eu aliquet aliquam. Sed varius eros lacus, a posuere felis aliquam sed. Proin vitae diam pharetra, aliquet metus ut, blandit mauris. Aenean mattis lacus eu ex rutrum, vel sodales ligula elementum. Curabitur cursus odio a ullamcorper feugiat. Fusce quis sem sagittis, imperdiet odio in, mollis urna. Suspendisse potenti. Nulla elementum erat vel nibh consequat, a elementum ligula faucibus.

Quisque cursus dolor et odio convallis condimentum. Fusce aliquam dapibus purus, et auctor ante consectetur a. Nunc eget lobortis neque, et auctor orci. Etiam sit amet nisi efficitur ligula lacinia condimentum. Nunc lacinia erat at est volutpat sagittis. Maecenas semper eleifend ipsum, vitae scelerisque est porttitor eu. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Mauris et ante quis est dictum tincidunt consectetur quis orci.
         [/border][/border][/border]
         [comment]----history contents end----[/comment]

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


     [comment]----tab four (miscellaneous)----[/comment]
     [tab=4ai][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; line-height:0; letter-spacing:0; pointer-events:none;]
   [comment]----button select (ignore!)----[/comment]
   [border=transparent; height:350px; width:100%; flex:32; min-width:180px; max-width:215px; border-radius:4px; padding:0px; display:flex; flex-flow:column nowrap; align-items:flex-start; align-content:flex-start; margin:10px;][border=transparent; height:14%; width:100%; margin:auto 0 15px 0; display:flex; flex-flow: row wrap; align-items:center; align-content:center; justify-content:center; padding:5px 10px; box-sizing:border-box; color: var(--h1); border-radius:0px 0px 4px 4px; line-height:0%;]
      [comment]----filler button----[/comment]
      [border=transparent; height:20px; width:45%; margin:2.5px; padding:0;][/border]
      [comment]----filler button----[/comment]
      [border=transparent; height:20px; width:45%; margin:2.5px; padding:0;][/border]
      [comment]----filler button----[/comment]
      [border=transparent; height:20px; width:45%; margin:2.5px; padding:0;][/border]

      [comment]----selected button----[/comment]
      [border=transparent; border:1px solid var(--color-1); height:20px; width:45%; margin:2.5px; font-size:12px; letter-spacing:1px; text-align:center; padding:3px 0px 3px 0px; box-sizing:border-box; font-family:  var(--button); line-height:12px; background: var(--color-4);]misc.[/border]
   [/border][/border]
   [comment]----button select end----[/comment]


   [comment]----tab contents----[/comment]
   [border=transparent; height:350px; width:100%; flex:68; min-width:220px; max-width:365px; padding:5px 0 0 0; box-sizing:border-box; margin:10px; pointer-events:auto; display:flex; flex-flow:column nowrap; align-items:center;]
      [comment]----misc contents----[/comment]
      [border=transparent; height:100%; width:100%; padding:0 0 5px 0; box-sizing:border-box; display:flex; flex-direction:column; overflow:hidden;][border=transparent; height:100%; width:200%; padding:0; overflow-y:scroll;]

         [comment]----images----[/comment]
         [border=transparent; height:auto; width:50%; padding:15px 10px 15px 15px; box-sizing:border-box; display:flex; flex-flow: row wrap; justify-content:center; box-sizing:border-box; align-content:center; align-items:center; margin-bottom:15px;]
    [border=transparent; width:clamp(85px, 50% - 10px, 145px); padding:0; margin:5px; flex:auto 0;][border=transparent; padding:0; padding-top:calc(100% - 12px); border:6px solid var(--color-3); background: var(--gimg-1); background-size:cover; box-sizing:border-box;
/*edit the following to adjust the cropping of the image*/ background-position:50% 50%;][/border][/border]

    [border=transparent; width:clamp(85px, 50% - 10px, 145px); padding:0; margin:5px; flex:auto 0;][border=transparent; padding:0; padding-top:calc(100% - 12px); border:6px solid var(--color-3); background: var(--gimg-2); background-size:cover; box-sizing:border-box;
/*edit the following to adjust the cropping of the image*/ background-position:50% 50%;][/border][/border]

    [border=transparent; width:clamp(85px, 50% - 10px, 145px); padding:0; margin:5px; flex:auto 0;][border=transparent; padding:0; padding-top:calc(100% - 12px); border:6px solid var(--color-3); background: var(--gimg-3); background-size:cover; box-sizing:border-box;
/*edit the following to adjust the cropping of the image*/ background-position:50% 50%;][/border][/border]

    [border=transparent; width:clamp(85px, 50% - 10px, 145px); padding:0; margin:5px; flex:auto 0;][border=transparent; padding:0; padding-top:calc(100% - 12px); border:6px solid var(--color-3); background: var(--gimg-4); background-size:cover; box-sizing:border-box;
/*edit the following to adjust the cropping of the image*/ background-position:50% 50%;][/border][/border]

         [/border]
         [comment]----images end----[/comment]

         [comment]----misc contents----[/comment]
         [border=transparent; height:auto; width:50%; line-height:15px; padding:10px 8px 10px 10px; box-sizing:border-box; text-align:justify; font-family: var(--body); color:var(--t-color); font-size:11px; background: var(--bg-color); border-radius:2px;][comment]

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

[/comment][comment]----copy this to get a tag----
[/comment][border=transparent; background-color: var(--color-4); font-weight:bold; border-radius:3px; font-family: var(--header); padding:0px 3px 0px 3px; letter-spacing:0.5px; display:inline-block; color: var(--h1); margin:2px 4px 2px 0;][comment]

----* * * tag title here----

[/comment]* family[/border][comment]
----put text after this comment----
[/comment]info here

[comment]----copy this to get a tag----
[/comment][border=transparent; background-color: var(--color-4); font-weight:bold; border-radius:3px; font-family: var(--header); padding:0px 3px 0px 3px; letter-spacing:0.5px; display:inline-block; color: var(--h1); margin:2px 4px 2px 0;][comment]

----* * * tag title here----

[/comment]* mbti[/border][comment]
----put text after this comment----
[/comment]info here

         [/border]
      [comment]----misc content end----[/comment]
      [/border][/border]

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

         [/tabs][/border][/border]
         [comment]----tabs end----[/comment]
    [/border]
    [comment]----sidebar end----[/comment]

[comment]----tabs 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:350px; width:100%; flex:32; min-width:180px; max-width:215px; border-radius:4px; padding:0px; display:flex; flex-flow:column nowrap; align-items:flex-start; align-content:flex-start; margin:10px;]

   [comment]----button container----[/comment]
   [border=transparent; height:14%; width:100%; margin:auto 0 15px 0; display:flex; flex-flow: row wrap; align-items:center; align-content:center; justify-content:center; padding:5px 10px; box-sizing:border-box; background-color: var(--color-3); color: var(--h1); border-radius:0px 0px 4px 4px; line-height:0%;]

      [comment]----button----[/comment]
      [border=transparent; border:1px solid var(--color-1); height:20px; width:45%; margin:2.5px; font-size:12px; letter-spacing:1px; text-align:center; padding:3px 0px 3px 0px; box-sizing:border-box; font-family: var(--button); line-height:12px]req.[/border]

      [comment]----button----[/comment]
      [border=transparent; border:1px solid var(--color-1); height:20px; width:45%; margin:2.5px; font-size:12px; letter-spacing:1px; text-align:center; padding:3px 0px 3px 0px; box-sizing:border-box; font-family: var(--button); line-height:12px]pers.[/border]

      [comment]----button----[/comment]
      [border=transparent; border:1px solid var(--color-1); height:20px; width:45%; margin:2.5px; font-size:12px; letter-spacing:1px; text-align:center; padding:3px 0px 3px 0px; box-sizing:border-box; font-family: var(--button); line-height:12px]hist.[/border]

      [comment]----button----[/comment]
      [border=transparent; border:1px solid var(--color-1); height:20px; width:45%; margin:2.5px; font-size:12px; letter-spacing:1px; text-align:center; padding:3px 0px 3px 0px; box-sizing:border-box; font-family: var(--button); line-height:12px]misc.[/border]
[/border]
   [/border]

   [border=transparent; height:350px; width:100%; flex:68; min-width:220px; max-width:365px; padding:0; margin:10px;][/border]
[/border]
[comment]----tabs cover end----[/comment]

   [comment]----content filler area (ignore!)----[/comment]
   [border=transparent; height:350px; width:100%; flex:68; min-width:220px; max-width:365px; padding:0; margin:10px;][/border]

   [/border]
   [comment]----main contents end----[/comment]


   [comment]----background cut----[/comment]
   [border=transparent; position:absolute; width:100%; height:37%; background-color: var(--color-2); clip-path: polygon(0 0, 100% 0, 100% 75%, 0 100%); border-radius:4px 4px 0px 0px; top:0; left:0; padding:0px;][/border]

   [comment]----signature! do not remove----[/comment]
   [bg=transparent; height:fit-content; width:fit-content; padding:0; position:absolute;z-index:6;opacity:0.5;color: var(--bg-color); font-size:10px;text-align:center; top:20px; right:15px;][font=Open Sans]♡coded by uxie♡[/font][/bg]
[/border]