Advertisement
imgirlrauhl

Theme #20 - Everdeen

May 17th, 2014
1,073
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 31.32 KB | None | 0 0
  1. <!----------
  2.  
  3. Theme #20 "Everdeen - Version 1" by Vanne @ vitanica.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. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  15.  
  16. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  17. <head>
  18.  
  19. {block:IfCuteCursor}
  20. <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>
  21. {/block:IfCuteCursor}
  22.  
  23. {block:ifCrosshairCursor}
  24. <style type="text/css">body { cursor: crosshair; } </style>
  25. {/block:ifCrosshairCursor}
  26.  
  27. <title>{Title}{block:PostTitle} - {PostTitle}{/block:PostTitle}</title>
  28. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  29. <link rel="shortcut icon" href="{Favicon}">
  30. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  31.  
  32. <link href='http://fonts.googleapis.com/css?family=Noto+Sans:400,700,400italic' rel='stylesheet' type='text/css'>
  33.  
  34. <link href='http://fonts.googleapis.com/css?family=Josefin+Sans' rel='stylesheet' type='text/css'>
  35.  
  36. <meta name="image:Background" content=""/>
  37. <meta name="image:TopAndBottom BG" content=""/>
  38. <meta name="image:Sidebar" content="http://static.tumblr.com/n9vj50j/fUPn5mkjh/captura_de_pantalla_2014-05-15_a_las_11.59.00.png"/>
  39.  
  40. <meta name="color:Background" content="#f8f8f8"/>
  41. <meta name="color:Title" content="#ffffff"/>
  42. <meta name="color:TopAndBottom BG" content="#2b2b2b"/>
  43. <meta name="color:Description Text" content="#e7e7e7"/>
  44. <meta name="color:Description Italic" content="#ce5889"/>
  45. <meta name="color:Description Bold" content="#ff7bb2"/>
  46. <meta name="color:Description Link" content="#7af6ff"/>
  47. <meta name="color:Description Link Hover" content="#a2a2a2"/>
  48. <meta name="color:Main Nav Links" content="#ffffff"/>
  49. <meta name="color:Main Nav Links Shadow" content="#444444"/>
  50. <meta name="color:Main Nav BG" content="#ff8eb0"/>
  51.  
  52. <meta name="color:Custom Links BG" content="#737373"/>
  53. <meta name="color:Custom Links BG Hover" content="#ff6f9a"/>
  54. <meta name="color:Custom Links Link" content="#ffffff"/>
  55. <meta name="color:Custom Links Link Hover" content="#ffffff"/>
  56.  
  57. <meta name="color:Entries BG" content="#fff"/>
  58. <meta name="color:Entries Border" content="#e5e5e5"/>
  59. <meta name="color:Entries Text" content="#414141"/>
  60. <meta name="color:Entries Title" content="#ff64a5"/>
  61. <meta name="color:Entries Title Border" content="#606060"/>
  62. <meta name="color:Entries Title Link" content="#60d2f5"/>
  63. <meta name="color:Entries Title Link Hover" content="#9f9f9f"/>
  64.  
  65. <meta name="color:Blockquote Border" content="#e6e6e6">
  66. <meta name="color:Blockquote BG" content="#f3f3f3">
  67. <meta name="color:Scrollbar" content="#ff76a9">
  68. <meta name="color:Scrollbar Bottom" content="#333333">
  69. <meta name="color:Link" content="#60daff">
  70. <meta name="color:Link Hover" content="#9a9a9a">
  71. <meta name="color:Italic Text" content="#dc84b9">
  72. <meta name="color:Bold Text" content="#ff64aa">
  73. <meta name="color:Highlight BG" content="#e5e5e5"/>
  74. <meta name="color:Tooltip Text" content="#ffffff"/>
  75. <meta name="color:Tooltip BG" content="#4f4f4f"/>
  76.  
  77. <meta name="color:Permalink Icons Color" content="#ffffff">
  78. <meta name="color:Permalink BG" content="#ff5b8d">
  79.  
  80. <meta name="color:Ask BG" content="#f7f7f7"/>
  81. <meta name="color:Ask Border" content="#e2e2e2"/>
  82. <meta name="color:Music Border" content="#656565"/>
  83. <meta name="color:Music Text" content="#5a5a5a"/>
  84. <meta name="color:Music Bold Text" content="#ff7ba7"/>
  85.  
  86. <meta name="if:Search Box" content="1">
  87. <meta name="if:Infinite Scroll" content="">
  88. <meta name="if:Show Captions" content="1">
  89. <meta name="if:Show Tags" content="1">
  90. <meta name="if:Image Fade" content="">
  91. <meta name="if:Black And White Images" content="">
  92. <meta name="if:Back To Top" content="1"/>
  93. <meta name="if:Cute Cursor" content=""/>
  94. <meta name="if:Crosshair Cursor" content=""/>
  95.  
  96. <meta name="text:Sidebar Quote" content="Here goes your quote, try to keep it short.">
  97. <meta name="text:Music Player" content="">
  98. <meta name="text:Link 1" content="link 1">
  99. <meta name="text:Link 1 URL" content="">
  100. <meta name="text:Link 2" content="link 2">
  101. <meta name="text:Link 2 URL" content="">
  102. <meta name="text:Link 3" content="link 3">
  103. <meta name="text:Link 3 URL" content="">
  104. <meta name="text:Link 4" content="link 4">
  105. <meta name="text:Link 4 URL" content="">
  106.  
  107. <style type="text/css">
  108.  
  109. @import url(http://weloveiconfonts.com/api/?family=entypo);
  110.  
  111. /* entypo */
  112. [class*="entypo-"]:before {
  113. font-family: 'entypo', sans-serif;
  114. }
  115.  
  116. iframe#tumblr_controls {
  117. right: 3px !important;
  118. position: fixed !important;
  119. opacity: 0.2;
  120. white-space: nowrap;
  121. -webkit-filter: invert(100%);
  122. -moz-filter: invert(100%);
  123. -o-filter: invert(100%);
  124. -ms-filter: invert(100%);
  125. filter: invert(100%);
  126. -webkit-transition: opacity 0.7s linear;
  127. -webkit-transition: all 0.5s ease-in-out;
  128. -moz-transition: all 0.5s ease-in-out;
  129. -o-transition: all 0.5s ease-in-out;
  130. transition: all 0.5s ease-in-out;}
  131.  
  132. iframe#tumblr_controls:hover {
  133. opacity: 0.7;}
  134.  
  135. body {
  136. font-size: 11px;
  137. color: {color:Entries Text};
  138. background: {color:Background} url('{image:Background}');
  139. background-attachment: fixed;
  140. font-family: Consolas;
  141. word-wrap: break-word;}
  142.  
  143. ::-webkit-scrollbar-thumb:vertical {
  144. background: {color:Scrollbar};
  145. height: auto;}
  146.  
  147. ::-webkit-scrollbar-thumb:horizontal {
  148. background: {color:Scrollbar};
  149. height: auto;}
  150.  
  151. ::-webkit-scrollbar {
  152. height: 5px;
  153. width: 5px;
  154. background: {color:Scrollbar Bottom};}
  155.  
  156.  
  157. blockquote {
  158. margin: 0px;
  159. padding: 2px 7px 2px 7px;
  160. background: {color:Blockquote BG};
  161. border-left: 3px solid {color:Blockquote Border};}
  162.  
  163. ::selection {
  164. background: {color:Highlight BG};}
  165.  
  166. a {
  167. color: {color:Link};
  168. text-decoration: none;
  169. -webkit-transition: all .4s ease;
  170. -moz-transition: all .4s ease;
  171. -o-transition: all .4s ease;
  172. transition: all .4s ease;}
  173. a:hover {
  174. color: {color:Link Hover};
  175. text-decoration: none;}
  176.  
  177. b, strong {
  178. font-weight: 700;
  179. color: {color:Bold Text};
  180. letter-spacing: 0px;
  181. word-spacing: 2px;}
  182.  
  183. i, em {
  184. font-weight: 400italic;
  185. letter-spacing: 0px;
  186. word-spacing: 2px;
  187. color: {color:Italic Text};}
  188.  
  189. pre {
  190. padding: 10px;
  191. background: {color:Ask BG};}
  192.  
  193. #all {
  194. position: relative;
  195. top: 0px;
  196. margin: 0 auto;
  197. padding: 5px;
  198. width: 750px;}
  199.  
  200. #top {
  201. z-index: 9;
  202. position: fixed;
  203. top: 0px;
  204. left: 0px;
  205. width: 100%;
  206. height: 40px;
  207. background: {color:TopAndBottom BG} url('{image:TopAndBottom BG}');}
  208.  
  209. #bottom {
  210. z-index: 9;
  211. position: fixed;
  212. bottom: 0px;
  213. left: 0px;
  214. width: 100%;
  215. height: 40px;
  216. background: {color:TopAndBottom BG} url('{image:TopAndBottom BG}');}
  217.  
  218. #title {
  219. z-index: 99;
  220. position: fixed;
  221. top: 0px;
  222. margin-left: 270px;
  223. font-size: 15px;
  224. text-align: center;
  225. font-style: italic;
  226. line-height: 40px;
  227. width: 430px;
  228. height: 40px;
  229. color: {color:Title};
  230. }
  231.  
  232. #sidebar {
  233. position: fixed;
  234. top: 40px;
  235. margin-left: 0px;
  236. width: 198px;
  237. padding: 0px 10px 8px 10px;
  238. background: {color:TopAndBottom BG} url('{image:TopAndBottom BG}');}
  239.  
  240. #sidebar img {
  241. width: 198px;}
  242.  
  243. /* description */
  244. #description {
  245. top: 10px;
  246. left: 20px;
  247. width: 160px;
  248. height: 0px;
  249. overflow: hidden;
  250. position: absolute;
  251. font-size: 10px;
  252. font-family: arial;
  253. color: {color:Description Text};
  254. background: rgba(0, 0, 0, .5);
  255. padding: 0px 10px 0px 10px;
  256. -webkit-transition: all 0.6s ease-in-out;
  257. -moz-transition: all 0.6s ease-in-out;
  258. -o-transition: all 0.6s ease-in-out;
  259. -ms-transition: all 0.6s ease-in-out;
  260. transition: all 0.6s ease-in-out;}
  261.  
  262. #sidebar:hover #description {
  263. height: 168px;
  264. padding: 10px 10px 0px 10px;
  265. overflow: auto;}
  266.  
  267. #description i, #description em {
  268. color: {color:Description Italic};}
  269. #description b, #description strong {
  270. color: {color:Description Bold};}
  271. #description a {
  272. color: {color:Description Link};}
  273. #description a:hover {
  274. color: {color:Description Link Hover};}
  275.  
  276. #description::-webkit-scrollbar-thumb:vertical {
  277. background: {color:Scrollbar};
  278. height: auto;}
  279.  
  280. #description::-webkit-scrollbar-thumb:horizontal {
  281. background: {color:Scrollbar};
  282. height: auto;}
  283.  
  284. #description::-webkit-scrollbar {
  285. height: 3px;
  286. width: 3px;
  287. background: {color:Scrollbar Bottom};}
  288.  
  289. /* navigation with icons */
  290. #main {
  291. margin-top: 10px;
  292. width: 210px;}
  293.  
  294. #main a {
  295. z-index: 99999;
  296. margin-right: 7px;
  297. position: relative;
  298. display: inline-block;
  299. text-align: center;
  300. width: 40px;
  301. height: 40px;
  302. background:{color:Main Nav BG};
  303. color: {color:Main Nav Links};
  304. -webkit-transition: all 0.5s ease-in-out;
  305. -moz-transition: all 0.5s ease-in-out;
  306. -o-transition: all 0.5s ease-in-out;
  307. -ms-transition: all 0.5s ease-in-out;
  308. transition: all 0.5s ease-in-out;}
  309.  
  310. .iconu {
  311. float: left;
  312. margin-left: 0px;
  313. font-size: 13px;
  314. overflow: hidden;
  315. height: 40px;
  316. width: 40px;
  317. line-height: 40px;
  318. text-align: center;}
  319.  
  320. .iconti {
  321. height: 40px;
  322. width: 40px;
  323. font-size: 10px;
  324. letter-spacing: 1px;
  325. text-transform: lowercase;
  326. font-style: italic;
  327. font-family: consolas;
  328. text-align: center;
  329. line-height: 40px;
  330. text-shadow: 1px 1px 0px {color:Main Nav Links Shadow};
  331. -webkit-transition: all 0.5s ease-in-out;
  332. -moz-transition: all 0.5s ease-in-out;
  333. -o-transition: all 0.5s ease-in-out;
  334. -ms-transition: all 0.5s ease-in-out;
  335. transition: all 0.5s ease-in-out;}
  336.  
  337. .iconvi {
  338. height: 40px;
  339. width: 40px;
  340. font-size: 14px;
  341. text-align: center;
  342. margin-left: 0px;
  343. line-height: 38px;
  344. text-shadow: 1px 1px 0px {color:Main Nav Links Shadow};
  345. -webkit-transition: all 0.5s ease-in-out;
  346. -moz-transition: all 0.5s ease-in-out;
  347. -o-transition: all 0.5s ease-in-out;
  348. -ms-transition: all 0.5s ease-in-out;
  349. transition: all 0.5s ease-in-out;}
  350.  
  351. .iconu:hover .iconvi {
  352. margin-top: -38px;}
  353.  
  354. /* sidebar quote */
  355. #sbquote {
  356. margin-top: 10px;
  357. font-style: italic;
  358. font-size: 17px;
  359. text-align: center;
  360. width: 197px;
  361. color: {color:Title};
  362. border-bottom: 2px solid {color:Main Nav BG};
  363. border-top: 2px solid {color:Main Nav BG};
  364. padding: 10px 0px 10px 0px;
  365. }
  366.  
  367. /* music player */
  368. #musicplayer {
  369. position: fixed;
  370. z-index: 99999999999999;
  371. bottom: 50px;
  372. margin-left: 15px;
  373. width: 31px;
  374. height: 31px;
  375. background: {color:Main Nav BG};
  376. -webkit-transition: all .7s ease;
  377. -moz-transition: all .7s ease;
  378. -o-transition: all .7s ease;
  379. transition: all .7s ease;
  380. }
  381.  
  382. #musicplayer img {
  383. width: 15px;
  384. padding: 8px 0px 0px 8px;
  385. }
  386.  
  387. #line {
  388. position:absolute;
  389. background: {color:Main Nav BG};
  390. }
  391.  
  392. .line {
  393. top: 13px;
  394. left: 30px;
  395. width: 0px;
  396. height: 3px;
  397. -webkit-transition:all .4s ease;
  398. -moz-transition:all .4s ease;
  399. -o-transition:all .4s ease;
  400. transition-delay: 0s;
  401. -webkit-transition-delay: 0s;
  402. }
  403.  
  404. #musicplayer:hover .line {
  405. width: 20px;
  406. -webkit-transition-delay: 0s;
  407. }
  408.  
  409. .play {
  410. z-index: 9999;
  411. top: 0px;
  412. left: 50px;
  413. width: 130px;
  414. height: 0px;
  415. padding: 5px 5px 0px 5px;
  416. overflow: hidden;
  417. position: absolute;
  418. text-align: center;
  419. background: {color:Main Nav Links};
  420. border-left: 3px solid {color:Main Nav BG};
  421. opacity: 0;
  422. -webkit-transition: all .4s ease;
  423. -moz-transition: all .4s ease;
  424. -o-transition: all .4s ease;
  425. transition-delay: .4s;
  426. -webkit-transition-delay: .4s;
  427. }
  428.  
  429. #musicplayer:hover .play {
  430. height: 25px;
  431. opacity: 1;
  432. transition-delay: .6s;
  433. -webkit-transition-delay: .6s;
  434. }
  435.  
  436. /* custom links */
  437. #custom {
  438. position: fixed;
  439. bottom: 14px;
  440. margin-left: 270px;
  441. z-index: 99999;
  442. text-align: center;
  443. width: 440px;
  444. -webkit-transition: all .7s ease;
  445. -moz-transition: all .7s ease;
  446. -o-transition: all .7s ease;
  447. transition: all .7s ease;}
  448.  
  449. #custom a {
  450. z-index: 99999;
  451. margin: 0px 5px 0px 5px;
  452. position: relative;
  453. display: inline;
  454. text-align: center;
  455. text-transform: uppercase;
  456. opacity: .7;
  457. letter-spacing: 1px;
  458. font-size: 9px;
  459. padding: 5px 10px 5px 10px;
  460. background: {color:Custom Links BG};
  461. color: {color:Custom Links Link};
  462. -webkit-transition: all .7s ease;
  463. -moz-transition: all .7s ease;
  464. -o-transition: all .7s ease;
  465. transition: all .7s ease;}
  466.  
  467. #custom:hover a:hover {
  468. opacity: 1;
  469. background: {color:Custom Links BG Hover};
  470. color: {color:Custom Links Link Hover};}
  471.  
  472. #custom:hover a {
  473. opacity: .5;}
  474.  
  475. /* pagination */
  476. #pagination {
  477. position: fixed;
  478. z-index: 9999999;
  479. bottom: 13px;
  480. margin-left: 0px;
  481. padding: 10px 0px 0px 0px;
  482. width: 215px;
  483. text-align: center;
  484. {block:IfInfiniteScroll}
  485. display: none;
  486. {/block:IfInfiniteScroll}
  487. {block:IfNotInfiniteScroll}
  488. display: visible;
  489. {/block:IfNotInfiniteScroll}
  490. }
  491.  
  492. #pagination a {
  493. display: inline-block;
  494. font-size: 8px;
  495. padding: 3px;
  496. margin: 0px 2px 0px 2px;
  497. text-transform: uppercase;
  498. text-align: center;
  499. background: {color:Custom Links BG};
  500. color: {color:Custom Links Link};
  501. -webkit-transition: all .7s ease;
  502. -moz-transition: all .7s ease;
  503. -o-transition: all .7s ease;
  504. transition: all .7s ease;}
  505.  
  506. #pagination a:hover {
  507. background: {color:Custom Links BG Hover};
  508. color: {color:Custom Links Link Hover};}
  509.  
  510. span.selectedpage {
  511. font-size: 8px;
  512. padding: 3px;
  513. margin: 0px 2px 0px 2px;
  514. text-transform: uppercase;
  515. text-align: center;
  516. background: {color:Custom Links BG Hover};
  517. color: {color:Custom Links Link Hover};}
  518.  
  519. /* style my tooltip */
  520.  
  521. #s-m-t-tooltip{
  522. max-width: 150px;
  523. margin: 12px;
  524. padding: 4px 8px 4px 8px;
  525. z-index: 99999;
  526. text-align: center;
  527. text-transform: uppercase;
  528. font-size: 8px;
  529. background: {color:Tooltip BG};
  530. color: {color:Tooltip Text};
  531. letter-spacing: 1px;
  532. }
  533.  
  534. /* - - - - P O S T S - - - - */
  535. #container {
  536. margin-left: 270px;
  537. margin-top: 80px;
  538. margin-bottom: 70px;
  539. width: 480px;}
  540.  
  541. .entry {
  542. position: relative;
  543. text-align: justify;
  544. float: left;
  545. color:{color:Entries Text};
  546. background:{color:Entries BG};
  547. border: 1px solid {color:Entries Border};
  548. padding: 15px;
  549. width: 400px;
  550. margin-bottom: 60px;
  551. font-family: Noto Sans;
  552. }
  553.  
  554. .entry img {
  555. max-width: 100%;
  556. }
  557.  
  558. h1 {
  559. margin-top: 0px;
  560. font-size: 12px;
  561. text-align: center;
  562. letter-spacing: 1px;
  563. color: {color:Entries Title};
  564. border-bottom: 1px solid {color:Entries Title Border};
  565. padding-bottom: 6px;
  566. text-transform: uppercase;
  567. }
  568.  
  569. h1 a {
  570. color: {color:Entries Title Link};
  571. }
  572.  
  573. h1 a:hover {
  574. color: {color:Entries Title Link Hover};
  575. }
  576.  
  577. /* image fade / black and white images */
  578. {block:IfImageFade}
  579. .photo {
  580. opacity: .7;
  581. -webkit-transition: all 0.5s ease-in-out;
  582. -moz-transition: all 0.5s ease-in-out;
  583. -o-transition: all 0.5s ease-in-out;
  584. -ms-transition: all 0.5s ease-in-out;
  585. transition: all 0.5s ease-in-out;
  586. }
  587.  
  588. .photo:hover {
  589. opacity: 1;
  590. }
  591.  
  592. .entry img {
  593. opacity: .7;
  594. -webkit-transition: all 0.5s ease-in-out;
  595. -moz-transition: all 0.5s ease-in-out;
  596. -o-transition: all 0.5s ease-in-out;
  597. -ms-transition: all 0.5s ease-in-out;
  598. transition: all 0.5s ease-in-out;
  599. }
  600.  
  601. .entry img:hover {
  602. opacity: 1;
  603. }
  604. {/block:IfImageFade}
  605.  
  606. {block:IfBlackAndWhiteImages}
  607. .entry img{
  608. -webkit-filter:grayscale(100%);
  609. -webkit-transition: all 0.5s ease-in-out;
  610. -moz-transition: all 0.5s ease-in-out;
  611. -o-transition: all 0.5s ease-in-out;
  612. -ms-transition: all 0.5s ease-in-out;
  613. transition: all 0.5s ease-in-out;
  614. }
  615.  
  616. .entry img:hover{
  617. -webkit-filter:none;
  618. -webkit-transition: all 0.5s ease-in-out;
  619. -moz-transition: all 0.5s ease-in-out;
  620. -o-transition: all 0.5s ease-in-out;
  621. -ms-transition: all 0.5s ease-in-out;
  622. transition: all 0.5s ease-in-out;
  623. }
  624. {/block:IfBlackAndWhiteImages}
  625.  
  626. #ask {
  627. margin-left: 0px;
  628. background: {color:Ask BG};
  629. min-height: 45px;
  630. padding: 5px;
  631. border: 1px solid {color:Ask Border};
  632. }
  633.  
  634. #asker {
  635. border-bottom: 1px solid {color:Ask Border};
  636. margin-bottom: 4px;
  637. padding-bottom: 3px;
  638. font-size: 12px;
  639. text-transform: uppercase;
  640. }
  641.  
  642. #answer {
  643. margin-top: 10px;
  644. }
  645.  
  646. #portrait img {
  647. float: left;
  648. border: 3px solid {color:Ask Border};
  649. margin: 0px 7px 5px 0px;
  650. }
  651.  
  652. /* music posts */
  653. #musicpost {
  654. position: relative;
  655. width: 400px;
  656. height: 165px;
  657. overflow: hidden;
  658. margin-bottom: 3px;
  659. }
  660.  
  661. #audio {
  662. position: relative;
  663. float: left;
  664. }
  665.  
  666. #audio img {
  667. border: 7px solid {color:Music Border};
  668. width: 150px;
  669. }
  670.  
  671. #playerholder {
  672. overflow: hidden;
  673. position: absolute;
  674. left: 180px;
  675. top: 30px;
  676. }
  677.  
  678. #player {
  679. overflow: hidden;
  680. position: relative;
  681. opacity: .7;
  682. }
  683.  
  684. #player:hover {
  685. opacity: 1;
  686. }
  687.  
  688. #audioinfo {
  689. position: absolute;
  690. width: 205px;
  691. height: 80px;
  692. margin-left: 175px;
  693. top: 78px;
  694. -webkit-transition: all .8s ease;
  695. -moz-transition: all .8s ease;
  696. -o-transition: all .8s ease;
  697. transition: all .8s ease;
  698. }
  699.  
  700. #audioline {
  701. float: left;
  702. overflow: hidden;
  703. margin-top: 6px;
  704. height: 16px;
  705. line-height: 16px;
  706. width: 209px;
  707. font-size: 8px;
  708. letter-spacing: 1px;
  709. text-transform: uppercase;
  710. font-family: arial;
  711. color: {color:Music Text};
  712. padding: 3px 3px 3px 10px;
  713. border-bottom: 1px solid {color:Music Border};
  714. }
  715.  
  716. #audioline b, #audioline strong {
  717. color: {color:Music Bold Text};
  718. }
  719.  
  720. /* quote */
  721. #quote {
  722. padding: 8px;
  723. text-align: center;
  724. font-size: 14px;
  725. font-style: italic;
  726. letter-spacing: 1px;
  727. }
  728.  
  729. #quotesource {
  730. padding: 3px;
  731. text-align: center;
  732. font-family: arial;
  733. font-size: 8px;
  734. text-transform: uppercase;
  735. letter-spacing: 1px;
  736. color: {color:Bold Text};
  737. }
  738.  
  739. /* chat */
  740. .chat {
  741. margin: 0;
  742. }
  743.  
  744. .chat .chat1 {
  745. margin-left: 0px;
  746. }
  747.  
  748. .chat .chat1 .chat2 {
  749. color: {color:Italic Text};
  750. margin-bottom: 2px;
  751. padding: 4px 4px 5px 5px;
  752. }
  753.  
  754. .chat .chat1 .chat2.even {
  755. color: {color:Bold Text};
  756. }
  757.  
  758. /* permalink */
  759. #perma {
  760. position: absolute;
  761. bottom: -32px;
  762. left: -1px;
  763. -webkit-transition:all .5s ease;
  764. -moz-transition:all .5s ease;
  765. transition:all .5s ease;
  766. -o-transition:all .5s ease;
  767. }
  768.  
  769. #perma a {
  770. display: inline-block;
  771. padding: 0px;
  772. margin-right: 5px;
  773. text-align: center;
  774. width: 22px;
  775. height: 22px;
  776. font-size: 10px;
  777. line-height: 22px;
  778. color: {color:Permalink Icons Color};
  779. background: {color:Permalink BG};
  780. }
  781.  
  782. /* tags */
  783. #tags {
  784. width: 245px;
  785. text-align: center;
  786. padding: 0px;
  787. font-size: 8px;
  788. font-family: arial;
  789. padding: 2px;
  790. text-transform: uppercase;
  791. -webkit-transition:all .5s ease;
  792. -moz-transition:all .5s ease;
  793. transition:all .5s ease;
  794. -o-transition:all .5s ease;
  795. }
  796.  
  797. /* back to top button */
  798. .top {
  799. position: fixed;
  800. z-index: 999;
  801. }
  802.  
  803. .top a {
  804. font-size: 8px;
  805. text-align: center;
  806. padding: 4px 7px 4px 7px;
  807. text-transform: uppercase;
  808. background: {color:Custom Links BG Hover};
  809. color: {color:Custom Links Link Hover};
  810. -webkit-transition:all .5s ease;
  811. -moz-transition:all .5s ease;
  812. transition:all .5s ease;
  813. -o-transition:all .5s ease;
  814. }
  815.  
  816. .top a:hover {
  817. background: {color:Custom Links BG};
  818. color: {color:Custom Links Link};
  819. }
  820.  
  821. #scrollToTop:link, #scrollToTop:visited {
  822. z-index: 9999;
  823. display: none;
  824. position: fixed;
  825. bottom: 10px;
  826. right: 10px;
  827. }
  828.  
  829. /* search box */
  830. #searchbox {
  831. margin-top: 10px;
  832. margin-left: 15px;
  833. margin-bottom: 3px;
  834. }
  835.  
  836. .sfm input {
  837. margin-top: 10px;
  838. font-size: 8px;
  839. border: 0px;
  840. text-transform: uppercase;
  841. margin-top: 0px;
  842. color: {color:Custom Links Link Hover};
  843. background: {color:Custom Links BG Hover};
  844. letter-spacing: 1px;
  845. padding: 4px 8px;
  846. font-family: calibri, helvetica, arial;
  847. }
  848.  
  849. #sf {
  850. background: {color:Entries BG};
  851. }
  852.  
  853. /* - - - - - - - Yes, these are the credits. Remove them and I'll cry like a baby then I will make tumblr close your blog FOREVEEER <3 :D - - - - - - - */
  854. #pancake {
  855. z-index: 9999999;
  856. position: fixed;
  857. bottom: 10px;
  858. left: 10px;
  859. -webkit-transition: all 0.5s ease-in-out;
  860. -moz-transition: all 0.5s ease-in-out;
  861. -o-transition: all 0.5s ease-in-out;
  862. -ms-transition: all 0.5s ease-in-out;
  863. transition: all 0.5s ease-in-out;
  864. }
  865.  
  866. #pancake a {
  867. display: inline-block;
  868. text-align: center;
  869. font-size: 15px;
  870. font-family: arial;
  871. letter-spacing: -1px;
  872. padding: 2px 4px 4px 3px;
  873. font-weight: bold;
  874. width: 14px;
  875. height: 15px;
  876. line-height: 15px;
  877. overflow: hidden;
  878. background: {color:Tooltip BG};
  879. color: {color:Tooltip Text};
  880. -webkit-transition: all 0.5s ease-in-out;
  881. -moz-transition: all 0.5s ease-in-out;
  882. -o-transition: all 0.5s ease-in-out;
  883. -ms-transition: all 0.5s ease-in-out;
  884. transition: all 0.5s ease-in-out;
  885. }
  886.  
  887. #cupcake {
  888. z-index: -1;
  889. position: fixed;
  890. margin-top: -25px;
  891. margin-left: 0px;
  892. -webkit-transition: all 0.5s ease-in-out;
  893. -moz-transition: all 0.5s ease-in-out;
  894. -o-transition: all 0.5s ease-in-out;
  895. -ms-transition: all 0.5s ease-in-out;
  896. transition: all 0.5s ease-in-out;
  897. }
  898.  
  899. #cupcake a {
  900. display: inline-block;
  901. font-size: 15px;
  902. font-family: arial;
  903. letter-spacing: -1px;
  904. padding: 4px 4px 4px 0px;
  905. font-weight: bold;
  906. width: 10px;
  907. height: 13px;
  908. line-height: 13px;
  909. overflow: hidden;
  910. background: {color:Tooltip Text};
  911. color: {color:Tooltip BG};
  912. -webkit-transition: all 0.5s ease-in-out;
  913. -moz-transition: all 0.5s ease-in-out;
  914. -o-transition: all 0.5s ease-in-out;
  915. -ms-transition: all 0.5s ease-in-out;
  916. transition: all 0.5s ease-in-out;
  917. }
  918.  
  919. #pancake:hover #cupcake a {
  920. width: 70px;
  921. margin-left: 21px;
  922. }
  923.  
  924. /* notes */
  925. ol.notes li.note{
  926. font-size: 9px;
  927. text-transform: uppercase;
  928. line-height: 13px;
  929. font-family: consolas;
  930. }
  931.  
  932. </style>
  933.  
  934. {block:IfBackToTop}
  935. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
  936. <script src="http://static.tumblr.com/ikeq9mi/DfYl6o46t/scrolltotop.min.js"></script>
  937.  
  938. <div class="top">
  939. <a href="javascript:;" id="scrollToTop">scroll to top</a>
  940. </div>
  941. {/block:IfBackToTop}
  942.  
  943. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  944.  
  945. <script>
  946. (function($){
  947. $(document).ready(function(){
  948. $("a[title]").style_my_tooltips({
  949. tip_follows_cursor:true,
  950. tip_delay_time:0,
  951. tip_fade_speed:0,
  952. attribute:"title"
  953. });
  954. });
  955. })(jQuery);
  956. </script>
  957.  
  958. {block:ifinfinitescroll}
  959. <script type="text/javascript" src="http://static.tumblr.com/bmdsqsc/8mXm7q8vn/jquery.js"></script>
  960. <script type="text/javascript" src="http://static.tumblr.com/bmdsqsc/ogWm7q8w1/lazyload.js"></script>
  961. <script type="text/javascript" charset="utf-8">
  962. var $j = jQuery.noConflict();
  963. $j(function() {
  964. if (navigator.platform == "iPad" || navigator.platform == "iPhone") return;
  965. $j("img").lazyload({
  966. placeholder : "http://static.tumblr.com/twte3d7/RSvlio0k5/grey.gif",
  967. effect: "fadeIn",
  968. });
  969. });
  970. </script>
  971. <script type="text/javascript" src="http://codysherman.com/tools/infinite-scrolling/code"></script>
  972. {/block:ifinfinitescroll}
  973.  
  974. </head>
  975.  
  976. <body>
  977.  
  978. <div id="top"></div>
  979.  
  980. <div id="bottom"></div>
  981.  
  982. <div id="all">
  983.  
  984. {block:ifMusicPlayer}
  985. <div id="musicplayer">
  986. <img src="http://static.tumblr.com/n9vj50j/cxEn20wqg/12.gif">
  987. <div id="line" class="line"></div>
  988. <div class="play">
  989. {text:Music Player}
  990. </div>
  991. </div>
  992. {/block:ifMusicPlayer}
  993.  
  994. <div id="title">{Title}</div>
  995.  
  996. <div id="sidebar">
  997. <img src="{image:Sidebar}">
  998.  
  999. <div id="description">{Description}</div>
  1000.  
  1001. <div id="main">
  1002. <a href="/">
  1003. <div class="iconu">
  1004. <div class="iconvi"><span class="entypo-home"></span></div>
  1005. <div class="iconti">home</div>
  1006. </div>
  1007. </a>
  1008.  
  1009. <a href="/ask">
  1010. <div class="iconu">
  1011. <div class="iconvi"><span class="entypo-mail"></span></div>
  1012. <div class="iconti">ask</div>
  1013. </div>
  1014. </a>
  1015.  
  1016. <a href="/archive">
  1017. <div class="iconu">
  1018. <div class="iconvi"><span class="entypo-attach"></span></div>
  1019. <div class="iconti">past</div>
  1020. </div>
  1021. </a>
  1022.  
  1023. <a href="/random">
  1024. <div class="iconu">
  1025. <div class="iconvi"><span class="entypo-paper-plane"></span></div>
  1026. <div class="iconti">randm</div>
  1027. </div>
  1028. </a>
  1029. </div><!-- /div main -->
  1030.  
  1031. {block:ifSidebarQuote}
  1032. <div id="sbquote">&ldquo;{text:Sidebar Quote}&rdquo;</div>
  1033. {/block:ifSidebarQuote}
  1034.  
  1035. {block:ifsearchbox}
  1036. <div id="searchbox">
  1037. <form action="/search" method="get" class="sfm">
  1038. <input type="text" name="q" value="{SearchQuery}" id="sf"/>
  1039. <input type="submit" value="Search" id="sb"/>
  1040. </form>
  1041. </div>
  1042. {/block:ifsearchbox}
  1043.  
  1044. </div><!-- /div sidebar -->
  1045.  
  1046. {block:Pagination}
  1047. <div id="pagination">
  1048. {block:PreviousPage}
  1049. <a href="{PreviousPage}">< back</a>
  1050. {/block:PreviousPage}
  1051. {block:JumpPagination length="3"}
  1052. {block:CurrentPage}
  1053. <span class="current_page"><span class="selectedpage">{PageNumber}</span></span>
  1054. {/block:CurrentPage}
  1055. {block:JumpPage}
  1056. <a class="jump_page" href="{URL}">{PageNumber}</a>
  1057. {/block:JumpPage}
  1058. {/block:JumpPagination}
  1059. {block:NextPage}
  1060. <a href="{NextPage}">next ></a>
  1061. {/block:NextPage}
  1062. </div>
  1063. {/block:Pagination}
  1064.  
  1065. <div id="custom">
  1066. {block:iflink1}<a href="{text:Link 1 URL}">{text:Link 1}</a>{/block:iflink1}
  1067. {block:iflink2}<a href="{text:Link 2 URL}">{text:Link 2}</a>{/block:iflink2}
  1068. {block:iflink3}<a href="{text:Link 3 URL}">{text:Link 3}</a>{/block:iflink3}
  1069. {block:iflink4}<a href="{text:Link 4 URL}">{text:Link 4}</a>{/block:iflink4}
  1070. </div><!-- /div custom links -->
  1071.  
  1072.  
  1073.  
  1074. <div id="container">
  1075. {block:Posts}
  1076. <div class="entry">
  1077.  
  1078. {block:Text}
  1079. {block:Title}<h1>{Title}</h1>{/block:Title}
  1080. {Body}
  1081. {/block:Text}
  1082.  
  1083. {block:Photo}
  1084. {LinkOpenTag}<img src="{PhotoURL-highres}" width="400px" alt="{PhotoAlt}">{LinkCloseTag}
  1085. {block:IndexPage}
  1086. {block:ifShowCaptions}
  1087. {block:Caption}{Caption}{/block:Caption}
  1088. {/block:ifShowCaptions}
  1089. {/block:IndexPage}
  1090. {block:PermalinkPage}
  1091. {block:Caption}{Caption}{/block:Caption}
  1092. {/block:PermalinkPage}
  1093. {/block:Photo}
  1094.  
  1095. {block:Photoset}
  1096. <div class="photo">{Photoset-400}</div>
  1097. {block:IndexPage}
  1098. {block:ifShowCaptions}
  1099. {block:Caption}{Caption}{/block:Caption}
  1100. {/block:ifShowCaptions}
  1101. {/block:IndexPage}
  1102. {block:PermalinkPage}
  1103. {block:Caption}{Caption}{/block:Caption}
  1104. {/block:PermalinkPage}
  1105. {/block:Photoset}
  1106.  
  1107. {block:Audio}
  1108. <div id="musicpost">
  1109. {block:AlbumArt}
  1110. <div id="audio"><img src="{AlbumArtURL}" alt=""></div>
  1111. {/block:AlbumArt}
  1112. <div id="playerholder">
  1113. <div id="player">
  1114. {AudioPlayerGrey}
  1115. </div>
  1116. </div>
  1117. <div id="audioinfo">
  1118. {block:TrackName}
  1119. <div id="audioline"><b>Track:</b> {TrackName}</div>
  1120. {/block:TrackName} <br />
  1121. {block:Artist}
  1122. <div id="audioline"><b>Artist:</b> {Artist}</div>
  1123. {/block:Artist} <br />
  1124. {block:Album}
  1125. <div id="audioline"><b>Album:</b> {Album}</div>
  1126. {/block:Album}
  1127. </div>
  1128. </div>
  1129. {block:IndexPage}
  1130. {block:ifShowCaptions}
  1131. {block:Caption}{Caption}{/block:Caption}
  1132. {/block:ifShowCaptions}
  1133. {/block:IndexPage}
  1134. {block:PermalinkPage}
  1135. {block:Caption}{Caption}{/block:Caption}
  1136. {/block:PermalinkPage}
  1137. {/block:Audio}
  1138.  
  1139.  
  1140. {block:Video}
  1141. {Video-400}
  1142. {block:IndexPage}
  1143. {block:ifShowCaptions}
  1144. {block:Caption}{Caption}{/block:Caption}
  1145. {/block:ifShowCaptions}
  1146. {/block:IndexPage}
  1147. {block:PermalinkPage}
  1148. {block:Caption}{Caption}{/block:Caption}
  1149. {/block:PermalinkPage}
  1150. {/block:Video}
  1151.  
  1152.  
  1153. {block:Quote}
  1154. <div id="quote">{Quote}</div>
  1155. <div id="quotesource">-{Source}</div>
  1156. {/block:Quote}
  1157.  
  1158.  
  1159. {block:Link}
  1160. <h1> <a href="{URL}" {Target}>{Name}</a></h1>
  1161. {Description}
  1162. {block:Caption}{Caption}{/block:Caption}
  1163. {/block:Link}
  1164.  
  1165.  
  1166. {block:Chat}
  1167. {block:Title}<div id="entrytitle">{Title}</div>{/block:Title}
  1168. <div class="chat">
  1169. <div class="chat1">
  1170. {block:Lines}
  1171. <div class="chat2 {Alt}">
  1172. {block:Label}
  1173. {Label}
  1174. {/block:Label}
  1175. {Line} </div>
  1176. {/block:Lines}
  1177. </div>
  1178. </div>
  1179. {/block:Chat}
  1180.  
  1181.  
  1182. {block:Answer}
  1183. <div id="ask">
  1184. <div id="portrait"><img src="{AskerPortraitURL-40}"></div>
  1185. <div id="asker"><span class="entypo-chat"></span> {Asker} sent:</div>
  1186. {Question}
  1187. </div>
  1188. <div id="answer"{Answer}</div>
  1189. {/block:Answer}
  1190.  
  1191.  
  1192.  
  1193. {block:IndexPage}
  1194. <!-- permalink -->
  1195.  
  1196. <div id="perma">
  1197. <a href="{permalink}" title="{ShortMonth} {DayOfMonth}{DayOfMonthSuffix} {Year}"><span class="entypo-clock"></span></a>
  1198.  
  1199. <a href="{permalink}" title="{NoteCountWithLabel}"><span class="entypo-heart"></span></a>
  1200.  
  1201. <a href="{reblogurl}" target="_blank" title="reblog"><span class="entypo-arrows-ccw"></span></a>
  1202.  
  1203. {block:ifshowtags}
  1204. {block:HasTags}<a title="Tagged as{block:Tags} #{Tag}{block:Tags}"><span class="entypo-tag"></span></a>{/block:HasTags}
  1205. {/block:ifshowtags}
  1206.  
  1207. {block:RebloggedFrom}<a href="{ReblogParentURL}" title="via: {ReblogParentName}"><span class="entypo-shuffle"></span></a>{/block:RebloggedFrom}
  1208.  
  1209. {block:ContentSource}<a href="{SourceURL}" title="source: {SourceTitle}"><span class="entypo-user"></span></a> {/block:ContentSource}
  1210. </div>
  1211.  
  1212. <!-- /permalink -->
  1213. {/block:IndexPage}
  1214.  
  1215.  
  1216.  
  1217. <!-- permalink --> {block:PermalinkPage}
  1218.  
  1219. {block:Date}<p><b>❯</b> Posted on {ShortMonth} {DayOfMonth}{DayOfMonthSuffix} {Year} at {12Hour}:{Minutes}{AmPm}{/block:Date} {block:NoteCount} with {NoteCountWithLabel}{/block:NoteCount}
  1220.  
  1221. {block:RebloggedFrom}<br><b>❯</b> Original post: <a href="{ReblogRootURL}">{ReblogRootName}</a>. Reblogged from: <a href="{ReblogParentURL}">{ReblogParentName}</a>.{/block:RebloggedFrom}
  1222.  
  1223. {block:HasTags}<br><b>❯</b> Tagged as {block:Tags}<a href="{TagURL}">#{Tag}</a> {/block:Tags}{/block:HasTags}
  1224.  
  1225. {block:PostNotes}{PostNotes}{/block:PostNotes}
  1226.  
  1227. {/block:PermalinkPage} <!-- /permalink -->
  1228.  
  1229.  
  1230. </div> <!-- /div entry -->
  1231. {/block:Posts}
  1232. </div> <!-- /div container -->
  1233.  
  1234. </div> <!-- /div all -->
  1235.  
  1236. <div id="pancake">
  1237. <a href="http://vitanica.tumblr.com/">v</a>
  1238. <div id="cupcake"><a href="http://vitanica.tumblr.com">vitanica</a></div>
  1239. </div>
  1240.  
  1241. </body>
  1242.  
  1243. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement