API tools faq
paste
Advertisement
mebuckner

Custom Order - Avery - Customization

mebuckner
Nov 11th, 2020
860
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 31.42 KB | None | 0 0
raw download clone embed print report
  1. <!--about me-->
  2.  
  3. <link href="//solrainha.github.io/honeybee/honeybee.css" rel="stylesheet">
  4. <style type="text/css">
  5. @import url('https://fonts.googleapis.com/css2?family=Playfair+Display&display=swap');
  6.  
  7. body {
  8.     background-color:#232426;
  9.     background-repeat:repeat;
  10.     background-attachment:fixed;
  11.     margin: 0;
  12.     overflow:auto;
  13.     background-image:url('https://i.imgur.com/S6hHyS2.jpg');
  14. }
  15.  
  16. table, tr, td, li, p, div, .profileInfo td.text {
  17.     font-size: 12px;
  18.     color: #000;
  19.     font-family: Playfair Display;
  20.     font-weight: 100;
  21. }
  22.  
  23.  
  24. .container {
  25.     width:1150px;
  26.     height:550px;
  27.     position:absolute;
  28.     left:0;
  29.     right:0;
  30.     top:0;
  31.     bottom:0;
  32.     overflow:hidden;
  33.     margin:auto;
  34.     color:#fff;
  35.     background-color:#f6eee3;
  36.     font-family: 'Abel', sans-serif;
  37.     border: solid 10px #80694a;
  38. }
  39.  
  40. .leftContainer{
  41.     width:40px;
  42.     height:550px;
  43.     background-color:#80694a;
  44.     display: inline-block;
  45. }
  46.  
  47. .rightContainer{
  48.     width: 1104px;
  49.     height: 744px;
  50.     display: inline-block;
  51.     vertical-align: top;
  52.     background: #f6eee2;
  53.     margin-top: 3px;
  54. }
  55.  
  56. .linkContainer{
  57.     position: absolute;
  58.     top: 548px;
  59.     left: 0;
  60.     background: none;
  61.     transform-origin: 0 0;
  62.     transform: rotate(-90deg);
  63.     font-family: Playfair Display;
  64.     text-transform: uppercase;
  65.     color: #fff;
  66.     height: 40px;
  67.     width: 550px;
  68. }
  69.  
  70. .middleContainer{
  71.     width:519px;
  72.     height:444px;
  73.     display: inline-block;
  74.     vertical-align: top;
  75. }
  76.  
  77. .biographyContainer{
  78.     width: 502px;
  79.     height: 380px;
  80.     background: #f6eee2;
  81.     overflow: auto;
  82.     margin-top: 10px;
  83.     padding-right: 10px;
  84.     text-align: justify;
  85. }
  86.  
  87. .iconContainer{
  88.     width:400px;
  89.     height:100px;
  90.     display: inline-block;
  91.     vertical-align: top;
  92.     text-align: center;
  93.     padding-left: 10px;
  94. }
  95.  
  96. a.navigationLinks:link, a.navigationLinks:visited {
  97.     color: #ffffff;
  98.     text-align: center;
  99.     text-decoration: none;
  100.     display: inline-block;
  101.     font-family: Playfair Display;
  102.     font-size: 17px;
  103.     text-transform: uppercase;
  104.     /* background: #2c2c2f; */
  105.     padding: 0px 4px;
  106.     /* width: 89px; */
  107.     font-weight: 100;
  108.     margin-top: 5px;
  109. }
  110.  
  111. a.navigationLinks:hover, a.navigationLinks:active {
  112. color: #bfb4b1;
  113. }
  114.  
  115. a.iconLinks:link, a.iconLinks:visited {
  116.     color: #363636;
  117.     text-align: center;
  118.     text-decoration: none;
  119.     display: inline-block;
  120.     font-family: Playfair Display;
  121.     font-size: 17px;
  122.     text-transform: uppercase;
  123.     /* background: #2c2c2f; */
  124.     padding: 0px 4px;
  125.     /* width: 89px; */
  126.     font-weight: 100;
  127.     margin-top: 14px;
  128.     margin-right: 0px;
  129. }
  130.  
  131. a.iconLinks:hover, a.iconLinks:active {
  132. color: #bfb4b1;
  133. }
  134.  
  135. .twitterHolder{
  136.     width: 190px;
  137.     height: 80px;
  138.     display: inline-block;
  139.     vertical-align: top;
  140.     margin-top: 10px;
  141.     font-family: Playfair Display;
  142.     text-transform: uppercase;
  143.     font-size: 12px;
  144.     text-align:justify;
  145. }
  146.  
  147. .nameHolder{
  148.     width:360px;
  149.     height:100px;
  150.     display: inline-block;
  151.     vertical-align: top;
  152.     display: inline-block;
  153.     vertical-align: top;
  154. }
  155.  
  156. .boxFour{
  157.     width:329px;
  158.     height:444px;
  159.     display: inline-block;
  160.     vertical-align: top;
  161. }
  162.  
  163. h1{
  164.     margin: 0;
  165.     width: 519px;
  166.     font-family: Playfair Display;
  167.     font-weight: 100;
  168.     text-align: center;
  169.     text-transform: uppercase;
  170.     margin-top: 11px;
  171.     color: #924a3c;
  172. }
  173.  
  174.  
  175. h2{
  176. margin: 0;
  177.     width: 360px;
  178.     font-family: Playfair Display;
  179.     font-weight: 100;
  180.     text-align: center;
  181.     text-transform: uppercase;
  182.     margin-top: 11px;
  183.     color: #cda97f;
  184.     font-size: 43px;
  185.     line-height: 43px;
  186.     letter-spacing: 4px;
  187.     margin-top: 5px;
  188. }
  189.  
  190.  
  191. h3{
  192.     margin: 0;
  193.     width: 519px;
  194.     font-family: Playfair Display;
  195.     font-weight: 100;
  196.     text-align: center;
  197.     text-transform: uppercase;
  198.     margin-top: 11px;
  199.     color: #f6eee2;
  200.     font-size: 43px;
  201.     line-height: 43px;
  202.     letter-spacing: 0px;
  203.     margin-top: 5px;
  204.     background-color: #80694a;
  205.     margin-bottom: 10px;
  206.     margin-top: 10px;
  207. }
  208.  
  209. #owes{
  210.     display:none;
  211. }
  212.  
  213. #owes:target{
  214.     display: block;
  215.     width: 519px;
  216.     height: 444px;
  217.     position: fixed;
  218.     background-color: #f6eee2;
  219.     margin-top: -454px;
  220.     margin-left: 253px;
  221. }
  222.  
  223.  
  224. #love{
  225.     display:none;
  226. }
  227.  
  228. #love:target{
  229.     display: block;
  230.     width: 519px;
  231.     height: 444px;
  232.     position: fixed;
  233.     background-color: #f6eee2;
  234.     margin-top: -454px;
  235.     margin-left: 253px;
  236. }
  237.  
  238.  
  239. #friends{
  240.     display:none;
  241. }
  242.  
  243. #friends:target{
  244.     display: block;
  245.     width: 519px;
  246.     height: 444px;
  247.     position: fixed;
  248.     background-color: #f6eee2;
  249.     margin-top: -454px;
  250.     margin-left: 253px;
  251. }
  252.  
  253. #kids{
  254.     display:none;
  255. }
  256.  
  257. #kids:target{
  258.     display: block;
  259.     width: 519px;
  260.     height: 444px;
  261.     position: fixed;
  262.     background-color: #f6eee2;
  263.     margin-top: -454px;
  264.     margin-left: 253px;
  265. }
  266.  
  267. #insta{
  268.     display:none;
  269. }
  270.  
  271. #insta:target{
  272.     display: block;
  273.     width: 519px;
  274.     height: 444px;
  275.     position: fixed;
  276.     background-color: #f6eee2;
  277.     margin-top: -454px;
  278.     margin-left: 253px;
  279. }
  280.  
  281. #extra{
  282.     display:none;
  283. }
  284.  
  285. #extra:target{
  286.     display: block;
  287.     width: 519px;
  288.     height: 444px;
  289.     position: fixed;
  290.     background-color: #f6eee2;
  291.     margin-top: -454px;
  292.     margin-left: 253px;
  293. text-align:center;
  294. }
  295.  
  296. #topTwitterHeadBar {
  297. width: 387px;
  298. height: 193px;
  299. padding: 5px;
  300. }
  301.  
  302. #twitterProfileIcon img {
  303. width: 75px;
  304. height: 75px;
  305. border: 3px solid #fff;
  306. border-radius: 100%;
  307. margin-top: -53px;
  308. margin-left: 5px;
  309. }
  310.  
  311. #twitterHeader img {
  312. width:492px;
  313. }
  314.  
  315.  
  316. ::-webkit-scrollbar-thumb:vertical {height:12px; background:#f6eee2; border-top:10px solid #d4a593; border-bottom:10px solid #d4a593;}
  317. ::-webkit-scrollbar-thumb:horizontal {background-color:#f6eee2;}
  318. ::-webkit-scrollbar {width:5px; height:7px;}
  319.  
  320.  
  321. .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;}
  322. </style>
  323.  
  324.  
  325.  
  326.  
  327.  
  328.  
  329.  
  330.  
  331.  
  332. <!--like to meet-->
  333.  
  334. <html>
  335.     <body>
  336.         <div class="container">
  337.             <div class="leftContainer">
  338.                 <div class="linkContainer">
  339.                     <a href="/home.php" class="navigationLinks">home</a>
  340.                     <a href="/send_message.php?member_id=" class="navigationLinks">message</a>
  341.                     <a href="/add_comment.php?member_id=" class="navigationLinks">comment</a>
  342.                     <a href="/status_stream.php?member_id=" class="navigationLinks">stream</a>
  343.                     <a href="/view_member_blog.php?member_id=" class="navigationLinks">blog</a>
  344.                     <a href="/albums.php?member_id=" class="navigationLinks">pictures</a>
  345.                     <a href="/1631904" class="navigationLinks">credit</a>
  346.                 </div>
  347.             </div>
  348.             <div class="rightContainer">
  349.                 <div style="width:1104px; height:100px;">
  350.                     <div style="width:300px; height:100px; display: inline-block; vertical-align: top;">
  351.                         <img src="https://i.imgur.com/bNHQEGE.png" style="height:100px;">
  352.                         <div class="twitterHolder">
  353.                             <b style="font-size:18px;">name <span style="font-weight: 100;">@username</span></b>
  354.                             <div style="height: auto; margin-top: 7px;">
  355.                             some sort of tweet goes here, or some sort of text, I dont know your life.
  356.                         </div>
  357.                         </div>
  358.                     </div>
  359.                     <div class="nameHolder">
  360.                         <h2>First Middle<br>Last</h2>
  361.                     </div>
  362.                     <div class="iconContainer">
  363.                         <a href="#owes" class="iconLinks"><span class="th th-agenda-o" style="font-size: 39px; margin-bottom: 5px;"></span><br>owes</a>
  364.                         <a href="#love" class="iconLinks"><span class="th th-fox-o" style="font-size: 39px; margin-bottom: 5px;"></span><br>lover</a>
  365.                         <a href="#friends" class="iconLinks"><span class="th th-crab-o" style="font-size: 39px; margin-bottom: 5px;"></span><br>friends</a>
  366.                         <a href="#kids" class="iconLinks"><span class="th th-cookie-o" style="font-size: 39px; margin-bottom: 5px;"></span><br>fam</a>
  367.                         <a href="#insta" class="iconLinks"><span class="th th-instagram-o" style="font-size: 39px; margin-bottom: 5px;"></span><br>insta</a>
  368.                         <a href="#extra" class="iconLinks"><span class="th th-twitter-o" style="font-size: 39px; margin-bottom: 5px;"></span><br>twitter</a>
  369.                     </div>
  370.                 </div>
  371.                 <div style="width:250px; height:444px; display: inline-block; vertical-align: top;">
  372.                     <img src="https://i.imgur.com/pc0Yoxj.png" style="margin-top: 10px; margin-left: 10px;">
  373.                     <img src="https://i.imgur.com/u1bphgu.png" style="margin-top: 10px; margin-left: 10px;">
  374.                 </div>
  375.                 <div id="extra">
  376.                     <div class="biographyContainer">
  377.                         <div id="topTwitterHeadBar">
  378. <div id="twitterHeader">
  379. <img src="https://i.imgur.com/1CeDTT7.png">
  380. </div>
  381. <div id="twitterProfileIcon">
  382. <img src="https://i.imgur.com/bNHQEGE.png">
  383. </div>
  384. <b style="color: #000; background: none; padding: 0px; line-height: inherit; font-size: 26px; font-family: Georgia; letter-spacing: 6px;">name</b>
  385. <br>
  386. <i style="font-family:Georgia; font-size:12px; color:#fff;">@handlehere</i><br>
  387. <div class="instaBio" style="color: #000; font-size: 12px; margin-left: 1px; margin-top: 5px;">
  388. here is where your description will go. Make it a little short, but it can go on two lines.
  389. </div>
  390. </div>
  391. <div style="width: 382px; margin-top: 47px; overflow: auto;">
  392.  
  393.  
  394. <div>
  395. <img src="https://i.imgur.com/bNHQEGE.png" style="width:56px; border-radius: 50%; margin-top: 7px; margin-left: 7px;"> <div style="width: 309px; height: 50px; margin-top: 7px; margin-left: 7px; vertical-align: top; display: inline-block; font-family: Georgia; font-size: 12px; color: #000;"><strong>name</strong> <i>@handlehere</i> 7h<br>
  396. I wish I could say I was staying in bed today
  397. </div>
  398. </div>
  399.  
  400. <div style="margin-top:10px;">
  401. <img src="https://i.imgur.com/bNHQEGE.png" style="width:56px;border-radius: 50%; margin-top: 7px; margin-left: 7px;"> <div style="width: 309px; height: 50px; margin-top: 7px; margin-left: 7px; vertical-align: top; display: inline-block; font-family: Georgia; font-size: 12px; color: #000;"><strong>name</strong> <i>@handlehere</i> 2d<br>
  402. Does anyone else smell rotten cheese? just me?
  403. </div>
  404. </div>
  405.  
  406.  
  407. <div style="margin-top:10px;">
  408. <img src="https://i.imgur.com/bNHQEGE.png" style="width:56px;border-radius: 50%; margin-top: 7px; margin-left: 7px;"> <div style="width: 309px; height: 50px; margin-top: 7px; margin-left: 7px; vertical-align: top; display: inline-block; font-family: Georgia; font-size: 12px; color: #000;"><strong>name</strong> <i>@handlehere</i> 1w<br>
  409. I'm so dizzy, this heat is getting to me. Ready for winter!
  410. </div>
  411. </div>
  412.  
  413. <div style="margin-top:10px;">
  414. <img src="https://i.imgur.com/bNHQEGE.png" style="width:56px;border-radius: 50%; margin-top: 7px; margin-left: 7px;"> <div style="width: 309px; height: 50px; margin-top: 7px; margin-left: 7px; vertical-align: top; display: inline-block; font-family: Georgia; font-size: 12px; color: #000;"><strong>name</strong> <i>@handlehere</i> 2w<br>
  415. Can I just go to spain?
  416. </div>
  417. </div>
  418.  
  419. <div style="margin-top:10px;">
  420. <img src="https://i.imgur.com/bNHQEGE.png" style="width:56px;border-radius: 50%; margin-top: 7px; margin-left: 7px;"> <div style="width: 309px; height: 50px; margin-top: 7px; margin-left: 7px; vertical-align: top; display: inline-block; font-family: Georgia; font-size: 12px; color: #000;"><strong>name</strong> <i>@handlehere</i> 2w<br>
  421. I just had the BEST burger in the village.
  422. </div>
  423. </div>
  424. </div>
  425.                     </div>
  426.                     </div>
  427.                 <div id="insta">
  428.                     <div class="biographyContainer" style="padding-top:24px;">
  429.                         <img src="https://i.imgur.com/zI7g6VU.png" style="width: 80px; margin-top: -1px; margin-left: 52px;">
  430.                             <div style="width: 288px; height: 34px; display: inline-block; vertical-align: top; margin-top: -5px; margin-left: 10px; margin-bottom: 9px;">
  431.                             <h2 style="font-size: 15px; text-align: left; color: #717171; background: none; margin: 0px; vertical-align: top; width: 256px; color: #461910; letter-spacing: 6px; margin-bottom: 2px; margin-left: -9px; margin-top: -5px;">
  432.                             @handlehere
  433.                             </h2>
  434.                              
  435.                              
  436.                             <h2 style="font-size: 12px; text-align: left; color: #717171; margin-top: -11px; background: none; width: 297px; color: #000; letter-spacing: 0px; margin-bottom: 10px; margin-top: -25px;">
  437.                             ###
  438.                             </b> Posts
  439.                             <b style="color:#461910; margin-right:5px; margin-left:5px;">
  440.                             ###
  441.                             </b>
  442.                             Followers
  443.                             <b style="color:#461910; margin-right:5px; margin-left:5px;">
  444.                             ###
  445.                             </b> Following</h2>
  446.                             <blockquote style="font-size: 12px; margin-left: 1px; margin-top: -22px; font-family: Playfair Display; width: 295px; text-align: justify;">
  447.                             here is where your description will go. Make it a little short, but it can go on two lines.
  448.                             </blockquote>
  449.                             </div>
  450.                             <center>
  451.                             <img src="https://i.imgur.com/b3Y1zYd.png" style="width: 120px; height: 120px; margin-top: 12px;">
  452.                             <img src="https://i.imgur.com/rOnqnx8.png" style="width: 120px; height: 120px; margin-left:10px;">
  453.                             <img src="https://i.imgur.com/hFL5DOc.png" style="width: 120px; height: 120px; margin-left:10px;"><br><Br>
  454.                             <img src="https://i.imgur.com/ryQ7n44.png" style="width: 120px; height: 120px; margin-top: 12px;">
  455.                             <img src="https://i.imgur.com/C5NYIsW.png" style="width: 120px; height: 120px; margin-left:10px;">
  456.                             <img src="https://i.imgur.com/yWVIOg2.png" style="width: 120px; height: 120px; margin-left:10px;">
  457.                             </center>
  458.                     </div>
  459.                     </div>
  460.                 <div id="kids">
  461.                         <h1>family</h1>
  462.                     <div class="biographyContainer">
  463.                         <img src="https://i.imgur.com/m4MbOxP.png" style="margin-bottom:10px">
  464.                         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.
  465.                         <br><br>
  466.                         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.
  467.                         <br><br>
  468.                         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.
  469.                         <br><br>
  470.                         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.
  471.                         <br><br>
  472.                         Egestas purus viverra accumsan in nisl. Auctor eu augue ut lectus arcu bibendum at varius vel. In nisl nisi scelerisque eu ultrices vitae auctor. Nunc aliquet bibendum enim facilisis gravida. Et leo duis ut diam quam nulla porttitor massa id. Ut tortor pretium viverra suspendisse. Urna duis convallis convallis tellus id. Tincidunt dui ut ornare lectus sit. Tellus in metus vulputate eu scelerisque felis imperdiet proin. A iaculis at erat pellentesque. Tortor at auctor urna nunc.
  473.                     </div>
  474.                     </div>
  475.                 <div id="friends">
  476.                         <h1>friends</h1>
  477.                     <div class="biographyContainer">
  478.                         <b>name here</b> // <i>connection here</i> - talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here.
  479.                         <br><br>
  480.                         <b>name here</b> // <i>connection here</i> - talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here.
  481.                         <br><br>
  482.                         <b>name here</b> // <i>connection here</i> - talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here.
  483.                         <br><br>
  484.                         <b>name here</b> // <i>connection here</i> - talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here.
  485.                         <br><br>
  486.                         <b>name here</b> // <i>connection here</i> - talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here.
  487.                         <br><br>
  488.                         <b>name here</b> // <i>connection here</i> - talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here.
  489.                         <br><br>
  490.                         <b>name here</b> // <i>connection here</i> - talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here.
  491.                         <br><br>
  492.                         <b>name here</b> // <i>connection here</i> - talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here. talk about them here.
  493.                         <br><br>
  494.                     </div>
  495.                     </div>
  496.                 <div id="love">
  497.                         <h1>love life</h1>
  498.                     <div class="biographyContainer">
  499.                         <center>
  500.                             <b style="font-size:18px;">status <span style="font-weight: 100;">here</span> since <span style="font-weight: 100;">here</span> to who <span style="font-weight: 100;">here</span></b>
  501.                         </center><br>
  502.                         <img src="https://i.imgur.com/oMN0MaY.png" style="margin-bottom:10px;"> <br>
  503.                         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.
  504.                         <br><br>
  505.                         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.
  506.                     </div>
  507.                     </div>
  508.                 <div id="owes">
  509.                         <h1>current Owes List</h1>
  510.                     <div class="biographyContainer">
  511.                         <h3 style="margin-top:0px!important;">I owe you</h3>
  512.                         <b>name</b> - <i>starter/reply</i> - 00.00<br>
  513.                         <b>name</b> - <i>starter/reply</i> - 00.00<br>
  514.                         <b>name</b> - <i>starter/reply</i> - 00.00<br>
  515.                         <b>name</b> - <i>starter/reply</i> - 00.00<br>
  516.                         <b>name</b> - <i>starter/reply</i> - 00.00<br>
  517.                         <b>name</b> - <i>starter/reply</i> - 00.00<br>
  518.  
  519.                         <h3>You owe me</h3>
  520.                         <b>name</b> - <i>starter/reply</i> - 00.00<br>
  521.                         <b>name</b> - <i>starter/reply</i> - 00.00<br>
  522.                         <b>name</b> - <i>starter/reply</i> - 00.00<br>
  523.                         <b>name</b> - <i>starter/reply</i> - 00.00<br>
  524.                         <b>name</b> - <i>starter/reply</i> - 00.00<br>
  525.                         <b>name</b> - <i>starter/reply</i> - 00.00<br>
  526.  
  527.                         <h3>Last Updated: 00/00</h3>
  528.                     </div>
  529.                     </div>
  530.                 <div class="middleContainer">
  531.                     <h1>story of life</h1>
  532.                     <div class="biographyContainer">
  533.                         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.
  534.                         <br><br>
  535.                         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.
  536.                         <br><br>
  537.                         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.
  538.                         <br><br>
  539.                         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.
  540.                         <br><br>
  541.                         Egestas purus viverra accumsan in nisl. Auctor eu augue ut lectus arcu bibendum at varius vel. In nisl nisi scelerisque eu ultrices vitae auctor. Nunc aliquet bibendum enim facilisis gravida. Et leo duis ut diam quam nulla porttitor massa id. Ut tortor pretium viverra suspendisse. Urna duis convallis convallis tellus id. Tincidunt dui ut ornare lectus sit. Tellus in metus vulputate eu scelerisque felis imperdiet proin. A iaculis at erat pellentesque. Tortor at auctor urna nunc.
  542.                     </div>
  543.                 </div>
  544.                 <div class="boxFour">
  545.                     <img src="https://i.imgur.com/5Xx59qK.png" style="margin-top:10px; margin-left:10px;">
  546.                     <img src="https://i.imgur.com/8Z7w9WF.png" style="margin-top:10px; margin-left:10px;">
  547.                 </div>
  548.             </div>
  549.         </div>
  550.     </body>
  551. </html>
  552.  
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!