Advertisement
hotlimit

vestige

May 14th, 2012
497
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 26.16 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. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  3.  
  4. <!-- HOTLIMIT THEME 002: VESTIGE
  5.  
  6. THEME CODED BY HOTLIMIT [AT] TUMBLR [DOT] COM
  7.  
  8. PLEASE DO NOT REMOVE THE CREDIT, REDISTRIBUTE, USE AS A BASE, OR CLAIM AS YOUR OWN.
  9. TUMBLR IS BIG, BUT IT AIN'T **THAT** BIG.
  10. DO NOT REMOVE THESE COMMENTS FROM THIS CODING, EITHER. -->
  11.  
  12. <head>
  13.  
  14. <title>{Title}</title>
  15. <link rel="shortcut icon" href="{Favicon}">
  16. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  17. {block:Description}
  18. <meta name="description" content="{MetaDescription}" />
  19. {/block:Description}
  20.  
  21. <meta name="color:Background" content="#1b1a18" />
  22. <meta name="color:Title" content="#b4b2b0" />
  23. <meta name="color:Text" content="#a0a0a0" />
  24. <meta name="color:Selected text" content="#e2deda" />
  25. <meta name="color:Selection color" content="#917053" />
  26. <meta name="color:Bold" content="#90633f" />
  27. <meta name="color:Italic" content="#904e3f" />
  28. <meta name="color:Underline" content="#aa9f9f" />
  29. <meta name="color:Link" content="#ae694e" />
  30. <meta name="color:Link hover" content="#a07743" />
  31. <meta name="color:Border" content="#2a2724" />
  32. <meta name="color:Inner" content="#1c1c1c" />
  33. <meta name="color:Blockquote" content="#322518" />
  34. <meta name="color:Quote" content="#9f7245" />
  35. <meta name="color:Odd" content="#161413" />
  36. <meta name="color:Even" content="#2a2928" />
  37. <meta name="color:Speaker 1" content="#90633f" />
  38. <meta name="color:Speaker 2" content="#c59580" />
  39. <meta name="color:Question" content="#0f0e0e" />
  40. <meta name="color:Tags" content="#151413" />
  41. <meta name="color:Stats" content="#171616" />
  42. <meta name="color:Custom links" content="#252222" />
  43. <meta name="color:Custom link hover" content="#fdf0e3" />
  44. <meta name="color:Link 1 hover" content="#5d4740" />
  45. <meta name="color:Link 2 hover" content="#836358" />
  46. <meta name="color:Link 3 hover" content="#ad7f6f" />
  47. <meta name="color:Link 4 hover" content="#d3937d" />
  48.  
  49. <meta name="image:Background" content="" />
  50. <meta name="image:Sidebar" content="" />
  51.  
  52. <meta name="if:Show title" content="1" />
  53. <meta name="if:Show custom links" content="1" />
  54. <meta name="if:Permalink hover" content="1" />
  55. <meta name="if:Fade images" content="1" />
  56. <meta name="if:Fade sidebar image" content="1" />
  57. <meta name="if:Show captions on index" content="1" />
  58. <meta name="if:Show Music Player" content="1" />
  59. <meta name="if:Infinite scroll" content="0" />
  60. <meta name="if:Lazy Load" content="1" />
  61.  
  62. <meta name="text:Background repeat" content="no-repeat"/>
  63.  
  64. <meta name="text:Link 1 Title" content="Link 1" />
  65. <meta name="text:Link 1 URL" content="" />
  66. <meta name="text:Link 2 Title" content="Link 2" />
  67. <meta name="text:Link 2 URL" content="" />
  68. <meta name="text:Link 3 Title" content="Link 3" />
  69. <meta name="text:Link 3 URL" content="" />
  70. <meta name="text:Link 4 Title" content="Link 4" />
  71. <meta name="text:Link 4 URL" content="" />
  72. <meta name="text:Player code" content="" />
  73.  
  74. <link href='http://fonts.googleapis.com/css?family=Tulpen+One' rel='stylesheet' type='text/css'>
  75.  
  76. <style type="text/css">
  77.  
  78. /* THE BASICS */
  79.  
  80. body {
  81. background-color: {color:Background};
  82. background-image: url('{image:Background}');
  83. background-attachment: fixed;
  84. background-repeat: {text:Background repeat};
  85. color: {color:Text};
  86. font-family: Calibri;
  87. font-size: 11px;
  88. }
  89.  
  90. a, a:link, a:visited, a:active {
  91. color: {color:Link};
  92. font-weight: bold;
  93. text-decoration: none;
  94. transition: all 0.6 ease-in-out;
  95. -webkit-transition: opacity 0.6s linear;
  96. -webkit-transition: all 0.6s ease-in-out;
  97. -moz-transition: all 0.6s ease-in-out;
  98. -o-transition: all 0.6s ease-in-out;
  99. -ms-transition: all 0.6 ease-in-out;
  100. }
  101.  
  102. a:hover {
  103. color: {color:Link hover};
  104. transition: all 0.7 ease-in-out;
  105. -webkit-transition: opacity 0.7s linear;
  106. -webkit-transition: all 0.7s ease-in-out;
  107. -moz-transition: all 0.7s ease-in-out;
  108. -o-transition: all 0.7s ease-in-out;
  109. -ms-transition: all 0.7 ease-in-out;
  110. }
  111.  
  112. a img {
  113. border: 0px;
  114. }
  115.  
  116. b, strong {
  117. font-weight: bold;
  118. color: {color:Bold};
  119. }
  120.  
  121. i, em {
  122. font-style: italic;
  123. color: {color:Italic};
  124. }
  125.  
  126. u {
  127. text-decoration: underline;
  128. color: {color:Underline};
  129. }
  130.  
  131. small {
  132. font-size: 9px;
  133. letter spacing: 1px;
  134. }
  135.  
  136. p {
  137. margin: 5px 0 2px 0;
  138. }
  139.  
  140. blockquote {
  141. margin: 2px 5px 2px 5px;
  142. padding: 1px 0 3px 6px;
  143. border-left: 5px solid {color:blockquote};
  144. }
  145.  
  146. ::selection {
  147. background-color: {color:Selection color};
  148. color: {color:Selected text};
  149. }
  150.  
  151. ::-moz-selection {
  152. background-color: {color:Selection color};
  153. color: {color:Selected text};
  154. }
  155.  
  156. /* ENTRIES */
  157.  
  158. #content {
  159. margin: 10px 3px 20px 150px;
  160. width: 510px;
  161. text-align: justify;
  162. padding: 5px;
  163. background-color: transparent;
  164. }
  165.  
  166. .entry {
  167. background-color: {color:Inner};
  168. border: 5px solid {color:Border};
  169. width: 500px;
  170. padding: 20px 5px 5px 5px;
  171. position: relative;
  172. overflow: hidden;
  173. }
  174.  
  175. /* PERMALINK BAR */
  176.  
  177. #stats {
  178. background-color: {color:Stats};
  179. border-bottom: 1px dotted {color:Border};
  180. {block:IfPermalinkHover}
  181. opacity: 0;
  182. filter:alpha(opacity=0);
  183. -moz-opacity: 0;
  184. margin-top: -25px;
  185. {/block:IfPermalinkHover}
  186. {block:IfNotPermalinkHover}
  187. opacity: 1;
  188. filter:alpha(opacity=1);
  189. -moz-opacity: 1;
  190. {/block:IfNotPermalinkHover}
  191. width: 520px;
  192. margin-left: -4px;
  193. height: auto;
  194. padding: 3px;
  195. font-size: 10px;
  196. text-align: center;
  197. text-transform: uppercase;
  198. position: absolute;
  199. z-index: 1000;
  200. -webkit-transition: all 0.8s ease-in-out;
  201. -moz-transition: all 0.8s ease-in-out;
  202. -o-transition: all 0.8s ease-in-out;
  203. }
  204.  
  205. #content:hover #stats {
  206. {block:IfPermalinkHover}
  207. opacity: 1;
  208. filter:alpha(opacity=1);
  209. -moz-opacity: 1;
  210. margin-top: -20px;
  211. {/block:IfPermalinkHover}
  212. position: absolute;
  213. -webkit-transition: all 0.8s ease-in-out;
  214. -moz-transition: all 0.8s ease-in-out;
  215. -o-transition: all 0.8s ease-in-out;
  216. }
  217.  
  218. #permastats {
  219. background-color: {color:Stats}
  220. border-bottom: 1px dotted {color:Border};
  221. width: 520px;
  222. margin-left: -4px;
  223. margin-top: -20px;
  224. height: auto;
  225. padding: 3px;
  226. font-size: 10px;
  227. text-align: center;
  228. text-transform: uppercase;
  229. position: absolute;
  230. z-index: 1000;
  231. }
  232.  
  233. /* GENERAL ENTRY CONTENT */
  234.  
  235. header {
  236. font-size: 20px;
  237. margin-left: 0px;
  238. border-left: 3px solid {color:Border};
  239. padding-left: 6px;
  240. font-weight: normal !important;
  241. text-align: left;
  242. text-transform: uppercase;
  243. color: {color:EntryTitle};
  244. letter-spacing: 1px;
  245. font-family: 'Tulpen One',cursive;
  246. }
  247.  
  248. #caption {
  249. {block:IfShowCaptionsOnIndex}
  250. padding: 2px 0 35px 0;
  251. width: 490px;
  252. margin: 0 0 0 5px;
  253. {/block:IfShowCaptionsOnIndex}
  254. }
  255.  
  256. /* PHOTO/PHOTOSET POSTS */
  257.  
  258. .images {
  259. {block:IfFadeImages}
  260. opacity: 0.6;
  261. transition: all 0.5 ease-in-out;
  262. -webkit-transition: opacity 0.5s linear;
  263. -webkit-transition: all 0.5s ease-in-out;
  264. -moz-transition: all 0.5s ease-in-out;
  265. -o-transition: all 0.5s ease-in-out;
  266. {/block:IfFadeImages}
  267. {block:IfNotFadeImages}
  268. opacity: 1;
  269. {/block:IfNotFadeImages}
  270. }
  271.  
  272. .images:hover {
  273. {block:IfFadeImages}
  274. opacity: 1;
  275. transition: all 0.9s ease-in-out;
  276. -webkit-transition: opacity 0.9s linear;
  277. -webkit-transition: all 0.9s ease-in-out;
  278. -moz-transition: all 0.9s ease-in-out;
  279. -o-transition: all 0.9s ease-in-out;
  280. {/block:IfFadeImages}
  281. }
  282.  
  283. /* QUOTE POSTS */
  284.  
  285. .quote {
  286. font-size: 30px;
  287. color: {color:Quote};
  288. font-weight: bold;
  289. font-family: 'Tulpen One',cursive;
  290. }
  291.  
  292. .source {
  293. margin-left: 25px;
  294. text-align: right;
  295. }
  296.  
  297. /* LINK POSTS */
  298.  
  299. .postlink {
  300. padding: 5px;
  301. font-size: 16px;
  302. -moz-border-radius: 5px;
  303. -webkit-border-radius: 5px;
  304. font-weight: normal;
  305. font-style: italic;
  306. }
  307.  
  308. /* AUDIO POSTS */
  309.  
  310. .audiopost {
  311. width: 490px;
  312. position: relative;
  313. padding: 5px;
  314. min-height: 200px;
  315. }
  316.  
  317. #musicbox {
  318. width: 195px;
  319. height: 185px;
  320. padding: 5px;
  321. position: relative;
  322. overflow: hidden;
  323. background-color: transparent;
  324. }
  325.  
  326. #blank {
  327. height: 177px;
  328. position: absolute;
  329. width: 177px;
  330. margin-left: 17px;
  331. margin-left: 14px;
  332. margin-top: 4px;
  333. }
  334.  
  335. #albumcover {
  336. height: 177px;
  337. margin-left: 0;
  338. position: absolute;
  339. width: 177px;
  340. }
  341.  
  342. #albumcover img {
  343. width: 177px;
  344. height: 177px;
  345. }
  346.  
  347. #jewelcase {
  348. width: 194px;
  349. height: 184px;
  350. position: absolute;
  351. }
  352.  
  353. #player {
  354. background-color: #ffffff;
  355. overflow: hidden;
  356. z-index: 500;
  357. opacity: 0;
  358. width: 50px;
  359. height: 50px;
  360. margin-left: 75px;
  361. margin-top: 65px;
  362. -webkit-border-radius: 50px;
  363. -moz-border-radius: 50px;
  364. border-radius: 50px;
  365. -webkit-transition: opacity 1s linear;
  366. -webkit-transition: all 1s ease-in-out;
  367. -moz-transition: all 1s ease-in-out;
  368. -o-transition: all 1s ease-in-out;
  369. transition: all 1s ease-in-out;
  370. }
  371.  
  372. #audiobutton {
  373. width: 20px;
  374. height: 30px;
  375. overflow: hidden;
  376. z-index: 999;
  377. margin: 10px auto 0;
  378. }
  379.  
  380. #musicbox:hover #player {
  381. opacity: .7;
  382. filter:alpha(opacity=70);
  383. -webkit-transition: opacity 0.8s linear;
  384. -webkit-transition: all 0.8s ease-in-out;
  385. -moz-transition: all 0.8s ease-in-out;
  386. -o-transition: all 0.8s ease-in-out;
  387. transition: all 0.8s ease-in-out;
  388. }
  389.  
  390. .id3 {
  391. float: left;
  392. margin: 10px;
  393. max-height: 150px;
  394. width: 200px;
  395. padding: 5px;
  396. margin-left: 0px;
  397. }
  398.  
  399. .tracktitle, .trackalbum, .external {
  400. background-color: {color:Odd}
  401. padding: 5px;
  402. }
  403.  
  404. .trackartist, .playcount {
  405. background-color: {color:Even};
  406. padding: 5px;
  407. }
  408.  
  409. /* CHAT POSTS */
  410.  
  411. ul.chat {
  412. margin: 0;
  413. padding: 0;
  414. }
  415.  
  416. .chat li {
  417. list-style-type: none;
  418. margin-left: 0px;
  419. padding: 3px;
  420. }
  421.  
  422. .chat li.odd {
  423. background-color: {color:odd};
  424. margin-bottom: 1px;
  425. }
  426.  
  427. .chat li.even {
  428. background-color: {color:even};
  429. margin-bottom: 1px;
  430. }
  431.  
  432. .label {
  433. font-weight: bold;
  434. }
  435.  
  436. .user_1, .user_3, .user_5, .user_7 .label {
  437. color: {color:Speaker 1};
  438. }
  439.  
  440. .user_2, .user_4, .user_6, .user_8 .label {
  441. color: {color:Speaker 2};
  442. }
  443.  
  444. /* ANSWER POSTS */
  445.  
  446. #question {
  447. background-color: {color:Question};
  448. margin: 0 auto;
  449. margin-top: 2px;
  450. font-size: 10px;
  451. padding: 5px;
  452. min-height: 15px;
  453. overflow-y: hidden;
  454. width: 490px;
  455. }
  456.  
  457. .arrow {
  458. color: {color:Question};
  459. font-size: 30px;
  460. margin-left: 240px;
  461. z-index: 10;
  462. margin-top: -15px;
  463. margin-bottom: -10px;
  464. }
  465.  
  466. #asker {
  467. text-align: center;
  468. width: 250px;
  469. height: 20px;
  470. padding: 2px;
  471. margin: 0 auto;
  472. text-transform: uppercase;
  473. }
  474.  
  475. .askicon {
  476. padding-right: 8px;
  477. margin-top: 2px;
  478. }
  479.  
  480. .askicon img {
  481. width: 16px;
  482. height: 16px;
  483. }
  484.  
  485. .askername a {
  486. font-size: 10px;
  487. line-height: 12px;
  488. }
  489.  
  490. #answer {
  491. text-align: left;
  492. padding-top: 5px;
  493. padding-bottom: 1px;
  494. }
  495.  
  496. /* SOURCE BLOCK */
  497.  
  498. .origin {
  499. padding: 1px;
  500. width: 490px;
  501. margin: 5px auto 0 auto;
  502. height: auto;
  503. overflow: hidden;
  504. }
  505.  
  506. /* TAGS BLOCK */
  507.  
  508. #meta {
  509. padding-left: 8px;
  510. width: 520px;
  511. margin-left: -4px;
  512. height: auto;
  513. overflow: hidden;
  514. background-color: {color:Stats};
  515. border-top: 1px dotted {color:Border};
  516. }
  517.  
  518. .tags {
  519. display: inline;
  520. text-align: left;
  521. font-size: 10px;
  522. float: left;
  523. text-transform: uppercase;
  524. padding: 3px 4px 4px 5px;
  525. height: auto;
  526. }
  527.  
  528. .tag {
  529. font-weight: normal;
  530. margin-right: 2px;
  531. font-style: none;
  532. color: {color:Link};
  533. }
  534.  
  535. #clear {
  536. clear: both;
  537. width: 50px;
  538. height: 0px;
  539. background-color: transparent;
  540. }
  541.  
  542. /* NOTES */
  543.  
  544. .notes {
  545. float: left;
  546. padding: 5px;
  547. height: 25px;
  548. margin-top: 0px;
  549. width: 500px;
  550. }
  551.  
  552. ol.notes {
  553. list-style: none;
  554. margin: 0 20px 0 10px;
  555. padding: 0px;
  556. }
  557.  
  558. ol.notes li.note {
  559. margin: 0px;
  560. padding: 5px;
  561. }
  562.  
  563. ol.notes li.note img.avatar {
  564. vertical-align: -4px;
  565. margin-right: 10px;
  566. width: 16px;
  567. height: 16px;
  568. }
  569.  
  570. .action a {
  571. text-transform: uppercase;
  572. }
  573.  
  574. ol.notes li.note blockquote {
  575. border-color: {color:Border};
  576. padding: 4px 10px;
  577. margin: 10px 0px 0px 25px;
  578. font-style: italic;
  579. }
  580.  
  581. ol.notes li.note blockquote a {
  582. text-decoration: none;
  583. }
  584.  
  585. #notes img {
  586. border:0px;
  587. }
  588.  
  589. #notes a {
  590. font-size: 10px;
  591. }
  592.  
  593. /* PAGINATION ARROWS */
  594.  
  595. .paginate {
  596. text-align: center;
  597. width: 74%;
  598. position: fixed;
  599. display: block;
  600. height: 35px;
  601. padding: 5px;
  602. margin: 300px 45px 0;
  603. }
  604.  
  605. .moveback {
  606. float: left;
  607. letter-spacing: 1px;
  608. text-transform: uppercase;
  609. text-align: center;
  610. padding: 3px;
  611. margin: 0px 1px 0px 10px;
  612. width: 70px;
  613. height: 20px;
  614. line-height: 20px;
  615. overflow: hidden;
  616. -webkit-transition: opacity 0.5s linear;
  617. -webkit-transition: all 0.5s ease-in-out;
  618. -moz-transition: all 0.5s ease-in-out;
  619. -o-transition: all 0.5s ease-in-out;
  620. transition: all 0.5s ease-in-out;
  621. opacity: 0.8;
  622. }
  623.  
  624. .movenext {
  625. float: right;
  626. letter-spacing: 1px;
  627. text-transform: uppercase;
  628. text-align: center;
  629. padding: 3px;
  630. margin: 0px 10px 0px 5px;
  631. width: 70px;
  632. height: 20px;
  633. line-height: 20px;
  634. overflow: hidden;
  635. -webkit-transition: opacity 0.5s linear;
  636. -webkit-transition: all 0.5s ease-in-out;
  637. -moz-transition: all 0.5s ease-in-out;
  638. -o-transition: all 0.5s ease-in-out;
  639. transition: all 0.5s ease-in-out;
  640. opacity: 0.8;
  641. }
  642.  
  643. #backarrow, #nextarrow {
  644. color: {color:Link};
  645. background-color: {color:Custom links};
  646. }
  647.  
  648. #backarrow:hover {
  649. color: {color:Custom link hover};
  650. background-color: {color:Link 1 hover};
  651. margin-left: 0px;
  652. opacity: 1;
  653. }
  654.  
  655. #nextarrow:hover {
  656. color: {color:Custom link hover};
  657. background-color: {color:Link 1 hover};
  658. margin-right: 0px;
  659. opacity: 1;
  660. }
  661.  
  662. /* SIDE CONTENT */
  663.  
  664. #title {
  665. font-size: 36px;
  666. font-family: 'Tulpen One',cursive;
  667. letter-spacing: 1px;
  668. color: {color:Title};
  669. margin-left: 700px;
  670. margin-top: 64px;
  671. position: fixed;
  672. text-align: right;
  673. text-transform: uppercase;
  674. width: 250px;
  675. }
  676.  
  677. #invoke {
  678. margin-left: 700px;
  679. {block:IfShowTitle}
  680. margin-top: 100px;
  681. {/block:IfShowTitle}
  682. {block:IfNotShowTitle}
  683. margin-top: 70px;
  684. {/block:IfNotShowTitle}
  685. max-width: 250px;
  686. max-height: 430px;
  687. overflow: hidden;
  688. position: fixed;
  689. text-align: justify;
  690. z-index: 1;
  691. -webkit-transition: opacity 1s linear;
  692. -webkit-transition: all 1s ease-in-out;
  693. -moz-transition: all 1s ease-in-out;
  694. -o-transition: all 1s ease-in-out;
  695. }
  696.  
  697. #sidedesc {
  698. background-color: {color:Inner};
  699. width: 250px;
  700. {block:IfShowCustomLinks}
  701. height: 215px;
  702. {/block:IfShowCustomLinks}
  703. {block:IfNotShowCustomLinks}
  704. height: 180px;
  705. {/block:IfNotShowCustomLinks}
  706. z-index: 500;
  707. overflow: hidden;
  708. -webkit-transition: opacity 0.5s linear;
  709. -webkit-transition: all 0.5s ease-in-out;
  710. -moz-transition: all 0.5s ease-in-out;
  711. -o-transition: all 0.5s ease-in-out;
  712. }
  713.  
  714. .desc {
  715. padding: 5px;
  716. letter-spacing: 1px;
  717. {block:IfShowCustomLinks}
  718. height: 180px;
  719. {/block:IfShowCustomLinks}
  720. {block:IfNotShowCustomLinks}
  721. height: 210px;
  722. {/block:IfNotShowCustomLinks}
  723. }
  724.  
  725. #invoke:hover #sidedesc {
  726. -webkit-transition: opacity 0.7s linear;
  727. -webkit-transition: all 0.7s ease-in-out;
  728. -moz-transition: all 0.7s ease-in-out;
  729. -o-transition: all 0.7s ease-in-out;
  730. padding-top: 210px;
  731. }
  732.  
  733. #vestige {
  734. width: 250px;
  735. height: 210px;
  736. z-index: 999;
  737. overflow: hidden;
  738. position: fixed;
  739. }
  740.  
  741. #vestige img {
  742. width: 250px;
  743. height: 210px;
  744. {block:IfFadeSidebarImage}
  745. opacity: 0.9;
  746. -webkit-transition: opacity 0.9s linear;
  747. -webkit-transition: all 0.9s ease-in-out;
  748. -moz-transition: all 0.9s ease-in-out;
  749. -o-transition: all 0.9s ease-in-out;
  750. {/block:IfFadeSidebarImage}
  751. {block:IfNotFadeSidebarImage}
  752. opacity: 1;
  753. {/block:IfNotFadeSidebarImage}
  754. }
  755.  
  756. #vestige img:hover {
  757. {block:IfFadeSidebarImage}
  758. opacity: 1;
  759. {/block:IfFadeSidebarImage}
  760. -webkit-transition: opacity 0.7s linear;
  761. -webkit-transition: all 0.7s ease-in-out;
  762. -moz-transition: all 0.7s ease-in-out;
  763. -o-transition: all 0.7s ease-in-out;
  764. }
  765.  
  766. /* CUSTOM LINKS */
  767.  
  768. #custom {
  769. display: block;
  770. width: 250px;
  771. height: 30px;
  772. overflow: hidden;
  773. }
  774.  
  775. .linkbox {
  776. float: left;
  777. letter-spacing: 1px;
  778. text-transform: uppercase;
  779. text-align: center;
  780. padding: 3px;
  781. font-family: consolas;
  782. font-size: 9px;
  783. margin: 0px 1px 0px 5px;
  784. line-height: 20px;
  785. width: 50px;
  786. height: 20px;
  787. overflow: hidden;
  788. -webkit-transition: opacity 0.5s linear;
  789. -webkit-transition: all 0.5s ease-in-out;
  790. -moz-transition: all 0.5s ease-in-out;
  791. -o-transition: all 0.5s ease-in-out;
  792. transition: all 0.5s ease-in-out;
  793. }
  794.  
  795. #link1, #link2, #link3, #link4 {
  796. color: {color:Link};
  797. background-color: {color:Custom links};
  798. }
  799.  
  800. #link1:hover {
  801. color: {color:Custom link hover};
  802. background-color: {color:Link 1 hover};
  803. }
  804.  
  805. #link2:hover {
  806. color: {color:Custom link hover};
  807. background-color: {color:Link 2 hover};
  808. }
  809.  
  810. #link3:hover {
  811. color: {color:Custom link hover};
  812. background-color: {color:Link 3 hover};
  813. }
  814.  
  815. #link4:hover {
  816. color: {color:Custom link hover};
  817. background-color: {color:Link 4 hover};
  818. }
  819.  
  820. /* SIDE NAVIGATION */
  821.  
  822. #navigate {
  823. display: block;
  824. margin-left: 960px;
  825. margin-top: 70px;
  826. border-left: 2px solid {color:Border};
  827. padding: 0 2px 1px;
  828. width: 80px;
  829. height: auto;
  830. position: fixed;
  831. }
  832.  
  833. .navtab {
  834. float: left;
  835. letter-spacing: 1px;
  836. text-transform: uppercase;
  837. text-align: center;
  838. padding: 3px;
  839. margin: 0px 1px 5px 5px;
  840. line-height: 25px;
  841. width: 75px;
  842. height: 25px;
  843. overflow: hidden;
  844. font-family: consolas;
  845. font-size: 9px;
  846. -webkit-transition: opacity 0.5s linear;
  847. -webkit-transition: all 0.5s ease-in-out;
  848. -moz-transition: all 0.5s ease-in-out;
  849. -o-transition: all 0.5s ease-in-out;
  850. transition: all 0.5s ease-in-out;
  851. }
  852.  
  853. #ask, #home, #archive, #themetab {
  854. color: {color:Link};
  855. background-color: {color:Custom links};
  856. }
  857.  
  858. #home:hover {
  859. color: {color:Custom link hover};
  860. background-color: {color:Link 1 hover};
  861. }
  862.  
  863. #ask:hover {
  864. color: {color:Custom link hover};
  865. background-color: {color:Link 2 hover};
  866. }
  867.  
  868. #archive:hover {
  869. color: {color:Custom link hover};
  870. background-color: {color:Link 3 hover};
  871. }
  872.  
  873. #themetab:hover {
  874. color: {color:Custom link hover};
  875. background-color: {color:Link 4 hover};
  876. }
  877.  
  878. /* MUSIC PLAYER */
  879.  
  880. #cornerplayer {
  881. z-index: 999;
  882. background-color: {color:Stats};
  883. width:50px;
  884. height:50px;
  885. border-radius:50px 0px 0px 0px;
  886. -moz-border-radius:50px 0px 0px 0px;
  887. position:fixed;
  888. overflow:hidden;
  889. bottom:0px;
  890. right:0px;
  891. -webkit-transition: opacity 0.8s linear;
  892. -webkit-transition: all 0.8s ease-in-out;
  893. -moz-transition: all 0.8s ease-in-out;
  894. -o-transition: all 0.8s ease-in-out;}
  895.  
  896. #icon {
  897. margin-top:25px;
  898. margin-bottom:20px;
  899. margin-left:-5px;
  900. -webkit-transition: opacity 0.8s linear;-webkit-transition: all 0.8s ease-in-out;-moz-transition: all 0.8s ease-in-out;-o-transition: all 0.8s ease-in-out;}
  901.  
  902. #cornerplayer:hover {
  903. width:200px;
  904. -moz-border-radius:0px;
  905. border-radius:0px;}
  906. #cornerplayer:hover #icon
  907. {margin-top:10px;
  908. margin-left:0px;
  909. margin-bottom:4px;
  910. }
  911.  
  912. /* SCROLLBARS */
  913. ::-webkit-scrollbar-thumb:vertical {
  914. background-color: {color:Link};
  915. height:100px;
  916. }
  917.  
  918. ::-webkit-scrollbar {
  919. height: 10px;
  920. width: 7px;
  921. background-color: {color:Background};
  922. }
  923.  
  924. /* TUMBLR CONTROLS */
  925. iframe#tumblr_controls {
  926. right: 3px !important;
  927. position: fixed !important;
  928. -webkit-transition: opacity 0.8s linear;
  929. -webkit-transition: all 0.8s ease-out;
  930. -moz-transition: all 0.8s ease-out;
  931. -ms-transition: all 0.8s ease-out;
  932. transition: all 0.8s ease-out;
  933. opacity: 0.2;
  934. }
  935.  
  936. iframe#tumblr_controls:hover {
  937. -webkit-transition: opacity 0.4s linear;
  938. -webkit-transition: all 0.4s ease-out;
  939. -moz-transition: all 0.4s ease-out;
  940. -ms-transition: all 0.4s ease-out;
  941. transition: all 0.4s ease-out;
  942. opacity: 1;
  943. }
  944.  
  945. {CustomCSS}
  946.  
  947. </style>
  948.  
  949. {block:IfInfiniteScroll}<script type="text/javascript" src="http://codysherman.com/tools/infinite-scrolling/code"></script>{/block:IfInfiniteScroll}
  950.  
  951. <script type="text/javascript" src="http://static.tumblr.com/gsojzab/P3jm3x3pr/jquery.js"></script>
  952.  
  953. {block:IfLazyLoad}<script type="text/javascript" src="http://static.tumblr.com/gsojzab/rGUm3x4b5/lazyload.js"></script>
  954.  
  955. <script type="text/javascript" charset="utf-8">
  956. var $j = jQuery.noConflict();
  957. $j(function() {
  958. if (navigator.platform == "iPad" || navigator.platform == "iPhone") return;
  959. $j("img").lazyload({
  960. placeholder : "http://static.tumblr.com/twte3d7/RSvlio0k5/grey.gif",
  961. effect: "fadeIn",
  962. });
  963. });
  964. </script>
  965. {/block:IfLazyLoad}
  966.  
  967. </head>
  968.  
  969. <body>
  970.  
  971. {block:IfShowMusicPlayer}
  972. <div id="cornerplayer">
  973. <center>
  974. <div id="icon"><img src="http://static.tumblr.com/gsojzab/s3em41bwx/minigif014.gif"/></div>
  975. <div>{text:Player code}</div>
  976. </center> </div>
  977. {/block:IfShowMusicPlayer}
  978.  
  979. {block:IfNotInfiniteScroll}{block:Pagination}
  980. <div class="paginate">
  981. {block:PreviousPage}<a href="{PreviousPage}"><div class="moveback" id="backarrow">&larr; BACK</div></a>{/block:PreviousPage}
  982. {block:NextPage}<a href="{NextPage}"><div class="movenext" id="nextarrow">NEXT &rarr;</div></a>{/block:NextPage}
  983. </div>
  984. {/block:Pagination}
  985. {/block:IfNotInfiniteScroll}
  986. {block:IfShowTitle}<div id="title">{Title}</div>{/block:IfShowTitle}
  987.  
  988. <div id="invoke">
  989. <div id="vestige"><img src="{image:Sidebar}" /></div>
  990. <div id="sidedesc"><div class="desc">{Description}</div>
  991. {block:IfShowCustomLinks}
  992. <div id="custom">
  993. <a href="{text:Link 1 URL}"><div class="linkbox" id="link1">{text:Link 1 Title}</div></a>
  994. <a href="{text:Link 2 URL}"><div class="linkbox" id="link2">{text:Link 2 Title}</div></a>
  995. <a href="{text:Link 3 URL}"><div class="linkbox" id="link3">{text:Link 3 Title}</div></a>
  996. <a href="{text:Link 4 URL}"><div class="linkbox" id="link4">{text:Link 4 Title}</div></a>
  997. </div>{/block:IfShowCustomLinks}
  998. </div>
  999. </div>
  1000.  
  1001. <div id="navigate">
  1002. <a href="/"><div class="navtab" id="home">HOME</div></a>
  1003. <a href="/ask"><div class="navtab" id="ask">MESSAGE</div></a>
  1004. <a href="/archive"><div class="navtab" id="archive">ARCHIVE</div></a>
  1005. <a href="http://hotlimit.tumblr.com" target="_blank"><div class="navtab" id="themetab">THEME</div></a>
  1006. </div>
  1007.  
  1008. <div class="autopagerize_page_element">
  1009. {block:Posts}
  1010. <div id="content">
  1011.  
  1012. <div class="entry">
  1013.  
  1014. {block:IndexPage}{block:Date}
  1015. <div id="stats"><a href="{Permalink}">{TimeAgo}</a> | {Year}/{MonthNumberWithZero}/{DayOfMonthWithZero} @ {24Hour}:{Minutes} |{block:NoteCount}<a href="{Permalink}">{NoteCountWithLabel}</a>|{/block:NoteCount}<a href="{ReblogURL}">Reblog</a></div>
  1016. {/block:Date}{/block:IndexPage}
  1017.  
  1018. {block:PermalinkPage}{block:Date}
  1019. <div id="permastats">{TimeAgo} | {Year}/{MonthNumberWithZero}/{DayOfMonthWithZero} @ {24Hour}:{Minutes} {block:NoteCount}| {NoteCountWithLabel}{/block:NoteCount}</div>
  1020. {/block:Date}{/block:PermalinkPage}
  1021.  
  1022. {block:Text}
  1023. {block:Title}
  1024. <header><a href="{Permalink}">{Title}</a></header>
  1025. {/block:Title}
  1026. {Body}
  1027. {/block:Text}
  1028.  
  1029. {block:Photo}
  1030. <div class="images">{LinkOpenTag}<img src="{PhotoURL-500}" alt="{PhotoAlt}"/>{LinkCloseTag}</div>
  1031. {block:IfShowCaptionsOnIndex}{block:Caption}
  1032. <div class="caption">{Caption}</div>
  1033. {/block:Caption}{/block:IfShowCaptionsOnIndex}
  1034. {block:IfNotShowCaptionsOnIndex}{block:PermalinkPage}
  1035. {block:Caption}
  1036. <div class="caption">{Caption}</div>
  1037. {/block:Caption}
  1038. {/block:PermalinkPage}{/block:IfNotShowCaptionsOnIndex}
  1039. {/block:Photo}
  1040.  
  1041. {block:Photoset}
  1042. <div class="images"><center>{Photoset-500}</center></div>
  1043. {block:IfShowCaptionsOnIndex}{block:Caption}
  1044. <div class="caption">{Caption}</div>
  1045. {/block:Caption}{/block:IfShowCaptionsOnIndex}
  1046. {block:IfNotShowCaptionsOnIndex}{block:PermalinkPage}
  1047. {block:Caption}
  1048. <div class="caption">{Caption}</div>
  1049. {/block:Caption}
  1050. {/block:PermalinkPage}{/block:IfNotShowCaptionsOnIndex}
  1051. {/block:Photoset}
  1052.  
  1053. {block:Quote}
  1054. <span class="quote">"{Quote}"</span>
  1055. {block:Source}
  1056. <div class="source">– {Source}</div>
  1057. {/block:Source}
  1058. {/block:Quote}
  1059.  
  1060. {block:Link}
  1061. <center><a href="{URL}" class="postlink" {Target}>{Name} &#8594;</a></center>
  1062. {block:Description}
  1063. <div class="description">{Description}</div>
  1064. {/block:Description}
  1065. {/block:Link}
  1066.  
  1067. {block:Chat}
  1068. {block:Title}
  1069. <header><a href="{Permalink}">{Title}</a></header>
  1070. {/block:Title}
  1071. <ul class="chat">
  1072. {block:Lines}
  1073. <li class="{Alt} user_{UserNumber}">
  1074. {block:Label}
  1075. <span class="label">{Label}</span>
  1076. {/block:Label}
  1077. {Line}
  1078. </li>
  1079. {/block:Lines}
  1080. </ul>
  1081. {/block:Chat}
  1082.  
  1083. {block:Video}
  1084. <center>{Video-500}</center>
  1085. {block:IfShowCaptionsOnIndex}{block:Caption}
  1086. <div class="caption">{Caption}</div>
  1087. {/block:Caption}{/block:IfShowCaptionsOnIndex}
  1088. {block:IfNotShowCaptionsOnIndex}{block:PermalinkPage}
  1089. {block:Caption}
  1090. <div class="caption">{Caption}</div>
  1091. {/block:Caption}
  1092. {/block:PermalinkPage}{/block:IfNotShowCaptionsOnIndex}
  1093. {/block:Video}
  1094.  
  1095. {block:Audio}
  1096. <div class="audiopost">
  1097. <table width="480" border="0" cellpadding="5">
  1098. <tbody>
  1099. <tr>
  1100. <td width="210">
  1101. <div id="musicbox">
  1102. <div id="blank"><img src="http://static.tumblr.com/gsojzab/kKqm40iu5/blank2.png" width="177px" height="177px" style="position:absolute; vertical-align:middle;">
  1103. {block:AlbumArt}
  1104. <div id="albumcover"><img width="177" height="177" src="{AlbumArtURL}" style="position:absolute;" /></div>{/block:AlbumArt}</div>
  1105. <div id="jewelcase"><img src="http://static.tumblr.com/gsojzab/7Unm40iur/jewelcase_mega.png" width="194" height="184" style="position:absolute;" /></div>
  1106. <div id="player"><div id="audiobutton">{AudioPlayerWhite}</div></div>
  1107. </div>
  1108. </td>
  1109. <td width="240">
  1110. <table class="id3">
  1111. {block:TrackName}
  1112. <tr>
  1113. <td class="tracktitle">{TrackName}</td>
  1114. </tr>
  1115. {/block:TrackName}
  1116.  
  1117. {block:Artist}
  1118. <tr>
  1119. <td class="trackartist">{Artist}</td>
  1120. </tr>
  1121. {/block:Artist}
  1122. {block:Album}
  1123. <tr>
  1124. <td class="trackalbum">{Album}</td>
  1125. </tr>
  1126. {/block:Album}
  1127. <tr>
  1128. <td class="playcount">Played {FormattedPlayCount} times</td>
  1129. </tr>
  1130. {block:ExternalAudio}
  1131. <tr>
  1132. <td class="external"><a href="{ExternalAudioURL}" target="_blank">Source</a></td>
  1133. </tr>
  1134. {/block:ExternalAudio}
  1135. </table>
  1136. </td>
  1137. </tr>
  1138. </tbody>
  1139. </table>
  1140. </div>
  1141. {block:IfShowCaptionsOnIndex}{block:Caption}
  1142. <div class="caption">{Caption}</div>
  1143. {/block:Caption}{/block:IfShowCaptionsOnIndex}
  1144. {block:IfNotShowCaptionsOnIndex}{block:PermalinkPage}
  1145. {block:Caption}
  1146. <div class="caption">{Caption}</div>
  1147. {/block:Caption}
  1148. {/block:PermalinkPage}{/block:IfNotShowCaptionsOnIndex}
  1149. {/block:Audio}
  1150.  
  1151. {block:Answer}
  1152. <div id="query">
  1153. <div id="question">{Question}</div>
  1154. <div class="arrow">◤</div>
  1155. <div id="asker"><img class="askicon" src="{AskerPortraitURL-16}" />
  1156. <a class="askername">{Asker}</div></div>
  1157. <div id="answer">{Answer}</div>
  1158. {/block:Answer}
  1159.  
  1160. {block:PermalinkPage}
  1161. <div class="origin">{block:RebloggedFrom}via <a href="{ReblogParentURL}">{ReblogParentName}</a>{/block:RebloggedFrom} {block:ContentSource}(source: <a href="{SourceURL}">{SourceLink}</a>){/block:ContentSource}</div>
  1162.  
  1163. {block:HasTags}<div id="meta">
  1164. <div class="tags">{block:Tags}#<a href="{TagURL}" class="tag">{Tag}</a> {/block:Tags}</div></div>{/block:HasTags}
  1165. {/block:PermalinkPage}
  1166.  
  1167. <div id="clear"></div>
  1168. </div>
  1169.  
  1170. {block:PostNotes}<div class="notes">{PostNotes}</div>{/block:PostNotes}
  1171.  
  1172. </div>
  1173. {/block:Posts}
  1174. </div>
  1175.  
  1176. </body>
  1177. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement