Mikaela

Live While We're Young

Jul 13th, 2014
81
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 10.53 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.  
  3. <!-- THEME #32 'LIVE WHILE WE'RE YOUNG' BY HRRYS
  4. I WORKED HARD ON THIS SO IF YOU REMOVE THE CREDIT OR EDIT AND CLAIM IT AS YOUR OWN, I'LL GET HARRY TO STRANGLE YOU.
  5. OKAY ENJOY NOW
  6. -->
  7.  
  8. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  9.  
  10.  
  11. <head>
  12.  
  13. <title>{Title}</title>
  14.  
  15. {block:Description}<meta name="description" content="{MetaDescription}"/>
  16. {/block:Description}
  17. <link rel="shortcut icon" href="{Favicon}" />
  18. <link rel="alternate" type="application/rss+xml" href="{RSS}" />
  19.  
  20. <meta name="color:bg" content="#ffffff">
  21. <meta name="color:sidebarlinks" content="#bbb8b8">
  22. <meta name="color:text" content="#9a9a9a">
  23. <meta name="color:link" content="#bbb8b8">
  24. <meta name="color:ask" content="#ededed">
  25. <meta name="color:hover" content="#eeeeee">
  26. <meta name="color:border" content="#e7e7e7">
  27. <meta name="color:scrollbar" content="#d6d5d5">
  28.  
  29. <meta name="image:sidebar" content=""/>
  30.  
  31. <meta name="text:link 1" content="LINK">
  32. <meta name="text:link 1 url" content="/">
  33. <meta name="text:link 2" content="LINK">
  34. <meta name="text:link 2 url" content="/">
  35. <meta name="text:link 3" content="LINK">
  36. <meta name="text:link 3 url" content="/">
  37. <meta name="text:link 4" content="LINK">
  38. <meta name="text:link 4 url" content="/">
  39.  
  40.  
  41.  
  42. <style type="text/css">
  43.  
  44.  
  45. /*--scrollbar--*/
  46.  
  47. ::-webkit-scrollbar-thumb:vertical {border:3px solid #fff;height:12px; background-color:{color:scrollbar};}
  48. ::-webkit-scrollbar-thumb:horizontal {background-color:#fff;}
  49. ::-webkit-scrollbar {background-color:{color:scrollbar};height:7px;width:12px;border:5px solid #fff;}
  50. ::-webkit-scrollbar-button:start:decrement, ::-webkit-scrollbar-button:end:increment{background-color:{color:scrollbar};display:block;height:8px;border-right:2px solid #fff;border-left:2px solid #fff;
  51. }
  52. /*--body--*/
  53.  
  54.  
  55. body {
  56. font-style:none;
  57. background-color:{color:bg};
  58. font-family:calibri;
  59. color:{color:text};
  60. font-size:9px;
  61. }
  62.  
  63.  
  64. a {
  65. color:{color:link};
  66. text-decoration:none;
  67. -webkit-transition: all 0.5s ease-out;
  68. -moz-transition: all 0.5s ease-out;
  69. transition: all 0.5s ease-out;
  70. }
  71.  
  72. a:hover {
  73. color:{color:hover};
  74. text-decoration:none;
  75. -webkit-transition: all 0.8s ease-out;
  76. -moz-transition: all 0.8s ease-out;
  77. transition: all 0.8s ease-out;
  78. }
  79.  
  80. img {
  81. border:none;
  82. }
  83.  
  84. blockquote {
  85. padding-left:5px;
  86. border-left:2px solid {color:border};
  87. }
  88.  
  89. h1 {
  90. font-size:10px;
  91. }
  92.  
  93. /*--Cursor code--*/
  94.  
  95. *, body, a, a:hover {cursor: url("http://www.totallylayouts.com/cursors/random/tiny_cursor.png"), auto }
  96.  
  97. /*--sidebar--*/
  98.  
  99. #sidebar {
  100. position:fixed;
  101. width:140px;
  102. margin-left:200px;
  103. margin-top:200px;
  104. }
  105.  
  106.  
  107. /*--links--*/
  108.  
  109. .links {
  110. width:180px;
  111. padding: 4px;
  112. text-align:center;
  113. text-transform:uppercase;
  114. position:fixed;
  115. margin-top:135px;
  116. margin-left:-90px;
  117. padding:40px;
  118. padding-top:55px;
  119. padding-bottom:55px;
  120. }
  121.  
  122. .links a {
  123. width:-10px;
  124. padding:5px;
  125. font-size:5px;
  126. border-radius:200px;
  127. margin:5px;
  128. letter-spacing:2px;
  129. border:1px solid {color:sidebarlinks};
  130. color:{color:sidebarlinks};
  131. background:{color:sidebarlinks};
  132. text-align:center;
  133. display:inline-block;
  134. }
  135.  
  136. .links a:hover {
  137. -moz-transition-duration:0.3s;
  138. -webkit-transition-duration:0.3s;
  139. -o-transition-duration:0.3s;
  140. background:#fff;
  141. }
  142.  
  143. /*--pagination--*/
  144.  
  145. #pagination {
  146. margin-top:-10px;
  147. margin-left:105px;
  148. z-index:9999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999;
  149. text-align:center;
  150. font-size:11px;
  151. font-family:calibri;
  152. color:{color:sidebarlinks};
  153. }
  154.  
  155. #pagination a{
  156. color:{color:sidebarlinks};
  157. }
  158.  
  159. #pagination a:hover {
  160. color:{color:hover};
  161. }
  162.  
  163. /*--posts--*/
  164.  
  165. #posts {
  166. width:500px;
  167. margin-bottom:10px;
  168. padding:1px;
  169. font-size:11px;
  170. color:{color:text};
  171. line-height:90%;
  172. text-align:justify;
  173. }
  174.  
  175. #postscontainer {
  176. margin-bottom:20px;
  177. padding:1px;
  178. margin-left:430px;
  179. margin-top:55px;
  180. }
  181.  
  182.  
  183. /*--info--*/
  184.  
  185. #notes {
  186. font-family:anaheim;
  187. text-transform:lowercase;
  188. font-size:10px; }
  189.  
  190. #info {
  191. text-align:right;
  192. padding:5px;
  193. margin-top:5px;
  194. margin-bottom:10px;
  195. text-transform: uppercase;
  196. font-family:calibri;
  197. font-size:9px;
  198. margin-left:-5px;
  199. border-top: 1px solid;
  200. border-color: {color:border}; }
  201.  
  202. #info #tags {
  203. opacity:0;
  204. -webkit-transition:all 0.5s ease-in-out;
  205. -moz-transition:all 0.5s ease-in-out;
  206. -o-transition:all 0.5s ease-in-out;
  207. -ms-transition:all 0.5s ease-in-out;
  208. transition:all 0.5s ease-in-out; }
  209.  
  210. #info:hover #tags {
  211. opacity:1;
  212. margin-top:4px;
  213. -webkit-transition:all 0.5s ease-in-out;
  214. -moz-transition:all 0.5s ease-in-out;
  215. -o-transition:all 0.5s ease-in-out;
  216. -ms-transition:all 0.5s ease-in-out;
  217. transition:all 0.5s ease-in-out; }
  218.  
  219. #tags {
  220. font-family:calibri;
  221. letter-spacing:1px;
  222. text-transform:uppercase;
  223. font-size:8px;
  224. margin-left:0px;
  225. margin-top:-2px; }
  226.  
  227. #tags a:hover {
  228. text-decoration:line-through;
  229. opacity:0.5;}
  230.  
  231. /*--asks--*/
  232.  
  233. .speech {
  234. align:right;
  235. background-color:{color:ask} ;
  236. margin:10px 0px 0px 50px;
  237. padding:10px;
  238. line-height:105%;
  239. font-size: 11px;
  240. font-family:'cambria';
  241. letter-spacing:1px;
  242. position:relative;}
  243.  
  244. .speech p {margin:1px 0px;}
  245.  
  246. .speech span {
  247. display:block;
  248. position:absolute;
  249. width:1px;
  250. height:1px;
  251. font-size:0;
  252. line-height:1px;
  253. left:-10px;
  254. top:10px;
  255. border-top:7px solid transparent;
  256. border-bottom:7px solid transparent;
  257. border-right:10px solid {color:ask};}
  258.  
  259. .askbg {
  260. float:left;
  261. margin:10px 4px 0px 0;
  262.  
  263. padding:2px;
  264. background-color:{color:ask};}
  265.  
  266. /*--credit--*/
  267.  
  268. #cred {
  269. right:0px;
  270. bottom:-2px;
  271. color:{color:text};
  272. position:fixed;
  273. -webkit-transition: all 0.5s ease-out;
  274. -moz-transition: all 0.5s ease-out;
  275. transition: all 0.5s ease-out;
  276. }
  277.  
  278. /*--sidebar image & desc--*/
  279.  
  280. #barbie
  281. {position:fixed;
  282. margin-left:-50px;}
  283.  
  284. .slidingdoor
  285. {-webkit-transition: opacity 0.7s linear;-webkit-transition: all 0.7s ease-in-out;-moz-transition: all 0.7s ease-in-out;-o-transition: all 0.7s ease-in-out;}
  286.  
  287. #pic
  288. {width:180px;
  289. }
  290.  
  291. #pic:hover
  292. {width:340px;}
  293.  
  294. #left
  295. {float:left;
  296. overflow:hidden;
  297. width:90px;
  298. }
  299.  
  300. #right{
  301. overflow:hidden;
  302. width:90px;
  303. }
  304.  
  305. #des{
  306. float:left;
  307. width:0px;
  308. height:0px;
  309. text-align: center;
  310. opacity:0;
  311. }
  312.  
  313.  
  314. #pic:hover #des{
  315. width:115px;
  316. padding:20px 10px 20px 10px;
  317. opacity:1;
  318. }
  319.  
  320. #pic:hover #left
  321. {margin-left:-65px;}
  322.  
  323. #s-m-t-tooltip {max-width:300px;padding:2px 2px 2px 2px;margin:10px 0px 0px 10px;background-color:#fff;border:1px solid #fff;font-family:trebuchet ms;font-size:8px;letter-spacing:1px;text-transform:uppercase;color:{color:sidebarlinks};z-index:999999999999999999999999999999999999;}
  324.  
  325. {CustomCSS}
  326.  
  327. </style></head>
  328.  
  329.  
  330. <body>
  331. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  332. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  333. <!--tutorial by meem.co.vu-->
  334. <script>
  335.  
  336. (function($){
  337.  
  338. $(document).ready(function(){
  339.  
  340. $("a[title]").style_my_tooltips({
  341.  
  342. tip_follows_cursor:true,
  343.  
  344. tip_delay_time:90,
  345.  
  346. tip_fade_speed:600,
  347.  
  348. attribute:"title"
  349.  
  350. });
  351.  
  352. });
  353.  
  354. })(jQuery);
  355.  
  356. </script>
  357. <div id="sidebar">
  358. <div id="barbie">
  359. <div id="pic" class="slidingdoor">
  360. <div id="left" class="slidingdoor">
  361. <img width="180px" height="180px" src="{image:sidebar}">
  362. </div>
  363. <div id="des" class="slidingdoor">{Description}</div>
  364. <div id="right" class="slidingdoor">
  365. <img width="180px" height="180px" style="margin-left:-90px;" src="{image:sidebar}">
  366. </div>
  367. </div>
  368. </div>
  369.  
  370. <div class="links">
  371. <a href="/" title="home"></a>
  372. <a href="/ask" title="mail"></a>
  373. <a href="{text:link 1 url}" title="{text:link 1}"></a>
  374. <a href="{text:link 2 url}" title="{text:link 2}"></a>
  375. <a href="{text:link 3 url}" title="{text:link 3}"></a>
  376. <a href="{text:link 4 url}" title="{text:link 4}"></a>
  377. </div>
  378.  
  379. {block:Pagination}
  380. <div id="pagination">
  381.  
  382. {block:PreviousPage}<a href="{PreviousPage}"><<</a>{/block:PreviousPage}
  383. {block:NextPage}<a href="{NextPage}">>></a>{/block:NextPage}
  384. </div>{/block:Pagination}
  385.  
  386. </div></div>
  387.  
  388.  
  389. <div id="postscontainer">
  390.  
  391. {block:Posts}
  392.  
  393. <div id="posts">
  394.  
  395.  
  396. {block:Text}<h1>{block:Title}{Title}{/block:Title}</h1>{Body}{/block:Text}
  397.  
  398.  
  399. {block:Photo}{LinkOpenTag}<img src="{PhotoURL-500}">{LinkCloseTag}{block:Caption}{Caption}{/block:Caption}{/block:Photo}
  400.  
  401. {block:Photoset}{Photoset-500}{block:Caption}{Caption}{/block:Caption}{/block:Photoset}
  402.  
  403. {block:Quote}{Quote}{block:Source} &#8212;{Source}{/block:Source}{/block:Quote}
  404.  
  405. {block:Link}<h1><a href="{URL}" {Target}>{Name}</a></h1>{block:Description}{Description}{/block:Description}{/block:Link}
  406.  
  407. {block:Chat}{block:Title}<h1>{Title}</h1>{/block:Title}{block:Lines}{block:Label}<b>{Label}</b>{/block:Label} {Line}<br>{/block:Lines}{/block:Chat}
  408.  
  409. {block:Audio}{AudioPlayerWhite}{block:Caption}{Caption}{/block:Caption}{/block:Audio}
  410.  
  411. {block:Video}{Video-500}{block:Caption}{Caption}{/block:Caption}{/block:Video}
  412.  
  413. {block:Answer}
  414. <img src="{AskerPortraitURL-30}" align="left" class="askbg"><div class="speech"><span></span>{Asker}:<<br>{Question}&nbsp;</div><br>{Answer}
  415. {/block:Answer}
  416.  
  417. <div id="info"> <a href="{Permalink}">{block:Date}<a href="{Permalink}">{TimeAgo}</a>{/block:Date} <font color="gray">♥</font> <a href="{Permalink}">{NoteCount}</a> {block:RebloggedFrom} <a href="{ReblogParentURL}">via</a> {/block:RebloggedFrom} {block:ContentSource}/ <a href="{SourceURL}">src</a></a>{/block:ContentSource}{/block:RebloggedFrom}
  418. {block:HasTags}<div id="tags"><b>#</b>:{block:Tags} <a href="{TagURL}">{Tag}</a> {/block:Tags}</div>{/block:HasTags}</div></div>
  419. {/block:Posts}<div id="tags" st>
  420. {block:PostNotes}<div id="notes">{PostNotes}</div>{/block:PostNotes}
  421. {/block:Posts}</div></div></div>
  422. </div>
  423.  
  424.  
  425. <div id="cred"><a href="http://hrrys.tumblr.com"><img src="http://i.imgur.com/o7oww2G.png"></a></div>
  426. </body>
  427. </html>
Add Comment
Please, Sign In to add comment