API tools faq
paste
Advertisement
mebuckner

Custom Order - princessofthenight

mebuckner
Sep 27th, 2020 (edited)
118
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 21.24 KB | None | 0 0
raw download clone embed print report
  1. <!--about me-->
  2. <link href="//solrainha.github.io/honeybee/honeybee.css" rel="stylesheet">
  3. <style type="text/css">
  4.  
  5. body {
  6. background-color:#232426;
  7. background-repeat:no-repeat;
  8. background-attachment:fixed;
  9. margin: 0;
  10. overflow:auto;
  11. background-image:url('https://i.imgur.com/AvhwZSy.png');
  12. background-size:cover;
  13. }
  14.  
  15. table, tr, td, li, p, div, .profileInfo td.text {
  16.     font-size: 10px;
  17.     color: #717171;
  18.     font-family: 'Poppins', sans-serif;}
  19.  
  20. h1{
  21. width: 225px;
  22. background: #1E025D;
  23. color: #fff;
  24. margin: 0;
  25. padding-top: 10px;
  26. padding-bottom: 10px;
  27. margin-bottom: 10px;
  28. text-align: center;
  29. font-family: Georgia;
  30. font-size: 19px;
  31. text-transform: uppercase;
  32. letter-spacing: 5px;
  33. }
  34.  
  35.  
  36. h2{
  37. width: 278px;
  38. background: #69DAE1;
  39. color: #0d0d0d;
  40. margin: 0;
  41. padding-top: 5px;
  42. padding-bottom: 5px;
  43. margin-bottom: 5px;
  44. text-align: center;
  45. font-family: Georgia;
  46. font-size: 12px;
  47. text-transform: uppercase;
  48. letter-spacing: 5px;
  49. }
  50.  
  51.  
  52. h3{
  53. width: 113px;
  54. background: #1E025D;
  55. color: #fff;
  56. margin: 0;
  57. padding-top: 5px;
  58. padding-bottom: 5px;
  59. margin-bottom: 5px;
  60. text-align: center;
  61. font-family: Georgia;
  62. font-size: 12px;
  63. text-transform: uppercase;
  64. }
  65.  
  66.  
  67. b{
  68. background-color:#1E025D;
  69. color:#fff;
  70. padding:5px;
  71. line-height:33px;
  72. }
  73.  
  74. .container {
  75. width:1000px;
  76. height:600px;
  77. position:absolute;
  78. left:0;
  79. right:0;
  80. top:0;
  81. bottom:0;
  82. overflow:hidden;
  83. margin:auto;
  84. color:#fff;
  85. background-color:#0d0d0d;
  86. font-family: 'Abel', sans-serif;
  87. }
  88.  
  89. #leftcontainer{
  90. width:291px;
  91. height:360px;
  92. display:inline-block;
  93. vertical-align:top;
  94. margin-right:10px;
  95. }
  96.  
  97. #rightContainer{
  98. width:290px;
  99. height:360px;
  100. display:inline-block;
  101. vertical-align:top;
  102. }
  103.  
  104. #middleContainer{
  105. width:393px;
  106. height:360px;
  107. display:inline-block;
  108. vertical-align:top;
  109. margin-right:10px;
  110. }
  111.  
  112. #pastBio{
  113. width: 230px;
  114. height: 155px;  
  115. vertical-align: top;
  116. display: inline-block;
  117. background: #0d0d0d;
  118. margin-bottom: 10px;
  119. padding: 10px;
  120. font-family: Georgia;
  121. font-size: 12px;
  122. color: #fff;
  123. text-align: justify;
  124. overflow: auto;
  125. }
  126.  
  127. #pastBioImage{
  128. width:130px;
  129. height:175px;
  130. vertical-align:top;
  131. display:inline-block;
  132. margin-right:10px;
  133. }
  134.  
  135.  
  136. #currentBio{
  137. width: 230px;
  138. height: 155px;  
  139. vertical-align: top;
  140. display: inline-block;
  141. background: #0d0d0d;
  142. margin-bottom: 10px;
  143. padding: 10px;
  144. font-family: Georgia;
  145. font-size: 12px;
  146. color: #fff;
  147. text-align: justify;
  148. overflow: auto;
  149. }
  150.  
  151. #currentBioImage{
  152. width:130px;
  153. height:175px;
  154. vertical-align:top;
  155. display:inline-block;
  156. }
  157.  
  158.  
  159.  
  160. #topNavigationBar{
  161. width:1000px;
  162. height:40px;
  163. background:#0d0d0d;
  164. text-align:center;
  165. }
  166.  
  167. #bannerImage{
  168. width:1000px;
  169. height:200px;
  170. background-image:url('https://i.imgur.com/bEE6Gmp.png');
  171. }
  172.  
  173. a.topNavigation:link, a.topNavigation:visited {
  174. background-color: #0d0d0d;
  175. color: #69DAE1;
  176. padding: 13px 25px;
  177. text-align: center;
  178. text-decoration: none;
  179. display: inline-block;
  180. font-family:Georgia;
  181. font-size:12px;
  182. text-transform:uppercase;
  183. width: 90px;
  184. }
  185.  
  186. a.topNavigation:hover, a.topNavigation:active {
  187. color:#1E025D;
  188. }
  189.  
  190.  
  191.  
  192. a.connections:link, a.connections:visited {
  193. background-color: #1e025d;
  194. color: #fff;
  195. padding: 13px 25px;
  196. text-align: center;
  197. text-decoration: none;
  198. display: inline-block;
  199. font-family:Georgia;
  200. font-size:12px;
  201. text-transform:uppercase;
  202. width: 225px;
  203. border-bottom: 5px solid #0d0d0d;
  204. }
  205.  
  206. a.connections:hover, a.connections:active {
  207. color:#000;
  208. }
  209.  
  210.  
  211. .basicInformationBlock{
  212. width:291px;
  213. background:#fff;
  214. height:113px;
  215. margin-bottom:10px;
  216. margin-top:10px;
  217. }
  218.  
  219.  
  220. div.basicInformationBlock .overlay {
  221. position: absolute;
  222. left: 0px;
  223. display: none;
  224. width: 271px;
  225. height: 93px;
  226. background: #0d0d0d;
  227. margin-top: -113px;
  228. font-family: Georgia;
  229. font-size: 12px;
  230. text-align: justify;
  231. color: #fff;
  232. padding: 10px;
  233. overflow:auto;
  234. }
  235.  
  236. div.basicInformationBlock:hover .overlay {
  237. display: block;
  238. }
  239.  
  240.  
  241. .loveInterestBlock{
  242. width:291px;
  243. background:#fff;
  244. height:113px;
  245. margin-bottom:10px;
  246. margin-top:10px;
  247. }
  248.  
  249.  
  250. div.loveInterestBlock .overlay {
  251. position: absolute;
  252. left: 709px;
  253. display: none;
  254. width: 271px;
  255. height: 93px;
  256. background: #0d0d0d;
  257. margin-top: -113px;
  258. font-family: Georgia;
  259. font-size: 12px;
  260. text-align: justify;
  261. color: #fff;
  262. padding: 10px;
  263. overflow:auto;
  264. }
  265.  
  266. div.loveInterestBlock:hover .overlay {
  267. display: block;
  268. }
  269.  
  270.  
  271.  
  272.  
  273.  
  274. .personalityBlock{
  275. width:139px;
  276. background:#fff;
  277. height:103px;
  278. display:inline-block;
  279. vertical-align:top;
  280. margin-right:10px;
  281. }
  282.  
  283.  
  284. div.personalityBlock .overlay {
  285. position: absolute;
  286. left: 0px;
  287. display: none;
  288. width: 119px;
  289. height: 83px;
  290. background: #0d0d0d;
  291. margin-top: -103px;
  292. font-family: Georgia;
  293. font-size: 12px;
  294. text-align: justify;
  295. color: #fff;
  296. padding: 10px;
  297. overflow:auto;
  298. }
  299.  
  300. div.personalityBlock:hover .overlay {
  301. display: block;
  302. }
  303.  
  304.  
  305.  
  306. .educationBlock{
  307. width:139px;
  308. background:#fff;
  309. height:103px;
  310. display:inline-block;
  311. vertical-align:top;
  312. margin-right:10px;
  313. }
  314.  
  315.  
  316. div.educationBlock .overlay {
  317. position: absolute;
  318. left: 709px;
  319. display: none;
  320. width: 119px;
  321. height: 83px;
  322. background: #0d0d0d;
  323. margin-top: -103px;
  324. font-family: Georgia;
  325. font-size: 12px;
  326. text-align: justify;
  327. color: #fff;
  328. padding: 10px;
  329. overflow:auto;
  330. }
  331.  
  332. div.educationBlock:hover .overlay {
  333. display: block;
  334. }
  335.  
  336.  
  337. .employmentBlock{
  338. width:138px;
  339. background:#fff;
  340. height:103px;
  341. display:inline-block;
  342. vertical-align:top;
  343. }
  344.  
  345.  
  346. div.employmentBlock .overlay {
  347. position: absolute;
  348. left: 861px;
  349. display: none;
  350. width: 119px;
  351. height: 83px;
  352. background: #0d0d0d;
  353. margin-top: -103px;
  354. font-family: Georgia;
  355. font-size: 12px;
  356. text-align: justify;
  357. color: #fff;
  358. padding: 10px;
  359. overflow:auto;
  360. }
  361.  
  362. div.employmentBlock:hover .overlay {
  363. display: block;
  364. }
  365.  
  366.  
  367. .abilitiesBlock{
  368. width:139px;
  369. background:#fff;
  370. height:103px;
  371. display:inline-block;
  372. vertical-align:top;
  373. }
  374.  
  375.  
  376. div.abilitiesBlock .overlay {
  377. position: absolute;
  378. left: 152px;
  379. display: none;
  380. width: 119px;
  381. height: 83px;
  382. background: #0d0d0d;
  383. margin-top: -103px;
  384. font-family: Georgia;
  385. font-size: 12px;
  386. text-align: justify;
  387. color: #fff;
  388. padding: 10px;
  389. overflow:auto;
  390. }
  391.  
  392. div.abilitiesBlock:hover .overlay {
  393. display: block;
  394. }
  395.  
  396.  
  397.  
  398.  
  399. .physicalAppearanceBlock{
  400. width:291px;
  401. background:#fff;
  402. height:113px;
  403. margin-bottom:10px;
  404. }
  405.  
  406.  
  407. div.physicalAppearanceBlock .overlay {
  408. position: absolute;
  409. left: 0px;
  410. display: none;
  411. width: 271px;
  412. height: 93px;
  413. background: #0d0d0d;
  414. margin-top: -113px;
  415. font-family: Georgia;
  416. font-size: 12px;
  417. text-align: justify;
  418. color: #fff;
  419. padding: 10px;
  420. overflow:auto;
  421. }
  422.  
  423. div.physicalAppearanceBlock:hover .overlay {
  424. display: block;
  425. }
  426.  
  427.  
  428.  
  429. .connectionsBlock{
  430. width:291px;
  431. background:#fff;
  432. height:113px;
  433. margin-bottom:10px;
  434. }
  435.  
  436.  
  437. div.connectionsBlock .overlay {
  438. position: absolute;
  439. left: 709px;
  440. display: none;
  441. width: 271px;
  442. height: 93px;
  443. background: #0d0d0d;
  444. margin-top: -113px;
  445. font-family: Georgia;
  446. font-size: 12px;
  447. text-align: justify;
  448. color: #fff;
  449. padding: 10px;
  450. overflow:auto;
  451. }
  452.  
  453. div.connectionsBlock:hover .overlay {
  454. display: block;
  455. }
  456.  
  457. ::-webkit-scrollbar-thumb:vertical {height:12px; background:#0d0d0d; }
  458. ::-webkit-scrollbar-thumb:horizontal {background-color:#0d0d0d;}
  459. ::-webkit-scrollbar {width:5px; height:7px;}
  460.  
  461.  
  462. .contacttable, .whitetext12, .nametext, .lightbluetext8, .orangetext15, .blacktext12, .btext, .redtext, .redbtext {display:none;height:0px;!important;visibility:hidden} td td td td {border:0px;width:0px;text-align:left;} table, td, tr {padding:0px;width:;background-color:transparent} table table table {padding:1px;height:.01%;width:100%;} table table,table table table table,table,tr,td {height:0px;!important;border:0px;!important} a.text, table div font a, .navbar font, tr td font {visibility:hidden;display:none;height:0px;!important;} #footerWarpper{display: none;} table table table table,table table table table td.text, td.text td.text table{display:none;} td.text table table{display:inline;visibility:visible;} table td table tr td.text table{visibility:hidden;} table td table tr td.text table table,table td table tr td.text table table td.text{visibility:visible;} table.footer {display: none;} div table a.navbar img {display:none;} div table.navigationBar {margin-bottom:-30px;} .profileInfo {display:none;} .profileInfo td {text-align:left;} .profileInfo a img {position:relative; margin-bottom:-1px; margin-bottom:-2px; width:125px; margin-right:-6px; margin-top:4px; _margin-top:3px; display:block;} .profileInfo td td, .nametext, .msOnlineNow img {display:none;} .profileInfo td td.text {display:table-cell; _display:inline;} .profileInfo .text {font-size:7px; line-height:8px; text-transform:uppercase; font-family:small fonts;} .msOnlineNow {font-family:small fonts; letter-spacing:0px; font-size:7px; line-height:8px; padding:2px; padding-left:0px; text-transform:uppercase; font-weight:normal; display:none; text-decoration:blink; letter-spacing:2px;} .userAlbums {display:none;} div td {display:none;} </span>
  463. </style>
  464.  
  465.  
  466.  
  467.  
  468.  
  469.  
  470.  
  471. <!--like to meet-->
  472. <html>
  473. <body>
  474. <div class="container">
  475.  
  476. <div id="topNavigationBar">
  477. <a href="/" class="topNavigation">home</a>
  478. <a href="/" class="topNavigation">message</a>
  479. <a href="/" class="topNavigation">photos</a>
  480. <a href="/" class="topNavigation">comments</a>
  481. <a href="/" class="topNavigation">bulletins</a>
  482. <a href="/" class="topNavigation">stream</a>
  483. <a href="/" class="topNavigation">rules</a>
  484. </div>
  485.  
  486.  
  487.  
  488.  
  489.  
  490.  
  491.  
  492.  
  493. <div id="bannerImage"></div>
  494.  
  495. <div id="leftContainer">
  496.  
  497. <div class="basicInformationBlock">
  498. <img class="baseimg" src="https://i.imgur.com/KTKB0nn.png">
  499. <div class="overlay">
  500. <h2>Basic Information</h2>
  501. <b>Fullname:</b>Sasha Leonore Moonstone <br>
  502. <b>Nickname(s):</b>PrincessOfTheNight<br>
  503. <b>Aliases:</b>Sasha Leonore Moonstone,Sasha Moonstone,Sasha Leonore<br>
  504. <b>Title(s):</b> Ms., Mrs., Princess <br>
  505. <b>Pet Name(s):</b> give her some<br>
  506. <b>Gender:</b> Female <br>
  507. <b>Species:</b> Werewolf<br>
  508. <b>Birthday:</b>October 29, Over 1000+ Ago<br>
  509. <b>Birthplace:</b>Moldova<br>
  510. <b>Real Age:</b>1000+<br>
  511. <b>Age Appearance:</b> Youthful - Ageless<br>
  512. <b>Current Residence:</b> Port Charles, New York<br>
  513. <b>Ethnicity:</b> Eastern European- Moldovanian<br>
  514. <b>Nationality:</b>Nomadic<br>
  515. <b>Accent:</b> Rarest Werewolf/Supernatural Being Blood Type <br>
  516. <b>Spoken Languages:</b> English, Moldovan, French, Spanish, Latin, Italian, Dutch, German, Danish, Portuguese, Gaelic, Russian, Polish, Greek, Slavic, Norwegian, Czech, Belarusian, Ukrainian, Bulgarian, Slovene, Croatian, Hungarian, Turkish, Hebrew, Arabic, Sign Language, Etc. Type <br>
  517. <b>Bloodtype:</b> Rarest Werewolf/Supernatural Being Blood Type <br>
  518. <b>Drivers Licence Number:</b> soon<br>
  519. <b>Signature:</b> Fast Cursive and Legible <br>
  520. <b>Preferred Hand:</b> Ambidextrous <br>
  521. <b>Astrological Sign:</b> Scorpio <br>
  522. <b>Sexual Orientation:</b> Heterosexual<br>
  523. </div>
  524. </div>
  525.  
  526. <div class="physicalAppearanceBlock">
  527. <img class="baseimg" src="https://i.imgur.com/ukaSwSW.png">
  528. <div class="overlay">
  529. <h2>physical Appearance</h2>
  530. <b>Hair Color:</b>Light Brown <br>
  531. <b>Eye Color:</b> Blue <br>
  532. <b>Hairstyle</b> Usually Long and Layered (she rarely ever wears it short) <br>
  533. <b>Skintone:</b> Fair - Alabaster (naturally ; Human Form)<br>
  534. <b>Complexion:</b> Flawless <br>
  535. <b>Makeup:</b> Subtle Natural, But A Bit Sexy Edge But Still Subtle Eyes And More Natural (Every Day Makeup), For Special Occasions She Dos It Up A Bit, But Still Towards The Naturals For Special Occasions & Holidays) <br>
  536. <b>Height:</b>5' 9" (175 cm)<br>
  537. <b>Weight:</b> 121lbs (55 kg)<br>
  538. <b>Bodytype:</b> Slim<br>
  539. <b>Bust Size:</b> 32B<br>
  540. <b>Waist Inches:</b> 24 Inches<br>
  541. <b>Hips Inches:</b> 36 Inches<br>
  542. <b>Clothes Size:</b> 3<br>
  543. <b>Shoe Size:</b> 8<br>
  544. <b>Birthmark:</b> yes<br>
  545. <b>Tattoo(s):</b> An Original Custom Design Of Her Zodiac Sign<br>
  546. <b>Piercing(s)</b> Ears Only<br>
  547. <b>OUTFIT STYLE:</b>She dresses all in one color black and or in other neutrals (when she's at work, but always adds a pop of colour to her outfit, mostly wears a bright coloured blouse when on the job, bartending or whatever job she has at the time, except for when working with motorcycles and cars then she dresses only in dark clothes. That’s as much colour aside from her natural makeup and her jewelry she has on her outfit when at work), When not at work and or has to mix it up style wise, she usually colour blocks her outfit more and add more colour to it., Though she mostly wears dark blues, black, etc…. No matter what she always wears a distinct item of clothing or accessory — a pop of colour her favourite simple pairs of earrings, her name or initials necklaces, and a moonstone necklace, crescent shaped with crystals necklace and a few matching rings she has that pair with them nicely. when at work, or dressed up, has minimal jewelry most of the time, and also has a somewhat youthful and edgy side to her style, but not too youthful or too edgy, just the right blend of them and maturity to her style. Etc
  548. <br>
  549. <b>DISTINGUISHING FEATURE(S):</b>Her Eyes, Stare , Birthmark, Zodiac Sign Tattoo, Her subtle European accent, Talks very softly and quietly, though very fast at the same time(normally), her minimalistic-natural makeup(when she uses makeup and goes out), her naturally subtly wavy blonde hair, she straightens only when she feels like it., her outfits that always have a pop of colour and not much when at work/more colour when not at work, the fact that she she always uses minimalistic jewelry at work/when not at work, her soft spoken voice most of the time/unless she's pissed off and or protecting her loved ones, then she raises her voice and only then, her ladylike manners, mannerisms, posture and demeanor, her subtly badass quick and still seductive and sassy way of walking, etc<br>
  550. <b>Fur Color:</b> Arctic - Angelic White<br>
  551. <b>Eye Color:</b> Blue <br>
  552. <b>Wolf Length:</b> 6 feet<br>
  553. <b>Wolf Height:</b> 32 inches. <br>
  554. <b>Wolf weight:</b>175 pounds<br>
  555. </div>
  556. </div>
  557.  
  558. <div class="personalityBlock">
  559. <img class="baseimg" src="https://i.imgur.com/6CT7r0H.png">
  560. <div class="overlay">
  561. <h3>personality</h3>
  562. Talk about your personality here. Talk about your personality here. Talk about your personality here. Talk about your personality here. Talk about your personality here. Talk about your personality here. Talk about your personality here. Talk about your personality here.
  563. </div>
  564. </div>
  565.  
  566. <div class="abilitiesBlock">
  567. <img class="baseimg" src="https://i.imgur.com/Mrcc51x.png">
  568. <div class="overlay">
  569. <h3>powers and abilities</h3>
  570. Talk about your powers and abilities here. Talk about your powers and abilities here. Talk about your powers and abilities here. Talk about your powers and abilities here. Talk about your powers and abilities here. Talk about your powers and abilities here. Talk about your powers and abilities here. Talk about your powers and abilities here. Talk about your powers and abilities here. Talk about your powers and abilities here. Talk about your powers and abilities here. Talk about your powers and abilities here. Talk about your powers and abilities here. Talk about your powers and abilities here.
  571. </div>
  572. </div>
  573.  
  574. </div>
  575.  
  576. <div id="middleContainer">
  577.  
  578. <div id="pastBioImage">
  579. <img src="https://i.imgur.com/xJlJdmV.png">
  580. </div>
  581.  
  582. <div id="pastBio">
  583. <h1>The Past</h1>
  584. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Integer malesuada nunc vel risus. Elit ut aliquam purus sit. Porttitor rhoncus dolor purus non enim praesent elementum facilisis. Ipsum suspendisse ultrices gravida dictum fusce. Enim praesent elementum facilisis leo vel fringilla est. Morbi tristique senectus et netus et malesuada fames ac. Egestas integer eget aliquet nibh praesent tristique. Adipiscing bibendum est ultricies integer quis auctor elit. Maecenas accumsan lacus vel facilisis volutpat est velit egestas. Pellentesque eu tincidunt tortor aliquam nulla facilisi cras fermentum. Placerat in egestas erat imperdiet sed. Vitae auctor eu augue ut lectus arcu. Amet aliquam id diam maecenas ultricies mi eget mauris. Sed tempus urna et pharetra pharetra.
  585. <br><br>
  586. At ultrices mi tempus imperdiet nulla malesuada pellentesque elit. Et odio pellentesque diam volutpat commodo sed egestas. Dui accumsan sit amet nulla facilisi morbi. Sed velit dignissim sodales ut. Ut diam quam nulla porttitor massa id. Ante metus dictum at tempor commodo ullamcorper a. Viverra justo nec ultrices dui sapien eget mi proin sed. Praesent semper feugiat nibh sed. Nec tincidunt praesent semper feugiat nibh sed. Suspendisse potenti nullam ac tortor vitae purus. Gravida neque convallis a cras semper auctor neque vitae. Nisl tincidunt eget nullam non nisi est sit amet. Tristique nulla aliquet enim tortor at. Porta nibh venenatis cras sed felis eget velit aliquet sagittis. Nec sagittis aliquam malesuada bibendum arcu vitae. Vitae auctor eu augue ut.
  587. </div>
  588.  
  589. <br>
  590.  
  591. <div id="currentBio">
  592. <h1>Present Day</h1>
  593. Enim sed faucibus turpis in eu mi. Enim nec dui nunc mattis enim ut tellus. Pellentesque elit eget gravida cum sociis natoque penatibus. Arcu cursus vitae congue mauris rhoncus aenean vel elit. Tincidunt arcu non sodales neque sodales ut etiam sit. Ut morbi tincidunt augue interdum velit. Elementum tempus egestas sed sed risus pretium quam. In dictum non consectetur a erat nam at lectus urna. Diam vulputate ut pharetra sit amet aliquam id diam maecenas. Purus gravida quis blandit turpis cursus. Id eu nisl nunc mi ipsum faucibus vitae. Felis donec et odio pellentesque diam volutpat commodo sed egestas. Egestas erat imperdiet sed euismod. Ante in nibh mauris cursus. Platea dictumst vestibulum rhoncus est pellentesque elit ullamcorper. Enim nulla aliquet porttitor lacus luctus accumsan.
  594. <br><br>
  595. Suspendisse sed nisi lacus sed viverra tellus. Sit amet luctus venenatis lectus magna fringilla urna. Porta nibh venenatis cras sed felis. Sed viverra tellus in hac habitasse platea. Diam quam nulla porttitor massa id neque aliquam. Sodales ut eu sem integer vitae justo eget magna fermentum. A condimentum vitae sapien pellentesque habitant morbi tristique senectus et. Nisi quis eleifend quam adipiscing vitae proin sagittis. Eget mauris pharetra et ultrices neque ornare aenean euismod. Tincidunt lobortis feugiat vivamus at augue eget arcu dictum varius. Venenatis a condimentum vitae sapien pellentesque. Pellentesque habitant morbi tristique senectus et. Netus et malesuada fames ac. Dolor sit amet consectetur adipiscing elit ut aliquam. Sit amet commodo nulla facilisi nullam vehicula ipsum a arcu. Ullamcorper velit sed ullamcorper morbi tincidunt.
  596. </div>
  597.  
  598. <div id="currentBioImage">
  599. <img src="https://i.imgur.com/fQi8npQ.png">
  600. </div>
  601.  
  602.  
  603.  
  604. </div>
  605.  
  606. <div id="rightContainer">
  607.  
  608. <div class="loveInterestBlock">
  609. <img class="baseimg" src="https://i.imgur.com/PbGvzhm.png">
  610. <div class="overlay">
  611. <h2>Love Interest</h2>
  612. <b>status</b> here <br>
  613. <b>to whom</b> here <br>
  614. <b>since when</b> here<br>
  615. <b>comments</b> here
  616. </div>
  617. </div>
  618.  
  619. <div class="connectionsBlock">
  620. <img class="baseimg" src="https://i.imgur.com/bAOST5b.png">
  621. <div class="overlay">
  622. <h2>my connections</h2>
  623. <a href="/" class="connections">name here</a>
  624. <a href="/" class="connections">name here</a>
  625. <a href="/" class="connections">name here</a>
  626. <a href="/" class="connections">name here</a>
  627. <a href="/" class="connections">name here</a>
  628. <a href="/" class="connections">name here</a>
  629. <a href="/" class="connections">name here</a>
  630. <a href="/" class="connections">name here</a>
  631. <a href="/" class="connections">name here</a>
  632. <a href="/" class="connections">name here</a>
  633. <a href="/" class="connections">name here</a>
  634. <a href="/" class="connections">name here</a>
  635. <a href="/" class="connections">name here</a>
  636. <a href="/" class="connections">name here</a>
  637. <a href="/" class="connections">name here</a>
  638. <a href="/" class="connections">name here</a>
  639. <a href="/" class="connections">name here</a>
  640. </div>
  641. </div>
  642.  
  643. <div class="educationBlock">
  644. <img class="baseimg" src="https://i.imgur.com/pQjYRoQ.png">
  645. <div class="overlay">
  646. <h3>education</h3>
  647. Talk about your education here. Talk about your education here. Talk about your education here. Talk about your education here. Talk about your education here. Talk about your education here. Talk about your education here. Talk about your education here. Talk about your education here. Talk about your education here. Talk about your education here. Talk about your education here. Talk about your education here. Talk about your education here. Talk about your education here. Talk about your education here. Talk about your education here. Talk about your education here.
  648. </div>
  649. </div>
  650.  
  651.  
  652. <div class="employmentBlock">
  653. <img class="baseimg" src="https://i.imgur.com/wzwycFK.png">
  654. <div class="overlay">
  655. <h3>employment</h3>
  656. Talk about your employment here. Talk about your employment here. Talk about your employment here. Talk about your employment here. Talk about your employment here. Talk about your employment here. Talk about your employment here. Talk about your employment here. Talk about your employment here. Talk about your employment here. Talk about your employment here. Talk about your employment here. Talk about your employment here. Talk about your employment here. Talk about your employment here. Talk about your employment here. Talk about your employment here. Talk about your employment here. Talk about your employment here. Talk about your employment here.
  657. </div>
  658. </div>
  659.  
  660.  
  661.  
  662. </div>
  663.  
  664.  
  665.  
  666.  
  667.  
  668.  
  669. </div>
  670. </body>
  671. </html>
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!