API tools faq
paste
Advertisement
ooksie

toxic (uxie x dreamglow)

ooksie
Nov 6th, 2020 (edited)
363
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 34.75 KB | None | 0 0
raw download clone embed print report
  1. [border=transparent;
  2. *biiig background colour;
  3. --bg-color: #242424;
  4. *main tab background colour;
  5. --color-1: #000;
  6. *title colour;
  7. --h-color: #fff;
  8. *text colour;
  9. --t-color: #fff;
  10. *biiig image;
  11. --img-1: url('https://user-images.githubusercontent.com/194400/49531010-48dad180-f8b1-11e8-8d89-1e61320e1d82.png');
  12. *role images;
  13. --role-1: url('https://breakthrough.org/wp-content/uploads/2018/10/default-placeholder-image.png');
  14. --role-2: url('https://breakthrough.org/wp-content/uploads/2018/10/default-placeholder-image.png');
  15. --role-3: url('https://breakthrough.org/wp-content/uploads/2018/10/default-placeholder-image.png');
  16. *header image above rules;
  17. --img-2: url('https://user-images.githubusercontent.com/194400/49531010-48dad180-f8b1-11e8-8d89-1e61320e1d82.png');
  18. *image below links;
  19. --img-3: url('https://breakthrough.org/wp-content/uploads/2018/10/default-placeholder-image.png');
  20.  
  21. height:550px; width:800px; padding:0; padding-bottom:20px; position:relative; line-height:0; margin:auto;][border=transparent; height:100%; width:100%; padding:0; background-color: var(--bg-color); position:relative; display:flex; justify-content:center; align-items:center;]
  22. [comment]----image----[/comment]
  23. [border=transparent; height:54%; width:100%; padding:0; position:absolute; z-index:2; top:25%; left:0; background: var(--img-1); background-size:cover; -webkit-filter: grayscale(0.9);
  24. /*edit the following to adjust the cropping of the image*/ background-position: 50% 50%;][/border]
  25.  
  26. [comment]----main content----[/comment]
  27. [border=transparent; height:100%; width:57%; padding:0; background: var(--color-1); position:relative; display:flex; align-items:flex-end;]
  28. [comment]----tabs cover----[/comment]
  29. [border=transparent; height:19%; width:100%; padding:0 10px; box-sizing:border-box; position:absolute; left:0; bottom:1%; display:flex; align-items:center; justify-content:space-between; background: var(--color-1); pointer-events:none;]
  30. [comment]----button----[/comment]
  31. [border=transparent; height:fit-content; width:25%; padding:0; display:flex; flex-flow:column nowrap; align-items:center; color: var(--h-color);]
  32. [border=transparent; height:fit-content; width:fit-content; padding:0; line-height:120%; font-size:30px; letter-spacing:1px; text-transform:uppercase;][font=DM Serif Display][comment]
  33. ----* * *big word here----
  34. [/comment]some[/font][/border]
  35. [border=transparent; height:fit-content; width:fit-content; padding:0; line-height:120%; font-size:14px; text-transform:uppercase; letter-spacing:3px; margin:5px 0; backface-visibility:hidden;][font=Courier Prime][comment]
  36. ----* * *tab title here----
  37. [/comment]home[/font][/border]
  38. [/border]
  39. [comment]----button end----[/comment]
  40.  
  41. [comment]----button----[/comment]
  42. [border=transparent; height:fit-content; width:25%; padding:0; display:flex; flex-flow:column nowrap; align-items:center; color: var(--h-color);]
  43. [border=transparent; height:fit-content; width:fit-content; padding:0; line-height:120%; font-size:30px; letter-spacing:1px; text-transform:uppercase;][font=DM Serif Display][comment]
  44. ----* * *big word here----
  45. [/comment]four[/font][/border]
  46. [border=transparent; height:fit-content; width:fit-content; padding:0; line-height:120%; font-size:14px; text-transform:uppercase; letter-spacing:3px; margin:5px 0; backface-visibility:hidden;][font=Courier Prime][comment]
  47. ----* * *tab title here----
  48. [/comment]about[/font][/border]
  49. [/border]
  50. [comment]----button end----[/comment]
  51.  
  52. [comment]----button----[/comment]
  53. [border=transparent; height:fit-content; width:25%; padding:0; display:flex; flex-flow:column nowrap; align-items:center; color: var(--h-color);]
  54. [border=transparent; height:fit-content; width:fit-content; padding:0; line-height:120%; font-size:30px; letter-spacing:1px; text-transform:uppercase;][font=DM Serif Display][comment]
  55. ----* * *big word here----
  56. [/comment]words[/font][/border]
  57. [border=transparent; height:fit-content; width:fit-content; padding:0; line-height:120%; font-size:14px; text-transform:uppercase; letter-spacing:3px; margin:5px 0; backface-visibility:hidden;][font=Courier Prime][comment]
  58. ----* * *tab title here----
  59. [/comment]roles[/font][/border]
  60. [/border]
  61. [comment]----button end----[/comment]
  62.  
  63. [comment]----button----[/comment]
  64. [border=transparent; height:fit-content; width:25%; padding:0; display:flex; flex-flow:column nowrap; align-items:center; color: var(--h-color);]
  65. [border=transparent; height:fit-content; width:fit-content; padding:0; line-height:120%; font-size:30px; letter-spacing:1px; text-transform:uppercase;][font=DM Serif Display][comment]
  66. ----* * *big word here----
  67. [/comment]here[/font][/border]
  68. [border=transparent; height:fit-content; width:fit-content; padding:0; line-height:120%; font-size:14px; text-transform:uppercase; letter-spacing:3px; margin:5px 0; backface-visibility:hidden;][font=Courier Prime][comment]
  69. ----* * *tab title here----
  70. [/comment]extra[/font][/border]
  71. [/border]
  72. [comment]----button end----[/comment]
  73. [/border]
  74. [comment]----tabs cover end----[/comment]
  75.  
  76. [comment]----tabs----[/comment]
  77. [border=transparent; height:5%; width:100%; padding:0; overflow:hidden; margin-bottom:12%;][border=transparent; padding:0; margin-left:-5px;][tabs]
  78. [comment]----tab one (home)----[/comment]
  79. [tab=aaaaa][border=transparent; height:79%; width:100%; padding:0; background-color: var(--color-1); position:absolute; top:0; left:0; z-index:1; display:flex; align-items:flex-start;]
  80.  
  81. [comment]----header----[/comment]
  82. [border=transparent; height:31.5%; width:100%; padding:0 15px 10px 15px; box-sizing:border-box; display:flex; flex-flow: row wrap; align-content:center; justify-content:center;]
  83. [comment]----title----[/comment]
  84. [border=transparent; height:fit-content; width:100%; text-align:center; padding:0; color: var(--h-color); font-size:56px; text-transform:uppercase; letter-spacing:3px; line-height:120%;][font=DM Serif Display][comment]
  85. ----* * * main title here!----
  86. [/comment]main title[/font][/border]
  87.  
  88. [comment]----subtitle (try to keep this to one line)----[/comment]
  89. [border=transparent; height:fit-content; width:fit-content; padding:0; color: var(--t-color); font-size:15px; letter-spacing:0.5px; line-height:120%;][font=Courier Prime][comment]
  90. ----* * *subtitle here!----
  91. [/comment]you can write a subtitle here[/font][/border]
  92. [/border]
  93. [comment]----header end----[/comment]
  94.  
  95. [/border]
  96.  
  97. [comment]----button select----[/comment]
  98. [border=transparent; height:fit-content; width:25%; padding:0; display:flex; flex-flow:column nowrap; align-items:center; color: var(--h-color); background-color: var(--color-1); position:absolute; bottom:24.5px; left:7.5px;]
  99. [border=transparent; height:fit-content; width:fit-content; padding:0; line-height:120%; font-size:30px; letter-spacing:1px; text-transform:uppercase; color: var(--color-1); text-shadow:1.5px 1.5px var(--h-color); position:relative; top:-1.5px; left:-1.5px;][font=DM Serif Display][comment]
  100. ----* * *big word here----
  101. [/comment]some[/font][/border]
  102. [border=transparent; height:fit-content; width:fit-content; padding:0; line-height:120%; font-size:14px; text-transform:uppercase; letter-spacing:3px; margin:5px 0; backface-visibility:hidden;][font=Courier Prime][comment]
  103. ----* * *tab title here----
  104. [/comment]home[/font][/border]
  105. [/border]
  106. [/tab]
  107. [comment]----tab one end----[/comment]
  108.  
  109. [comment]----tab two (about)----[/comment]
  110. [tab=aaaaa][border=transparent; height:79%; width:100%; padding:0; background-color: var(--color-1); position:absolute; top:0; left:0; z-index:3; display:flex; flex-flow: row wrap; justify-content:center;]
  111.  
  112. [comment]----header----[/comment]
  113. [border=transparent; height:31.5%; width:100%; padding:0 15px 10px 15px; box-sizing:border-box; display:flex; flex-flow: row wrap; align-content:center; justify-content:center;]
  114. [comment]----title----[/comment]
  115. [border=transparent; height:fit-content; width:100%; text-align:center; padding:0; color: var(--h-color); font-size:56px; text-transform:uppercase; letter-spacing:3px; line-height:120%;][font=DM Serif Display][comment]
  116. ----* * * tab title here!----
  117. [/comment]tab title[/font][/border]
  118.  
  119. [comment]----subtitle (try to keep this to one line)----[/comment]
  120. [border=transparent; height:fit-content; width:fit-content; padding:0; color: var(--t-color); font-size:15px; letter-spacing:0.5px; line-height:120%;][font=Courier Prime][comment]
  121. ----* * *subtitle here!----
  122. [/comment]this is a short quote?[/font][/border]
  123. [/border]
  124. [comment]----header end----[/comment]
  125.  
  126. [comment]----tab contents----[/comment]
  127. [border=transparent; height:68.5%; width:85%; padding:15px 0; border:5px solid var(--h-color); background-color: var(--bg-color); box-sizing:border-box; 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 15px; box-sizing:border-box; color: var(--t-color); text-align:justify; font-size:11px; line-height:130%;][font=Courier Prime][comment]
  128. ----* * * text starts here!----
  129. [/comment][border=transparent; height:11px; width:fit-content; padding:0; float:left; font-size:20px; text-transform:uppercase; margin-right:3px;][font=DM Serif Display][comment]
  130. ----* * * first letter----
  131. [/comment]L[/font][/border]orem ipsum dolor sit amet, consectetur adipiscing elit. Duis vestibulum nulla ipsum, nec pellentesque augue scelerisque in. Morbi a malesuada mauris, eget mollis nisi. Nulla tortor tortor, porttitor ut sapien vitae, facilisis pulvinar elit. Nunc vel dignissim lorem. Pellentesque imperdiet bibendum massa, id tristique felis tempus eu. Aenean consequat leo urna, sit amet elementum tortor lobortis vitae. Praesent semper bibendum mi, eu congue velit iaculis cursus. In auctor mollis aliquet.
  132.  
  133. Ut placerat quam sit amet congue fermentum. Aenean vitae justo elit. Cras scelerisque ante id lectus euismod ullamcorper. Curabitur risus purus, porttitor ac mollis a, molestie sit amet enim. Morbi diam mi, auctor id auctor vitae, scelerisque sit amet ex. Ut blandit mi eget metus porttitor euismod. Morbi pellentesque odio velit, eget imperdiet nisl sollicitudin id.
  134. [/font][/border][/border][/border]
  135. [comment]----tab contents end----[/comment]
  136. [/border]
  137.  
  138. [comment]----button select----[/comment]
  139. [border=transparent; height:fit-content; width:25%; padding:0; display:flex; flex-flow:column nowrap; align-items:center; color: var(--h-color); background-color: var(--color-1); position:absolute; bottom:24.5px; left:116.6px;]
  140. [border=transparent; height:fit-content; width:fit-content; padding:0; line-height:120%; font-size:30px; letter-spacing:1px; text-transform:uppercase; color: var(--color-1); text-shadow:1.5px 1.5px var(--h-color); position:relative; top:-1.5px; left:-1.5px;][font=DM Serif Display][comment]
  141. ----* * *big word here----
  142. [/comment]four[/font][/border]
  143. [border=transparent; height:fit-content; width:fit-content; padding:0; line-height:120%; font-size:14px; text-transform:uppercase; letter-spacing:3px; margin:5px 0; backface-visibility:hidden;][font=Courier Prime][comment]
  144. ----* * *tab title here----
  145. [/comment]about[/font][/border]
  146. [/border]
  147. [/tab]
  148. [comment]----tab two end----[/comment]
  149.  
  150. [comment]----tab three (roles)----[/comment]
  151. [tab=aaaaaaaa][border=transparent; height:79%; width:100%; padding:0; background-color: var(--color-1); position:absolute; top:0; left:0; z-index:3; display:flex; flex-flow: row wrap; justify-content:center;]
  152.  
  153. [comment]----header----[/comment]
  154. [border=transparent; height:31.5%; width:100%; padding:0 15px 10px 15px; box-sizing:border-box; display:flex; flex-flow: row wrap; align-content:center; justify-content:center;]
  155. [comment]----title----[/comment]
  156. [border=transparent; height:fit-content; width:100%; text-align:center; padding:0; color: var(--h-color); font-size:56px; text-transform:uppercase; letter-spacing:3px; line-height:120%;][font=DM Serif Display][comment]
  157. ----* * * tab title here!----
  158. [/comment]tab title[/font][/border]
  159.  
  160. [comment]----subtitle (try to keep this to one line)----[/comment]
  161. [border=transparent; height:fit-content; width:fit-content; padding:0; color: var(--t-color); font-size:15px; letter-spacing:0.5px; line-height:120%;][font=Courier Prime][comment]
  162. ----* * *subtitle here!----
  163. [/comment]this is a short quote?[/font][/border]
  164. [/border]
  165. [comment]----header end----[/comment]
  166.  
  167. [comment]----tab contents----[/comment]
  168. [border=transparent; height:68.5%; width:90%; padding:0; box-sizing:border-box; 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; display:flex; flex-flow: row wrap;]
  169.  
  170. [comment]----copy this entire thing to make a new role! remember to change role no. in image! (role 1 -- alternate them between 1 and 2)----[/comment]
  171. [border=transparent; height:130px; width:100%; padding:0; display:flex; flex-flow: row nowrap; margin:10px 0;]
  172. [comment]----image----[/comment]
  173. [border=transparent; height:130px; width:130px; padding:0; border:5px solid var(--h-color); box-sizing:border-box; background: var(--role-1); background-size:cover; flex-shrink:0;
  174. /*edit the following to adjust the cropping of the image*/ background-position:50% 50%; -webkit-filter: grayscale(0.9);][/border]
  175.  
  176. [border=transparent; height:100%; flex-grow:1; padding:0; margin-left:20px; display:flex; flex-flow: row wrap;]
  177. [comment]----role title----[/comment]
  178. [border=transparent; height:20%; width:100%; padding:0; color: var(--h-color); display:flex; flex-flow: row nowrap; align-items:center;]
  179. [comment]----role name----[/comment]
  180. [border=transparent; height:fit-content; width:fit-content; padding:0; font-size:28px; text-transform:uppercase; line-height:80%; letter-spacing:0.5px;][font=DM Serif Display][comment]
  181. ----* * * role name here ----
  182. [/comment]role name[/font][/border]
  183.  
  184. [comment]----role status----[/comment]
  185. [border=transparent; height:fit-content; width:fit-content; padding:0; margin:5px 0 0 10px; font-size:13px; line-height:100%; letter-spacing:1px;][font=Courier Prime][comment]
  186. ----* * * role status here----
  187. [/comment](taken)[/font][/border]
  188. [/border]
  189.  
  190. [comment]----role description----[/comment]
  191. [border=transparent; height:78%; width:100%; margin-top:2%; padding:5px 0; box-sizing:border-box; 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:120%;][font=Courier Prime][comment]
  192. ----* * * text starts here!----
  193. [/comment]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis vestibulum nulla ipsum, nec pellentesque augue scelerisque in. Morbi a malesuada mauris, eget mollis nisi. Nulla tortor tortor, porttitor ut sapien vitae, facilisis pulvinar elit. Nunc vel dignissim lorem. Pellentesque imperdiet bibendum massa, id tristique felis tempus eu. Aenean consequat leo urna, sit amet elementum tortor lobortis vitae. Praesent semper bibendum mi, eu congue velit iaculis cursus. In auctor mollis aliquet.
  194. [/font][/border][/border][/border]
  195. [/border]
  196. [/border]
  197. [comment]----copy me too!----[/comment]
  198.  
  199. [comment]----copy this entire thing to make a new role! remember to change role no. in image! (role 2 -- alternate them between 1 and 2)----[/comment]
  200. [border=transparent; height:130px; width:100%; padding:0; display:flex; flex-flow: row-reverse nowrap; margin:10px 0;]
  201. [comment]----image----[/comment]
  202. [border=transparent; height:130px; width:130px; padding:0; border:5px solid var(--h-color); box-sizing:border-box; background: var(--role-2); background-size:cover; flex-shrink:0;
  203. /*edit the following to adjust the cropping of the image*/ background-position:50% 50%; -webkit-filter: grayscale(0.9);][/border]
  204.  
  205. [border=transparent; height:100%; flex-grow:1; padding:0; margin-right:20px; display:flex; flex-flow: row wrap;]
  206. [comment]----role title----[/comment]
  207. [border=transparent; height:20%; width:100%; padding:0; color: var(--h-color); display:flex; flex-flow: row nowrap; align-items:center;]
  208. [comment]----role name----[/comment]
  209. [border=transparent; height:fit-content; width:fit-content; padding:0; font-size:28px; text-transform:uppercase; line-height:80%; letter-spacing:0.5px;][font=DM Serif Display][comment]
  210. ----* * * role name here ----
  211. [/comment]role name[/font][/border]
  212.  
  213. [comment]----role status----[/comment]
  214. [border=transparent; height:fit-content; width:fit-content; padding:0; margin:5px 0 0 10px; font-size:13px; line-height:100%; letter-spacing:1px;][font=Courier Prime][comment]
  215. ----* * * role status here----
  216. [/comment](taken)[/font][/border]
  217. [/border]
  218.  
  219. [comment]----role description----[/comment]
  220. [border=transparent; height:78%; width:100%; margin-top:2%; padding:5px 0; box-sizing:border-box; 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:120%;][font=Courier Prime][comment]
  221. ----* * * text starts here!----
  222. [/comment]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis vestibulum nulla ipsum, nec pellentesque augue scelerisque in. Morbi a malesuada mauris, eget mollis nisi. Nulla tortor tortor, porttitor ut sapien vitae, facilisis pulvinar elit. Nunc vel dignissim lorem. Pellentesque imperdiet bibendum massa, id tristique felis tempus eu. Aenean consequat leo urna, sit amet elementum tortor lobortis vitae. Praesent semper bibendum mi, eu congue velit iaculis cursus. In auctor mollis aliquet.
  223. [/font][/border][/border][/border]
  224. [/border]
  225. [/border]
  226. [comment]----copy me too!----[/comment]
  227.  
  228. [comment]----copy this entire thing to make a new role! remember to change role no. in image! (role 1 -- alternate them between 1 and 2)----[/comment]
  229. [border=transparent; height:130px; width:100%; padding:0; display:flex; flex-flow: row nowrap; margin:10px 0;]
  230. [comment]----image----[/comment]
  231. [border=transparent; height:130px; width:130px; padding:0; border:5px solid var(--h-color); box-sizing:border-box; background: var(--role-3); background-size:cover; flex-shrink:0;
  232. /*edit the following to adjust the cropping of the image*/ background-position:50% 50%; -webkit-filter: grayscale(0.9);][/border]
  233.  
  234. [border=transparent; height:100%; flex-grow:1; padding:0; margin-left:20px; display:flex; flex-flow: row wrap;]
  235. [comment]----role title----[/comment]
  236. [border=transparent; height:20%; width:100%; padding:0; color: var(--h-color); display:flex; flex-flow: row nowrap; align-items:center;]
  237. [comment]----role name----[/comment]
  238. [border=transparent; height:fit-content; width:fit-content; padding:0; font-size:28px; text-transform:uppercase; line-height:80%; letter-spacing:0.5px;][font=DM Serif Display][comment]
  239. ----* * * role name here ----
  240. [/comment]role name[/font][/border]
  241.  
  242. [comment]----role status----[/comment]
  243. [border=transparent; height:fit-content; width:fit-content; padding:0; margin:5px 0 0 10px; font-size:13px; line-height:100%; letter-spacing:1px;][font=Courier Prime][comment]
  244. ----* * * role status here----
  245. [/comment](taken)[/font][/border]
  246. [/border]
  247.  
  248. [comment]----role description----[/comment]
  249. [border=transparent; height:78%; width:100%; margin-top:2%; padding:5px 0; box-sizing:border-box; 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:120%;][font=Courier Prime][comment]
  250. ----* * * text starts here!----
  251. [/comment]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis vestibulum nulla ipsum, nec pellentesque augue scelerisque in. Morbi a malesuada mauris, eget mollis nisi. Nulla tortor tortor, porttitor ut sapien vitae, facilisis pulvinar elit. Nunc vel dignissim lorem. Pellentesque imperdiet bibendum massa, id tristique felis tempus eu. Aenean consequat leo urna, sit amet elementum tortor lobortis vitae. Praesent semper bibendum mi, eu congue velit iaculis cursus. In auctor mollis aliquet.
  252. [/font][/border][/border][/border]
  253. [/border]
  254. [/border]
  255. [comment]----copy me too!----[/comment]
  256.  
  257. [/border][/border][/border]
  258. [comment]----tab contents end----[/comment]
  259. [/border]
  260.  
  261. [comment]----button select----[/comment]
  262. [border=transparent; height:fit-content; width:25%; padding:0; display:flex; flex-flow:column nowrap; align-items:center; color: var(--h-color); background-color: var(--color-1); position:absolute; bottom:24.5px; left:225.5px;]
  263. [border=transparent; height:fit-content; width:fit-content; padding:0; line-height:120%; font-size:30px; letter-spacing:1px; text-transform:uppercase; color: var(--color-1); text-shadow:1.5px 1.5px var(--h-color); position:relative; top:-1.5px; left:-1.5px;][font=DM Serif Display][comment]
  264. ----* * *big word here----
  265. [/comment]words[/font][/border]
  266. [border=transparent; height:fit-content; width:fit-content; padding:0; line-height:120%; font-size:14px; text-transform:uppercase; letter-spacing:3px; margin:5px 0; backface-visibility:hidden;][font=Courier Prime][comment]
  267. ----* * *tab title here----
  268. [/comment]roles[/font][/border]
  269. [/border]
  270. [/tab]
  271. [comment]----tab three end----[/comment]
  272.  
  273. [comment]----tab four (extra)----[/comment]
  274. [tab=aaaaa][border=transparent; height:79%; width:100%; padding:0; background-color: var(--color-1); position:absolute; top:0; left:0; z-index:3; overflow:hidden; display:flex; flex-direction:column;][border=transparent; height:100%; width:200%; padding:0; overflow-y:scroll; position:relative;]
  275.  
  276. [comment]----header----[/comment]
  277. [border=transparent; height:31.5%; width:50%; padding:0 15px 10px 15px; background-color:var(--color-1); box-sizing:border-box; display:flex; flex-flow: row wrap; align-content:center; justify-content:center; position:sticky; top:0; z-index:4;]
  278. [comment]----title----[/comment]
  279. [border=transparent; height:fit-content; width:100%; text-align:center; padding:0; color: var(--h-color); font-size:56px; text-transform:uppercase; letter-spacing:3px; line-height:120%;][font=DM Serif Display][comment]
  280. ----* * * tab title here!----
  281. [/comment]rules[/font][/border]
  282.  
  283. [comment]----subtitle (try to keep this to one line)----[/comment]
  284. [border=transparent; height:fit-content; width:fit-content; padding:0; color: var(--t-color); font-size:15px; letter-spacing:0.5px; line-height:120%;][font=Courier Prime][comment]
  285. ----* * *subtitle here!----
  286. [/comment]this is a short quote?[/font][/border]
  287. [/border]
  288. [comment]----header end----[/comment]
  289.  
  290. [comment]----tab contents 1----[/comment]
  291. [border=transparent; height:68.5%; width:50%; padding:0; box-sizing:border-box; display:flex; flex-direction:column;]
  292. [comment]----image----[/comment]
  293. [border=transparent; height:31%; width:93%; padding:0; background: var(--img-2); background-size:cover; margin:0 auto 2% auto; -webkit-filter: grayscale(0.9);
  294. /*edit the following to adjust the cropping of the image*/ background-position: 50% 50%;][/border]
  295.  
  296. [comment]----rules content----[/comment]
  297. [border=transparent; height:67%; 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 10px; box-sizing:border-box; display:flex; flex-flow: row wrap;]
  298.  
  299. [comment]----copy this whole thing to add another rule!----[/comment]
  300. [border=transparent; height:fit-content; width:100%; padding:0; display:flex; flex-flow: row nowrap; align-items:flex-start; margin:10px 0;]
  301. [border=transparent; height:fit-content; width:17%; padding:0 10px; box-sizing:border-box; color: var(--h-color); font-size:55px; line-height:60%; flex-shrink:0; text-align:center;][font=DM Serif Display][comment]
  302. ----* * * rule number----
  303. [/comment]1.[/font][/border]
  304. [border=transparent; height:75px; flex-grow:1; padding:0; overflow:hidden; display:flex; flex-direction:column;][border=transparent; height:100%; width:200%; padding:0; overflow-y:scroll;][border=transparent; height:auto; width:50%; padding:0; color: var(--t-color); font-size:11px; text-align:justify; line-height:120%;][font=Courier Prime][comment]
  305. ----* * *role content----
  306. [/comment]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis vestibulum nulla ipsum, nec pellentesque augue scelerisque in. Morbi a malesuada mauris, eget mollis nisi. Nulla tortor tortor, porttitor ut sapien vitae, facilisis pulvinar elit. Nunc vel dignissim lorem. Pellentesque imperdiet bibendum massa, id tristique felis tempus eu. Aenean consequat leo urna, sit amet elementum tortor lobortis vitae. Praesent semper bibendum mi, eu congue velit iaculis cursus. In auctor mollis aliquet.
  307. [/font][/border][/border][/border]
  308. [/border]
  309. [comment]----copy me too----[/comment]
  310.  
  311. [comment]----copy this whole thing to add another rule!----[/comment]
  312. [border=transparent; height:fit-content; width:100%; padding:0; display:flex; flex-flow: row nowrap; align-items:flex-start; margin:10px 0;]
  313. [border=transparent; height:fit-content; width:17%; padding:0 10px; box-sizing:border-box; color: var(--h-color); font-size:55px; line-height:60%; flex-shrink:0; text-align:center;][font=DM Serif Display][comment]
  314. ----* * * rule number----
  315. [/comment]2.[/font][/border]
  316. [border=transparent; height:75px; flex-grow:1; padding:0; overflow:hidden; display:flex; flex-direction:column;][border=transparent; height:100%; width:200%; padding:0; overflow-y:scroll;][border=transparent; height:auto; width:50%; padding:0; color: var(--t-color); font-size:11px; text-align:justify; line-height:120%;][font=Courier Prime][comment]
  317. ----* * *role content----
  318. [/comment]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis vestibulum nulla ipsum, nec pellentesque augue scelerisque in. Morbi a malesuada mauris, eget mollis nisi. Nulla tortor tortor, porttitor ut sapien vitae, facilisis pulvinar elit. Nunc vel dignissim lorem. Pellentesque imperdiet bibendum massa, id tristique felis tempus eu. Aenean consequat leo urna, sit amet elementum tortor lobortis vitae. Praesent semper bibendum mi, eu congue velit iaculis cursus. In auctor mollis aliquet.
  319. [/font][/border][/border][/border]
  320. [/border]
  321. [comment]----copy me too----[/comment]
  322.  
  323. [comment]----copy this whole thing to add another rule!----[/comment]
  324. [border=transparent; height:fit-content; width:100%; padding:0; display:flex; flex-flow: row nowrap; align-items:flex-start; margin:10px 0;]
  325. [border=transparent; height:fit-content; width:17%; padding:0 10px; box-sizing:border-box; color: var(--h-color); font-size:55px; line-height:60%; flex-shrink:0; text-align:center;][font=DM Serif Display][comment]
  326. ----* * * rule number----
  327. [/comment]3.[/font][/border]
  328. [border=transparent; height:75px; flex-grow:1; padding:0; overflow:hidden; display:flex; flex-direction:column;][border=transparent; height:100%; width:200%; padding:0; overflow-y:scroll;][border=transparent; height:auto; width:50%; padding:0; color: var(--t-color); font-size:11px; text-align:justify; line-height:120%;][font=Courier Prime][comment]
  329. ----* * *role content----
  330. [/comment]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis vestibulum nulla ipsum, nec pellentesque augue scelerisque in. Morbi a malesuada mauris, eget mollis nisi. Nulla tortor tortor, porttitor ut sapien vitae, facilisis pulvinar elit. Nunc vel dignissim lorem. Pellentesque imperdiet bibendum massa, id tristique felis tempus eu. Aenean consequat leo urna, sit amet elementum tortor lobortis vitae. Praesent semper bibendum mi, eu congue velit iaculis cursus. In auctor mollis aliquet.
  331. [/font][/border][/border][/border]
  332. [/border]
  333. [comment]----copy me too----[/comment]
  334.  
  335. [comment]----copy this whole thing to add another rule!----[/comment]
  336. [border=transparent; height:fit-content; width:100%; padding:0; display:flex; flex-flow: row nowrap; align-items:flex-start; margin:10px 0;]
  337. [border=transparent; height:fit-content; width:17%; padding:0 10px; box-sizing:border-box; color: var(--h-color); font-size:55px; line-height:60%; flex-shrink:0; text-align:center;][font=DM Serif Display][comment]
  338. ----* * * rule number----
  339. [/comment]4.[/font][/border]
  340. [border=transparent; height:75px; flex-grow:1; padding:0; overflow:hidden; display:flex; flex-direction:column;][border=transparent; height:100%; width:200%; padding:0; overflow-y:scroll;][border=transparent; height:auto; width:50%; padding:0; color: var(--t-color); font-size:11px; text-align:justify; line-height:120%;][font=Courier Prime][comment]
  341. ----* * *role content----
  342. [/comment]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis vestibulum nulla ipsum, nec pellentesque augue scelerisque in. Morbi a malesuada mauris, eget mollis nisi. Nulla tortor tortor, porttitor ut sapien vitae, facilisis pulvinar elit. Nunc vel dignissim lorem. Pellentesque imperdiet bibendum massa, id tristique felis tempus eu. Aenean consequat leo urna, sit amet elementum tortor lobortis vitae. Praesent semper bibendum mi, eu congue velit iaculis cursus. In auctor mollis aliquet.
  343. [/font][/border][/border][/border]
  344. [/border]
  345. [comment]----copy me too----[/comment]
  346.  
  347. [/border][/border][/border]
  348. [comment]----rules end----[/comment]
  349.  
  350. [/border]
  351. [comment]----tab contents 1 end----[/comment]
  352.  
  353. [comment]----header----[/comment]
  354. [border=transparent; height:31.5%; width:50%; padding:0 15px 10px 15px; background-color:var(--color-1); box-sizing:border-box; display:flex; flex-flow: row wrap; align-content:center; justify-content:center; position:sticky; top:0; z-index:4;]
  355. [comment]----title----[/comment]
  356. [border=transparent; height:fit-content; width:100%; text-align:center; padding:0; color: var(--h-color); font-size:56px; text-transform:uppercase; letter-spacing:3px; line-height:120%;][font=DM Serif Display][comment]
  357. ----* * * tab title here!----
  358. [/comment]links[/font][/border]
  359.  
  360. [comment]----subtitle (try to keep this to one line)----[/comment]
  361. [border=transparent; height:fit-content; width:fit-content; padding:0; color: var(--t-color); font-size:15px; letter-spacing:0.5px; line-height:120%;][font=Courier Prime][comment]
  362. ----* * *subtitle here!----
  363. [/comment]this is a short quote?[/font][/border]
  364. [/border]
  365. [comment]----header end----[/comment]
  366.  
  367. [comment]----tab contents 2----[/comment]
  368. [border=transparent; height:68.5%; width:50%; padding:0; box-sizing:border-box; display:flex; flex-direction:column;]
  369.  
  370. [comment]----links (replace the xx in each link with the link to each thread/discord)----[/comment]
  371. [border=transparent; height:15%; width:100%; padding:0 15px; box-sizing:border-box; display:flex; flex-flow: row nowrap; justify-content:space-around; align-items:center;]
  372. [comment]----link one----[/comment]
  373. [border=transparent; height:fit-content; flex-grow:1; padding:0 10px; box-sizing:border-box; text-align:center; text-transform:uppercase; letter-spacing:1px; font-size:16px;][font=Courier Prime][comment]
  374. ----* * * link one----
  375. [/comment][url='xx'][comment]
  376. ----* * * thread title----
  377. [/comment][border=0; padding:0; color: var(--t-color); line-height:120%;]out of character[/border][/url][/font][/border]
  378.  
  379. [border=transparent; height:90%; width:0; border-left:3px solid var(--h-color); padding:0; flex-shrink:0;][/border]
  380.  
  381. [comment]----link two----[/comment]
  382. [border=transparent; height:fit-content; flex-grow:1; padding:0 10px; box-sizing:border-box; text-align:center; text-transform:uppercase; letter-spacing:1px; font-size:16px;][font=Courier Prime][comment]
  383. ----* * * link one----
  384. [/comment][url='xx'][comment]
  385. ----* * * thread title----
  386. [/comment][border=0; padding:0; color: var(--t-color); line-height:120%;]character sheets[/border][/url][/font][/border]
  387.  
  388. [border=transparent; height:90%; width:0; border-left:3px solid var(--h-color); padding:0; flex-shrink:0;][/border]
  389.  
  390. [comment]----link three----[/comment]
  391. [border=transparent; height:fit-content; flex-grow:1; padding:0 10px; box-sizing:border-box; text-align:center; text-transform:uppercase; letter-spacing:1px; font-size:16px;][font=Courier Prime][comment]
  392. ----* * * link one----
  393. [/comment][url='xx'][comment]
  394. ----* * * thread title----
  395. [/comment][border=0; padding:0; color: var(--t-color); line-height:120%;]in-character[/border][/url][/font][/border]
  396. [/border]
  397.  
  398. [comment]----image----[/comment]
  399. [border=transparent; height:83%; width:93%; padding:0; background: var(--img-3); background-size:cover; margin:2% auto 0 auto; -webkit-filter: grayscale(0.9);
  400. /*edit the following to adjust the cropping of the image*/ background-position: 50% 50%;][/border]
  401.  
  402. [/border]
  403. [comment]----tab contents 2 end----[/comment]
  404.  
  405. [/border][/border]
  406.  
  407. [comment]----button select----[/comment]
  408. [border=transparent; height:fit-content; width:25%; padding:0; display:flex; flex-flow:column nowrap; align-items:center; color: var(--h-color); background-color: var(--color-1); position:absolute; bottom:24.5px; left:334.5px;]
  409. [border=transparent; height:fit-content; width:fit-content; padding:0; line-height:120%; font-size:30px; letter-spacing:1px; text-transform:uppercase; color: var(--color-1); text-shadow:1.5px 1.5px var(--h-color); position:relative; top:-1.5px; left:-1.5px;][font=DM Serif Display][comment]
  410. ----* * *big word here----
  411. [/comment]here[/font][/border]
  412. [border=transparent; height:fit-content; width:fit-content; padding:0; line-height:120%; font-size:14px; text-transform:uppercase; letter-spacing:3px; margin:5px 0; backface-visibility:hidden;][font=Courier Prime][comment]
  413. ----* * *tab title here----
  414. [/comment]extra[/font][/border]
  415. [/border]
  416. [/tab]
  417. [comment]----tab four end----[/comment]
  418.  
  419. [/tabs][/border][/border]
  420. [comment]----tabs end----[/comment]
  421. [/border]
  422. [/border][comment]----signature! (do not remove!)-----
  423. [/comment][bg=transparent; height:fit-content; padding:0; width:100%; position:absolute; left:0; bottom:10px; z-index:7;opacity:0.7;font-size:10px;text-align:center; line-height:130%;][font=Open Sans]♡coded by uxie, from the wonderful mind of dreamglow♡[/font][/bg][/border]
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
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!