API tools faq
paste
Advertisement
damnbritts

About theme #01 | Damnbritts

damnbritts
Nov 22nd, 2013
5,103
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 7.25 KB | None | 0 0
raw download clone embed print report
  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. <head>
  4. <title>{Title}</title>
  5. <link rel="shortcut icon" href="{Favicon}">
  6. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  7. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  8.  
  9. <!----about theme 01 by damnbritts, dont steal please--->
  10.  
  11. <head>
  12.  
  13. <style type="text/css">
  14.  
  15. ::-webkit-scrollbar-thumb:vertical {
  16. height:12px;
  17. border:3px solid #fff;
  18. background-color:#ddd;
  19. }
  20. ::-webkit-scrollbar-thumb:horizontal {
  21. background-color:#fff;
  22. }
  23. ::-webkit-scrollbar {
  24. width:11px;
  25. height:7px;
  26. border:5px solid #fff;
  27. background-color:#ddd;
  28. }
  29.  
  30.  
  31. body {
  32. margin:0px;
  33. color:#cecccc;
  34. font-family:Calibri;
  35. font-size:10px;
  36. padding:5px;
  37. line-height:100%;
  38. }
  39.  
  40. a {
  41. color:#cecccc;
  42. text-decoration:none;
  43. outline:none;
  44. opacity:1 ;
  45. -webkit-transition: all 0.8s;
  46. -moz-transition: all 0.8s;
  47. transition: all 0.8s;
  48. }
  49.  
  50. a:hover {
  51. color:#1d1d1d;
  52. -webkit-transition: all 0.8s;
  53. -moz-transition: all 0.8s;
  54. transition: all 0.8s;
  55. }
  56.  
  57.  
  58. img {
  59. border:none;
  60. }
  61.  
  62. blockquote {
  63. padding-left:5px;
  64. border-left:2px solid;
  65. }
  66.  
  67. blockquote blockquote {
  68. padding-left:5px;
  69. border-left:2px solid;
  70. }
  71.  
  72. h1 {
  73. font-size:15px;
  74. }
  75.  
  76.  
  77. #stuff{
  78. margin-bottom:20px;
  79. margin-top:130px;
  80. margin-left:30%;
  81. background:#ffffff;
  82. height:210px;
  83. width:440px;
  84.  
  85. }
  86.  
  87. #image {
  88. position:fixed;
  89. margin-left:2px;
  90. margin-top:134px;
  91. }
  92.  
  93. #image img {
  94. width:226px;
  95. height:210px;
  96. border:6px solid #f8f8f8;
  97. }
  98.  
  99. #aboutstuff {
  100. width:226px;
  101. background:#f8f8f8;
  102. font-size:16px;
  103. padding:3px;
  104. text-transform:uppercase;
  105. color:#cacaca;
  106. border:4px double #eee;
  107. font-family:times;
  108. margin-left:1px;
  109. line-height:115%;
  110. text-decoration:underline;
  111. position:fixed;
  112. margin-top:59px;
  113. }
  114.  
  115. #aboutstuff2 {
  116. font-size:18px;
  117. text-transform:lowercase;
  118. color:#cacaca;
  119. font-family:times;
  120. margin-top:64px;
  121. margin-left:61px;
  122. float:left;
  123. position:fixed;
  124. line-height:115%;
  125. font-style:italic;
  126. }
  127. #aboutstuff3 {
  128. font-size:18px;
  129. text-transform:lowercase;
  130. color:#cacaca;
  131. font-family:times;
  132. margin-top:82px;
  133. margin-left:45px;
  134. float:left;
  135. position:fixed;
  136. line-height:115%;
  137. font-style:italic;
  138. }
  139. #aboutstuff4 {
  140. font-size:18px;
  141. text-transform:lowercase;
  142. color:#cacaca;
  143. font-family:times;
  144. margin-top:100px;
  145. margin-left:93px;
  146. float:left;
  147. position:fixed;
  148. line-height:115%;
  149. font-style:italic;
  150. }
  151. #bigletter {
  152. background-color: #ddd;
  153. padding-left: 10px;
  154. padding-top: 1px;
  155. padding-bottom: 1px;
  156. width:16px;
  157. height:55px;
  158. color:#fff;
  159. font-size:35px;
  160. margin-right:5px;
  161. font-family:times;
  162. text-transform:uppercase;
  163. border:3px double white;
  164. margin-left:0px;
  165. float:left;
  166. font-weight:bold;
  167. line-height:160%;
  168. padding-right:16px;
  169. }
  170.  
  171. #about{
  172. margin-bottom:25px;
  173. background:#f8f8f8;
  174. text-align:center;
  175. width:270px;
  176. height:270px;
  177. padding:10px;
  178. font-size:13px;
  179. font-family:calibri;
  180. letter-spacing:0px;
  181. color:#a8a8a8;
  182. line-height:100%;
  183. border:4px double #eee;
  184. margin-left:248px;
  185. position:absolute;
  186. margin-top:60px;
  187. overflow:scroll;
  188. text-align:justify;
  189. }
  190.  
  191. @font-face{font-family:Basic L;src:url(http://static.tumblr.com/9wzbixa/Cf3mj2g0f/basicl.ttf);}
  192.  
  193.  
  194. #title {
  195. font-size:48px;
  196. color:#a8a8a8;
  197. background:#f8f8f8;
  198. width:500px;
  199. border:4px double #eee;
  200. text-align:center;
  201. padding:20px;
  202. padding-bottom:27px;
  203. margin-top:-15px;
  204. position:fixed;
  205. text-transform:uppercase;
  206. font-family:Basic L;
  207. }
  208.  
  209. #links {
  210. margin-left:105px;
  211. }
  212.  
  213. #links a{
  214. -webkit-transition: all 0.5s;
  215. -moz-transition: all 0.5s;
  216. transition: all 0.5s;
  217. display:inline-block;
  218. text-transform:uppercase;
  219. letter-spacing:2px;
  220. color:#a8a8a8;
  221. background:#f8f8f8;
  222. border:4px double #eee;
  223. margin-top:370px;
  224. margin-left:5px;
  225. font-family:basic l;
  226. text-align:center;
  227. width:60px;
  228. font-size:14px;
  229. padding:8px 6px 9px 5px;
  230. }
  231.  
  232. #links a:hover{
  233. letter-spacing:4px;
  234. -webkit-transition: all 0.5s;
  235. -moz-transition: all 0.5s;
  236. transition: all 0.5s;
  237. }
  238.  
  239. #cred {
  240. font-size:8px;
  241. font-family:times;
  242. letter-spacing:1px;
  243. -moz-transition-duration:0.5s;
  244. -webkit-transition-duration:0.5s;
  245. -o-transition-duration:0.5s;
  246. }
  247.  
  248. #cred a {
  249. background-color:#fff;
  250. color:#a8a8a8;
  251. padding:5px;
  252. border:1px solid #ddd;
  253. position:fixed;
  254. right:7px;
  255. bottom:10px
  256. }
  257.  
  258. #cred a:hover {
  259. color:#fff;
  260. background-color:#000;
  261. border-radius:90px;
  262. -moz-transition-duration:2s;
  263. -webkit-transition-duration:2s;
  264. -o-transition-duration:2s;
  265. }
  266.  
  267.  
  268. {CustomCSS}</style>
  269.  
  270.  
  271. </head>
  272. <body>
  273.  
  274. <!-- here is where the customization starts-->
  275.  
  276. <div id="stuff">
  277.  
  278. <!--replace with your title here-->
  279. <div id="title">about me</div>
  280.  
  281. <!-- replace with the url of your image-->
  282. <div id="image"><img src="http://media.tumblr.com/bcc6dc5a5d90310bb7f59029a30fb2be/tumblr_inline_mp67heiMdd1qz4rgp.png"></div>
  283.  
  284.  
  285. <div id="about">
  286. <!--write about yourself here-->
  287. <div id="bigletter">
  288. T</div> his is the space where you write about yourself. You dont have to worry about making it short because if you make it long enough a scrollbar will appear on the side like so. Make sure you write a lot as it does look better! Hope you enjoy this theme since its my first about page.<p>
  289.  
  290. 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 ac dui eu nisi consequat ultricies dignissim eu urna. Sed varius quam dictum lacinia volutpat.
  291. <p>
  292. Bold. Italic. Underline. Link. 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. </div>
  293.  
  294.  
  295. <div id="aboutstuff">name:<br>age:<br>birthday:</div>
  296.  
  297. <div id="aboutstuff2">
  298.  
  299. <!-- replace with your name-->
  300. atikah
  301.  
  302. </div>
  303.  
  304. <div id="aboutstuff3">
  305.  
  306. <!-- replace with your age-->
  307. old
  308.  
  309. </div>
  310.  
  311. <div id="aboutstuff4">
  312.  
  313. <!-- replace with your name-->
  314. hm
  315.  
  316. </div>
  317.  
  318. <center><div id="links">
  319. <!-- replace with your links-->
  320. <a href="/">index</a>
  321. <a href="/ask">ask</a>
  322. <a href="tumblr.com">dash</a>
  323. </div>
  324.  
  325.  
  326. </div></div>
  327.  
  328. <div id="cred"><a href="http://damnbritts.tumblr.com/">DB</a></div>
  329.  
  330. </div>
  331. {block:PostNotes}{PostNotes}{/block:PostNotes}
  332. {/block:Posts}</div>
  333.  
  334. </body></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!