Advertisement
imgirlrauhl

Theme #18 - Die for you (Version 2)

Mar 7th, 2014
1,897
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 27.40 KB | None | 0 0
  1. <!----------
  2.  
  3. Theme #18 "Die for you - Version 2" by Vanne @ themesbyvanne.tumblr.com
  4.  
  5. .Do NOT remove the credits
  6. .Do NOT steal my codes
  7. .Do NOT use as base code
  8. .Do NOT claim as your own
  9.  
  10. Thank you so much for using my theme! <3
  11.  
  12. ----------->
  13.  
  14. <html>
  15.  
  16. <head>
  17.  
  18. {block:IfCuteCursor}
  19. <style type="text/css">body, a:hover {cursor: url(http://cur.cursors-4u.net/cursors/cur-9/cur817.cur), progress !important;}</style><a href="http://www.cursors-4u.com/cursor/2011/11/10/small-grey-outline-pointer.html" target="_blank" title="Small Grey Outline Pointer"><img src="http://cur.cursors-4u.net/cursor.png" border="0" alt="Small Grey Outline Pointer" style="position:absolute; top: 0px; right: 0px;" /></a>
  20. {/block:IfCuteCursor}
  21.  
  22. {block:ifCrosshairCursor}
  23. <style type="text/css">body { cursor: crosshair; } </style>
  24. {/block:ifCrosshairCursor}
  25.  
  26. <title>{Title}{block:PostTitle} - {PostTitle}{/block:PostTitle}</title>
  27. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  28. <link rel="shortcut icon" href="{Favicon}">
  29. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  30.  
  31. <meta name="image:Top BG" content=""/>
  32. <meta name="image:Background" content=""/>
  33. <meta name="image:Sidebar Image" content="https://24.media.tumblr.com/af91dc47d72d30f55c6262fe7f111792/tumblr_n1iwcpS1KW1t0v4cmo1_400.png"/>
  34.  
  35. <meta name="color:Top BG" content="#b8dcde"/>
  36. <meta name="color:Top Border" content="#ffffff"/>
  37. <meta name="color:Sidebar Border" content="#7cbcbf"/>
  38. <meta name="color:Background" content="#f6f6f6"/>
  39.  
  40. <meta name="color:Title" content="#52a5ab"/>
  41. <meta name="color:Description Text" content="#757575"/>
  42.  
  43. <meta name="color:Navigation Links" content="#ffffff"/>
  44. <meta name="color:Navigation BG" content="#a2dadc"/>
  45. <meta name="color:Navigation BG Hover" content="#70bbc5"/>
  46. <meta name="color:Navigation Title" content="#53a7b3"/>
  47. <meta name="color:Navigation Title BG" content="#ffffff"/>
  48. <meta name="color:Navigation Title Border" content="#daedec"/>
  49.  
  50. <meta name="color:Custom Links Link" content="#ffffff"/>
  51. <meta name="color:Custom Links Link Hover" content="#34a5b0"/>
  52. <meta name="color:Custom Links BG" content="#83d2d2"/>
  53. <meta name="color:Custom Links BG Hover" content="#ffffff"/>
  54. <meta name="color:Custom Links Border" content="#bddedd"/>
  55.  
  56. <meta name="color:Link" content="#5acad3"/>
  57. <meta name="color:Link Hover" content="#0c969d"/>
  58. <meta name="color:Italic Text" content="#6abfae"/>
  59. <meta name="color:Bold Text" content="#70acca"/>
  60. <meta name="color:Highlight Text" content="#ffffff"/>
  61. <meta name="color:Highlight BG" content="#bfe6ec"/>
  62. <meta name="color:Blockquote Text" content="#abc9cc"/>
  63. <meta name="color:Blockquote Border" content="#59b2c1"/>
  64. <meta name="color:Entries BG" content="#ffffff"/>
  65. <meta name="color:Entries Text" content="#494949"/>
  66. <meta name="color:Entries Title" content="#55b6be"/>
  67. <meta name="color:Scrollbar" content="#afe2e4"/>
  68. <meta name="color:Scrollbar Bottom" content="#ffffff"/>
  69.  
  70. <meta name="color:Chat BG 1" content="#f7feff"/>
  71. <meta name="color:Chat Text 1" content="#5ebbbe"/>
  72. <meta name="color:Chat BG 2" content="#74bbc7"/>
  73. <meta name="color:Chat Text 2" content="#ffffff"/>
  74. <meta name="color:Audio Border" content="#b2dfed"/>
  75. <meta name="color:Asker BG" content="#53b4be"/>
  76. <meta name="color:Asker Name" content="#ffffff"/>
  77. <meta name="color:Ask Border" content="#8dacae"/>
  78. <meta name="color:Question BG" content="#f3ffff"/>
  79. <meta name="color:Music Player BG" content="#23a5ad"/>
  80.  
  81. <meta name="color:Permalink Links" content="#ffffff"/>
  82. <meta name="color:Permalink Links Hover" content="#65bcd1"/>
  83. <meta name="color:Permalink BG" content="#b7dbde"/>
  84. <meta name="color:Permalink BG Hover" content="#ffffff"/>
  85. <meta name="color:Pagination Text" content="#5fc0c7"/>
  86. <meta name="color:Pagination Text BG" content="#ebfdff"/>
  87. <meta name="color:Pagination Links" content="#ffffff"/>
  88. <meta name="color:Pagination Links BG" content="#5cc2cd"/>
  89. <meta name="color:Pagination Links BG Hover" content="#1c9ca6"/>
  90.  
  91. <meta name="if:Infinite Scroll" content="">
  92. <meta name="if:Black Music Player Icon" content="">
  93. <meta name="if:Show Captions" content="">
  94. <meta name="if:Show Tags" content="1">
  95. <meta name="if:Image Fade" content="">
  96. <meta name="if:Black And White Images" content="">
  97. <meta name="if:Back To Top" content="1"/>
  98. <meta name="if:Cute Cursor" content=""/>
  99. <meta name="if:Crosshair Cursor" content=""/>
  100.  
  101. <meta name="text:Sidebar Title" content="die for you">
  102. <meta name="text:Music Player" content="">
  103. <meta name="text:Facebook URL" content="urlexample1">
  104. <meta name="text:Twitter Username" content="username_example1">
  105. <meta name="text:Link 1" content="link 1">
  106. <meta name="text:Link 1 URL" content="">
  107. <meta name="text:Link 2" content="link 2">
  108. <meta name="text:Link 2 URL" content="">
  109. <meta name="text:Link 3" content="link 3">
  110. <meta name="text:Link 3 URL" content="">
  111. <meta name="text:Link 4" content="link 4">
  112. <meta name="text:Link 4 URL" content="">
  113. <meta name="text:Link 5" content="link 5">
  114. <meta name="text:Link 5 URL" content="">
  115. <meta name="text:Link 6" content="link 6">
  116. <meta name="text:Link 6 URL" content="">
  117. <meta name="text:Link 7" content="link 7">
  118. <meta name="text:Link 7 URL" content="">
  119. <meta name="text:Link 8" content="link 8">
  120. <meta name="text:Link 8 URL" content="">
  121. <meta name="text:Ask URL" content="/ask">
  122.  
  123. <script language="JavaScript" src="http://dl.dropbox.com/u/3173073/GothicDarkness/qTip.js" type="text/JavaScript"></script>
  124.  
  125. <style>
  126. div#qTip {
  127. margin-top: 3px;
  128. padding: 4px 8px 4px 8px;
  129. z-index: 99999;
  130. display: none;
  131. text-align: center;
  132. font-family: Courier New;
  133. position: absolute;
  134. font-style: italic;
  135. font-size: 9px;
  136. background: {color:Navigation Links};
  137. color: {color:Navigation BG};
  138. letter-spacing: 1px;
  139. }
  140. </style>
  141.  
  142. <style type="text/css">
  143.  
  144. @import url(http://weloveiconfonts.com/api/?family=typicons);
  145. /* typicons */
  146. [class*="typicons-"]:before {
  147. font-family: 'Typicons', sans-serif;
  148. }
  149.  
  150. iframe#tumblr_controls {
  151. right: 3px !important;
  152. position: fixed !important;
  153. opacity: 0.2;
  154. white-space: nowrap;
  155. -webkit-filter: invert(100%);
  156. -moz-filter: invert(100%);
  157. -o-filter: invert(100%);
  158. -ms-filter: invert(100%);
  159. filter: invert(100%);
  160. -webkit-transition: opacity 0.7s linear;
  161. -webkit-transition: all 0.5s ease-in-out;
  162. -moz-transition: all 0.5s ease-in-out;
  163. -o-transition: all 0.5s ease-in-out;
  164. transition: all 0.5s ease-in-out;}
  165. iframe#tumblr_controls:hover {
  166. opacity: 0.7;}
  167.  
  168. body {
  169. background: {color:Background} url('{image:Background}');
  170. background-attachment: fixed;
  171. font-family: Courier New;
  172. font-size: 11px;}
  173. ::-webkit-scrollbar-thumb:vertical {
  174. background: {color:Scrollbar};
  175. height: auto;}
  176. ::-webkit-scrollbar-thumb:horizontal {
  177. background: {color:Scrollbar};
  178. height: auto;}
  179. ::-webkit-scrollbar {
  180. height: 4px;
  181. width: 4px;
  182. background: {color:Scrollbar Bottom};}
  183. ::selection {
  184. color: {color:Highlight Text};
  185. background: {color:Highlight BG};}
  186. blockquote {
  187. margin-left: 0px;
  188. margin-right: 0px;
  189. padding-left: 5px;
  190. font-style: italic;
  191. color: {color:Blockquote Text};
  192. border-left: 3px solid {color:Blockquote Border};}
  193. a {
  194. text-decoration: none;
  195. color: {color:Link};}
  196. a:hover {
  197. color: {color:Link Hover};
  198. text-decoration: none;}
  199. b, strong {
  200. color: {color:Bold Text};
  201. font-weight: 700;}
  202. i, em {
  203. color: {color:Italic Text};
  204. font-weight: 400italic;}
  205.  
  206. /* TOP */
  207. #top {
  208. position: fixed;
  209. z-index: 9999999999999;
  210. top: 0px;
  211. left: 0px;
  212. width: 100%;
  213. height: 50px;
  214. background: {color:Top BG} url('{image:Top BG}');
  215. border-bottom: 2px solid {color:Top Border};
  216. }
  217.  
  218. /* SIDEBAR, LINKS, ETC */
  219. #leftnav {
  220. position: fixed;
  221. margin-top: 80px;
  222. margin-left: 0px;
  223. width: 255px;
  224. }
  225.  
  226. #title {
  227. z-index: 99999;
  228. position: relative;
  229. margin-top: 0px;
  230. margin-left:0px;
  231. margin-bottom: 5px;
  232. font-size: 16px;
  233. text-transform: uppercase;
  234. text-align: center;
  235. font-family: Courier New;
  236. color: {color:Title};
  237. width: 255px;
  238. }
  239.  
  240. #sidebar {
  241. position: relative;
  242. overflow: hidden;
  243. margin-left: 0px;
  244. margin-top: 0px;
  245. background: {color:Sidebar Border};
  246. }
  247.  
  248. #sidebar img {
  249. padding: 10px 10px 7px 10px;
  250. width: 235px;
  251. }
  252.  
  253. #description {
  254. margin-top: 150px;
  255. margin-left: 0px;
  256. width: 235px;
  257. max-height: 80px;
  258. opacity: 0;
  259. font-family: Consolas;
  260. padding: 10px;
  261. font-size: 10px;
  262. text-align: left;
  263. position: relative;
  264. overflow: auto;
  265. color: {color:Description Text};
  266. -webkit-transition: all 0.5s ease-in-out;
  267. -moz-transition: all 0.5s ease-in-out;
  268. -o-transition: all 0.5s ease-in-out;
  269. -ms-transition: all 0.5s ease-in-out;
  270. transition: all 0.5s ease-in-out;
  271. }
  272.  
  273. #leftnav:hover #description {
  274. margin-top: 170px;
  275. opacity: 1;
  276. }
  277.  
  278. #nav {
  279. position: relative;
  280. float:left;
  281. margin-top: 0px;
  282. margin-left: 0px;
  283. z-index: 99999;
  284. text-align: center;
  285. width: 255px;
  286. background: {color:Navigation BG};
  287. }
  288.  
  289. #nav a {
  290. z-index: 99999;
  291. margin: 0px 7px 0px 7px;
  292. position: relative;
  293. display: inline-block;
  294. text-align: center;
  295. text-transform: uppercase;
  296. letter-spacing: 1px;
  297. font-size: 15px;
  298. width: 16px;
  299. height: 16px;
  300. padding:4px;
  301. color: {color:Navigation Links};
  302. -webkit-transition: all .7s ease;
  303. -moz-transition: all .7s ease;
  304. -o-transition: all .7s ease;
  305. transition: all .7s ease;
  306. }
  307.  
  308. #nav a:hover {
  309. background: {color:Navigation BG Hover};
  310. }
  311.  
  312. .navti {
  313. position: absolute;
  314. margin-top: 1px;
  315. margin-left: 0px;
  316. font-size: 11px;
  317. line-height: 15px;
  318. width: 12px;
  319. padding: 10px 2px 10px 2px;
  320. text-align: center;
  321. font-family: Courier New;
  322. text-transform: uppercase;
  323. background: {color:Navigation Title BG};
  324. color: {color:Navigation Title};
  325. -webkit-transition: all .4s ease;
  326. -moz-transition: all .4s ease;
  327. -o-transition: all .4s ease;
  328. transition: all .4s ease;
  329. }
  330.  
  331. #nav a:hover .navti {
  332. padding: 20px 2px 20px 2px;
  333. border-bottom: 3px solid {color:Navigation Title Border};
  334. }
  335.  
  336. #rightnav {
  337. position: fixed;
  338. margin-top: 100px;
  339. margin-left: 900px;
  340. width: 92px;
  341. }
  342.  
  343. #favicon {
  344. position: relative;
  345. margin-left: 0px;
  346. margin-top: 0px;
  347. background: {color:Sidebar Border};}
  348. #favicon img {
  349. padding: 6px 6px 4px 6px;
  350. width: 80px;}
  351. #custom {
  352. position: relative;
  353. margin-top: 10px;
  354. margin-left: 0px;
  355. z-index: 99999;
  356. text-align: center;
  357. width: 92px;}
  358. #custom a {
  359. z-index: 99999;
  360. margin-bottom: 5px;
  361. position: relative;
  362. display: block;
  363. text-align: center;
  364. text-transform: uppercase;
  365. letter-spacing: 1px;
  366. font-size: 10px;
  367. font-family: Consolas;
  368. width: 92px;
  369. padding:4px 0px 4px 0px;
  370. background: {color:Custom Links BG};
  371. color: {color:Custom Links Link};
  372. -webkit-transition: all .7s ease;
  373. -moz-transition: all .7s ease;
  374. -o-transition: all .7s ease;
  375. transition: all .7s ease;}
  376. #custom a:hover {
  377. background: {color:Custom Links BG Hover};
  378. color: {color:Custom Links Link Hover};
  379. border-bottom: 2px solid {color:Custom Links Border};}
  380.  
  381. #musicc {
  382. bottom: 24px;
  383. left: 0px;
  384. position: absolute;
  385. display: block;
  386. overflow: hidden;
  387. text-align: center;
  388. font-size: 12px;
  389. letter-spacing: 1px;
  390. padding: 2px;
  391. width: 25px;
  392. height: 25px;
  393. border-top-right-radius: 7px;
  394. background: {color:Music Player BG};
  395. -webkit-transition: all .7s ease;
  396. -moz-transition: all .7s ease;
  397. -o-transition: all .7s ease;
  398. transition: all .7s ease;
  399. }
  400.  
  401. #musicc img{width: 15px;}
  402.  
  403. .iconn {
  404. width: 20px;
  405. padding: 4px 2px 2px 2px;
  406. -webkit-transition: all 0.5s ease-in-out;
  407. -moz-transition: all 0.5s ease-in-out;
  408. -o-transition: all 0.5s ease-in-out;
  409. -ms-transition: all 0.5s ease-in-out;
  410. transition: all 0.5s ease-in-out;
  411. }
  412.  
  413. .playerr {
  414. margin-left: 10px;
  415. margin-top: -21px;
  416. opacity: 0;
  417. width: 26px;
  418. padding: 1px 9px 10px 9px;
  419. overflow: hidden;
  420. -webkit-transition: all 0.5s ease-in-out;
  421. -moz-transition: all 0.5s ease-in-out;
  422. -o-transition: all 0.5s ease-in-out;
  423. -ms-transition: all 0.5s ease-in-out;
  424. transition: all 0.5s ease-in-out;
  425. }
  426.  
  427. #musicc:hover .iconn {margin-left: -27px; opacity: 0;}
  428. #musicc:hover .playerr {margin-left: -26px; opacity: 1;}
  429.  
  430. #pagination {
  431. z-index: 9999999;
  432. position: relative;
  433. padding: 2px;
  434. margin-top: 5px;
  435. margin-left: -5px;
  436. width: 100px;
  437. text-align: center;
  438. }
  439.  
  440. #pagination a {
  441. display: inline;
  442. font-size: 9px;
  443. padding: 3px;
  444. margin: 0px 2px 0px 2px;
  445. text-transform: uppercase;
  446. text-align: center;
  447. letter-spacing: 1px;
  448. font-family: Consolas;
  449. color: {color:Pagination Links};
  450. background: {color:Pagination Links BG};
  451. -webkit-transition: all .7s ease;
  452. -moz-transition: all .7s ease;
  453. -o-transition: all .7s ease;
  454. transition: all .7s ease;
  455. {block:IfInfiniteScroll}
  456. display: none;
  457. {block:IfInfiniteScroll}
  458. {block:IfNotInfiniteScroll}
  459. display: visible;
  460. {/block:IfNotInfiniteScroll}
  461. }
  462.  
  463. #pagination a:hover {
  464. background: {color:Pagination Links BG Hover};
  465. }
  466.  
  467. span.selectedpage {
  468. color: {color:Pagination Text};
  469. background: {color:Pagination Text BG};
  470. font-size: 9px;
  471. margin: 0px 2px 0px 2px;
  472. padding: 3px;
  473. text-transform: uppercase;
  474. text-align: center;
  475. letter-spacing: 1px;
  476. font-family: Consolas;
  477. }
  478.  
  479.  
  480.  
  481.  
  482.  
  483.  
  484. /* POSTS */
  485.  
  486. #all {
  487. position:relative;
  488. top:0px;
  489. margin:0 auto;
  490. padding:5px;
  491. width:1000px;
  492. }
  493.  
  494. #container {
  495. margin-top: 80px;
  496. margin-bottom: 30px;
  497. margin-left: 290px;
  498. width: 600px;
  499. }
  500.  
  501. .entry {
  502. float:left;
  503. z-index: 9999;
  504. position: relative;
  505. padding: 10px 10px 7px 10px;
  506. text-align: left;
  507. color: {color:Entries Text};
  508. background: {color:Entries BG};
  509. transition: 0.6s;
  510. -moz-transition: 0.6s;
  511. -webkit-transition: 0.6s;
  512. -o-transition: 0.6s;
  513. width: 250px;
  514. margin: 10px;
  515. }
  516.  
  517. .entry img {
  518. max-width: 100%;
  519. }
  520.  
  521. #entrytitle {
  522. z-index: 99999;
  523. text-align: center;
  524. text-transform: uppercase;
  525. font-size: 22px;
  526. line-height: 22px;
  527. font-family: Courier New;
  528. color: {color:Entries Title};
  529. }
  530.  
  531. /*ASK*/
  532. #asker {
  533. background: {color:Asker BG};
  534. border-bottom: 2px solid {color:Ask Border};
  535. color: {color:Asker Name};
  536. font-family: Consolas;
  537. font-size: 10px;
  538. padding: 4px;
  539. text-align: center;
  540. text-transform: uppercase;
  541. }
  542.  
  543. #asker a {
  544. color: {color:Asker Name};
  545. }
  546.  
  547. #ask {
  548. background: {color:Question BG};
  549. padding: 5px 7px 5px 7px;
  550. line-height: 12px;
  551. font-style: italic;
  552. font-size: 10px;
  553. font-family: Consolas;
  554. }
  555.  
  556. #answer {
  557. padding: 10px 5px 0px 5px;
  558. font-size: 12px;
  559. }
  560.  
  561. {block:IfImageFade}
  562. .photo {
  563. opacity: .7;
  564. -webkit-transition: all 0.5s ease-in-out;
  565. -moz-transition: all 0.5s ease-in-out;
  566. -o-transition: all 0.5s ease-in-out;
  567. -ms-transition: all 0.5s ease-in-out;
  568. transition: all 0.5s ease-in-out;
  569. }
  570.  
  571. .photo:hover {
  572. opacity: 1;
  573. }
  574.  
  575. .entry img {
  576. opacity: .7;
  577. -webkit-transition: all 0.5s ease-in-out;
  578. -moz-transition: all 0.5s ease-in-out;
  579. -o-transition: all 0.5s ease-in-out;
  580. -ms-transition: all 0.5s ease-in-out;
  581. transition: all 0.5s ease-in-out;
  582. }
  583.  
  584. .entry img:hover {
  585. opacity: 1;
  586. }
  587. {/block:IfImageFade}
  588.  
  589. {block:IfBlackAndWhiteImages}
  590. .entry img{
  591. -webkit-transition: opacity 0.8s linear;
  592. -webkit-filter:grayscale(100%);
  593. -webkit-transition: all 0.5s ease-in-out;
  594. -moz-transition: all 0.5s ease-in-out;
  595. -o-transition: all 0.5s ease-in-out;
  596. -ms-transition: all 0.5s ease-in-out;
  597. transition: all 0.5s ease-in-out;
  598. }
  599.  
  600. .entry img:hover{
  601. -webkit-transition: opacity 0.8s linear;
  602. -webkit-filter:none;
  603. -webkit-transition: all 0.5s ease-in-out;
  604. -moz-transition: all 0.5s ease-in-out;
  605. -o-transition: all 0.5s ease-in-out;
  606. -ms-transition: all 0.5s ease-in-out;
  607. transition: all 0.5s ease-in-out;
  608. }
  609. {/block:IfBlackAndWhiteImages}
  610.  
  611. #audio img {
  612. float: left;
  613. margin-right: 10px;
  614. border: 7px solid {color:Audio Border};
  615. width: 40px;
  616. }
  617.  
  618. #player {
  619. overflow: hidden;
  620. position: relative;
  621. opacity: .4;
  622. margin-left: 10px;
  623. margin-top: 13px;
  624. margin-bottom: 18px;
  625. }
  626.  
  627. #player:hover {
  628. opacity: .8;
  629. }
  630.  
  631. .top {
  632. position: fixed;
  633. z-index: 999;
  634. }
  635.  
  636. .top a {
  637. font-size: 9px;
  638. text-align: center;
  639. font-family: Consolas;
  640. text-transform: uppercase;
  641. letter-spacing: 1px;
  642. padding: 6px;
  643. background: {color:Custom Links BG};
  644. color: {color:Custom Links Link};
  645. -webkit-transition:all .5s ease;
  646. -moz-transition:all .5s ease;
  647. transition:all .5s ease;
  648. -o-transition:all .5s ease;
  649. }
  650.  
  651. .top a:hover {
  652. background: {color:Custom Links BG Hover};
  653. color: {color:Custom Links Link Hover};
  654. }
  655.  
  656. #scrollToTop:link, #scrollToTop:visited {
  657. z-index: 9999;
  658. display: none;
  659. position: fixed;
  660. bottom: 15px;
  661. right: 15px;
  662. }
  663.  
  664. .chat {
  665. margin: 0;
  666. }
  667.  
  668. .chat .chat1 {
  669. margin-left: 0px;
  670. }
  671.  
  672. .chat .chat1 .chat2 {
  673. background: {color:Chat BG 1};
  674. color: {color:Chat Text 1};
  675. margin-bottom: 2px;
  676. padding: 4px 4px 5px 5px;
  677. }
  678.  
  679. .chat .chat1 .chat2.even {
  680. background: {color:Chat BG 2};
  681. color: {color:Chat Text 2};
  682. }
  683.  
  684. #permalink {
  685. margin-left: 0px;
  686. margin-top: 0px;
  687. width: 250px;
  688. padding: 0px;
  689. text-align: center;
  690. position: relative;
  691. color: {color:Permalink Links};
  692. background: {color:Permalink BG};
  693. -webkit-transition: all 0.5s ease-in-out;
  694. -moz-transition: all 0.5s ease-in-out;
  695. -o-transition: all 0.5s ease-in-out;
  696. -ms-transition: all 0.5s ease-in-out;
  697. transition: all 0.5s ease-in-out;
  698. }
  699.  
  700. #permalink a {
  701. font-family: consolas;
  702. font-size: 10px;
  703. margin-right: 0px;
  704. text-transform: uppercase;
  705. padding: 4px;
  706. color: {color:Permalink Links};
  707. -webkit-transition:all .5s ease;
  708. -moz-transition:all .5s ease;
  709. transition:all .5s ease;
  710. -o-transition:all .5s ease;
  711. }
  712.  
  713. #permalink a:hover {
  714. letter-spacing: 1px;
  715. background: {color:Permalink BG Hover};
  716. border-right: 2px solid {color:Permalink Links Hover};
  717. border-left: 2px solid {color:Permalink Links Hover};
  718. color: {color:Permalink Links Hover};
  719. -webkit-transition:all .5s ease;
  720. -moz-transition:all .5s ease;
  721. transition:all .5s ease;
  722. -o-transition:all .5s ease;
  723. }
  724.  
  725. #tags {
  726. margin-left: 0px;
  727. margin-top: 0px;
  728. opacity: 0;
  729. width: 400px;
  730. padding: 0px;
  731. font-size: 9px;
  732. font-family: Consolas;
  733. text-transform: uppercase;
  734. text-align: center;
  735. position: absolute;
  736. -webkit-transition:all .5s ease;
  737. -moz-transition:all .5s ease;
  738. transition:all .5s ease;
  739. -o-transition:all .5s ease;
  740. }
  741.  
  742. .entry:hover #tags {
  743. opacity: 1;
  744. margin-top: 9px;
  745. }
  746.  
  747. #capp {
  748. margin-top: 10px;
  749. font-size: 12px;
  750. background: {color:Question BG};
  751. padding: 10px;
  752. }
  753.  
  754. ol.notes {
  755. margin-top: 10px;
  756. margin-left: -25px;
  757. padding-bottom: 5px;
  758. text-transform: uppercase;
  759. font-size: 9px;
  760. font-family: Consolas;
  761. text-align: left;
  762. list-style-type: none;
  763. }
  764.  
  765. </style>
  766.  
  767.  
  768. {block:IfBackToTop}
  769. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
  770. <script src="http://static.tumblr.com/ikeq9mi/DfYl6o46t/scrolltotop.min.js"></script>
  771.  
  772. <div class="top">
  773. <a href="javascript:;" id="scrollToTop">top ↑</a>
  774. </div>
  775. {/block:IfBackToTop}
  776.  
  777. <script src="//ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
  778.  
  779. {block:IfInfiniteScroll}
  780. <div id="pagination"><a href="/page/2"></a></div>
  781. <script src="http://static.tumblr.com/6hsqxdt/vmwm2rb4g/infinitescrolling.js"></script>
  782. {/block:IfInfiniteScroll}
  783.  
  784. <script src="http://static.tumblr.com/6hsqxdt/QBym35odk/jquery.masonry.js"></script>
  785.  
  786. <script>
  787. $(function(){
  788. var $container = $('#container');
  789. $container.imagesLoaded(function(){
  790. $container.masonry({
  791. itemSelector: '.entry',
  792. });
  793. });
  794. $container.infinitescroll({
  795. itemSelector : ".entry",
  796. navSelector : "#pagination",
  797. nextSelector : "#pagination a",
  798. loadingImg : "http://media.tumblr.com/ec1742dbca16ca94b47814f1de4e37e6/tumblr_inline_mj8pf7Te3l1qz4rgp.png",
  799. loadingText : "<em></em>",
  800. bufferPx : 10000,
  801. extraScrollPx: 12000,
  802. },
  803. // trigger Masonry as a callback
  804. function( newElements ) {
  805. var $newElems = $( newElements ).css({ opacity: 0 });
  806. // ensure that images load before adding to masonry layout
  807. $newElems.imagesLoaded(function(){
  808. $newElems.animate({ opacity: 1 });
  809. $container.masonry( 'appended', $newElems, true );
  810. });
  811. }
  812. );
  813. });
  814. </script>
  815.  
  816. </head>
  817.  
  818.  
  819. <body>
  820.  
  821.  
  822. <div id="top"></div>
  823.  
  824.  
  825. <div id="all">
  826.  
  827.  
  828. <div id="leftnav">
  829.  
  830. <div id="title">{text:Sidebar Title}</div>
  831.  
  832. <div id="sidebar">
  833. <div id="sidebar img"><img src="{image:Sidebar Image}"></div>
  834. </div>
  835.  
  836. <div id="nav">
  837. <a href="/"><span class="typicons-home"></span><div class="navti">h<br>o<br>m<br>e</div></a>
  838. <a href="{text:Ask URL}"><span class="typicons-mail"></span><div class="navti">m<br>e<br>s<br>s<br>a<br>g<br>e</div></a>
  839. <a href="/archive"><span class="typicons-edit"></span><div class="navti">p<br>a<br>s<br>t</div></a>
  840. <a href="http://themesbyvanne.tumblr.com"><span class="typicons-star"></span><div class="navti">t<br>h<br>e<br>m<br>e</div></a>
  841.  
  842. {block:IfMusicPlayer}
  843. <div id="musicc">
  844. <div class="iconn">
  845. {block:IfNotBlackMusicPlayerIcon}
  846. <img src="http://static.tumblr.com/n9vj50j/cxEn20wqg/12.gif">
  847. {/block:IfNotBlackMusicPlayerIcon}
  848. {block:IfBlackMusicPlayerIcon}
  849. <img src="http://static.tumblr.com/n9vj50j/v2On20wly/04.gif">
  850. {/block:IfBlackMusicPlayerIcon}
  851. </div>
  852. <div class="playerr">
  853. {text:Music Player}
  854. </div>
  855. </div>
  856. {/block:IfMusicPlayer}
  857. </div>
  858.  
  859. <div id="description">{Description}</div>
  860.  
  861. </div>
  862.  
  863.  
  864. <div id="rightnav">
  865. <div id="favicon">
  866. <div id="favicon img"><img src="{Favicon}"></div>
  867. </div>
  868. <div id="custom">
  869. {block:ifFacebookURL}<a href="http://facebook.com/{text:Facebook URL}">Facebook</a>{/block:ifFacebookURL}
  870. {block:ifTwitterUsername}<a href="http://twitter.com/{text:Twitter Username}">Twitter</a>{/block:ifTwitterUsername}
  871. {block:iflink1}<a href="{text:Link 1 URL}">{text:Link 1}</a>{/block:iflink1}
  872. {block:iflink2}<a href="{text:Link 2 URL}">{text:Link 2}</a>{/block:iflink2}
  873. {block:iflink3}<a href="{text:Link 3 URL}">{text:Link 3}</a>{/block:iflink3}
  874. {block:iflink4}<a href="{text:Link 4 URL}">{text:Link 4}</a>{/block:iflink4}
  875. {block:iflink5}<a href="{text:Link 5 URL}">{text:Link 5}</a>{/block:iflink5}
  876. {block:iflink6}<a href="{text:Link 6 URL}">{text:Link 6}</a>{/block:iflink6}
  877. {block:iflink7}<a href="{text:Link 7 URL}">{text:Link 7}</a>{/block:iflink7}
  878. {block:iflink8}<a href="{text:Link 8 URL}">{text:Link 8}</a>{/block:iflink8}
  879. </div>
  880. {block:Pagination}
  881. <div id="pagination">
  882. {block:PreviousPage}
  883. <a href="{PreviousPage}">BACK</a>
  884. {/block:PreviousPage}
  885. {block:NextPage}
  886. <a href="{NextPage}">NEXT</a>
  887. {/block:NextPage}
  888. </div>
  889. {/block:Pagination}
  890. </div>
  891.  
  892.  
  893. <div id="container">
  894. {block:Posts}
  895. <div class="entry">
  896.  
  897. {block:Photo}
  898. <img class="photo" src="{PhotoURL-400}">
  899. {block:IfShowCaptions}{block:Caption}<div id="capp">{Caption}</div>{/block:Caption}{/block:IfShowCaptions}
  900. {/block:Photo}
  901.  
  902. {block:Photoset}
  903. {block:IndexPage}
  904. {Photoset-250}
  905. {block:IfShowCaptions}{block:Caption}<div id="capp">{Caption}</div>{/block:Caption}{/block:IfShowCaptions}
  906. {/block:IndexPage}
  907. {block:PermalinkPage}{Photoset-400}{/block:PermalinkPage}
  908. {/block:Photoset}
  909.  
  910. {block:Video}
  911. {block:IndexPage}
  912. {Video-250}
  913. {block:IfShowCaptions}{block:Caption}<div id="capp">{Caption}</div>{/block:Caption}{/block:IfShowCaptions}
  914. {/block:IndexPage}
  915. {block:PermalinkPage}
  916. {Video-400}
  917. {/block:PermalinkPage}
  918. {/block:Video}
  919.  
  920. {block:Text}
  921. {block:Title}<div id="entrytitle">{Title}</div>{/block:Title}
  922. {Body}
  923. {/block:Text}
  924.  
  925. {block:Audio}
  926. {block:AlbumArt}
  927. <div id="audio"><img src="{AlbumArtURL}" alt=""></div>
  928. {/block:AlbumArt}
  929. <div id="player">{AudioPlayerGrey}</div><div style="margin-top: 0px;"></div>
  930. {block:Artist}
  931. <b>Artist:</b> <i>{Artist}</i>
  932. {/block:Artist} <br />
  933. {block:Album}
  934. <b>Album:</b> <i>{Album}</i>
  935. {/block:Album}<br />
  936. {block:TrackName}
  937. <b>Track:</b> <i>{TrackName}</i>
  938. {/block:TrackName}<br />
  939. <b>Plays:</b> <i>{FormattedPlayCount}</i>
  940. {block:IndexPage}
  941. {block:IfShowCaptions}{block:Caption}<div id="capp">{Caption}</div>{/block:Caption}{/block:IfShowCaptions}
  942. {/block:IndexPage}
  943. {/block:Audio}
  944.  
  945. {block:Quote}
  946. <div style="color: {color:Blockquote Text}; font-style: italic;">"{Quote}"</div>
  947. <div style="text-align: center; font-size: 9px; font-style: italic; padding-top: 3px; padding-bottom: 4px;">—{Source}</div>
  948. {/block:Quote}
  949.  
  950. {block:Link}
  951. <div id="entrytitle"><a href="{URL}" {Target}>{Name}</a></div>
  952. {Description}
  953. {/block:Link}
  954.  
  955. {block:Chat}
  956. {block:Title}<div id="entrytitle">{Title}</div>{/block:Title}
  957. <div class="chat">
  958. <div class="chat1">
  959. {block:Lines}
  960. <div class="chat2 {Alt}">
  961. {block:Label}
  962. {Label}
  963. {/block:Label}
  964. {Line} </div>
  965. {/block:Lines}
  966. </div>
  967. </div>
  968. {block:IfShowCaptions}{block:Caption}{Caption}{/block:Caption}{/block:IfShowCaptions}
  969. {/block:Chat}
  970.  
  971. {block:Answer}
  972. <div id="asker">{Asker}:</div>
  973. <div id="ask">{Question}</div>
  974. <div id="answer"{Answer}</div>
  975. {/block:Answer}
  976.  
  977.  
  978.  
  979. <!--- perma ---> {block:IndexPage}
  980. <div id="permalink">
  981. <a href="{permalink}">{timeago}</a> •
  982. <a href="{permalink}">{NoteCountWithLabel}</a> •
  983. <a href="{reblogurl}" target="_blank">reblog</a>
  984. </div>
  985.  
  986. <div id="tags">
  987. {block:HasTags}
  988. {block:Tags}
  989. <a href="{TagURL}">#{Tag}</a>
  990. {block:Tags}
  991. {/block:HasTags}
  992. </div>
  993. <!--- /perma ---> {/block:IndexPage}
  994.  
  995.  
  996.  
  997. <!-- permalink page --> {block:PermalinkPage}
  998.  
  999. {block:Caption}{Caption}{/block:Caption}
  1000.  
  1001. {block:Date}<b>❯</b> <font style="color: {color:Italic Text};">Posted on</font> {DayOfMonth}{DayOfMonthSuffix} {ShortMonth} {Year} <font style="color: {color:Italic Text};">at</font> {12Hour}:{Minutes}{AmPm}{/block:Date} {block:NoteCount} <font style="color: {color:Italic Text};">with</font> {NoteCountWithLabel}{/block:NoteCount}
  1002.  
  1003. {block:RebloggedFrom}<br><b>❯</b> <font style="color: {color:Italic Text};">Reblogged From</font> <a href="{ReblogRootURL}">{ReblogRootName}</a>{/block:RebloggedFrom}
  1004.  
  1005. {block:HasTags}<br><b>❯</b> <font style="color: {color:Italic Text};">Tagged as</font> {block:Tags}<a href="{TagURL}">#{Tag}</a> {/block:Tags}{block:HasTags}
  1006.  
  1007. {block:PostNotes}{PostNotes}{/block:PostNotes}
  1008.  
  1009. <!-- /permalink page --> {/block:PermalinkPage}
  1010.  
  1011.  
  1012.  
  1013. </div> <!-- /div posts -->
  1014. {/block:Posts}
  1015. </div> <!-- /div container -->
  1016. </div> <!-- /div all -->
  1017.  
  1018.  
  1019. </body>
  1020.  
  1021. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement