API tools faq
paste
Advertisement
soxxx

long flight

soxxx
Feb 24th, 2020
434
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 15.46 KB | None | 0 0
raw download clone embed print report
  1. [nobr]
  2. [class=bkgd]
  3. --bkgd-color: #d3d9c3;
  4. --shadow-color: #fff;
  5. --accent-color1: #bd4a5d;
  6. --accent-color2: #b0dceb;
  7. --text-color: #000;
  8. position: relative;
  9. margin-left: auto;
  10. margin-right: auto;
  11. margin-bottom: 7px;
  12. width: 500px;
  13. height: 400px;
  14. background-color: var(--bkgd-color);
  15. cursor: url('https://i.imgur.com/FMvuswx.png'), auto;
  16. box-shadow: 5px 5px 0px var(--accent-color1);
  17. [/class]
  18.  
  19. [class=pic1]
  20. position: absolute;
  21. width: 230px;
  22. height: 320px;
  23. left: 210px;
  24. top: 30px;
  25. background: url(https://i.pinimg.com/474x/9c/f5/16/9cf5162d6403f1a50e8527538ee55bf9.jpg);
  26. background-size: 100%;
  27. border: 1px solid var(--shadow-color);
  28. box-shadow: 20px 20px 0px var(--accent-color2);
  29. [/class]
  30.  
  31. [class=pic2]
  32. position: absolute;
  33. width: 250px;
  34. height: 150px;
  35. left: 150px;
  36. top: 70px;
  37. background: url(https://i.pinimg.com/474x/ec/cc/4b/eccc4be5aee44f6481b2e62007fd1dff.jpg);
  38. background-size: 100%;
  39. background-position: 50% 50%;
  40. border: 10px solid var(--shadow-color);
  41. [/class]
  42.  
  43. [class=pic3]
  44. position: absolute;
  45. width: 190px;
  46. height: 250px;
  47. left: 80px;
  48. top: 30px;
  49. background: url(https://i.pinimg.com/474x/c8/e1/5c/c8e15c9f49e1698ae5d707ca840685bc.jpg);
  50. background-size: 100%;
  51. border: 1px solid var(--shadow-color);
  52. [/class]
  53.  
  54. [class=pic4]
  55. position: absolute;
  56. width: 200px;
  57. height: 100px;
  58. left: 250px;
  59. top: 60px;
  60. background: url(https://i.pinimg.com/564x/18/21/93/182193771e5fa12b56ccbc591513167d.jpg);
  61. background-size: 100%;
  62. background-position: 50% 20%;
  63. border: 10px solid var(--shadow-color);
  64. [/class]
  65.  
  66. [class=pic5]
  67. position: absolute;
  68. width: 170px;
  69. height: 210px;
  70. left: 60px;
  71. top: 150px;
  72. background: url(https://i.pinimg.com/474x/73/bf/7d/73bf7df584c749e479f8ba532cb60e7a.jpg);
  73. background-size: 100%;
  74. background-position: 50% 50%;
  75. border: 1px solid var(--shadow-color);
  76. [/class]
  77.  
  78. [class=header]
  79. position: absolute;
  80. width: auto;
  81. height: auto;
  82. font-size: 35px;
  83. font-weight: 700;
  84. line-height: 35px;
  85. letter-spacing: 10px;
  86. text-align: right;
  87. color: var(--accent-color1);
  88. text-shadow: 3px 3px 0px var(--shadow-color);
  89. text-transform: uppercase;
  90. [/class]
  91.  
  92. [class=tab]
  93. position: absolute;
  94. width: 15px;
  95. height: 15px;
  96. background-color: var(--accent-color2);
  97. color: var(--shadow-color);
  98. font-size: 8px;
  99. text-align: center;
  100. line-height: 15px;
  101. border-radius: 5%;
  102. transition-duration: 0.3s;
  103. box-shadow: 3px 3px 0px var(--shadow-color);
  104. [/class]
  105.  
  106. [class name=tab state=hover]
  107. background-color: var(--accent-color1);
  108. color: var(--shadow-color);
  109. transition-duration: 0.3s;
  110. box-shadow: 2px 2px 0px var(--shadow-color);
  111. [/class]
  112.  
  113. [class=textcontainer]
  114. position: absolute;
  115. background-color: var(--shadow-color);
  116. overflow: hidden;
  117. box-shadow: 10px 10px 0px var(--accent-color2);
  118. transition-duration: 0.3s;
  119. [/class]
  120.  
  121. [class name=textcontainer state=hover]
  122. box-shadow: 10px 10px 0px var(--accent-color1);
  123. transition-duration: 0.3s;
  124. [/class]
  125.  
  126. [class=text]
  127. position: relative;
  128. padding: 10px 20px 5px 10px;
  129. overflow: auto;
  130. color: var(--text-color);
  131. font-size: 10px;
  132. line-height: 11px;
  133. white-space: pre-wrap;
  134. text-align: justify;
  135. text-transform: lowercase;
  136. [/class]
  137.  
  138. [class=gallery]
  139. position: relative;
  140. left: 0%;
  141. overflow: hidden;
  142. width: 100%;
  143. height: 700px;
  144. display: flex;
  145. flex-direction: row;
  146. justify-content: space-evenly;
  147. [/class]
  148.  
  149. [class=column]
  150. width: 45%;
  151. height: 150px;
  152. margin-left: 5px;
  153. [/class]
  154.  
  155. [class=galpic]
  156. width: 95%;
  157. height: 100%;
  158. background-position: 0% 0%;
  159. margin-bottom: 5px;
  160. [/class]
  161.  
  162. [class=tag]
  163. position: relative;
  164. overflow: visible;
  165. display: inline;
  166. width: auto;
  167. height: auto;
  168. font-size: 9px;
  169. text-align: center;
  170. margin-right: 5px;
  171. padding: 1px 3px 1px 3px;
  172. text-transform: uppercase;
  173. background-color: var(--accent-color1);
  174. box-shadow: 2px 2px 0px var(--accent-color2);
  175. color: var(--shadow-color);
  176. font-weight: 400;
  177. [/class]
  178.  
  179. [class=credit]
  180. position: relative;
  181. overflow: hidden;
  182. width: 100%;
  183. height: 10px;
  184. text-align: center;
  185. font-style: normal;
  186. font-weight: normal;
  187. font-size: 8px;
  188. color: #dedede;
  189. opacity: 0.25;
  190. [/class]
  191.  
  192. [class=hidden]
  193. display: none;
  194. [/class]
  195.  
  196. [script class=tab on=click]
  197. hide tabsContent
  198. set currentTab (getText)
  199. if (eq ${currentTab} 1) (fadeIn 400 tabsContent1)
  200. if (eq ${currentTab} 2) (fadeIn 400 tabsContent2)
  201. if (eq ${currentTab} 3) (fadeIn 400 tabsContent3)
  202. if (eq ${currentTab} 4) (fadeIn 400 tabsContent4)
  203. if (eq ${currentTab} 5) (fadeIn 400 tabsContent5)
  204. [/script]
  205.  
  206. [div class=bkgd]
  207. [div class="pic1 tabsContent tabsContent1"][/div]
  208. [div class="header tabsContent tabsContent1" style="left: 85px; top: 250px;"][font=Reem Kufi]long[br][/br]flight[/font][/div]
  209.  
  210. [div class="pic2 tabsContent tabsContent2 hidden"][/div]
  211. [div class="header tabsContent tabsContent2 hidden" style="left: 360px; top: 30px; text-align: left; font-size: 30px; line-height: 35px;"][font=Reem Kufi]pro[br][/br]file[/font][/div]
  212.  
  213. [div class="textcontainer tabsContent tabsContent2 hidden" style="width: 250px; height: 160px; left: 60px; top: 200px;"][div class=text style="width: 245px; height: 135px;"][font=Maven Pro][div class=tag][font=Reem Kufi]name[/font][/div] lee taeyong
  214.  
  215. [div class=tag][font=Reem Kufi]nickname[/font][/div] ty track, tyong
  216.  
  217. [div class=tag][font=Reem Kufi]age[/font][/div] 24
  218.  
  219. [div class=tag][font=Reem Kufi]gender[/font][/div] male
  220.  
  221. [div class=tag][font=Reem Kufi]sexuality[/font][/div] heterosexual
  222.  
  223. [div class=tag][font=Reem Kufi]role[/font][/div] leader
  224.  
  225. [div class=tag][font=Reem Kufi]hair color[/font][/div] it changes every month
  226.  
  227. [div class=tag][font=Reem Kufi]eye color[/font][/div] dark brown
  228.  
  229. [div class=tag][font=Reem Kufi]height[/font][/div] 5' 9"
  230.  
  231. [div class=tag][font=Reem Kufi]weight[/font][/div] 128 lbs
  232.  
  233. [div class=tag][font=Reem Kufi]body mods[/font][/div] several ear piercings
  234.  
  235. [div class=tag][font=Reem Kufi]distinguishing features[/font][/div] very large eyes
  236. [/font][/div][/div]
  237.  
  238. [div class="pic3 tabsContent tabsContent3 hidden"][/div]
  239. [div class="header tabsContent tabsContent3 hidden" style="left: 80px; top: 295px; text-align: left; font-size: 30px; line-height: 32px;"][font=Reem Kufi]per[br][/br]sona[/font][/div]
  240.  
  241. [div class="textcontainer tabsContent tabsContent3 hidden" style="width: 200px; height: 280px; left: 250px; top: 80px;"][div class=text style="width: 195px; height: 260px;"][font=Maven Pro][div class=tag][font=Reem Kufi]vices[/font][/div] Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Nisi scelerisque eu ultrices vitae auctor eu augue. Ullamcorper morbi tincidunt ornare massa eget egestas purus viverra.
  242.  
  243. [div class=tag][font=Reem Kufi]virtues[/font][/div] Duis convallis convallis tellus id interdum velit laoreet id. Massa vitae tortor condimentum lacinia quis vel eros. Odio ut enim blandit volutpat maecenas volutpat blandit. Nec ultrices dui sapien eget mi proin. Ac auctor augue mauris augue neque gravida in. Duis convallis convallis tellus id interdum. Mauris cursus mattis molestie a iaculis at erat. Iaculis nunc sed augue lacus viverra vitae congue eu.
  244.  
  245. [div class=tag][font=Reem Kufi]likes[/font][/div] Cras fermentum odio eu feugiat pretium nibh ipsum consequat. Sollicitudin ac orci phasellus egestas. Erat pellentesque adipiscing commodo elit at imperdiet dui accumsan sit. Etiam erat velit scelerisque in dictum non consectetur a erat. Sed adipiscing diam donec adipiscing tristique risus nec feugiat in. Aliquet lectus proin nibh nisl condimentum id. Ipsum consequat nisl vel pretium lectus. Bibendum enim facilisis gravida neque convallis a cras semper auctor. Euismod in pellentesque massa placerat duis. At quis risus sed vulputate odio ut. Suspendisse interdum consectetur libero id.
  246.  
  247. [div class=tag][font=Reem Kufi]dislikes[/font][/div] Sem viverra aliquet eget sit amet tellus. Dis parturient montes nascetur ridiculus mus mauris vitae. Habitant morbi tristique senectus et netus et. Sed euismod nisi porta lorem mollis aliquam ut porttitor. Eget duis at tellus at urna condimentum mattis pellentesque. Lectus mauris ultrices eros in cursus turpis massa tincidunt dui. Leo in vitae turpis massa sed. Est pellentesque elit ullamcorper dignissim cras tincidunt lobortis feugiat vivamus.
  248.  
  249. [div class=tag][font=Reem Kufi]fears[/font][/div] Integer feugiat scelerisque varius morbi. Duis ut diam quam nulla porttitor massa id. Donec ac odio tempor orci dapibus. Posuere morbi leo urna molestie at elementum. Felis eget nunc lobortis mattis aliquam faucibus purus. Posuere sollicitudin aliquam ultrices sagittis orci a scelerisque purus semper. Egestas maecenas pharetra convallis posuere morbi. Amet risus nullam eget felis eget. Eget gravida cum sociis natoque.
  250.  
  251. [div class=tag][font=Reem Kufi]hobbies[/font][/div] Purus sit amet volutpat consequat mauris nunc. Cursus mattis molestie a iaculis at erat. Sed faucibus turpis in eu mi. Sed arcu non odio euismod lacinia at quis risus sed. Sit amet facilisis magna etiam. Magna etiam tempor orci eu. Ullamcorper velit sed ullamcorper morbi tincidunt ornare. Eget nullam non nisi est sit. Vitae et leo duis ut diam quam.
  252. [/font][/div][/div]
  253.  
  254. [div class="pic4 tabsContent tabsContent4 hidden"][/div]
  255. [div class="header tabsContent tabsContent4 hidden" style="left: 130px; top: 30px; text-align: left; font-size: 30px; line-height: 32px;"][font=Reem Kufi]bio[br][/br]gra[br][/br]phy[/font][/div]
  256.  
  257. [div class="textcontainer tabsContent tabsContent4 hidden" style="width: 300px; height: 200px; left: 80px; top: 150px;"][div class=text style="width: 295px; height: 180px;"][font=Maven Pro][div class=tag][font=Reem Kufi]residence[/font][/div] Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
  258.  
  259. [div class=tag][font=Reem Kufi]family[/font][/div] Nisi scelerisque eu ultrices vitae auctor eu augue. Ullamcorper morbi tincidunt ornare massa eget egestas purus viverra. Leo vel orci porta non pulvinar neque laoreet suspendisse interdum.
  260.  
  261. [div class=tag][font=Reem Kufi]pets[/font][/div] Id velit ut tortor pretium viverra suspendisse. Lacus vestibulum sed arcu non odio. Duis convallis convallis tellus id interdum velit laoreet id.
  262.  
  263. [div class=tag][font=Reem Kufi]education[/font][/div] Massa vitae tortor condimentum lacinia quis vel eros. Odio ut enim blandit volutpat maecenas volutpat blandit. Nec ultrices dui sapien eget mi proin. Ac auctor augue mauris augue neque gravida in.
  264.  
  265. [div class=tag][font=Reem Kufi]occupation[/font][/div] Duis convallis convallis tellus id interdum. Mauris cursus mattis molestie a iaculis at erat. Iaculis nunc sed augue lacus viverra vitae congue eu.
  266.  
  267. [div class=tag][font=Reem Kufi]history[/font][/div] Cras fermentum odio eu feugiat pretium nibh ipsum consequat. Sollicitudin ac orci phasellus egestas. Erat pellentesque adipiscing commodo elit at imperdiet dui accumsan sit. Etiam erat velit scelerisque in dictum non consectetur a erat. Sed adipiscing diam donec adipiscing tristique risus nec feugiat in. Aliquet lectus proin nibh nisl condimentum id. Ipsum consequat nisl vel pretium lectus. Bibendum enim facilisis gravida neque convallis a cras semper auctor.
  268.  
  269. Euismod in pellentesque massa placerat duis. At quis risus sed vulputate odio ut. Suspendisse interdum consectetur libero id. Sem viverra aliquet eget sit amet tellus. Dis parturient montes nascetur ridiculus mus mauris vitae. Habitant morbi tristique senectus et netus et. Sed euismod nisi porta lorem mollis aliquam ut porttitor. Eget duis at tellus at urna condimentum mattis pellentesque. Lectus mauris ultrices eros in cursus turpis massa tincidunt dui. Leo in vitae turpis massa sed. Est pellentesque elit ullamcorper dignissim cras tincidunt lobortis feugiat vivamus.
  270.  
  271. Eu sem integer vitae justo eget magna fermentum iaculis. Non tellus orci ac auctor augue mauris augue neque gravida. Sed euismod nisi porta lorem mollis aliquam ut. Lacus sed turpis tincidunt id aliquet. Pulvinar pellentesque habitant morbi tristique senectus et netus et. Ut etiam sit amet nisl purus in mollis. Felis donec et odio pellentesque diam. Eu scelerisque felis imperdiet proin fermentum leo. Urna et pharetra pharetra massa massa ultricies mi. Ut tortor pretium viverra suspendisse. Ut tellus elementum sagittis vitae et leo duis ut.
  272. [/font][/div][/div]
  273.  
  274. [div class="pic5 tabsContent tabsContent5 hidden"][/div]
  275. [div class="header tabsContent tabsContent5 hidden" style="left: 200px; top: 270px; text-align: left; font-size: 30px; line-height: 32px;"][font=Reem Kufi]misc. &[br][/br]gallery[/font][/div]
  276.  
  277. [div class="textcontainer tabsContent tabsContent5 hidden" style="width: 280px; height: 220px; left: 180px; top: 30px;"][div class=text style="width: 275px; height: 195px;"][font=Maven Pro][div class=tag][font=Reem Kufi]theme song[/font][/div] long flight by lee taeyong
  278.  
  279. [div class=tag][font=Reem Kufi]enneagram type[/font][/div] 5
  280.  
  281. [div class=tag][font=Reem Kufi]mbti type[/font][/div] infj
  282.  
  283. [div class=tag][font=Reem Kufi]attire[/font][/div] x x x
  284.  
  285. [div class=tag][font=Reem Kufi]gallery[/font][/div] ↓ [div class=gallery]
  286. [div class=column]
  287. [div class=galpic style="background: url(https://i.pinimg.com/474x/6c/1c/c5/6c1cc5e5b24ce8a8044218288f2fa69b.jpg); background-size: 120%; background-position: 50% 50%;"][/div]
  288. [div class=galpic style="background: url(https://i.pinimg.com/originals/8a/5f/1b/8a5f1b9b08bc1022f533fecc552c91bd.gif); background-size: 100%; background-position: 30% 30%;"][/div]
  289. [div class=galpic style="background: url(https://i.pinimg.com/474x/8e/5b/c8/8e5bc85b9641c708d93f5bfe8096dbb9.jpg); background-size: 110%; background-position: 50% 0%;"][/div]
  290. [div class=galpic style="background: url(https://i.pinimg.com/originals/26/eb/73/26eb73ea30023fb13c59a84a0e79695b.gif); background-size: 100%; background-position: 0% 0%;""][/div]
  291. [/div]
  292. [div class=column]
  293. [div class=galpic style="background: url(https://i.pinimg.com/originals/3b/2a/2d/3b2a2d0f34f19a1b7c58ee72342aee9e.gif); background-size: 100%; background-position: 45% 50%;"][/div]
  294. [div class=galpic style="background: url(https://i.pinimg.com/474x/0d/6b/72/0d6b721bbae7c200f44ed414e79141cc.jpg); background-size: 100%; background-position: 50% 20%;"][/div]
  295. [div class=galpic style="background: url(https://i.pinimg.com/originals/e1/ca/10/e1ca103bbb2ca5d73b495d42e4917729.gif); background-size: 120%; background-position: 50%; 0%;"][/div]
  296. [div class=galpic style="background: url(https://i.pinimg.com/474x/db/19/34/db1934c84e45d61f7ed070bdbb154a51.jpg); background-size: 100%; background-position: 0% 0%;"][/div]
  297. [/div]
  298. [/div]
  299. [/font][/div][/div]
  300.  
  301. [div class=tab style="top: 30px; left: 30px;"][font=Reem Kufi]1[/font][/div]
  302. [div class=tab style="top: 50px; left: 30px;"][font=Reem Kufi]2[/font][/div]
  303. [div class=tab style="top: 70px; left: 30px;"][font=Reem Kufi]3[/font][/div]
  304. [div class=tab style="top: 90px; left: 30px;"][font=Reem Kufi]4[/font][/div]
  305. [div class=tab style="top: 110px; left: 30px;"][font=Reem Kufi]5[/font][/div]
  306. [/div][/nobr][div class=credit]code by [USER=2383][COLOR=#dedede]sox[/COLOR][/USER][/div]
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!