API tools faq
paste
Advertisement
kay_kodes

blondie | profile text

kay_kodes
Nov 26th, 2023 (edited)
1,074
1
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 24.73 KB | None | 1 0
raw download clone embed print report
  1. <html>
  2. <!--itle font-->
  3. <link href="https://fonts.cdnfonts.com/css/fadethotrial" rel="stylesheet">
  4.  
  5. <!--general font-->
  6. <link href="https://fonts.cdnfonts.com/css/manjari-2" rel="stylesheet">
  7.  
  8.  
  9. <!--quote font-->
  10. <link href="https://fonts.cdnfonts.com/css/dating-month" rel="stylesheet">
  11.  
  12.  
  13.  
  14. <style>
  15. /*Scrollbar*/
  16. ::-webkit-scrollbar {width: 0px;}
  17. ::-webkit-scrollbar-thumb {background: #b0c4de ; border:1px #fff solid;border-radius:100px}
  18. ::-webkit-scrollbar-thumb:hover {background:#fff;border:1px #696969 solid}
  19.  
  20. .zoom{
  21. transition: all 1.5s
  22.  
  23. }
  24. .zoom:hover {
  25. transform: translateY(-7px);
  26. transform: scale(1.02);
  27.  
  28. }
  29.  
  30. .zoom:active {
  31. transform: translateY(-1px);
  32.  
  33. }
  34.  
  35. button {
  36. width:100px;
  37. height:30px;
  38. overflow: hidden;
  39. border:1px rgba(255,255,255,0.0) solid;
  40. background-color:#b39eb5;
  41. font-size:15px;
  42. font-family:'manjari', sans-serif;
  43. color:#000;
  44. font-style:italic;
  45. font-weight:bold
  46.  
  47. }
  48.  
  49. button:hover {
  50. transform: translateY(-7px);
  51. transition: all 0.6s ease 0s;
  52. font-size:15px
  53. </style>
  54.  
  55. <br>
  56. <center>
  57. <!--BOX-->
  58.  
  59. <!--OUTER BOX-->
  60. <div style="background:#d8bfd8;text-align:justify;color:#696969;font-family:'Times New Roman';font-size:15px;width:500px;height:600px;text-align:justify;overflow:hidden;padding:10px">
  61.  
  62. <!--INNER BOX-->
  63. <div style="background:#f2e5a2;text-align:justify;border-radius:20px;color:#696969;font-family:'manjari';font-size:15px;width:500px;height:600px;text-align:justify;overflow:auto;box-shadow: 1px 1px 6px 2px #696969">
  64.  
  65.  
  66.  
  67.  
  68.  
  69. <!--NAME-->
  70. <div style="text-align:justify;color:#696969;font-family:'fadethotrial';font-size:35px;border-radius:10px;margin-top:23px;margin-right:20px;float:right;width:300px;text-align:right">
  71.  
  72. <!--name text-->
  73. <div style=";text-align:justify;color:#000;font-family:'fadethotrial';font-size:30px;border-radius:10px;float:right;width:300px;text-align:right;margin-right:10px">
  74. blondie fitzherbert
  75.  
  76.  
  77. </div></div>
  78.  
  79. <!--QUOTE-->
  80. <div style="text-align:justify;color:#696969;font-family:'fadethotrial';font-size:35px;border-radius:10px;margin-top:5px;margin-right:20px;float:right;width:300px;text-align:right">
  81.  
  82.  
  83. <!--quote text-->
  84. <div style=";text-align:justify;color:#000;font-family:'dating month';font-size:30px;border-radius:10px;float:right;width:300px;text-align:right;margin-right:10px">
  85. "i have magic hair that glows when i sing"
  86.  
  87. </div></div>
  88.  
  89. <br>
  90.  
  91. <!--left image-->
  92. <img src="https://i.pinimg.com/564x/18/31/99/183199662272618b8f743fe3678e26ec.jpg" style="width:40px;height:70px;object-fit:cover;margin-top:20px;margin-left:30px;box-shadow: 0px 0px 8px 0px #fff;border-bottom-left-radius:60px;border-top-right-radius:60px;transform:rotate(-10deg);position:absolute" />
  93.  
  94. <!--center image-->
  95. <img src="https://i.pinimg.com/564x/ec/fe/57/ecfe57063e1f3afffa28e71373f74888.jpg" style="width:40px;height:80px;object-fit:cover;margin-top:4px;margin-left:70px;box-shadow: 0px 0px 8px 0px #fff;border-top-left-radius:60px;border-bottom-right-radius:60px;transform:rotate(-10deg);position:absolute" />
  96.  
  97. <!--right image-->
  98. <img src="https://i.pinimg.com/564x/3c/e9/41/3ce941b74d7cae9b2036a1125114a8ca.jpg" style="width:40px;height:70px;object-fit:cover;margin-top:40px;margin-left:120px;box-shadow: 0px 0px 8px 0px #fff;border-bottom-left-radius:60px;border-top-right-radius:60px;transform:rotate(-90deg);position:absolute" />
  99.  
  100.  
  101. <br><br>
  102.  
  103. <!--purple tag-->
  104. <div style="background:#b39eb5;text-align:justify;border-radius:5px;color:#fff;font-size:13px;text-align:justify;margin-right:20px;margin-left:280px;height:30px;overflow:hidden;width:100px;position:absolute;margin-top:85px;font-size:25px;font-family:'fadethotrial'"><center>briefs</center></div>
  105.  
  106. <!--white box-->
  107. <div style="background:#fff;text-align:justify;border-radius:20px;color:#696969;font-family:'manjari';font-size:13px;text-align:justify;margin-right:20px;margin-left:20px;margin-bottom:10px;height:150px;overflow:hidden;width:330px;margin-top:10px">
  108.  
  109. <!--text settings-->
  110. <div style="background:#fff;text-align:justify;border-radius:0px;color:#696969;font-family:'manjari';font-size:13px;text-align:justify;margin-right:20px;margin-left:20px;margin-bottom:10px;height:200px">
  111.  
  112. <br><br>
  113.  
  114. <b>full name.</b> here<br>
  115. <b>nicknames.</b> here<br>
  116. <b>birthday.</b> here<br>
  117. <b>birthplace.</b> here<br>
  118. <b>kingdom.</b> here<br>
  119. <b>status.</b> here<br>
  120.  
  121. <!--pfp image-->
  122. <img src="https://i.pinimg.com/564x/e0/61/c4/e061c46547162c06dcca18866344ebe8.jpg" style="width:120px;height:130px;object-fit:cover;margin-left:10px;outline:1px solid #fff;outline-offset:-5px;box-shadow: 0px 0px 8px 0px #fff;border-top-left-radius:60px;border-top-right-radius:60px;float:right;margin-top:-115px" />
  123.  
  124. </div>
  125. </div>
  126.  
  127. <!--top image-->
  128. <img src="https://i.pinimg.com/564x/9a/7d/97/9a7d979bf6d379c8cc5c09f2bd3f5def.jpg" style="width:90px;height:50px;object-fit:cover;margin-top:10px;margin-left:10px;float:right;margin-top:-150px;margin-right:10px;border-bottom: 15px solid #fff;border-top:#fff 5px solid;border-left:#fff 5px solid;border-right:#fff 5px solid;transform:rotate(7deg)" />
  129.  
  130. <!--bottom image-->
  131. <img src="https://i.pinimg.com/564x/f6/f5/0d/f6f50de3cf88ae8b596c9a20bab2f803.jpg" style="width:90px;height:50px;object-fit:cover;margin-left:10px;float:right;margin-top:-90px;margin-right:30px;border-bottom: 15px solid #fff;border-top:#fff 5px solid;border-left:#fff 5px solid;border-right:#fff 5px solid;transform:rotate(-7deg)" />
  132.  
  133.  
  134. <!--BUTTONS-->
  135. <button class="tablinks" onclick="openCity(event, 'one')" id="defaultOpen" style="wbackground-size:cover;margin-left:35px;margin-top:5px;position:absolute;color:#fff;border-radius:10px">about me</button>
  136.  
  137. <button class="tablinks" onclick="openCity(event, 'two')" id="defaultOpen" style="wbackground-size:cover;margin-left:145px;margin-top:5px;position:absolute;color:#fff;border-radius:10px">gallery</button>
  138.  
  139. <button class="tablinks" onclick="openCity(event, 'three')" id="defaultOpen" style="wbackground-size:cover;margin-left:255px;margin-top:5px;position:absolute;color:#fff;border-radius:10px">relations </button>
  140.  
  141. <button class="tablinks" onclick="openCity(event, 'four')" id="defaultOpen" style="wbackground-size:cover;margin-left:365px;margin-top:5px;position:absolute;color:#fff;border-radius:10px">playlist</button>
  142.  
  143. <br><br>
  144. <br>
  145.  
  146. <!--PAGE ONE-->
  147. <div id="one" class="tabcontent">
  148. <div style="background:#f2e5a2;text-align:justify;border-radius:20px;color:#696969;font-family:'oktah neue';font-size:13px;text-align:justify;margin-right:20px;margin-left:20px;margin-bottom:10px;height:250px;overflow:hidden">
  149.  
  150. <div style="background:#fff;text-align:justify;border-radius:20px;color:#696969;font-family:'manjari';font-size:13px;text-align:justify;margin-right:20px;margin-left:0px;margin-bottom:10px;height:250px;overflow:auto;width:220">
  151.  
  152. <!--text settings-->
  153. <div style="background:#fff;text-align:justify;border-radius:0px;color:#696969;font-family:'manjari';font-size:13px;text-align:justify;margin-right:20px;margin-left:20px;margin-bottom:10px;height:230px;margin-top:5;overflow:auto">
  154.  
  155. <br>
  156.  
  157. <h style="font-family: 'fadethotrial';font-size:20px">family tree</h>
  158.  
  159. <div style=" border-left: 2px solid #696969; padding-left: 10px">
  160. <p><b>mother.</b> name here <br>
  161. <b>father.</b> name here
  162. <br>
  163.  
  164.  
  165.  
  166. <div style=" border-left: 2px solid #696969; padding-left: 10px;margin-left:10px">
  167. <b>sister.</b> name here<br>
  168. <b>brother.</b> name here<br>
  169.  
  170. </div>
  171. </div>
  172. <br>
  173. <b>significant other.</b> name here
  174.  
  175. <br><br>
  176. <h style="font-family: 'fadethotrial';font-size:20px">personality</h>
  177. <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
  178.  
  179.  
  180.  
  181. </div></div>
  182.  
  183. <div style="background:#fff;text-align:justify;border-radius:20px;color:#696969;font-family:'manjari';font-size:13px;text-align:justify;margin-left:-30px;margin-bottom:10px;height:250px;overflow:auto;width:220;float:right;margin-top:-260px">
  184.  
  185. <!--text settings-->
  186. <div style="background:#fff;text-align:justify;border-radius:0px;color:#696969;font-family:'manjari';font-size:13px;text-align:justify;margin-right:20px;margin-left:20px;margin-bottom:10px;height:230px;margin-top:5;overflow:auto">
  187.  
  188. <br>
  189. <h style="font-family: 'fadethotrial';font-size:20px">favorites</h>
  190. <p>
  191. <b>food.</b> here<br>
  192. <b>drink.</b> here<br>
  193. <b>dessert.</b> here<br>
  194. <b>hiding spot.</b> here<br>
  195. <b>weapon.</b> here
  196.  
  197. <hr style="border:1px #000 dashed;border-radius:20px">
  198.  
  199. <h style="font-family: 'fadethotrial';font-size:20px">likes</h>
  200. <p>
  201. <b>season.</b> here<br>
  202. <b>animal.</b> here<br>
  203. <b>time passer.</b> here<br>
  204. <b>hobby.</b> here<br>
  205. <b>instrument.</b> here
  206.  
  207.  
  208. <hr style="border:1px #000 dashed;border-radius:20px">
  209.  
  210. <h style="font-family: 'fadethotrial';font-size:20px">dislikes</h>
  211. <p>
  212. <b>weather.</b> here<br>
  213. <b>pet peeve.</b> here<br>
  214. <b>types of people.</b> here<br>
  215. <b>fear.</b> here<br>
  216. <b>ick.</b> here
  217.  
  218.  
  219. <hr style="border:1px #000 dashed;border-radius:20px">
  220.  
  221. <h style="font-family: 'fadethotrial';font-size:20px">strengths</h>
  222. <p>
  223. <b>hobby.</b> here<br>
  224. <b>school subject.</b> here<br>
  225. <b>hidden talent.</b> here<br>
  226. <b>natural talent.</b> here<br>
  227. <b>new talent.</b> here
  228.  
  229. <hr style="border:1px #000 dashed;border-radius:20px">
  230.  
  231. <h style="font-family: 'fadethotrial';font-size:20px">weaknesses</h>
  232. <p>
  233. <b>guilty pleasure.</b> here<br>
  234. <b>school subject.</b> here<br>
  235. <b>hobby.</b> here<br>
  236. <b>emotion.</b> here<br>
  237. <b>habits.</b> here
  238.  
  239.  
  240.  
  241. </div></div></div></div>
  242.  
  243.  
  244.  
  245. <!--PAGE TWO-->
  246. <div id="two" class="tabcontent">
  247. <div style="background:#f2e5a2;text-align:justify;border-radius:20px;color:#696969;font-family:'oktah neue';font-size:13px;text-align:justify;margin-right:20px;margin-left:20px;margin-bottom:10px;height:250px;overflow:hidden">
  248.  
  249. <!--purple tag-->
  250. <div style="background:#b39eb5;text-align:justify;border-radius:5px;color:#fff;font-size:13px;text-align:justify;margin-right:20px;margin-left:140px;height:30px;overflow:hidden;width:90px;position:absolute;margin-top:-5px;font-size:23px;font-family:'fadethotrial'"><center>me</center></div>
  251.  
  252. <div style="background:#fff;text-align:justify;border-radius:20px;color:#696969;font-family:'oktah neue';font-size:13px;text-align:justify;margin-right:20px;margin-left:0px;margin-bottom:10px;height:250px;overflow:hidden;width:220">
  253.  
  254. <!--text settings-->
  255. <div style="background:#fff;text-align:justify;border-radius:0px;color:#696969;font-family:'oktah neue';font-size:13px;text-align:justify;margin-right:20px;margin-left:20px;margin-bottom:10px;height:200px">
  256.  
  257. <br>
  258.  
  259. <img src="https://i.pinimg.com/564x/3f/39/fd/3f39fd8dc66a42e2fcc5db5e3ca73629.jpg" style="width:90px;height:50px;object-fit:cover;margin-top:10px;margin-left:10px;float:right;margin-right:10px;border-bottom: 15px solid #fff;border-top:#fff 5px solid;border-left:#fff 5px solid;border-right:#fff 5px solid;transform:rotate(7deg);box-shadow:2px 2px 4px #000 " />
  260.  
  261. <img src="https://i.pinimg.com/736x/46/6c/8c/466c8c1e19335f8a70e7f847c8f601f1.jpg" style="width:95px;height:95px;object-fit:cover;margin-top:-30px;margin-left:10px;float:right;margin-right:80px;border-bottom: 15px solid #fff;border-top:#fff 5px solid;border-left:#fff 5px solid;border-right:#fff 5px solid;transform:rotate(-4deg);box-shadow:2px 2px 4px #000" />
  262.  
  263. <img src="https://i.pinimg.com/564x/00/4d/41/004d41e97f6ce70b359697dbe62cf7bb.jpg" style="width:95px;height:95px;object-fit:cover;margin-top:-60px;margin-left:60px;float:right;margin-right:10px;border-bottom: 15px solid #fff;border-top:#fff 5px solid;border-left:#fff 5px solid;border-right:#fff 5px solid;transform:rotate(5deg);box-shadow:2px 2px 4px #000" />
  264.  
  265.  
  266. <br><br>
  267.  
  268. </div></div>
  269.  
  270. <!--purple tag-->
  271. <div style="background:#b39eb5;text-align:justify;border-radius:5px;color:#fff;font-size:13px;text-align:justify;margin-right:20px;margin-left:380px;height:30px;overflow:hidden;width:90px;position:absolute;margin-top:-35px;font-size:23px;font-family:'fadethotrial'"><center>loves</center></div>
  272.  
  273. <div style="background:#fff;text-align:justify;border-radius:20px;color:#696969;font-family:'oktah neue';font-size:13px;text-align:justify;margin-left:-30px;margin-bottom:10px;height:250px;overflow:auto;width:220;float:right;margin-top:-260px">
  274.  
  275. <!--text settings-->
  276. <div style="background:#fff;text-align:justify;border-radius:0px;color:#696969;font-family:'oktah neue';font-size:13px;text-align:justify;margin-right:20px;margin-left:20px;margin-bottom:10px;height:230px;margin-top:5;overflow:auto">
  277.  
  278. <br>
  279.  
  280. <img src="https://i.pinimg.com/564x/49/96/48/499648180a0cfa2da3ce8d9799b46a1f.jpg" style="width:90px;height:90px;object-fit:cover;margin-top:10px;margin-left:10px;float:right;margin-right:10px;border-bottom: 15px solid #fff;border-top:#fff 5px solid;border-left:#fff 5px solid;border-right:#fff 5px solid;transform:rotate(7deg);box-shadow:2px 2px 4px #000 " />
  281.  
  282. <img src="https://i.pinimg.com/564x/f7/17/7d/f7177dd55f42643908d93381f91828f0.jpg" style="width:90px;height:100px;object-fit:cover;margin-top:-50px;margin-left:10px;float:left;margin-right:10px;border-bottom: 15px solid #fff;border-top:#fff 5px solid;border-left:#fff 5px solid;border-right:#fff 5px solid;transform:rotate(-7deg);box-shadow:2px 2px 4px #000 " />
  283.  
  284. <img src="https://i.pinimg.com/736x/d7/cd/4b/d7cd4b6913b4df579f11222ceeef2000.jpg" style="width:90px;height:60px;object-fit:cover;margin-top:-70px;margin-left:70px;float:left;margin-right:10px;border-bottom: 15px solid #fff;border-top:#fff 5px solid;border-left:#fff 5px solid;border-right:#fff 5px solid;transform:rotate(-3deg);box-shadow:2px 2px 4px #000 " />
  285.  
  286. <img src="https://i.pinimg.com/564x/f1/5d/da/f15dda85ce6478d73f489250ff8e7f5d.jpg" style="width:90px;height:90px;object-fit:cover;margin-top:-10px;margin-left:10px;float:left;margin-right:10px;border-bottom: 15px solid #fff;border-top:#fff 5px solid;border-left:#fff 5px solid;border-right:#fff 5px solid;transform:rotate(0deg);box-shadow:2px 2px 4px #000" />
  287.  
  288. <img src="https://i.pinimg.com/564x/b0/4f/23/b04f2335a59507d065c1dec726dffde1.jpg" style="width:90px;height:90px;object-fit:cover;margin-top:-70px;margin-left:30px;float:right;margin-right:10px;border-bottom: 15px solid #fff;border-top:#fff 5px solid;border-left:#fff 5px solid;border-right:#fff 5px solid;transform:rotate(5deg);box-shadow:2px 2px 4px #000" />
  289.  
  290.  
  291.  
  292. <br><br>
  293.  
  294. </div></div></div></div>
  295.  
  296.  
  297.  
  298. <!--PAGE THREE-->
  299. <div id="three" class="tabcontent">
  300. <div style="background:#f2e5a2;text-align:justify;border-radius:20px;color:#696969;font-family:'oktah neue';font-size:13px;text-align:justify;margin-right:20px;margin-left:20px;margin-bottom:10px;height:250px;overflow:hidden">
  301.  
  302. <div style="background:#fff;text-align:justify;border-radius:20px;color:#696969;font-family:'manjari';font-size:13px;text-align:justify;margin-right:10px;margin-left:10px;margin-bottom:10px;height:250px;overflow:auto">
  303.  
  304. <!--text settings-->
  305. <div style="background:#fff;text-align:justify;border-radius:0px;color:#696969;font-family:'manjari';font-size:13px;text-align:justify;margin-right:20px;margin-left:20px;margin-bottom:10px;height:230px;margin-top:5;overflow:auto">
  306.  
  307. <br>
  308.  
  309. <!--first relation-->
  310. <div style="margin-right:10px;float:left;margin-top:10px;outline:5px #b39eb5 dotted;outline-offset:5px;margin-left:10px">
  311. <img src="https://i.pinimg.com/564x/cd/29/f0/cd29f05e0947d9233ff4386e12fbfb0e.jpg" style="width:70px;height:70px;border:solid #fff;float:left;margin-right:10px;object-fit:cover;margin-top:10px;border-bottom: 15px solid #fff;border-top:#fff 5px solid;border-left:#fff 5px solid;border-right:#fff 5px solid;box-shadow:2px 2px 4px #000">
  312. <p><b>Relation | Name</b></p>
  313. <p>Lorem ipsum dolor sit amet. Est dolor consectetur et galisum saepe et sunt odit qui maiores quasi. Est dolor consectetur et galisum saepe et sunt odit qui maiores quasi. Ea saepe officia eum nulla quaerat 33 corrupti animi.
  314. </div><br>
  315.  
  316.  
  317.  
  318. <!--each relation-->
  319. <div style="margin-right:10px;float:left;margin-top:40px;outline:5px #b39eb5 dotted;outline-offset:5px;margin-left:10px">
  320. <img src="https://i.pinimg.com/564x/90/49/c6/9049c6e192d3cabf80489a73f54f5848.jpg" style="width:70px;height:70px;border:solid #fff;float:left;margin-right:10px;object-fit:cover;margin-top:10px;border-bottom: 15px solid #fff;border-top:#fff 5px solid;border-left:#fff 5px solid;border-right:#fff 5px solid;box-shadow:2px 2px 4px #000">
  321. <p><b>Relation | Name</b></p>
  322. <p>Lorem ipsum dolor sit amet. Est dolor consectetur et galisum saepe et sunt odit qui maiores quasi. Est dolor consectetur et galisum saepe et sunt odit qui maiores quasi. Ea saepe officia eum nulla quaerat 33 corrupti animi.
  323. </div><br>
  324.  
  325. <!--each relation-->
  326. <div style="margin-right:10px;float:left;margin-top:40px;outline:5px #b39eb5 dotted;outline-offset:5px;margin-left:10px">
  327. <img src="https://i.pinimg.com/564x/46/91/b4/4691b44c3b04d6256c1a9d5a38695dba.jpg" style="width:70px;height:70px;border:solid #fff;float:left;margin-right:10px;object-fit:cover;margin-top:10px;border-bottom: 15px solid #fff;border-top:#fff 5px solid;border-left:#fff 5px solid;border-right:#fff 5px solid;box-shadow:2px 2px 4px #000">
  328. <p><b>Relation | Name</b></p>
  329. <p>Lorem ipsum dolor sit amet. Est dolor consectetur et galisum saepe et sunt odit qui maiores quasi. Est dolor consectetur et galisum saepe et sunt odit qui maiores quasi. Ea saepe officia eum nulla quaerat 33 corrupti animi.
  330. </div><br>
  331.  
  332. <!--each relation-->
  333. <div style="margin-right:10px;float:left;margin-top:40px;outline:5px #b39eb5 dotted;outline-offset:5px;margin-left:10px">
  334. <img src="https://i.pinimg.com/564x/fe/ab/6f/feab6fbfa8fc2c879afc5a12ecfec6e8.jpg" style="width:70px;height:70px;border:solid #fff;float:left;margin-right:10px;object-fit:cover;margin-top:10px;border-bottom: 15px solid #fff;border-top:#fff 5px solid;border-left:#fff 5px solid;border-right:#fff 5px solid;box-shadow:2px 2px 4px #000">
  335. <p><b>Relation | Name</b></p>
  336. <p>Lorem ipsum dolor sit amet. Est dolor consectetur et galisum saepe et sunt odit qui maiores quasi. Est dolor consectetur et galisum saepe et sunt odit qui maiores quasi. Ea saepe officia eum nulla quaerat 33 corrupti animi.
  337. </div><br>
  338.  
  339. <!--each relation-->
  340. <div style="margin-right:10px;float:left;margin-top:40px;outline:5px #b39eb5 dotted;outline-offset:5px;margin-left:10px">
  341. <img src="https://i.pinimg.com/564x/5a/53/73/5a5373efde9060848f29a579d170f9b2.jpg" style="width:70px;height:70px;border:solid #fff;float:left;margin-right:10px;object-fit:cover;margin-top:10px;border-bottom: 15px solid #fff;border-top:#fff 5px solid;border-left:#fff 5px solid;border-right:#fff 5px solid;box-shadow:2px 2px 4px #000;">
  342. <p><b>Relation | Name</b></p>
  343. <p>Lorem ipsum dolor sit amet. Est dolor consectetur et galisum saepe et sunt odit qui maiores quasi. Est dolor consectetur et galisum saepe et sunt odit qui maiores quasi. Ea saepe officia eum nulla quaerat 33 corrupti animi.
  344. </div>
  345.  
  346.  
  347. <div style=";text-align:justify;color:#000;font-family:'dating month';font-size:30px;border-radius:10px;float:right;width:300px;text-align:right;margin-right:10px;margin-top:40px">
  348. "all at once, everything is different, now that i see you"
  349. </div>
  350.  
  351. <br><br>
  352.  
  353. </div></div></div></div>
  354.  
  355.  
  356.  
  357.  
  358. <!--PAGE FOUR-->
  359. <div id="four" class="tabcontent">
  360. <div style="background:#f2e5a2;text-align:justify;border-radius:20px;color:#696969;font-family:'oktah neue';font-size:13px;text-align:justify;margin-right:20px;margin-left:20px;margin-bottom:10px;height:250px;overflow:hidden">
  361.  
  362. <div style="background:#fff;text-align:justify;border-radius:20px;color:#696969;font-family:'manjari';font-size:13px;text-align:justify;margin-right:10px;margin-left:10px;margin-bottom:10px;height:250px;overflow:auto">
  363.  
  364. <!--text settings-->
  365. <div style="background:#fff;text-align:justify;border-radius:0px;color:#696969;font-family:'manjari';font-size:13px;text-align:justify;margin-right:20px;margin-left:20px;margin-bottom:10px;height:230px;margin-top:5;overflow:auto">
  366.  
  367. <br>
  368.  
  369. <!--first song-->
  370. <div style="margin-right:10px;float:left;margin-top:10px;outline:5px #b39eb5 dotted;outline-offset:5px;margin-left:10px">
  371. <img src="https://cdn.discordapp.com/attachments/871345898469355533/1186217937833562112/Minimalist_Flowers_Outline_A4_Stationery_Paper_Document_1.gif?ex=6592728b&is=657ffd8b&hm=813530f451b3cda2cc1942635fef2a52187e44954540d21d2cbce93efd7b08d0&" style="width:100px;height:100px;border:solid #fff;float:left;margin-right:10px;object-fit:cover">
  372. <p><b>Song Name | Artist</b></p>
  373. <p><i>"Lorem ipsum dolor sit amet. Est dolor consectetur et galisum saepe et sunt odit qui maiores quasi."</i>
  374. </div><br>
  375.  
  376.  
  377.  
  378. <!--each song-->
  379. <div style="margin-right:10px;float:left;margin-top:40px;outline:5px #b39eb5 dotted;outline-offset:5px;margin-left:10px">
  380. <img src="https://cdn.discordapp.com/attachments/871345898469355533/1186217937833562112/Minimalist_Flowers_Outline_A4_Stationery_Paper_Document_1.gif?ex=6592728b&is=657ffd8b&hm=813530f451b3cda2cc1942635fef2a52187e44954540d21d2cbce93efd7b08d0&" style="width:100px;height:100px;border:solid #fff;float:left;margin-right:10px;object-fit:cover">
  381. <p><b>Song Name | Artist</b></p>
  382. <p><i>"Lorem ipsum dolor sit amet. Est dolor consectetur et galisum saepe et sunt odit qui maiores quasi."</i>
  383. </div><br>
  384.  
  385. <!--each song-->
  386. <div style="margin-right:10px;float:left;margin-top:40px;outline:5px #b39eb5 dotted;outline-offset:5px;margin-left:10px">
  387. <img src="https://cdn.discordapp.com/attachments/871345898469355533/1186217937833562112/Minimalist_Flowers_Outline_A4_Stationery_Paper_Document_1.gif?ex=6592728b&is=657ffd8b&hm=813530f451b3cda2cc1942635fef2a52187e44954540d21d2cbce93efd7b08d0&" style="width:100px;height:100px;border:solid #fff;float:left;margin-right:10px;object-fit:cover">
  388. <p><b>Song Name | Artist</b></p>
  389. <p><i>"Lorem ipsum dolor sit amet. Est dolor consectetur et galisum saepe et sunt odit qui maiores quasi."</i>
  390. </div><br>
  391.  
  392. <!--each song-->
  393. <div style="margin-right:10px;float:left;margin-top:40px;outline:5px #b39eb5 dotted;outline-offset:5px;margin-left:10px">
  394. <img src="https://cdn.discordapp.com/attachments/871345898469355533/1186217937833562112/Minimalist_Flowers_Outline_A4_Stationery_Paper_Document_1.gif?ex=6592728b&is=657ffd8b&hm=813530f451b3cda2cc1942635fef2a52187e44954540d21d2cbce93efd7b08d0&" style="width:100px;height:100px;border:solid #fff;float:left;margin-right:10px;object-fit:cover">
  395. <p><b>Song Name | Artist</b></p>
  396. <p><i>"Lorem ipsum dolor sit amet. Est dolor consectetur et galisum saepe et sunt odit qui maiores quasi."</i>
  397. </div><br>
  398.  
  399. <!--each song-->
  400. <div style="margin-right:10px;float:left;margin-top:40px;outline:5px #b39eb5 dotted;outline-offset:5px;margin-left:10px">
  401. <img src="https://cdn.discordapp.com/attachments/871345898469355533/1186217937833562112/Minimalist_Flowers_Outline_A4_Stationery_Paper_Document_1.gif?ex=6592728b&is=657ffd8b&hm=813530f451b3cda2cc1942635fef2a52187e44954540d21d2cbce93efd7b08d0&" style="width:100px;height:100px;border:solid #fff;float:left;margin-right:10px;object-fit:cover">
  402. <p><b>Song Name | Artist</b></p>
  403. <p><i>"Lorem ipsum dolor sit amet. Est dolor consectetur et galisum saepe et sunt odit qui maiores quasi."</i>
  404. </div><br>
  405.  
  406.  
  407. <div style=";text-align:justify;color:#000;font-family:'dating month';font-size:30px;border-radius:10px;float:right;width:300px;text-align:right;margin-right:10px;margin-top:40px">
  408. "when will my life begin?"
  409. </div>
  410.  
  411. <br><br>
  412.  
  413. </div></div></div>
  414.  
  415. </div></div></div>
  416.  
  417.  
  418. <!--CREDITS DO NOT TOUCH!!-->
  419. <center><a href="https://kaykodes.tumblr.com/" style="color:#000;font-size:14px"><b><u>kay kodes</u></b></center>
  420.  
  421.  
  422. <link rel="preconnect" href="https://fonts.googleapis.com">
  423. <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
  424. <link href="https://fonts.googleapis.com/css2?family=Sacramento&display=swap" rel="stylesheet">
  425.  
  426. <script>
  427. function openCity(evt, cityName) {
  428. var i, tabcontent, tablinks;
  429. tabcontent = document.getElementsByClassName("tabcontent");
  430. for (i = 0; i < tabcontent.length; i++) {
  431. tabcontent[i].style.display = "none";
  432. }
  433. tablinks = document.getElementsByClassName("tablinks");
  434. for (i = 0; i < tablinks.length; i++) {
  435. tablinks[i].className = tablinks[i].className.replace(" active", "");
  436. }
  437. document.getElementsByClassName("tablinks");
  438. for (i = 0; i < tablinks.length; i++) {
  439. tablinks[i].className = tablinks[i].className.replace(" active", "");
  440. }
  441. document.getElementById(cityName).style.display = "block";
  442. evt.currentTarget.className += " active";
  443. }
  444.  
  445. // Get the element with id="defaultOpen" and click on it
  446. document.getElementById("defaultOpen").click();
  447. </script>
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!