Advertisement
ooksie

new crazy (tab catalogue)

May 9th, 2022 (edited)
47
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. pick and choose which tabs you would like for your interest check here!
  2. please refer to the main post to see what each tab looks like ٩(◕‿◕。)۶
  3.  
  4. when selecting, **please** remember to copy the **full tab**, and *only* the full tab; e.g., from [comment]----about tab----[/comment] to [comment]----about tab end----[/comment]. ensure this starts and ends what you copy. put in your tabs into the main code in the order you want them to be shown on the code! (´。• ω •。`) *do not* paste tabs within other tabs; make sure you see another [comment]----/tab name/ end----[/comment] before your new [comment]----/tab name/----[/comment]!!!!
  5.  
  6. this code is really long, so i'd advise using the search function (ctrl+f) with the name of the tab (e.g. about tab) to find each section.
  7.  
  8.  
  9.  
  10. [comment]----about me tab----[/comment]
  11. [tab=.][border=transparent; height:100%; width:100%; padding:0; display:flex; flex-flow:row wrap; align-items:center; justify-content:center; position:absolute; bottom:0; right:0; pointer-events:none;][border=transparent; height:clamp(190px, -50px + 43vw, 240px); flex:43; min-width:170px; max-width:200px; padding:0; margin: var(--m); ][/border][border=transparent; height:304px; flex:57; min-width:230px; padding:0; box-sizing:border-box; margin: var(--m); margin-right:clamp(2px, var(--m) + 50px - 9vw, var(--m)); overflow:hidden; pointer-events:auto; letter-spacing:0;][border=transparent; height:100%; width:200%; padding:0; overflow-y:scroll;][border=transparent; height:auto; width:50%; padding:0; box-sizing:border-box; --m-t: 23px;][border=transparent; height:0; width:100%; padding:0; margin-bottom:calc(var(--m-t) * -1);][/border]
  12.  
  13. [comment]----copy this whole thing to make a new section (info tags)----[/comment]
  14. [border=transparent; height:auto; width:100%; padding:0; display:flex; flex-flow:column nowrap; margin-top: var(--m-t);]
  15. [comment]----title----[/comment]
  16. [border=transparent; height:auto; width:100%; padding:1px 5px 13px 0; box-sizing:border-box; background: var(--bg-color); display:flex; flex-flow:row nowrap; align-items:center; justify-content:flex-end; position:sticky; top:0; z-index:5;][border=transparent; height:auto; width:auto; padding:0; color: var(--color-1); font-size:17px; flex-shrink:0; margin-right:14px;][comment]
  17.  
  18. ----* * * title icon here----
  19.  
  20. [/comment][fa]fal fa-star-christmas[/fa][/border]
  21. [border=transparent; height:auto; width;auto; padding:0; color: var(--color-1); font-family: var(--header); letter-spacing:2px; font-weight:bold; -webkit-text-stroke:0.5px var(--color-1); font-size:22px; line-height:21px; text-align:right; flex-shrink:0; letter-spacing:1px; text-transform:uppercase; margin-right:-5px;][comment]
  22.  
  23. ----* * * section title here----
  24.  
  25. [/comment]about[/border]
  26. [/border]
  27. [comment]----title end----[/comment]
  28.  
  29. [comment]----section contents----[/comment]
  30. [border=transparent; height:auto; width:100%; padding:0 0.5px 0 0; box-sizing:border-box;][border=transparent; height:0; width:100%; padding:0; margin-bottom:-10px;][/border]
  31.  
  32. [comment]----copy this whole thing to get another piece of info----[/comment]
  33. [border=transparent; height:auto; width:100%; padding:0; display:flex; flex-flow:row nowrap; align-items:center; margin-top:10px;]
  34. [border=transparent; height:auto; width:fit-content; width:-moz-fit-content; max-width:50%; padding:3px 5px; box-sizing:border-box; border:1px solid var(--color-1); flex-shrink:0; color: var(--color-1); font-family: var(--header); text-transform:uppercase; line-height:100%; font-size:10.5px; font-weight:bold; letter-spacing:1px; margin-right:15px;][comment]
  35.  
  36. ----* * * info title here----
  37.  
  38. [/comment]call me[/border]
  39. [border=transparent; height:auto; flex:1; padding:0; color: var(--t-color); font-size:12px; line-height:16px; font-family: var(--body); letter-spacing:0.5px;][comment]
  40.  
  41. ----* * * info contents here----
  42.  
  43. [/comment]answer[/border]
  44. [/border]
  45. [comment]----copy me too!----[/comment]
  46.  
  47. [comment]----copy this whole thing to get another piece of info----[/comment]
  48. [border=transparent; height:auto; width:100%; padding:0; display:flex; flex-flow:row nowrap; align-items:center; margin-top:10px;]
  49. [border=transparent; height:auto; width:fit-content; width:-moz-fit-content; max-width:50%; padding:3px 5px; box-sizing:border-box; border:1px solid var(--color-1); flex-shrink:0; color: var(--color-1); font-family: var(--header); text-transform:uppercase; line-height:100%; font-size:10.5px; font-weight:bold; letter-spacing:1px; margin-right:15px;][comment]
  50.  
  51. ----* * * info title here----
  52.  
  53. [/comment]pronouns[/border]
  54. [border=transparent; height:auto; flex:1; padding:0; color: var(--t-color); font-size:12px; line-height:16px; font-family: var(--body); letter-spacing:0.5px;][comment]
  55.  
  56. ----* * * info contents here----
  57.  
  58. [/comment]answer[/border]
  59. [/border]
  60. [comment]----copy me too!----[/comment]
  61.  
  62. [comment]----copy this whole thing to get another piece of info----[/comment]
  63. [border=transparent; height:auto; width:100%; padding:0; display:flex; flex-flow:row nowrap; align-items:center; margin-top:10px;]
  64. [border=transparent; height:auto; width:fit-content; width:-moz-fit-content; max-width:50%; padding:3px 5px; box-sizing:border-box; border:1px solid var(--color-1); flex-shrink:0; color: var(--color-1); font-family: var(--header); text-transform:uppercase; line-height:100%; font-size:10.5px; font-weight:bold; letter-spacing:1px; margin-right:15px;][comment]
  65.  
  66. ----* * * info title here----
  67.  
  68. [/comment]timezone[/border]
  69. [border=transparent; height:auto; flex:1; padding:0; color: var(--t-color); font-size:12px; line-height:16px; font-family: var(--body); letter-spacing:0.5px;][comment]
  70.  
  71. ----* * * info contents here----
  72.  
  73. [/comment]answer[/border]
  74. [/border]
  75. [comment]----copy me too!----[/comment]
  76.  
  77. [comment]----copy this whole thing to get another piece of info----[/comment]
  78. [border=transparent; height:auto; width:100%; padding:0; display:flex; flex-flow:row nowrap; align-items:center; margin-top:10px;]
  79. [border=transparent; height:auto; width:fit-content; width:-moz-fit-content; max-width:50%; padding:3px 5px; box-sizing:border-box; border:1px solid var(--color-1); flex-shrink:0; color: var(--color-1); font-family: var(--header); text-transform:uppercase; line-height:100%; font-size:10.5px; font-weight:bold; letter-spacing:1px; margin-right:15px;][comment]
  80.  
  81. ----* * * info title here----
  82.  
  83. [/comment]age range[/border]
  84. [border=transparent; height:auto; flex:1; padding:0; color: var(--t-color); font-size:12px; line-height:16px; font-family: var(--body); letter-spacing:0.5px;][comment]
  85.  
  86. ----* * * info contents here----
  87.  
  88. [/comment]answer[/border]
  89. [/border]
  90. [comment]----copy me too!----[/comment]
  91.  
  92. [comment]----copy this whole thing to get another piece of info----[/comment]
  93. [border=transparent; height:auto; width:100%; padding:0; display:flex; flex-flow:row nowrap; align-items:center; margin-top:10px;]
  94. [border=transparent; height:auto; width:fit-content; width:-moz-fit-content; max-width:50%; padding:3px 5px; box-sizing:border-box; border:1px solid var(--color-1); flex-shrink:0; color: var(--color-1); font-family: var(--header); text-transform:uppercase; line-height:100%; font-size:10.5px; font-weight:bold; letter-spacing:1px; margin-right:15px;][comment]
  95.  
  96. ----* * * info title here----
  97.  
  98. [/comment]question[/border]
  99. [border=transparent; height:auto; flex:1; padding:0; color: var(--t-color); font-size:12px; line-height:16px; font-family: var(--body); letter-spacing:0.5px;][comment]
  100.  
  101. ----* * * info contents here----
  102.  
  103. [/comment]answer[/border]
  104. [/border]
  105. [comment]----copy me too!----[/comment]
  106.  
  107. [comment]----copy this whole thing to get another piece of text----[/comment]
  108. [border=transparent; height:auto; width:100%; padding:0; color: var(--t-color); font-size:12px; line-height:16px; font-family: var(--body); text-align:justify; margin-top:20px;][comment]
  109.  
  110. ----* * * text starts here----
  111.  
  112. [/comment]if you want to mix some text in here too. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent tempor ultrices erat id lacinia. Aliquam vitae ultrices ante. Curabitur eu purus ut odio imperdiet blandit ut nec libero. In congue quam eu sodales congue.
  113. [/border]
  114. [comment]----copy me too!----[/comment]
  115. [/border]
  116. [comment]----section contents end----[/comment]
  117. [/border]
  118. [comment]----copy me too! (section)----[/comment]
  119.  
  120. [comment]----copy this whole thing to make a new section (text)----[/comment]
  121. [border=transparent; height:auto; width:100%; padding:0; display:flex; flex-flow:column nowrap; margin-top: var(--m-t);]
  122. [comment]----title----[/comment]
  123. [border=transparent; height:auto; width:100%; padding:1px 5px 13px 0; box-sizing:border-box; background: var(--bg-color); display:flex; flex-flow:row nowrap; align-items:center; justify-content:flex-end; position:sticky; top:0; z-index:5;][border=transparent; height:auto; width:auto; padding:0; color: var(--color-1); font-size:17px; flex-shrink:0; margin-right:14px;][comment]
  124.  
  125. ----* * * title icon here----
  126.  
  127. [/comment][fa]fal fa-star-christmas[/fa][/border]
  128. [border=transparent; height:auto; width;auto; padding:0; color: var(--color-1); font-family: var(--header); letter-spacing:2px; font-weight:bold; -webkit-text-stroke:0.5px var(--color-1); font-size:22px; line-height:21px; text-align:right; flex-shrink:0; letter-spacing:1px; text-transform:uppercase; margin-right:-5px;][comment]
  129.  
  130. ----* * * section title here----
  131.  
  132. [/comment]about you[/border]
  133. [/border]
  134. [comment]----title end----[/comment]
  135.  
  136. [comment]----section contents----[/comment]
  137. [border=transparent; height:auto; width:100%; padding:0 0.5px 0 0; box-sizing:border-box; color: var(--t-color); font-size:12px; text-align:justify; line-height:16px; font-family: var(--body);][comment]
  138.  
  139. ----* * * text starts here----
  140.  
  141. [/comment]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent tempor ultrices erat id lacinia. Aliquam vitae ultrices ante. Curabitur eu purus ut odio imperdiet blandit ut nec libero. In congue quam eu sodales congue. Mauris et accumsan lorem, quis tempus orci. Ut erat velit, blandit vel massa at, fermentum efficitur purus. Integer nec ante ac elit bibendum maximus. Donec ullamcorper arcu sed magna tincidunt consectetur vel eu sem. Fusce nibh leo, commodo in efficitur at, semper quis nisl.
  142.  
  143. Proin condimentum mauris in augue consequat, vitae molestie risus fringilla. Vivamus ut facilisis nibh. Duis tincidunt orci eu cursus ullamcorper. Sed iaculis venenatis magna nec ultricies. Cras fringilla urna nibh, iaculis faucibus metus sagittis quis. Curabitur vel nisi sit amet nunc congue euismod et quis elit. Duis lacinia sit amet neque eu auctor. Sed malesuada sodales lacus, vitae tempus eros tincidunt nec. Aenean aliquet sem risus, ac consectetur erat iaculis quis.
  144. [/border]
  145. [comment]----section contents end----[/comment]
  146. [/border]
  147. [comment]----copy me too! (section)----[/comment]
  148.  
  149. [/border][/border][/border][/border][/tab]
  150. [comment]----about tab end----[/comment]
  151.  
  152.  
  153.  
  154.  
  155. [comment]----rules tab----[/comment]
  156. [tab=.][border=transparent; height:100%; width:100%; padding:0; display:flex; flex-flow:row wrap; align-items:center; justify-content:center; position:absolute; bottom:0; right:0; pointer-events:none;][border=transparent; height:clamp(190px, -50px + 43vw, 240px); flex:43; min-width:170px; max-width:200px; padding:0; margin: var(--m); ][/border][border=transparent; height:304px; flex:57; min-width:230px; padding:0; box-sizing:border-box; margin: var(--m); margin-right:clamp(2px, var(--m) + 50px - 9vw, var(--m)); overflow:hidden; pointer-events:auto; letter-spacing:0;][border=transparent; height:100%; width:200%; padding:0; overflow-y:scroll;][border=transparent; height:auto; width:50%; padding:0; box-sizing:border-box; --m-t: 23px;][border=transparent; height:0; width:100%; padding:0; margin-bottom:calc(var(--m-t) * -1);][/border]
  157.  
  158. [comment]----copy this whole thing to make a new section (rules/list)----[/comment]
  159. [border=transparent; height:auto; width:100%; padding:0; display:flex; flex-flow:column nowrap; margin-top: var(--m-t);]
  160. [comment]----title----[/comment]
  161. [border=transparent; height:auto; width:100%; padding:1px 5px 13px 0; box-sizing:border-box; background: var(--bg-color); display:flex; flex-flow:row nowrap; align-items:center; justify-content:flex-end; position:sticky; top:0; z-index:5;][border=transparent; height:auto; width:auto; padding:0; color: var(--color-1); font-size:17px; flex-shrink:0; margin-right:14px;][comment]
  162.  
  163. ----* * * title icon here----
  164.  
  165. [/comment][fa]fal fa-star-christmas[/fa][/border]
  166. [border=transparent; height:auto; width;auto; padding:0; color: var(--color-1); font-family: var(--header); letter-spacing:2px; font-weight:bold; -webkit-text-stroke:0.5px var(--color-1); font-size:22px; line-height:21px; text-align:right; flex-shrink:0; letter-spacing:1px; text-transform:uppercase; margin-right:-5px;][comment]
  167.  
  168. ----* * * section title here----
  169.  
  170. [/comment]rules[/border]
  171. [/border]
  172. [comment]----title end----[/comment]
  173.  
  174. [comment]----section contents----[/comment]
  175. [border=transparent; height:auto; width:100%; padding:0 0.5px 0 0; box-sizing:border-box;][border=transparent; height:0; width:100%; padding:0; margin-bottom:-16px;][/border]
  176.  
  177. [comment]----copy this whole thing to add another rule----[/comment]
  178. [border=transparent; height:auto; width:100%; padding:0; color: var(--t-color); text-align:justify; font-size:12px; font-family: var(--body); line-height:16px; margin-top:16px;][border=transparent; height:32px; width:auto; padding:2px 15px 0 0; box-sizing:border-box; float:left; display:flex; align-items:flex-start;][border=transparent; height:auto; width:fit-content; width:-moz-fit-content; min-width:fit-content; min-width:-moz-fit-content; padding:3px 5px; box-sizing:border-box; border:1px solid var(--color-1); flex-shrink:0; color: var(--color-1); font-family: var(--header); text-transform:uppercase; line-height:100%; font-size:11px; font-weight:bold; letter-spacing:1px;][comment]
  179.  
  180. ----* * * info title here----
  181.  
  182. [/comment]rule one[/border][/border][comment]
  183.  
  184. ----* * * text starts here----
  185.  
  186. [/comment]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent tempor ultrices erat id lacinia. Aliquam vitae ultrices ante. Curabitur eu purus ut odio imperdiet blandit ut nec libero. In congue quam eu sodales congue.
  187. [/border]
  188. [comment]----copy me too!----[/comment]
  189.  
  190. [comment]----copy this whole thing to add another rule----[/comment]
  191. [border=transparent; height:auto; width:100%; padding:0; color: var(--t-color); text-align:justify; font-size:12px; font-family: var(--body); line-height:16px; margin-top:16px;][border=transparent; height:32px; width:auto; padding:2px 15px 0 0; box-sizing:border-box; float:left; display:flex; align-items:flex-start;][border=transparent; height:auto; width:fit-content; width:-moz-fit-content; min-width:fit-content; min-width:-moz-fit-content; padding:3px 5px; box-sizing:border-box; border:1px solid var(--color-1); flex-shrink:0; color: var(--color-1); font-family: var(--header); text-transform:uppercase; line-height:100%; font-size:11px; font-weight:bold; letter-spacing:1px;][comment]
  192.  
  193. ----* * * info title here----
  194.  
  195. [/comment]rule two[/border][/border][comment]
  196.  
  197. ----* * * text starts here----
  198.  
  199. [/comment]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent tempor ultrices erat id lacinia. Aliquam vitae ultrices ante. Curabitur eu purus ut odio imperdiet blandit ut nec libero. In congue quam eu sodales congue.
  200. [/border]
  201. [comment]----copy me too!----[/comment]
  202.  
  203. [comment]----copy this whole thing to add another rule----[/comment]
  204. [border=transparent; height:auto; width:100%; padding:0; color: var(--t-color); text-align:justify; font-size:12px; font-family: var(--body); line-height:16px; margin-top:16px;] [border=transparent; height:32px; width:auto; padding:2px 15px 0 0; box-sizing:border-box; float:left; display:flex; align-items:flex-start;][border=transparent; height:auto; width:fit-content; width:-moz-fit-content; min-width:fit-content; min-width:-moz-fit-content; padding:3px 5px; box-sizing:border-box; border:1px solid var(--color-1); flex-shrink:0; color: var(--color-1); font-family: var(--header); text-transform:uppercase; line-height:100%; font-size:11px; font-weight:bold; letter-spacing:1px;][comment]
  205.  
  206. ----* * * info title here----
  207.  
  208. [/comment]rule three[/border][/border][comment]
  209.  
  210. ----* * * text starts here----
  211.  
  212. [/comment]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent tempor ultrices erat id lacinia. Aliquam vitae ultrices ante. Curabitur eu purus ut odio imperdiet blandit ut nec libero. In congue quam eu sodales congue.
  213. [/border]
  214. [comment]----copy me too!----[/comment]
  215.  
  216. [/border]
  217. [comment]----section contents end----[/comment]
  218. [/border]
  219. [comment]----copy me too! (section)----[/comment]
  220.  
  221. [/border][/border][/border][/border][/tab]
  222. [comment]----rules tab end----[/comment]
  223.  
  224.  
  225.  
  226.  
  227. [comment]----vibes tab----[/comment]
  228. [tab=.][border=transparent; height:100%; width:100%; padding:0; display:flex; flex-flow:row wrap; align-items:center; justify-content:center; position:absolute; bottom:0; right:0; pointer-events:none;][border=transparent; height:clamp(190px, -50px + 43vw, 240px); flex:43; min-width:170px; max-width:200px; padding:0; margin: var(--m); ][/border][border=transparent; height:304px; flex:57; min-width:230px; padding:0; box-sizing:border-box; margin: var(--m); margin-right:clamp(2px, var(--m) + 50px - 9vw, var(--m)); overflow:hidden; pointer-events:auto; letter-spacing:0;][border=transparent; height:100%; width:200%; padding:0; overflow-y:scroll;][border=transparent; height:auto; width:50%; padding:0; box-sizing:border-box; --m-t: 23px;][border=transparent; height:0; width:100%; padding:0; margin-bottom:calc(var(--m-t) * -1);][/border]
  229.  
  230. [comment]----copy this whole thing to make a new section (gallery)----[/comment]
  231. [border=transparent; height:auto; width:100%; padding:0; display:flex; flex-flow:column nowrap; margin-top: var(--m-t);]
  232. [comment]----title----[/comment]
  233. [border=transparent; height:auto; width:100%; padding:1px 5px 13px 0; box-sizing:border-box; background: var(--bg-color); display:flex; flex-flow:row nowrap; align-items:center; justify-content:flex-end; position:sticky; top:0; z-index:5;][border=transparent; height:auto; width:auto; padding:0; color: var(--color-1); font-size:17px; flex-shrink:0; margin-right:14px;][comment]
  234.  
  235. ----* * * title icon here----
  236.  
  237. [/comment][fa]fal fa-star-christmas[/fa][/border]
  238. [border=transparent; height:auto; width;auto; padding:0; color: var(--color-1); font-family: var(--header); letter-spacing:2px; font-weight:bold; -webkit-text-stroke:0.5px var(--color-1); font-size:22px; line-height:21px; text-align:right; flex-shrink:0; letter-spacing:1px; text-transform:uppercase; margin-right:-5px;][comment]
  239.  
  240. ----* * * section title here----
  241.  
  242. [/comment]moodboard[/border]
  243. [/border]
  244. [comment]----title end----[/comment]
  245.  
  246. [comment]----section contents----[/comment]
  247. [border=transparent; height:auto; width:100%; padding:0 0.5px 0 0; box-sizing:border-box; display:flex; flex-flow:row wrap; --m-g: 5px;]
  248.  
  249. [comment]----copy this whole thing to add another image----[/comment]
  250. [border=transparent; flex:1; min-width:clamp(50px, 28%, 80px); padding:0; flex-shrink:0; margin: var(--m-g);][border=transparent; padding:0; padding-top:100%;
  251.  
  252. /*add image URL here*/ background: URL('https://64.media.tumblr.com/c2a1dbcc55152770eb8c7a9a778392fd/ba7f717bf4e2197a-24/s540x810/8ae400f1d770aadfbae6d5c42540dce2a0f75b1e.gif');
  253.  
  254. /*adjust the following to adjust the cropping of the image*/ background-position:50% 50%;
  255.  
  256. background-size:cover; background-repeat:no-repeat;][/border][/border]
  257. [comment]----copy me too!----[/comment]
  258.  
  259. [comment]----copy this whole thing to add another image----[/comment]
  260. [border=transparent; flex:1; min-width:clamp(50px, 28%, 80px); padding:0; flex-shrink:0; margin: var(--m-g);][border=transparent; padding:0; padding-top:100%;
  261.  
  262. /*add image URL here*/ background: URL('https://64.media.tumblr.com/336c6fc6216f6f1a6c354725383c5dde/e2fad890570f7c81-9e/s540x810/f8bcde8c833189ebb7b31b9b9225ba38eed2d5d6.gif');
  263.  
  264. /*adjust the following to adjust the cropping of the image*/ background-position:50% 50%;
  265.  
  266. background-size:cover; background-repeat:no-repeat;][/border][/border]
  267. [comment]----copy me too!----[/comment]
  268.  
  269. [comment]----copy this whole thing to add another image----[/comment]
  270. [border=transparent; flex:1; min-width:clamp(50px, 28%, 80px); padding:0; flex-shrink:0; margin: var(--m-g);][border=transparent; padding:0; padding-top:100%;
  271.  
  272. /*add image URL here*/ background: URL('https://64.media.tumblr.com/b7aaaaef648571da7a63179a0b9b4f14/ba7f717bf4e2197a-07/s540x810/122e553983d6172608fc09702fdbede62af99149.gif');
  273.  
  274. /*adjust the following to adjust the cropping of the image*/ background-position:50% 50%;
  275.  
  276. background-size:cover; background-repeat:no-repeat;][/border][/border]
  277. [comment]----copy me too!----[/comment]
  278.  
  279. [comment]----copy this whole thing to add another image----[/comment]
  280. [border=transparent; flex:1; min-width:clamp(50px, 28%, 80px); padding:0; flex-shrink:0; margin: var(--m-g);][border=transparent; padding:0; padding-top:100%;
  281.  
  282. /*add image URL here*/ background: URL('https://64.media.tumblr.com/0fbaa2b0c1033c6927faa67d0d2a6f11/e2fad890570f7c81-42/s540x810/f7119cf384ee9abd23a7e2c7d0e791529b802022.gif');
  283.  
  284. /*adjust the following to adjust the cropping of the image*/ background-position:50% 50%;
  285.  
  286. background-size:cover; background-repeat:no-repeat;][/border][/border]
  287. [comment]----copy me too!----[/comment]
  288.  
  289. [comment]----copy this whole thing to add another image----[/comment]
  290. [border=transparent; flex:1; min-width:clamp(50px, 28%, 80px); padding:0; flex-shrink:0; margin: var(--m-g);][border=transparent; padding:0; padding-top:100%;
  291.  
  292. /*add image URL here*/ background: URL('https://64.media.tumblr.com/fbcec3d02361d2a48c8a6265d6b431ab/e2fad890570f7c81-b0/s540x810/e240ceb4081879d9548e53ddc6f0be1c677e125a.gif');
  293.  
  294. /*adjust the following to adjust the cropping of the image*/ background-position:50% 50%;
  295.  
  296. background-size:cover; background-repeat:no-repeat;][/border][/border]
  297. [comment]----copy me too!----[/comment]
  298.  
  299. [/border]
  300. [comment]----section contents end----[/comment]
  301. [/border]
  302. [comment]----copy me too! (section)----[/comment]
  303.  
  304. [comment]----copy this whole thing to make a new section (short list)----[/comment]
  305. [border=transparent; height:auto; width:100%; padding:0; display:flex; flex-flow:column nowrap; margin-top: var(--m-t);]
  306. [comment]----title----[/comment]
  307. [border=transparent; height:auto; width:100%; padding:1px 5px 13px 0; box-sizing:border-box; background: var(--bg-color); display:flex; flex-flow:row nowrap; align-items:center; justify-content:flex-end; position:sticky; top:0; z-index:5;][border=transparent; height:auto; width:auto; padding:0; color: var(--color-1); font-size:17px; flex-shrink:0; margin-right:14px;][comment]
  308.  
  309. ----* * * title icon here----
  310.  
  311. [/comment][fa]fal fa-star-christmas[/fa][/border]
  312. [border=transparent; height:auto; width;auto; padding:0; color: var(--color-1); font-family: var(--header); letter-spacing:2px; font-weight:bold; -webkit-text-stroke:0.5px var(--color-1); font-size:22px; line-height:21px; text-align:right; flex-shrink:0; letter-spacing:1px; text-transform:uppercase; margin-right:-5px;][comment]
  313.  
  314. ----* * * section title here----
  315.  
  316. [/comment]wordbank[/border]
  317. [/border]
  318. [comment]----title end----[/comment]
  319.  
  320. [comment]----section contents----[/comment]
  321. [border=transparent; height:auto; width:100%; padding:0 0.5px 0 0; box-sizing:border-box; color: var(--t-color); font-size:12px; font-family: var(--body); display:flex; flex-flow:row wrap; justify-content:center; margin-top:-3px; --m-w:3px 4px;]
  322.  
  323. [comment]----copy this whole thing to add another tag----[/comment]
  324. [border=transparent; height:auto; width:auto; min-width:fit-content; min-width:-moz-fit-content; max-width:100%; padding:3px 7px; box-sizing:border-box; border:1px solid var(--color-1); flex-shrink:0; color: var(--color-1); font-family: var(--header); text-transform:uppercase; line-height:100%; font-size:10.5px; font-weight:bold; letter-spacing:1px; margin: var(--m-w); text-align:center;][comment]
  325.  
  326. ----* * * tag here----
  327.  
  328. [/comment]mermaids[/border]
  329. [comment]----copy me too!----[/comment]
  330.  
  331. [comment]----copy this whole thing to add another tag----[/comment]
  332. [border=transparent; height:auto; width:auto; min-width:fit-content; min-width:-moz-fit-content; max-width:100%; padding:3px 7px; box-sizing:border-box; border:1px solid var(--color-1); flex-shrink:0; color: var(--color-1); font-family: var(--header); text-transform:uppercase; line-height:100%; font-size:10.5px; font-weight:bold; letter-spacing:1px; margin: var(--m-w); text-align:center;][comment]
  333.  
  334. ----* * * tag here----
  335.  
  336. [/comment]grapes[/border]
  337. [comment]----copy me too!----[/comment]
  338.  
  339. [comment]----copy this whole thing to add another tag----[/comment]
  340. [border=transparent; height:auto; width:auto; min-width:fit-content; min-width:-moz-fit-content; max-width:100%; padding:3px 7px; box-sizing:border-box; border:1px solid var(--color-1); flex-shrink:0; color: var(--color-1); font-family: var(--header); text-transform:uppercase; line-height:100%; font-size:10.5px; font-weight:bold; letter-spacing:1px; margin: var(--m-w); text-align:center;][comment]
  341.  
  342. ----* * * tag here----
  343.  
  344. [/comment]super[/border]
  345. [comment]----copy me too!----[/comment]
  346.  
  347. [comment]----copy this whole thing to add another tag----[/comment]
  348. [border=transparent; height:auto; width:auto; min-width:fit-content; min-width:-moz-fit-content; max-width:100%; padding:3px 7px; box-sizing:border-box; border:1px solid var(--color-1); flex-shrink:0; color: var(--color-1); font-family: var(--header); text-transform:uppercase; line-height:100%; font-size:10.5px; font-weight:bold; letter-spacing:1px; margin: var(--m-w); text-align:center;][comment]
  349.  
  350. ----* * * tag here----
  351.  
  352. [/comment]enemies to lovers[/border]
  353. [comment]----copy me too!----[/comment]
  354.  
  355. [comment]----copy this whole thing to add another tag----[/comment]
  356. [border=transparent; height:auto; width:auto; min-width:fit-content; min-width:-moz-fit-content; max-width:100%; padding:3px 7px; box-sizing:border-box; border:1px solid var(--color-1); flex-shrink:0; color: var(--color-1); font-family: var(--header); text-transform:uppercase; line-height:100%; font-size:10.5px; font-weight:bold; letter-spacing:1px; margin: var(--m-w); text-align:center;][comment]
  357.  
  358. ----* * * tag here----
  359.  
  360. [/comment]angels[/border]
  361. [comment]----copy me too!----[/comment]
  362.  
  363. [comment]----copy this whole thing to add another tag----[/comment]
  364. [border=transparent; height:auto; width:auto; min-width:fit-content; min-width:-moz-fit-content; max-width:100%; padding:3px 7px; box-sizing:border-box; border:1px solid var(--color-1); flex-shrink:0; color: var(--color-1); font-family: var(--header); text-transform:uppercase; line-height:100%; font-size:10.5px; font-weight:bold; letter-spacing:1px; margin: var(--m-w); text-align:center;][comment]
  365.  
  366. ----* * * tag here----
  367.  
  368. [/comment]cyberpunk[/border]
  369. [comment]----copy me too!----[/comment]
  370.  
  371. [comment]----copy this whole thing to add another tag----[/comment]
  372. [border=transparent; height:auto; width:auto; min-width:fit-content; min-width:-moz-fit-content; max-width:100%; padding:3px 7px; box-sizing:border-box; border:1px solid var(--color-1); flex-shrink:0; color: var(--color-1); font-family: var(--header); text-transform:uppercase; line-height:100%; font-size:10.5px; font-weight:bold; letter-spacing:1px; margin: var(--m-w); text-align:center;][comment]
  373.  
  374. ----* * * tag here----
  375.  
  376. [/comment]ballerinas[/border]
  377. [comment]----copy me too!----[/comment]
  378.  
  379. [/border]
  380. [comment]----section contents end----[/comment]
  381. [/border]
  382. [comment]----copy me too! (section)----[/comment]
  383.  
  384. [/border][/border][/border][/border][/tab]
  385. [comment]----vibes tab end----[/comment]
  386.  
  387.  
  388.  
  389.  
  390. [comment]----plots tab----[/comment]
  391. [tab=.][border=transparent; height:100%; width:100%; padding:0; display:flex; flex-flow:row wrap; align-items:center; justify-content:center; position:absolute; bottom:0; right:0; pointer-events:none;][border=transparent; height:clamp(190px, -50px + 43vw, 240px); flex:43; min-width:170px; max-width:200px; padding:0; margin: var(--m); ][/border][border=transparent; height:304px; flex:57; min-width:230px; padding:0; box-sizing:border-box; margin: var(--m); margin-right:clamp(2px, var(--m) + 50px - 9vw, var(--m)); overflow:hidden; pointer-events:auto; letter-spacing:0;][border=transparent; height:100%; width:200%; padding:0; overflow-y:scroll;][border=transparent; height:auto; width:50%; padding:0; box-sizing:border-box; --m-t: 23px;][border=transparent; height:0; width:100%; padding:0; margin-bottom:calc(var(--m-t) * -1);][/border]
  392.  
  393. [comment]----copy this whole thing to make a new section (plots)----[/comment]
  394. [border=transparent; height:auto; width:100%; padding:0; display:flex; flex-flow:column nowrap; margin-top: var(--m-t);]
  395. [comment]----title----[/comment]
  396. [border=transparent; height:auto; width:100%; padding:1px 5px 13px 0; box-sizing:border-box; background: var(--bg-color); display:flex; flex-flow:row nowrap; align-items:center; justify-content:flex-end; position:sticky; top:0; z-index:5;][border=transparent; height:auto; width:auto; padding:0; color: var(--color-1); font-size:17px; flex-shrink:0; margin-right:14px;][comment]
  397.  
  398. ----* * * title icon here----
  399.  
  400. [/comment][fa]fal fa-star-christmas[/fa][/border]
  401. [border=transparent; height:auto; width;auto; padding:0; color: var(--color-1); font-family: var(--header); letter-spacing:2px; font-weight:bold; -webkit-text-stroke:0.5px var(--color-1); font-size:22px; line-height:21px; text-align:right; flex-shrink:0; letter-spacing:1px; text-transform:uppercase; margin-right:-5px;][comment]
  402.  
  403. ----* * * section title here----
  404.  
  405. [/comment]plots[/border]
  406. [/border]
  407. [comment]----title end----[/comment]
  408.  
  409. [comment]----section contents----[/comment]
  410. [border=transparent; height:auto; width:100%; padding:0 0.5px 0 0; box-sizing:border-box; --m-p: 30px;][border=transparent; height:0; width:100%; padding:0; margin-bottom:calc(var(--m-p) * -1);][/border]
  411.  
  412. [comment]----copy this whole thing to make another plot----[/comment]
  413. [border=transparent; height:auto; width:100%; padding:0; display:flex; flex-flow:column nowrap; margin-top: var(--m-p);]
  414. [comment]----plot header----[/comment]
  415. [border=transparent; height:auto; width:100%; padding:0 0 10px 0; box-sizing:border-box; background: var(--bg-color); display:flex; flex-flow:column nowrap; align-items:flex-end; position:sticky; top:35px;]
  416. [comment]----plot image----[/comment]
  417. [border=transparent; min-height:58px; height:auto; max-height:68px; width:100%; padding:15px 10px; box-sizing:border-box; border-radius:1px;
  418.  
  419. /*put your plot image url here*/ background:url('https://64.media.tumblr.com/453ab42104ed9eb981f6806225428aa0/e5c91488df729cb8-db/s540x810/d85c9ded0735fd3259ee34e7238d7c1924480f2d.jpg');
  420.  
  421. /*edit the following to adjust the cropping of the image*/ background-position:50% 50%;
  422.  
  423. background-size:cover; display:flex; align-items:center; justify-content:center; position:relative;][border=transparent; height:100%; width:100%; padding:0; background: var(--color-2);
  424.  
  425. /*adjust the opacity of colour background here*/ opacity:0.2;
  426.  
  427. position:absolute; top:0; left:0; border-radius:1px;][/border][border=transparent;
  428.  
  429. /*adjust font size here if it's too big!*/ --fs: 20px;
  430.  
  431. height:auto; max-height:45px; overflow:hidden; width:100%; padding:0; color: var(--color-1); font-size: var(--fs); font-weight:bold; -webkit-text-stroke:0.5px var(--color-1); font-family: var(--header); text-transform:uppercase; line-height:calc(var(--fs) + 2px); position:relative; z-index:2; text-align:center; letter-spacing:2px;][comment]
  432.  
  433. ----* * * plot title here (max two lines)----
  434.  
  435. [/comment]fearless[/border]
  436.  
  437. [comment]----music player----[/comment]
  438. [border=transparent; height:18px; width:18px; padding:1px 0 0 0; box-sizing:border-box; position:absolute; top:0; right:0; display:flex; align-items:center; justify-content:center; border-radius:0 0 1px 1px; overflow:hidden;
  439.  
  440. /*remove display:none; if you want to add a song to your plot*/ display:none;
  441.  
  442. ][border=transparent; height:100%; width:100%; padding:0; position:absolute; top:0; left:0; z-index:1; background: var(--color-2); opacity:0.5;][/border][border=transparent; height:auto; width:auto; padding:0; color: var(--color-1); font-size:9.5px; position:relative; z-index:5; pointer-events:none;][fa]fas fa-music-alt[/fa][/border]
  443. [comment]----actual media player----[/comment]
  444. [border=transparent; height:100%; width:100%; padding:0; position:absolute; top:0; left:0; z-index:1; display:flex; align-items:center; justify-content:center; overflow:hidden; opacity:0.01%;][border=transparent; height:32px; width:32px; padding:0; position:relative;]
  445.  
  446. [comment]----soundcloud (replace the soundcloud link within media tag with your own)----[/comment]
  447. [border=transparent; height:80px; width:180px; padding:0; margin-top:-16px; margin-left:-14px; position:absolute; top:0; left:0;]
  448. [media=soundcloud]soundcloud link[/media]
  449. [/border]
  450.  
  451. [comment]----google drive (replace the google file code within media tag with your own)----[/comment]
  452. [border=transparent; height:500px; width:500px; margin-top:-170px; margin-left:-93px; padding:0px; /*remove this to use me, and add it to the other*/ display:none;]
  453. [media=googledrive]google file code[/MEDIA]
  454. [/border]
  455.  
  456. [/border][/border]
  457. [comment]----actual media player end----[/comment]
  458. [/border]
  459. [comment]----music player end----[/comment]
  460. [/border]
  461. [comment]----plot image end----[/comment]
  462.  
  463. [comment]----plot tags----[/comment]
  464. [border=transparent; height:18px; width:auto; max-width:78%; padding:0; display:flex; flex-flow:row nowrap; align-items:center; opacity:0.7; margin-top:8px;][border=transparent; height:auto; width:auto; padding:0; color: var(--color-1); flex-shrink:0; font-size:14px; margin:1px 8px 0 0; opacity:0.4;][fa]far fa-angle-right[/fa][/border][border=transparent; height:18px; flex:1; padding:0; overflow:hidden;][border=transparent; height:35px; width:100%; padding:0; overflow-x:scroll; overflow-y:hidden;][border=transparent; height:18px; width:auto; padding:0; display:flex; flex-flow:row nowrap; align-items:flex-start;][border=transparent; height:100%; width:0; padding:0; margin-right:-8px;][/border]
  465.  
  466. [comment]----copy this whole thing to add another plot tag----[/comment]
  467. [border=transparent; height:auto; width:fit-content; width:-moz-fit-content; min-width:fit-content; min-width:-moz-fit-content; padding:3px 8px; box-sizing:border-box; border:1px solid var(--color-1); flex-shrink:0; color: var(--color-1); font-family: var(--header); text-transform:uppercase; line-height:100%; font-size:8.5px; font-weight:bold; letter-spacing:1px; margin-left:8px;][comment]
  468.  
  469. ----* * * tag here----
  470.  
  471. [/comment]#funk[/border]
  472. [comment]----copy me too----[/comment]
  473.  
  474. [comment]----copy this whole thing to add another plot tag----[/comment]
  475. [border=transparent; height:auto; width:fit-content; width:-moz-fit-content; min-width:fit-content; min-width:-moz-fit-content; padding:3px 8px; box-sizing:border-box; border:1px solid var(--color-1); flex-shrink:0; color: var(--color-1); font-family: var(--header); text-transform:uppercase; line-height:100%; font-size:8.5px; font-weight:bold; letter-spacing:1px; margin-left:8px;][comment]
  476.  
  477. ----* * * tag here----
  478.  
  479. [/comment]#alt-pop[/border]
  480. [comment]----copy me too----[/comment]
  481.  
  482. [comment]----copy this whole thing to add another plot tag----[/comment]
  483. [border=transparent; height:auto; width:fit-content; width:-moz-fit-content; min-width:fit-content; min-width:-moz-fit-content; padding:3px 8px; box-sizing:border-box; border:1px solid var(--color-1); flex-shrink:0; color: var(--color-1); font-family: var(--header); text-transform:uppercase; line-height:100%; font-size:8.5px; font-weight:bold; letter-spacing:1px; margin-left:8px;][comment]
  484.  
  485. ----* * * tag here----
  486.  
  487. [/comment]#this scrolls[/border]
  488. [comment]----copy me too----[/comment]
  489.  
  490. [/border][/border][/border][/border]
  491. [comment]----plot tags end----[/comment]
  492. [/border]
  493. [comment]----plot header end----[/comment]
  494.  
  495. [comment]----plot contents----[/comment]
  496. [border=transparent; height:auto; width:100%; padding:0; font-size:12px; text-align:justify; line-height:16px; font-family: var(--body); color: var(--t-color);][comment]
  497.  
  498. ----* * * text starts here----
  499.  
  500. [/comment]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent tempor ultrices erat id lacinia. Aliquam vitae ultrices ante. Curabitur eu purus ut odio imperdiet blandit ut nec libero. In congue quam eu sodales congue. Mauris et accumsan lorem, quis tempus orci. Ut erat velit, blandit vel massa at, fermentum efficitur purus. Integer nec ante ac elit bibendum Maximus. Donec ullamcorper arcu sed magna tincidunt consectetur vel eu sem. Fusce nibh leo, commodo in efficitur at, semper quis nisl.
  501. [/border]
  502. [comment]----plot contents end----[/comment]
  503. [/border]
  504. [comment]----copy me too! (plot)----[/comment]
  505.  
  506. [comment]----copy this whole thing to make another plot----[/comment]
  507. [border=transparent; height:auto; width:100%; padding:0; display:flex; flex-flow:column nowrap; margin-top: var(--m-p);]
  508. [comment]----plot header----[/comment]
  509. [border=transparent; height:auto; width:100%; padding:0 0 10px 0; box-sizing:border-box; background: var(--bg-color); display:flex; flex-flow:column nowrap; align-items:flex-end; position:sticky; top:35px;]
  510. [comment]----plot image----[/comment]
  511. [border=transparent; min-height:58px; height:auto; max-height:68px; width:100%; padding:15px 10px; box-sizing:border-box; border-radius:1px;
  512.  
  513. /*put your plot image url here*/ background:url('https://64.media.tumblr.com/968389148c48668d57a39553a5eea4bf/6cdef68476f463e9-1d/s540x810/4ef25399ad9bf01342ddac5aa1d5f1ecf8d39234.pnj');
  514.  
  515. /*edit the following to adjust the cropping of the image*/ background-position:50% 50%;
  516.  
  517. background-size:cover; display:flex; align-items:center; justify-content:center; position:relative;][border=transparent; height:100%; width:100%; padding:0; background: var(--color-2);
  518.  
  519. /*adjust the opacity of colour background here*/ opacity:0.4;
  520.  
  521. position:absolute; top:0; left:0; border-radius:1px;][/border][border=transparent;
  522.  
  523. /*adjust font size here if it's too big!*/ --fs: 20px;
  524.  
  525. height:auto; max-height:45px; overflow:hidden; width:100%; padding:0; color: var(--color-1); font-size: var(--fs); font-weight:bold; -webkit-text-stroke:0.5px var(--color-1); font-family: var(--header); text-transform:uppercase; line-height:calc(var(--fs) + 2px); position:relative; z-index:2; text-align:center; letter-spacing:2px;][comment]
  526.  
  527. ----* * * plot title here (max two lines)----
  528.  
  529. [/comment]blue flame[/border]
  530.  
  531. [comment]----music player----[/comment]
  532. [border=transparent; height:18px; width:18px; padding:1px 0 0 0; box-sizing:border-box; position:absolute; top:0; right:0; display:flex; align-items:center; justify-content:center; border-radius:0 0 1px 1px; overflow:hidden;
  533.  
  534. /*remove display:none; if you want to add a song to your plot*/
  535.  
  536. ][border=transparent; height:100%; width:100%; padding:0; position:absolute; top:0; left:0; z-index:1; background: var(--color-2); opacity:0.5;][/border][border=transparent; height:auto; width:auto; padding:0; color: var(--color-1); font-size:9.5px; position:relative; z-index:5; pointer-events:none;][fa]fas fa-music-alt[/fa][/border]
  537. [comment]----actual media player----[/comment]
  538. [border=transparent; height:100%; width:100%; padding:0; position:absolute; top:0; left:0; z-index:1; display:flex; align-items:center; justify-content:center; overflow:hidden; opacity:0.01%;][border=transparent; height:32px; width:32px; padding:0; position:relative;]
  539.  
  540. [comment]----soundcloud (replace the soundcloud link within media tag with your own)----[/comment]
  541. [border=transparent; height:80px; width:180px; padding:0; margin-top:-16px; margin-left:-14px; position:absolute; top:0; left:0; /*remove this to use me, and add it to the other*/ display:none;]
  542. [media=soundcloud]soundcloud link[/media]
  543. [/border]
  544.  
  545. [comment]----google drive (replace the google file code within media tag with your own)----[/comment]
  546. [border=transparent; height:500px; width:500px; margin-top:-170px; margin-left:-93px; padding:0px;]
  547. [media=googledrive]1aw4rab_7NBp4ZNiN91sECNwuqjpZc0lq[/MEDIA]
  548. [/border]
  549.  
  550. [/border][/border]
  551. [comment]----actual media player end----[/comment]
  552. [/border]
  553. [comment]----music player end----[/comment]
  554. [/border]
  555. [comment]----plot image end----[/comment]
  556.  
  557. [comment]----plot tags----[/comment]
  558. [border=transparent; height:18px; width:auto; max-width:78%; padding:0; display:flex; flex-flow:row nowrap; align-items:center; opacity:0.7; margin-top:8px;][border=transparent; height:auto; width:auto; padding:0; color: var(--color-1); flex-shrink:0; font-size:14px; margin:1px 8px 0 0; opacity:0.4;][fa]far fa-angle-right[/fa][/border][border=transparent; height:18px; flex:1; padding:0; overflow:hidden;][border=transparent; height:35px; width:100%; padding:0; overflow-x:scroll; overflow-y:hidden;][border=transparent; height:18px; width:auto; padding:0; display:flex; flex-flow:row nowrap; align-items:flex-start;][border=transparent; height:100%; width:0; padding:0; margin-right:-8px;][/border]
  559.  
  560. [comment]----copy this whole thing to add another plot tag----[/comment]
  561. [border=transparent; height:auto; width:fit-content; width:-moz-fit-content; min-width:fit-content; min-width:-moz-fit-content; padding:3px 8px; box-sizing:border-box; border:1px solid var(--color-1); flex-shrink:0; color: var(--color-1); font-family: var(--header); text-transform:uppercase; line-height:100%; font-size:8.5px; font-weight:bold; letter-spacing:1px; margin-left:8px;][comment]
  562.  
  563. ----* * * tag here----
  564.  
  565. [/comment]#funk[/border]
  566. [comment]----copy me too!----[/comment]
  567.  
  568. [comment]----copy this whole thing to add another plot tag----[/comment]
  569. [border=transparent; height:auto; width:fit-content; width:-moz-fit-content; min-width:fit-content; min-width:-moz-fit-content; padding:3px 8px; box-sizing:border-box; border:1px solid var(--color-1); flex-shrink:0; color: var(--color-1); font-family: var(--header); text-transform:uppercase; line-height:100%; font-size:8.5px; font-weight:bold; letter-spacing:1px; margin-left:8px;][comment]
  570.  
  571. ----* * * tag here----
  572.  
  573. [/comment]#alt-pop[/border]
  574. [comment]----copy me too----[/comment]
  575.  
  576. [comment]----copy this whole thing to add another plot tag----[/comment]
  577. [border=transparent; height:auto; width:fit-content; width:-moz-fit-content; min-width:fit-content; min-width:-moz-fit-content; padding:3px 8px; box-sizing:border-box; border:1px solid var(--color-1); flex-shrink:0; color: var(--color-1); font-family: var(--header); text-transform:uppercase; line-height:100%; font-size:8.5px; font-weight:bold; letter-spacing:1px; margin-left:8px;][comment]
  578.  
  579. ----* * * tag here----
  580.  
  581. [/comment]#this scrolls[/border]
  582. [comment]----copy me too----[/comment]
  583.  
  584. [/border][/border][/border][/border]
  585. [comment]----plot tags end----[/comment]
  586. [/border]
  587. [comment]----plot header end----[/comment]
  588.  
  589. [comment]----plot contents----[/comment]
  590. [border=transparent; height:auto; width:100%; padding:0; font-size:12px; text-align:justify; line-height:16px; font-family: var(--body); color: var(--t-color);][comment]
  591.  
  592. ----* * * text starts here----
  593.  
  594. [/comment]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent tempor ultrices erat id lacinia. Aliquam vitae ultrices ante. Curabitur eu purus ut odio imperdiet blandit ut nec libero. In congue quam eu sodales congue. Mauris et accumsan lorem, quis tempus orci. Ut erat velit, blandit vel massa at, fermentum efficitur purus. Integer nec ante ac elit bibendum Maximus. Donec ullamcorper arcu sed magna tincidunt consectetur vel eu sem. Fusce nibh leo, commodo in efficitur at, semper quis nisl.
  595. [/border]
  596. [comment]----plot contents end----[/comment]
  597. [/border]
  598. [comment]----copy me too! (plot)----[/comment]
  599.  
  600. [comment]----copy this whole thing to make another plot----[/comment]
  601. [border=transparent; height:auto; width:100%; padding:0; display:flex; flex-flow:column nowrap; margin-top: var(--m-p);]
  602. [comment]----plot header----[/comment]
  603. [border=transparent; height:auto; width:100%; padding:0 0 10px 0; box-sizing:border-box; background: var(--bg-color); display:flex; flex-flow:column nowrap; align-items:flex-end; position:sticky; top:35px;]
  604. [comment]----plot image----[/comment]
  605. [border=transparent; min-height:58px; height:auto; max-height:68px; width:100%; padding:15px 10px; box-sizing:border-box; border-radius:1px;
  606.  
  607. /*put your plot image url here*/ background:url('https://64.media.tumblr.com/3128e1369ac968a6399a934d402aa2f9/17e277a5b1e21348-87/s1280x1920/be43197160f2e2780f3c16dc76eaab00e1fec71a.pnj');
  608.  
  609. /*edit the following to adjust the cropping of the image*/ background-position:50% 50%;
  610.  
  611. background-size:cover; display:flex; align-items:center; justify-content:center; position:relative;][border=transparent; height:100%; width:100%; padding:0; background: var(--color-2);
  612.  
  613. /*adjust the opacity of colour background here*/ opacity:0.2;
  614.  
  615. position:absolute; top:0; left:0; border-radius:1px;][/border][border=transparent;
  616.  
  617. /*adjust font size here if it's too big!*/ --fs: 16px;
  618.  
  619. height:auto; max-height:45px; overflow:hidden; width:100%; padding:0; color: var(--color-1); font-size: var(--fs); font-weight:bold; -webkit-text-stroke:0.5px var(--color-1); font-family: var(--header); text-transform:uppercase; line-height:calc(var(--fs) + 2px); position:relative; z-index:2; text-align:center; letter-spacing:2px;][comment]
  620.  
  621. ----* * * plot title here (max two lines)----
  622.  
  623. [/comment]the great mermaid[/border]
  624.  
  625. [comment]----music player----[/comment]
  626. [border=transparent; height:18px; width:18px; padding:1px 0 0 0; box-sizing:border-box; position:absolute; top:0; right:0; display:flex; align-items:center; justify-content:center; border-radius:0 0 1px 1px; overflow:hidden;
  627.  
  628. /*remove display:none; if you want to add a song to your plot*/ display:none;
  629.  
  630. ][border=transparent; height:100%; width:100%; padding:0; position:absolute; top:0; left:0; z-index:1; background: var(--color-2); opacity:0.5;][/border][border=transparent; height:auto; width:auto; padding:0; color: var(--color-1); font-size:9.5px; position:relative; z-index:5; pointer-events:none;][fa]fas fa-music-alt[/fa][/border]
  631. [comment]----actual media player----[/comment]
  632. [border=transparent; height:100%; width:100%; padding:0; position:absolute; top:0; left:0; z-index:1; display:flex; align-items:center; justify-content:center; overflow:hidden; opacity:0.01%;][border=transparent; height:32px; width:32px; padding:0; position:relative;]
  633.  
  634. [comment]----soundcloud (replace the soundcloud link within media tag with your own)----[/comment]
  635. [border=transparent; height:80px; width:180px; padding:0; margin-top:-16px; margin-left:-14px; position:absolute; top:0; left:0;]
  636. [media=soundcloud]soundcloud link[/media]
  637. [/border]
  638.  
  639. [comment]----google drive (replace the google file code within media tag with your own)----[/comment]
  640. [border=transparent; height:500px; width:500px; margin-top:-170px; margin-left:-93px; padding:0px; /*remove this to use me, and add it to the other*/ display:none;]
  641. [media=googledrive]google file code[/MEDIA]
  642. [/border]
  643.  
  644. [/border][/border]
  645. [comment]----actual media player end----[/comment]
  646. [/border]
  647. [comment]----music player end----[/comment]
  648. [/border]
  649. [comment]----plot image end----[/comment]
  650.  
  651. [comment]----plot tags----[/comment]
  652. [border=transparent; height:18px; width:auto; max-width:78%; padding:0; display:flex; flex-flow:row nowrap; align-items:center; opacity:0.7; margin-top:8px;][border=transparent; height:auto; width:auto; padding:0; color: var(--color-1); flex-shrink:0; font-size:14px; margin:1px 8px 0 0; opacity:0.4;][fa]far fa-angle-right[/fa][/border][border=transparent; height:18px; flex:1; padding:0; overflow:hidden;][border=transparent; height:35px; width:100%; padding:0; overflow-x:scroll; overflow-y:hidden;][border=transparent; height:18px; width:auto; padding:0; display:flex; flex-flow:row nowrap; align-items:flex-start;][border=transparent; height:100%; width:0; padding:0; margin-right:-8px;][/border]
  653.  
  654. [comment]----copy this whole thing to add another plot tag----[/comment]
  655. [border=transparent; height:auto; width:fit-content; width:-moz-fit-content; min-width:fit-content; min-width:-moz-fit-content; padding:3px 8px; box-sizing:border-box; border:1px solid var(--color-1); flex-shrink:0; color: var(--color-1); font-family: var(--header); text-transform:uppercase; line-height:100%; font-size:8.5px; font-weight:bold; letter-spacing:1px; margin-left:8px;][comment]
  656.  
  657. ----* * * tag here----
  658.  
  659. [/comment]#funk[/border]
  660. [comment]----copy me too!----[/comment]
  661.  
  662. [comment]----copy this whole thing to add another plot tag----[/comment]
  663. [border=transparent; height:auto; width:fit-content; width:-moz-fit-content; min-width:fit-content; min-width:-moz-fit-content; padding:3px 8px; box-sizing:border-box; border:1px solid var(--color-1); flex-shrink:0; color: var(--color-1); font-family: var(--header); text-transform:uppercase; line-height:100%; font-size:8.5px; font-weight:bold; letter-spacing:1px; margin-left:8px;][comment]
  664.  
  665. ----* * * tag here----
  666.  
  667. [/comment]#alt-pop[/border]
  668. [comment]----copy me too----[/comment]
  669.  
  670. [comment]----copy this whole thing to add another plot tag----[/comment]
  671. [border=transparent; height:auto; width:fit-content; width:-moz-fit-content; min-width:fit-content; min-width:-moz-fit-content; padding:3px 8px; box-sizing:border-box; border:1px solid var(--color-1); flex-shrink:0; color: var(--color-1); font-family: var(--header); text-transform:uppercase; line-height:100%; font-size:8.5px; font-weight:bold; letter-spacing:1px; margin-left:8px;][comment]
  672.  
  673. ----* * * tag here----
  674.  
  675. [/comment]#this scrolls[/border]
  676. [comment]----copy me too----[/comment]
  677.  
  678. [/border][/border][/border][/border]
  679. [comment]----plot tags end----[/comment]
  680. [/border]
  681. [comment]----plot header end----[/comment]
  682.  
  683. [comment]----plot contents----[/comment]
  684. [border=transparent; height:auto; width:100%; padding:0; font-size:12px; text-align:justify; line-height:16px; font-family: var(--body); color: var(--t-color);][comment]
  685.  
  686. ----* * * text starts here----
  687.  
  688. [/comment]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent tempor ultrices erat id lacinia. Aliquam vitae ultrices ante. Curabitur eu purus ut odio imperdiet blandit ut nec libero. In congue quam eu sodales congue. Mauris et accumsan lorem, quis tempus orci. Ut erat velit, blandit vel massa at, fermentum efficitur purus. Integer nec ante ac elit bibendum Maximus. Donec ullamcorper arcu sed magna tincidunt consectetur vel eu sem. Fusce nibh leo, commodo in efficitur at, semper quis nisl.
  689. [/border]
  690. [comment]----plot contents end----[/comment]
  691. [/border]
  692. [comment]----copy me too! (plot)----[/comment]
  693.  
  694. [/border]
  695. [comment]----section contents end----[/comment]
  696. [/border]
  697. [comment]----copy me too! (section)----[/comment]
  698.  
  699. [/border][/border][/border][/border][/tab]
  700. [comment]----plots tab end----[/comment]
  701.  
  702.  
  703.  
  704.  
  705. [comment]----characters tab----[/comment]
  706. [tab=.][border=transparent; height:100%; width:100%; padding:0; display:flex; flex-flow:row wrap; align-items:center; justify-content:center; position:absolute; bottom:0; right:0; pointer-events:none;][border=transparent; height:clamp(190px, -50px + 43vw, 240px); flex:43; min-width:170px; max-width:200px; padding:0; margin: var(--m); ][/border][border=transparent; height:304px; flex:57; min-width:230px; padding:0; box-sizing:border-box; margin: var(--m); margin-right:clamp(2px, var(--m) + 50px - 9vw, var(--m)); overflow:hidden; pointer-events:auto; letter-spacing:0;][border=transparent; height:100%; width:200%; padding:0; overflow-y:scroll;][border=transparent; height:auto; width:50%; padding:0; box-sizing:border-box; --m-t: 23px;][border=transparent; height:0; width:100%; padding:0; margin-bottom:calc(var(--m-t) * -1);][/border]
  707.  
  708. [comment]----copy this whole thing to make a new section (accordion)----[/comment]
  709. [border=transparent; height:auto; width:100%; padding:0; display:flex; flex-flow:column nowrap; margin-top: var(--m-t);]
  710. [comment]----title----[/comment]
  711. [border=transparent; height:auto; width:100%; padding:1px 5px 13px 0; box-sizing:border-box; background: var(--bg-color); display:flex; flex-flow:row nowrap; align-items:center; justify-content:flex-end; position:sticky; top:0; z-index:5;][border=transparent; height:auto; width:auto; padding:0; color: var(--color-1); font-size:17px; flex-shrink:0; margin-right:14px;][comment]
  712.  
  713. ----* * * title icon here----
  714.  
  715. [/comment][fa]fal fa-star-christmas[/fa][/border]
  716. [border=transparent; height:auto; width;auto; padding:0; color: var(--color-1); font-family: var(--header); letter-spacing:2px; font-weight:bold; -webkit-text-stroke:0.5px var(--color-1); font-size:22px; line-height:21px; text-align:right; flex-shrink:0; letter-spacing:1px; text-transform:uppercase; margin-right:-5px;][comment]
  717.  
  718. ----* * * section title here----
  719.  
  720. [/comment]muses[/border]
  721. [/border]
  722. [comment]----title end----[/comment]
  723.  
  724. [comment]----section contents----[/comment]
  725. [border=transparent; height:auto; width:100%; padding:0 0.5px 0 0; box-sizing:border-box; display:flex; flex-flow: column nowrap;][border=transparent; height:0; width:100%; padding:0; margin-bottom:-16px;][/border][border=transparent; height:auto; width:auto; padding:0; position:relative; font-size:0; visibility:hidden;][accordion=100%]
  726.  
  727. [comment]----copy this whole thing to add another character----[/comment]
  728. {slide=[border=transparent; height:auto; width:auto; padding:0; display:flex; flex-flow:row-reverse nowrap; align-items:center; visibility:visible; margin:8px -7px 0 -7px; font-variant:normal; font-weight:normal; position:relative;]
  729. [comment]----character image----[/comment]
  730. [border=transparent; height:85px; width:85px; padding:0; position:relative; flex-shrink:0; margin-left:3px;
  731.  
  732. /*add display:none; after this if you don't want character image*/][border=transparent; height:35px; width:35px; padding:0; background: var(--color-1); position:absolute; bottom:0; right:0; z-index:1;][/border][border=transparent; height:calc(100% - 5px); width:calc(100% - 5px); padding:0; margin:0 5px 5px 0; border-radius:0.5px;
  733.  
  734. /*put your character image url here*/ background: url('https://staticg.sportskeeda.com/editor/2022/04/e9ddc-16490123188499-1920.jpg');
  735.  
  736. /*edit the following to adjust the cropping of the image*/ background-position:50% 50%;
  737.  
  738. background-size:cover; position:relative; z-index:2;][border=transparent; height:auto; width:auto; padding:3px 5px 2px 5px; box-sizing:border-box; position:absolute; bottom:0; left:0; opacity:0.6;][border=transparent; height:100%; width:100%; padding:0; background: var(--color-2); opacity:0.8; position:absolute; z-index:1; top:0; left:0;][/border][border=transparent; height:auto; width:auto; padding:0; position:relative; z-index:2; color: var(--color-1); font-size:7.5px; text-transform:uppercase; font-family: var(--header); line-height:100%; letter-spacing:1px;]click![/border][/border][/border][/border]
  739.  
  740. [comment]----character info----[/comment]
  741. [border=transparent; height:auto; flex:1; max-width:calc(100% - 90px); padding:0; box-sizing:border-box; display:flex; flex-flow:column nowrap; align-items:flex-end;]
  742. [comment]----character name----[/comment]
  743. [border=transparent; height:auto; width:100%; max-width:100%; padding:0 10px 0 0; box-sizing:border-box; display:flex; flex-flow:row nowrap; justify-content:flex-end; align-items:center;][border=transparent; height:auto; width:auto; padding:0; flex-shrink:0; margin:1px 12px 0 0; font-size:11px; visibility:hidden; opacity:0.7;][comment]
  744.  
  745. ----* * * link to character's main post/sheet here----
  746.  
  747. [/comment][url='xx'][comment]
  748. [/comment][border=transparent; padding:0; color: var(--color-1); text-decoration:none; visibility:visible;][fa]far fa-link[/fa][/border][/url][/border][border=transparent; height:auto; max-height:22px; width:auto; max-width:110px; overflow:hidden; padding:0; color: var(--color-1); font-family: var(--header); font-weight:bold;
  749.  
  750. /*adjust font size here*/ --fs: 20px;
  751.  
  752. font-size: var(--fs); letter-spacing:2px; line-height: calc(var(--fs) + 2px); text-transform:uppercase; text-align:right; -webkit-text-stroke:0.3px var(--color-1); white-space:nowrap; text-overflow:ellipsis;][comment]
  753.  
  754. ----* * * character name here----
  755.  
  756. [/comment]sakura[/border]
  757. [/border]
  758. [comment]----character name end----[/comment]
  759.  
  760. [comment]----character tags----[/comment]
  761. [border=transparent; height:40px; width:100%; padding:0; overflow:hidden; opacity:0.4; margin-top:6px;][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; justify-content:flex-end; --m-t:2px 4px;]
  762.  
  763. [comment]----copy this whole thing to add another plot tag----[/comment]
  764. [border=transparent; height:auto; width:fit-content; width:-moz-fit-content; min-width:fit-content; min-width:-moz-fit-content; padding:3px 5px; box-sizing:border-box; border:1px solid var(--color-1); flex-shrink:0; color: var(--color-1); font-family: var(--header); text-transform:uppercase; line-height:100%; font-size:8px; font-weight:bold; letter-spacing:1px; margin: var(--m-t);][comment]
  765.  
  766. ----* * * tag here----
  767.  
  768. [/comment]#pair[/border]
  769. [comment]----copy me too----[/comment]
  770.  
  771. [comment]----copy this whole thing to add another plot tag----[/comment]
  772. [border=transparent; height:auto; width:fit-content; width:-moz-fit-content; min-width:fit-content; min-width:-moz-fit-content; padding:3px 5px; box-sizing:border-box; border:1px solid var(--color-1); flex-shrink:0; color: var(--color-1); font-family: var(--header); text-transform:uppercase; line-height:100%; font-size:8px; font-weight:bold; letter-spacing:1px; margin: var(--m-t);][comment]
  773.  
  774. ----* * * tag here----
  775.  
  776. [/comment]#genre[/border]
  777. [comment]----copy me too----[/comment]
  778.  
  779. [comment]----copy this whole thing to add another plot tag----[/comment]
  780. [border=transparent; height:auto; width:fit-content; width:-moz-fit-content; min-width:fit-content; min-width:-moz-fit-content; padding:3px 5px; box-sizing:border-box; border:1px solid var(--color-1); flex-shrink:0; color: var(--color-1); font-family: var(--header); text-transform:uppercase; line-height:100%; font-size:8px; font-weight:bold; letter-spacing:1px; margin: var(--m-t);][comment]
  781.  
  782. ----* * * tag here----
  783.  
  784. [/comment]#this scrolls[/border]
  785. [comment]----copy me too----[/comment]
  786.  
  787. [/border][/border][/border]
  788. [comment]----character tags end----[/comment]
  789. [/border]
  790. [comment]----character info end----[/comment]
  791. [/border]}
  792. [comment]----character blurb----[/comment]
  793. [border=transparent; height:auto; width:100%; padding:0; visibility:visible; display:flex; flex-flow:row-reverse nowrap;][border=transparent; height:auto; width:5px; padding:0; border-left:2px solid var(--color-1); box-sizing:border-box; flex-shrink:0;][/border][border=transparent; height:auto; max-height:80px; flex:1; padding:0; overflow:hidden; display:flex; flex-direction:column;][border=transparent; height:100%; width:200%; padding:0; overflow-y:scroll;][border=transparent; height:auto; width:50%; padding:0 4px 0 0; box-sizing:border-box; color: var(--t-color); font-size:12px; text-align:justify; font-family: var(--body); line-height:16px;][comment]
  794.  
  795. ----* * * text starts here----
  796.  
  797. [/comment]A short description about your character goes here, and it scrolls too! Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent tempor ultrices erat id lacinia. Aliquam vitae ultrices ante. Curabitur eu purus ut odio imperdiet blandit ut nec libero. In congue quam eu sodales congue.
  798. [/border][/border][/border][/border]{/slide}
  799. [comment]----copy me too! (character)----[/comment]
  800.  
  801. [comment]----copy this whole thing to add another character----[/comment]
  802. {slide=[border=transparent; height:auto; width:auto; padding:0; display:flex; flex-flow:row-reverse nowrap; align-items:center; visibility:visible; margin:8px -7px 0 -7px; font-variant:normal; font-weight:normal; position:relative;]
  803. [comment]----character image----[/comment]
  804. [border=transparent; height:85px; width:85px; padding:0; position:relative; flex-shrink:0; margin-left:3px;
  805.  
  806. /*add display:none; after this if you don't want character image*/][border=transparent; height:35px; width:35px; padding:0; background: var(--color-1); position:absolute; bottom:0; right:0; z-index:1;][/border][border=transparent; height:calc(100% - 5px); width:calc(100% - 5px); padding:0; margin:0 5px 5px 0; border-radius:0.5px;
  807.  
  808. /*put your character image url here*/ background: url('https://i.imgur.com/MWaM5Av.png');
  809.  
  810. /*edit the following to adjust the cropping of the image*/ background-position:50% 50%;
  811.  
  812. background-size:cover; position:relative; z-index:2;][border=transparent; height:auto; width:auto; padding:3px 5px 2px 5px; box-sizing:border-box; position:absolute; bottom:0; left:0; opacity:0.6;][border=transparent; height:100%; width:100%; padding:0; background: var(--color-2); opacity:0.8; position:absolute; z-index:1; top:0; left:0;][/border][border=transparent; height:auto; width:auto; padding:0; position:relative; z-index:2; color: var(--color-1); font-size:7.5px; text-transform:uppercase; font-family: var(--header); line-height:100%; letter-spacing:1px;]click![/border][/border][/border][/border]
  813.  
  814. [comment]----character info----[/comment]
  815. [border=transparent; height:auto; flex:1; max-width:calc(100% - 90px); padding:0; box-sizing:border-box; display:flex; flex-flow:column nowrap; align-items:flex-end;]
  816. [comment]----character name----[/comment]
  817. [border=transparent; height:auto; width:100%; max-width:100%; padding:0 10px 0 0; box-sizing:border-box; display:flex; flex-flow:row nowrap; justify-content:flex-end; align-items:center;][border=transparent; height:auto; width:auto; padding:0; flex-shrink:0; margin:1px 12px 0 0; font-size:11px; visibility:hidden; opacity:0.7;][comment]
  818.  
  819. ----* * * link to character's main post/sheet here----
  820.  
  821. [/comment][url='xx'][comment]
  822. [/comment][border=transparent; padding:0; color: var(--color-1); text-decoration:none; visibility:visible;][fa]far fa-link[/fa][/border][/url][/border][border=transparent; height:auto; max-height:22px; width:auto; max-width:110px; overflow:hidden; padding:0; color: var(--color-1); font-family: var(--header); font-weight:bold;
  823.  
  824. /*adjust font size here*/ --fs: 20px;
  825.  
  826. font-size: var(--fs); letter-spacing:2px; line-height: calc(var(--fs) + 2px); text-transform:uppercase; text-align:right; -webkit-text-stroke:0.3px var(--color-1); white-space:nowrap; text-overflow:ellipsis;][comment]
  827.  
  828. ----* * * character name here----
  829.  
  830. [/comment]kazuha[/border]
  831. [/border]
  832. [comment]----character name end----[/comment]
  833.  
  834. [comment]----character tags----[/comment]
  835. [border=transparent; height:40px; width:100%; padding:0; overflow:hidden; opacity:0.4; margin-top:6px;][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; justify-content:flex-end; --m-t:2px 4px;]
  836.  
  837. [comment]----copy this whole thing to add another plot tag----[/comment]
  838. [border=transparent; height:auto; width:fit-content; width:-moz-fit-content; min-width:fit-content; min-width:-moz-fit-content; padding:3px 5px; box-sizing:border-box; border:1px solid var(--color-1); flex-shrink:0; color: var(--color-1); font-family: var(--header); text-transform:uppercase; line-height:100%; font-size:8px; font-weight:bold; letter-spacing:1px; margin: var(--m-t);][comment]
  839.  
  840. ----* * * tag here----
  841.  
  842. [/comment]#pair[/border]
  843. [comment]----copy me too----[/comment]
  844.  
  845. [comment]----copy this whole thing to add another plot tag----[/comment]
  846. [border=transparent; height:auto; width:fit-content; width:-moz-fit-content; min-width:fit-content; min-width:-moz-fit-content; padding:3px 5px; box-sizing:border-box; border:1px solid var(--color-1); flex-shrink:0; color: var(--color-1); font-family: var(--header); text-transform:uppercase; line-height:100%; font-size:8px; font-weight:bold; letter-spacing:1px; margin: var(--m-t);][comment]
  847.  
  848. ----* * * tag here----
  849.  
  850. [/comment]#genre[/border]
  851. [comment]----copy me too----[/comment]
  852.  
  853. [comment]----copy this whole thing to add another plot tag----[/comment]
  854. [border=transparent; height:auto; width:fit-content; width:-moz-fit-content; min-width:fit-content; min-width:-moz-fit-content; padding:3px 5px; box-sizing:border-box; border:1px solid var(--color-1); flex-shrink:0; color: var(--color-1); font-family: var(--header); text-transform:uppercase; line-height:100%; font-size:8px; font-weight:bold; letter-spacing:1px; margin: var(--m-t);][comment]
  855.  
  856. ----* * * tag here----
  857.  
  858. [/comment]#this scrolls[/border]
  859. [comment]----copy me too----[/comment]
  860.  
  861. [/border][/border][/border]
  862. [comment]----character tags end----[/comment]
  863. [/border]
  864. [comment]----character info end----[/comment]
  865. [/border]}
  866. [comment]----character blurb----[/comment]
  867. [border=transparent; height:auto; width:100%; padding:0; visibility:visible; display:flex; flex-flow:row-reverse nowrap;][border=transparent; height:auto; width:5px; padding:0; border-left:2px solid var(--color-1); box-sizing:border-box; flex-shrink:0;][/border][border=transparent; height:auto; max-height:80px; flex:1; padding:0; overflow:hidden; display:flex; flex-direction:column;][border=transparent; height:100%; width:200%; padding:0; overflow-y:scroll;][border=transparent; height:auto; width:50%; padding:0 4px 0 0; box-sizing:border-box; color: var(--t-color); font-size:12px; text-align:justify; font-family: var(--body); line-height:16px;][comment]
  868.  
  869. ----* * * text starts here----
  870.  
  871. [/comment]A short description about your character goes here, and it scrolls too! Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent tempor ultrices erat id lacinia. Aliquam vitae ultrices ante. Curabitur eu purus ut odio imperdiet blandit ut nec libero. In congue quam eu sodales congue.
  872. [/border][/border][/border][/border]{/slide}
  873. [comment]----copy me too! (character)----[/comment]
  874.  
  875. [comment]----copy this whole thing to add another character----[/comment]
  876. {slide=[border=transparent; height:auto; width:auto; padding:0; display:flex; flex-flow:row-reverse nowrap; align-items:center; visibility:visible; margin:8px -7px 0 -7px; font-variant:normal; font-weight:normal; position:relative;]
  877. [comment]----character image----[/comment]
  878. [border=transparent; height:85px; width:85px; padding:0; position:relative; flex-shrink:0; margin-left:3px;
  879.  
  880. /*add display:none; after this if you don't want character image*/][border=transparent; height:35px; width:35px; padding:0; background: var(--color-1); position:absolute; bottom:0; right:0; z-index:1;][/border][border=transparent; height:calc(100% - 5px); width:calc(100% - 5px); padding:0; margin:0 5px 5px 0; border-radius:0.5px;
  881.  
  882. /*put your character image url here*/ background: url('https://media.karousell.com/media/photos/products/2022/5/2/wtblf_lesserafim_yunjin_pob_1651508767_3f1f1cf6.jpg');
  883.  
  884. /*edit the following to adjust the cropping of the image*/ background-position:50% 50%;
  885.  
  886. background-size:cover; position:relative; z-index:2;][border=transparent; height:auto; width:auto; padding:3px 5px 2px 5px; box-sizing:border-box; position:absolute; bottom:0; left:0; opacity:0.6;][border=transparent; height:100%; width:100%; padding:0; background: var(--color-2); opacity:0.8; position:absolute; z-index:1; top:0; left:0;][/border][border=transparent; height:auto; width:auto; padding:0; position:relative; z-index:2; color: var(--color-1); font-size:7.5px; text-transform:uppercase; font-family: var(--header); line-height:100%; letter-spacing:1px;]click![/border][/border][/border][/border]
  887.  
  888. [comment]----character info----[/comment]
  889. [border=transparent; height:auto; flex:1; max-width:calc(100% - 90px); padding:0; box-sizing:border-box; display:flex; flex-flow:column nowrap; align-items:flex-end;]
  890. [comment]----character name----[/comment]
  891. [border=transparent; height:auto; width:100%; max-width:100%; padding:0 10px 0 0; box-sizing:border-box; display:flex; flex-flow:row nowrap; justify-content:flex-end; align-items:center;][border=transparent; height:auto; width:auto; padding:0; flex-shrink:0; margin:1px 12px 0 0; font-size:11px; visibility:hidden; opacity:0.7;][comment]
  892.  
  893. ----* * * link to character's main post/sheet here----
  894.  
  895. [/comment][url='xx'][comment]
  896. [/comment][border=transparent; padding:0; color: var(--color-1); text-decoration:none; visibility:visible;][fa]far fa-link[/fa][/border][/url][/border][border=transparent; height:auto; max-height:22px; width:auto; max-width:110px; overflow:hidden; padding:0; color: var(--color-1); font-family: var(--header); font-weight:bold;
  897.  
  898. /*adjust font size here*/ --fs: 20px;
  899.  
  900. font-size: var(--fs); letter-spacing:2px; line-height: calc(var(--fs) + 2px); text-transform:uppercase; text-align:right; -webkit-text-stroke:0.3px var(--color-1); white-space:nowrap; text-overflow:ellipsis;][comment]
  901.  
  902. ----* * * character name here----
  903.  
  904. [/comment]yunjin[/border]
  905. [/border]
  906. [comment]----character name end----[/comment]
  907.  
  908. [comment]----character tags----[/comment]
  909. [border=transparent; height:40px; width:100%; padding:0; overflow:hidden; opacity:0.4; margin-top:6px;][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; justify-content:flex-end; --m-t:2px 4px;]
  910.  
  911. [comment]----copy this whole thing to add another plot tag----[/comment]
  912. [border=transparent; height:auto; width:fit-content; width:-moz-fit-content; min-width:fit-content; min-width:-moz-fit-content; padding:3px 5px; box-sizing:border-box; border:1px solid var(--color-1); flex-shrink:0; color: var(--color-1); font-family: var(--header); text-transform:uppercase; line-height:100%; font-size:8px; font-weight:bold; letter-spacing:1px; margin: var(--m-t);][comment]
  913.  
  914. ----* * * tag here----
  915.  
  916. [/comment]#pair[/border]
  917. [comment]----copy me too----[/comment]
  918.  
  919. [comment]----copy this whole thing to add another plot tag----[/comment]
  920. [border=transparent; height:auto; width:fit-content; width:-moz-fit-content; min-width:fit-content; min-width:-moz-fit-content; padding:3px 5px; box-sizing:border-box; border:1px solid var(--color-1); flex-shrink:0; color: var(--color-1); font-family: var(--header); text-transform:uppercase; line-height:100%; font-size:8px; font-weight:bold; letter-spacing:1px; margin: var(--m-t);][comment]
  921.  
  922. ----* * * tag here----
  923.  
  924. [/comment]#genre[/border]
  925. [comment]----copy me too----[/comment]
  926.  
  927. [comment]----copy this whole thing to add another plot tag----[/comment]
  928. [border=transparent; height:auto; width:fit-content; width:-moz-fit-content; min-width:fit-content; min-width:-moz-fit-content; padding:3px 5px; box-sizing:border-box; border:1px solid var(--color-1); flex-shrink:0; color: var(--color-1); font-family: var(--header); text-transform:uppercase; line-height:100%; font-size:8px; font-weight:bold; letter-spacing:1px; margin: var(--m-t);][comment]
  929.  
  930. ----* * * tag here----
  931.  
  932. [/comment]#this scrolls[/border]
  933. [comment]----copy me too----[/comment]
  934.  
  935. [/border][/border][/border]
  936. [comment]----character tags end----[/comment]
  937. [/border]
  938. [comment]----character info end----[/comment]
  939. [/border]}
  940. [comment]----character blurb----[/comment]
  941. [border=transparent; height:auto; width:100%; padding:0; margin:0; visibility:visible; display:flex; flex-flow:row-reverse nowrap;][border=transparent; height:auto; width:5px; padding:0; border-left:2px solid var(--color-1); box-sizing:border-box; flex-shrink:0;][/border][border=transparent; height:auto; max-height:80px; flex:1; padding:0; overflow:hidden; display:flex; flex-direction:column;][border=transparent; height:100%; width:200%; padding:0; overflow-y:scroll;][border=transparent; height:auto; width:50%; padding:0 4px 0 0; box-sizing:border-box; color: var(--t-color); font-size:12px; text-align:justify; font-family: var(--body); line-height:16px;][comment]
  942.  
  943. ----* * * text starts here----
  944.  
  945. [/comment]A short description about your character goes here, and it scrolls too! Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent tempor ultrices erat id lacinia. Aliquam vitae ultrices ante. Curabitur eu purus ut odio imperdiet blandit ut nec libero. In congue quam eu sodales congue.
  946. [/border][/border][/border][/border]{/slide}
  947. [comment]----copy me too! (character)----[/comment]
  948.  
  949. [/accordion][/border]
  950. [comment]----section contents end----[/comment]
  951. [/border][/border]
  952. [comment]----copy me too! (section)----[/comment]
  953.  
  954. [/border][/border][/border][/border][/tab]
  955. [comment]----characters tab end----[/comment]
Advertisement
RAW Paste Data Copied
Advertisement