Advertisement
ooksie

eye for an eye (uxie x psilocin)

Nov 24th, 2020 (edited)
164
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. [border=transparent;
  2. *biiig background colour;
  3. --bg-1: #0F0F0F;
  4. *main contents background colour;
  5. --bg-2: #ACACAC;
  6. *first accent colour (lighter) -- tabs background;
  7. --color-1: #666666;
  8. *secondary accent colour (main tabs accent);
  9. --color-2: #000;
  10. *header colour one (lighter) -- quote, main subtitle, tab titles;
  11. --h1: #fcfcfc;
  12. *header colour two (darker) -- main title, links;
  13. --h2: #000;
  14. *quote, main title shadow. edit only the first 3 rgb values;
  15. --shadow: rgb(0, 0, 0, 0.45);
  16. *text colour;
  17. --t-color: #F1F1F1;
  18.  
  19. *big image on the left;
  20. --img-1: url('https://64.media.tumblr.com/751d26f1de8c0d0030939db14d73dd67/tumblr_mzmn0sihWp1syt33go1_400.jpg');
  21.  
  22. *role images. to create a new role image, copy one entire variable and change the number in rX, then match it to the one in the roles;
  23. --r1: url('https://breakthrough.org/wp-content/uploads/2018/10/default-placeholder-image.png');
  24. --r2: url('https://breakthrough.org/wp-content/uploads/2018/10/default-placeholder-image.png');
  25. --r3: url('https://breakthrough.org/wp-content/uploads/2018/10/default-placeholder-image.png');
  26.  
  27. height:430px; width:800px; padding:60px; position:relative; line-height:0; margin:auto; background: var(--bg-1);]
  28.  
  29. [comment]----quote----[/comment]
  30. [border=transparent; height:100%; width:100%; padding:0; position:absolute; top:0; left:0; z-index:3; display:flex; align-items:flex-start; pointer-events:none;]
  31. [comment]----* quote pt. 1 *----[/comment]
  32. [border=transparent; height:fit-content; width:fit-content; max-width:42%; padding:0; position:relative; z-index:4; top:40px; left:30px; color: var(--h1); text-transform:uppercase; font-weight:bold; line-height:95%; text-shadow:-6px -6px var(--shadow); font-size:37px; margin-right:auto; letter-spacing:1px; pointer-events:auto;][font=Arimo][comment]
  33. ----* * * quote pt. 1 here !----
  34. [/comment]the devil and i are gonna
  35. have problems[/font][/border]
  36.  
  37. [comment]----*quote pt. 2*----[/comment]
  38. [border=transparent; height:fit-content; width:fit-content; max-width:70%; padding:0; position:relative; z-index:4; top:-63px; left:-68px; color: var(--h1); text-transform:uppercase; font-weight:bold; line-height:95%; text-shadow:5px 5px var(--shadow); font-size:45px; align-self:flex-end; margin-left:auto; pointer-events:auto; text-align:right;][font=Arimo][comment]
  39. ----* * * quote pt. 2 here ! (make sure this is only one line!)----
  40. [/comment]down in silver city[/font][/border]
  41.  
  42. [comment]----quote marks (ignore!)----[/comment]
  43. [border=transparent; height:fit-content; width:fit-content; padding:0; color: var(--color-1); font-size:165px; line-height:60%; position:absolute; top:20px; left:0; z-index:3; transform:scale(-1, 1);]❞[/border]
  44. [border=transparent; height:fit-content; width:fit-content; padding:0; color: var(--color-1); font-size:115px; line-height:60%; position:absolute; bottom:48px; right:20px; z-index:3;]❞[/border]
  45. [/border]
  46. [comment]----quote end----[/comment]
  47.  
  48. [comment]----main----[/comment]
  49. [border=transparent; height:100%; width:100%; padding:0; background: var(--bg-2); position:relative; z-index:2; display:flex; flex-flow: row nowrap;]
  50. [comment]----main image----[/comment]
  51. [border=transparent; height:100%; width:35%; padding:0; background: var(--img-1); background-size:cover; box-shadow:0 0 8px 6px var(--bg-2) inset; flex-shrink:0;
  52. /*edit the following to adjust the cropping of the image*/ background-position:50% 50%;][/border]
  53.  
  54. [comment]----main content----[/comment]
  55. [border=transparent; height:85%; width:62%; padding:10px 20px; box-sizing:border-box; margin-left:auto; position:relative; display:flex; justify-content:flex-end;]
  56. [comment]----tabs cover----[/comment]
  57. [border=transparent; height:13%; width:calc(100% - 40px); padding:0; background: var(--bg-2); position:absolute; top:0; right:20px; display:flex; flex-flow: row nowrap; pointer-events:none; justify-content:center; align-items:center;]
  58. [border=transparent; height:0; flex-grow:1; padding:0; border-top:4px solid var(--color-2);][/border]
  59.  
  60. [comment]----buttons----[/comment]
  61. [border=transparent; height:fit-content; width:fit-content; padding:0; display:flex; flex-flow; row nowrap; align-items:center; justify-content:center; flex-shrink:0;]
  62. [border=transparent; height:13px; width:30px; padding:0; pointer-events:auto; font-size:0;]filler! ignore[/border]
  63. [border=transparent; height:13px; width:13px; padding:0; background: var(--h1); border-radius:50%; flex-shrink:0;][/border]
  64. [border=transparent; height:13px; width:38px; padding:0; pointer-events:auto; font-size:0;]filler! ignore[/border]
  65. [border=transparent; height:13px; width:13px; padding:0; background: var(--h1); border-radius:50%; flex-shrink:0;][/border]
  66. [border=transparent; height:13px; width:38px; padding:0; pointer-events:auto; font-size:0;]filler! ignore[/border]
  67. [border=transparent; height:13px; width:13px; padding:0; background: var(--h1); border-radius:50%; flex-shrink:0;][/border]
  68. [border=transparent; height:13px; width:38px; padding:0; pointer-events:auto; font-size:0;]filler! ignore[/border]
  69. [border=transparent; height:13px; width:13px; padding:0; background: var(--h1); border-radius:50%; flex-shrink:0;][/border]
  70. [border=transparent; height:13px; width:20px; padding:0; pointer-events:auto; font-size:0;]filler! ignore[/border]
  71. [/border]
  72. [comment]----buttons end----[/comment]
  73. [/border]
  74. [comment]----tabs cover end----[/comment]
  75.  
  76. [comment]----tabs----[/comment]
  77. [border=transparent; height:8%; width:46%; padding:0; overflow:hidden;][border=transparent; padding:0; margin:0 -30px;][tabs]
  78.  
  79. [comment]----tab one (cover + links)----[/comment]
  80. [tab=.][border=transparent; height:87%; width:calc(100% - 45px); padding:15px; box-sizing:border-box; background: var(--color-1); position:absolute; bottom:0; right:25px; display:flex; flex-flow: column nowrap; align-items:center; justify-content:center;]
  81.  
  82. [comment]----* * title * *----[/comment]
  83. [border=transparent; height:fit-content; width:fit-content; padding:0; color: var(--h2); text-transform:uppercase; font-weight:bold; font-size:58px; line-height:100%; text-shadow:0 8px var(--shadow); -webkit-text-stroke:1px var(--h2); letter-spacing:1px; text-align:center;][font=Arimo][comment]
  84. ----* * * title here----
  85. [/comment]lex talionis.[/font][/border]
  86.  
  87. [comment]----* subtitle *----[/comment]
  88. [border=transparent; height:fit-content; width:fit-content; padding:0; color: var(--h1); text-transform:uppercase; line-height:100%; margin:8px 0; font-weight:bold; font-size:24px; text-align:center; letter-spacing:1.5px;][font=Arimo][comment]
  89. ----* * * subtitle here!----
  90. [/comment]gm'ed by psilocin.[/font][/border]
  91.  
  92. [comment]----line----[/comment]
  93. [border=transparent; height:5px; width:88%; padding:0; background: var(--color-2); border-radius:5px; margin:15px 0;][/border]
  94.  
  95. [comment]----* links *----[/comment]
  96. [border=transparent; height:fit-content; width:fit-content; max-width:78%; padding:0; display:flex; flex-flow: row wrap; align-content:center; justify-content:center;]
  97.  
  98. [comment]----copy this whole thing to add a new link!----[/comment]
  99. [border=transparent; height:fit-content; width:fit-content; padding:0; text-transform:uppercase; font-size:16px; font-weight:bold; margin:3px; letter-spacing:0.5px;][comment]
  100. ----* * *link to thread here! (replace xx with your link)----
  101. [/comment][url='xx'][border=transparent; padding:0; color: var(--color-2); line-height:100%;][font=Montserrat][comment]
  102. ----* * *name of link!----
  103. [/comment]in character.[/font][/border][/url]
  104. [/border]
  105. [comment]----copy me too!----[/comment]
  106.  
  107. [comment]----copy this whole thing to add a new link!----[/comment]
  108. [border=transparent; height:fit-content; width:fit-content; padding:0; text-transform:uppercase; font-size:16px; font-weight:bold; margin:3px; letter-spacing:0.5px;][comment]
  109. ----* * *link to thread here! (replace xx with your link)----
  110. [/comment][url='xx'][border=transparent; padding:0; color: var(--color-2); line-height:100%;][font=Montserrat][comment]
  111. ----* * *name of link!----
  112. [/comment]out of character.[/font][/border][/url]
  113. [/border]
  114. [comment]----copy me too!----[/comment]
  115.  
  116. [comment]----copy this whole thing to add a new link!----[/comment]
  117. [border=transparent; height:fit-content; width:fit-content; padding:0; text-transform:uppercase; font-size:16px; font-weight:bold; margin:3px; letter-spacing:0.5px;][comment]
  118. ----* * *link to thread here! (replace xx with your link)----
  119. [/comment][url='xx'][border=transparent; padding:0; color: var(--color-2); line-height:100%;][font=Montserrat][comment]
  120. ----* * *name of link!----
  121. [/comment]character creation.[/font][/border][/url]
  122. [/border]
  123. [comment]----copy me too!----[/comment]
  124.  
  125. [comment]----copy this whole thing to add a new link!----[/comment]
  126. [border=transparent; height:fit-content; width:fit-content; padding:0; text-transform:uppercase; font-size:16px; font-weight:bold; margin:3px; letter-spacing:0.5px;][comment]
  127. ----* * *link to thread here! (replace xx with your link)----
  128. [/comment][url='xx'][border=transparent; padding:0; color: var(--color-2); line-height:100%;][font=Montserrat][comment]
  129. ----* * *name of link!----
  130. [/comment]lore page.[/font][/border][/url]
  131. [/border]
  132. [comment]----copy me too!----[/comment]
  133.  
  134. [/border]
  135. [comment]----links end----[/comment]
  136.  
  137. [/border][/tab]
  138. [comment]----tab one end----[/comment]
  139.  
  140.  
  141. [comment]----tab two (introduction)----[/comment]
  142. [tab=.][border=transparent; height:87%; width:calc(100% - 45px); padding:15px; box-sizing:border-box; background: var(--color-1); position:absolute; bottom:0; right:25px; display:flex; flex-flow: column nowrap; align-items:center; justify-content:center;]
  143.  
  144. [comment]----* tab title *----[/comment]
  145. [border=transparent; height:13%; width:100%; padding:0 10px; box-sizing:border-box; display:flex; align-items:flex-start; justify-content:center; color: var(--h1); text-shadow:5px 5px var(--color-2); text-transform:uppercase; line-height:80%; font-size:28px; font-weight:bold; letter-spacing:1px; flex-shrink:0;][font=Arimo][comment]
  146. ----* * * tab title here!----
  147. [/comment]introduction.[/font][/border]
  148.  
  149. [comment]----* * tab contents * *----[/comment]
  150. [border=transparent; height:87%; width:100%; padding:0; display:flex; flex-direction:column; overflow:hidden;][border=transparent; height:100%; width:200%; padding:0; overflow-y:scroll;][border=transparent; height:auto; width:50%; padding:0; color: var(--t-color); text-align:justify; font-size:12px; line-height:140%;][font=Montserrat][comment]
  151. ----* * * text starts here!----
  152. [/comment]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec ac eros in dui tempor lacinia sit amet at risus. Morbi ac urna in lacus egestas sodales. Pellentesque nec sem quis nibh laoreet mollis. Pellentesque consectetur pharetra placerat. Proin vestibulum dolor leo, ac suscipit libero dapibus non. Aenean in ipsum lobortis, molestie leo sed, lobortis eros. Nunc ornare, eros et luctus cursus, justo lectus pharetra dolor, eget rhoncus tellus mi in nunc. Aenean non leo eu nisl ornare tincidunt sit amet id purus. Nulla lobortis vel orci quis facilisis. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed tristique sem sapien, in lacinia lectus faucibus eget. Duis vitae leo mauris.
  153.  
  154. Mauris in bibendum nulla. Sed eros dui, consequat ac sapien vitae, scelerisque interdum lectus. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. In tortor elit, pharetra at massa nec, eleifend lacinia elit. Fusce nec libero id eros egestas auctor sed quis mi. Etiam ut cursus est, non facilisis nulla. Nullam id nunc sem. Donec ac faucibus ante. Praesent tristique metus sit amet elit consequat feugiat. Donec ac placerat augue. Nam non leo quam.
  155.  
  156. Nam commodo blandit aliquam. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Fusce vestibulum, turpis vitae tristique interdum, libero felis iaculis odio, id rutrum velit ipsum in tortor. Nunc orci libero, bibendum id diam a, tincidunt rhoncus diam. Maecenas ipsum ipsum, congue eu nunc sed, dapibus fermentum enim. Nullam non enim sit amet sem tempor rutrum. Vestibulum sem purus, sagittis suscipit nisi vitae, mattis tristique diam. Ut risus ex, ornare vulputate mi id, sollicitudin sodales nisl. Sed tellus justo, faucibus vitae ornare eget, pellentesque a diam.
  157. [/font][/border][/border][/border]
  158. [comment]----tab contents end----[/comment]
  159.  
  160. [/border][/tab]
  161. [comment]----tab two end----[/comment]
  162.  
  163.  
  164. [comment]----tab three (roles)----[/comment]
  165. [tab=.][border=transparent; height:87%; width:calc(100% - 45px); padding:15px; box-sizing:border-box; background: var(--color-1); position:absolute; bottom:0; right:25px;]
  166.  
  167. [comment]----* * tab contents * *----[/comment]
  168. [border=transparent; height:100%; width:100%; padding:0; display:flex; flex-direction:column; overflow:hidden;][border=transparent; height:100%; width:200%; padding:0; overflow-y:scroll;][border=transparent; height:auto; width:50%; padding:0; display:flex; flex-flow: column nowrap;]
  169.  
  170. [comment]----copy this whole thing to make a new role! (rolebox 1 -- alternate rolebox 1 and 2)----[/comment]
  171. [border=transparent; height:130px; width:100%; padding:0; margin:10px 0; display:flex; flex-flow: row nowrap;]
  172. [comment]----role image (replace the number in rX with the number matching the variable!)----[/comment]
  173. [border=transparent; height:100%; width:40%; padding:0; background: var(--r1); clip-path: polygon(0 100%, 0 0, 85% 0, 85% 40%, 100% 50%, 85% 60%, 85% 100%); background-size:cover; flex-shrink:0; /*edit the following to adjust the cropping of the image*/ background-position: 50% 50%;][/border]
  174.  
  175. [comment]----role info----[/comment]
  176. [border=transparent; height:100%; flex-grow:1; padding:0; margin-left:5px; display:flex; flex-flow: column nowrap; align-items:flex-start; justify-content:center;]
  177. [comment]----* role name *----[/comment]
  178. [border=transparent; height:25%; width:100%; padding:0; color: var(--h1); text-shadow:4px 0 var(--color-2); text-transform:uppercase; font-size:25px; font-weight:bold; letter-spacing:0.5px; line-height:100%; display:flex; align-items:flex-start; justify-content:flex-start;][font=Arimo][comment]
  179. ----* * *role name here!----
  180. [/comment]role name.[/font][/border]
  181.  
  182. [comment]----* * role description * *----[/comment]
  183. [border=transparent; height:75%; 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; color: var(--t-color); font-size:11px; text-align:justify; line-height:140%;][font=Montserrat][comment]
  184. ----* * * text starts here!----
  185. [/comment]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec ac eros in dui tempor lacinia sit amet at risus. Morbi ac urna in lacus egestas sodales. Pellentesque nec sem quis nibh laoreet mollis. Pellentesque consectetur pharetra placerat. Proin vestibulum dolor leo, ac suscipit libero dapibus non. Aenean in ipsum lobortis, molestie leo sed, lobortis eros. Nunc ornare, eros et luctus cursus, justo lectus pharetra dolor, eget rhoncus tellus mi in nunc. Aenean non leo eu nisl ornare tincidunt sit amet id purus. Nulla lobortis vel orci quis facilisis. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed tristique sem sapien, in lacinia lectus faucibus eget. Duis vitae leo mauris.
  186. [/font][/border][/border][/border]
  187. [comment]----role description end----[/comment]
  188. [/border]
  189. [comment]----role info end----[/comment]
  190. [/border]
  191. [comment]----copy me too!-----[/comment]
  192.  
  193. [comment]----copy this whole thing to make a new role! (rolebox 2 -- alternate rolebox 1 and 2)----[/comment]
  194. [border=transparent; height:130px; width:100%; padding:0; margin:10px 0; display:flex; flex-flow: row-reverse nowrap;]
  195. [comment]----role image (replace the number in rX with the number matching the variable!)----[/comment]
  196. [border=transparent; height:100%; width:40%; padding:0; background: var(--r2); clip-path: polygon(15% 0%, 100% 0%, 100% 100%, 15% 100%, 15% 60%, 0 50%, 15% 40%); background-size:cover; flex-shrink:0; /*edit the following to adjust the cropping of the image*/ background-position: 100% 50%;][/border]
  197.  
  198. [comment]----role info----[/comment]
  199. [border=transparent; height:100%; flex-grow:1; padding:0; margin-right:5px; display:flex; flex-flow: column nowrap; align-items:flex-start; justify-content:center;]
  200. [comment]----* role name *----[/comment]
  201. [border=transparent; height:25%; width:100%; padding:0; color: var(--h1); text-shadow:4px 0 var(--color-2); text-transform:uppercase; font-size:25px; font-weight:bold; letter-spacing:0.5px; line-height:100%; display:flex; align-items:flex-start; justify-content:flex-start;][font=Arimo][comment]
  202. ----* * *role name here!----
  203. [/comment]role name.[/font][/border]
  204.  
  205. [comment]----* * role description * *----[/comment]
  206. [border=transparent; height:75%; 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; color: var(--t-color); font-size:11px; text-align:justify; line-height:140%;][font=Montserrat][comment]
  207. ----* * * text starts here!----
  208. [/comment]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec ac eros in dui tempor lacinia sit amet at risus. Morbi ac urna in lacus egestas sodales. Pellentesque nec sem quis nibh laoreet mollis. Pellentesque consectetur pharetra placerat. Proin vestibulum dolor leo, ac suscipit libero dapibus non. Aenean in ipsum lobortis, molestie leo sed, lobortis eros. Nunc ornare, eros et luctus cursus, justo lectus pharetra dolor, eget rhoncus tellus mi in nunc. Aenean non leo eu nisl ornare tincidunt sit amet id purus. Nulla lobortis vel orci quis facilisis. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed tristique sem sapien, in lacinia lectus faucibus eget. Duis vitae leo mauris.
  209. [/font][/border][/border][/border]
  210. [comment]----role description end----[/comment]
  211. [/border]
  212. [comment]----role info end----[/comment]
  213. [/border]
  214. [comment]----copy me too!-----[/comment]
  215.  
  216. [comment]----copy this whole thing to make a new role! (rolebox 1 -- alternate rolebox 1 and 2)----[/comment]
  217. [border=transparent; height:130px; width:100%; padding:0; margin:10px 0; display:flex; flex-flow: row nowrap;]
  218. [comment]----role image (replace the number in rX with the number matching the variable!)----[/comment]
  219. [border=transparent; height:100%; width:40%; padding:0; background: var(--r3); clip-path: polygon(0 100%, 0 0, 85% 0, 85% 40%, 100% 50%, 85% 60%, 85% 100%); background-size:cover; flex-shrink:0; /*edit the following to adjust the cropping of the image*/ background-position: 50% 50%;][/border]
  220.  
  221. [comment]----role info----[/comment]
  222. [border=transparent; height:100%; flex-grow:1; padding:0; margin-left:5px; display:flex; flex-flow: column nowrap; align-items:flex-start; justify-content:center;]
  223. [comment]----* role name *----[/comment]
  224. [border=transparent; height:25%; width:100%; padding:0; color: var(--h1); text-shadow:4px 0 var(--color-2); text-transform:uppercase; font-size:25px; font-weight:bold; letter-spacing:0.5px; line-height:100%; display:flex; align-items:flex-start; justify-content:flex-start;][font=Arimo][comment]
  225. ----* * *role name here!----
  226. [/comment]role name.[/font][/border]
  227.  
  228. [comment]----* * role description * *----[/comment]
  229. [border=transparent; height:75%; 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; color: var(--t-color); font-size:11px; text-align:justify; line-height:140%;][font=Montserrat][comment]
  230. ----* * * text starts here!----
  231. [/comment]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec ac eros in dui tempor lacinia sit amet at risus. Morbi ac urna in lacus egestas sodales. Pellentesque nec sem quis nibh laoreet mollis. Pellentesque consectetur pharetra placerat. Proin vestibulum dolor leo, ac suscipit libero dapibus non. Aenean in ipsum lobortis, molestie leo sed, lobortis eros. Nunc ornare, eros et luctus cursus, justo lectus pharetra dolor, eget rhoncus tellus mi in nunc. Aenean non leo eu nisl ornare tincidunt sit amet id purus. Nulla lobortis vel orci quis facilisis. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed tristique sem sapien, in lacinia lectus faucibus eget. Duis vitae leo mauris.
  232. [/font][/border][/border][/border]
  233. [comment]----role description end----[/comment]
  234. [/border]
  235. [comment]----role info end----[/comment]
  236. [/border]
  237. [comment]----copy me too!-----[/comment]
  238.  
  239. [/border][/border][/border]
  240. [comment]----tab contents end----[/comment]
  241.  
  242. [/border][/tab]
  243. [comment]----tab three end----[/comment]
  244.  
  245.  
  246. [comment]----tab four (rules)----[/comment]
  247. [tab=.][border=transparent; height:87%; width:calc(100% - 45px); padding:15px; box-sizing:border-box; background: var(--color-1); position:absolute; bottom:0; right:25px;]
  248.  
  249. [comment]----* tab title *----[/comment]
  250. [border=transparent; height:13%; width:100%; padding:0 10px; box-sizing:border-box; display:flex; align-items:flex-start; justify-content:center; color: var(--h1); text-shadow:5px 5px var(--color-2); text-transform:uppercase; line-height:80%; font-size:28px; font-weight:bold; letter-spacing:1px; flex-shrink:0;][font=Arimo][comment]
  251. ----* * * tab title here!----
  252. [/comment]rules.[/font][/border]
  253.  
  254. [comment]----* * tab contents * *----[/comment]
  255. [border=transparent; height:87%; width:100%; padding:0; display:flex; flex-direction:column; overflow:hidden;][border=transparent; height:100%; width:200%; padding:0; overflow-y:scroll;][border=transparent; height:auto; width:50%; padding:0; display:flex; flex-flow: column nowrap;]
  256.  
  257. [comment]----copy this whole thing to make a new rule!----[/comment]
  258. [border=transparent; height:auto; width:100%; padding:0; margin:10px 0; display:flex; flex-flow:row nowrap;]
  259. [comment]----* rule number *----[/comment]
  260. [border=transparent; height:auto; min-height:100%; width:fit-content; padding:0; display:flex; flex-flow: column nowrap; align-items:center;]
  261. [border=transparent; height:fit-content; width:fit-content; padding:0; color: var(--h1); font-weight:bold; letter-spacing:0.5px; line-height:100%; margin-bottom:5px; flex-shrink:0; font-size:32px;][font=Arimo][comment]
  262. ----* * * number here!----
  263. [/comment]01.[/font][/border]
  264. [border=transparent; flex-grow:1; width:0; border-right:4px solid var(--color-2); padding:0; margin-top:5px;][/border]
  265. [/border]
  266.  
  267. [comment]----rule contents----[/comment]
  268. [border=transparent; height:fit-content; flex-grow:1; padding:0; color: var(--t-color); text-align:justify; font-size:12px; line-height:140%; margin-left:10px;][font=Montserrat][comment]
  269. ----* * *text starts here!----
  270. [/comment]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec ac eros in dui tempor lacinia sit amet at risus. Morbi ac urna in lacus egestas sodales. Pellentesque nec sem quis nibh laoreet mollis. Pellentesque consectetur pharetra placerat. Proin vestibulum dolor leo, ac suscipit libero dapibus non.
  271.  
  272. this expands to fit whatever content you put in!
  273. [/font][/border]
  274. [comment]----rule contents end----[/comment]
  275. [/border]
  276. [comment]----copy me too!----[/comment]
  277.  
  278. [comment]----copy this whole thing to make a new rule!----[/comment]
  279. [border=transparent; height:auto; width:100%; padding:0; margin:10px 0; display:flex; flex-flow:row nowrap;]
  280. [comment]----* rule number *----[/comment]
  281. [border=transparent; height:auto; min-height:100%; width:fit-content; padding:0; display:flex; flex-flow: column nowrap; align-items:center;]
  282. [border=transparent; height:fit-content; width:fit-content; padding:0; color: var(--h1); font-weight:bold; letter-spacing:0.5px; line-height:100%; margin-bottom:5px; flex-shrink:0; font-size:32px;][font=Arimo][comment]
  283. ----* * * number here!----
  284. [/comment]02.[/font][/border]
  285. [border=transparent; flex-grow:1; width:0; border-right:4px solid var(--color-2); padding:0; margin-top:5px;][/border]
  286. [/border]
  287.  
  288. [comment]----rule contents----[/comment]
  289. [border=transparent; height:fit-content; flex-grow:1; padding:0; color: var(--t-color); text-align:justify; font-size:12px; line-height:140%; margin-left:10px;][font=Montserrat][comment]
  290. ----* * *text starts here!----
  291. [/comment]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec ac eros in dui tempor lacinia sit amet at risus. Morbi ac urna in lacus egestas sodales. Pellentesque nec sem quis nibh laoreet mollis. Pellentesque consectetur pharetra placerat. Proin vestibulum dolor leo, ac suscipit libero dapibus non.
  292. [/font][/border]
  293. [comment]----rule contents end----[/comment]
  294. [/border]
  295. [comment]----copy me too!----[/comment]
  296.  
  297. [comment]----copy this whole thing to make a new rule!----[/comment]
  298. [border=transparent; height:auto; width:100%; padding:0; margin:10px 0; display:flex; flex-flow:row nowrap;]
  299. [comment]----* rule number *----[/comment]
  300. [border=transparent; height:auto; min-height:100%; width:fit-content; padding:0; display:flex; flex-flow: column nowrap; align-items:center;]
  301. [border=transparent; height:fit-content; width:fit-content; padding:0; color: var(--h1); font-weight:bold; letter-spacing:0.5px; line-height:100%; margin-bottom:5px; flex-shrink:0; font-size:32px;][font=Arimo][comment]
  302. ----* * * number here!----
  303. [/comment]03.[/font][/border]
  304. [border=transparent; flex-grow:1; width:0; border-right:4px solid var(--color-2); padding:0; margin-top:5px;][/border]
  305. [/border]
  306.  
  307. [comment]----rule contents----[/comment]
  308. [border=transparent; height:fit-content; flex-grow:1; padding:0; color: var(--t-color); text-align:justify; font-size:12px; line-height:140%; margin-left:10px;][font=Montserrat][comment]
  309. ----* * *text starts here!----
  310. [/comment]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec ac eros in dui tempor lacinia sit amet at risus. Morbi ac urna in lacus egestas sodales. Pellentesque nec sem quis nibh laoreet mollis. Pellentesque consectetur pharetra placerat. Proin vestibulum dolor leo, ac suscipit libero dapibus non.
  311. [/font][/border]
  312. [comment]----rule contents end----[/comment]
  313. [/border]
  314. [comment]----copy me too!----[/comment]
  315.  
  316. [/border][/border][/border]
  317. [comment]----tab contents end----[/comment]
  318.  
  319. [/border][/tab]
  320. [comment]----tab four end----[/comment]
  321.  
  322. [/tabs][/border][/border]
  323. [comment]----tabs end----[/comment]
  324.  
  325. [/border]
  326. [comment]----main content end----[/comment]
  327.  
  328. [/border]
  329. [comment]----main end----[/comment]
  330.  
  331. [comment]----signature! (do not remove!)-----[/comment]
  332. [bg=transparent; height:fit-content; padding:0; width:100%; color: var(--h1); position:absolute; bottom:50px; left:10px; z-index:7;opacity:0.7;font-size:10px;text-align:center; line-height:100%;][font=Open Sans]♡design by psilocin, coded by uxie♡[/font][/bg]
  333. [/border]
Advertisement
RAW Paste Data Copied
Advertisement