API tools faq
paste
Advertisement
7th-district

[Page #2] About Page

7th-district
Oct 11th, 2013
7,449
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 8.35 KB | None | 0 0
raw download clone embed print report
  1. <!--
  2. ___________________________________________________________________________
  3.  
  4. ▶ PAGE MADE BY RACHEL @ ALMIGHTYONE.TUMBLR.COM
  5.  
  6. [PAGE #2] ABOUT PAGE
  7. If you have any questions, go to 7th-district.tumblr.com for help.
  8.  
  9. DO NOT REMOVE THE CREDIT OR DELETE THIS MESSAGE!
  10. ___________________________________________________________________________
  11. -->
  12.  
  13. <html>
  14. <head>
  15.  
  16. <title>{Title}</title>
  17. <link rel="shortcut icon" href="{Favicon}" />
  18.  
  19. <link href="style-my-tooltips.css" rel="stylesheet" type="text/css" />
  20. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script><script type="text/javascript" src="http://static.tumblr.com/7qjmkr5/IUmmdsy41/jquery.style-my-tooltips.js"></script><script>(function($){$(document).ready(function(){$("[title]").style_my_tooltips();});})(jQuery);</script>
  21.  
  22. <link href='http://fonts.googleapis.com/css?family=Audiowide' rel='stylesheet' type='text/css'> <!-- font-family: 'Audiowide', cursive; -->
  23.  
  24. <link href='http://fonts.googleapis.com/css?family=Rationale' rel='stylesheet' type='text/css'> <!-- font-family: 'Rationale', sans-serif; -->
  25.  
  26. <style type="text/css">
  27.  
  28. ::-webkit-scrollbar {
  29. width:6px;
  30. height:7px;
  31. }
  32.  
  33. ::-webkit-scrollbar-track-piece {
  34. background-color:#121212;
  35. }
  36. ::-webkit-scrollbar-thumb {
  37. background-color:#e5b4b0;
  38. box-shadow:0px 0px 5px #888;
  39. }
  40.  
  41. body {
  42. /* YOUR BACKGROUND IMAGE */
  43. background:white;
  44. background-image:url('http://31.media.tumblr.com/tumblr_m0g3ybPmqj1r6uwfxo6_1280.png');
  45. background-attachment:fixed;
  46. background-repeat:repeat;
  47. padding:0;
  48. margin:0;
  49. word-wrap:break-word;
  50. }
  51.  
  52. body a{text-decoration:none;}
  53. ul {list-style-type:square;}
  54.  
  55. #content {
  56. position:absolute;
  57. border:0px solid white;
  58. padding-bottom:50px;
  59. top:15%;
  60. left:50%;
  61. height:auto;
  62. width:800px;
  63. margin-left:-400px;
  64. }
  65.  
  66. /* YOUR SIDEBAR IMAGE */
  67. #content img {
  68. float:left;
  69. width:250px;
  70. height:auto;
  71. padding:5px;
  72. background:#0e1420; /* THE BACKGROUND COLOR OF YOUR IMAGE */
  73. border:2px solid #85edb5; /* THE BORDER COLOR */
  74. z-index:9;
  75. box-shadow:0px 0px 5px #888;
  76. }
  77.  
  78.  
  79. /* TITLE */
  80. #title {
  81. text-align:right;
  82. width:630px;
  83. padding-right:190px;
  84. padding-left:40px;
  85. border:0px solid white;
  86. font-family: 'Rationale', sans-serif;
  87. font-size:30px;
  88. letter-spacing:3px;
  89. text-transform:uppercase;
  90. color:#eee;
  91. margin-left:-30px;
  92. margin-bottom:-30px;
  93. text-shadow:0px 0px 5px #888;
  94. border-bottom:2px solid #e5b4b0; /*TITLE UNDERLINE */
  95. }
  96.  
  97. #info {
  98. margin-left:277px;
  99. margin-top:50px;
  100. padding:8px;
  101. width:350px;
  102. color:#e8ded2; /* BODY COLOR TEXT WHERE ALL YOUR INFO/BIO IS */
  103. text-shadow:0px 0px 2px #565656;
  104. font-family:consolas;
  105. font-size:10px;
  106. line-height:130%;
  107. background:#262626;
  108. background-image:url('http://24.media.tumblr.com/tumblr_lzvjakQDzV1qhvdofo5_500.jpg');
  109. box-shadow:0px 0px 4px #565656;
  110. }
  111.  
  112. /* LINKS ITALICS AND BOLD */
  113. #info a{
  114. color:#e5b4b0;
  115. -webkit-transition: all 0.4s ease;
  116. }
  117.  
  118. #info a:hover {
  119. color:#fff;
  120. -webkit-transition: all 0.4s ease;
  121. }
  122.  
  123. #info i {
  124. font-weight:bold;
  125. font-style:italic;
  126. color:#d7ba83; /* <--- italics */
  127. }
  128.  
  129. #info b, strong {
  130. font-weight:bold;
  131. color:#6e8f9d;
  132. }
  133.  
  134. /* BORDERS */
  135. .topleft{
  136. position:fixed;
  137. top:0px;
  138. left:0px;
  139. width: 0px;
  140. height: 0px;
  141. border-style: solid;
  142. border-width: 90px 90px 0 0;
  143. border-color: #85edb5 transparent transparent transparent;} /* CHANGE THE HEX CODE #85EDB5 TO WHATEVER SCREEN BORDER COLOR YOU WANT. BE SURE TO ALSO DO THAT FOR TOPRIGHT, BOTTOMRIGHT, AND BOTTOMLEFT! */
  144. .topright{
  145. position:fixed;
  146. top:0px;
  147. right:0px;
  148. width: 0px;
  149. height: 0px;
  150. border-style: solid;
  151. border-width: 0 90px 90px 0;
  152. border-color: transparent #85edb5 transparent transparent;}
  153. .bottomright{
  154. position:fixed;
  155. bottom:0px;
  156. right:0px;
  157. width: 0px;
  158. height: 0px;
  159. border-style: solid;
  160. border-width: 0 0 90px 90px;
  161. border-color: transparent transparent #85edb5 transparent;}
  162. .bottomleft{
  163. position:fixed;
  164. bottom:0px;
  165. left:0px;
  166. width: 0px;
  167. height: 0px;
  168. border-style: solid;
  169. border-width: 90px 0 0 90px;
  170. border-color: transparent transparent transparent #85edb5;}
  171.  
  172. #line{
  173. background:#85edb5;
  174. position:absolute;
  175. width:850px;
  176. height:5px;
  177. margin-top:33px;
  178. margin-left:-50px;
  179. box-shadow:0px 0px 5px #888;
  180. z-index:-1;
  181. }
  182.  
  183. /* LINKS ON THE RIGHT */
  184. #links {
  185. float:right;
  186. margin-top:10px;
  187. margin-right:30px;
  188. background-image:url('http://24.media.tumblr.com/tumblr_lzvjakQDzV1qhvdofo5_500.jpg'); /* LINKS BACKGROUND */
  189. width:100px;
  190. padding:5px;
  191. height:auto;
  192. border:2px solid #85edb5;
  193. text-align:center;
  194. box-shadow:0px 0px 5px #888;
  195. }
  196.  
  197. #links a{
  198. float:right;
  199. width:90px;
  200. font-family: 'Rationale', sans-serif;
  201. text-transform:uppercase;
  202. font-size:11px;
  203. letter-spacing:2px;
  204. color:#fff; /* LINK TEXT */
  205. text-shadow:0px 0px 5px #888;
  206. border-bottom:0px solid #565656;
  207. box-shadow:0px 0px 0px #888;
  208. margin:4px;
  209. padding:0px 0px 3px 0px;
  210.  
  211. transition: all 0.6s ease;
  212. -moz-transition: all 0.6s ease;
  213. -webkit-transition: all 0.6s ease;
  214. -o-transition: all 0.6s ease;
  215. }
  216.  
  217. #links a:hover{
  218. color:#333; /* LINK TEXT HOVER */
  219. background:#85edb5; /* LINK BACKGROUND HOVER */
  220. box-shadow:0px 0px 5px #888;
  221. transition: all 0.6s ease;
  222. -moz-transition: all 0.6s ease;
  223. -webkit-transition: all 0.6s ease;
  224. -o-transition: all 0.6s ease;
  225. }
  226.  
  227.  
  228. #s-m-t-tooltip {
  229. position:relative;
  230. overflow:hidden;
  231. z-index:99999;
  232. max-width:200px;
  233. margin:10px 0 0 10px;
  234. padding:4px 6px 5px 6px;
  235. font:10px consolas;
  236. background:#262626;
  237. border:1px solid #121212;
  238. line-height:100%;
  239. text-transform:uppercase;
  240. letter-spacing:1px;
  241. color:#fff;
  242. }
  243.  
  244. </style>
  245. </head>
  246. <body>
  247.  
  248. <div class="topleft"></div>
  249. <div class="topright"></div>
  250. <div class="bottomright"></div>
  251. <div class="bottomleft"></div>
  252.  
  253.  
  254. <div id="content">
  255.  
  256. <div id="title">▰ about me</div>
  257.  
  258. <div id="line"></div>
  259.  
  260. <!-- SIDEBAR IMAGE HERE -->
  261. <img src="http://static.tumblr.com/qgsvv0s/TRYmujee6/bym0.png" />
  262.  
  263. <!-- http://img94.imageshack.us/img94/7730/bym0.png -->
  264.  
  265. <div id="links">
  266. <a href="/">► return</a>
  267. <a href="/ask">message</a>
  268. <a href="/archive">history</a>
  269. <a href="/">link 1</a>
  270. <a href="/">link 2</a>
  271. <a href="/">link 3</a>
  272. <a href="/">link 4</a>
  273. <a href="/">link 5</a>
  274.  
  275. <!-- DO NOT REMOVE THE CREDIT OR MOVE IT ANYWHERE. DO NOT RENAME IT EITHER AND LEAVE THE TITLE ALONE. THANK YOU -->
  276. <a href="http://almightyone.tumblr.com/" title="page made by almightyone">credit</a>
  277.  
  278.  
  279. <!-- KEEP ON SCROLLING-->
  280.  
  281. </div>
  282.  
  283. <div id="info">
  284.  
  285. <!-- THIS IS WHERE YOU TALK ABOUT YOURSELF -->
  286. This is a list:
  287. <ul>
  288. <li>thing 1</li>
  289. <li>thing 2</li>
  290. <li>thing 3</li>
  291. </ul>
  292.  
  293. <p> <b>What do you like?</b> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec cursus tellus eu eros viverra id semper massa blandit. Nam condimentum commodo dui, eget volutpat enim hendrerit mollis. Praesent fringilla pharetra nunc vitae sagittis. Proin elit urna, eleifend sed euismod at, bibendum ac nisi. Vestibulum pulvinar nisi sit amet dui consectetur ultrices. </p>
  294.  
  295. <p> <i>Dislikes?</i> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec cursus tellus eu eros viverra id semper massa blandit. Nam condimentum commodo dui, eget volutpat enim hendrerit mollis. Praesent fringilla pharetra nunc vitae sagittis. Proin elit urna, eleifend sed euismod at, bibendum ac nisi. Vestibulum pulvinar nisi sit amet dui consectetur ultrices. </p>
  296.  
  297. <p> <b>Anything else you want to say?</b> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec cursus tellus eu eros viverra id semper massa blandit. Nam condimentum commodo dui, eget volutpat enim hendrerit mollis. </p>
  298.  
  299. <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec cursus tellus eu eros viverra id semper massa blandit. Nam condimentum commodo dui, eget volutpat enim hendrerit mollis. Praesent fringilla pharetra nunc vitae sagittis. Proin elit urna, eleifend sed euismod at, bibendum ac nisi. Vestibulum pulvinar nisi sit amet dui consectetur ultrices. </p>
  300.  
  301. </div> <!-- info -->
  302. </div> <!-- content -->
  303.  
  304.  
  305. </body>
  306. </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!