API tools faq
paste
Advertisement
ooksie

opportunity

ooksie
Feb 11th, 2020
204
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 23.02 KB | None | 0 0
raw download clone embed print report
  1. [div=display:none;][font=Abril Fatface][font=Karla][font=Cedarville Cursive]font[/font][/font][/font][/div][div class=container][div=height:10px;width:100%;position:absolute;z-index:6;opacity:0.4;color: var(--color-2);font-size:10px;text-align:left;top:3px;left: 5px;][font=Open Sans]♡coded by uxie♡[/font][/div][div class=sidebar][nobr]
  2. [div class=namec]
  3. [div class=name]nikolas[/div]
  4. [div class=role]new victory[/div]
  5. [/div]
  6. [div class=icon][/div]
  7. [div class=buttoncon]
  8. [div class="1btn button buttonselect"][div=display:none;]1#[/div][fa]far fa-leaf-oak[/fa][/div]
  9. [div class="2btn button"][div=display:none;]2#[/div][fa]far fa-pegasus[/fa][/div]
  10. [div class="3btn button"][div=display:none;]3#[/div][fa]far fa-trophy-alt[/fa][/div]
  11. [div class="4btn button"][div=display:none;]4#[/div][fa]far fa-fire[/fa][/div]
  12. [/div]
  13. [/nobr][/div][div class=body]
  14. [div class="1tab tabs"][div class=chatbox][nobr]
  15. [div class=reqchat]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer interdum cursus elit, sit amet euismod nisi.[/div]
  16. [div class=reqicon][/div]
  17. [/nobr][/div][div class=reqbody][nobr][div class=reqscroll][div class=reqstackc]
  18. [div class=reqstack]
  19. [div class=reqh]full name[/div]
  20. [div class=reqt]nikolas mendoza[/div]
  21. [/div]
  22. [div class=reqstack]
  23. [div class=reqh]nickname(s)[/div]
  24. [div class=reqt]niko, nik[/div]
  25. [/div]
  26. [div class=reqstack]
  27. [div class=reqh]age[/div]
  28. [div class=reqt]appears 23[/div]
  29. [/div]
  30. [div class=reqstack]
  31. [div class=reqh]gender[/div]
  32. [div class=reqt]male[/div]
  33. [/div]
  34. [div class=reqstack]
  35. [div class=reqh]sexuality[/div]
  36. [div class=reqt]bisexual[/div]
  37. [/div]
  38. [div class=reqstack]
  39. [div class=reqh]role[/div]
  40. [div class=reqt]new victory[/div]
  41. [/div]
  42. [/div]
  43. [br][/br]
  44. [div class=appc]
  45. [div class=apph]hair[/div]
  46. [div class=appt]nik has a striking dark brown that contrasts his paler skin rather distinctly. he's never dyed it.[/div]
  47. [/div]
  48. [div class=appc]
  49. [div class=apph]eyes[/div]
  50. [div class=appt]his eyes are a shade of [b]hazel[/b] that can never make up its mind. people have noted green, brown, blue and even grey.[/div]
  51. [/div]
  52. [div class=appc]
  53. [div class=apph]hair styling[/div]
  54. [div class=appt]a natural sandy-blonde that adores pastels, winnie's hair is currently a shade of [div class=appemp]pink[/div]. winnie's hair has an organic wave to it and reaches just below her shoulder blades.[/div]
  55. [/div]
  56. [div class=appc]
  57. [div class=apph]height[/div]
  58. [div class=appt]6'0"[/div]
  59. [/div]
  60. [div class=appc]
  61. [div class=apph]weight[/div]
  62. [div class=appt]184 lbs[/div]
  63. [/div]
  64. [div class=appc]
  65. [div class=apph]mod(s).[/div]
  66. [div class=appt]nik can't find a tattoo on his body, but he's noticed that his ears are pierced.[/div]
  67. [/div]
  68. [div class=appc]
  69. [div class=apph]dist. features[/div]
  70. [div class=appt]a striking gaze that seems to glare into your soul. dark brown, tussled hair. a jawline that could cut ice. arched eyebrows.[/div]
  71. [/div]
  72. [div class=appc]
  73. [div class=apph]scent[/div]
  74. [div class=appt]on the muskier side, with a faint smell of wood, earth and smoke complemented by hints of floral jasmine and basil.[/div]
  75. [/div]
  76. [div class=appc]
  77. [div class=apph]ailments[/div]
  78. [div class=appt]mild iron deficiency; nothing all that serious.[/div]
  79. [/div]
  80. [div class=appc]
  81. [div class=apph]faceclaim[/div]
  82. [div class=appt]manu rios[/div]
  83. [/div]
  84.  
  85. [/div][/nobr][div class=reqscroll][/div][/div]
  86. [/div]
  87.  
  88. [div class="2tab tabs" style=display:none;][div class=pers][nobr]
  89. [div class=persheader]
  90. [div class=persbox]
  91. [div class=persh]likes.[/div]
  92. [div class=perst][div class=scroll]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer interdum cursus elit, sit amet euismod nisi ornare in. Ut in arcu non neque ullamcorper elementum. Sed dignissim eget purus a fringilla. Proin vitae tempus velit. Pellentesque scelerisque tortor nec tellus tincidunt, ut gravida sem lobortis. Aenean ultricies non mi ut imperdiet. Sed pretium neque eu sem pharetra posuere. Vivamus tincidunt eu nunc fringilla aliquam. Sed nec porta lectus. Pellentesque eget nunc hendrerit, imperdiet sapien malesuada, posuere velit. Morbi vitae velit sed tortor maximus posuere vitae efficitur eros.
  93. [/div][/div]
  94. [/div]
  95. [div class=persbox]
  96. [div class=persh]dislikes.[/div]
  97. [div class=perst][div class=scroll]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer interdum cursus elit, sit amet euismod nisi ornare in. Ut in arcu non neque ullamcorper elementum. Sed dignissim eget purus a fringilla. Proin vitae tempus velit. Pellentesque scelerisque tortor nec tellus tincidunt, ut gravida sem lobortis. Aenean ultricies non mi ut imperdiet. Sed pretium neque eu sem pharetra posuere. Vivamus tincidunt eu nunc fringilla aliquam. Sed nec porta lectus. Pellentesque eget nunc hendrerit, imperdiet sapien malesuada, posuere velit. Morbi vitae velit sed tortor maximus posuere vitae efficitur eros.
  98. [/div][/div]
  99. [/div]
  100. [/div][div class=persbody][div class=scroll]
  101. [div class=appc]
  102. [div class=apph]virtues[/div]
  103. [div class=appt]lorem ipsum[/div]
  104. [/div]
  105. [div class=appc]
  106. [div class=apph]vices[/div]
  107. [div class=appt]lorem ipsum[/div]
  108. [/div]
  109. [div class=appc]
  110. [div class=apph]weaknesses[/div]
  111. [div class=appt]lorem ipsum[/div]
  112. [/div]
  113. [div class=appc]
  114. [div class=apph]fears[/div]
  115. [div class=appt]lorem ipsum[/div]
  116. [/div]
  117. [div class=appc]
  118. [div class=apph]habits[/div]
  119. [div class=appt]lorem ipsum[/div]
  120. [/div]
  121. [/div][/div]
  122. [/nobr][/div][/div][comment]///tab 2 ends here[/comment]
  123.  
  124. [div class="3tab tabs" style=display:none;][div class=hist][div class=histbody][div class=histh]backstory.[/div][div class=hscroll]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer interdum cursus elit, sit amet euismod nisi ornare in. Ut in arcu non neque ullamcorper elementum. Sed dignissim eget purus a fringilla. Proin vitae tempus velit. Pellentesque scelerisque tortor nec tellus tincidunt, ut gravida sem lobortis. Aenean ultricies non mi ut imperdiet. Sed pretium neque eu sem pharetra posuere. Vivamus tincidunt eu nunc fringilla aliquam. Sed nec porta lectus. Pellentesque eget nunc hendrerit, imperdiet sapien malesuada, posuere velit. Morbi vitae velit sed tortor maximus posuere vitae efficitur eros.
  125.  
  126. Cras id neque et tortor dictum consequat. Praesent vitae elit lobortis, euismod tortor non, vehicula justo. Sed sed nunc ut lectus facilisis vulputate. Curabitur sit amet massa tellus. Sed fringilla non enim sit amet auctor. Maecenas ultricies massa neque. Aenean egestas luctus tincidunt. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Vivamus sem eros, ornare nec felis vel, consectetur vehicula augue.
  127. [/div][/div][div class=histfoot][div class=scroll][nobr]
  128. [div class=miscchat]
  129. [div class=msgc1]
  130. [div class=msgiconb1][div class=msgicon1][/div][/div]
  131. [div class=msgcc1]
  132. [div class=msgname1]unknown number[/div]
  133. [div class=msg1]hey i heard you're looking for friends[/div]
  134. [/div]
  135. [/div]
  136. [div class=msgc2]
  137. [div class=msgiconb2][div class=msgicon2][/div][/div]
  138. [div class=msgcc2]
  139. [div class=msgname2]niko [fa]far fa-cloud[/fa][/div]
  140. [div class=msg2]who is this?[/div]
  141. [/div]
  142. [/div]
  143. [/div]
  144. [div class=appc]
  145. [div class=apph]theme song[/div]
  146. [div class=appt]lorem ipsum[/div]
  147. [/div]
  148.  
  149. [/nobr][/div][/div]
  150. [/div][/div][comment]////3 tab end[/comment]
  151.  
  152. [div class="4tab tabs" style=display:none;][div class=rels][nobr]
  153. [div class=relsh]relationships.[/div]
  154. [div class=relsc][div class=scroll]
  155. [div class=relsbox]
  156. [div class=relsbody]
  157. [div class=relsname]victory[/div]
  158. [div class=relsdrop][div=display:none;]1#[/div]description[/div]
  159. [div class="1rs relstext"][div class=rsscroll]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer interdum cursus elit, sit amet euismod nisi ornare in. Ut in arcu non neque ullamcorper elementum. Sed dignissim eget purus a fringilla. Proin vitae tempus velit. Pellentesque scelerisque tortor nec tellus tincidunt, ut gravida sem lobortis. Aenean ultricies non mi ut imperdiet. Sed pretium neque eu sem pharetra posuere. Vivamus tincidunt eu nunc fringilla aliquam. Sed nec porta lectus. Pellentesque eget nunc hendrerit, imperdiet sapien malesuada, posuere velit. Morbi vitae velit sed tortor maximus posuere vitae efficitur eros.
  160. [/div][/div]
  161. [/div]
  162. [div class=relsiconb][div class=relsicon1][/div][/div]
  163. [/div]
  164.  
  165. [div class=relsbox]
  166. [div class=relsbody]
  167. [div class=relsname]victory[/div]
  168. [div class=relsdrop][div=display:none;]2#[/div]description[/div]
  169. [div class="2rs relstext"][div class=rsscroll]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer interdum cursus elit, sit amet euismod nisi ornare in. Ut in arcu non neque ullamcorper elementum. Sed dignissim eget purus a fringilla. Proin vitae tempus velit. Pellentesque scelerisque tortor nec tellus tincidunt, ut gravida sem lobortis. Aenean ultricies non mi ut imperdiet. Sed pretium neque eu sem pharetra posuere. Vivamus tincidunt eu nunc fringilla aliquam. Sed nec porta lectus. Pellentesque eget nunc hendrerit, imperdiet sapien malesuada, posuere velit. Morbi vitae velit sed tortor maximus posuere vitae efficitur eros.
  170. [/div][/div]
  171. [/div]
  172. [div class=relsiconb][div class=relsicon2][/div][/div]
  173. [/div]
  174.  
  175. [div class=relsbox]
  176. [div class=relsbody]
  177. [div class=relsname]victory[/div]
  178. [div class=relsdrop][div=display:none;]3#[/div]description[/div]
  179. [div class="3rs relstext"][div class=rsscroll]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer interdum cursus elit, sit amet euismod nisi ornare in. Ut in arcu non neque ullamcorper elementum. Sed dignissim eget purus a fringilla. Proin vitae tempus velit. Pellentesque scelerisque tortor nec tellus tincidunt, ut gravida sem lobortis. Aenean ultricies non mi ut imperdiet. Sed pretium neque eu sem pharetra posuere. Vivamus tincidunt eu nunc fringilla aliquam. Sed nec porta lectus. Pellentesque eget nunc hendrerit, imperdiet sapien malesuada, posuere velit. Morbi vitae velit sed tortor maximus posuere vitae efficitur eros.
  180. [/div][/div]
  181. [/div]
  182. [div class=relsiconb][div class=relsicon3][/div][/div]
  183. [/div]
  184.  
  185. [/div][/div]
  186. [/nobr][/div][/div][comment]////tab4 end[/comment]
  187. [/div][comment]///body ends here[/comment]
  188. [/div]
  189.  
  190. [nobr]
  191.  
  192. [class=container]
  193. --bg-1: #F9F9F9;
  194. --bigicon: url('https://pbs.twimg.com/media/DzdtbrmXgAQqPsQ.jpg');
  195. --img-1: url('https://66.media.tumblr.com/1b570097eafd68908266b93e4deb03a8/tumblr_ona05sxvVC1v4g0opo1_250.png');
  196. --img-2: url('https://66.media.tumblr.com/5d1abf392b52bbbbe9005322308d3037/tumblr_po47b4Z73i1wr1nzso5_250.png');
  197. --contact: url('https://cdn.discordapp.com/attachments/387905088124878850/674194264867078150/iotzgcrstxa31.png');
  198. --name: #32273d;
  199. --txt: #302b26;
  200. --txt-1: #3f3b36;
  201. --color-1: #314777;
  202. --color-2: #7793d1;
  203. --color-3: #e8be55;
  204. --color-4: #dba23f;
  205. --rs-1: url('https://ilarge.lisimg.com/image/19118508/1080full-sage-tullis.jpg');
  206. --rs-2: url('https://ilarge.lisimg.com/image/19118508/1080full-sage-tullis.jpg');
  207. --rs-3: url('https://ilarge.lisimg.com/image/19118508/1080full-sage-tullis.jpg');
  208. height:370px;
  209. width:580px;
  210. background: var(--bg-1);
  211. margin:auto;
  212. display:flex;
  213. flex-flow: row wrap;
  214. position:relative;
  215. [/class]
  216.  
  217. [class=sidebar]
  218. width:40%;
  219. display:flex;
  220. flex-flow: row wrap;
  221. padding:10px;
  222. box-sizing:border-box;
  223. justify-content:center;
  224. [/class]
  225.  
  226. [class=namec]
  227. height: calc(100% - 235px);
  228. width:100%;
  229. display:flex;
  230. align-content: center;
  231. flex-flow: row wrap;
  232. position:relative;
  233. [/class]
  234.  
  235. [class=name]
  236. font-size:45px;
  237. width:100%;
  238. color: var(--name);
  239. font-family: 'Abril Fatface', display;
  240. text-align:right;
  241. margin-right:15px;
  242. margin-top:10px;
  243. transition: .3s;
  244. line-height:150%;
  245. [/class]
  246.  
  247. [class=role]
  248. font-size:25px;
  249. width:100%;
  250. color: var(--color-1);
  251. font-family: 'Cedarville Cursive', display;
  252. margin-top:-20px;
  253. margin-left:15px;
  254. line-height:150%;
  255. [/class]
  256.  
  257. [class=icon]
  258. height:195px;
  259. width:205px;
  260. background: var(--bigicon);
  261. background-size:100%;
  262. background-position: 50% 50%;
  263. [/class]
  264.  
  265. [class=buttoncon]
  266. height:35px;
  267. width:100%;
  268. display:flex;
  269. flex-flow: row nowrap;
  270. [/class]
  271.  
  272. [class=button]
  273. height:100%;
  274. width:25%;
  275. text-align:center;
  276. font-size:13px;
  277. color: var(--txt);
  278. opacity:0.8;
  279. padding-top:12px;
  280. box-sizing:border-box;
  281. transition:0.3s;
  282. [/class]
  283.  
  284. [class name=button state=hover]
  285. opacity:1;
  286. color: var(--color-1);
  287. transition:0.3s;
  288. cursor:pointer;
  289. [/class]
  290.  
  291. [class=buttonselect]
  292. color: var(--color-1);
  293. pointer-events:none;
  294. [/class]
  295.  
  296. [script class=button on=click version=2]
  297. (removeClass "buttonselect" "button")
  298. (hide "tabs")
  299. (= currentTab (index (split (getText) "#") 0 ))
  300.  
  301. (fadeIn 800 (+ currentTab "tab"))
  302. (addClass "buttonselect" (+ currentTab "btn"))
  303. [/script]
  304.  
  305. [class=body]
  306. height:100%;
  307. width:59.5%;
  308. position:relative;
  309. [/class]
  310.  
  311. [class=tabs]
  312. height:100%;
  313. width:100%;
  314. position:absolute;
  315. top:0px;
  316. left:0px;
  317. box-sizing:border-box;
  318. padding:10px;
  319. [/class]
  320.  
  321. [class name=scroll minWidth="580px"]
  322. height:100%;
  323. width:105%;
  324. padding-right:40px;
  325. overflow-y:scroll;
  326. [/class]
  327.  
  328. [class name=scroll maxWidth="579px"]
  329. height:100%;
  330. width:100%;
  331. padding-right:40px;
  332. overflow-y:scroll;
  333. [/class]
  334.  
  335. [comment]-----------requisite[/comment]
  336.  
  337. [class=req]
  338. height:100%;
  339. width:100%;
  340. padding:5px;
  341. padding-left:0px;
  342. box-sizing:border-box;
  343. display:flex;
  344. flex-flow: row wrap;
  345. justify-content: center;
  346. [/class]
  347.  
  348. [class=chatbox]
  349. height:34%;
  350. width:100%;
  351. display:flex;
  352. flex-flow: row nowrap;
  353. justify-content: space-between;
  354. align-items: center;
  355. padding-left:10px;
  356. padding-right:10px;
  357. padding-top:10px;
  358. box-sizing:border-box;
  359. [/class]
  360.  
  361. [class=reqchat]
  362. height:60%;
  363. width:58%;
  364. border-radius:10px;
  365. border-bottom-right-radius:0px;
  366. background-color: var(--color-2);
  367. margin-top:-10px;
  368. margin-left:10px;
  369. padding:8px;
  370. padding-left:10px;
  371. padding-right:10px;
  372. box-sizing:border-box;
  373. font-size:10px;
  374. letter-spacing:0.5px;
  375. line-height:130%;
  376. text-transform:uppercase;
  377. font-family: 'Karla', sans-serif;
  378. overflow:hidden;
  379. text-align:justify;
  380. color: var(--txt);
  381. [/class]
  382.  
  383. [class=reqicon]
  384. height:100px;
  385. width:100px;
  386. border-radius:50%;
  387. background: var(--img-1);
  388. background-size:100%;
  389. transition: 0.3s;
  390. [/class]
  391.  
  392. [class name=reqicon state=hover]
  393. box-shadow:6px 2px var(--color-1);
  394. transition: 0.3s;
  395. [/class]
  396.  
  397. [class=reqbody]
  398. height:60%;
  399. width:92%;
  400. background-color:white;
  401. margin:auto;
  402. margin-top:15px;
  403. box-sizing:border-box;
  404. padding:5px;
  405. overflow:hidden;
  406. font-size:10px;
  407. text-align:justify;
  408. line-height:150%;
  409. font-family: 'Karla', sans-serif;
  410. color: var(--txt);
  411. [/class]
  412.  
  413. [class=reqscroll]
  414. height:100%;
  415. width: 106%;
  416. padding-right:40px;
  417. overflow-y:scroll;
  418. color: var(--txt);
  419. [/class]
  420.  
  421. [class=reqstackc]
  422. width:100%;
  423. display:flex;
  424. flex-flow: row wrap;
  425. justify-content: space-between;
  426. align-items: flex-start;
  427. color: var(--txt);
  428. [/class]
  429.  
  430. [class=reqstack]
  431. height:40px;
  432. width:100%;
  433. border-bottom:1.5px solid var(--color-1);
  434. display:flex;
  435. flex-flow: row nowrap;
  436. justify-content: space-between;
  437. box-sizing:border-box;
  438. padding:8px;
  439. line-height:180%;
  440. [/class]
  441.  
  442. [class=reqh]
  443. min-width:20%;
  444. max-width:50%;
  445. font-size:11px;
  446. text-transform:uppercase;
  447. font-family: 'Karla', sans-serif;
  448. font-weight:bold;
  449. letter-spacing:1.5px;
  450. text-align:left;
  451. [/class]
  452.  
  453. [class=reqt]
  454. font-size:11px;
  455. text-transform:uppercase;
  456. font-family: 'Karla', sans-serif;
  457. letter-spacing:1.5px;
  458. text-align:right;
  459. flex-shrink:0;
  460. [/class]
  461.  
  462. [class=appc]
  463. width:100%;
  464. display:flex;
  465. flex-flow: row nowrap;
  466. justify-content: space-between;
  467. margin-bottom:10px;
  468. [/class]
  469.  
  470. [class=apph]
  471. height:12px;
  472. display:inline-block;
  473. border-bottom:1.5px solid var(--color-1);
  474. padding:2px;
  475. text-transform: uppercase;
  476. letter-spacing:1px;
  477. font-weight:400;
  478. flex-shrink:0;
  479. position:relative;
  480. top:-2px;
  481. [/class]
  482.  
  483. [class=appemp]
  484. display:inline;
  485. font-weight:bold;
  486. letter-spacing:0.5px;
  487. font-style:oblique;
  488. color: var(--color-3);
  489. [/class]
  490.  
  491. [class=appt]
  492. text-align:justify;
  493. margin-left:5%;
  494. flex-grow: 1;
  495. [/class]
  496.  
  497. [comment]----------persona[/comment]
  498.  
  499. [class=pers]
  500. height:100%;
  501. width:100%;
  502. display:flex;
  503. flex-flow: row wrap;
  504. align-items: space-between;
  505. [/class]
  506.  
  507. [class=persheader]
  508. height:35%;
  509. background-color: transparent;
  510. width:100%;
  511. padding:5px;
  512. box-sizing:border-box;
  513. display:flex;
  514. flex-flow: row nowrap;
  515. [/class]
  516.  
  517. [class=persbox]
  518. height:100%;
  519. width:50%;
  520. box-sizing:border-box;
  521. display:flex;
  522. flex-flow: row wrap;
  523. margin-top:5px;
  524. box-sizing: border-box;
  525. padding-left:5px;
  526. [/class]
  527.  
  528. [class=persh]
  529. font-size:25px;
  530. height:15px;
  531. font-family: 'Abril Fatface', display;
  532. color: var(--color-3);
  533. width:100%;
  534. letter-spacing:0.5px;
  535. line-height:120%;
  536. padding-left:5px;
  537. box-sizing:border-box;
  538. [/class]
  539.  
  540. [class=perst]
  541. height:68%;
  542. width:100%;
  543. padding:5px;
  544. padding-left:17px;
  545. padding-right:17px;
  546. box-sizing:border-box;
  547. font-size:10px;
  548. text-align:justify;
  549. overflow:hidden;
  550. color: var(--txt);
  551. line-height:140%;
  552. font-family: 'Karla', sans-serif;
  553. [/class]
  554.  
  555. [class=persbody]
  556. height:63%;
  557. width:100%;
  558. background-color: #fff;
  559. padding:8px;
  560. box-sizing:border-box;
  561. text-align:justify;
  562. overflow:hidden;
  563. font-size: 10px;
  564. font-family: 'Karla', sans-serif;
  565. color: var(--txt);
  566. [/class]
  567.  
  568. [comment]--------backstory[/comment]
  569. [class=hist]
  570. height:100%;
  571. width:100%;
  572. display:flex;
  573. flex-flow: row wrap;
  574. padding:5px;
  575. box-sizing:border-box;
  576. align-items: space-between;
  577. [/class]
  578.  
  579. [class=histh]
  580. height:18%;
  581. font-size:22px;
  582. font-family: 'Abril Fatface', display;
  583. color: var(--name);
  584. letter-spacing:1px;
  585. text-align:right;
  586. line-height:150%;
  587. [/class]
  588.  
  589. [class name=hscroll minWidth="580px"]
  590. height:82%;
  591. width:105%;
  592. overflow-y:scroll;
  593. padding-right:40px;
  594. [/class]
  595.  
  596. [class name=hscroll maxWidth="579px"]
  597. height:82%;
  598. width:105%;
  599. overflow-y:scroll;
  600. padding-right:40px;
  601. [/class]
  602.  
  603. [class=histbody]
  604. height:62%;
  605. width:100%;
  606. background-color: #fff;
  607. padding:10px;
  608. box-sizing:border-box;
  609. font-family: 'Karla', sans-serif;
  610. font-size:10px;
  611. text-align:justify;
  612. color: var(--txt);
  613. overflow:hidden;
  614. line-height:150%;
  615. [/class]
  616.  
  617. [class=histfoot]
  618. height:38%;
  619. width:100%;
  620. padding:10px;
  621. box-sizing:border-box;
  622. overflow:hidden;
  623. padding-bottom:0px;
  624. font-size:10px;
  625. font-family: 'Karla', sans-serif;
  626. color: var(--txt);
  627. [/class]
  628.  
  629. [class=miscchat]
  630. width:100%;
  631. display:flex;
  632. flex-flow: row wrap;
  633. margin-bottom:5px;
  634. line-height:148%;
  635. [/class]
  636.  
  637. [class=msgc1]
  638. width:100%;
  639. min-height:50%;
  640. display:flex;
  641. flex-flow: row nowrap;
  642. align-items: flex-start;
  643. margin-bottom:5px;
  644. [/class]
  645.  
  646. [class=msgc2]
  647. width:100%;
  648. display:flex;
  649. flex-flow: row-reverse nowrap;
  650. align-items: flex-start;
  651. margin-bottom:5px;
  652. [/class]
  653.  
  654. [class=msgiconb1]
  655. height:42px;
  656. width:42px;
  657. border-radius:50%;
  658. border:1.5px solid var(--color-3);
  659. padding:3px;
  660. margin-top:3px;
  661. [/class]
  662.  
  663. [class=msgiconb2]
  664. height:42px;
  665. width:42px;
  666. border-radius:50%;
  667. border:1.5px solid var(--color-2);
  668. padding:3px;
  669. margin-top:3px;
  670. [/class]
  671.  
  672. [class=msgicon1]
  673. height:100%;
  674. width:100%;
  675. border-radius:50%;
  676. background: var(--contact);
  677. background-size:100%;
  678. [/class]
  679.  
  680. [class=msgicon2]
  681. height:100%;
  682. width:100%;
  683. border-radius:50%;
  684. background: var(--img-2);
  685. background-size:100%;
  686. [/class]
  687.  
  688. [class=msgname1]
  689. width:100%;
  690. font-size:11px;
  691. font-weight:bold;
  692. font-family: 'Karla', sans-serif;
  693. letter-spacing:1px;
  694. color: var(--color-3);
  695. text-transform: uppercase;
  696. margin-left:10px;
  697. margin-bottom:3px;
  698. [/class]
  699.  
  700. [class=msgname2]
  701. width:100%;
  702. font-size:11px;
  703. font-weight:bold;
  704. font-family: 'Karla', sans-serif;
  705. letter-spacing:1px;
  706. color: var(--color-2);
  707. text-transform: uppercase;
  708. margin-right:10px;
  709. text-align:right;
  710. margin-bottom:3px;
  711. [/class]
  712.  
  713. [class=msgcc1]
  714. width:80%;
  715. align-self: flex-start;
  716. display:flex;
  717. flex-flow: row wrap;
  718. [/class]
  719.  
  720. [class=msgcc2]
  721. width:80%;
  722. align-self: flex-start;
  723. display:flex;
  724. flex-flow: row wrap;
  725. justify-content: flex-end;
  726. [/class]
  727.  
  728. [class=msg1]
  729. min-width:10%;
  730. max-width:65%;
  731. display:inline-block;
  732. font-size:11px;
  733. color: var(--txt);
  734. font-family: 'Karla', sans-serif;
  735. padding:3.5px;
  736. border-radius:5px;
  737. border-bottom-left-radius:0px;
  738. background-color: var(--color-3);
  739. margin-left:10px;
  740. [/class]
  741.  
  742. [class=msg2]
  743. min-width:10%;
  744. max-width:65%;
  745. display:inline-block;
  746. font-size:11px;
  747. color: var(--txt);
  748. font-family: 'Karla', sans-serif;
  749. padding:3.5px;
  750. border-radius:5px;
  751. border-bottom-right-radius:0px;
  752. background-color: var(--color-2);
  753. margin-right:10px;
  754. [/class]
  755.  
  756. [comment]------relationships[/comment]
  757.  
  758. [class=rels]
  759. height:100%;
  760. width:100%;
  761. padding:5px;
  762. box-sizing:border-box;
  763. display:flex;
  764. flex-flow: row wrap;
  765. padding-top:5px;
  766. align-content:center;
  767. [/class]
  768.  
  769. [class=relsh]
  770. font-size:28px;
  771. width:100%;
  772. font-family: 'Abril Fatface', display;
  773. color: var(--color-3);
  774. letter-spacing: 1px;
  775. position:relative;
  776. top:5px;
  777. box-sizing:border-box;
  778. padding-left:10px;
  779. text-align:right;
  780. [/class]
  781.  
  782. [class=relsc]
  783. height:75%;
  784. width:100%;
  785. padding:5px;
  786. overflow:hidden;
  787. [/class]
  788.  
  789. [class=relsc2]
  790. width:100%;
  791. display:flex;
  792. flex-flow: row wrap;
  793. justify-content: center;
  794. [/class]
  795.  
  796. [class=relsbox]
  797. width:90%;
  798. height:auto;
  799. display:inline-block;
  800. margin:auto;
  801. margin-top:10px;
  802. display:flex;
  803. flex-flow: row wrap;
  804. justify-content: space-between;
  805. align-content: center;
  806. margin-bottom:35px;
  807. [/class]
  808.  
  809. [class=relsbody]
  810. width: 63%;
  811. height: auto;
  812. display:flex;
  813. flex-flow: row wrap;
  814. justify-content: center;
  815. align-content: center;
  816. box-sizing:border-box;
  817. padding-bottom:10px;
  818. [/class]
  819.  
  820. [class=relsname]
  821. font-size: 26px;
  822. width:100%;
  823. color: var(--color-1);
  824. font-family: 'Cedarville Cursive', display;
  825. text-align:right;
  826. margin-bottom:15px;
  827. [/class]
  828.  
  829. [class=relsdrop]
  830. height:20px;
  831. width:95%;
  832. background-color: var(--color-3);
  833. border-radius:2px;
  834. margin-top: -10px;
  835. transition:0.3s;
  836. color: var(--txt);
  837. font-size:12px;
  838. text-transform:uppercase;
  839. letter-spacing:1px;
  840. font-family: 'Karla', sans-serif;
  841. text-align:center;
  842. line-height:150%;
  843. [/class]
  844.  
  845. [class name=relsdrop state=hover]
  846. background-color: var(--color-4);
  847. color: #fff;
  848. transition:0.3s;
  849. cursor: pointer;
  850. [/class]
  851.  
  852. [class=relstext]
  853. height:80px;
  854. width:90%;
  855. background-color:white;
  856. margin:auto;
  857. margin-top: 5px;
  858. display:none;
  859. padding:5px;
  860. box-sizing:border-box;
  861. color: var(--txt);
  862. font-size:9px;
  863. text-align:justify;
  864. font-family: 'Karla', sans-serif;
  865. overflow:hidden;
  866. line-height:134%;
  867. [/class]
  868.  
  869. [script class=relsdrop on=click version="2"]
  870. (= currentTab (index (split (getText) "#") 0 ))
  871. (slideToggle 600 (+ currentTab "rs"))
  872. [/script]
  873.  
  874. [class=rsscroll]
  875. height:100%;
  876. width:110%;
  877. overflow-y:scroll;
  878. padding-right:40px;
  879. [/class]
  880.  
  881. [class=relsiconb]
  882. height:75px;
  883. width:75px;
  884. border:2px solid var(--color-1);
  885. padding:5px;
  886. border-radius:50%;
  887. transition:0.3s;
  888. [/class]
  889.  
  890. [class name=relsiconb state=hover]
  891. transform: scale(1.03);
  892. transition:0.3s;
  893. [/class]
  894.  
  895. [class=relsicon1]
  896. height:100%;
  897. width:100%;
  898. border-radius:50%;
  899. background: var(--rs-1);
  900. background-size:100%;
  901. [/class]
  902.  
  903. [class=relsicon2]
  904. height:100%;
  905. width:100%;
  906. border-radius:50%;
  907. background: var(--rs-2);
  908. background-size:100%;
  909. [/class]
  910.  
  911. [class=relsicon3]
  912. height:100%;
  913. width:100%;
  914. border-radius:50%;
  915. background: var(--rs-3);
  916. background-size:100%;
  917. [/class]
  918.  
  919. [/nobr]
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!