API tools faq
paste
ooksie

ennui (night ver.)

ooksie
May 20th, 2022 (edited)
437
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 67.56 KB | None | 0 0
raw download clone embed print report
  1. [comment]coded by uxie!
  2.  
  3. [font=Mitr]title[/font]
  4. [font=Radio Canada]header[/font]
  5. [font=Rubik]body text[/font]
  6.  
  7. 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 ( ‾́ ◡ ‾́ )
  8.  
  9. [/comment][border=transparent;
  10.  
  11. /*main background colour*/
  12. --bg-1: #020202;
  13. /*textbox background colour*/
  14. --bg-2: #000000;
  15.  
  16. /*contrasting colour to bg-1*/
  17. --color-1: #fff;
  18. /*textbox borders; you can make it an in-between between color-1 and bg-1*/
  19. --color-1b: #878787;
  20. /*main accent colour -- most tags and headers*/
  21. --color-2: #73B1AB;
  22. /*secondary accent colour -- large title text, decorative icons*/
  23. --color-3: #F68844;
  24.  
  25. /*unselected button colour*/
  26. --button: var(--color-1b);
  27.  
  28. /*text colour*/
  29. --t-color:#fff;
  30.  
  31. /*fonts used*/
  32. --title: 'Mitr', sans-serif;
  33. --header: 'Radio Canada', sans-serif;
  34. --body: 'Rubik', sans-serif;
  35.  
  36. /*left/top large image*/
  37. --img-1: url('https://64.media.tumblr.com/101d96263995f57eb5bbeb298adece11/ecbe23d1d6ad6b24-eb/s1280x1920/a53015c5924ae243a30b3dfe9d885e1e3500fa24.gifv');
  38. /*quote icon on tab 1*/
  39. --img-2: url('https://64.media.tumblr.com/c11dd68aa3fb0c108e9e43491586d2e5/ea1321a850bd00ec-59/s400x600/3ac3fa05a66d9c0ebc37219c366e6b8a971ec2bd.png');
  40. /*bottom image on tab 3*/
  41. --img-3: URL('https://64.media.tumblr.com/dbc6d1f6f8b8dee7018c182afbf01934/a29ba0a132d61408-7a/s540x810/fa700d87665239c125f1a5c1e8472b53a7f12764.gif');
  42. /*image next to music player on tab 4*/
  43. --img-4: url('https://64.media.tumblr.com/dbc6d1f6f8b8dee7018c182afbf01934/a29ba0a132d61408-7a/s540x810/fa700d87665239c125f1a5c1e8472b53a7f12764.gif');
  44.  
  45. /*gallery images*/
  46. --gimg-1: url('https://64.media.tumblr.com/81702365a7bb905dfcbfd2e5107a2207/b2593fd61bb79923-33/s1280x1920/144ee7ddaa26e6de892f4e597105e86507c2f694.jpg');
  47. --gimg-2: url('https://64.media.tumblr.com/81702365a7bb905dfcbfd2e5107a2207/b2593fd61bb79923-33/s1280x1920/144ee7ddaa26e6de892f4e597105e86507c2f694.jpg');
  48. --gimg-3: url('https://64.media.tumblr.com/81702365a7bb905dfcbfd2e5107a2207/b2593fd61bb79923-33/s1280x1920/144ee7ddaa26e6de892f4e597105e86507c2f694.jpg');
  49.  
  50.  
  51. height:auto; width:100%; padding:0; margin:15px 0 25px 0; overflow-x:auto; line-height:0;][border=transparent; height:auto; width:clamp(320px, 90vw, 670px); padding:0; margin:5px auto; border:4px solid var(--color-2); box-shadow:0 0 5px var(--color-2); box-sizing:border-box; overflow:hidden; border-radius:8px;][border=transparent; height:100%; width:100%; padding:clamp(5px, -40px + 12vw, 15px) clamp(9px, -40px + 12vw, 19px); box-sizing:border-box; position:relative; display:flex; flex-flow:row wrap; justify-content:center; align-items:center; --m:10px 9px;]
  52.  
  53. [comment]----left----[/comment]
  54. [border=transparent; height:clamp(300px, -150px + 58vw, 350px); width:260px; padding:0; margin: var(--m); margin-right:clamp(-80px, -250px + 45vw, var(--m)); position:relative; z-index:5; display:flex; flex-flow:column nowrap; justify-content:flex-end;]
  55.  
  56. [comment]----image----[/comment]
  57. [border=transparent; flex:1; width:calc(100% - 40px); padding:0; background: var(--img-1); background-size:cover;
  58.  
  59. /*edit the following to adjust the cropping of the image*/ background-position:80% 80%;
  60.  
  61. border-radius:10px 10px 0 0; overflow:hidden; position:relative;][border=transparent; height:100%; width:100%; padding:0; background: var(--color-2); opacity:0.2;][/border][border=transparent; height:100%; width:100%; padding:0; background: radial-gradient(2px 2px, var(--bg-1), transparent); background-size: 3px 3px; opacity:0.2; position:absolute; top:0; left:0;][/border][/border]
  62. [border=transparent; height:9px; width:calc(100% - 40px); padding:0; background: var(--color-2); box-shadow:0 0 10px var(--color-2); border-radius:0 0 1px 1px; opacity:0.8;][/border]
  63.  
  64. [comment]----accordion----[/comment]
  65. [border=transparent; height:auto; width:auto; padding:0; position:relative; z-index:2; font-size:0; visibility:hidden;][accordion=100%;]
  66.  
  67. [comment]----name container----[/comment]
  68. {slide=[border=transparent; height:auto; min-height:65px; width:260px; padding:0; position:relative; display:flex; flex-flow:column nowrap; margin:-7px; font-variant:normal; font-weight:normal; position:relative; visibility:visible;][border=transparent; height:auto; width:auto; padding:0; position:absolute; top:10px; left:0; color: var(--color-1); pointer-events:none; font-size:8px; font-family: var(--header); letter-spacing:2px; opacity:0.6; text-transform:uppercase; font-weight:bold; background:var(--bg-1);]click![/border]
  69.  
  70. [comment]----title text----[/comment]
  71. [border=transparent;
  72.  
  73. /*edit font-size here*/ --fs: 68px;
  74.  
  75. height:fit-content; width:85%; padding:0; color: var(--color-3); font-size: var(--fs); font-family: var(--title); font-weight:bold; -webkit-text-stroke:0px var(--color-3); text-shadow:0 0 9px var(--color-3), 3px 3px var(--bg-1); position:relative; top:-25px; margin:0 3px -23px auto; text-align:right; line-height:calc(var(--fs) - 2px); letter-spacing:2px; transform:rotate(3deg); text-transform:uppercase; position:relative; z-index:5;][comment]
  76.  
  77. ----* * * title here (keep this short)----
  78.  
  79. [/comment]title[/border]
  80.  
  81. [comment]----subtitle----[/comment]
  82. [border=transparent; height:auto; width:85%; padding:0; color: var(--color-1); font-size:15px; font-family: var(--header); font-weight:bold; text-transform:uppercase; letter-spacing:2px; line-height:100%; margin-top:10px; text-shadow:1px 1px var(--color-2);][comment]
  83.  
  84.  
  85. ----* * * subtitle here----
  86.  
  87. [/comment]subtitle...[/border]
  88.  
  89. [/border]}
  90. [comment]----basics----[/comment]
  91. [border=transparent; height:auto; max-height:110px; width:220px; padding:0; visibility:visible; margin:10px -7px -7px -7px; overflow:hidden; display:flex; flex-direction:column;][border=transparent; height:100%; width:237px; padding:0; overflow-y:scroll;][border=transparent; height:auto; width:220px; padding:0; margin-bottom:3px; --m-b:6px;][border=transparent; height:0; width:100%; padding:0; margin-bottom: calc(var(--m-b) * -1);][/border]
  92.  
  93. [comment]----copy this whole thing to make another tag----[/comment]
  94. [border=transparent; height:auto; width:100%; padding:0; display:flex; flex-flow:row wrap; align-items:center; margin-top: var(--m-b);]
  95. [border=transparent; height:auto; width:auto; margin:3px 10px 0 0; padding:3px 6px 2px 6px; box-sizing:border-box; flex-shrink:0; border:2px solid var(--color-2); box-shadow:0 0 3px var(--color-2), 0 0 3px inset var(--color-2); background: var(--bg-1); font-size:11px; font-family: var(--body); line-height:100%; letter-spacing:1px; text-transform:uppercase; color: var(--color-2); text-shadow:0 0 2px var(--color-2); font-weight:bold; border-radius:4px;][comment]
  96.  
  97. ----* * * info title here----
  98.  
  99. [/comment]full name[/border]
  100. [border=transparent; height:20px; flex:1; padding:0;][/border]
  101. [border=transparent; height:auto; min-width:fit-content; min-width:-moz-fit-content; padding:0; margin:5px 0 0 0; color: var(--t-color); font-family: var(--body); font-size:12.5px; line-height:16px; text-transform:uppercase; letter-spacing:0.5px;][comment]
  102.  
  103. ----* * *info text here----
  104.  
  105. [/comment]answer[/border]
  106. [/border]
  107. [comment]----copy me too!----[/comment]
  108.  
  109. [comment]----copy this whole thing to make another tag----[/comment]
  110. [border=transparent; height:auto; width:100%; padding:0; display:flex; flex-flow:row wrap; align-items:center; margin-top: var(--m-b);]
  111. [border=transparent; height:auto; width:auto; margin:3px 10px 0 0; padding:3px 6px 2px 6px; box-sizing:border-box; flex-shrink:0; border:2px solid var(--color-2); box-shadow:0 0 3px var(--color-2), 0 0 3px inset var(--color-2); background: var(--bg-1); font-size:11px; font-family: var(--body); line-height:100%; letter-spacing:1px; text-transform:uppercase; color: var(--color-2); text-shadow:0 0 2px var(--color-2); font-weight:bold; border-radius:4px;][comment]
  112.  
  113. ----* * * info title here----
  114.  
  115. [/comment]nickname.s[/border]
  116. [border=transparent; height:20px; flex:1; padding:0;][/border]
  117. [border=transparent; height:auto; min-width:fit-content; min-width:-moz-fit-content; padding:0; margin:5px 0 0 0; color: var(--t-color); font-family: var(--body); font-size:12.5px; line-height:16px; text-transform:uppercase; letter-spacing:0.5px;][comment]
  118.  
  119. ----* * *info text here----
  120.  
  121. [/comment]answer[/border]
  122. [/border]
  123. [comment]----copy me too!----[/comment]
  124.  
  125. [comment]----copy this whole thing to make another tag----[/comment]
  126. [border=transparent; height:auto; width:100%; padding:0; display:flex; flex-flow:row wrap; align-items:center; margin-top: var(--m-b);]
  127. [border=transparent; height:auto; width:auto; margin:3px 10px 0 0; padding:3px 6px 2px 6px; box-sizing:border-box; flex-shrink:0; border:2px solid var(--color-2); box-shadow:0 0 3px var(--color-2), 0 0 3px inset var(--color-2); background: var(--bg-1); font-size:11px; font-family: var(--body); line-height:100%; letter-spacing:1px; text-transform:uppercase; color: var(--color-2); text-shadow:0 0 2px var(--color-2); font-weight:bold; border-radius:4px;][comment]
  128.  
  129. ----* * * info title here----
  130.  
  131. [/comment]age[/border]
  132. [border=transparent; height:20px; flex:1; padding:0;][/border]
  133. [border=transparent; height:auto; min-width:fit-content; min-width:-moz-fit-content; padding:0; margin:5px 0 0 0; color: var(--t-color); font-family: var(--body); font-size:12.5px; line-height:16px; text-transform:uppercase; letter-spacing:0.5px;][comment]
  134.  
  135. ----* * *info text here----
  136.  
  137. [/comment]answer[/border]
  138. [/border]
  139. [comment]----copy me too!----[/comment]
  140.  
  141. [comment]----copy this whole thing to make another tag----[/comment]
  142. [border=transparent; height:auto; width:100%; padding:0; display:flex; flex-flow:row wrap; align-items:center; margin-top: var(--m-b);]
  143. [border=transparent; height:auto; width:auto; margin:3px 10px 0 0; padding:3px 6px 2px 6px; box-sizing:border-box; flex-shrink:0; border:2px solid var(--color-2); box-shadow:0 0 3px var(--color-2), 0 0 3px inset var(--color-2); background: var(--bg-1); font-size:11px; font-family: var(--body); line-height:100%; letter-spacing:1px; text-transform:uppercase; color: var(--color-2); text-shadow:0 0 2px var(--color-2); font-weight:bold; border-radius:4px;][comment]
  144.  
  145. ----* * * info title here----
  146.  
  147. [/comment]d.o.b.[/border]
  148. [border=transparent; height:20px; flex:1; padding:0;][/border]
  149. [border=transparent; height:auto; min-width:fit-content; min-width:-moz-fit-content; padding:0; margin:5px 0 0 0; color: var(--t-color); font-family: var(--body); font-size:12.5px; line-height:16px; text-transform:uppercase; letter-spacing:0.5px;][comment]
  150.  
  151. ----* * *info text here----
  152.  
  153. [/comment]xx.xx.xxxx[/border]
  154. [/border]
  155. [comment]----copy me too!----[/comment]
  156.  
  157. [comment]----copy this whole thing to make another tag----[/comment]
  158. [border=transparent; height:auto; width:100%; padding:0; display:flex; flex-flow:row wrap; align-items:center; margin-top: var(--m-b);]
  159. [border=transparent; height:auto; width:auto; margin:3px 10px 0 0; padding:3px 6px 2px 6px; box-sizing:border-box; flex-shrink:0; border:2px solid var(--color-2); box-shadow:0 0 3px var(--color-2), 0 0 3px inset var(--color-2); background: var(--bg-1); font-size:11px; font-family: var(--body); line-height:100%; letter-spacing:1px; text-transform:uppercase; color: var(--color-2); text-shadow:0 0 2px var(--color-2); font-weight:bold; border-radius:4px;][comment]
  160.  
  161. ----* * * info title here----
  162.  
  163. [/comment]p.o.b.[/border]
  164. [border=transparent; height:20px; flex:1; padding:0;][/border]
  165. [border=transparent; height:auto; min-width:fit-content; min-width:-moz-fit-content; padding:0; margin:5px 0 0 0; color: var(--t-color); font-family: var(--body); font-size:12.5px; line-height:16px; text-transform:uppercase; letter-spacing:0.5px;][comment]
  166.  
  167. ----* * *info text here----
  168.  
  169. [/comment]answer[/border]
  170. [/border]
  171. [comment]----copy me too!----[/comment]
  172.  
  173. [/border][/border][/border]{/slide}
  174. [/accordion][/border]
  175. [comment]----accordion end----[/comment]
  176.  
  177. [/border]
  178. [comment]----left end----[/comment]
  179.  
  180. [comment]----right (main container)----[/comment]
  181. [border=transparent; height:380px; flex:53; min-width:280px; max-width:380px; padding:0; position:relative; margin: var(--m); display:flex; justify-content:flex-end;]
  182. [comment]----tabs----[/comment]
  183. [border=transparent; height:25px; width:190px; padding:0; overflow:hidden;][border=transparent; padding:0; margin:-2px -40px 0 -25px; letter-spacing:-50px;][tabs]
  184.  
  185. [comment]----tab 1----[/comment]
  186. [tab=.][border=transparent; height:100%; width:100%; padding:0; position:absolute; top:0; right:0; z-index:4; pointer-events:none; letter-spacing:0; display:flex; flex-flow:column nowrap;]
  187. [comment]----button select----[/comment]
  188. [border=transparent; height:25px; width:190px; padding:0; display:flex; flex-flow:row nowrap; justify-content:center; margin:0 0 0 auto; flex-shrink:0;]
  189.  
  190. [comment]----selected button----[/comment]
  191. [border=transparent; height:14px; width:15px; padding:0; flex-shrink:0;][border=transparent; height:14px; width:14px; padding:0; border-radius:50%; background:var(--color-2); box-shadow:0 0 8px var(--color-2);][/border][/border]
  192. [border=transparent;height:100%; flex:1; padding:0;][/border]
  193.  
  194. [comment]----filler button----[/comment]
  195. [border=transparent; height:14px; width:15px; padding:0; flex-shrink:0;][/border]
  196. [border=transparent;height:100%; flex:1; padding:0;][/border]
  197. [comment]----filler button----[/comment]
  198. [border=transparent; height:14px; width:15px; padding:0; flex-shrink:0;][/border]
  199. [border=transparent;height:100%; flex:1; padding:0;][/border]
  200. [comment]----filler button----[/comment]
  201. [border=transparent; height:14px; width:15px; padding:0; flex-shrink:0;][/border]
  202. [/border]
  203. [comment]----button select end----[/comment]
  204.  
  205. [comment]----tab contents----[/comment]
  206. [border=transparent; height:90%; width:100%; padding:0; display:flex; flex-flow:column nowrap; align-items:center; margin-top:20px; pointer-events:auto;]
  207.  
  208. [comment]----quote----[/comment]
  209. [border=transparent; height:auto; width:100%; padding:0; display:flex; flex-flow:row nowrap; align-items:center; flex-shrink:0;]
  210. [comment]----quote icon----[/comment]
  211. [border=transparent; height:68px; width:68px; padding:8px; box-sizing:border-box; position:relative; border-radius:50%; overflow:hidden; flex-shrink:0; margin-top:25px;][border=transparent; height:100%; width:100%; padding:0; background: var(--color-2); opacity:0.4; position:absolute; top:0; left:0;][/border][border=transparent; height:100%; width:100%; padding:0; background: var(--img-2); background-size:cover; background-position:center; border-radius:50%; position:relative; z-index:3; overflow:hidden;][border=transparent; height:100%; width:100%; padding:0; background: var(--color-2); opacity:0.2;][/border][border=transparent; height:100%; width:100%; padding:0; background: radial-gradient(2px 2px, var(--bg-1), transparent); background-size: 3px 3px; opacity:0.05; position:absolute; top:0; left:0;][/border][/border][/border]
  212.  
  213. [comment]----quote box----[/comment]
  214. [border=transparent; height:auto; flex:1; padding:0; display:flex; flex-flow:column nowrap; position:relative; margin:0 2px 0 8px;][border=transparent; height:75px; width:calc(100% - 10px); padding:9px 0 10px 0; box-sizing:border-box; border:2px solid var(--color-2); box-shadow:0 0 5px var(--color-2), 0 0 5px inset var(--color-2); background: var(--bg-2); border-radius:15px; position:relative; margin-left:10px; display:flex; align-items:center; justify-content:center;][border=transparent; height:auto; width:auto; padding:0; position:absolute; top:-12px; left:-12px; color: var(--color-1); font-size:33px; opacity:0.8;][fa]fas fa-quote-left[/fa][/border][border=transparent; height:auto; max-height:46px; width:100%; padding:0 15px 0 30px; box-sizing:border-box; color: var(--t-color); font-size:12px; letter-spacing:0.5px; line-height:15px; font-family: var(--body); text-align:justify; overflow:hidden;][comment]
  215.  
  216. ----* * * quote here----
  217.  
  218. [/comment]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed fringilla consectetur orci, non.[/border]
  219.  
  220. [/border]
  221. [border=transparent; height:12px; width:60px; padding:0; border:2px solid var(--color-2); box-sizing:border-box; box-shadow:0 0 5px var(--color-2), 0 0 5px inset var(--color-2); background: var(--bg-1); border-radius:8px; margin:7px 0 0 18px;][/border]
  222. [border=transparent; height:10px; width:10px; padding:0; border:2px solid var(--color-2); box-sizing:border-box; box-shadow:0 0 5px var(--color-2), 0 0 3px inset var(--color-2); background: var(--bg-1); border-radius:50%; margin:2px 0 0 3px;][/border]
  223. [/border]
  224. [/border]
  225. [comment]----quote end----[/comment]
  226.  
  227. [comment]----appearance----[/comment]
  228. [border=transparent; height:205px; width:100%; padding:0; background: var(--bg-2); border:1px solid var(--color-1b); display:flex; flex-flow:column nowrap; margin-top:25px;]
  229. [comment]----textbox header----[/comment]
  230. [border=transparent; height:30px; width:100%; padding:0; display:flex; flex-flow:row-reverse nowrap; border-bottom:1px solid var(--color-1b); flex-shrink:0;][border=transparent; height:30px; width:35px; padding:0; display:flex; align-items:center; justify-content:center; color: var(--color-2); font-size:15px; border-left:1px solid var(--color-1b); flex-shrink:0; text-shadow:0 0 3px var(--color-2);][comment]
  231.  
  232. ----* * * textbox icon here----
  233.  
  234. [/comment][fa]fas fa-eye[/fa][/border][border=transparent; height:100%; flex:1; padding:3px 10px; box-sizing:border-box; display:flex; align-items:center; color: var(--color-2); text-shadow:0 0 3px var(--color-2); font-family: var(--header); font-size:15px; text-transform:uppercase; letter-spacing:1.5px; font-weight:bold; line-height:100%; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;][comment]
  235.  
  236. ----* * * textbox title here----
  237.  
  238. [/comment]appearance[/border]
  239. [/border]
  240. [comment]----textbox header end----[/comment]
  241.  
  242. [comment]----textbox contents----[/comment]
  243. [border=transparent; height:calc(100% - 30px); width:100%; padding:0; display:flex; flex-flow:row-reverse nowrap;]
  244. [comment]----appearance details----[/comment]
  245. [border=transparent; height:100%; width:88px; padding:15px 0; box-sizing:border-box; border-left:1px solid var(--color-1b); flex-shrink:0; display:flex; align-items:center;][border=transparent; height:auto; max-height:145px; width:100%; 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 0 0 8px; box-sizing:border-box; --m-a: 16px;][border=transparent; height:0; width:100%; padding:0; margin-bottom:calc(var(--m-a) * -1);][/border]
  246.  
  247. [comment]----copy this whole thing to add another appearance detail----[/comment]
  248. [border=transparent; height:auto; width:100%; padding:0; display:flex; flex-flow:column nowrap; align-items:center; margin-top: var(--m-a);]
  249. [border=transparent; height:auto; width:auto; padding:0; text-align:center; font-family: var(--body); font-weight:bold; letter-spacing:1px; text-shadow:0 0 3px var(--color-2); color: var(--color-2); font-size:11px; line-height:100%; text-transform:uppercase;][comment]
  250.  
  251. ----* * * detail title here----
  252.  
  253. [/comment]height[/border]
  254. [border=transparent; height:auto; width:100%; padding:0; text-align:center; font-family: var(--body); color: var(--t-color); font-size:12px; line-height:100%; text-transform:uppercase; margin-top:5px;][comment]
  255.  
  256. ----* * * detail info here----
  257.  
  258. [/comment]answer[/border]
  259. [/border]
  260. [comment]----copy me too!----[/comment]
  261.  
  262. [comment]----copy this whole thing to add another appearance detail----[/comment]
  263. [border=transparent; height:auto; width:100%; padding:0; display:flex; flex-flow:column nowrap; align-items:center; margin-top: var(--m-a);]
  264. [border=transparent; height:auto; width:auto; padding:0; text-align:center; font-family: var(--body); font-weight:bold; letter-spacing:1px; text-shadow:0 0 3px var(--color-2); color: var(--color-2); font-size:11px; line-height:100%; text-transform:uppercase;][comment]
  265.  
  266. ----* * * detail title here----
  267.  
  268. [/comment]weight[/border]
  269. [border=transparent; height:auto; width:100%; padding:0; text-align:center; font-family: var(--body); color: var(--t-color); font-size:12px; line-height:100%; text-transform:uppercase; margin-top:5px;][comment]
  270.  
  271. ----* * * detail info here----
  272.  
  273. [/comment]answer[/border]
  274. [/border]
  275. [comment]----copy me too!----[/comment]
  276.  
  277. [comment]----copy this whole thing to add another appearance detail----[/comment]
  278. [border=transparent; height:auto; width:100%; padding:0; display:flex; flex-flow:column nowrap; align-items:center; margin-top: var(--m-a);]
  279. [border=transparent; height:auto; width:auto; padding:0; text-align:center; font-family: var(--body); font-weight:bold; letter-spacing:1px; text-shadow:0 0 3px var(--color-2); color: var(--color-2); font-size:11px; line-height:100%; text-transform:uppercase;][comment]
  280.  
  281. ----* * * detail title here----
  282.  
  283. [/comment]hair c.[/border]
  284. [border=transparent; height:auto; width:100%; padding:0; text-align:center; font-family: var(--body); color: var(--t-color); font-size:12px; line-height:100%; text-transform:uppercase; margin-top:5px;][comment]
  285.  
  286. ----* * * detail info here----
  287.  
  288. [/comment]answer[/border]
  289. [/border]
  290. [comment]----copy me too!----[/comment]
  291.  
  292. [comment]----copy this whole thing to add another appearance detail----[/comment]
  293. [border=transparent; height:auto; width:100%; padding:0; display:flex; flex-flow:column nowrap; align-items:center; margin-top: var(--m-a);]
  294. [border=transparent; height:auto; width:auto; padding:0; text-align:center; font-family: var(--body); font-weight:bold; letter-spacing:1px; text-shadow:0 0 3px var(--color-2); color: var(--color-2); font-size:11px; line-height:100%; text-transform:uppercase;][comment]
  295.  
  296. ----* * * detail title here----
  297.  
  298. [/comment]eye c.[/border]
  299. [border=transparent; height:auto; width:100%; padding:0; text-align:center; font-family: var(--body); color: var(--t-color); font-size:12px; line-height:100%; text-transform:uppercase; margin-top:5px;][comment]
  300.  
  301. ----* * * detail info here----
  302.  
  303. [/comment]answer[/border]
  304. [/border]
  305. [comment]----copy me too!----[/comment]
  306.  
  307. [/border][/border][/border][/border]
  308. [comment]----appearance details end----[/comment]
  309.  
  310. [comment]----appearance contents----[/comment]
  311. [border=transparent; height:172px; flex:1; padding:11px 0; box-sizing:border-box; overflow:hidden;][border=transparent; height:100%; width:200%; padding:0; overflow-y:scroll;][border=transparent; height:auto; width:50%; padding:0 4px 0 12px; box-sizing:border-box; margin-bottom:3px; --m-a: 9px;][border=transparent; height:0; width:100%; padding:0; margin-bottom:calc(var(--m-a) * -1);][/border]
  312.  
  313. [comment]----copy this whole thing to make another tag----[/comment]
  314. [border=transparent; height:auto; width:100%; padding:0; display:flex; flex-flow:row wrap; align-items:center; margin-top: var(--m-a);]
  315. [border=transparent; height:auto; width:auto; margin:3px 10px 0 0; padding:3px 6px 2px 6px; box-sizing:border-box; flex-shrink:0; border:2px solid var(--color-2); box-shadow:0 0 3px var(--color-2), 0 0 3px inset var(--color-2); background: var(--bg-1); font-size:10px; font-family: var(--body); line-height:100%; letter-spacing:1px; text-transform:uppercase; color: var(--color-2); text-shadow:0 0 2px var(--color-2); font-weight:bold; border-radius:4px;][comment]
  316.  
  317. ----* * * info title here----
  318.  
  319. [/comment]hair styling[/border]
  320. [border=transparent; height:auto; flex:1; min-width:fit-content; min-width:-moz-fit-content; padding:0; margin:5px 0 0 2px; color: var(--t-color); font-family: var(--body); font-size:11.5px; line-height:16px; text-align:justify;][comment]
  321.  
  322. ----* * *info text here----
  323.  
  324. [/comment]Lorem ipsum dolor sit amet, consectetur adipiscing elit.[/border]
  325. [/border]
  326. [comment]----copy me too!----[/comment]
  327.  
  328. [comment]----copy this whole thing to make another tag----[/comment]
  329. [border=transparent; height:auto; width:100%; padding:0; display:flex; flex-flow:row wrap; align-items:center; margin-top: var(--m-a);]
  330. [border=transparent; height:auto; width:auto; margin:3px 10px 0 0; padding:3px 6px 2px 6px; box-sizing:border-box; flex-shrink:0; border:2px solid var(--color-2); box-shadow:0 0 3px var(--color-2), 0 0 3px inset var(--color-2); background: var(--bg-1); font-size:10px; font-family: var(--body); line-height:100%; letter-spacing:1px; text-transform:uppercase; color: var(--color-2); text-shadow:0 0 2px var(--color-2); font-weight:bold; border-radius:4px;][comment]
  331.  
  332. ----* * * info title here----
  333.  
  334. [/comment]build[/border]
  335. [border=transparent; height:auto; flex:1; min-width:fit-content; min-width:-moz-fit-content; padding:0; margin:5px 0 0 2px; color: var(--t-color); font-family: var(--body); font-size:11.5px; line-height:16px; text-align:justify;][comment]
  336.  
  337. ----* * *info text here----
  338.  
  339. [/comment]Lorem ipsum dolor sit amet, consectetur adipiscing elit.[/border]
  340. [/border]
  341. [comment]----copy me too!----[/comment]
  342.  
  343. [comment]----copy this whole thing to make another tag----[/comment]
  344. [border=transparent; height:auto; width:100%; padding:0; display:flex; flex-flow:row wrap; align-items:center; margin-top: var(--m-a);]
  345. [border=transparent; height:auto; width:auto; margin:3px 10px 0 0; padding:3px 6px 2px 6px; box-sizing:border-box; flex-shrink:0; border:2px solid var(--color-2); box-shadow:0 0 3px var(--color-2), 0 0 3px inset var(--color-2); background: var(--bg-1); font-size:10px; font-family: var(--body); line-height:100%; letter-spacing:1px; text-transform:uppercase; color: var(--color-2); text-shadow:0 0 2px var(--color-2); font-weight:bold; border-radius:4px;][comment]
  346.  
  347. ----* * * info title here----
  348.  
  349. [/comment]body mods.[/border]
  350. [border=transparent; height:auto; flex:1; min-width:fit-content; min-width:-moz-fit-content; padding:0; margin:5px 0 0 2px; color: var(--t-color); font-family: var(--body); font-size:11.5px; line-height:16px; text-align:justify;][comment]
  351.  
  352. ----* * *info text here----
  353.  
  354. [/comment]Lorem ipsum dolor sit amet, consectetur adipiscing elit.[/border]
  355. [/border]
  356. [comment]----copy me too!----[/comment]
  357.  
  358. [comment]----copy this whole thing to make another tag----[/comment]
  359. [border=transparent; height:auto; width:100%; padding:0; display:flex; flex-flow:row wrap; align-items:center; margin-top: var(--m-a);]
  360. [border=transparent; height:auto; width:auto; margin:3px 10px 0 0; padding:3px 6px 2px 6px; box-sizing:border-box; flex-shrink:0; border:2px solid var(--color-2); box-shadow:0 0 3px var(--color-2), 0 0 3px inset var(--color-2); background: var(--bg-1); font-size:10px; font-family: var(--body); line-height:100%; letter-spacing:1px; text-transform:uppercase; color: var(--color-2); text-shadow:0 0 2px var(--color-2); font-weight:bold; border-radius:4px;][comment]
  361.  
  362. ----* * * info title here----
  363.  
  364. [/comment]faceclaim[/border]
  365. [border=transparent; height:auto; flex:1; min-width:fit-content; min-width:-moz-fit-content; padding:0; margin:5px 0 0 2px; color: var(--t-color); font-family: var(--body); font-size:11.5px; line-height:16px; text-align:justify;][comment]
  366.  
  367. ----* * *info text here----
  368.  
  369. [/comment]choi ye-won (arin)[/border]
  370. [/border]
  371. [comment]----copy me too!----[/comment]
  372.  
  373. [/border][/border][/border]
  374. [comment]----appearance contents end----[/comment]
  375. [/border]
  376. [comment]----textbox contents end----[/comment]
  377. [/border]
  378. [comment]----appearance end----[/comment]
  379.  
  380. [/border]
  381. [comment]----tab contents end----[/comment]
  382. [/border][/tab]
  383. [comment]----tab 1 end----[/comment]
  384.  
  385.  
  386. [comment]----tab 2----[/comment]
  387. [tab=.][border=transparent; height:100%; width:100%; padding:0; position:absolute; top:0; right:0; z-index:4; pointer-events:none; letter-spacing:0; display:flex; flex-flow:column nowrap;]
  388. [comment]----button select----[/comment]
  389. [border=transparent; height:25px; width:190px; padding:0; display:flex; flex-flow:row nowrap; justify-content:center; margin:0 0 0 auto; flex-shrink:0;]
  390. [comment]----filler button----[/comment]
  391. [border=transparent; height:14px; width:15px; padding:0; flex-shrink:0;][/border]
  392. [border=transparent;height:100%; flex:1; padding:0;][/border]
  393.  
  394. [comment]----selected button----[/comment]
  395. [border=transparent; height:14px; width:15px; padding:0; flex-shrink:0;][border=transparent; height:14px; width:14px; padding:0; border-radius:50%; background:var(--color-2); box-shadow:0 0 8px var(--color-2);][/border][/border]
  396. [border=transparent;height:100%; flex:1; padding:0;][/border]
  397.  
  398. [comment]----filler button----[/comment]
  399. [border=transparent; height:14px; width:15px; padding:0; flex-shrink:0;][/border]
  400. [border=transparent;height:100%; flex:1; padding:0;][/border]
  401. [comment]----filler button----[/comment]
  402. [border=transparent; height:14px; width:15px; padding:0; flex-shrink:0;][/border]
  403. [/border]
  404. [comment]----button select end----[/comment]
  405.  
  406. [comment]----tab contents----[/comment]
  407. [border=transparent; height:90%; width:100%; padding:0; display:flex; flex-flow:column nowrap; align-items:center; margin-top:15px; pointer-events:auto;]
  408.  
  409. [comment]----personality----[/comment]
  410. [border=transparent; height:58%; width:100%; padding:0; background: var(--bg-2); border:1px solid var(--color-1b); display:flex; flex-flow:column nowrap; flex-shrink:0;]
  411. [comment]----textbox header----[/comment]
  412. [border=transparent; height:30px; width:100%; padding:0; display:flex; flex-flow:row-reverse nowrap; border-bottom:1px solid var(--color-1b); flex-shrink:0;][border=transparent; height:30px; width:35px; padding:0; display:flex; align-items:center; justify-content:center; color: var(--color-2); font-size:15px; border-left:1px solid var(--color-1b); flex-shrink:0; text-shadow:0 0 3px var(--color-2);][comment]
  413.  
  414. ----* * * textbox icon here----
  415.  
  416. [/comment][fa]fas fa-user[/fa][/border][border=transparent; height:100%; flex:1; padding:3px 10px; box-sizing:border-box; display:flex; align-items:center; color: var(--color-2); text-shadow:0 0 3px var(--color-2); font-family: var(--header); font-size:15px; text-transform:uppercase; letter-spacing:1.5px; font-weight:bold; line-height:100%; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;][comment]
  417.  
  418. ----* * * textbox title here----
  419.  
  420. [/comment]personality[/border]
  421. [/border]
  422. [comment]----textbox header end----[/comment]
  423.  
  424. [comment]----textbox contents----[/comment]
  425. [border=transparent; height:calc(100% - 30px); width:100%; padding:11px 0; box-sizing:border-box; overflow:hidden;][border=transparent; height:100%; width:200%; padding:0; overflow-y:scroll;][border=transparent; height:auto; width:50%; padding:0 4px 0 12px; box-sizing:border-box; --m-p:11px;][border=transparent; height:0; width:100%; padding:0; margin-bottom: calc(var(--m-p) * -1);][/border]
  426.  
  427. [comment]----copy this whole thing for a long text----[/comment]
  428. [border=transparent; height:auto; width:100%; padding:0; color: var(--t-color); font-size:11.5px; text-align:justify; font-family: var(--body); line-height:16px; margin-top: var(--m-p)][comment]
  429.  
  430. ----* * * text starts here----
  431.  
  432. [/comment]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean varius laoreet sem nec consequat. Cras nec dignissim magna. Fusce eu ornare enim, vitae molestie ligula. Nullam aliquam sem elit, sed porta sem varius sed. In sit amet mollis arcu. Nulla sed leo aliquam ligula pulvinar lobortis eget a justo. Quisque commodo molestie rutrum. Donec quis vehicula velit, eget porta risus. Nullam tortor enim, volutpat lacinia libero venenatis, fermentum auctor libero. Mauris in dapibus tortor. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Etiam a iaculis augue. Sed consectetur tristique sapien, non lobortis mi vehicula id.
  433. [/border]
  434. [comment]----copy me too!----[/comment]
  435.  
  436. [comment]----copy this whole thing to make another tag----[/comment]
  437. [border=transparent; height:auto; width:100%; padding:0; display:flex; flex-flow:row wrap; align-items:center; margin-top: var(--m-p);]
  438. [border=transparent; height:auto; width:auto; margin:3px 10px 0 0; padding:3px 6px 2px 6px; box-sizing:border-box; flex-shrink:0; border:2px solid var(--color-2); box-shadow:0 0 3px var(--color-2), 0 0 3px inset var(--color-2); background: var(--bg-1); font-size:10px; font-family: var(--body); line-height:100%; letter-spacing:1px; text-transform:uppercase; color: var(--color-2); text-shadow:0 0 2px var(--color-2); font-weight:bold; border-radius:4px;][comment]
  439.  
  440. ----* * * info title here----
  441.  
  442. [/comment]virtues[/border]
  443. [border=transparent; height:auto; flex:1; min-width:fit-content; min-width:-moz-fit-content; padding:0; margin:5px 0 0 2px; color: var(--t-color); font-family: var(--body); font-size:11.5px; line-height:16px; text-align:justify;][comment]
  444.  
  445. ----* * *info text here----
  446.  
  447. [/comment]virtue, virtue, virtue, virtue, virtue[/border]
  448. [/border]
  449. [comment]----copy me too!----[/comment]
  450.  
  451. [comment]----copy this whole thing to make another tag----[/comment]
  452. [border=transparent; height:auto; width:100%; padding:0; display:flex; flex-flow:row wrap; align-items:center; margin-top: var(--m-p);]
  453. [border=transparent; height:auto; width:auto; margin:3px 10px 0 0; padding:3px 6px 2px 6px; box-sizing:border-box; flex-shrink:0; border:2px solid var(--color-2); box-shadow:0 0 3px var(--color-2), 0 0 3px inset var(--color-2); background: var(--bg-1); font-size:10px; font-family: var(--body); line-height:100%; letter-spacing:1px; text-transform:uppercase; color: var(--color-2); text-shadow:0 0 2px var(--color-2); font-weight:bold; border-radius:4px;][comment]
  454.  
  455. ----* * * info title here----
  456.  
  457. [/comment]vices[/border]
  458. [border=transparent; height:auto; flex:1; min-width:fit-content; min-width:-moz-fit-content; padding:0; margin:5px 0 0 2px; color: var(--t-color); font-family: var(--body); font-size:11.5px; line-height:16px; text-align:justify;][comment]
  459.  
  460. ----* * *info text here----
  461.  
  462. [/comment]vice, vice, vice, vice, vice[/border]
  463. [/border]
  464. [comment]----copy me too!----[/comment]
  465.  
  466. [/border][/border][/border]
  467. [comment]----textbox contents end----[/comment]
  468. [/border]
  469. [comment]----personality end----[/comment]
  470.  
  471. [comment]----personality details----[/comment]
  472. [border=transparent; height:37%; width:100%; padding:0; display:flex; flex-flow:row nowrap; margin-top:auto;]
  473.  
  474. [comment]----likes----[/comment]
  475. [border=transparent; height:100%; flex:1; padding:0; background: var(--bg-2); border:1px solid var(--color-1b); display:flex; flex-flow:column nowrap;]
  476. [comment]----textbox header----[/comment]
  477. [border=transparent; height:27px; width:100%; padding:0; display:flex; flex-flow:row-reverse nowrap; border-bottom:1px solid var(--color-1b); flex-shrink:0;][border=transparent; height:27px; width:30px; padding:0; display:flex; align-items:center; justify-content:center; color: var(--color-2); font-size:12px; border-left:1px solid var(--color-1b); flex-shrink:0; text-shadow:0 0 3px var(--color-2);][comment]
  478.  
  479. ----* * * textbox icon here----
  480.  
  481. [/comment][fa]fas fa-thumbs-up[/fa][/border][border=transparent; height:100%; flex:1; padding:3px 10px; box-sizing:border-box; display:flex; align-items:center; color: var(--color-2); text-shadow:0 0 3px var(--color-2); font-family: var(--header); font-size:13px; text-transform:uppercase; letter-spacing:1.5px; font-weight:bold; line-height:100%; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;][comment]
  482.  
  483. ----* * * textbox title here----
  484.  
  485. [/comment]likes[/border]
  486. [/border]
  487. [comment]----textbox header end----[/comment]
  488.  
  489. [comment]----textbox contents----[/comment]
  490. [border=transparent; height:calc(100% - 27px); width:100%; padding:9px 0 10px 0; box-sizing:border-box; overflow:hidden;][border=transparent; height:100%; width:200%; padding:0; overflow-y:scroll;][border=transparent; height:auto; width:50%; padding:0 4px 0 12px; box-sizing:border-box; color: var(--t-color); font-size:11px; text-align:justify; line-height:16px; font-family: var(--body);][comment]
  491.  
  492. ----* * * text starts here----
  493.  
  494. [/comment]a list of likes here. this scrolls!
  495. [/border][/border][/border]
  496. [comment]----textbox contents end----[/comment]
  497. [/border]
  498. [comment]----likes end----[/comment]
  499.  
  500. [border=transparent; height:100%; width:18px; padding:0; flex-shrink:0;][/border]
  501.  
  502. [comment]----dislikes----[/comment]
  503. [border=transparent; height:100%; flex:1; padding:0; background: var(--bg-2); border:1px solid var(--color-1b); display:flex; flex-flow:column nowrap;]
  504. [comment]----textbox header----[/comment]
  505. [border=transparent; height:27px; width:100%; padding:0; display:flex; flex-flow:row-reverse nowrap; border-bottom:1px solid var(--color-1b); flex-shrink:0;][border=transparent; height:27px; width:30px; padding:0; display:flex; align-items:center; justify-content:center; color: var(--color-3); font-size:12px; border-left:1px solid var(--color-1b); flex-shrink:0; text-shadow:0 0 3px var(--color-3);][comment]
  506.  
  507. ----* * * textbox icon here----
  508.  
  509. [/comment][fa]fas fa-thumbs-down[/fa][/border][border=transparent; height:100%; flex:1; padding:3px 10px; box-sizing:border-box; display:flex; align-items:center; color: var(--color-3); text-shadow:0 0 3px var(--color-3); font-family: var(--header); font-size:13px; text-transform:uppercase; letter-spacing:1.5px; font-weight:bold; line-height:100%; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;][comment]
  510.  
  511. ----* * * textbox title here----
  512.  
  513. [/comment]dislikes[/border]
  514. [/border]
  515. [comment]----textbox header end----[/comment]
  516.  
  517. [comment]----textbox contents----[/comment]
  518. [border=transparent; height:calc(100% - 27px); width:100%; padding:9px 0 10px 0; box-sizing:border-box; overflow:hidden;][border=transparent; height:100%; width:200%; padding:0; overflow-y:scroll;][border=transparent; height:auto; width:50%; padding:0 4px 0 12px; box-sizing:border-box; color: var(--t-color); font-size:11px; text-align:justify; line-height:16px; font-family: var(--body);][comment]
  519.  
  520. ----* * * text starts here----
  521.  
  522. [/comment]a list of dislikes here. this scrolls!
  523. [/border][/border][/border]
  524. [comment]----textbox contents end----[/comment]
  525. [/border]
  526. [comment]----dislikes end----[/comment]
  527.  
  528. [/border]
  529. [comment]----personality details end----[/comment]
  530. [/border]
  531. [comment]----tab contents end----[/comment]
  532. [/border][/tab]
  533. [comment]----tab 2 end----[/comment]
  534.  
  535.  
  536. [comment]----tab 3----[/comment]
  537. [tab=.][border=transparent; height:100%; width:100%; padding:0; position:absolute; top:0; right:0; z-index:4; pointer-events:none; letter-spacing:0; display:flex; flex-flow:column nowrap;]
  538. [comment]----button select----[/comment]
  539. [border=transparent; height:25px; width:190px; padding:0; display:flex; flex-flow:row nowrap; justify-content:center; margin:0 0 0 auto; flex-shrink:0;]
  540. [comment]----filler button----[/comment]
  541. [border=transparent; height:14px; width:15px; padding:0; flex-shrink:0;][/border]
  542. [border=transparent;height:100%; flex:1; padding:0;][/border]
  543. [comment]----filler button----[/comment]
  544. [border=transparent; height:14px; width:15px; padding:0; flex-shrink:0;][/border]
  545. [border=transparent;height:100%; flex:1; padding:0;][/border]
  546.  
  547. [comment]----selected button----[/comment]
  548. [border=transparent; height:14px; width:15px; padding:0; flex-shrink:0;][border=transparent; height:14px; width:14px; padding:0; border-radius:50%; background:var(--color-2); box-shadow:0 0 8px var(--color-2);][/border][/border]
  549. [border=transparent;height:100%; flex:1; padding:0;][/border]
  550.  
  551. [comment]----filler button----[/comment]
  552. [border=transparent; height:14px; width:15px; padding:0; flex-shrink:0;][/border]
  553. [/border]
  554. [comment]----button select end----[/comment]
  555.  
  556. [comment]----tab contents----[/comment]
  557. [border=transparent; height:90%; width:100%; padding:0; display:flex; flex-flow:column nowrap; align-items:center; margin-top:10px; pointer-events:auto;]
  558.  
  559. [comment]----history----[/comment]
  560. [border=transparent; height:69%; width:calc(100% - 10px); padding:0; background: var(--bg-2); border:1px solid var(--color-1b); flex-shrink:0; position:relative; margin:0 3px 0 auto;]
  561. [comment]----textbox header----[/comment]
  562. [border=transparent; height:30px; width:100%; padding:0; display:flex; flex-flow:row-reverse nowrap; border-bottom:1px solid var(--color-1b); flex-shrink:0;][border=transparent; height:30px; width:35px; padding:0; display:flex; align-items:center; justify-content:center; color: var(--color-2); font-size:15px; border-left:1px solid var(--color-1b); flex-shrink:0; text-shadow:0 0 3px var(--color-2);][comment]
  563.  
  564. ----* * * textbox icon here----
  565.  
  566. [/comment][fa]fas fa-book[/fa][/border][border=transparent; height:100%; flex:1; padding:3px 10px; box-sizing:border-box; display:flex; align-items:center; color: var(--color-2); text-shadow:0 0 3px var(--color-2); font-family: var(--header); font-size:15px; text-transform:uppercase; letter-spacing:1.5px; font-weight:bold; line-height:100%; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;][comment]
  567.  
  568. ----* * * textbox title here----
  569.  
  570. [/comment]history[/border]
  571. [/border]
  572. [comment]----textbox header end----[/comment]
  573.  
  574. [comment]----textbox contents----[/comment]
  575. [border=transparent; height:calc(100% - 30px); width:calc(100% + 10px); position:absolute; bottom:0; left:-10px; padding:7px 0 11px 0; box-sizing:border-box; overflow:hidden;][border=transparent; height:100%; width:200%; padding:0; overflow-y:scroll;][border=transparent; height:auto; width:50%; padding:0 4px 0 0px; box-sizing:border-box; --m-h:16px;][border=transparent; height:0; width:100%; padding:0; margin-bottom: calc(var(--m-h) * -1);][/border]
  576.  
  577. [comment]----copy this whole thing for a history section----[/comment]
  578. [border=transparent; height:auto; width:100%; padding:0; margin-top: var(--m-h);]
  579. [comment]----section header----[/comment]
  580. [border=transparent; height:auto; width:100%; padding:0 8px 4px 0; box-sizing:border-box; display:flex; flex-flow:row nowrap; align-items:center; position:sticky; top:-1px;][border=transparent; height:100%; width:calc(100% - 10px); padding:0; background: var(--bg-2); position:absolute; top:0; right:0; z-index:1;][/border][border=transparent; height:auto; width:auto; padding:3px 2px; box-sizing:border-box; position:relative; z-index:2; display:flex; align-items:flex-end; justify-content:center; background: var(--bg-1);][border=transparent; height:auto; width:auto; padding:0; color: var(--color-3); text-shadow:0 0 3px var(--color-3); font-size:13px; line-height:13px; margin-top:1px;][comment]
  581.  
  582. ----* * * history icon here----
  583.  
  584. [/comment][fa]far fa-star[/fa][/border][/border]
  585. [border=transparent; height:auto; flex:1; padding:3px 0 0 0; box-sizing:border-box; margin-left:13px; color: var(--color-3); font-size:13px; font-weight:bold; letter-spacing:2px; text-shadow:0 0 3px var(--color-3); line-height:14px; font-family: var(--body); position:relative; z-index:2; text-transform:uppercase; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;][comment]
  586.  
  587. ----* * * section title here----
  588.  
  589. [/comment]section 1[/border]
  590. [/border]
  591. [comment]----section header end----[/comment]
  592.  
  593. [comment]----section contents----[/comment]
  594. [border=transparent; height:auto; width:100%; padding:0 0 0 23px; box-sizing:border-box; margin-top:3px; color: var(--t-color); font-size:11.5px; text-align:justify; font-family: var(--body); line-height:16px;][comment]
  595.  
  596. ----* * * text starts here----
  597.  
  598. [/comment]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean varius laoreet sem nec consequat. Cras nec dignissim magna. Fusce eu ornare enim, vitae molestie ligula. Nullam aliquam sem elit, sed porta sem varius sed. In sit amet mollis arcu. Nulla sed leo aliquam ligula pulvinar lobortis eget a justo. Quisque commodo molestie rutrum. Donec quis vehicula velit, eget porta risus. Nullam tortor enim, volutpat lacinia libero venenatis, fermentum auctor libero. Mauris in dapibus tortor. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Etiam a iaculis augue. Sed consectetur tristique sapien, non lobortis mi vehicula id.
  599. [/border]
  600. [comment]----section contents end----[/comment]
  601. [/border]
  602. [comment]----copy me too!----[/comment]
  603.  
  604. [comment]----copy this whole thing for a history section----[/comment]
  605. [border=transparent; height:auto; width:100%; padding:0; margin-top: var(--m-h);]
  606. [comment]----section header----[/comment]
  607. [border=transparent; height:auto; width:100%; padding:0 8px 4px 0; box-sizing:border-box; display:flex; flex-flow:row nowrap; align-items:center; position:sticky; top:-1px;][border=transparent; height:100%; width:calc(100% - 10px); padding:0; background: var(--bg-2); position:absolute; top:0; right:0; z-index:1;][/border][border=transparent; height:auto; width:auto; padding:3px 2px; box-sizing:border-box; position:relative; z-index:2; display:flex; align-items:flex-end; justify-content:center; background: var(--bg-1);][border=transparent; height:auto; width:auto; padding:0; color: var(--color-3); text-shadow:0 0 3px var(--color-3); font-size:13px; line-height:13px; margin-top:1px;][comment]
  608.  
  609. ----* * * history icon here----
  610.  
  611. [/comment][fa]far fa-star[/fa][/border][/border]
  612. [border=transparent; height:auto; flex:1; padding:3px 0 0 0; box-sizing:border-box; margin-left:13px; color: var(--color-3); font-size:13px; font-weight:bold; letter-spacing:2px; text-shadow:0 0 3px var(--color-3); line-height:14px; font-family: var(--body); position:relative; z-index:2; text-transform:uppercase; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;][comment]
  613.  
  614. ----* * * section title here----
  615.  
  616. [/comment]section 2[/border]
  617. [/border]
  618. [comment]----section header end----[/comment]
  619.  
  620. [comment]----section contents----[/comment]
  621. [border=transparent; height:auto; width:100%; padding:0 0 0 23px; box-sizing:border-box; margin-top:3px; color: var(--t-color); font-size:11.5px; text-align:justify; font-family: var(--body); line-height:16px;][comment]
  622.  
  623. ----* * * text starts here----
  624.  
  625. [/comment]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean varius laoreet sem nec consequat. Cras nec dignissim magna. Fusce eu ornare enim, vitae molestie ligula. Nullam aliquam sem elit, sed porta sem varius sed. In sit amet mollis arcu. Nulla sed leo aliquam ligula pulvinar lobortis eget a justo. Quisque commodo molestie rutrum. Donec quis vehicula velit, eget porta risus. Nullam tortor enim, volutpat lacinia libero venenatis, fermentum auctor libero. Mauris in dapibus tortor. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Etiam a iaculis augue. Sed consectetur tristique sapien, non lobortis mi vehicula id.
  626. [/border]
  627. [comment]----section contents end----[/comment]
  628. [/border]
  629. [comment]----copy me too!----[/comment]
  630.  
  631. [/border][/border][/border]
  632. [comment]----textbox contents end----[/comment]
  633. [/border]
  634. [comment]----history end----[/comment]
  635.  
  636. [comment]----history image----[/comment]
  637. [border=transparent; flex:1 0; width:calc(100% - 10px); padding:0; margin:18px 3px 0 auto; display:flex; flex-flow:row nowrap;][border=transparent; height:100%; flex:1; padding:0; background: var(--img-3);
  638.  
  639. /*edit the following to adjust the cropping of the image*/ background-position:50% 50%;
  640.  
  641. border-radius:8px 0 0 8px; overflow:hidden; background-size:cover; position:relative;][border=transparent; height:100%; width:100%; padding:0; background: var(--color-2); opacity:0.2;][/border][border=transparent; height:100%; width:100%; padding:0; background: radial-gradient(2px 2px, var(--bg-1), transparent); background-size: 3px 3px; opacity:0.2; position:absolute; top:0; left:0;][/border][/border][border=transparent; height:100%; width:8px; padding:0; background: var(--color-2); opacity:0.8; flex-shrink:0; border-radius:0 1px 1px 0;][/border][/border]
  642.  
  643. [/border]
  644. [comment]----tab contents end----[/comment]
  645. [/border][/tab]
  646. [comment]----tab 3 end----[/comment]
  647.  
  648.  
  649. [comment]----tab 4----[/comment]
  650. [tab=.][border=transparent; height:100%; width:100%; padding:0; position:absolute; top:0; right:0; z-index:4; pointer-events:none; letter-spacing:0; display:flex; flex-flow:column nowrap;]
  651. [comment]----button select----[/comment]
  652. [border=transparent; height:25px; width:190px; padding:0; display:flex; flex-flow:row nowrap; justify-content:center; margin:0 0 0 auto; flex-shrink:0;]
  653. [comment]----filler button----[/comment]
  654. [border=transparent; height:14px; width:15px; padding:0; flex-shrink:0;][/border]
  655. [border=transparent;height:100%; flex:1; padding:0;][/border]
  656. [comment]----filler button----[/comment]
  657. [border=transparent; height:14px; width:15px; padding:0; flex-shrink:0;][/border]
  658. [border=transparent;height:100%; flex:1; padding:0;][/border]
  659. [comment]----filler button----[/comment]
  660. [border=transparent; height:14px; width:15px; padding:0; flex-shrink:0;][/border]
  661. [border=transparent;height:100%; flex:1; padding:0;][/border]
  662.  
  663. [comment]----selected button----[/comment]
  664. [border=transparent; height:14px; width:15px; padding:0; flex-shrink:0;][border=transparent; height:14px; width:14px; padding:0; border-radius:50%; background:var(--color-2); box-shadow:0 0 8px var(--color-2);][/border][/border]
  665. [/border]
  666. [comment]----button select end----[/comment]
  667.  
  668. [comment]----tab contents----[/comment]
  669. [border=transparent; height:90%; width:100%; padding:0; display:flex; flex-flow:column nowrap; align-items:center; margin-top:10px; pointer-events:auto;]
  670.  
  671. [comment]----row one----[/comment]
  672. [border=transparent; height:62%; width:100%; padding:0; display:flex; flex-flow:row nowrap;]
  673. [comment]----misc----[/comment]
  674. [border=transparent; height:100%; flex:1; padding:0; background: var(--bg-2); border:1px solid var(--color-1b); display:flex; flex-flow:column nowrap;]
  675. [comment]----textbox header----[/comment]
  676. [border=transparent; height:30px; width:100%; padding:0; display:flex; flex-flow:row-reverse nowrap; border-bottom:1px solid var(--color-1b); flex-shrink:0;][border=transparent; height:30px; width:35px; padding:0; display:flex; align-items:center; justify-content:center; color: var(--color-2); font-size:15px; border-left:1px solid var(--color-1b); flex-shrink:0; text-shadow:0 0 3px var(--color-2);][comment]
  677.  
  678. ----* * * textbox icon here----
  679.  
  680. [/comment][fa]fas fa-star[/fa][/border][border=transparent; height:100%; flex:1; padding:3px 10px; box-sizing:border-box; display:flex; align-items:center; color: var(--color-2); text-shadow:0 0 3px var(--color-2); font-family: var(--header); font-size:15px; text-transform:uppercase; letter-spacing:1.5px; font-weight:bold; line-height:100%; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;][comment]
  681.  
  682. ----* * * textbox title here----
  683.  
  684. [/comment]extra[/border]
  685. [/border]
  686. [comment]----textbox header end----[/comment]
  687.  
  688. [comment]----textbox contents----[/comment]
  689. [border=transparent; height:calc(100% - 30px); width:100%; padding:10px 0; box-sizing:border-box; overflow:hidden;][border=transparent; height:100%; width:200%; padding:0; overflow-y:scroll;][border=transparent; height:auto; width:50%; padding:0 4px 0 12px; box-sizing:border-box; --m-m:9px;][border=transparent; height:0; width:100%; padding:0; margin-bottom: calc(var(--m-m) * -1);][/border]
  690.  
  691. [comment]----copy this whole thing to make another tag----[/comment]
  692. [border=transparent; height:auto; width:100%; padding:0; display:flex; flex-flow:row wrap; align-items:center; margin-top: var(--m-m);]
  693. [border=transparent; height:auto; width:auto; margin:3px 10px 0 0; padding:3px 6px 2px 6px; box-sizing:border-box; flex-shrink:0; border:2px solid var(--color-2); box-shadow:0 0 3px var(--color-2), 0 0 3px inset var(--color-2); background: var(--bg-1); font-size:10px; font-family: var(--body); line-height:100%; letter-spacing:1px; text-transform:uppercase; color: var(--color-2); text-shadow:0 0 2px var(--color-2); font-weight:bold; border-radius:4px;][comment]
  694.  
  695. ----* * * info title here----
  696.  
  697. [/comment]misc[/border]
  698. [border=transparent; height:auto; flex:1; min-width:fit-content; min-width:-moz-fit-content; padding:0; margin:5px 0 0 2px; color: var(--t-color); font-family: var(--body); font-size:11.5px; line-height:16px; text-align:justify;][comment]
  699.  
  700. ----* * *info text here----
  701.  
  702. [/comment]Lorem ipsum[/border]
  703. [/border]
  704. [comment]----copy me too!----[/comment]
  705.  
  706. [comment]----copy this whole thing to make another tag----[/comment]
  707. [border=transparent; height:auto; width:100%; padding:0; display:flex; flex-flow:row wrap; align-items:center; margin-top: var(--m-m);]
  708. [border=transparent; height:auto; width:auto; margin:3px 10px 0 0; padding:3px 6px 2px 6px; box-sizing:border-box; flex-shrink:0; border:2px solid var(--color-2); box-shadow:0 0 3px var(--color-2), 0 0 3px inset var(--color-2); background: var(--bg-1); font-size:10px; font-family: var(--body); line-height:100%; letter-spacing:1px; text-transform:uppercase; color: var(--color-2); text-shadow:0 0 2px var(--color-2); font-weight:bold; border-radius:4px;][comment]
  709.  
  710. ----* * * info title here----
  711.  
  712. [/comment]misc[/border]
  713. [border=transparent; height:auto; flex:1; min-width:fit-content; min-width:-moz-fit-content; padding:0; margin:5px 0 0 2px; color: var(--t-color); font-family: var(--body); font-size:11.5px; line-height:16px; text-align:justify;][comment]
  714.  
  715. ----* * *info text here----
  716.  
  717. [/comment]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque tempus dui sit amet vehicula faucibus. Nulla nisl neque, pellentesque ac neque at, varius condimentum purus. In eu eros in massa rutrum blandit sed ut ex.[/border]
  718. [/border]
  719. [comment]----copy me too!----[/comment]
  720.  
  721. [comment]----copy this whole thing to make another tag----[/comment]
  722. [border=transparent; height:auto; width:100%; padding:0; display:flex; flex-flow:row wrap; align-items:center; margin-top: var(--m-m);]
  723. [border=transparent; height:auto; width:auto; margin:3px 10px 0 0; padding:3px 6px 2px 6px; box-sizing:border-box; flex-shrink:0; border:2px solid var(--color-2); box-shadow:0 0 3px var(--color-2), 0 0 3px inset var(--color-2); background: var(--bg-1); font-size:10px; font-family: var(--body); line-height:100%; letter-spacing:1px; text-transform:uppercase; color: var(--color-2); text-shadow:0 0 2px var(--color-2); font-weight:bold; border-radius:4px;][comment]
  724.  
  725. ----* * * info title here----
  726.  
  727. [/comment]misc[/border]
  728. [border=transparent; height:auto; flex:1; min-width:fit-content; min-width:-moz-fit-content; padding:0; margin:5px 0 0 2px; color: var(--t-color); font-family: var(--body); font-size:11.5px; line-height:16px; text-align:justify;][comment]
  729.  
  730. ----* * *info text here----
  731.  
  732. [/comment]Lorem ipsum[/border]
  733. [/border]
  734. [comment]----copy me too!----[/comment]
  735.  
  736. [/border][/border][/border]
  737. [comment]----textbox contents end----[/comment]
  738. [/border]
  739. [comment]----misc end----[/comment]
  740.  
  741. [comment]----gallery----[/comment]
  742. [border=transparent; height:100%; width:clamp(60px, -50px + 14vw, 70px); padding:0; margin-left:18px; overflow:hidden; border-radius:5px; position:relative;][border=transparent; height:100%; width:clamp(77px, -50px + 14vw, 87px); padding:0; overflow-y:scroll;][border=transparent; height:auto; width:clamp(60px, -50px + 14vw, 70px); padding:0; display:flex; flex-flow:column nowrap; --m-g: 12px;][border=transparent; height:0; width:100%; padding:0; margin-bottom: calc(var(--m-g) * -1);][/border]
  743.  
  744. [comment]----copy this whole thing to add another gallery image----[/comment]
  745. [border=transparent; width:100%; padding:0; flex-shrink:0; margin-top: var(--m-g);][border=transparent; padding:0; padding-top:100%; position:relative;
  746.  
  747. /*edit this to match variables*/ background: var(--gimg-1);
  748.  
  749. /*edit this to adjust the cropping of the image*/ background-position:50% 50%;
  750.  
  751. background-size:cover; border-radius:5px; overflow:hidden;][border=transparent; height:100%; width:100%; padding:0; background: var(--color-2); opacity:0.23; position:absolute; top:0; left:0;][/border][border=transparent; height:100%; width:100%; padding:0; background: radial-gradient(2px 2px, var(--bg-1), transparent); background-size: 2px 2px; opacity:0.15; position:absolute; top:0; left:0;][/border][/border][/border]
  752. [comment]----copy me too!----[/comment]
  753.  
  754. [comment]----copy this whole thing to add another gallery image----[/comment]
  755. [border=transparent; width:100%; padding:0; flex-shrink:0; margin-top: var(--m-g);][border=transparent; padding:0; padding-top:100%; position:relative;
  756.  
  757. /*edit this to match variables*/ background: var(--gimg-2);
  758.  
  759. /*edit this to adjust the cropping of the image*/ background-position:50% 50%;
  760.  
  761. background-size:cover; border-radius:5px; overflow:hidden;][border=transparent; height:100%; width:100%; padding:0; background: var(--color-2); opacity:0.23; position:absolute; top:0; left:0;][/border][border=transparent; height:100%; width:100%; padding:0; background: radial-gradient(2px 2px, var(--bg-1), transparent); background-size: 2px 2px; opacity:0.15; position:absolute; top:0; left:0;][/border][/border][/border]
  762. [comment]----copy me too!----[/comment]
  763.  
  764. [comment]----copy this whole thing to add another gallery image----[/comment]
  765. [border=transparent; width:100%; padding:0; flex-shrink:0; margin-top: var(--m-g);][border=transparent; padding:0; padding-top:100%; position:relative;
  766.  
  767. /*edit this to match variables*/ background: var(--gimg-3);
  768.  
  769. /*edit this to adjust the cropping of the image*/ background-position:50% 50%;
  770.  
  771. background-size:cover; border-radius:5px; overflow:hidden;][border=transparent; height:100%; width:100%; padding:0; background: var(--color-2); opacity:0.23; position:absolute; top:0; left:0;][/border][border=transparent; height:100%; width:100%; padding:0; background: radial-gradient(2px 2px, var(--bg-1), transparent); background-size: 2px 2px; opacity:0.15; position:absolute; top:0; left:0;][/border][/border][/border]
  772. [comment]----copy me too!----[/comment]
  773.  
  774. [/border][/border][/border]
  775. [comment]----gallery end----[/comment]
  776.  
  777. [/border]
  778. [comment]----row one end----[/comment]
  779.  
  780. [comment]----music player----[/comment]
  781. [border=transparent; height:37%; width:100%; padding:0; margin-top:20px; display:flex; flex-flow:row nowrap;]
  782.  
  783. [comment]----music image----[/comment]
  784. [border=transparent; height:101%; width:clamp(70px, -50px + 19vw, 105px); padding:0; border-radius:8px; flex-shrink:0; background: var(--img-4); background-size:cover; background-position:50% 50%; position:relative; margin-right:15px; overflow:hidden;][border=transparent; height:100%; width:100%; padding:0; background: var(--color-2); opacity:0.23; position:absolute; top:0; left:0;][/border][border=transparent; height:100%; width:100%; padding:0; background: radial-gradient(2px 2px, var(--bg-1), transparent); background-size: 3px 3px; opacity:0.2; position:absolute; top:0; left:0;][/border][/border]
  785.  
  786. [comment]----music info----[/comment]
  787. [border=transparent; height:100%; flex:1; padding:0; background: var(--bg-2); border:1px solid var(--color-1b); box-sizing:border-box; display:flex; flex-flow:column nowrap;]
  788. [comment]----textbox header----[/comment]
  789. [border=transparent; height:25px; width:100%; padding:0; display:flex; flex-flow:row-reverse nowrap; border-bottom:1px solid var(--color-1b); flex-shrink:0;][border=transparent; height:25px; width:35px; padding:0; display:flex; align-items:center; justify-content:center; color: var(--color-2); font-size:12px; border-left:1px solid var(--color-1b); flex-shrink:0; text-shadow:0 0 3px var(--color-2);][comment]
  790.  
  791. ----* * * textbox icon here----
  792.  
  793. [/comment][fa]fas fa-music[/fa][/border][border=transparent; height:100%; flex:1; padding:3px 10px; box-sizing:border-box; display:flex; align-items:center; color: var(--color-2); text-shadow:0 0 3px var(--color-2); font-family: var(--header); font-size:12px; text-transform:uppercase; letter-spacing:1.5px; font-weight:bold; line-height:100%; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;][comment]
  794.  
  795. ----* * * textbox title here----
  796.  
  797. [/comment]now playing...[/border]
  798. [/border]
  799. [comment]----textbox header end----[/comment]
  800.  
  801. [comment]----textbox contents----[/comment]
  802. [border=transparent; height:calc(100% - 25px); padding:10px 0; box-sizing:border-box; display:flex; flex-flow:column nowrap; justify-content:center; align-items:center;]
  803. [comment]----song title----[/comment]
  804. [border=transparent; height:auto; width:100%; max-width:190px; padding:0; color: var(--color-3); text-shadow:0 0 3px var(--color-3); font-family: var(--header); font-weight:bold; letter-spacing:2px; text-transform:uppercase; font-size:15px; line-height:100%; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; text-align:center;][comment]
  805.  
  806. ----* * * song title here----
  807.  
  808. [/comment]song name[/border]
  809.  
  810. [comment]----artist----[/comment]
  811. [border=transparent; height:auto; width:100%; max-width:190px; padding:0; color: var(--color-1b); font-weight:bold; font-family: var(--body); text-shadow:1px 1px var(--bg-2); font-size:9px; text-transform:uppercase; letter-spacing:1px; line-height:100%; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; text-align:center; margin-top:6px;][comment]
  812.  
  813. ----* * * song artist here----
  814.  
  815. [/comment]artist name[/border]
  816.  
  817. [comment]----buttons----[/comment]
  818. [border=transparent; height:auto; width:120px; padding:0; box-sizing:border-box; display:flex; flex-flow:row nowrap; align-items:center; justify-content:space-between; margin-top:7px;]
  819. [border=transparent; height:auto; width:auto; padding:0; color: var(--color-1); font-size:13.5px; text-shadow:0 0 3px var(--color-1); margin-top:2px;][fa]fas fa-backward[/fa][/border]
  820.  
  821. [comment]----play button----[/comment]
  822. [border=transparent; height:auto; width:auto; padding:0; position:relative; overflow:hidden;][border=transparent; height:auto; width:auto; padding:5px; box-sizing:border-box; color: var(--color-1); text-shadow:0 0 4px var(--color-1); font-size:17px; line-height:100%; position:relative; pointer-events:none; z-index:2;][fa]fas fa-play[/fa][/border]
  823. [comment]----actual media player----[/comment]
  824. [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; pointer-events:auto;]
  825.  
  826. [comment]----soundcloud (replace the soundcloud link within media tag with your own)----[/comment]
  827. [border=transparent; height:80px; width:180px; padding:0; margin-top:-16px; margin-left:-14px; position:absolute; top:0; left:0;]
  828. [media=soundcloud]soundcloud link here[/media]
  829. [/border]
  830.  
  831. [comment]----google drive (replace the google file code within media tag with your own)----[/comment]
  832. [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;]
  833. [media=googledrive]google file code[/MEDIA]
  834. [/border]
  835.  
  836. [/border][/border]
  837. [comment]----actual media player end----[/comment]
  838. [/border]
  839. [comment]----play button end----[/comment]
  840.  
  841. [border=transparent; height:auto; width:auto; padding:0; color: var(--color-1); font-size:13.5px; text-shadow:0 0 3px var(--color-1); margin:2px 0 0 -4px;][fa]fas fa-forward[/fa][/border]
  842. [/border]
  843. [comment]----buttons end----[/comment]
  844. [/border]
  845. [comment]----textbox contents end----[/comment]
  846. [/border]
  847. [comment]----music info----[/comment]
  848. [/border]
  849. [comment]----music player end----[/comment]
  850.  
  851. [/border]
  852. [comment]----tab contents end----[/comment]
  853. [/border][/tab]
  854. [comment]----tab 4 end----[/comment]
  855.  
  856.  
  857. [/tabs][/border][/border]
  858. [comment]----tabs end----[/comment]
  859.  
  860. [comment]----tabs cover----[/comment]
  861. [border=transparent; height:100%; width:100%; padding:0; position:absolute; top:0; right:0; z-index:3; display:flex; justify-content:flex-end; pointer-events:none;][border=transparent; height:25px; width:190px; padding:0; display:flex; flex-flow:row nowrap; justify-content:center;]
  862.  
  863. [comment]----button----[/comment]
  864. [border=transparent; height:14px; width:15px; padding:0; flex-shrink:0;][border=transparent; height:14px; width:14px; padding:0; border:2px solid var(--button); box-sizing:border-box; border-radius:50%; background:var(--bg-1);][/border][/border]
  865. [border=transparent;height:100%; flex:1; padding:0; pointer-events:auto;][/border]
  866.  
  867. [comment]----button----[/comment]
  868. [border=transparent; height:14px; width:15px; padding:0; flex-shrink:0;][border=transparent; height:14px; width:14px; padding:0; border:2px solid var(--button); box-sizing:border-box; border-radius:50%; background:var(--bg-1);][/border][/border]
  869. [border=transparent;height:100%; flex:1; padding:0; pointer-events:auto;][/border]
  870.  
  871. [comment]----button----[/comment]
  872. [border=transparent; height:14px; width:15px; padding:0; flex-shrink:0;][border=transparent; height:14px; width:14px; padding:0; border:2px solid var(--button); box-sizing:border-box; border-radius:50%; background:var(--bg-1);][/border][/border]
  873. [border=transparent;height:100%; flex:1; padding:0; pointer-events:auto;][/border]
  874.  
  875. [comment]----button----[/comment]
  876. [border=transparent; height:14px; width:15px; padding:0; flex-shrink:0;][border=transparent; height:14px; width:14px; padding:0; border:2px solid var(--button); box-sizing:border-box; border-radius:50%; background:var(--bg-1);][/border][/border]
  877.  
  878. [/border][/border]
  879. [comment]----tabs cover end----[/comment]
  880. [/border]
  881. [comment]----right end----[/comment]
  882.  
  883. [comment]----decor icons----[/comment]
  884. [border=transparent; height:auto; width:auto; padding:0; position:absolute; top:-30px; left:-45px; z-index:2; font-size:170px; color: var(--color-3); text-shadow:0 0 12px var(--color-3); transform:rotate(20deg);][fa]fal fa-star[/fa][/border]
  885. [border=transparent; height:auto; width:auto; padding:0; position:absolute; bottom:-40px; right:-65px; z-index:2; font-size:230px; color: var(--color-3); text-shadow:0 0 12px var(--color-3); transform:rotate(-20deg);][fa]fal fa-star[/fa][/border]
  886.  
  887.  
  888. [comment]----grid pattern----[/comment]
  889. [border=transparent; height:100%; width:100%; padding:0; background: var(--bg-1); position:absolute; top:0; left:0; z-index:1; pointer-events:none; box-shadow: 0 0 5px inset var(--color-2);][border=transparent; height:100%; width:100%; padding:0; background: linear-gradient(to right, var(--color-1) 1px, transparent 1px), linear-gradient(to bottom, var(--color-1) 1px, transparent 1px); background-size:32px 32px; background-position:50% 45%; opacity:0.3;][/border][/border]
  890.  
  891. [comment]----signature! do not remove----[/comment]
  892. [bg=transparent; height:10px;width:fit-content; position:absolute ;z-index:6;opacity:0.4;color: var(--color-3); font-size:9px;text-align:center; top:7px; right:3px;][font=Open Sans]♡coded by uxie♡[/font][/bg]
  893. [/border][/border][/border]
Add Comment
Please, Sign In to add comment
Public Pastes
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!