API tools faq
paste
Advertisement
joss1226

About

joss1226
Mar 29th, 2016
107
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 11.66 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4.  
  5. <!--
  6.  
  7. ==============================================
  8.  
  9. 「 CODES BY POHRORO 」
  10. @ http://pohroro.com
  11. Page Theme ▸ 102. Bloodstream
  12. Last Updated: 27 February 2016
  13.  
  14. ==============================================
  15.  
  16. -->
  17.  
  18. <title>{Title}</title>
  19. <link rel="shortcut icon" href="{Favicon}">
  20. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  21.  
  22. <link href="https://static.tumblr.com/yzs4yqx/v9Xo33tyj/reset.css" rel="stylesheet" type="text/css">
  23. <link href="https://fonts.googleapis.com/css?family=Open+Sans:400,700" rel="stylesheet" type="text/css">
  24. <script src="http://static.tumblr.com/yzs4yqx/BV3o343ow/smoothscroll.min.js"></script>
  25.  
  26. <style>
  27.  
  28. .tmblr-iframe {
  29. white-space: nowrap;
  30. -webkit-filter: invert(100%);
  31. -moz-filter: invert(100%);
  32. -o-filter: invert(100%);
  33. -ms-filter: invert(100%);
  34. filter: invert(100%);
  35. opacity: 0.3;
  36. }
  37.  
  38. body {
  39. background: #FFF; /*background color*/
  40. font-family: Open Sans;
  41. font-weight: 400;
  42. font-size: 9px;
  43. color: #000; /*body font color*/
  44. }
  45.  
  46. a {
  47. color: #C1C1C1; /*link color*/
  48. text-decoration: none;
  49. -webkit-transition: all 0.5s ease;
  50. -moz-transition: all 0.5s ease;
  51. transition: all 0.5s ease;
  52. }
  53.  
  54. a:hover {
  55. -webkit-transition: all 0.5s ease;
  56. -moz-transition: all 0.5s ease;
  57. transition: all 0.5s ease;
  58. cursor: help;
  59. }
  60.  
  61. section {
  62. width: 670px;
  63. margin: 0 auto;
  64. left: 0;
  65. right: 0;
  66. top: calc(50% - 160px);
  67. position: fixed;
  68. }
  69.  
  70. #top {
  71. width: 480px;
  72. margin: auto;
  73. left: 0;
  74. right: 0;
  75. position: absolute;
  76. text-align: center;
  77. margin-top: -38px;
  78. display: table;
  79. }
  80.  
  81. h1 {
  82. font-family: Georgia;
  83. font-weight: normal;
  84. font-size: 16px;
  85. letter-spacing: 7px;
  86. text-transform: uppercase;
  87. color: #000; /*title color*/
  88. text-align: center;
  89. display: inline-block;
  90. display: table-cell;
  91. vertical-align: middle;
  92. width: auto;
  93. line-height: 16px;
  94. }
  95.  
  96. nav {
  97. text-align: center;
  98. font-size: 7px;
  99. letter-spacing: 2px;
  100. text-align: center;
  101. display: inline-block;
  102. text-transform: uppercase;
  103. font-family: Times New Roman;
  104. font-weight: bold;
  105. display: table-cell;
  106. vertical-align: middle;
  107. }
  108.  
  109. nav a {
  110. color: #000; /*navigation color*/
  111. padding: 0px 15px;
  112. }
  113.  
  114. nav a:hover {
  115. color: #B1B1B1; /*navigation hover color*/
  116. }
  117.  
  118. .frame {
  119. width: 60px;
  120. height: 60px;
  121. border-style: solid;
  122. border-color: #F1F1F1; /*frame border color*/
  123. position: absolute;
  124. }
  125.  
  126. .one {
  127. border-width: 1px 0 0 1px;
  128. top: -30px;
  129. left: -30px;
  130. }
  131.  
  132. .two {
  133. border-width: 1px 1px 0 0;
  134. top: -30px;
  135. right: -30px;
  136. }
  137.  
  138. .three {
  139. border-width: 0 0 1px 1px;
  140. bottom: -30px;
  141. left: -30px;
  142. }
  143.  
  144. .four {
  145. border-width: 0 1px 1px 0;
  146. bottom: -30px;
  147. right: -30px;
  148. }
  149.  
  150. #content {
  151. height: 330px;
  152. width: 670px;
  153. margin-top: 0px;
  154. overflow: hidden;
  155. }
  156.  
  157. #quote {
  158. width: 185px;
  159. text-align: center;
  160. text-transform: uppercase;
  161. font-family: Times New Roman;
  162. background: #F1F1F1; /*quote background color*/
  163. color: #000; /*quote font color*/
  164. font-size: 7px;
  165. padding: 6px 3px;
  166. line-height: 10px;
  167. letter-spacing: 2px;
  168. margin-bottom: 5px;
  169. font-weight: bold;
  170. position: fixed;
  171. }
  172.  
  173. #biography {
  174. width: 190px;
  175. height: 300px;
  176. position: absolute;
  177. line-height: 14px;
  178. text-align: justify;
  179. margin-top: 30px;
  180. overflow: hidden;
  181. }
  182.  
  183. #biography-scroll {
  184. height: 300px;
  185. width: 207px;
  186. overflow: scroll;
  187. overflow-x: hidden;
  188. }
  189.  
  190. #image {
  191. position: fixed;
  192. margin: 0 auto;
  193. left: 0;
  194. right: 0;
  195. width: 260px;
  196. }
  197.  
  198. #image img {
  199. width: 230px;
  200. height: 300px;
  201. border-width: 15px;
  202. border-style: solid;
  203. border-color: #F1F1F1; /*image border color*/
  204. }
  205.  
  206. #profile {
  207. width: 195px;
  208. height: 336px;
  209. overflow: hidden;
  210. position: absolute;
  211. margin: -5px 10px 0px 475px;
  212. line-height: 20px;
  213. }
  214.  
  215. #profile-scroll {
  216. height: 345px;
  217. width: 212px;
  218. overflow: scroll;
  219. overflow-x: hidden;
  220. }
  221.  
  222. #profile b {
  223. background: #F1F1F1; /*stat background color*/
  224. color: #000; /*stat font color*/
  225. font-size: 7px;
  226. letter-spacing: 1px;
  227. font-weight: bold;
  228. padding: 2px 2px 1px 3px;
  229. text-transform: uppercase;
  230. font-family: Times New Roman;
  231. }
  232.  
  233. #profile hr {
  234. margin: 12px 0px;
  235. border-color: #F1F1F1; /*profile divider color*/
  236. }
  237.  
  238. #tags {
  239. text-align: center;
  240. }
  241.  
  242. #tags a {
  243. background: #F1F1F1; /*tags background color*/
  244. color: #000; /*tags font color*/
  245. font-size: 7px;
  246. letter-spacing: 1px;
  247. font-weight: bold;
  248. padding: 2px 2px 1px 3px;
  249. margin: 0px 3px 0px 3px;
  250. text-transform: uppercase;
  251. font-family: Times New Roman;
  252. line-height: 20px;
  253. }
  254.  
  255. #bottom {
  256. margin-top: 26px;
  257. position: absolute;
  258. width: 670px;
  259. }
  260.  
  261. ::-webkit-scrollbar {
  262. height: 10px;
  263. width: 17px;
  264. }
  265.  
  266. ::selection {
  267. background: #E1E1E1; /*selection color*/
  268. color: #FFF;
  269. }
  270.  
  271. ::-moz-selection {
  272. background: #E1E1E1; /*selection color*/
  273. color: #FFF;
  274. }
  275.  
  276. p::selection {
  277. background: #E1E1E1; /*selection color*/
  278. color: #FFF;
  279. }
  280.  
  281. p::-moz-selection {
  282. background: #E1E1E1; /*selection color*/
  283. color: #FFF;
  284. }
  285.  
  286. #c {
  287. width: 55px;
  288. height: 18px;
  289. font-family: Arial;
  290. font-size: 7px;
  291. text-transform: uppercase;
  292. text-align: center;
  293. bottom: 10px;
  294. right: 8px;
  295. letter-spacing: 1px;
  296. line-height: 4px;
  297. padding: 10px 3px;
  298. display: block;
  299. border-width: 1px;
  300. border-style: solid;
  301. border-color: #F1F1F1; /*credit border color*/
  302. background: #FFF; /*credit background color*/
  303. border-radius: 3px;
  304. position: fixed;
  305. }
  306.  
  307. #c a {
  308. font-weight: bold;
  309. line-height: 17px;
  310. font-size: 15px;
  311. font-family: Times New Roman;
  312. text-transform: lowercase;
  313. font-style: italic;
  314. letter-spacing: -1px;
  315. color: #000; /*credit font color*/
  316. }
  317.  
  318. </style>
  319. </head>
  320. <body>
  321.  
  322. <section>
  323. <div id="top">
  324. <nav>
  325. <a href="/">Back</a>
  326. <a href="/dashboard">Dash</a>
  327. </nav>
  328. <h1>
  329. Bloodstream <!--title-->
  330. </h1>
  331. <nav>
  332. <a href="/ask">Ask</a>
  333. <a href="/archive">Past</a>
  334. </nav>
  335. </div>
  336. <div id="content">
  337. <div class="frame one"></div>
  338. <div class="frame two"></div>
  339. <div class="frame three"></div>
  340. <div class="frame four"></div>
  341.  
  342. <div id="quote">
  343. I'd rather bend than break. <!--quote-->
  344. </div>
  345. <div id="biography">
  346. <div id="biography-scroll">
  347.  
  348. <!--start of biography-->
  349.  
  350. <b>Bold.</b> <i>Italic.</i> <u>Underline.</u> <a href="/">Link.</a> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed rutrum mattis nulla vitae venenatis. Pellentesque accumsan metus vitae diam vehicula, quis dapibus turpis iaculis. Donec porttitor leo et ante feugiat, a mattis nisi blandit. Mauris scelerisque diam enim, vitae molestie lorem hendrerit ut. Pellentesque et neque sem. Fusce ac condimentum libero. Morbi id leo vehicula leo congue tincidunt id a arcu. Aliquam erat volutpat.
  351.  
  352. <p>Aenean eros leo, laoreet id orci ut, convallis mollis nunc. Donec euismod leo turpis, aliquam tincidunt dui viverra in. Integer metus velit, molestie sollicitudin suscipit ut, congue at odio. Vestibulum tempus sapien tincidunt, suscipit felis eu, ornare sapien. Quisque non viverra enim. Nam sagittis mattis sapien, ac porta sapien ullamcorper eu. Sed vitae massa eget magna suscipit tristique. In viverra ornare erat, eleifend pulvinar magna condimentum sit amet. Duis vestibulum dictum enim.</p>
  353.  
  354. <p>Praesent luctus ligula neque, nec tincidunt metus bibendum a. Praesent euismod venenatis neque, quis commodo enim venenatis quis. Pellentesque ac mauris id orci tristique pharetra ac non augue. Cras elementum, sem fringilla porta malesuada, purus dolor rhoncus libero, id commodo mauris purus nec dui. Interdum et malesuada fames ac ante ipsum primis in faucibus. Cras semper nibh vel ligula feugiat euismod. Aenean ullamcorper dolor id eros ullamcorper, ac vestibulum nisi eleifend. Etiam pharetra augue non magna scelerisque scelerisque. Nam auctor, diam id condimentum sollicitudin, diam sem tincidunt est, at vestibulum nibh odio nes.</p>
  355.  
  356. <!--end of biography-->
  357.  
  358. </div>
  359. </div>
  360.  
  361. <div id="image">
  362. <img src="http://i.imgur.com/FiMwys2.png"> <!--image-->
  363. </div>
  364.  
  365. <div id="profile">
  366. <div id="profile-scroll">
  367.  
  368. <!--start of stats; add or remove however many you want-->
  369.  
  370. <div class="info">
  371. <span style="text-transform: uppercase; font-weight: bold;">
  372. Name:</span> Matthew Shane Lance <br />
  373. <span style="text-transform: uppercase; font-weight: bold;">
  374. Nicknames:</span> Matt <br />
  375. <span style="text-transform: uppercase; font-weight: bold;">
  376. Date of Birth:</span> March 8, 1988 <br />
  377. <span style="text-transform: uppercase; font-weight: bold;">
  378. Birthplace:</span> Salinas, California <br />
  379. <span style="text-transform: uppercase; font-weight: bold;">
  380. Residence:</span> Santa Monica, California <br />
  381. <span style="text-transform: uppercase; font-weight: bold;">
  382. Occupation:</span> Personal Trainer <br />
  383. <span style="text-transform: uppercase; font-weight: bold;">
  384. Religion:</span> Never practiced any religion <br />
  385. <span style="text-transform: uppercase; font-weight: bold;">
  386. Ethnicity:</span> Welsh, Scottish, and Dutch
  387.  
  388. <br /><br />
  389.  
  390. <span style="text-transform: uppercase; font-weight: bold;">
  391. Parents:</span> Lindsay Lance, Connor Lance <br />
  392. <span style="text-transform: uppercase; font-weight: bold;">
  393. Siblings:</span> Only Child <br /><br />
  394. <span style="text-transform: uppercase; font-weight: bold;">
  395. Sexual Orientation:</span> Bisexual <br />
  396. <span style="text-transform: uppercase; font-weight: bold;">
  397. Relationship Status:</span> Single <br />
  398. <span style="text-transform: uppercase; font-weight: bold;">
  399. Drinks:</span> Yes <br />
  400. <span style="text-transform: uppercase; font-weight: bold;">
  401. Drugs:</span> No <br />
  402. <span style="text-transform: uppercase; font-weight: bold;">
  403. Smokes:</span> No
  404.  
  405. <br /><br />
  406.  
  407. <span style="text-transform: uppercase; font-weight: bold;">
  408. Traits:</span> <br />
  409. + Passionate, courageous, intelligent <br />
  410. - Insensitive, self destructive, arrogant<br /><br />
  411.  
  412. <span style="text-transform: uppercase; font-weight: bold;">
  413. Label:</span> The Jerk
  414.  
  415. <br /><br />
  416.  
  417. <span style="text-transform: uppercase; font-weight: bold;">
  418. Scars:</span> Quite a few scars around his torso and back due to his abusive father. Some scars around his body were earned due to fitness injuries or boxing <br />
  419. <span style="text-transform: uppercase; font-weight: bold;">
  420. Piercings:</span> None <br />
  421. <span style="text-transform: uppercase; font-weight: bold;">
  422. Tattoos:</span> None <br />
  423. <span style="text-transform: uppercase; font-weight: bold;">
  424. Height:</span> 5'10" <br />
  425. <span style="text-transform: uppercase; font-weight: bold;">
  426. Clothing Style:</span> A lot of workout attire. Perfers casual clothing and shirts that show off his physique <br />
  427. <span style="text-transform: uppercase; font-weight: bold;">
  428. Eye color:</span> Blue <br />
  429. <span style="text-transform: uppercase; font-weight: bold;">
  430. Hair color:</span> Blonde
  431.  
  432. </div>
  433.  
  434. <!--end of stats-->
  435.  
  436. <!--start of tags; remove this part if unwanted-->
  437.  
  438. <hr>
  439. <div id="tags">
  440.  
  441. <!--edits tags from here-->
  442.  
  443.  
  444.  
  445. </div>
  446.  
  447. <!--end of tags-->
  448.  
  449. </div>
  450. </div>
  451. </div>
  452. <nav id="bottom">
  453.  
  454. <!--edit links from here-->
  455.  
  456. <a href="http://tumblr.com">Link One</a>
  457. <a href="http://tumblr.com">Link Two</a>
  458. <a href="http://tumblr.com">Link Three</a>
  459. <a href="http://tumblr.com">Link Four</a>
  460. <a href="http://tumblr.com">Link Five</a>
  461. <a href="http://tumblr.com">Link Six</a>
  462.  
  463. </nav>
  464. </section>
  465.  
  466. <div id="c">Codes by<br><a href="http://pohroro.com">Pohroro</a></div>
  467. </body>
  468. </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!