API tools faq
paste
Advertisement
ooksie

id card (uxie x misorauni)

ooksie
Jul 1st, 2022 (edited)
182
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 50.70 KB | None | 0 0
raw download clone embed print report
  1. [comment]designed by misorauni, coded by uxie!
  2.  
  3. fonts used:
  4. [font=Exo 2]headers[/font]
  5. [font=Jura]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. /*background image*/
  12. --bg: url('https://i.imgur.com/NSs6GfX.png');
  13. /*solid colour background, visible due to slight transparency on background image*/
  14. --bg-1: #2b2b2b;
  15. /*content box background, with 85% transparency*/
  16. --bg-2: #220b66;
  17.  
  18. /*main accent colour*/
  19. --color-1: #7affff;
  20. /*text colour*/
  21. --t-color: #fff;
  22.  
  23. /*fonts used*/
  24. --header: 'Exo 2', sans-serif;
  25. --body: 'Jura', sans-serif;
  26.  
  27. /*big image on first tab*/
  28. --img-1: url('https://cpworldgroup.com/wp-content/uploads/2021/01/placeholder.png');
  29.  
  30. /*gallery images*/
  31. --gimg-1: url('https://cpworldgroup.com/wp-content/uploads/2021/01/placeholder.png');
  32. --gimg-2: url('https://cpworldgroup.com/wp-content/uploads/2021/01/placeholder.png');
  33. --gimg-3: url('https://cpworldgroup.com/wp-content/uploads/2021/01/placeholder.png');
  34. --gimg-4: url('https://cpworldgroup.com/wp-content/uploads/2021/01/placeholder.png');
  35. --gimg-5: url('https://cpworldgroup.com/wp-content/uploads/2021/01/placeholder.png');
  36. --gimg-6: url('https://cpworldgroup.com/wp-content/uploads/2021/01/placeholder.png');
  37.  
  38.  
  39. height:auto; width:100%; padding:0 0 20px 0; box-sizing:border-box; overflow-x:auto; margin:20px 0 30px 0; position:relative; line-height:0;][border=transparent; height:440px; width:100%; max-width:670px; min-width:300px; padding:35px; box-sizing:border-box; margin:0 auto; position:relative; border-radius:15px; overflow:hidden;]
  40.  
  41. [comment]----buttons container----[/comment]
  42. [border=transparent; height:50px; width:250px; padding:0; display:flex; flex-flow:row nowrap; position:absolute; top:40px; left:42px; z-index:10; pointer-events:none;]
  43. [comment]----button----[/comment]
  44. [border=transparent; height:auto; width:30px; padding:0; color: var(--color-1); font-size:30px;][fa]fas fa-diamond[/fa][/border]
  45. [border=transparent; height:100%; width:20px; padding:0; flex-shrink:0; pointer-events:auto;][/border]
  46. [comment]----button----[/comment]
  47. [border=transparent; height:auto; width:30px; padding:0; color: var(--color-1); font-size:30px;][fa]fas fa-diamond[/fa][/border]
  48. [border=transparent; height:100%; width:20px; padding:0; flex-shrink:0; pointer-events:auto;][/border]
  49. [comment]----button----[/comment]
  50. [border=transparent; height:auto; width:30px; padding:0; color: var(--color-1); font-size:30px;][fa]fas fa-diamond[/fa][/border]
  51. [border=transparent; height:100%; width:20px; padding:0; flex-shrink:0; pointer-events:auto;][/border]
  52. [comment]----button----[/comment]
  53. [border=transparent; height:auto; width:30px; padding:0; color: var(--color-1); font-size:30px;][fa]fas fa-diamond[/fa][/border]
  54. [border=transparent; height:100%; width:20px; padding:0; flex-shrink:0; pointer-events:auto;][/border]
  55. [/border]
  56. [comment]----buttons container end----[/comment]
  57.  
  58. [comment]----tabs----[/comment]
  59. [border=transparent; height:30px; width:250px; padding:0; overflow:hidden;][border=transparent; padding:0; margin:5px -40px 0 -90px; letter-spacing:-150px;][tabs]
  60. [tab=.]filler tab, ignore![/tab]
  61.  
  62. [comment]----tab 1----[/comment]
  63. [tab=.][border=transparent; height:100%; width:100%; padding:15px; box-sizing:border-box; position:absolute; top:0; left:0; z-index:3; pointer-events:none; overflow:hidden; letter-spacing:0;]
  64. [comment]----background----[/comment]
  65. [border=transparent; height:100%; width:100%; padding:0; background: var(--bg-1); background-size:cover; position:absolute; top:0; left:0; z-index:1; pointer-events:none;][/border]
  66. [border=transparent; height:100%; width:100%; padding:0; background: var(--bg) 50% 50%; background-size:cover; position:absolute; top:0; left:0; z-index:1; opacity:0.7; pointer-events:none;][/border]
  67. [comment]----home button----[/comment]
  68. [border=transparent; height:auto; width:250px; padding:0; position:absolute; top:40px; left:22px; z-index:4; display:flex; justify-content:flex-end;][border=transparent; height:50px; width:30px; padding:0; color: var(--color-1); font-size:30px;][fa]fas fa-home[/fa][/border][/border]
  69.  
  70. [comment]----tab contents----[/comment]
  71. [border=transparent; height:100%; width:100%; padding:20px 0; border:4px solid var(--color-1); box-sizing:border-box; border-radius:15px; position:relative; z-index:3; display:flex; flex-flow:column nowrap;][border=transparent; height:100%; width:100%; padding:0; border-radius:12px; background: var(--bg-2); opacity:0.85; position:absolute; top:0; left:0;][/border]
  72.  
  73. [comment]----title----[/comment]
  74. [border=transparent; height:auto; width:100%; padding:0 20px; box-sizing:border-box; display:flex; flex-flow:row wrap; position:relative; z-index:4;][border=transparent; height:clamp(22px, 150px - 18vw, 40px); flex:1; min-width:250px; padding:0;][/border][border=transparent; height:auto; flex:1; min-width:clamp(200px, 100% - 250px, 600px); padding:0 8px 0 0; box-sizing:border-box; font-family: var(--header); font-weight:bold; font-size:22px; letter-spacing:5px; font-style:oblique; flex-shrink:0; line-height:100%; -webkit-text-stroke:1px var(--color-1); text-align:right; margin:3px 0 0 auto; flex-shrink:0; pointer-events:auto;][comment]
  75.  
  76. ----* * * info title here----
  77.  
  78. [/comment]Placeholder text[/border]
  79. [/border]
  80. [comment]----title end----[/comment]
  81.  
  82. [comment]----main contents----[/comment]
  83. [border=transparent; height:100%; width:100%; padding:0; box-sizing:border-box; overflow:hidden; position:relative; z-index:2; pointer-events:auto; margin-top:25px;][border=transparent; height:100%; width:200%; padding:0; overflow-y:scroll;][border=transparent; height:auto; width:50%; padding:0 12px 0 20px; box-sizing:border-box; margin-bottom:15px; --m: 15px;][border=transparent; height:0; width:100%; padding:0; margin-bottom:calc(var(--m) * -1 - 16px);][/border]
  84.  
  85. [comment]----copy this whole thing to add another section----[/comment]
  86. [border=transparent; height:auto; width:100%; padding:20px 0 5px 0; box-sizing:border-box; border-top:3px solid var(--color-1); margin-top: var(--m);]
  87. [border=transparent; height:auto; width:auto; padding:0; color: var(--color-1); font-size:19px; font-weight:bold; letter-spacing:2px; font-style:oblique; font-family: var(--header); line-height:100%; flex-shrink:0;][comment]
  88.  
  89. ----* * * section title here----
  90.  
  91. [/comment]Placeholder text:[/border]
  92.  
  93. [comment]----section contents----[/comment]
  94. [border=transparent; height:90%; max-height:84px; width:100%; padding:0 0 0 30px; box-sizing:border-box; overflow:hidden; margin-top:15px; 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:15px; line-height:17px; font-family: var(--body);][comment]
  95.  
  96. ----* * * text starts here----
  97.  
  98. [/comment]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum tincidunt vehicula pellentesque. Nam dui quam, congue et nulla eu, porttitor pretium mi. Maecenas ut urna quis diam lacinia rutrum. Aliquam finibus mi ex. Cras dignissim, ligula ut congue consequat, ante lectus pellentesque enim, sed bibendum quam tellus at nisi. Aliquam dapibus condimentum mauris quis ornare. Duis sed nisi tristique, elementum eros sed, lobortis lectus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum tincidunt vehicula pellentesque. Nam dui quam, congue et nulla eu, porttitor pretium mi. Maecenas ut urna quis diam lacinia rutrum. Aliquam finibus mi ex. Cras dignissim, ligula ut congue consequat, ante lectus pellentesque enim, sed bibendum quam tellus at nisi. Aliquam dapibus condimentum mauris quis ornare. Duis sed nisi tristique, elementum eros sed, lobortis lectus.
  99. [/border][/border][/border]
  100. [comment]----section contents end----[/comment]
  101. [/border]
  102. [comment]----copy me too!----[/comment]
  103.  
  104. [comment]----copy this whole thing to add another section----[/comment]
  105. [border=transparent; height:auto; width:100%; padding:20px 0 5px 0; box-sizing:border-box; border-top:3px solid var(--color-1); margin-top: var(--m);]
  106. [border=transparent; height:auto; width:auto; padding:0; color: var(--color-1); font-size:19px; font-weight:bold; letter-spacing:2px; font-style:oblique; font-family: var(--header); line-height:100%; flex-shrink:0;][comment]
  107.  
  108. ----* * * section title here----
  109.  
  110. [/comment]Placeholder text:[/border]
  111.  
  112. [comment]----section contents----[/comment]
  113. [border=transparent; height:90%; max-height:84px; width:100%; padding:0 0 0 30px; box-sizing:border-box; overflow:hidden; margin-top:15px; 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:15px; line-height:17px; font-family: var(--body);][comment]
  114.  
  115. ----* * * text starts here----
  116.  
  117. [/comment]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum tincidunt vehicula pellentesque. Nam dui quam, congue et nulla eu, porttitor pretium mi. Maecenas ut urna quis diam lacinia rutrum. Aliquam finibus mi ex. Cras dignissim, ligula ut congue consequat, ante lectus pellentesque enim, sed bibendum quam tellus at nisi. Aliquam dapibus condimentum mauris quis ornare. Duis sed nisi tristique, elementum eros sed, lobortis lectus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum tincidunt vehicula pellentesque. Nam dui quam, congue et nulla eu, porttitor pretium mi. Maecenas ut urna quis diam lacinia rutrum. Aliquam finibus mi ex. Cras dignissim, ligula ut congue consequat, ante lectus pellentesque enim, sed bibendum quam tellus at nisi. Aliquam dapibus condimentum mauris quis ornare. Duis sed nisi tristique, elementum eros sed, lobortis lectus.
  118. [/border][/border][/border]
  119. [comment]----section contents end----[/comment]
  120. [/border]
  121. [comment]----copy me too!----[/comment]
  122.  
  123. [comment]----copy this whole thing to add another section----[/comment]
  124. [border=transparent; height:auto; width:100%; padding:20px 0 5px 0; box-sizing:border-box; border-top:3px solid var(--color-1); margin-top: var(--m);]
  125. [border=transparent; height:auto; width:auto; padding:0; color: var(--color-1); font-size:19px; font-weight:bold; letter-spacing:2px; font-style:oblique; font-family: var(--header); line-height:100%; flex-shrink:0;][comment]
  126.  
  127. ----* * * section title here----
  128.  
  129. [/comment]Placeholder text:[/border]
  130.  
  131. [comment]----section contents----[/comment]
  132. [border=transparent; height:90%; max-height:84px; width:100%; padding:0 0 0 30px; box-sizing:border-box; overflow:hidden; margin-top:15px; 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:15px; line-height:17px; font-family: var(--body);][comment]
  133.  
  134. ----* * * text starts here----
  135.  
  136. [/comment]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum tincidunt vehicula pellentesque. Nam dui quam, congue et nulla eu, porttitor pretium mi. Maecenas ut urna quis diam lacinia rutrum. Aliquam finibus mi ex. Cras dignissim, ligula ut congue consequat, ante lectus pellentesque enim, sed bibendum quam tellus at nisi. Aliquam dapibus condimentum mauris quis ornare. Duis sed nisi tristique, elementum eros sed, lobortis lectus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum tincidunt vehicula pellentesque. Nam dui quam, congue et nulla eu, porttitor pretium mi. Maecenas ut urna quis diam lacinia rutrum. Aliquam finibus mi ex. Cras dignissim, ligula ut congue consequat, ante lectus pellentesque enim, sed bibendum quam tellus at nisi. Aliquam dapibus condimentum mauris quis ornare. Duis sed nisi tristique, elementum eros sed, lobortis lectus.
  137. [/border][/border][/border]
  138. [comment]----section contents end----[/comment]
  139. [/border]
  140. [comment]----copy me too!----[/comment]
  141.  
  142. [/border][/border][/border]
  143. [comment]----main contents end----[/comment]
  144. [/border]
  145. [comment]----tab contents end----[/comment]
  146. [/border][/tab]
  147. [comment]----tab 1 end----[/comment]
  148.  
  149.  
  150. [comment]----tab 2----[/comment]
  151. [tab=.][border=transparent; height:100%; width:100%; padding:15px; box-sizing:border-box; position:absolute; top:0; left:0; z-index:3; pointer-events:none; overflow:hidden; letter-spacing:0;]
  152. [comment]----background----[/comment]
  153. [border=transparent; height:100%; width:100%; padding:0; background: var(--bg-1); background-size:cover; position:absolute; top:0; left:0; z-index:1; pointer-events:none;][/border]
  154. [border=transparent; height:100%; width:100%; padding:0; background: var(--bg) 50% 50%; background-size:cover; position:absolute; top:0; left:0; z-index:1; opacity:0.7; pointer-events:none;][/border]
  155. [comment]----home button----[/comment]
  156. [border=transparent; height:auto; width:250px; padding:0; position:absolute; top:40px; left:22px; z-index:4; display:flex; justify-content:flex-end;][border=transparent; height:50px; width:30px; padding:0; color: var(--color-1); font-size:30px;][fa]fas fa-home[/fa][/border][/border]
  157.  
  158. [comment]----tab contents----[/comment]
  159. [border=transparent; height:100%; width:100%; padding:20px 0; border:4px solid var(--color-1); box-sizing:border-box; border-radius:15px; position:relative; z-index:3; display:flex; flex-flow:column nowrap;][border=transparent; height:100%; width:100%; padding:0; border-radius:12px; background: var(--bg-2); opacity:0.85; position:absolute; top:0; left:0;][/border]
  160.  
  161. [comment]----title----[/comment]
  162. [border=transparent; height:auto; width:100%; padding:0 20px; box-sizing:border-box; display:flex; flex-flow:row wrap; position:relative; z-index:4;][border=transparent; height:clamp(22px, 150px - 18vw, 40px); flex:1; min-width:250px; padding:0;][/border][border=transparent; height:auto; flex:1; min-width:clamp(200px, 100% - 250px, 600px); padding:0 8px 0 0; box-sizing:border-box; font-family: var(--header); font-weight:bold; font-size:22px; letter-spacing:5px; font-style:oblique; flex-shrink:0; line-height:100%; -webkit-text-stroke:1px var(--color-1); text-align:right; margin:3px 0 0 auto; flex-shrink:0; pointer-events:auto;][comment]
  163.  
  164. ----* * * info title here----
  165.  
  166. [/comment]Placeholder text[/border]
  167. [/border]
  168. [comment]----title end----[/comment]
  169.  
  170. [comment]----main contents----[/comment]
  171. [border=transparent; height:100%; width:100%; padding:0; box-sizing:border-box; overflow:hidden; position:relative; z-index:2; pointer-events:auto; margin-top:25px;][border=transparent; height:100%; width:200%; padding:0; overflow-y:scroll;][border=transparent; height:auto; width:50%; padding:0 12px 0 20px; box-sizing:border-box; margin-bottom:15px; --m: 15px;][border=transparent; height:0; width:100%; padding:0; margin-bottom:calc(var(--m) * -1 - 16px);][/border]
  172.  
  173. [comment]----copy this whole thing to add another section----[/comment]
  174. [border=transparent; height:auto; width:100%; padding:20px 0 5px 0; box-sizing:border-box; border-top:3px solid var(--color-1); margin-top: var(--m);]
  175. [border=transparent; height:auto; width:auto; padding:0; color: var(--color-1); font-size:19px; font-weight:bold; letter-spacing:2px; font-style:oblique; font-family: var(--header); line-height:100%; flex-shrink:0;][comment]
  176.  
  177. ----* * * section title here----
  178.  
  179. [/comment]Placeholder text:[/border]
  180.  
  181. [comment]----section contents----[/comment]
  182. [border=transparent; height:90%; max-height:84px; width:100%; padding:0 0 0 30px; box-sizing:border-box; overflow:hidden; margin-top:15px; 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:15px; line-height:17px; font-family: var(--body);][comment]
  183.  
  184. ----* * * text starts here----
  185.  
  186. [/comment]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum tincidunt vehicula pellentesque. Nam dui quam, congue et nulla eu, porttitor pretium mi. Maecenas ut urna quis diam lacinia rutrum. Aliquam finibus mi ex. Cras dignissim, ligula ut congue consequat, ante lectus pellentesque enim, sed bibendum quam tellus at nisi. Aliquam dapibus condimentum mauris quis ornare. Duis sed nisi tristique, elementum eros sed, lobortis lectus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum tincidunt vehicula pellentesque. Nam dui quam, congue et nulla eu, porttitor pretium mi. Maecenas ut urna quis diam lacinia rutrum. Aliquam finibus mi ex. Cras dignissim, ligula ut congue consequat, ante lectus pellentesque enim, sed bibendum quam tellus at nisi. Aliquam dapibus condimentum mauris quis ornare. Duis sed nisi tristique, elementum eros sed, lobortis lectus.
  187. [/border][/border][/border]
  188. [comment]----section contents end----[/comment]
  189. [/border]
  190. [comment]----copy me too!----[/comment]
  191.  
  192. [comment]----copy this whole thing to add another section----[/comment]
  193. [border=transparent; height:auto; width:100%; padding:20px 0 5px 0; box-sizing:border-box; border-top:3px solid var(--color-1); margin-top: var(--m);]
  194. [border=transparent; height:auto; width:auto; padding:0; color: var(--color-1); font-size:19px; font-weight:bold; letter-spacing:2px; font-style:oblique; font-family: var(--header); line-height:100%; flex-shrink:0;][comment]
  195.  
  196. ----* * * section title here----
  197.  
  198. [/comment]Placeholder text:[/border]
  199.  
  200. [comment]----section contents----[/comment]
  201. [border=transparent; height:90%; max-height:84px; width:100%; padding:0 0 0 30px; box-sizing:border-box; overflow:hidden; margin-top:15px; 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:15px; line-height:17px; font-family: var(--body);][comment]
  202.  
  203. ----* * * text starts here----
  204.  
  205. [/comment]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum tincidunt vehicula pellentesque. Nam dui quam, congue et nulla eu, porttitor pretium mi. Maecenas ut urna quis diam lacinia rutrum. Aliquam finibus mi ex. Cras dignissim, ligula ut congue consequat, ante lectus pellentesque enim, sed bibendum quam tellus at nisi. Aliquam dapibus condimentum mauris quis ornare. Duis sed nisi tristique, elementum eros sed, lobortis lectus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum tincidunt vehicula pellentesque. Nam dui quam, congue et nulla eu, porttitor pretium mi. Maecenas ut urna quis diam lacinia rutrum. Aliquam finibus mi ex. Cras dignissim, ligula ut congue consequat, ante lectus pellentesque enim, sed bibendum quam tellus at nisi. Aliquam dapibus condimentum mauris quis ornare. Duis sed nisi tristique, elementum eros sed, lobortis lectus.
  206. [/border][/border][/border]
  207. [comment]----section contents end----[/comment]
  208. [/border]
  209. [comment]----copy me too!----[/comment]
  210.  
  211. [comment]----copy this whole thing to add another section----[/comment]
  212. [border=transparent; height:auto; width:100%; padding:20px 0 5px 0; box-sizing:border-box; border-top:3px solid var(--color-1); margin-top: var(--m);]
  213. [border=transparent; height:auto; width:auto; padding:0; color: var(--color-1); font-size:19px; font-weight:bold; letter-spacing:2px; font-style:oblique; font-family: var(--header); line-height:100%; flex-shrink:0;][comment]
  214.  
  215. ----* * * section title here----
  216.  
  217. [/comment]Placeholder text:[/border]
  218.  
  219. [comment]----section contents----[/comment]
  220. [border=transparent; height:90%; max-height:84px; width:100%; padding:0 0 0 30px; box-sizing:border-box; overflow:hidden; margin-top:15px; 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:15px; line-height:17px; font-family: var(--body);][comment]
  221.  
  222. ----* * * text starts here----
  223.  
  224. [/comment]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum tincidunt vehicula pellentesque. Nam dui quam, congue et nulla eu, porttitor pretium mi. Maecenas ut urna quis diam lacinia rutrum. Aliquam finibus mi ex. Cras dignissim, ligula ut congue consequat, ante lectus pellentesque enim, sed bibendum quam tellus at nisi. Aliquam dapibus condimentum mauris quis ornare. Duis sed nisi tristique, elementum eros sed, lobortis lectus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum tincidunt vehicula pellentesque. Nam dui quam, congue et nulla eu, porttitor pretium mi. Maecenas ut urna quis diam lacinia rutrum. Aliquam finibus mi ex. Cras dignissim, ligula ut congue consequat, ante lectus pellentesque enim, sed bibendum quam tellus at nisi. Aliquam dapibus condimentum mauris quis ornare. Duis sed nisi tristique, elementum eros sed, lobortis lectus.
  225. [/border][/border][/border]
  226. [comment]----section contents end----[/comment]
  227. [/border]
  228. [comment]----copy me too!----[/comment]
  229.  
  230. [/border][/border][/border]
  231. [comment]----main contents end----[/comment]
  232. [/border]
  233. [comment]----tab contents end----[/comment]
  234. [/border][/tab]
  235. [comment]----tab 2 end----[/comment]
  236.  
  237.  
  238. [comment]----tab 3----[/comment]
  239. [tab=.][border=transparent; height:100%; width:100%; padding:15px; box-sizing:border-box; position:absolute; top:0; left:0; z-index:3; pointer-events:none; overflow:hidden; letter-spacing:0;]
  240. [comment]----background----[/comment]
  241. [border=transparent; height:100%; width:100%; padding:0; background: var(--bg-1); background-size:cover; position:absolute; top:0; left:0; z-index:1; pointer-events:none;][/border]
  242. [border=transparent; height:100%; width:100%; padding:0; background: var(--bg) 50% 50%; background-size:cover; position:absolute; top:0; left:0; z-index:1; opacity:0.7; pointer-events:none;][/border]
  243. [comment]----home button----[/comment]
  244. [border=transparent; height:auto; width:250px; padding:0; position:absolute; top:40px; left:22px; z-index:4; display:flex; justify-content:flex-end;][border=transparent; height:50px; width:30px; padding:0; color: var(--color-1); font-size:30px;][fa]fas fa-home[/fa][/border][/border]
  245.  
  246. [comment]----tab contents----[/comment]
  247. [border=transparent; height:100%; width:100%; padding:20px 0; border:4px solid var(--color-1); box-sizing:border-box; border-radius:15px; position:relative; z-index:3; display:flex; flex-flow:column nowrap;][border=transparent; height:100%; width:100%; padding:0; border-radius:12px; background: var(--bg-2); opacity:0.85; position:absolute; top:0; left:0;][/border]
  248.  
  249. [comment]----title----[/comment]
  250. [border=transparent; height:auto; width:100%; padding:0 20px; box-sizing:border-box; display:flex; flex-flow:row wrap; position:relative; z-index:4;][border=transparent; height:clamp(22px, 150px - 18vw, 40px); flex:1; min-width:250px; padding:0;][/border][border=transparent; height:auto; flex:1; min-width:clamp(200px, 100% - 250px, 600px); padding:0 8px 0 0; box-sizing:border-box; font-family: var(--header); font-weight:bold; font-size:22px; letter-spacing:5px; font-style:oblique; flex-shrink:0; line-height:100%; -webkit-text-stroke:1px var(--color-1); text-align:right; margin:3px 0 0 auto; flex-shrink:0; pointer-events:auto;][comment]
  251.  
  252. ----* * * info title here----
  253.  
  254. [/comment]Placeholder text[/border]
  255. [/border]
  256. [comment]----title end----[/comment]
  257.  
  258. [comment]----main contents----[/comment]
  259. [border=transparent; height:100%; width:100%; padding:0; box-sizing:border-box; overflow:hidden; position:relative; z-index:2; pointer-events:auto; margin-top:25px;][border=transparent; height:100%; width:200%; padding:0; overflow-y:scroll;][border=transparent; height:auto; width:50%; padding:0 12px 0 20px; box-sizing:border-box; margin-bottom:15px; --m: 15px;][border=transparent; height:0; width:100%; padding:0; margin-bottom:calc(var(--m) * -1 - 16px);][/border]
  260.  
  261. [comment]----copy this whole thing to add another section----[/comment]
  262. [border=transparent; height:auto; width:100%; padding:20px 0 5px 0; box-sizing:border-box; border-top:3px solid var(--color-1); margin-top: var(--m);]
  263. [border=transparent; height:auto; width:auto; padding:0; color: var(--color-1); font-size:19px; font-weight:bold; letter-spacing:2px; font-style:oblique; font-family: var(--header); line-height:100%; flex-shrink:0;][comment]
  264.  
  265. ----* * * section title here----
  266.  
  267. [/comment]Placeholder text:[/border]
  268.  
  269. [comment]----section contents----[/comment]
  270. [border=transparent; height:90%; max-height:84px; width:100%; padding:0 0 0 30px; box-sizing:border-box; overflow:hidden; margin-top:15px; 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:15px; line-height:17px; font-family: var(--body);][comment]
  271.  
  272. ----* * * text starts here----
  273.  
  274. [/comment]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum tincidunt vehicula pellentesque. Nam dui quam, congue et nulla eu, porttitor pretium mi. Maecenas ut urna quis diam lacinia rutrum. Aliquam finibus mi ex. Cras dignissim, ligula ut congue consequat, ante lectus pellentesque enim, sed bibendum quam tellus at nisi. Aliquam dapibus condimentum mauris quis ornare. Duis sed nisi tristique, elementum eros sed, lobortis lectus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum tincidunt vehicula pellentesque. Nam dui quam, congue et nulla eu, porttitor pretium mi. Maecenas ut urna quis diam lacinia rutrum. Aliquam finibus mi ex. Cras dignissim, ligula ut congue consequat, ante lectus pellentesque enim, sed bibendum quam tellus at nisi. Aliquam dapibus condimentum mauris quis ornare. Duis sed nisi tristique, elementum eros sed, lobortis lectus.
  275. [/border][/border][/border]
  276. [comment]----section contents end----[/comment]
  277. [/border]
  278. [comment]----copy me too!----[/comment]
  279.  
  280. [comment]----copy this whole thing to add another section (stats)----[/comment]
  281. [border=transparent; height:auto; width:100%; padding:20px 10px 5px 10px; box-sizing:border-box; border-top:3px solid var(--color-1); margin-top: var(--m); --m-s:17px;]
  282. [comment]----number markings----[/comment]
  283. [border=transparent; height:auto; flex:1; padding:0; color: var(--t-color); font-size:12px; display:flex; flex-flow:row nowrap; font-family: var(--body); margin-left:auto;][border=transparent; height:16px; flex:30; min-width:100px; padding:0; flex-shrink:0; margin-right:20px;][/border][border=transparent; height:auto; flex:60; padding:0; display:flex; flex-flow:row nowrap; line-height:100%;][border=transparent; height:auto; width:30px; padding:0;]0[/border][border=transparent; height:auto; width:30px; padding:0; margin:0 auto; text-align:center;]50[/border][border=transparent; height:auto; width:30px; padding:0;]100[/border][/border][/border]
  284. [border=transparent; height:0; width:100%; padding:0; margin-bottom:calc(var(--m-s) * -1 + 5px);][/border]
  285.  
  286.  
  287. [comment]----copy this whole thing to add another bar----[/comment]
  288. [border=transparent; height:auto; width:100%; padding:0; display:flex; flex-flow:row nowrap; align-items:center; margin-top: var(--m-s);]
  289. [border=transparent; height:auto; flex:30; min-width:100px; padding:0; color: var(--t-color); font-size:15px; font-family: var(--header); font-style:oblique; line-height:100%; text-align:right;][comment]
  290.  
  291. ----* * * stat title here----
  292.  
  293. [/comment]Speed[/border]
  294.  
  295. [border=transparent; height:16px; flex:60; padding:0; margin-left:20px;][border=transparent; height:100%; background: var(--color-1); padding:0;
  296.  
  297. /*edit the following to adjust width of stat bars*/ width:70%;
  298.  
  299. min-width:5px;][/border][/border]
  300. [/border]
  301. [comment]----copy me too! (bar)----[/comment]
  302.  
  303. [comment]----copy this whole thing to add another bar----[/comment]
  304. [border=transparent; height:auto; width:100%; padding:0; display:flex; flex-flow:row nowrap; align-items:center; margin-top: var(--m-s);]
  305. [border=transparent; height:auto; flex:30; min-width:100px; padding:0; color: var(--t-color); font-size:15px; font-family: var(--header); font-style:oblique; line-height:100%; text-align:right;][comment]
  306.  
  307. ----* * * stat title here----
  308.  
  309. [/comment]Strength[/border]
  310.  
  311. [border=transparent; height:16px; flex:60; padding:0; margin-left:20px;][border=transparent; height:100%; background: var(--color-1); padding:0;
  312.  
  313. /*edit the following to adjust width of stat bars*/ width:100%;
  314.  
  315. min-width:5px;][/border][/border]
  316. [/border]
  317. [comment]----copy me too! (bar)----[/comment]
  318.  
  319. [comment]----copy this whole thing to add another bar----[/comment]
  320. [border=transparent; height:auto; width:100%; padding:0; display:flex; flex-flow:row nowrap; align-items:center; margin-top: var(--m-s);]
  321. [border=transparent; height:auto; flex:30; min-width:100px; padding:0; color: var(--t-color); font-size:15px; font-family: var(--header); font-style:oblique; line-height:100%; text-align:right;][comment]
  322.  
  323. ----* * * stat title here----
  324.  
  325. [/comment]Control[/border]
  326.  
  327. [border=transparent; height:16px; flex:60; padding:0; margin-left:20px;][border=transparent; height:100%; background: var(--color-1); padding:0;
  328.  
  329. /*edit the following to adjust width of stat bars*/ width:20%;
  330.  
  331. min-width:5px;][/border][/border]
  332. [/border]
  333. [comment]----copy me too! (bar)----[/comment]
  334.  
  335. [comment]----copy this whole thing to add another bar----[/comment]
  336. [border=transparent; height:auto; width:100%; padding:0; display:flex; flex-flow:row nowrap; align-items:center; margin-top: var(--m-s);]
  337. [border=transparent; height:auto; flex:30; min-width:100px; padding:0; color: var(--t-color); font-size:15px; font-family: var(--header); font-style:oblique; line-height:100%; text-align:right;][comment]
  338.  
  339. ----* * * stat title here----
  340.  
  341. [/comment]Raw Power[/border]
  342.  
  343. [border=transparent; height:16px; flex:60; padding:0; margin-left:20px;][border=transparent; height:100%; background: var(--color-1); padding:0;
  344.  
  345. /*edit the following to adjust width of stat bars*/ width:50%;
  346.  
  347. min-width:5px;][/border][/border]
  348. [/border]
  349. [comment]----copy me too! (bar)----[/comment]
  350.  
  351. [comment]----copy this whole thing to add another bar----[/comment]
  352. [border=transparent; height:auto; width:100%; padding:0; display:flex; flex-flow:row nowrap; align-items:center; margin-top: var(--m-s);]
  353. [border=transparent; height:auto; flex:30; min-width:100px; padding:0; color: var(--t-color); font-size:15px; font-family: var(--header); font-style:oblique; line-height:100%; text-align:right;][comment]
  354.  
  355. ----* * * stat title here----
  356.  
  357. [/comment]Dexterity[/border]
  358.  
  359. [border=transparent; height:16px; flex:60; padding:0; margin-left:20px;][border=transparent; height:100%; background: var(--color-1); padding:0;
  360.  
  361. /*edit the following to adjust width of stat bars*/ width:100%;
  362.  
  363. min-width:5px;][/border][/border]
  364. [/border]
  365. [comment]----copy me too! (bar)----[/comment]
  366.  
  367. [/border]
  368. [comment]----copy me too!----[/comment]
  369.  
  370. [/border][/border][/border]
  371. [comment]----main contents end----[/comment]
  372. [/border]
  373. [comment]----tab contents end----[/comment]
  374. [/border][/tab]
  375. [comment]----tab 3 end----[/comment]
  376.  
  377.  
  378. [comment]----tab 4----[/comment]
  379. [tab=.][border=transparent; height:100%; width:100%; padding:15px; box-sizing:border-box; position:absolute; top:0; left:0; z-index:3; pointer-events:none; overflow:hidden; letter-spacing:0;]
  380. [comment]----background----[/comment]
  381. [border=transparent; height:100%; width:100%; padding:0; background: var(--bg-1); background-size:cover; position:absolute; top:0; left:0; z-index:1; pointer-events:none;][/border]
  382. [border=transparent; height:100%; width:100%; padding:0; background: var(--bg) 50% 50%; background-size:cover; position:absolute; top:0; left:0; z-index:1; opacity:0.7; pointer-events:none;][/border]
  383. [comment]----home button----[/comment]
  384. [border=transparent; height:auto; width:250px; padding:0; position:absolute; top:40px; left:22px; z-index:4; display:flex; justify-content:flex-end;][border=transparent; height:50px; width:30px; padding:0; color: var(--color-1); font-size:30px;][fa]fas fa-home[/fa][/border][/border]
  385.  
  386. [comment]----tab contents----[/comment]
  387. [border=transparent; height:100%; width:100%; padding:20px 0; border:4px solid var(--color-1); box-sizing:border-box; border-radius:15px; position:relative; z-index:3; display:flex; flex-flow:column nowrap;][border=transparent; height:100%; width:100%; padding:0; border-radius:12px; background: var(--bg-2); opacity:0.85; position:absolute; top:0; left:0;][/border]
  388.  
  389. [comment]----title----[/comment]
  390. [border=transparent; height:auto; width:100%; padding:0 20px; box-sizing:border-box; display:flex; flex-flow:row wrap; position:relative; z-index:4;][border=transparent; height:clamp(22px, 150px - 18vw, 40px); flex:1; min-width:250px; padding:0;][/border][border=transparent; height:auto; flex:1; min-width:clamp(200px, 100% - 250px, 600px); padding:0 8px 0 0; box-sizing:border-box; font-family: var(--header); font-weight:bold; font-size:22px; letter-spacing:5px; font-style:oblique; flex-shrink:0; line-height:100%; -webkit-text-stroke:1px var(--color-1); text-align:right; margin:3px 0 0 auto; flex-shrink:0; pointer-events:auto;][comment]
  391.  
  392. ----* * * info title here----
  393.  
  394. [/comment]Placeholder text[/border]
  395. [/border]
  396. [comment]----title end----[/comment]
  397.  
  398. [comment]----main contents----[/comment]
  399. [border=transparent; height:100%; width:100%; padding:0; box-sizing:border-box; overflow:hidden; position:relative; z-index:2; pointer-events:auto; margin-top:25px;][border=transparent; height:100%; width:200%; padding:0; overflow-y:scroll;][border=transparent; height:auto; width:50%; padding:0 12px 0 20px; box-sizing:border-box;][border=transparent; height:auto; width:85%; padding:0; margin:0 auto; display:flex; flex-flow:row wrap; --m:12px 8px 4px 8px;]
  400.  
  401. [comment]----copy this whole thing to add another image----[/comment]
  402. [border=transparent; flex:1; min-width:clamp(70px, 25%, 180px); max-width:180px; padding:0; margin:var(--m);][border=transparent; padding:0; padding-top:100%;
  403.  
  404. /*change number in --gimg-X here to match variables at the top*/ background: var(--gimg-1);
  405.  
  406. /*adjust cropping of image here*/ background-position:50% 50%;
  407.  
  408. background-size:cover;][/border][/border]
  409. [comment]----copy me too!----[/comment]
  410.  
  411. [comment]----copy this whole thing to add another image----[/comment]
  412. [border=transparent; flex:1; min-width:clamp(70px, 25%, 180px); max-width:180px; padding:0; margin:var(--m);][border=transparent; padding:0; padding-top:100%;
  413.  
  414. /*change number in --gimg-X here to match variables at the top*/ background: var(--gimg-2);
  415.  
  416. /*adjust cropping of image here*/ background-position:50% 50%;
  417.  
  418. background-size:cover;][/border][/border]
  419. [comment]----copy me too!----[/comment]
  420.  
  421. [comment]----copy this whole thing to add another image----[/comment]
  422. [border=transparent; flex:1; min-width:clamp(70px, 25%, 180px); max-width:180px; padding:0; margin:var(--m);][border=transparent; padding:0; padding-top:100%;
  423.  
  424. /*change number in --gimg-X here to match variables at the top*/ background: var(--gimg-3);
  425.  
  426. /*adjust cropping of image here*/ background-position:50% 50%;
  427.  
  428. background-size:cover;][/border][/border]
  429. [comment]----copy me too!----[/comment]
  430.  
  431. [comment]----copy this whole thing to add another image----[/comment]
  432. [border=transparent; flex:1; min-width:clamp(70px, 25%, 180px); max-width:180px; padding:0; margin:var(--m);][border=transparent; padding:0; padding-top:100%;
  433.  
  434. /*change number in --gimg-X here to match variables at the top*/ background: var(--gimg-4);
  435.  
  436. /*adjust cropping of image here*/ background-position:50% 50%;
  437.  
  438. background-size:cover;][/border][/border]
  439. [comment]----copy me too!----[/comment]
  440.  
  441. [comment]----copy this whole thing to add another image----[/comment]
  442. [border=transparent; flex:1; min-width:clamp(70px, 25%, 180px); max-width:180px; padding:0; margin:var(--m);][border=transparent; padding:0; padding-top:100%;
  443.  
  444. /*change number in --gimg-X here to match variables at the top*/ background: var(--gimg-5);
  445.  
  446. /*adjust cropping of image here*/ background-position:50% 50%;
  447.  
  448. background-size:cover;][/border][/border]
  449. [comment]----copy me too!----[/comment]
  450.  
  451. [comment]----copy this whole thing to add another image----[/comment]
  452. [border=transparent; flex:1; min-width:clamp(70px, 25%, 180px); max-width:180px; padding:0; margin:var(--m);][border=transparent; padding:0; padding-top:100%;
  453.  
  454. /*change number in --gimg-X here to match variables at the top*/ background: var(--gimg-6);
  455.  
  456. /*adjust cropping of image here*/ background-position:50% 50%;
  457.  
  458. background-size:cover;][/border][/border]
  459. [comment]----copy me too!----[/comment]
  460.  
  461. [/border][/border][/border][/border]
  462. [comment]----main contents end----[/comment]
  463. [/border]
  464. [comment]----tab contents end----[/comment]
  465. [/border][/tab]
  466. [comment]----tab 4 end----[/comment]
  467.  
  468.  
  469. [tab=.]filler tab, ignore![/tab]
  470. [/tabs][/border][/border]
  471. [comment]----tabs end----[/comment]
  472.  
  473.  
  474. [comment]----lobby tab----[/comment]
  475. [border=transparent; height:100%; width:100%; padding:15px; box-sizing:border-box; position:absolute; top:0; left:0; z-index:2; pointer-events:none;][border=transparent; height:100%; width:100%; padding:0; box-sizing:border-box; border:4px solid var(--color-1); box-sizing:border-box; border-radius:15px; position:relative;][border=transparent; height:100%; width:100%; padding:0; border-radius:12px; background: var(--bg-2); opacity:0.85; position:absolute; top:0; left:0;][/border]
  476. [comment]----contents----[/comment]
  477. [border=transparent; height:365px; width:100%; padding:20px 0 10px 0; box-sizing:border-box; overflow:hidden; position:relative; z-index:3; margin-top:30px;][border=transparent; height:100%; width:200%; padding:0; overflow-y:scroll; pointer-events:auto;][border=transparent; min-height:100%; height:auto; width:50%; padding:0 7px 0 10px; box-sizing:border-box; display:flex; flex-flow:row wrap;]
  478.  
  479. [comment]----left----[/comment]
  480. [border=transparent; height:auto; min-height:120px; flex:41; min-width:200px; padding:10px 0 0 0; box-sizing:border-box; box-sizing:border-box; display:flex; flex-flow:row wrap; align-items:center;]
  481. [comment]----image----[/comment]
  482. [border=transparent; flex:40; min-width:clamp(60px, 20vw, 180px); padding:0; margin:10px;][border=transparent; padding:0; padding-top:100%; background: var(--img-1); border-radius:12px; background-size:cover;
  483.  
  484. /*edit the following to adjust the cropping of the image*/ background-position:50% 50%;][/border][/border]
  485.  
  486. [comment]----details----[/comment]
  487. [border=transparent; flex:60; height:52px; min-width:100px; padding:0; overflow:hidden; margin:10px; pointer-events:auto;][border=transparent; height:100%; width:200%; padding:0; overflow-y:scroll;][border=transparent; height:auto; width:50%; padding:0; --m: 15px;][border=transparent; height:0; width:100%; padding:0; margin-bottom:calc(var(--m) * -1);][/border]
  488.  
  489. [comment]----copy this whole thing to add another piece of info----[/comment]
  490. [border=transparent; height:auto; width:100%; padding:0; margin-top:calc(var(--m) - 4px); display:flex; flex-flow:row wrap; font-family: var(--body); font-size:15px;]
  491. [border=transparent; height:auto; width:auto; padding:0; color: var(--color-1); line-height:17px; margin:4px 8px 0 0;][comment]
  492.  
  493. ----* * * info title here----
  494.  
  495. [/comment]Sexuality:[/border]
  496. [border=transparent; height:auto; flex:1; min-width:fit-content; min-width:-moz-fit-content; padding:0; line-height:17px; margin:4px 0 0 0; color: var(--t-color);][comment]
  497.  
  498. ----* * * info contents here----
  499.  
  500. [/comment]Answer[/border]
  501. [/border]
  502. [comment]----copy me too!----[/comment]
  503.  
  504. [comment]----copy this whole thing to add another piece of info----[/comment]
  505. [border=transparent; height:auto; width:100%; padding:0; margin-top:calc(var(--m) - 4px); display:flex; flex-flow:row wrap; font-family: var(--body); font-size:15px;]
  506. [border=transparent; height:auto; width:auto; padding:0; color: var(--color-1); line-height:17px; margin:4px 8px 0 0;][comment]
  507.  
  508. ----* * * info title here----
  509.  
  510. [/comment]Mbti:[/border]
  511. [border=transparent; height:auto; flex:1; min-width:fit-content; min-width:-moz-fit-content; padding:0; line-height:17px; margin:4px 0 0 0; color: var(--t-color);][comment]
  512.  
  513. ----* * * info contents here----
  514.  
  515. [/comment]Answer[/border]
  516. [/border]
  517. [comment]----copy me too!----[/comment]
  518.  
  519. [comment]----copy this whole thing to add another piece of info----[/comment]
  520. [border=transparent; height:auto; width:100%; padding:0; margin-top:calc(var(--m) - 4px); display:flex; flex-flow:row wrap; font-family: var(--body); font-size:15px;]
  521. [border=transparent; height:auto; width:auto; padding:0; color: var(--color-1); line-height:17px; margin:4px 8px 0 0;][comment]
  522.  
  523. ----* * * info title here----
  524.  
  525. [/comment]Mbti:[/border]
  526. [border=transparent; height:auto; flex:1; min-width:fit-content; min-width:-moz-fit-content; padding:0; line-height:17px; margin:4px 0 0 0; color: var(--t-color);][comment]
  527.  
  528. ----* * * info contents here----
  529.  
  530. [/comment]Answer[/border]
  531. [/border]
  532. [comment]----copy me too!----[/comment]
  533.  
  534. [/border][/border][/border]
  535. [comment]----details end----[/comment]
  536. [/border]
  537. [comment]----left end----[/comment]
  538.  
  539. [comment]----right----[/comment]
  540. [border=transparent; height:315px; flex:59; min-width:200px; padding:0; box-sizing:border-box; margin:10px clamp(2px, -50px + 8vw, 10px) 10px 10px; display:flex; flex-flow:column nowrap; pointer-events:auto; overflow:hidden;]
  541.  
  542. [comment]----title----[/comment]
  543. [border=transparent; height:auto; width:100%; padding:0; display:flex; flex-flow:row nowrap; font-family: var(--header); font-weight:bold; font-size:22px; letter-spacing:5px; font-style:oblique; flex-shrink:0;]
  544. [border=transparent; height:auto; width:auto; padding:0; color: var(--color-1); line-height:100%; margin:4px 15px 0 0; -webkit-text-stroke:1px var(--color-1);][comment]
  545.  
  546. ----* * * info title here----
  547.  
  548. [/comment]Name:[/border]
  549. [border=transparent; height:auto; flex:1; min-width:fit-content; min-width:-moz-fit-content; padding:0; line-height:100%; margin:4px 0 0 0; color: var(--t-color); -webkit-text-stroke:1px var(--t-color);][comment]
  550.  
  551. ----* * * info contents here----
  552.  
  553. [/comment]Answer[/border]
  554. [/border]
  555. [comment]----title end----[/comment]
  556.  
  557. [comment]----contents----[/comment]
  558. [border=transparent; height:90%; width:100%; padding:0; display:flex; flex-flow:column nowrap; margin-top:10px;]
  559. [comment]----basics----[/comment]
  560. [border=transparent; height:160px; width:100%; padding:0; overflow:hidden; flex-shrink:0;][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; --m:21px 10px 10px 0;]
  561.  
  562. [comment]----copy this whole thing to add another piece of info----[/comment]
  563. [border=transparent; height:auto; flex:1; flex-shrink:0; min-width:40%; padding:0; margin: var(--m); display:flex; flex-flow:row wrap; font-family: var(--body); font-size:15px;]
  564. [border=transparent; height:auto; width:auto; padding:0; color: var(--color-1); line-height:17px; margin:4px 8px 0 0;][comment]
  565.  
  566. ----* * * info title here----
  567.  
  568. [/comment]Age:[/border]
  569. [border=transparent; height:auto; flex:1; min-width:fit-content; min-width:-moz-fit-content; padding:0; line-height:17px; margin:4px 0 0 0; color: var(--t-color);][comment]
  570.  
  571. ----* * * info contents here----
  572.  
  573. [/comment]#[/border]
  574. [/border]
  575. [comment]----copy me too!----[/comment]
  576.  
  577. [comment]----copy this whole thing to add another piece of info----[/comment]
  578. [border=transparent; height:auto; flex:1; flex-shrink:0; min-width:40%; padding:0; margin: var(--m); display:flex; flex-flow:row wrap; font-family: var(--body); font-size:15px;]
  579. [border=transparent; height:auto; width:auto; padding:0; color: var(--color-1); line-height:17px; margin:4px 8px 0 0;][comment]
  580.  
  581. ----* * * info title here----
  582.  
  583. [/comment]Dob:[/border]
  584. [border=transparent; height:auto; flex:1; min-width:fit-content; min-width:-moz-fit-content; padding:0; line-height:17px; margin:4px 0 0 0; color: var(--t-color);][comment]
  585.  
  586. ----* * * info contents here----
  587.  
  588. [/comment]##/##/####[/border]
  589. [/border]
  590. [comment]----copy me too!----[/comment]
  591.  
  592. [comment]----copy this whole thing to add another piece of info----[/comment]
  593. [border=transparent; height:auto; flex:1 0; min-width:30%; padding:0; margin: var(--m); display:flex; flex-flow:row wrap; font-family: var(--body); font-size:15px;]
  594. [border=transparent; height:auto; width:auto; padding:0; color: var(--color-1); line-height:17px; margin:4px 8px 0 0;][comment]
  595.  
  596. ----* * * info title here----
  597.  
  598. [/comment]Height:[/border]
  599. [border=transparent; height:auto; flex:1; min-width:fit-content; min-width:-moz-fit-content; padding:0; line-height:17px; margin:4px 0 0 0; color: var(--t-color);][comment]
  600.  
  601. ----* * * info contents here----
  602.  
  603. [/comment]Text here[/border]
  604. [/border]
  605. [comment]----copy me too!----[/comment]
  606.  
  607. [comment]----copy this whole thing to add another piece of info----[/comment]
  608. [border=transparent; height:auto; flex:1; flex-shrink:0; min-width:40%; padding:0; margin: var(--m); display:flex; flex-flow:row wrap; font-family: var(--body); font-size:15px;]
  609. [border=transparent; height:auto; width:auto; padding:0; color: var(--color-1); line-height:17px; margin:4px 8px 0 0;][comment]
  610.  
  611. ----* * * info title here----
  612.  
  613. [/comment]Weight:[/border]
  614. [border=transparent; height:auto; flex:1; min-width:fit-content; min-width:-moz-fit-content; padding:0; line-height:17px; margin:4px 0 0 0; color: var(--t-color);][comment]
  615.  
  616. ----* * * info contents here----
  617.  
  618. [/comment]Text here[/border]
  619. [/border]
  620. [comment]----copy me too!----[/comment]
  621.  
  622. [comment]----copy this whole thing to add another piece of info----[/comment]
  623. [border=transparent; height:auto; flex:1 0; min-width:30%; padding:0; margin: var(--m); display:flex; flex-flow:row wrap; font-family: var(--body); font-size:15px;]
  624. [border=transparent; height:auto; width:auto; padding:0; color: var(--color-1); line-height:17px; margin:4px 8px 0 0;][comment]
  625.  
  626. ----* * * info title here----
  627.  
  628. [/comment]Gender:[/border]
  629. [border=transparent; height:auto; flex:1; min-width:fit-content; min-width:-moz-fit-content; padding:0; line-height:17px; margin:4px 0 0 0; color: var(--t-color);][comment]
  630.  
  631. ----* * * info contents here----
  632.  
  633. [/comment]Text here[/border]
  634. [/border]
  635. [comment]----copy me too!----[/comment]
  636.  
  637. [comment]----copy this whole thing to add another piece of info----[/comment]
  638. [border=transparent; height:auto; flex:1; flex-shrink:0; min-width:40%; padding:0; margin: var(--m); display:flex; flex-flow:row wrap; font-family: var(--body); font-size:15px;]
  639. [border=transparent; height:auto; width:auto; padding:0; color: var(--color-1); line-height:17px; margin:4px 8px 0 0;][comment]
  640.  
  641. ----* * * info title here----
  642.  
  643. [/comment]Race:[/border]
  644. [border=transparent; height:auto; flex:1; min-width:fit-content; min-width:-moz-fit-content; padding:0; line-height:17px; margin:4px 0 0 0; color: var(--t-color);][comment]
  645.  
  646. ----* * * info contents here----
  647.  
  648. [/comment]Text here[/border]
  649. [/border]
  650. [comment]----copy me too!----[/comment]
  651.  
  652. [/border][/border][/border]
  653. [comment]----basics end----[/comment]
  654.  
  655. [comment]----extra----[/comment]
  656. [border=transparent; height:101px; width:100%; padding:0; margin-top:15px; overflow:hidden;][border=transparent; height:100%; width:200%; padding:0; overflow-y:scroll;][border=transparent; height:auto; width:50%; padding:0; --m: 15px;][border=transparent; height:0; width:100%; padding:0; margin-bottom: calc(var(--m) * -1);][/border]
  657.  
  658. [comment]----copy this whole thing to add another piece of info----[/comment]
  659. [border=transparent; height:auto; width:100%; padding:0; margin-top: var(--m); font-family: var(--body); font-size:15px; line-height:17px; color: var(--t-color);][border=transparent; height:auto; width:auto; padding:0; color: var(--color-1); margin:0 5px 0 0; display:inline-block;][comment]
  660.  
  661. ----* * * info title here----
  662.  
  663. [/comment]Extra:[/border][comment]
  664.  
  665. ----* * * info contents here----
  666.  
  667. [/comment]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum tincidunt vehicula pellentesque. Nam dui quam, congue et nulla eu, porttitor pretium mi.
  668. [/border]
  669. [comment]----copy me too!----[/comment]
  670.  
  671. [comment]----copy this whole thing to add another piece of info----[/comment]
  672. [border=transparent; height:auto; width:100%; padding:0; margin-top: var(--m); font-family: var(--body); font-size:15px; line-height:17px; color: var(--t-color);][border=transparent; height:auto; width:auto; padding:0; color: var(--color-1); margin:0 5px 0 0; display:inline-block;][comment]
  673.  
  674. ----* * * info title here----
  675.  
  676. [/comment]Country of Origin:[/border][comment]
  677.  
  678. ----* * * info contents here----
  679.  
  680. [/comment]Lorem ipsum. This whole section will scroll!
  681. [/border]
  682. [comment]----copy me too!----[/comment]
  683.  
  684. [/border][/border][/border]
  685. [comment]----extra end----[/comment]
  686.  
  687. [/border]
  688. [comment]----contents end----[/comment]
  689. [/border]
  690. [comment]----right end----[/comment]
  691. [/border][/border][/border]
  692. [comment]----contents end----[/comment]
  693. [/border][/border]
  694. [comment]----lobby tab end----[/comment]
  695.  
  696.  
  697. [comment]----image background (for tab lobby)----[/comment]
  698. [border=transparent; height:100%; width:100%; padding:0; background: var(--bg-1); background-size:cover; position:absolute; top:0; left:0; z-index:1; pointer-events:none;][/border]
  699. [border=transparent; height:100%; width:100%; padding:0; background: var(--bg) 50% 50%; background-size:cover; position:absolute; top:0; left:0; z-index:1; opacity:0.7; pointer-events:none;][/border]
  700.  
  701. [/border][comment]----signature! (do not remove!)-----
  702. [/comment][bg=transparent; height:auto; width:100%; padding:0; position:absolute; bottom:15px; left:10px; z-index:7; text-align:center; box-sizing:border-box; opacity:0.65;font-size:10px;text-align:center; line-height:100%;][font=Open Sans]♡design by misorauni, coded by uxie♡[/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!