mebuckner

Custom Order - Scarlett

Oct 29th, 2020 (edited)
146
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 30.27 KB | None | 0 0
  1. <!--about me-->
  2. <link href="//solrainha.github.io/honeybee/honeybee.css" rel="stylesheet">
  3. <style type="text/css">
  4. @import url('https://fonts.googleapis.com/css2?family=Playfair+Display&display=swap');
  5.  
  6. body {
  7. background-color:#232426;
  8. background-repeat:no-repeat;
  9. background-attachment:fixed;
  10. margin: 0;
  11. overflow:auto;
  12. background-image:url('https://i.imgur.com/nZIYwrp.png');
  13. background-size:cover;
  14. }
  15.  
  16. table, tr, td, li, p, div, .profileInfo td.text {
  17.     font-size: 10px;
  18.     color: #717171;
  19.     font-family: 'Poppins', sans-serif;}
  20.  
  21.  
  22. .container {
  23. width:900px;
  24. height:600px;
  25. position:absolute;
  26. left:0;
  27. right:0;
  28. top:0;
  29. bottom:0;
  30. overflow:hidden;
  31. margin:auto;
  32. color:#fff;
  33. background-color:#1b1b1b;
  34. font-family: 'Abel', sans-serif;
  35. }
  36.  
  37. .leftContainer{
  38. width: 550px;
  39. height: 401px;
  40. display: inline-block;
  41. vertical-align: top;
  42. }
  43.  
  44. .rightContainer{
  45. width: 347px;
  46. height: 401px;
  47. display: inline-block;
  48. vertical-align: top;
  49. }
  50.  
  51. .bottomBar{
  52. width: 900px;
  53. height: 199px;
  54. }
  55.  
  56. .roundButtonContainer{
  57. width: 550px;
  58. height: 80px;
  59. text-align:center;
  60. }
  61.  
  62. .bioContainer{
  63. width: 510px;
  64. height: 261px;
  65. padding: 20px;
  66. overflow: auto;
  67. color: #fff;
  68. font-family: 'Playfair Display';
  69. font-size: 12px;
  70. text-align: justify;
  71. }
  72.  
  73. .barrowLinkContainer{
  74. width: 350px;
  75. height: 199px;
  76. display: inline-block;
  77. vertical-align: top;
  78. text-align:center;
  79. overflow:auto;
  80. }
  81.  
  82. .barrowLinkDiv{
  83. width: 62px;
  84. height: 52px;
  85. border-radius: 50%;
  86. display: inline-block;
  87. vertical-align: top;
  88. background: #5b1414;
  89. margin-top: 22px;
  90. margin-left: 5px;
  91. color: #fff;
  92. font-size: 34px;
  93. font-family: 'Playfair Display';
  94. font-weight: 100;
  95. padding: 5px 0px;
  96. }
  97.  
  98. .barrowLinkDiv:hover{
  99. background: #010101;
  100. }
  101.  
  102. .popupDiv{
  103. width: 62px;
  104. height: 36px;
  105. border-radius: 50%;
  106. display: inline-block;
  107. vertical-align: top;
  108. background: #5b1414;
  109. margin-top: 22px;
  110. margin-left: 5px;
  111. color: #fff;
  112. font-size: 34px;
  113. font-family: 'Playfair Display';
  114. font-weight: 100;
  115. padding: 13px 0px;
  116. }
  117.  
  118. .popupDiv:hover{
  119. background: #010101;
  120. }
  121.  
  122. .barrowGangDescriptHolder{
  123. width: 295px;
  124. height: 199px;
  125. display: inline-block;
  126. vertical-align: top;
  127. }
  128.  
  129. .barrowGangText{
  130. width: 255px;
  131. height: 135px;
  132. padding: 20px;
  133. overflow: auto;
  134. font-family: Playfair Display;
  135. color: #fff;
  136. font-weight: 100;
  137. text-align: justify;
  138. font-size: 12px;
  139. }
  140.  
  141. .navigationContainer{
  142. width: 249px;
  143. height: 199px;
  144. display: inline-block;
  145. vertical-align: top;
  146. }
  147.  
  148. #basics{
  149. display:none;
  150. }
  151.  
  152. #basics:target{
  153. width: 510px;
  154. height: 262px;
  155. display: block;
  156. background: #1b1b1b;
  157. padding: 20px;
  158. position: absolute;
  159. margin-top: -296px;
  160. font-family:Playfair Display;
  161. color:#fff;
  162. font-size:12px;
  163. text-align:justify;
  164. overflow:auto;
  165. }
  166.  
  167. #love{
  168. display:none;
  169. }
  170.  
  171. #love:target{
  172. width: 510px;
  173. height: 262px;
  174. display: block;
  175. background: #1b1b1b;
  176. padding: 20px;
  177. position: absolute;
  178. margin-top: -296px;
  179. font-family:Playfair Display;
  180. color:#fff;
  181. font-size:12px;
  182. text-align:justify;
  183. overflow:auto;
  184. }
  185.  
  186. #friends{
  187. display:none;
  188. }
  189.  
  190. #friends:target{
  191. width: 510px;
  192. height: 262px;
  193. display: block;
  194. background: #1b1b1b;
  195. padding: 20px;
  196. position: absolute;
  197. margin-top: -296px;
  198. font-family:Playfair Display;
  199. color:#fff;
  200. font-size:12px;
  201. text-align:justify;
  202. overflow:auto;
  203. }
  204.  
  205. #instagram{
  206. display:none;
  207. }
  208.  
  209. #instagram:target{
  210. width: 510px;
  211. height: 262px;
  212. display: block;
  213. background: #1b1b1b;
  214. padding: 20px;
  215. position: absolute;
  216. margin-top: -296px;
  217. text-align:center;
  218. font-family:Playfair Display;
  219. font-size:12px;
  220. color:#fff;
  221. }
  222.  
  223. a.navigationalLinks:link, a.navigationalLinks:visited {
  224. color: white;
  225. padding: 7px 0px;
  226. text-align: center;
  227. text-decoration: none;
  228. display: inline-block;
  229. font-family: 'Playfair Display', serif;
  230. text-transform: uppercase;
  231. font-size: 13px;
  232. width: 233px;
  233. background: #5b1414;
  234. font-weight: 100;
  235. margin-left: 5px;
  236. }
  237.  
  238. a.navigationalLinks:hover, a.navigationalLinks:active {
  239. color: #1a1a1a;
  240. }
  241.  
  242. h1{
  243. color: #fff;
  244. margin: 0;
  245. text-align: center;
  246. font-family: Playfair Display;
  247. text-transform: uppercase;
  248. font-weight: 100;
  249. margin-bottom: 4px;
  250. }
  251.  
  252. h2{
  253. font-family: Playfair Display;
  254. font-size: 17px;
  255. text-transform: uppercase;
  256. text-align: center;
  257. color: #fff;
  258. margin: 0;
  259. padding-bottom: 10px;
  260. font-weight: 100;
  261. }
  262.  
  263. blockquote{
  264. text-align:justify;
  265. }
  266.  
  267. ::-webkit-scrollbar-thumb:vertical {height:12px; background:#fff; border-top:10px solid #1b1b1b; border-bottom:10px solid #1b1b1b;}
  268. ::-webkit-scrollbar-thumb:horizontal {background-color:#fff;}
  269. ::-webkit-scrollbar {width:5px; height:7px;}
  270.  
  271.  
  272. .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>
  273. </style>
  274.  
  275.  
  276.  
  277.  
  278.  
  279.  
  280.  
  281.  
  282.  
  283.  
  284. <!--like to meet-->
  285. <html>
  286. <body>
  287. <div class="container">
  288. <!--left container, holds the bio and the four round buttons-->
  289. <div class="leftContainer">
  290.  
  291. <!--start of four round buttons-->
  292. <div class="roundButtonContainer">
  293. <a href="#basics"><div class="popupDiv"><span class="th th-alien-o"></span></div></a>
  294. <a href="#love"><div class="popupDiv" style="margin-left:20px;"><span class="th th-broken-heart-o"></span></div></a>
  295. <a href="#friends"><div class="popupDiv" style="margin-left:20px;"><span class="th th-beehive-o"></span></div></a>
  296. <a href="#instagram"><div class="popupDiv" style="margin-left:20px;"><span class="th th-instagram-o"></span></div></a>
  297.  
  298. </div>
  299. <!--end of four round buttons-->
  300.  
  301. <!--start of bio box-->
  302. <div class="bioContainer">
  303. <h1>Story of a girl</h1>
  304. 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.
  305. <br><br>
  306. 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.
  307. <br><br>
  308. 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.
  309. <br><br>
  310. 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.
  311. </div>
  312. <!--end of bio box-->
  313.  
  314. <!--start of basics popup-->
  315. <div id="basics">
  316. <div style="width: 499px; text-align: right;"><a href="#close" style="color: #fff; font-family: 'Playfair Display'; font-size: 15px;">x</a></div>
  317. <h1>Basic Information</h1>
  318. <div style="height: 148px; width: 310px; padding: 20px; overflow: auto; font-family: Playfair Display; font-size: 12px; text-align: justify; color: #fff; display: inline-block; vertical-align: top;">
  319. <b>Full Name</b> here<br>
  320. <b>Pronunciation</b> here<br>
  321. <b>Nickname/Alias</b> here<br>
  322. <b>Gender</b> here<br>
  323. <b>Orientation</b> here<br>
  324. <b>Real Age</b> here<br>
  325. <b>Birthday</b> here<br>
  326. <b>Birthplace</b> here<br>
  327. <b>Astrological Sign</b> here<br>
  328. <b>Species</b> here<br>
  329. <b>Ethnicity</b> here<br>
  330. <b>Preferred Hand</b> here<br>
  331. <b>Eye Color</b> here<br>
  332. <b>Hair Color</b> here<br>
  333. <b>Hairstyle</b> here<br>
  334. <b>Skin Tone</b> here<br>
  335. <b>Makeup</b> here<br>
  336. <b>Build</b> here<br>
  337. <b>Height</b> here<br>
  338. <b>Weight</b> here<br>
  339. <b>Shoe Size</b> here<br>
  340. <b>Birthmarks/scars</b> here<br>
  341. <b>Distinguishing Features</b> here<br>
  342. <b>Health</b> here<br>
  343. <b>Allergies</b> here<br>
  344. </div>
  345. <img src="https://i.imgur.com/IorMb2G.png" style="height: 198px; margin-top: 5px;">
  346.  
  347. </div>
  348. <!--end of basics popup-->
  349.  
  350. <!--start of love popup-->
  351. <div id="love">
  352. <div style="width: 499px; text-align: right;"><a href="#close" style="color: #fff; font-family: 'Playfair Display'; font-size: 15px;">x</a></div>
  353. <h1>Love Life</h1>
  354. <div style="height: 148px; width: 310px; padding: 20px; overflow: auto; font-family: Playfair Display; font-size: 12px; text-align: justify; color: #fff; display: inline-block; vertical-align: top;">
  355. <b>status</b> here <br>
  356. <b>to whom</b> here <br>
  357. <b>since when</b> here <br>
  358. <b>comments here</b> here <br>
  359. </div>
  360. <img src="https://i.imgur.com/4f6h88Y.png" style="height: 198px; margin-top: 5px;">
  361. </div>
  362. <!--end of love popup-->
  363.  
  364.  
  365. <!--start of friends popup-->
  366. <div id="friends">
  367. <div style="width: 499px; text-align: right;"><a href="#close" style="color: #fff; font-family: 'Playfair Display'; font-size: 15px;">x</a></div>
  368. <h1>My Friends</h1>
  369. <b>name here</b> / <i>connection title</i> - talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want.
  370. <br><br>
  371. <b>name here</b> / <i>connection title</i> - talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want.
  372. <br><br>
  373. <b>name here</b> / <i>connection title</i> - talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want.
  374. <br><br>
  375. <b>name here</b> / <i>connection title</i> - talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want.
  376. <br><br>
  377. <b>name here</b> / <i>connection title</i> - talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want.
  378. <br><br>
  379. <b>name here</b> / <i>connection title</i> - talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want.
  380. <br><br>
  381. <b>name here</b> / <i>connection title</i> - talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want.
  382. <br><br>
  383. <b>name here</b> / <i>connection title</i> - talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want.
  384. <br><br>
  385. <b>name here</b> / <i>connection title</i> - talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want.
  386. <br><br>
  387. <b>name here</b> / <i>connection title</i> - talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want.
  388. <br><br>
  389. <b>name here</b> / <i>connection title</i> - talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want.
  390. <br><br>
  391. <b>name here</b> / <i>connection title</i> - talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want. talk about the connection here for as long as you want.
  392. <br><br>
  393. </div>
  394. <!--end of friends popup-->
  395.  
  396.  
  397. <!--start of instagram popup-->
  398. <div id="instagram">
  399. <div style="width: 499px; text-align: right;"><a href="#close" style="color: #fff; font-family: 'Playfair Display'; font-size: 15px;">x</a></div>
  400. <img src="https://i.imgur.com/joLEKkh.png" style="width:80px; border-radius:50%; margin-right: 12px;">
  401. <div style="width: 260px; height: 34px; display: inline-block; vertical-align: top; /* margin-top: 28px; */ margin-left: 2px; margin-bottom: 9px;">
  402. <h2 style="font-size: 15px; text-align: left; color: #fff; background: none; margin: 0px; vertical-align: top; width: 256px; letter-spacing: 6px;">
  403. @handlehere
  404. </h2>
  405.  
  406.  
  407. <h2 style="font-size: 10px; text-align: left; color: #717171; margin-top: -11px; background: none; width: 308px; color: #fff;"><b style="color:#fff; margin-right:3px;">
  408. ###
  409. </b> Posts
  410. <b style="color:#fff; margin-right:3px; margin-left:2px;">
  411. ###
  412. </b>
  413. Followers
  414. <b style="color:#fff; margin-right:3px; margin-left:2px;">
  415. ###
  416. </b> Following</h2>
  417. <blockquote style="color: #fff; font-size: 12px; margin-left: 1px; margin-top: -6px; font-family: Georgia; width: 250px;">
  418. here is where your description will go. Make it a little short, but it can go on two lines.
  419. </blockquote>
  420. </div>
  421. <center>
  422. <img src="https://i.imgur.com/gYzHSQF.png" style="width: 80px; height: 80px; margin-top: 14px;">
  423. <img src="https://i.imgur.com/tEPhTYV.png" style="width: 80px; height: 80px; margin-left:10px;">
  424. <img src="https://i.imgur.com/5aYuXBR.png" style="width: 80px; height: 80px; margin-left:10px;">
  425. <br>
  426. <img src="https://i.imgur.com/HqEtWpC.png" style="width: 80px; height: 80px; margin-top:10px;">
  427. <img src="https://i.imgur.com/7lfpOMn.png" style="width: 80px; height: 80px; margin-left:10px;">
  428. <img src="https://i.imgur.com/tNxrGdV.png" style="width: 80px; height: 80px; margin-left:10px;">
  429. </center>
  430. </div>
  431. <!--end of instagram popup-->
  432.  
  433.  
  434.  
  435.  
  436. </div>
  437. <!--end of left container-->
  438.  
  439. <!--right container, holds the big picture-->
  440. <div class="rightContainer">
  441. <img src="https://i.imgur.com/Fknkt0z.png">
  442. </div>
  443. <!--end of right container-->
  444.  
  445. <!--start of bottom bar-->
  446. <div class="bottomBar">
  447.  
  448. <!--start of barrow gang links-->
  449. <div class="barrowLinkContainer">
  450.  
  451. <a href=""><div class="barrowLinkDiv">FL</div></a>
  452.  
  453. <a href=""><div class="barrowLinkDiv">FL</div></a>
  454.  
  455. <a href=""><div class="barrowLinkDiv">FL</div></a>
  456.  
  457. <a href=""><div class="barrowLinkDiv">FL</div></a>
  458.  
  459. <a href=""><div class="barrowLinkDiv">FL</div></a>
  460.  
  461. <a href=""><div class="barrowLinkDiv">FL</div></a>
  462.  
  463. <a href=""><div class="barrowLinkDiv">FL</div></a>
  464.  
  465. <a href=""><div class="barrowLinkDiv">FL</div></a>
  466.  
  467. <a href=""><div class="barrowLinkDiv">FL</div></a>
  468.  
  469. <a href=""><div class="barrowLinkDiv">FL</div></a>
  470.  
  471. <a href=""><div class="barrowLinkDiv">FL</div></a>
  472.  
  473. <a href=""><div class="barrowLinkDiv">FL</div></a>
  474.  
  475. <a href=""><div class="barrowLinkDiv">FL</div></a>
  476.  
  477. <a href=""><div class="barrowLinkDiv">FL</div></a>
  478.  
  479. <a href=""><div class="barrowLinkDiv">FL</div></a>
  480.  
  481. <a href=""><div class="barrowLinkDiv">FL</div></a>
  482.  
  483. <a href=""><div class="barrowLinkDiv">FL</div></a>
  484.  
  485. <a href=""><div class="barrowLinkDiv">FL</div></a>
  486.  
  487. <a href=""><div class="barrowLinkDiv">FL</div></a>
  488.  
  489. <a href=""><div class="barrowLinkDiv">FL</div></a>
  490. </div>
  491. <!--end of barrow gang links-->
  492.  
  493. <!--start of barrow gang descript-->
  494. <div class="barrowGangDescriptHolder">
  495. <div class="barrowGangText">
  496. <h1>The Barrow Gang</h1>
  497. Cameron Barrow, the granddaughter of Clyde had a very troubled life. Her mother was murdered when she was just a child, the murder was revenge for what her father had done. Growing up in foster care, she grew up with a lot of trauma.
  498. <br><br>
  499. At one of her foster homes, she met Gabi and Gavin Costello. The three became very close, so even when Cameron ended up moving on to another home they stayed in contact. As they got older, Cameron convinced the other two they deserved better than what they had been given.
  500. <br><br>
  501. This is how The Barrow Gang back to life but this time with a twist. The members of the 'new and improved gang' are descendants of old-time gangsters, thieves, and murderers. Cameron searched high and low to find the right members to join the gang. Some joined without a moment's hesitation, some needed convincing but in the end, they all said yes.
  502. <br><br>
  503. The gang lives together in a large abandoned brick building within the heart of the Bronx. They rob banks, smuggle drugs and when the need arises they murder. When it started they thought they were bringing their own sort of justice to the world, but the further they dived into the world of crime the worse the crimes become.
  504. </div>
  505. </div>
  506. <!--end of barrow gang descript-->
  507.  
  508.  
  509.  
  510. <!--start of navigation links-->
  511. <div class="navigationContainer">
  512. <a href="/home.php" class="navigationalLinks" style="margin-top:2px;">home</a> <br>
  513. <a href="/send_message.php?member_id=" class="navigationalLinks">message</a> <br>
  514. <a href="/add_comment.php?member_id=" class="navigationalLinks">comment</a> <br>
  515. <a href="/status_stream.php?member_id=" class="navigationalLinks">stream</a> <br>
  516. <a href="/view_member_blog.php?member_id=" class="navigationalLinks">blog</a> <br>
  517. <a href="/albums.php?member_id=" class="navigationalLinks">pictures</a> <br>
  518. </div>
  519. <!--end of navigation links-->
  520. </div>
  521.  
  522. <!--end of bottom bar-->
  523.  
  524.  
  525.  
  526. </div>
  527. </body>
  528. </html>
  529.  
  530.  
  531.  
  532.  
  533.  
Add Comment
Please, Sign In to add comment