Advertisement
superfrown

Page #1

Feb 13th, 2014
1,970
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 9.71 KB | None | 0 0
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  3.  
  4. <title>{Title}</title>
  5. <link rel="shortcut icon" href="{Favicon}">
  6. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  7.  
  8. <head>
  9. <!----
  10.  
  11. Page 01: Let's Fly
  12. bias/network/family/characters page
  13. by: superfrown.tumblr.com
  14.  
  15. You may:
  16. Edit as much as you like
  17.  
  18. You may not:
  19. Claim as your own
  20. Remove the credit
  21.  
  22.  
  23. ---->
  24.  
  25.  
  26. <style type="text/css">
  27.  
  28. /* MAIN */
  29.  
  30. body {
  31. background-color:#fafafa;
  32. background-image: url();
  33. background-attachment: fixed;
  34. background-repeat: repeat;
  35. color:#424242;
  36. font-family: calibri;
  37. font-size: 11px;
  38. margin: 0px;
  39. padding: 0px;}
  40.  
  41. a:link, a:active {
  42. text-decoration:none;
  43. color: #94b3f2;
  44. -webkit-transition: all 0.6s ease-in-out;
  45. -moz-transition: all 0.6s ease-in-out;
  46. transition: all 0.6s ease-in-out;}
  47.  
  48. a:visited {
  49. text-decoration:none;
  50. color: #94b3f2;
  51. -webkit-transition: all 0.6s ease-in-out;
  52. -moz-transition: all 0.6s ease-in-out;
  53. transition: all 0.6s ease-in-out;}
  54.  
  55. a:hover {
  56. color: #e3e3e3;
  57. -webkit-transition: all 0.6s ease-in-out;
  58. -moz-transition: all 0.6s ease-in-out;
  59. transition: all 0.6s ease-in-out;}
  60.  
  61.  
  62. ::-webkit-scrollbar {
  63. height:6px;
  64. width:6px;
  65. background-color: #fff;}
  66.  
  67. ::-webkit-scrollbar-thumb:vertical {
  68. background-color: #000;}
  69.  
  70. ::-webkit-scrollbar-thumb:horizontal {
  71. background-color: #000;}
  72.  
  73.  
  74.  
  75. /* TITLE */
  76.  
  77. .title {
  78. margin-top:40px;
  79. margin-left:0px;
  80. width:212px;
  81. height:auto;
  82. text-align:center;
  83. font-size:28px;
  84. font-family: Georgia;
  85. font-weight:normal;
  86. font-style:italic;
  87. padding:4px;
  88. letter-spacing:2px;
  89. color:#404040;}
  90.  
  91.  
  92. /* SIDEBAR */
  93.  
  94. .sidebar {
  95. width:220px;
  96. height:100%;
  97. left:0px;
  98. top:0px;
  99. position: fixed;
  100. border-right:1px solid #404040;
  101. background-color:#f0f0f0;
  102. background-image: url();}
  103.  
  104.  
  105. /* DESCRIPTION */
  106.  
  107. #description {
  108. margin-top:30px;
  109. margin-left:12px;
  110. width:182px;
  111. height:auto;
  112. overflow:auto;
  113. padding:6px;
  114. text-align:center;
  115. font-size:11px;
  116. font-family: calibri;
  117. font-weight:normal;
  118. font-style:normal;
  119. letter-spacing:0px;
  120. color: #424242;
  121. background-color:#f0f0f0;}
  122.  
  123.  
  124. /* LINKS */
  125.  
  126. #links {
  127. margin-top:20px;
  128. margin-left:50px;
  129. text-align:center;
  130. width:120px;}
  131.  
  132. #links a {
  133. display:block;
  134. font-size:10px;
  135. padding:1px;
  136. margin:3px;
  137. text-transform:uppercase;
  138. border:1px solid #404040;
  139. color: #404040;
  140. background-color: #f5f5f5;
  141. -webkit-transition: all 0.6s ease-in-out;
  142. -moz-transition: all 0.6s ease-in-out;
  143. -o-transition: all 0.6s ease-in-out;
  144. transition: all 0.6s ease-in-out;}
  145.  
  146. #links a:hover {
  147. color: #bababa;
  148. -webkit-transition: all 0.6s ease-in-out;
  149. -moz-transition: all 0.6s ease-in-out;
  150. -o-transition: all 0.6s ease-in-out;
  151. transition: all 0.6s ease-in-out;}
  152.  
  153.  
  154. /* STUFF */
  155.  
  156. .stuff {
  157. width:560px;
  158. margin-left:222px;}
  159.  
  160. .stuffimage {
  161. margin-top:40px;
  162. margin-bottom:40px;
  163. margin-left:40px;}
  164.  
  165. .stuffimage img {
  166. width:120px;
  167. height:auto;
  168. padding:6px;
  169. border:2px solid #404040;
  170. background-color:#ffffff;}
  171.  
  172. .words {
  173. display:inline-block;
  174. margin-left:10px;
  175. margin-bottom:5px;
  176. width:350px;
  177. height:auto;
  178. overflow:auto;}
  179.  
  180. .words2 {
  181. margin-bottom:6px;
  182. padding-left:4px;
  183. border-left:4px solid #404040;}
  184.  
  185.  
  186. /* CREDIT */
  187.  
  188. #credit {
  189. bottom:8px;
  190. left:5px;
  191. text-align:center;
  192. position:fixed;}
  193.  
  194. #credit a {
  195. font-size:12px;
  196. padding:2px 4px 2px 4px;
  197. border:1px solid #404040;
  198. background-color: #f5f5f5;
  199. color: #404040;
  200. -webkit-transition: all 0.6s ease-in-out;
  201. -moz-transition: all 0.6s ease-in-out;
  202. -o-transition: all 0.6s ease-in-out;
  203. transition: all 0.6s ease-in-out;}
  204.  
  205. #credit a:hover {
  206. color: #bababa;
  207. -webkit-transition: all 0.6s ease-in-out;
  208. -moz-transition: all 0.6s ease-in-out;
  209. -o-transition: all 0.6s ease-in-out;
  210. transition: all 0.6s ease-in-out;}
  211.  
  212.  
  213. </style>
  214.  
  215.  
  216. </head>
  217.  
  218. <body>
  219.  
  220.  
  221. <div class="sidebar">
  222.  
  223.  
  224. <div id="credit">
  225. <a href="http://superfrown.tumblr.com"> © </a>
  226. </div>
  227.  
  228.  
  229. <!--- EDIT YOUR TITLE HERE --->
  230. <div class="title">Let's Fly</div>
  231.  
  232.  
  233. <!--- EDIT YOUR DESCRIPTION HERE --->
  234. <div id="description">This is a description. Lorem ipsum dolor <i>sit amet</i>, consectetur adipisicing elit, sed do <b>eiusmod tempor</b> incididunt ut labore et dolore magna aliqua.
  235. <br><br>
  236. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
  237. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</div>
  238.  
  239.  
  240. <!--- EDIT YOUR LINKS HERE --->
  241. <div id="links">
  242. <a href="/"> Home </a>
  243. <a href="/ask"> Message </a>
  244. <a href=""> Link 1 </a>
  245. <a href=""> Link 2 </a>
  246. <a href=""> Link 3 </a>
  247. <a href=""> Link 4 </a>
  248. </div>
  249.  
  250.  
  251. </div>
  252.  
  253.  
  254.  
  255. <div class="stuff">
  256.  
  257.  
  258.  
  259. <!---- PERSON 1 START ---->
  260.  
  261. <div class="stuffimage">
  262.  
  263. <!-- CHANGE TAG HERE -->
  264. <a href="/">
  265.  
  266. <!-- CHANGE IMAGE HERE -->
  267. <img src="">
  268. </a>
  269.  
  270. <div class="words">
  271.  
  272. <!--- CHANGE STATS HERE --->
  273. <div class="words2"><b>Name:</b> name here </div>
  274. <div class="words2"><b>Group:</b> name here </div>
  275. <div class="words2"><b>Position:</b> name here </div>
  276.  
  277. <!--- CHANGE DESCRIPTION HERE --->
  278. This is a description. This is <b>bold</b>. This is <i>italic</i>. This is <a href="/">a link</a>. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
  279.  
  280. </div>
  281. </div>
  282.  
  283. <!--- PERSON 1 END --->
  284.  
  285.  
  286.  
  287. <!---- PERSON 2 START ---->
  288.  
  289. <div class="stuffimage">
  290.  
  291. <!-- CHANGE TAG HERE -->
  292. <a href="/">
  293.  
  294. <!-- CHANGE IMAGE HERE -->
  295. <img src="">
  296. </a>
  297.  
  298. <div class="words">
  299.  
  300. <!--- CHANGE STATS HERE --->
  301. <div class="words2"><b>Name:</b> name here </div>
  302. <div class="words2"><b>Group:</b> name here </div>
  303. <div class="words2"><b>Position:</b> name here </div>
  304.  
  305. <!--- CHANGE DESCRIPTION HERE --->
  306. This is a description. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
  307.  
  308. </div>
  309. </div>
  310.  
  311. <!--- PERSON 2 END --->
  312.  
  313.  
  314.  
  315. <!---- PERSON 3 START ---->
  316.  
  317. <div class="stuffimage">
  318.  
  319. <!-- CHANGE TAG HERE -->
  320. <a href="/">
  321.  
  322. <!-- CHANGE IMAGE HERE -->
  323. <img src="">
  324. </a>
  325.  
  326. <div class="words">
  327.  
  328. <!--- CHANGE STATS HERE --->
  329. <div class="words2"><b>Name:</b> name here </div>
  330. <div class="words2"><b>Group:</b> name here </div>
  331. <div class="words2"><b>Position:</b> name here </div>
  332.  
  333. <!--- CHANGE DESCRIPTION HERE --->
  334. This is a description. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
  335.  
  336. </div>
  337. </div>
  338.  
  339. <!--- PERSON 3 END --->
  340.  
  341.  
  342.  
  343. <!---- PERSON 4 START ---->
  344.  
  345. <div class="stuffimage">
  346.  
  347. <!-- CHANGE TAG HERE -->
  348. <a href="/">
  349.  
  350. <!-- CHANGE IMAGE HERE -->
  351. <img src="">
  352. </a>
  353.  
  354. <div class="words">
  355.  
  356. <!--- CHANGE STATS HERE --->
  357. <div class="words2"><b>Name:</b> name here </div>
  358. <div class="words2"><b>Group:</b> name here </div>
  359. <div class="words2"><b>Position:</b> name here </div>
  360.  
  361. <!--- CHANGE DESCRIPTION HERE --->
  362. This is a description. Lorem ipsum dolor sit amet
  363.  
  364. </div>
  365. </div>
  366.  
  367. <!--- PERSON 4 END --->
  368.  
  369.  
  370.  
  371. <!---- PERSON 5 START ---->
  372.  
  373. <div class="stuffimage">
  374.  
  375. <!-- CHANGE TAG HERE -->
  376. <a href="/">
  377.  
  378. <!-- CHANGE IMAGE HERE -->
  379. <img src="">
  380. </a>
  381.  
  382. <div class="words">
  383.  
  384. <!--- CHANGE STATS HERE --->
  385. <div class="words2"><b>Name:</b> name here </div>
  386. <div class="words2"><b>Group:</b> name here </div>
  387. <div class="words2"><b>Position:</b> name here </div>
  388.  
  389. <!--- CHANGE DESCRIPTION HERE --->
  390. This is a description. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
  391.  
  392. </div>
  393. </div>
  394.  
  395. <!--- PERSON 5 END --->
  396.  
  397.  
  398.  
  399. <!--- If you want more people, just copy and paste --->
  400.  
  401.  
  402. </div>
  403.  
  404.  
  405.  
  406. </body>
  407. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement