Tokyo-themes

aquatic

Dec 15th, 2016
2,847
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 29.99 KB | None | 0 0
  1. <!---
  2.  
  3. THEME: AQUATIC
  4. © tokyo-themes
  5. © roxiestheme // audio player
  6.  
  7. --->
  8.  
  9. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
  10. "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  11. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  12.  
  13. <head>
  14. <title>{Title}</title>
  15. <link rel="shortcut icon" href="{favicon}">
  16. <link rel="alternate" type="application/rss+xml" title="RSS" href="{RSS}" />
  17. <link rel="stylesheet" href="https://cdn.linearicons.com/free/1.0.0/icon-font.min.css">
  18. <link href="https://fonts.googleapis.com/css?family=Montserrat|Raleway" rel="stylesheet">
  19. <link href="/menu_assets/styles.css" rel="stylesheet" type="text/css">
  20. <link href="style-my-tooltips.css" rel="stylesheet" type="text/css" />
  21. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
  22. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  23.  
  24. <meta name="image:Image" content=""/>
  25. <meta name="image:Background" content=""/>
  26.  
  27. <meta name="color:Background" content="f5f5f5"/>
  28. <meta name="color:Text" content="777777"/>
  29. <meta name="color:Bold" content="5a5a5a" />
  30. <meta name="color:Italic" content="adadad" />
  31. <meta name="color:Strikethrough" content="66c6d2"/>
  32. <meta name="color:Underline" content="f45540"/>
  33. <meta name="color:Links" content="9a9a9a"/>
  34. <meta name="color:Links hovered" content="222222"/>
  35. <meta name="color:Borders" content="dddddd"/>
  36. <meta name="color:Title" content="ffffff"/>
  37. <meta name="color:Title bg" content="111111"/>
  38. <meta name="color:Sidebar" content="ffffff"/>
  39. <meta name="color:Description" content="868686"/>
  40. <meta name="color:Music player bg" content="ffffff"/>
  41. <meta name="color:Posts" content="ffffff"/>
  42. <meta name="color:Captions" content="868686"/>
  43. <meta name="color:Captions bg" content="eeeeee"/>
  44. <meta name="color:Icons" content="e26453"/>
  45. <meta name="color:Icons hovered" content="ffffff"/>
  46. <meta name="color:Icons bg hovered" content="66c6d2"/>
  47. <meta name="color:Extra links" content="0e6ba8"/>
  48. <meta name="color:Extra links hovered" content="ffffff"/>
  49. <meta name="color:Selected" content="ffffff"/>
  50. <meta name="color:Selected text" content="0a2472"/>
  51. <meta name="color:Scrollbar" content="0e6ba8"/>
  52.  
  53. <meta name="if:Light controls" content="1" />
  54. <meta name="if:Search bar" content="1" />
  55. <meta name="if:Fishes" content="1" />
  56. <meta name="if:Music player" content="1" />
  57. <meta name="if:250px" content="0" />
  58. <meta name="if:400px" content="1" />
  59. <meta name="if:500px" content="0" />
  60. <meta name="if:Tags" content="1" />
  61. <meta name="if:Captions" content="1" />
  62.  
  63. <meta name="text:Billy player code" content=""/>
  64. <meta name="text:Fish tank" content="F2F9FC"/>
  65. <meta name="text:Fish food" content="aaaaaa"/>
  66. <meta name="text:Fish a" content="66C6D2"/>
  67. <meta name="text:Fish b" content="0a2472"/>
  68. <meta name="text:Fish c" content="0e6ba8"/>
  69. <meta name="text:Fish d" content="a6e1fa"/>
  70. <meta name="text:Fish e" content="F45540"/>
  71. <meta name="text:link1 title" content="link 1"/>
  72. <meta name="text:link1 url" content="http://"/>
  73. <meta name="text:link2 title" content="link 2"/>
  74. <meta name="text:link2 url" content="http://"/>
  75. <meta name="text:link3 title" content="link 3"/>
  76. <meta name="text:link3 url" content="http://"/>
  77. <meta name="text:link4 title" content="link 4"/>
  78. <meta name="text:link4 url" content="http://"/>
  79. <meta name="text:link5 title" content="link 5"/>
  80. <meta name="text:link5 url" content="http://"/>
  81.  
  82. <style type="text/css">
  83.  
  84. #tumblr_controls,
  85. .tmblr-iframe.tmblr-iframe--desktop-logged-in-controls {
  86. top:10px!important;
  87. right:10px!important;
  88. opacity:0.5!important;
  89. {block:IndexPage}
  90. width:100px!important;
  91. {/block:IndexPage}
  92. {block:PermalinkPage}
  93. width:30px!important;
  94. {/block:PermalinkPage}
  95. overflow:hidden!important;
  96. position:fixed!important;
  97. z-index:999999!important;
  98. {block:iflightcontrols}
  99. -webkit-filter:invert(100%);
  100. {/block:iflightcontrols}
  101. -webkit-transition: opacity 0.5s linear;
  102. -webkit-transition: all 0.5s ease-in-out;
  103. -moz-transition: all 0.5s ease-in-out;
  104. -o-transition: all 0.5s ease-in-out;
  105. }
  106.  
  107. #tumblr_controls,
  108. .tmblr-iframe.tmblr-iframe--desktop-logged-in-controls:hover {
  109. width:100%!important;
  110. -webkit-transition: opacity 0.5s linear;
  111. -webkit-transition: all 0.5s ease-in-out;
  112. -moz-transition: all 0.5s ease-in-out;
  113. -o-transition: all 0.5s ease-in-out;
  114. }
  115.  
  116.  
  117. /* Scrollbar & Selected Text */
  118.  
  119. ::-webkit-scrollbar {
  120. height: 20px;
  121. width: 20px;
  122. background: {color:background};
  123. }
  124.  
  125. ::-webkit-scrollbar-thumb {
  126. border-radius: 100px;
  127. border: 9px solid {color:background};
  128. background: {color:scrollbar};
  129. }
  130.  
  131. ::selection {
  132. color: {color:selected text};
  133. background: {color:selected};
  134. }
  135.  
  136. ::-moz-selection {
  137. color: {color:selected text};
  138. background: {color:selected};
  139. }
  140.  
  141. ::-webkit-selection {
  142. color: {color:selected text};
  143. background: {color:selected};
  144. }
  145.  
  146. /* End of Scrollbar & Selected text */
  147.  
  148.  
  149.  
  150.  
  151. body{
  152. color: {color:text};
  153. line-height: 15px;
  154. font-size: 10px;
  155. font-family: consolas;
  156. background: {color:background} url('{image:background}') center repeat fixed;
  157. }
  158.  
  159. a{
  160. cursor:help;
  161. color: {color:links};
  162. text-decoration: none;
  163. -webkit-transition: opacity 0.5s linear;
  164. -webkit-transition: all 0.5s ease-in-out;
  165. -moz-transition: all 0.5s ease-in-out;
  166. -o-transition: all 0.5s ease-in-out;
  167. }
  168.  
  169. a:hover{
  170. color: {color:links hovered};
  171. -webkit-transition: opacity 0.5s linear;
  172. -webkit-transition: all 0.5s ease-in-out;
  173. -moz-transition: all 0.5s ease-in-out;
  174. -o-transition: all 0.5s ease-in-out;
  175. }
  176.  
  177. b{
  178. color: {color:bold};
  179. font-weight: bold;
  180. }
  181.  
  182. i{
  183. color: {color:italics};
  184. font-style: italic;
  185. }
  186.  
  187. s{
  188. color: {color:strikethrough};
  189. text-decoration: line-through;
  190. }
  191.  
  192. u{
  193. color: {color:underline};
  194. text-decoration: underline;
  195. }
  196.  
  197. #s-m-t-tooltip{
  198. margin-top:-20px;
  199. margin-left:20px;
  200. max-width:300px;
  201. padding: 3px 8px;
  202. color: {color:bold};
  203. border:1px solid {color:borders};
  204. background: {color:posts};
  205. z-index:10000000;
  206. }
  207.  
  208.  
  209.  
  210. /* Title & Fishes */
  211. #titlebg{
  212. top:0px;
  213. left:0;
  214. height:100%;
  215. width:4%;
  216. color:{color:title};
  217. background:{color:title bg};
  218. z-index:1;
  219. position: fixed;
  220. }
  221.  
  222. .title{
  223. top:50%;
  224. left:50%;
  225. width:1ex;
  226. font-size: 10px;
  227. font-weight: bold;
  228. text-transform: uppercase;
  229. word-wrap: break-word;
  230. transform: translate(-50%, -50%);
  231. position:absolute;
  232. }
  233.  
  234.  
  235. #fishes{
  236. top:0px;
  237. left:4%;
  238. height:100%;
  239. width:5%;
  240. background:#{text:fish tank};
  241. z-index:1;
  242. position: fixed;
  243. }
  244. /* End of Title & Fishes */
  245.  
  246.  
  247.  
  248.  
  249. /* Sidebar */
  250. #side{
  251. bottom:100px;
  252. width:240px;
  253. z-index:3;
  254. position:fixed;
  255. }
  256.  
  257.  
  258. .image{
  259. margin:0px 0px -30px -60px;
  260. height:80px;
  261. width:80px;
  262. border:10px solid {color:sidebar};
  263. border-radius:100px;
  264. background:{color:sidebar};
  265. overflow:hidden;
  266. }
  267.  
  268. .image img{
  269. height:80px;
  270. width:80px;
  271. border-radius:100px;
  272. -webkit-transition: opacity 0.5s linear;
  273. -webkit-transition: all 0.5s ease-in-out;
  274. -moz-transition: all 0.5s ease-in-out;
  275. -o-transition: all 0.5s ease-in-out;
  276. }
  277.  
  278. .image:hover img{
  279. opacity:0.5;
  280. filter: blur(3px);
  281. -webkit-filter: blur(3px);
  282. -moz-filter: blur(3px);
  283. -o-filter: blur(3px);
  284. -webkit-transition: opacity 0.5s linear;
  285. -webkit-transition: all 0.5s ease-in-out;
  286. -moz-transition: all 0.5s ease-in-out;
  287. -o-transition: all 0.5s ease-in-out;
  288. }
  289.  
  290. #music{
  291. margin-top:-86px;
  292. margin-left:-1px;
  293. height:20px;
  294. width:20px;
  295. border: 31px solid {color:music player bg};
  296. border-radius: 100px;
  297. opacity:0;
  298. overflow:hidden;
  299. position:absolute;
  300. -webkit-transition: opacity 0.5s linear;
  301. -webkit-transition: all 0.5s ease-in-out;
  302. -moz-transition: all 0.5s ease-in-out;
  303. -o-transition: all 0.5s ease-in-out;
  304. }
  305.  
  306. #music embed{
  307. margin-top:2px;
  308. margin-left:-20px;
  309. }
  310.  
  311. .image:hover #music{
  312. opacity:0.8;
  313. -webkit-transition: opacity 0.5s linear;
  314. -webkit-transition: all 0.5s ease-in-out;
  315. -moz-transition: all 0.5s ease-in-out;
  316. -o-transition: all 0.5s ease-in-out;
  317. }
  318.  
  319. .micons span{
  320. height:20px;
  321. width:20px;
  322. color: {color:icons};
  323. padding:2px;
  324. border-radius:20px;
  325. font-size:11px;
  326. line-height:20px;
  327. font-weight: bold;
  328. text-align:center;
  329. background: {color:sidebar};
  330. overflow:hidden;
  331. display:inline-block;
  332. -webkit-transition: opacity 0.5s linear;
  333. -webkit-transition: all 0.5s ease-in-out;
  334. -moz-transition: all 0.5s ease-in-out;
  335. -o-transition: all 0.5s ease-in-out;
  336. }
  337.  
  338. .micons span:hover{ color:{color:icons hovered}; }
  339.  
  340. .micons span:hover .ibg{ height:36px; }
  341.  
  342. .ibg{
  343. margin-top:-30px;
  344. margin-left:-6px;
  345. height:0px;
  346. width:36px;
  347. background:{color:icons bg hovered};
  348. -webkit-transition: opacity 0.5s linear;
  349. -webkit-transition: all 0.5s ease-in-out;
  350. -moz-transition: all 0.5s ease-in-out;
  351. -o-transition: all 0.5s ease-in-out;
  352. }
  353.  
  354. .ititle{
  355. margin-top:0px;
  356. margin-left:-60px;
  357. width:80px;
  358. height:80px;
  359. line-height:80px;
  360. text-align:center;
  361. color: {color:text};
  362. border:10px solid {color:sidebar};
  363. border-radius:80px;
  364. background:{color:sidebar};
  365. opacity: 0;
  366. display: block;
  367. position: fixed;
  368. -webkit-transition: opacity 0.5s linear;
  369. -webkit-transition: all 0.5s ease-in-out;
  370. -moz-transition: all 0.5s ease-in-out;
  371. -o-transition: all 0.5s ease-in-out;
  372. }
  373.  
  374. .micons a:hover .ititle{ opacity:1; }
  375.  
  376. .searchbar{
  377. margin-top:-30px;
  378. margin-left:90px;
  379. position:absolute;
  380. }
  381.  
  382. .search .query {
  383. border: 0;
  384. outline: 0;
  385. padding: 5px;
  386. font-family: inherit;
  387. font-size: inherit;
  388. color: inherit;
  389. background: {color:sidebar};
  390. }
  391.  
  392. .sicon{
  393. height: 16px;
  394. padding:3px;
  395. vertical-align: top;
  396. background: {color:sidebar};
  397. }
  398.  
  399. .noshow{
  400. height:100%;
  401. opacity:0;
  402. z-index:-1;
  403. -webkit-transition: opacity 0.5s linear;
  404. -webkit-transition: all 0.5s ease-in-out;
  405. -moz-transition: all 0.5s ease-in-out;
  406. -o-transition: all 0.5s ease-in-out;
  407. }
  408.  
  409. .show{
  410. height:100%;
  411. opacity:1;
  412. z-index:9999;
  413. -webkit-transition: opacity 0.5s linear;
  414. -webkit-transition: all 0.5s ease-in-out;
  415. -moz-transition: all 0.5s ease-in-out;
  416. -o-transition: all 0.5s ease-in-out;
  417. }
  418.  
  419. #morea{
  420. margin-left:80px;
  421. margin-top:34px;
  422. height:25px;
  423. width:150px;
  424. padding:5px;
  425. text-align:center;
  426. background: {color:background} url('{image:background}') center repeat fixed;
  427. position:absolute;
  428. }
  429.  
  430. #morea a{
  431. width:20px;
  432. height:20px;
  433. padding:2px;
  434. color: {color:icons};
  435. line-height:20px;
  436. font-size:11px;
  437. text-align:center;
  438. border-radius:20px;
  439. background: {color:sidebar};
  440. display:inline-block;
  441. overflow:hidden;
  442. -webkit-transition: opacity 0.5s linear;
  443. -webkit-transition: all 0.5s ease-in-out;
  444. -moz-transition: all 0.5s ease-in-out;
  445. -o-transition: all 0.5s ease-in-out;
  446. }
  447.  
  448. #morea a:hover{
  449. color:{color:icons hovered};
  450. }
  451.  
  452. #morea a:hover .ibg{
  453. height:36px;
  454. }
  455.  
  456.  
  457. .descr{
  458. margin-left:0px;
  459. width:200px;
  460. padding:20px;
  461. color: {color:description};
  462. text-align:left;
  463. background: {color:sidebar};
  464. }
  465.  
  466. .pagination{
  467. margin:20px 0px;
  468. text-align:center;
  469. }
  470.  
  471. .pagination a{
  472. color: {color:icons};
  473. -webkit-transition: opacity 0.5s linear;
  474. -webkit-transition: all 0.5s ease-in-out;
  475. -moz-transition: all 0.5s ease-in-out;
  476. -o-transition: all 0.5s ease-in-out;
  477. }
  478.  
  479. .jump_page {
  480. padding: 4px 8px;
  481. color:{color:icons};
  482. font-size:11px;
  483. text-decoration:none;
  484. background: {color:sidebar};
  485. }
  486.  
  487. .current_page, .jump_page:hover {
  488. padding: 4px 8px;
  489. color: {color:icons hovered};
  490. font-size:11px;
  491. text-decoration:none;
  492. background: {color:icons bg hovered};
  493. }
  494. /* End of Sidebar */
  495.  
  496.  
  497.  
  498. #center{
  499. margin-top:0px;
  500. margin-left:auto;
  501. margin-right: auto;
  502. height:auto;
  503. {block:if500px}
  504. width:840px;
  505. {/block:if500px}
  506. {block:if400px}
  507. width: 740px;
  508. {/block:if400px}
  509. {block:if250px}
  510. width:950px;
  511. {/block:if250px}
  512. {block:PermalinkPage}
  513. width:840px;
  514. {/block:PermalinkPage}
  515. z-index:3;
  516. position: relative;
  517. }
  518.  
  519.  
  520.  
  521. /* Posts */
  522. {block:iflightcontrols}
  523. .vignette, #vignette {
  524. opacity:0;
  525. }
  526. .lightbox-image, #tumblr_lightbox img {
  527. box-shadow:none !important;
  528. border-radius:0 !important;
  529. max-width:none;
  530. border:5px solid #fff !important;
  531. -moz-box-sizing:border-box;
  532. box-sizing:border-box;
  533. }
  534.  
  535. .tmblr-lightbox, #tumblr_lightbox {
  536. background-color:rgba(255,255,255,.9) !important;
  537. }
  538.  
  539. .lightbox-caption, #tumblr_lightbox_caption {
  540. visibility:hidden;
  541. }
  542. {/block:iflightcontrols}
  543.  
  544.  
  545. #entry{
  546. top:50px;
  547. left: 250px;
  548. {block:if500px}
  549. width: 580px;
  550. {/block:if500px}
  551. {block:if400px}
  552. width: 480px;
  553. {/block:if400px}
  554. {block:if250px}
  555. width: 700px;
  556. {/block:if250px}
  557. {block:PermalinkPage}
  558. width: 580px;
  559. {/block:PermalinkPage}
  560. overflow: hidden;
  561. z-index:3;
  562. float:left;
  563. display: block;
  564. position: relative;
  565. }
  566.  
  567. .posts{
  568. margin:60px 25px;
  569. height: auto;
  570. {block:if500px}
  571. width: 500px;
  572. {/block:if500px}
  573. {block:if400px}
  574. width: 400px;
  575. {/block:if400px}
  576. {block:if250px}
  577. width: 250px;
  578. {/block:if250px}
  579. {block:PermalinkPage}
  580. width: 500px;
  581. {/block:PermalinkPage}
  582. padding:20px;
  583. border:1px solid {color:borders};
  584. background: {color:posts};
  585. float: left;
  586. position: relative;
  587. }
  588.  
  589. .posts img{
  590. max-width: 100%;
  591. }
  592.  
  593. .captions{
  594. margin-top:20px;
  595. {block:if500px}
  596. width: 460px;
  597. {/block:if500px}
  598. {block:if400px}
  599. width: 360px;
  600. {/block:if400px}
  601. {block:if250px}
  602. width: 210px;
  603. {/block:if250px}
  604. padding:20px;
  605. color: {color:captions};
  606. font-size: 10px;
  607. text-align: left;
  608. border:1px solid {color:borders};
  609. background: {color:captions bg};
  610. }
  611.  
  612. .ptitle{
  613. margin-bottom: 10px;
  614. height: 15px;
  615. width: 100%;
  616. padding: 5px 0px;
  617. color: {color:bold};
  618. text-align: right;
  619. font-size: 15px;
  620. font-weight: bold;
  621. text-transform: uppercase;
  622. font-family: 'Raleway', sans-serif;
  623. letter-spacing: 1px;
  624. }
  625.  
  626. .plink{
  627. margin-right: 0px;
  628. margin-bottom: 10px;
  629. height: 15px;
  630. width: 100%;
  631. padding: 5px 0px;
  632. text-align: right;
  633. font-size: 15px;
  634. font-weight: bold;
  635. font-style: italic;
  636. text-transform: uppercase;
  637. font-family: 'Raleway', sans-serif;
  638. letter-spacing: 1px;
  639. }
  640.  
  641. .line{
  642. margin-top: 6px;
  643. margin-right: 0px;
  644. height: 2px;
  645. width: 0px;
  646. background: {color:borders};
  647. position: absolute;
  648. -webkit-transition: opacity 0.5s linear;
  649. -webkit-transition: all 0.5s ease-in-out;
  650. -moz-transition: all 0.5s ease-in-out;
  651. -o-transition: all 0.5s ease-in-out;
  652. }
  653.  
  654. .plink:hover .line{
  655. height: 2px;
  656. width: 25%;
  657. -webkit-transition: opacity 0.5s linear;
  658. -webkit-transition: all 0.5s ease-in-out;
  659. -moz-transition: all 0.5s ease-in-out;
  660. -o-transition: all 0.5s ease-in-out;
  661. }
  662.  
  663. .player{
  664. width:80px;
  665. overflow:hidden;
  666. }
  667. .audio {
  668. top: 0;
  669. right:0px;
  670. width: calc(100% - 121px);
  671. height: calc(85px - 40px);
  672. padding: 20px;
  673. font-size: 11px;
  674. text-align: left;
  675. background: {color:posts};
  676. position: absolute;
  677. }
  678.  
  679. .player{
  680. margin-top: 10px;
  681. height: 27px;
  682. width: 28px;
  683. {block:iflightcontrols}
  684. border: 20px solid #fff;
  685. {/block:iflightcontrols}
  686. {block:ifnotlightcontrols}
  687. border: 20px solid #000;
  688. {/block:ifnotlightcontrols}
  689. overflow: hidden;
  690. position: relative;
  691. }
  692.  
  693. .player n{
  694. top: -38px;
  695. left: -10px;
  696. position: absolute;
  697. }
  698.  
  699.  
  700. .quotes{
  701. color: {color:bold};
  702. font-size: 14px;
  703. text-align: center;
  704. font-weight: bold;
  705. font-style: italic;
  706. text-transform: uppercase;
  707. font-family: 'Raleway', sans-serif;
  708. }
  709.  
  710. .quotes i{
  711. margin: 5px;
  712. color: {color:italics};
  713. font-size: 20px;
  714. font-family: consolas;
  715. }
  716.  
  717. .quotes_sources{
  718. font-size: 11px;
  719. text-align: right;
  720. font-style: italic;
  721. text-transform: uppercase;
  722. }
  723.  
  724. .asker img{
  725. margin-right: 10px;
  726. height: 40px;
  727. width: 40px;
  728. padding:5px;
  729. border-radius:40px;
  730. float: left;
  731. }
  732.  
  733. .ask{
  734. min-height: 80px;
  735. padding: 10px;
  736. font-size: 10px;
  737. text-align: left;
  738. border: 1px solid {color:borders};
  739. background:{color:captions bg};
  740. }
  741.  
  742. .askname{
  743. margin-bottom: 10px;
  744. padding: 5px;
  745. font-size: 15px;
  746. text-align: left;
  747. text-transform: uppercase;
  748. letter-spacing: 1px;
  749. }
  750.  
  751. .answer{
  752. margin-top: 10px;
  753. padding: 10px;
  754. font-size: 10px;
  755. text-align: right;
  756. border: 1px solid {color:borders};
  757. background:{color:captions bg};
  758. }
  759.  
  760. .odd .chat{
  761. padding: 10px 0px;
  762. color: {color:italics};
  763. font-size: 10px;
  764. font-style: italic;
  765. border-bottom: 1px solid {color:borders};
  766. }
  767.  
  768. .even .chat{
  769. padding: 10px 0px;
  770. color: {color:bold};
  771. font-size: 10px;
  772. font-style: italic;
  773. border-bottom: 1px solid {color:borders};
  774. }
  775.  
  776. /* Permalinks */
  777. .timeago{
  778. top: -25px;
  779. right: 0px;
  780. height:22px;
  781. width: 100%;
  782. line-height:22px;
  783. font-size: 10px;
  784. text-align:right;
  785. font-style: italic;
  786. position: absolute;
  787. }
  788.  
  789. .perma{
  790. margin-top: 25px;
  791. left: 0px;
  792. position: absolute;
  793. }
  794.  
  795. .perma span{
  796. height:20px;
  797. width:20px;
  798. color: {color:icons};
  799. line-height:20px;
  800. font-size:10px;
  801. text-align:center;
  802. font-weight: bold;
  803. border:1px solid {color:borders};
  804. border-radius:100%;
  805. background: {color:posts};
  806. display:inline-block;
  807. }
  808.  
  809.  
  810. .like-b {
  811. position:relative;
  812. display:inline-block;
  813. height:22px;
  814. width:22px;
  815. overflow:hidden;
  816. margin-bottom:-7px;
  817. }
  818. .like-b .like_button iframe {
  819. position:absolute;
  820. top:0;
  821. left:0;
  822. bottom:0;
  823. right:0;
  824. z-index:2;
  825. opacity:0;
  826. }
  827. .like-b .liked + span{
  828. color:red;
  829. }
  830.  
  831.  
  832. .tagged{
  833. margin:-22px 0px 0px 83px;
  834. height:20px;
  835. {block:if500px}
  836. width:436px;
  837. {/block:if500px}
  838. {block:if400px}
  839. width: 336px;
  840. {/block:if400px}
  841. {block:if250px}
  842. width: 186px;
  843. {/block:if250px}
  844. padding: 0px 10px;
  845. line-height:20px;
  846. font-size:10px;
  847. border:1px solid transparent;
  848. overflow:hidden;
  849. display:inline-block;
  850. position:absolute;
  851. }
  852.  
  853. .noting{
  854. margin: 50px 0px 50px -20px;
  855. height: auto;
  856. width: 500px;
  857. padding: 20px;
  858. border-top: 1px solid {color:borders};
  859. border-bottom: 1px solid {color:borders};
  860. background:{color:posts};
  861. }
  862.  
  863. ol.notes{
  864. margin: 25px 0px;
  865. padding: 0px;
  866. list-style-type: none;
  867. }
  868.  
  869. ol.notes li.note{
  870. padding: 10px;
  871. }
  872.  
  873. ol.notes li.note img.avatar{
  874. display: none;
  875. }
  876.  
  877. blockquote{
  878. margin-left: 6px;
  879. padding-left: 10px;
  880. border-left: 1px solid {color:borders};
  881. }
  882. /* End of Permalinks */
  883.  
  884. /* End of Posts */
  885.  
  886.  
  887. .crd{
  888. right: 15px;
  889. bottom: 15px;
  890. height:20px;
  891. width:10px;
  892. padding:0px 10px;
  893. line-height:20px;
  894. background: {color:background} url('{image:background}') center repeat fixed;
  895. overflow:hidden;
  896. z-index: 4;
  897. position: fixed;
  898. -webkit-transition: opacity 0.5s linear;
  899. -webkit-transition: all 0.5s ease-in-out;
  900. -moz-transition: all 0.5s ease-in-out;
  901. -o-transition: all 0.5s ease-in-out;
  902. }
  903.  
  904. .crd:hover{
  905. width:105px;
  906. }
  907.  
  908. .crd a{
  909. color:{color:links};
  910. font-size: 10px;
  911. text-align:right;
  912. font-weight: bold;
  913. text-transform: uppercase;
  914. font-family: 'Raleway', sans-serif;
  915. letter-spacing: 1px;
  916. }
  917.  
  918. {CustomCSS}
  919.  
  920. </style>
  921.  
  922.  
  923. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script><script type="text/javascript" src="http://static.tumblr.com/7qjmkr5/IUmmdsy41/jquery.style-my-tooltips.js"></script><script>(function($){$(document).ready(function(){$("[title]").style_my_tooltips();});})(jQuery);</script> <!--- ToolTips --->
  924.  
  925. <script type="text/javascript">
  926. $(document).ready(function(){
  927. $(".menu").click(function(){
  928. $(".noshow").toggleClass("show");
  929. });
  930. });
  931. </script> <!--- ToggleMenu --->
  932.  
  933. <script>
  934. $(document).ready(function(){
  935. $('.search').submit(function(event){
  936. var value = $('input:first').val();
  937. location.replace('http://{Name}.tumblr.com/tagged/' + value);
  938. });
  939. });
  940. </script> <!--- SearchBar --->
  941.  
  942. {block:if250px}
  943. {block:IndexPage}
  944. <script src="http://static.tumblr.com/twte3d7/H8Glm663z/masonry.js"></script>
  945. <script type="text/javascript">
  946. $(window).load(function () {
  947. $('#entry').masonry({
  948. itemSelector : ".posts",
  949. },
  950. function() { $('#entry').masonry({ appendedContent: $(this) }); }
  951. );
  952. });
  953. </script> <!--- Masonry --->
  954. {/block:IndexPage}
  955. {/block:if250px}
  956.  
  957. <script>
  958. $(document).ready(function() {
  959. $('iframe.tumblr_audio_player').load( function() {
  960. $('iframe.tumblr_audio_player').contents().find("head")
  961. .append($("<style type='text/css'> .audio-player{background:{color:accent} !important} </style>"));
  962. });
  963. });
  964. </script> <!--- Audio Player --->
  965. </head>
  966.  
  967. <body>
  968.  
  969.  
  970.  
  971.  
  972. <div id="titlebg"><div class="title">
  973. {title}
  974. </div></div>
  975.  
  976. {block:Iffishes}
  977. <div id="fishes">
  978. <object type="application/x-shockwave-flash" style="outline:none;" data="http://cdn.abowman.com/widgets/fish/fish.swf?up_fishColor2={text:fish a}&up_fishColor3={text:fish b}&up_fishColor1={text:fish c}&up_foodColor={text:fish food}&up_backgroundImage=http://&up_fishName=Fish&up_fishColor6={text:fish d}&up_backgroundColor={text:fish tank}&up_fishColor9={text:fish e}&up_numFish=10&up_fishColor10={text:fish a}&up_fishColor4={text:fish b}&up_fishColor5={text:fish c}&up_fishColor8={text:fish d}&up_fishColor7={text:fish e}&" width="100%" height="100%"><param name="movie" value="http://cdn.abowman.com/widgets/fish/fish.swf?up_fishColor2={text:fish a}&up_fishColor3={text:fish b}&up_fishColor1={text:fish c}&up_foodColor={text:fish food}&up_backgroundImage=http://&up_fishName=Fish&up_fishColor6={text:fish d}&up_backgroundColor={text:fish tank}&up_fishColor9={text:fish e}&up_numFish=10&up_fishColor10={text:fish a}&up_fishColor4={text:fish b}&up_fishColor5={text:fish c}&up_fishColor8={text:fish d}&up_fishColor7={text:fish e}&"></param><param name="AllowScriptAccess" value="always"></param><param name="wmode" value="opaque"></param><param name="scale" value="noscale"/><param name="salign" value="tl"/></object>
  979. </div>
  980. {/block:Iffishes}
  981.  
  982.  
  983.  
  984. <div id="center">
  985.  
  986.  
  987.  
  988. <div id="side">
  989.  
  990. <div class="micons">
  991. <a href="/">
  992. <span class="lnr lnr-home" style="margin:0px 0px 0px -30px;">
  993. <div class="ibg"></div>
  994. </span>
  995. <div class="ititle">refresh</div>
  996. </a>
  997.  
  998. <a href="/ask">
  999. <span class="lnr lnr-bubble" style="margin:0px 0px -5px 10px;">
  1000. <div class="ibg"></div>
  1001. </span>
  1002. <div class="ititle">message</div>
  1003. </a>
  1004.  
  1005. <a href="/archive">
  1006. <span class="lnr lnr-calendar-full" style="margin:0px 0px -30px 0px;">
  1007. <div class="ibg"></div>
  1008. </span>
  1009. <div class="ititle">archive</div>
  1010. </a>
  1011.  
  1012. <a class="menu">
  1013. <span class="lnr lnr-menu" style="margin:0px 0px -68px -20px;">
  1014. <div class="ibg"></div>
  1015. </span>
  1016. <div class="ititle">more</div>
  1017. </a>
  1018. </div>
  1019.  
  1020. <div id="morea" class="noshow">
  1021. {block:Iflink1title}
  1022. <a href="{text:link1 url}" title="{text:link1 title}">
  1023. 01
  1024. <div class="ibg"></div>
  1025. </a>
  1026. {/block:Iflink1title}
  1027. {block:Iflink2title}
  1028. <a href="{text:link2 url}" title="{text:link2 title}">
  1029. 02
  1030. <div class="ibg"></div>
  1031. </a>
  1032. {/block:Iflink2title}
  1033. {block:Iflink3title}
  1034. <a href="{text:link3 url}" title="{text:link3 title}">
  1035. 03
  1036. <div class="ibg"></div>
  1037. </a>
  1038. {/block:Iflink3title}
  1039. {block:Iflink4title}
  1040. <a href="{text:link4 url}" title="{text:link4 title}">
  1041. 04
  1042. <div class="ibg"></div>
  1043. </a>
  1044. {/block:Iflink4title}
  1045. {block:Iflink5title}
  1046. <a href="{text:link5 url}" title="{text:link5 title}">
  1047. 05
  1048. <div class="ibg"></div>
  1049. </a>
  1050. {/block:Iflink5title}
  1051. </div>
  1052.  
  1053. <div class="image">
  1054. <img src="{image:image}">
  1055. {block:Ifmusicplayer}
  1056. <div id="music">
  1057. {text:billy player code}
  1058. </div>
  1059. {/block:Ifmusicplayer}
  1060. </div>
  1061.  
  1062. {block:ifsearchbar}
  1063. <div class="searchbar">
  1064. <form class="search" action="javascript:return false">
  1065. <input type="text" class="query" placeholder="search">
  1066. <input type="image" value="search" src="http://static.tumblr.com/f1skqpy/Oxbn13qun/search_icon.png" class="sicon"/>
  1067. </form>
  1068. </div>
  1069. {/block:ifsearchbar}
  1070.  
  1071. <div class="descr">{Description}</div>
  1072.  
  1073. {block:Pagination}
  1074. <div class="pagination">
  1075. {block:PreviousPage}<a href="{PreviousPage}" class="jump_page">&laquo;</a>{/block:PreviousPage}
  1076. {block:JumpPagination length="5"}
  1077. {block:CurrentPage}<span class="current_page">{PageNumber}</span>{/block:CurrentPage}
  1078. {block:JumpPage}<a class="jump_page" href="{URL}">{PageNumber}</a>{/block:JumpPage}{/block:JumpPagination}
  1079. {block:NextPage}<a href="{NextPage}" class="jump_page">&raquo;</a>{/block:NextPage}
  1080. </div>
  1081. {/block:Pagination}
  1082.  
  1083. </div>
  1084.  
  1085.  
  1086.  
  1087. <div id="entry">
  1088. {block:Posts}
  1089. <div class="posts" id="{PostID}">
  1090.  
  1091.  
  1092.  
  1093. {block:IndexPage}
  1094. <div class="timeago">
  1095. {Month} {DayOfMonth}{DayOfMonthSuffix}
  1096. </div>
  1097. {/block:IndexPage}
  1098.  
  1099.  
  1100.  
  1101.  
  1102. {block:Photo}
  1103. {LinkOpenTag}
  1104. <img src="{PhotoURL-HighRes}" width="100%">
  1105. {LinkCloseTag}
  1106. {block:IndexPage}
  1107. {block:ifcaptions}
  1108. {block:Caption}
  1109. <div class="captions">
  1110. {Caption}
  1111. </div>
  1112. {/block:Caption}
  1113. {/block:ifcaptions}
  1114. {/block:IndexPage}
  1115. {block:PermalinkPage}
  1116. {block:Caption}
  1117. {Caption}
  1118. {/block:Caption}
  1119. {/block:PermalinkPage}
  1120. {/block:Photo}
  1121.  
  1122.  
  1123.  
  1124.  
  1125. {block:Photoset}
  1126. {Photoset}
  1127. {block:IndexPage}
  1128. {block:ifcaptions}
  1129. {block:Caption}
  1130. <div class="captions">
  1131. {Caption}
  1132. </div>
  1133. {/block:Caption}
  1134. {/block:ifcaptions}
  1135. {/block:IndexPage}
  1136. {block:PermalinkPage}
  1137. {block:Caption}
  1138. {Caption}
  1139. {/block:Caption}
  1140. {/block:PermalinkPage}
  1141. {/block:Photoset}
  1142.  
  1143.  
  1144.  
  1145.  
  1146. {block:Text}
  1147. {block:Title}
  1148. <div class="ptitle">
  1149. {Title}
  1150. </div>
  1151. {/block:Title}
  1152. {Body}
  1153. {/block:Text}
  1154.  
  1155.  
  1156.  
  1157.  
  1158. {block:Link}
  1159. <div class="plink">
  1160. <div class="line"></div>
  1161. <a href="{URL}">{Name}</a>
  1162. </div>
  1163. {block:Description}
  1164. {Description}
  1165. {/block:Description}
  1166. {/block:Link}
  1167.  
  1168.  
  1169.  
  1170.  
  1171.  
  1172. {block:Quote}
  1173. <div class="quotes">
  1174. <i>"</i>{Quote}<i>"</i>
  1175. </div>
  1176. {block:Source}
  1177. <br><div class="quotes_sources">- {Source}</div>
  1178. {/block:Source}
  1179. {/block:Quote}
  1180.  
  1181.  
  1182.  
  1183.  
  1184. {block:Chat}
  1185. {block:Title}
  1186. <div class="ptitle">
  1187. {Title}
  1188. </div>
  1189. {/block:Title}
  1190. {block:Lines}
  1191. <div class="{Alt}">
  1192. <div class="chat">
  1193. {block:Label}
  1194. <b>{Label}</b>
  1195. {/block:Label}
  1196. {Line}<br>
  1197. </div></div>
  1198. {/block:Lines}
  1199. {/block:Chat}
  1200.  
  1201.  
  1202.  
  1203.  
  1204. {block:Audio}
  1205. <div class="player" style="height: 85px">{AudioEmbed-500}</div>
  1206. <div class="audio">
  1207. {block:TrackName}
  1208. <b>Song:</b> {TrackName}<br>
  1209. {/block:TrackName}
  1210. {block:Artist}
  1211. <b>Artist:</b> {Artist}<br>
  1212. {/block:Artist}
  1213. {block:Album}
  1214. <b>Album:</b> {Album}
  1215. {/block:Album}
  1216. </div>
  1217. {block:PermalinkPage}
  1218. {block:Caption}
  1219. {Caption}
  1220. {/block:Caption}
  1221. {/block:PermalinkPage}
  1222. {/block:Audio}
  1223.  
  1224.  
  1225.  
  1226.  
  1227. {block:Video}
  1228. {block:IndexPage}
  1229. {block:if500px}
  1230. {Video-500}
  1231. {/block:if500px}
  1232. {block:if400px}
  1233. {Video-400}
  1234. {/block:if400px}
  1235. {block:if250px}
  1236. {Video-250}
  1237. {/block:if250px}
  1238. {/block:IndexPage}
  1239. {block:PermalinkPage}
  1240. {Video-500}
  1241. {/block:PermalinkPage}
  1242. {block:IndexPage}
  1243. {block:ifcaptions}
  1244. {block:Caption}
  1245. <div class="captions">
  1246. {Caption}
  1247. </div>
  1248. {/block:Caption}
  1249. {/block:ifcaptions}
  1250. {/block:IndexPage}
  1251. {block:PermalinkPage}
  1252. {block:Caption}
  1253. {Caption}
  1254. {/block:Caption}
  1255. {/block:PermalinkPage}
  1256. {block:Video}
  1257.  
  1258.  
  1259.  
  1260.  
  1261. {block:Answer}
  1262. <div class="ask">
  1263. <div class="asker">
  1264. <img src="{AskerPortraitURL-96}">
  1265. </div>
  1266. <div class="askname">
  1267. <i><b>{Asker}</i> asked</b>
  1268. </div>
  1269. {Question}
  1270. </div>
  1271. <div class="answer">
  1272. {Answer}
  1273. </div>
  1274. {/block:Answer}
  1275.  
  1276.  
  1277.  
  1278.  
  1279. <!--- Perma --->
  1280. {block:IndexPage}
  1281. <div class="perma">
  1282. <a href="{Permalink}" title="{NoteCountWithLabel}"><span class="lnr lnr-plus-circle"></span></a>
  1283. <a class="like-b" href="#" title="like">{LikeButton}<span class="lnr lnr-heart"></span>
  1284. </a>
  1285. <a href="{ReblogURL}" target="_blank" title="reblog"><span class="lnr lnr-sync"></span></a>
  1286.  
  1287. {block:iftags}
  1288. {block:HasTags}
  1289. <div class="tagged">
  1290. {block:Tags}
  1291. <a href="{TagURL}">#{Tag}</a>
  1292. {/block:Tags}
  1293. </div>
  1294. {/block:HasTags}
  1295. {/block:iftags}
  1296. </div>
  1297. {/block:IndexPage}
  1298. <!--- End of Perma --->
  1299.  
  1300.  
  1301.  
  1302.  
  1303. <!--- Permalink Notes --->
  1304. {block:PermalinkPage}
  1305. <div class="noting">
  1306. {block:NoteCount}
  1307. <b>Notes:</b>
  1308. {NoteCount}
  1309. {/block:NoteCount}
  1310. {block:Date}
  1311. <br><b>Posted:</b>
  1312. {timeago}
  1313. {/block:Date}
  1314. {block:RebloggedFrom}
  1315. <br><b>Via:</b>
  1316. <a href="{ReblogParentURL}">{ReblogParentName}</a>
  1317. // <b>Orig:</b>
  1318. <a href="{ReblogRootURL}">{ReblogRootName}</a>
  1319. {/block:RebloggedFrom}
  1320. {block:HasTags}
  1321. <br><b>Tagged:</b>
  1322. {block:Tags}
  1323. <a href="{TagURL}">#{Tag}</a>
  1324. {/block:Tags}
  1325. {/block:HasTags}
  1326. </div>
  1327. {block:PostNotes}
  1328. {PostNotes}
  1329. {/block:PostNotes}
  1330. {/block:PermalinkPage}
  1331. <!--- End of Permalink Notes --->
  1332.  
  1333.  
  1334.  
  1335.  
  1336. </div>
  1337. {/block:Posts}
  1338. </div>
  1339.  
  1340.  
  1341. </div>
  1342.  
  1343. <div class="crd">
  1344. <a href="http://tokyo-themes.tumblr.com/" target="_blank">© tokyo-themes</a>
  1345. </div> <!--- Don't Touch... Please. --->
  1346.  
  1347. </body>
  1348. </html>
Advertisement
Add Comment
Please, Sign In to add comment