chellescodes

"WONDER" THEME WITH LEFT-ALIGNED POSTS - FOR TUMBLR

Jul 26th, 2017
346
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 42.79 KB | None | 0 0
  1. <!--
  2.  
  3.  
  4. =========DMMMM============DDDMMMMD=====M
  5. =====IMM====MMMN=========+MMMMMMMM=====M
  6. ===NM======MMMMM=======MMMMM==?MMMDD===M
  7. =+D~=======MM=NMM====MMMMM====MMM8==DD=M
  8. OD========MMN==MMM=MMMMM=====MMMM====NDM
  9. DD=======MMM===MMMMMMM======+MMM======DM
  10. D=======MMM=====MMMM========MMM=======DD
  11. D8=====MMM======MM==========MM========DM
  12. DD====MMM=======D===========MM=======DDM
  13. =$D==MMD====================M=======DD=M
  14. ===NMM======================M=====ND===M
  15. ===M=ODD=======================MDN=====M
  16. =========DDNN=============IDDD=========M
  17. ================7MDDDD8================M
  18.  
  19. CODE BY CHELLE, AKA @THE-JEDI
  20. PLEASE LEAVE THE CREDIT
  21. DO NOT STEAL THE ENTIRE/BIG CHUNKS
  22. OF THE CODE AND DISTRIBUTE IT
  23. AS IF IT WERE YOUR OWN
  24.  
  25.  
  26. NOTES ON THIS THEME:
  27.  
  28. DISCLAIMER: I DO NOT OWN WONDER WOMAN OR ANYTHING ASSOCIATED WITH IT. BUT I DID MAKE THIS CODE.
  29.  
  30. HOVER EFFECTS TUTORIAL: thanks to Ian Lunn, HOVER.CSS, http://ianlunn.github.io/Hover/
  31. UNDER PERSONAL LICENSE. This code is public and not used for commercial purposes
  32.  
  33. Special thanks to @shythemes for the video resizing and pxu photoset tutorials.
  34. Credit to Pixel Union for their PXU Photoset Script
  35. Additional credit to @magnusthemes & @neothm for the caption unnest script.
  36.  
  37. Please consult the-jedi.tumblr.com/my+theme for tips on how to best utilize this theme.
  38. For help, first consult the-jedi.tumblr.com/tagged/theme+help, or the-jedi.tumblr.com/tagged/wondertheme.
  39. If you don't find an answer to your query, go to the-jedi.tumblr.com/ask with your question.
  40. -->
  41.  
  42. <!DOCTYPE html>
  43.  
  44. <head>
  45.  
  46.  
  47. <script type="text/javascript" src="http://static.tumblr.com/bmdsqsc/8mXm7q8vn/jquery.js"></script>
  48. <link href="https://fonts.googleapis.com/css?family=Roboto:400,500" rel="stylesheet">
  49. <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">
  50. <script src=“http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js”></script>
  51.  
  52.  
  53. <title>{Title}</title>
  54.  
  55.  
  56. <link rel="shortcut icon" href="{Favicon}">
  57. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  58. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  59.  
  60.  
  61. <meta name="color:background" content="#fbfbfb"/>
  62. <meta name="color:text" content="#333333"/>
  63. <meta name="color:accent1" content="#ff7f33"/>
  64. <meta name="color:accent2" content="#ffdf6a"/>
  65. <meta name="color:post background" content="#ffffff"/>
  66. <meta name="color:border" content="#f5f3f3"/>
  67. <meta name="color:link" content="#ffb700"/>
  68. <meta name="color:titlebg" content="#ededed"/>
  69. <meta name="color:titleborder" content="#dfdfdf"/>
  70. <meta name="if:show updates" content="1"/>
  71. <meta name="if:show colorblock" content="1"/>
  72. <meta name="if:gradient colorblock" content="1"/>
  73. <meta name="if:show sidebar image" content="1"/>
  74. <meta name="if:show searchbox" content="1"/>
  75. <meta name="if:show about" content="1"/>
  76. <meta name="image:sidebar" content=""/>
  77. <meta name="text:go to the website below to search icons, use the icon titles to replace the ones for your links:" content="http://fontawesome.io/icons/" />
  78. <meta name="text:Search Label" content="search" />
  79. <meta name="text:about url" content="/about" />
  80. <meta name="text:blog title spacing" content="3" />
  81. <meta name="text:link 1 URL" content="/" />
  82. <meta name="text:link 1 icon" content="tag"/>
  83. <meta name="text:link 1" content="link 1" />
  84. <meta name="text:link 2 URL" content="/" />
  85. <meta name="text:link 2 icon" content="cog"/>
  86. <meta name="text:link 2" content="link 2" />
  87. <meta name="text:link 3 URL" content="/" />
  88. <meta name="text:link 3 icon" content="book"/>
  89. <meta name="text:link 3" content="link 3" />
  90. <meta name="text:link 4 URL" content="/" />
  91. <meta name="text:link 4 icon" content="pencil"/>
  92. <meta name="text:link 4" content="link 4" />
  93. <meta name="text:link 5 URL" content="/" />
  94. <meta name="text:link 5 icon" content="twitter"/>
  95. <meta name="text:link 5" content="" />
  96. <meta name="text:link 6 URL" content="/" />
  97. <meta name="text:link 6 icon" content="code"/>
  98. <meta name="text:link 6" content="" />
  99. <meta name="text:post width" content="500" />
  100. <meta name="text:updates" content="updates here"/>
  101.  
  102.  
  103. <!-- tumblr controls -->
  104. <script>
  105. $(document).ready(function(){
  106. $(".controloptions").click(function(){
  107. $("#controls,.tmblr-iframe.tmblr-iframe--desktop-logged-in-controls, .tmblr-iframe-compact .tmblr-iframe--unified-controls").fadeToggle();
  108. });
  109. });
  110. </script>
  111.  
  112.  
  113. <!-- style -->
  114. <style type="text/css">
  115.  
  116. blockquote {
  117. line-height:11px;
  118. }
  119.  
  120. ul {
  121. list-style:none;
  122. text-align:left!important;
  123. padding-left:0;
  124. }
  125.  
  126. h1 {
  127. font-family: Roboto, Arial;
  128. font-size:12px;
  129. }
  130. h1 {
  131. font-family: ;
  132. font-size:11px;
  133. }
  134.  
  135.  
  136. li {
  137. position:relative;
  138. padding-left:45px;
  139. line-height:12px;
  140. }
  141.  
  142. ul li:before {
  143. position:absolute;
  144. left:30px;
  145. vertical-align:baseline!important;
  146. font-family: "FontAwesome";
  147. content:'\f096';
  148. -moz-transition-duration:0.4s;
  149. -webkit-transition-duration:0.4s;
  150. -o-transition-duration:0.4s;
  151.  
  152. }
  153.  
  154. ul li:hover:before {
  155. color:{color:accent1};
  156. position:absolute;
  157. left:30px;
  158. vertical-align:baseline!important;
  159. font-family: "FontAwesome";
  160. content:'\f046';
  161. -moz-transition-duration:0.4s;
  162. -webkit-transition-duration:0.4s;
  163. -o-transition-duration:0.4s;
  164. }
  165.  
  166.  
  167.  
  168. body {
  169.  
  170. background:{color:background};
  171. font-smoothing:always;
  172. -webkit-font-smoothing: antialiased;
  173. -moz-osx-font-smoothing: grayscale;
  174. color:{color:text};
  175. font-family:Roboto, Arial;
  176. font-size:11px;
  177. font-weight:400;
  178. text-shadow: 1px 1px 1px rgba(0,0,0,0.004);
  179. margin:0;
  180. text-align:left;
  181. line-height:15px;
  182.  
  183.  
  184. }
  185.  
  186. a {
  187. font-weight:400;
  188. color:{color:link};
  189. -moz-transition-duration:0.4s;
  190. -webkit-transition-duration:0.4s;
  191. -o-transition-duration:0.4s;
  192. text-decoration:none;
  193.  
  194. }
  195.  
  196. a:hover {
  197. color:{color:accent1};
  198.  
  199. -moz-transition-duration:0.4s;
  200. -webkit-transition-duration:0.4s;
  201. -o-transition-duration:0.4s;
  202. }
  203.  
  204. img {
  205. opacity:1;
  206. border:none;
  207. text-decoration:none;
  208. }
  209.  
  210. small {
  211. font-size:10px;
  212. }
  213.  
  214. big {
  215. font-size:10px;
  216. }
  217.  
  218. b {
  219. font-weight:500;
  220. }
  221.  
  222.  
  223. ::selection {
  224. background:{color:accent2};
  225. color:{color:post background};
  226. }
  227.  
  228. a::-moz-selection {
  229. color:{color:accent1};
  230. }
  231.  
  232. ::-moz-selection {
  233. background:{color:accent2};
  234. color:{color:post background};
  235. }
  236.  
  237.  
  238. a::selection {
  239. color:{color:accent1};
  240. }
  241.  
  242.  
  243.  
  244.  
  245. .tooltip{
  246. display: inline;
  247. position: relative;
  248. }
  249.  
  250. #s-m-t-tooltip {
  251. max-width:300px;
  252. background-color:{color:post background};
  253. font-size:80%;
  254. text-transform:uppercase;
  255. letter-spacing:1px;
  256. font-family:Roboto, Arial;
  257. padding:5px 5px 5px 5px;
  258. border:1px solid {color:border};
  259. color: {color:text};
  260. margin:20px 0px 0px 20px;
  261. z-index:9999999999999999999999;
  262. border-radius:5px;
  263.  
  264. }
  265.  
  266.  
  267. ::-webkit-scrollbar {
  268. width: 10px; /** width of total scrollbar **/
  269. background: {color:accent1};
  270. background:linear-gradient( to bottom, {color:accent1}, {color:accent2});
  271. background: -webkit-linear-gradient(bottom, {color:accent1}, {color:accent2}); /* For Safari 5.1 to 6.0 */
  272. background: -o-linear-gradient(bottom, {color:accent1}, {color:accent2}); /* For Opera 11.1 to 12.0 */
  273. background: -moz-linear-gradient(bottom, {color:accent1}, {color:accent2}); /* For Firefox 3.6 to 15 */
  274.  
  275. }
  276.  
  277. ::-webkit-scrollbar-thumb {
  278. background: {color:post background};
  279. border:1px solid {color:border};
  280. width:10px;
  281.  
  282. background-clip: content-box;
  283. }
  284.  
  285.  
  286.  
  287.  
  288. #title, #title2 {
  289. font-size:14px;
  290. font-family: Roboto, Arial;
  291. font-weight:500;
  292. border:1px solid {color:titleborder}!important;
  293. font-size:85%;
  294. text-transform:uppercase;
  295. letter-spacing:1px;
  296. color:{color:text};
  297. background:{color:titlebg};
  298. line-height:18px;
  299. -webkit-transform: perspective(1px) translateZ(0);
  300. transform: perspective(1px) translateZ(0);
  301. margin-bottom:10px;
  302. padding:10px 10px 10px 10px;
  303. text-align:left;
  304. }
  305.  
  306. #title:hover, #title2:hover {
  307. color:{color:post background};
  308. }
  309.  
  310. #title a, #title2 a {
  311. color:{color:accent1};
  312. }
  313.  
  314.  
  315. #title:hover #postlink a, #title2:hover #postlink a {
  316. color:{color:post background};
  317. }
  318.  
  319. #title:before, #title2:before {
  320. content: "";
  321. position: absolute;
  322. z-index: -1;
  323. top: 0;
  324. left: 0;
  325. right: 0;
  326. bottom: 0;
  327. background: {color:accent1};
  328. background:linear-gradient( to left, {color:accent1}, {color:accent2});
  329. background: -webkit-linear-gradient(left, {color:accent1}, {color:accent2}); /* For Safari 5.1 to 6.0 */
  330. background: -o-linear-gradient(right, {color:accent1}, {color:accent2}); /* For Opera 11.1 to 12.0 */
  331. background: -moz-linear-gradient(right, {color:accent1}, {color:accent2}); /* For Firefox 3.6 to 15 */
  332. -webkit-transform: scaleX(0);
  333. transform: scaleX(0);
  334. -webkit-transform-origin: 0 50%;
  335. transform-origin: 0 50%;
  336. -webkit-transition-property: transform;
  337. transition-property: transform;
  338. -webkit-transition-duration: 0.3s;
  339. transition-duration: 0.3s;
  340. -webkit-transition-timing-function: ease-out;
  341. transition-timing-function: ease-out;
  342. }
  343. #title:hover, #title:focus, #title:active, #title2:hover, #title2:focus, #title2:active {
  344. color: {color:post background};
  345. }
  346. .posts:hover #title:before, #title:focus:before, #title:active:before,
  347. #listset:hover #title2:before, #title2:focus:before, #title2:active:before{
  348. color: {color:post background};
  349. -webkit-transform: scaleX(1);
  350. transform: scaleX(1);
  351. }
  352.  
  353. .posts:hover #title, #listset:hover #title2 {
  354. color:{color:post background};
  355. }
  356.  
  357. #title a, #title2 a {
  358. color:{text:post background};
  359. }
  360.  
  361. #listset:hover #title2 a {
  362. color:{color:post background};
  363. }
  364.  
  365.  
  366.  
  367. #title:hover a, #title2:hover a {
  368. color:{color:post background};
  369. }
  370.  
  371. #title:hover a:hover, #title2:hover a:hover {
  372. color:{color:link};
  373. }
  374.  
  375.  
  376. #title2 {
  377. width: 700px;
  378. font-size:80%;
  379. margin-left:-10px;
  380. text-transform:uppercase;
  381. letter-spacing:1px;
  382. height: 13px;
  383. line-height: 13px;
  384. text-align:left;
  385. }
  386.  
  387. #maincontent {
  388.  
  389. text-align: center;
  390.  
  391. }
  392.  
  393.  
  394. #title {
  395. line-height:11px;
  396. font-variant:small-caps;
  397. }
  398.  
  399. .posts:hover #title a {
  400. color:{color:text};
  401. }
  402.  
  403. #toptitle #title:before {
  404. border-top-left-radius: 5px;
  405. border-top-right-radius: 5px;
  406. }
  407.  
  408.  
  409.  
  410.  
  411. #top {
  412. width:100%;
  413. display:hidden;
  414. position:fixed;
  415. top:0;
  416. left:0;
  417. float:right;
  418. z-index:999998;
  419. height:50px;
  420.  
  421. }
  422.  
  423. #alltoplink {
  424. margin-left:-5px;
  425.  
  426. }
  427.  
  428. #toplinks {
  429.  
  430. font-size:15px;
  431. color:{color:accent1};
  432. float:right;
  433. padding-right:-5px;
  434. margin-right:12px;
  435. margin-top:13px;
  436. font-family:Roboto, Arial;
  437. cursor:pointer;
  438. -moz-transition-duration:0.4s;
  439. -webkit-transition-duration:0.4s;
  440. -o-transition-duration:0.4s;
  441. text-decoration:none;
  442. }
  443.  
  444. #toplinks:hover {
  445. color:{color:accent2};
  446. float:right;
  447. font-weight:900;
  448. -moz-transition-duration:0.4s;
  449. -webkit-transition-duration:0.4s;
  450. -o-transition-duration:0.4s;
  451.  
  452. }
  453.  
  454. #toplinks a {
  455. color:{color:accent1};
  456. }
  457.  
  458. #toplinks a:hover {
  459. color:{color:accent2}!important;
  460. }
  461.  
  462. .searchbox {
  463. font-size:10px;;
  464.  
  465. font-family:Roboto, Arial;
  466.  
  467.  
  468. height:auto;
  469. margin-top:0px;
  470. margin-right:-10px;
  471. font-weight:900;
  472. }
  473.  
  474. .searchbox input:hover {
  475. color:{color:post background};
  476. -moz-transition-duration:0.4s;
  477. -webkit-transition-duration:0.4s;
  478. -o-transition-duration:0.4s;
  479.  
  480. }
  481.  
  482. .searchbox input{
  483. background:transparent;
  484. text-align:right;
  485. height:auto;
  486. font-size:80%;
  487. margin-right:-10px;
  488. text-transform:uppercase;
  489. letter-spacing:1px;
  490. line-height:12px;
  491. margin-top:-5px;
  492. font-family:Roboto, Arial;
  493. border:0px;
  494. color: {color:text};
  495. outline:none;
  496. width:50px;
  497. border-radius:25px;
  498. -moz-transition-duration:0.4s;
  499. -webkit-transition-duration:0.4s;
  500. -o-transition-duration:0.4s;
  501.  
  502. }
  503.  
  504. .searchbox input:hover {
  505. background-color: {color: background};
  506. }
  507.  
  508.  
  509.  
  510.  
  511. #pagi {
  512. width:100%;
  513. position:inherit;
  514. text-align:center;
  515. display:inline-block;
  516. margin-top:5px;
  517.  
  518.  
  519.  
  520. }
  521.  
  522. #pagi a {
  523.  
  524. margin-top:-5px;
  525. padding-right:6px;
  526. border-radius:5px;
  527. height:15px;
  528. width:15px;
  529. text-align:center;
  530. line-height:15px;
  531.  
  532.  
  533. }
  534.  
  535.  
  536.  
  537. #pagi i {
  538.  
  539. text-align:center;
  540. border:1px solid {color:border};
  541. padding:5px 5px 5px 5px;
  542. border-radius:5px;
  543. transition: background 0.2s linear;
  544.  
  545. }
  546.  
  547.  
  548. #pagi a:hover i {
  549. background-color:{color:accent1};
  550. background-color:linear-gradient( to left, {color:accent1}, {color:accent2});
  551. background-color: -webkit-linear-gradient(left, {color:accent1}, {color:accent2}); /* For Safari 5.1 to 6.0 */
  552. background-color: -o-linear-gradient(left, {color:accent1}, {color:accent2}); /* For Opera 11.1 to 12.0 */
  553. background-color: -moz-linear-gradient(left, {color:accent1}, {color:accent2}); /* For Firefox 3.6 to 15 */
  554. transition: background 0.2s linear;
  555. }
  556.  
  557.  
  558.  
  559.  
  560.  
  561. #pagi a:hover {
  562. color:{color:post background};
  563.  
  564. }
  565.  
  566.  
  567.  
  568. #controls, .tmblr-iframe.tmblr-iframe--desktop-logged-in-controls, .tmblr-iframe-compact .tmblr-iframe--unified-controls {
  569. animation: fadein 2s;
  570. margin-top:10px;
  571. opacity:.5!important;
  572. position:fixed!important;
  573. right:118px!important;
  574. z-index:999999999999999!important;
  575. display:none;
  576. -webkit-animation: fadein 2s;
  577. -moz-animation: fadein 2s;
  578. -ms-animation: fadein 2s;
  579. -o-animation: fadein 2s;
  580. }
  581.  
  582.  
  583. .tmblr-iframe-compact .tmblr-iframe--unified-controls {
  584. margin-top:-3px;
  585. }
  586.  
  587.  
  588. @keyframes fadein {
  589. from { opacity: 0; }
  590. to { opacity: 1; }
  591. }
  592.  
  593. @-moz-keyframes fadein {
  594. from { opacity: 0; }
  595. to { opacity: 1; }
  596. }
  597.  
  598. @-webkit-keyframes fadein {
  599. from { opacity: 0; }
  600. to { opacity: 1; }
  601. }
  602.  
  603. @-ms-keyframes fadein {
  604. from { opacity: 0; }
  605. to { opacity: 1; }
  606. }
  607.  
  608. @-o-keyframes fadein {
  609. from { opacity: 0; }
  610. to { opacity: 1; }
  611. }
  612.  
  613.  
  614.  
  615.  
  616. #sidebar {
  617. left:0;
  618. text-align:left;
  619. position:fixed;
  620. padding:0px 0px 0px 0px;
  621. height:100%;
  622. border-right:1px solid {color:border};
  623. width:300px;
  624. background:{color:post background};
  625. }
  626.  
  627.  
  628. #imgwidth {
  629. width:100%;
  630. text-align:center;
  631. }
  632.  
  633.  
  634. #imgcontain {
  635. border-radius:50%;
  636. width:150px;
  637. height:150px;
  638. overflow:hidden;
  639. margin: 0 auto;
  640. margin-top:125px;
  641. {block:ifShowColorBlock}
  642. margin-top:-85px;
  643. {/block:ifShowColorBlock}
  644. text-align:center;
  645. padding:6px 6px 6px 6px;
  646. background:{color:accent1};
  647. background:linear-gradient( to left, {color:accent1}, {color:accent2});
  648. background: -webkit-linear-gradient(left, {color:accent1}, {color:accent2}); /* For Safari 5.1 to 6.0 */
  649. background: -o-linear-gradient(left, {color:accent1}, {color:accent2}); /* For Opera 11.1 to 12.0 */
  650. background: -moz-linear-gradient(left, {color:accent1}, {color:accent2}); /* For Firefox 3.6 to 15 */
  651. -webkit-transform: perspective(1px) translateZ(0);
  652. transform: perspective(1px) translateZ(0);
  653. -webkit-transition-property: color;
  654. transition-property: color;
  655. -webkit-transition-duration: 0.5s;
  656. transition-duration: 0.5s;
  657.  
  658. }
  659.  
  660. #imgcontain:before {
  661. content: "";
  662. position: absolute;
  663. z-index: -1;
  664. top: 0;
  665. left: 0;
  666. right: 0;
  667. bottom: 0;
  668. border-radius:50%;
  669. overflow:hidden;
  670. background: {color:text};
  671.  
  672. -webkit-transform: scaleX(0);
  673. transform: scaleX(0);
  674. -webkit-transform-origin: 0 50%;
  675. transform-origin: 0 50%;
  676. -webkit-transition-property: transform;
  677. transition-property: transform;
  678. -webkit-transition-duration: 0.5s;
  679. transition-duration: 0.5s;
  680. -webkit-transition-timing-function: ease-out;
  681. transition-timing-function: ease-out;
  682. }
  683. #imgcontain:hover, #imgcontain:focus, #imgcontain:active {
  684. color: white;
  685. }
  686. #imgcontain:hover:before, #imgcontain:focus:before, #imgcontain:active:before {
  687. -webkit-transform: scaleX(1);
  688. transform: scaleX(1);
  689. }
  690.  
  691.  
  692. #colorblock {
  693. top:0;
  694. left:0;
  695. width:100%;
  696. height:200px;
  697. background:{color:accent1};
  698. {block:ifGradientColorblock}
  699. border-bottom:1px solid {color:border};
  700. background:linear-gradient( to left, {color:accent1}, {color:accent2});
  701. background: -webkit-linear-gradient(left, {color:accent1}, {color:accent2}); /* For Safari 5.1 to 6.0 */
  702. background: -o-linear-gradient(left, {color:accent1}, {color:accent2}); /* For Opera 11.1 to 12.0 */
  703. background: -moz-linear-gradient(left, {color:accent1}, {color:accent2}); /* For Firefox 3.6 to 15 */
  704. {/block:ifGradientColorblock}
  705. }
  706.  
  707.  
  708.  
  709. #sidebar img {
  710. width:150px;
  711. height:150px;
  712. text-align:center;
  713. margin-left:-3px;
  714. margin-top:-3px;
  715. border:3px solid {color:post background};
  716. border-radius:50%;
  717. }
  718.  
  719.  
  720. #blogtitle {
  721.  
  722. height:15px;
  723. letter-spacing:{text:blog title spacing}px;
  724. text-align:center;
  725. color: {color:post background};
  726. line-height:20px;
  727. text-transform:uppercase;
  728. font-family: Roboto, Arial;
  729. font-size:10px;;
  730. margin-top:-2px;
  731. padding-top:10px;
  732. z-index:-1;
  733. -webkit-transition-property: color;
  734. transition-property: color;
  735. -webkit-transition-duration: 0.3s;
  736. transition-duration: 0.3s;
  737. -webkit-transform: perspective(1px) translateZ(0);
  738. transform: perspective(1px) translateZ(0);
  739. margin-top:225px;
  740. {block:ifShowSidebarImage}
  741. margin-top:-2px;
  742. {/block:ifShowSidebarImage}
  743. {block:ifShowColorblock}
  744. margin-top:-2px;
  745. {/block:ifShowColorblock}
  746.  
  747.  
  748. }
  749.  
  750. #blogtitle a {
  751. color: {color:accent2};
  752. font-family: 'YourFont', Roboto, Arial;
  753. font-size:20px;
  754. }
  755.  
  756.  
  757. #blogtitle a:hover, #blogtitle a:focus, #blogtitle a:active {
  758. color: {color:accent1};
  759. }
  760. #blogtitle a:hover:before, #blogtitle a:focus:before, #blogtitle a:active:before {
  761. -webkit-transform: scaleX(1);
  762. transform: scaleX(1);
  763. }
  764.  
  765.  
  766. .linkgroup {
  767. display:inline-block;
  768. padding-right:10px;
  769. z-index: -1;
  770. opacity: 1;
  771. }
  772.  
  773.  
  774. .linkgroup a {
  775. padding: 5px 5px 5px 5px;
  776. text-decoration: none;
  777. overflow:hidden;
  778.  
  779. }
  780.  
  781. .linkgroup i {
  782. line-height:20px;
  783. color: {color:accent1};
  784. }
  785.  
  786. .linkgroup a:hover {
  787. color:{color:accent2};
  788.  
  789. }
  790.  
  791. .linkgroup a:hover i{
  792. color:{color:accent2};
  793. font-size:20px;
  794. }
  795.  
  796.  
  797.  
  798. #links {
  799. margin-left:15%;
  800. margin-top:10px;
  801. text-align:left;
  802. width:100%;
  803. }
  804.  
  805. #thelinks a{
  806. display:inline-block;
  807. float:left;
  808. width:80px;
  809. color:{color:text};
  810. line-height:20px;
  811. height:20px;
  812. margin:5px 5px 5px 5px;
  813. font-size:70%;
  814. text-transform:uppercase;
  815. border-radius:5px;
  816. letter-spacing:1px;
  817. border: 1px solid {color:border};
  818. -o-transition:.5s;
  819. -ms-transition:.5s;
  820. -moz-transition:.5s;
  821. -webkit-transition:.5s;
  822.  
  823. }
  824.  
  825.  
  826. #thelinks a:before {
  827. content: "";
  828. position: absolute;
  829. z-index: -1;
  830. top: 0;
  831. left: 0;
  832. right: 0;
  833. bottom: 0;
  834. background:{color:accent1};
  835. background:linear-gradient( to left, {color:accent1}, {color:accent2});
  836. background: -webkit-linear-gradient(left, {color:accent1}, {color:accent2}); /* For Safari 5.1 to 6.0 */
  837. background: -o-linear-gradient(left, {color:accent1}, {color:accent2}); /* For Opera 11.1 to 12.0 */
  838. background: -moz-linear-gradient(left, {color:accent1}, {color:accent2}); /* For Firefox 3.6 to 15 */
  839. -webkit-transform: scaleX(0);
  840. transform: scaleX(0);
  841. -webkit-transform-origin: 0 50%;
  842. transform-origin: 0 50%;
  843. -webkit-transition-property: transform;
  844. transition-property: transform;
  845. -webkit-transition-duration: 0.3s;
  846. transition-duration: 0.3s;
  847. -webkit-transition-timing-function: ease-out;
  848. transition-timing-function: ease-out;
  849. }
  850.  
  851. #thelinks a:hover, #thelinks a:focus, #thelinks a:active {
  852. color: {color:post background};
  853. }
  854. #thelinks a:hover:before, #thelinks a:focus:before, #thelinks a {
  855. -webkit-transform: scaleX(1);
  856. transform: scaleX(1);
  857. }
  858.  
  859. #thelinks a:hover {
  860. font-weight:bold;
  861. color:{color:post background};
  862. -o-transition:.5s;
  863. -ms-transition:.5s;
  864. -moz-transition:.5s;
  865. -webkit-transition:.5s;
  866. }
  867.  
  868.  
  869. #thelinks a:hover .searchbox input {
  870. font-weight:bold;
  871. color:{color:post background};
  872. }
  873.  
  874. #thelinks a:hover i {
  875. color:{color:post background};
  876. }
  877.  
  878. #thelinks i{
  879. color:{color:accent1};
  880. font-size:8px;
  881. }
  882.  
  883.  
  884. #thelinks i:hover {
  885. font-weight:400;
  886. color:{color:accent2};
  887. }
  888.  
  889.  
  890.  
  891. #description {
  892. width:calc(300px - 110px);
  893. padding-top:15px;
  894. padding-bottom:5px;
  895. font-size:11px;
  896. line-height:11px;
  897. margin:0 auto;
  898. width:{text:sidebar width}px;
  899. text-align:center;
  900. }
  901.  
  902. #description a {
  903. color:{color:link};
  904. }
  905.  
  906. #description a:hover {
  907. color:{color:accent1};
  908. }
  909.  
  910.  
  911.  
  912. #con {
  913. margin-left:400px;
  914. position:absolute;
  915. width:{text:post width}px;
  916. }
  917.  
  918.  
  919. .entries {
  920. opacity: 1;
  921. transition: 2s opacity;
  922. margin-top:50px;
  923.  
  924. -webkit-animation: fadein 2s;
  925. -moz-animation: fadein 2s;
  926. -ms-animation: fadein 2s;
  927. -o-animation: fadein 2s;
  928. animation: fadein 2s;
  929. }
  930.  
  931.  
  932.  
  933. .posts {
  934. padding-top:10px;
  935. text-align:left;
  936. width:{text:post width}px;
  937. max-width:{text:post width}px;
  938. margin-bottom:70px;
  939. text-align:left;
  940. font-size:11px;;
  941. font-weight:400;
  942. line-height:100%;
  943. letter-spacing:0px;
  944. color:{color:text};
  945. text-shadow:1px 1px 1px 1px rgba(0,0,0,0.005);
  946. overflow:hidden;
  947.  
  948.  
  949. }
  950.  
  951. .posts a {
  952. color:{color:link};
  953. font-weight:500;
  954. }
  955.  
  956. .posts a:hover {
  957. color:{color:accent1};
  958.  
  959. }
  960.  
  961. .posts img, .posts li, .posts blockquote {
  962. max-width:100%;
  963. height:auto;
  964. -webkit-animation: fadein 2s;
  965. -moz-animation: fadein 2s;
  966. -ms-animation: fadein 2s;
  967. -o-animation: fadein 2s;
  968. animation: fadein 2s;
  969. }
  970.  
  971.  
  972. .posts li {
  973. text-align:left;
  974. }
  975.  
  976.  
  977. #upperstuff {
  978. font-size:80%;
  979. letter-spacing:1px;
  980. text-align:center;
  981. background:none;
  982. text-transform:uppercase;
  983.  
  984. }
  985.  
  986.  
  987.  
  988.  
  989. #usericon {
  990. width:20px;
  991. height:20px;
  992. display:inline;
  993. padding-right:8px;
  994. margin-top:-5px;
  995. padding-bottom:0px;
  996. border-radius:100px;
  997. -webkit-transform: perspective(1px) translateZ(0);
  998. transform: perspective(1px) translateZ(0);
  999. -webkit-transition-property: color;
  1000. transition-property: color;
  1001. -webkit-transition-duration: 0.3s;
  1002. transition-duration: 0.3s;
  1003. overflow:hidden;
  1004. }
  1005.  
  1006. #usericon img {
  1007. width:20px;
  1008. margin-left:5px;
  1009. padding:2px 2px 2px 2px;
  1010. }
  1011.  
  1012.  
  1013.  
  1014.  
  1015. #topurl {
  1016. text-align:center;
  1017. margin-left:0px;
  1018. margin-top:3px;
  1019. padding-bottom:7px;
  1020. -moz-transition-duration:0.4s;
  1021. -webkit-transition-duration:0.4s;
  1022. -o-transition-duration:0.4s;
  1023.  
  1024. }
  1025.  
  1026. .postsrc {
  1027. width:100%;
  1028. text-align:center;
  1029.  
  1030. }
  1031.  
  1032. .posts:hover #upperstuff {
  1033. color:{color:accent1};
  1034. }
  1035.  
  1036.  
  1037. .posts:hover #upperstuff a{
  1038. color:{color:accent1};
  1039. }
  1040.  
  1041. .posts:hover #upperstuff a:hover {
  1042. color:{color:accent2};
  1043. }
  1044.  
  1045.  
  1046. #itemsbelow {
  1047. background:{color:post background};
  1048. border:1px solid {color:border};
  1049. max-width:100%;
  1050. overflow:hidden;
  1051. border-radius:5px;
  1052.  
  1053. }
  1054.  
  1055. .photo-slideshow {
  1056. visibility: visible!important;
  1057. }
  1058.  
  1059.  
  1060. #postlink a{
  1061. color:{color:accent1};
  1062. }
  1063.  
  1064. #postlink a:hover{
  1065. color:{color:accent2};
  1066. }
  1067.  
  1068. .caption {
  1069. text-align:left;
  1070. width:{text:post width}px;
  1071. padding-right:10px;
  1072. padding-bottom:5px;
  1073. overflow:hidden;
  1074.  
  1075.  
  1076.  
  1077. }
  1078.  
  1079.  
  1080. a.tumblr_blog {
  1081. font-size:80%;
  1082. margin-left:-10px;
  1083. letter-spacing:1px;
  1084. text-decoration:underline;
  1085. text-transform:uppercase;
  1086. -moz-transition-duration:0.4s;
  1087. -webkit-transition-duration:0.4s;
  1088. -o-transition-duration:0.4s;
  1089.  
  1090. }
  1091.  
  1092. .tumblr_blog {
  1093. text-align:left;
  1094. }
  1095.  
  1096.  
  1097. #titlequote {
  1098. padding:10px 20px 10px 20px;
  1099. text-align:left;
  1100. font-size:12px;
  1101. margin-left:-7px;
  1102. line-height:17px;
  1103. font-weight:400;
  1104. }
  1105.  
  1106. #source {
  1107. padding:0px 10px 10px 10px;
  1108. margin-top:0px;
  1109. text-align:left;
  1110. margin-bottom:11px;
  1111. font-size:80%;
  1112. text-transform:uppercase;
  1113. margin-left:0px;
  1114. }
  1115.  
  1116. /*asks*/
  1117.  
  1118. .q {
  1119. padding: 5px 10px 5px 20px;
  1120. height:110%;
  1121. font-size:11px;
  1122. color:{color:text};
  1123. border-left:1px solid {color:titleborder};
  1124. border-right:1px solid {color:titleborder};
  1125. margin-top:-10px;
  1126. overflow:hidden;
  1127. text-align:left;
  1128. margin-left:-10px;
  1129. }
  1130.  
  1131.  
  1132. .posts:hover #asker a {
  1133. color:{color:text};
  1134.  
  1135. }
  1136.  
  1137. .posts:hover #asker a:hover {
  1138. color:{color:post background};
  1139.  
  1140. }
  1141.  
  1142.  
  1143. .chat ol {
  1144. padding:0;
  1145. list-style:none;
  1146. }
  1147.  
  1148. .line {
  1149. padding:0px 0;
  1150. }
  1151.  
  1152. .label {
  1153. font-weight:400;
  1154. }
  1155.  
  1156. #video {
  1157. top: -{text:post width}px;
  1158. width:{text:post width}px;
  1159. }
  1160.  
  1161.  
  1162. #audio {
  1163. height:50px;
  1164. padding:0;
  1165. padding-bottom:10px;
  1166. }
  1167.  
  1168. #audio #title {
  1169. line-height:20px;
  1170. }
  1171.  
  1172. #audioplayer {
  1173. width:30px;
  1174. margin-top:15px;
  1175. border-radius:{text:border radius}px;
  1176. margin-left:15px;
  1177. opacity:.5;
  1178. overflow:hidden;
  1179. position:absolute;
  1180. vertical-align:top;
  1181. z-index:999999;
  1182. }
  1183.  
  1184. #albumart {
  1185. position:absolute;
  1186. z-index:1;
  1187. vertical-align:top;
  1188. width:61px;
  1189. height:61px;
  1190. padding-top:-10px;
  1191. margin-top:1px;
  1192. }
  1193.  
  1194. #audioinfo {
  1195. text-align:center;
  1196. display:inline;
  1197. margin-top:10px;
  1198. }
  1199.  
  1200.  
  1201. #postinfo {
  1202.  
  1203. width:95%;
  1204. margin-top:-2px;
  1205. {block:Caption}
  1206. margin-top:4px;
  1207. {/block:Caption}
  1208. margin-left:0px;
  1209. font-size:11px;;
  1210. padding:6px 0px 0px 10px;
  1211. {block:HasTags}
  1212. padding:15px 10px 0px 0px;
  1213. {/block:HasTags}
  1214. border-top:1px solid {color:border};
  1215. display:inline-block;
  1216. padding-right:20px;
  1217. vertical-align:text-top;
  1218. {block:Answer}
  1219. margin-top:-10px!important;
  1220. {/block:Answer}
  1221. text-align:center;
  1222.  
  1223.  
  1224. }
  1225.  
  1226. #tags {
  1227. width:100%;
  1228. text-transform:none;
  1229. margin-left:-14px;
  1230. font-size:10px;;
  1231. padding-left:15px;
  1232. text-align:center;
  1233. padding-top:10px;
  1234. padding-bottom:10px;
  1235. }
  1236.  
  1237.  
  1238. #tags a {
  1239. color:{color:text};
  1240. margin-left:-3px;
  1241. font-weight:400;
  1242. padding-right:5px;
  1243.  
  1244. }
  1245.  
  1246. #tags a:hover {
  1247. color:{color:accent1};
  1248. }
  1249.  
  1250.  
  1251.  
  1252. .options {
  1253. text-transform:uppercase;
  1254. margin-right:-10px;
  1255. padding-right:10px;
  1256. font-size:80%;
  1257. {block:HasTags}
  1258. padding-bottom:12px;
  1259. {/block:HasTags}
  1260. }
  1261. .options a {
  1262. color:{color:link};
  1263. position:relative;
  1264. display:inline-block!important;
  1265. overflow:hidden;
  1266. padding:5px;
  1267. width:auto;
  1268. margin-top:0px;
  1269. border-radius:5px;
  1270. padding:5px 5px 5px 5px;
  1271. margin-right:10px;
  1272. height:13px;
  1273. }
  1274.  
  1275. .options i {
  1276. color:{color:accent2};
  1277. -moz-transition-duration:0.4s;
  1278. -webkit-transition-duration:0.4s;
  1279. -o-transition-duration:0.4s;
  1280. }
  1281.  
  1282. .like:hover i {
  1283. color:{color:accent1};
  1284. }
  1285.  
  1286. .options i:hover {
  1287. color:{color:accent1};
  1288. }
  1289. .options .reblog {
  1290. opacity:.93;
  1291. }
  1292.  
  1293. .like:hover {
  1294. color:{color:accent1};
  1295.  
  1296. }
  1297.  
  1298. .like:hover a {
  1299. color:{color:accent1};
  1300.  
  1301. }
  1302.  
  1303.  
  1304. .reblog:hover .fa-spin-hover {
  1305. -webkit-animation: fa-spin 2s infinite linear;
  1306. -moz-animation: fa-spin 2s infinite linear;
  1307. -o-animation: fa-spin 2s infinite linear;
  1308. animation: fa-spin 2s infinite linear;
  1309.  
  1310. }
  1311.  
  1312.  
  1313. .options a:hover, .options a:hover i {
  1314. color:{color:accent1};
  1315. }
  1316.  
  1317. .options:hover {
  1318. color:{color:accent1};
  1319. }
  1320.  
  1321. .options .like .liked + i {
  1322. color:#ec5a5a;
  1323. }
  1324.  
  1325.  
  1326. .options .like .like_button {
  1327. position:relative;
  1328. }
  1329. .options .like .like_button iframe {
  1330. position:absolute;
  1331. top:0;
  1332. left:0;
  1333. bottom:0;
  1334. right:0;
  1335. z-index:2;
  1336. opacity:0;
  1337. }
  1338.  
  1339.  
  1340. #l {
  1341. border-top:1px solid {color:border};
  1342. width:106%;
  1343. margin-left:-10px;
  1344. float:left;
  1345.  
  1346. }
  1347.  
  1348.  
  1349.  
  1350. .pagenotes {
  1351. {block:IndexPage}
  1352. display: none!important;
  1353. {/block:IndexPage}
  1354. width:{text:post width};
  1355. text-align:left;
  1356.  
  1357. }
  1358.  
  1359. .notes {
  1360. font-size:8px!important;
  1361. }
  1362.  
  1363. .pagenotes img {
  1364. display:none!important;
  1365. }
  1366.  
  1367. .pagenotes li {
  1368. list-style-type:none;
  1369. padding:2px 0px;
  1370. font-size:8px;
  1371. text-align:left;
  1372. margin:0 0 0 -40px;
  1373. }
  1374.  
  1375. #updates {
  1376. font-smoothing:always;
  1377. -webkit-font-smoothing: antialiased;
  1378. -moz-osx-font-smoothing: grayscale;
  1379. font-weight:400;
  1380. position:relative;
  1381. font-family:Roboto ;
  1382. right:20px;
  1383. width:50px;
  1384. height:10px;
  1385. top:0px;
  1386. z-index:999;
  1387. }
  1388.  
  1389.  
  1390. #updates a{
  1391. color:{color:accent1};
  1392. text-decoration:underline;
  1393. }
  1394.  
  1395.  
  1396.  
  1397. #updates:hover #updatescontent {
  1398.  
  1399. display:inline;
  1400. opacity:1;
  1401. -webkit-transition: all .5s ease-in-out;
  1402. -moz-transition: all .5s ease-in-out;
  1403. -o-transition: all .5s ease-in-out;
  1404. width: 125px;
  1405. border-radius:10px;
  1406. height:auto;
  1407.  
  1408. }
  1409.  
  1410.  
  1411.  
  1412. #updatescontent {
  1413. display:hidden;
  1414. line-height:10px;
  1415. font-size:10px;;
  1416. text-align:right;
  1417. width:125px;
  1418. top:30px;
  1419. color: {color:text};
  1420. right:12px;
  1421. position:fixed;
  1422. opacity:0;
  1423. -webkit-transition: all .5s ease-in-out;
  1424. -moz-transition: all .5s ease-in-out;
  1425. -o-transition: all .5s ease-in-out;
  1426.  
  1427. }
  1428.  
  1429.  
  1430. #updatestab {
  1431. font-size:80%;
  1432. text-transform:uppercase;
  1433. letter-spacing:1px;
  1434. width: 50px;
  1435. margin-left:20px;
  1436. font-weight:400;
  1437. margin-top:12px;
  1438. text-align: center;
  1439. padding:2px;
  1440. color:{color:text};
  1441. border-bottom:1px solid {color:border};
  1442. height: auto;
  1443. top:0px;
  1444. left:0px;
  1445. -webkit-transform: perspective(1px) translateZ(0);
  1446. transform: perspective(1px) translateZ(0);
  1447. }
  1448.  
  1449.  
  1450. #updatestab:before {
  1451. content: "";
  1452. position: absolute;
  1453. z-index: -1;
  1454. left: 0;
  1455. margin-top:20px;
  1456. right: 100%;
  1457. bottom: 0;
  1458. background: {color:accent1};
  1459. height: 2px;
  1460. -webkit-transition-property: right;
  1461. transition-property: right;
  1462. -webkit-transition-duration: 0.3s;
  1463. transition-duration: 0.3s;
  1464. -webkit-transition-timing-function: ease-out;
  1465. transition-timing-function: ease-out;
  1466. }
  1467.  
  1468. #updates:hover #updatestab:before, #updatestab:focus:before, #updatestab:active:before {
  1469. right: 0;
  1470.  
  1471. }
  1472.  
  1473.  
  1474.  
  1475. #credit {
  1476. width:20px;
  1477. position:fixed;
  1478. bottom:0;
  1479. right:10px;
  1480. float:right;
  1481. z-index:999998;
  1482. }
  1483.  
  1484. {CustomCSS}
  1485.  
  1486. </style>
  1487. <script type="text/javascript" src="http://static.tumblr.com/8oupd2j/BYTm7u5cn/tag_search.js"></script>
  1488. <script src ="//static.tumblr.com/fwgzvyf/Oj1o08f6h/shythemes.vr.js"></script>
  1489. <script src="https://cdnjs.cloudflare.com/ajax/libs/smoothscroll/1.4.6/SmoothScroll.min.js"></script>
  1490. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  1491. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  1492.  
  1493. <script>
  1494. (function($){
  1495. $(document).ready(function(){
  1496. $("a[title]").style_my_tooltips({
  1497. tip_follows_cursor:true,
  1498. tip_delay_time:90,
  1499. tip_fade_speed:600,
  1500. attribute:"title"});});})(jQuery);
  1501. </script>
  1502.  
  1503.  
  1504. </head>
  1505.  
  1506. <body>
  1507.  
  1508. <!-- toplinks (updates and controls) -->
  1509. <div id="top">
  1510.  
  1511. <div id="toplinks" style="font-size:11px;;margin-top:0px;">
  1512. <!-- updates -->
  1513. {block:ifShowUpdates}
  1514. <div id="updates">
  1515. <div id="updatestab">updates</div>
  1516. <div id="updatescontent">
  1517. <p></p>
  1518. {text:updates}
  1519. </div></div>
  1520. {/block:ifShowUpdates}
  1521. </div>
  1522. <!-- follow and controls -->
  1523. <div id="alltoplink" style="right:-10px;">
  1524. <div class="controloptions"><a title="controls" style="font-weight:normal"><div id="toplinks" style="font-weight:normal;"><i class="fa fa-bars" aria-hidden="true"></i>
  1525. </a></div></div>
  1526. <a title="follow" style="font-weight:normal;" href="http://www.tumblr.com/follow/{Name}/">
  1527. <div id="toplinks" style="margin-right:10px;font-weight:normal;"><i class="fa fa-plus" aria-hidden="true"></i>
  1528. </div>
  1529. </a>
  1530. </div>
  1531. <!-- end of toplinks -->
  1532. </div>
  1533.  
  1534.  
  1535. <!-- sidebar -->
  1536. <div id="sidebar">
  1537. {block:ifShowColorblock}
  1538. <div id="colorblock"></div>
  1539. {/block:ifShowColorblock}
  1540. {block:ifShowSidebarImage}
  1541. <!-- sidebar image start -->
  1542. <div id="imgwidth"><div id="imgcontain"><div id="sidebar img"><a href="/"><img src="{image:sidebar}"/></a></div></div></div>
  1543. <!-- sidebar image end -->
  1544. {/block:ifShowSidebarImage}
  1545. <div id="titles">
  1546. <div id="blogtitle"><a href="/">{Title}</a></div></div>
  1547. <div id="description">{Description}</div>
  1548. <!-- links -->
  1549. <div id="links">
  1550. <div class="linkgroup">
  1551. <div id="thelinks">
  1552. <a href="/"><i style="margin-left:5px;float:left;font-size:14px;" class="fa fa-home"></i>&nbsp;<span style="float:right;">home</span></a>
  1553.  
  1554. <a href="/ask"><i style="margin-left:5px;float:left;font-size:11px;" class="fa fa-envelope"></i>&nbsp;<span style="float:right;">ask</span></a>
  1555. <br>
  1556. {block:ifShowAbout}
  1557. <a href="{text:about url}"><i style="margin-left:5px;float:left;font-size:12px;" class="fa fa-user"></i>&nbsp;<span style="float:right;">about</span></a>
  1558. {/block:ifShowAbout}
  1559. {block:IfLink1}
  1560. <a href="{text:link 1 URL}"><i style="margin-left:5px;float:left;font-size:12px;" class="fa fa-{text:link 1 icon}"></i>&nbsp;<span style="float:right;">{text:link 1}</span></a>
  1561. {/block:IfLink1}
  1562. <br>
  1563.  
  1564. {block:IfLink2}
  1565. <a href="{text:link 2 URL}"><i style="margin-left:5px;float:left;font-size:12px;" class="fa fa-{text:link 2 icon}"></i>&nbsp;<span style="float:right;">{text:link 2}</span></a>
  1566. {/block:IfLink2}
  1567.  
  1568. {block:IfLink3}
  1569. <a href="{text:link 3 URL}"><i style="float:left;margin-left:5px;font-size:12px;" class="fa fa-{text:link 3 icon}"></i>&nbsp;<span style="float:right;">{text:link 3}</span></a>
  1570. {/block:IfLink3}
  1571. <br>
  1572.  
  1573. {block:IfLink4}
  1574. <a href="{text:link 4 URL}"><i style="margin-left:5px;float:left;font-size:12px;" class="fa fa-{text:link 4 icon}"></i>&nbsp;<span style="float:right;">{text:link 4}</span></a>
  1575. {/block:IfLink4}
  1576.  
  1577.  
  1578. {block:IfLink5}
  1579. <a href="{text:link 5 URL}"><i style="margin-left:5px;float:left;font-size:12px;" class="fa fa-{text:link 5 icon}"></i>&nbsp;<span style="float:right;">{text:link 5}</span></a>
  1580. {/block:IfLink5}
  1581.  
  1582. {block:IfLink6}
  1583. <a href="{text:link 6 URL}"><i style="float:left;margin-left:5px;font-size:12px;" class="fa fa-{text:link 6 icon}"></i>&nbsp;<span style="float:right;">{text:link 6}</span></a>
  1584. {/block:IfLink6}
  1585. <!-- searchbox -->
  1586. {block:IfShowSearchbox}
  1587. <a><i style="float:left;margin-left:5px;font-size:12px;" class="fa fa-search"></i>&nbsp;
  1588. <span style="float:right"><form class="searchbox" style="width:60px;margin-left:-30px;float:right;border:0px solid;" onsubmit="return tagSearch(this)">
  1589. <input type="text" name="tag" value="{text:Search Label}" onfocus="if (this.value == '{text:Search Label}') {this.value=''}" onblur="if (this.value == '') {this.value='{text:Search Label}'}" /></form></span>
  1590. </a>
  1591. {/block:IfShowSearchbox}
  1592.  
  1593. </div>
  1594. </div>
  1595. </div>
  1596.  
  1597. <!-- DO NOT TOUCH -->
  1598. {block:notIndexPage}
  1599. </div>
  1600. {/block:notIndexPage}
  1601. <!-- THANK YOU -->
  1602.  
  1603.  
  1604. <!-- pagination -->
  1605. {block:Pagination}
  1606. <div id="pagicontainer">
  1607. <div id="pagi">
  1608. {block:PreviousPage}
  1609.  
  1610. <a href="{PreviousPage}" title="previous"><i class="fa fa-chevron-left" style="margin-left:5px;"></i></a>
  1611. {/block:PreviousPage}
  1612. {block:NextPage}
  1613. <a href="{NextPage}" title="next" ><i class="fa fa-chevron-right" style="margin-left:5px;"></i></a>
  1614. {/block:NextPage}
  1615. </div></div>
  1616. {/block:Pagination}
  1617.  
  1618. </div>
  1619.  
  1620.  
  1621. <!-- post section -->
  1622. <div id="con">
  1623.  
  1624. <div class="entries">
  1625.  
  1626. {block:Posts}
  1627.  
  1628. <div class="posts" id="{PostID}">
  1629. <!-- "reblogged from" -->
  1630. <div id="upperstuff">
  1631. <div id="icons">
  1632.  
  1633. {block:NotReblog}
  1634. <div id="usericon"><img src="{PortraitURL-40}"/ style="border-radius:100px;"></div>
  1635. <div id="postsrc"><div id="topurl" style="margin-left:-5px"> POSTED BY <a href="/">{Name}</a></div></div>
  1636. {/block:NotReblog}
  1637.  
  1638. {block:RebloggedFrom}
  1639. <div id="usericon"><a title="{ReblogParentTitle}" href="{ReblogParentURL}"><img src="{ReblogParentPortraitURL-40}" style="border-radius:100px;" /></a></div>
  1640. <div id="postsrc"><div id="topurl"> REBLOGGED FROM <a title="{ReblogParentTitle}" href="{ReblogParentURL}">{ReblogParentName}</a></div></div>
  1641. {/block:RebloggedFrom}
  1642. </div>
  1643. </div>
  1644.  
  1645.  
  1646. <!-- post content -->
  1647. <div id= "itemsbelow">
  1648. {block:Quote}
  1649. <div id="titlequote"><i class="fa fa-quote-left"></i>&nbsp; {Quote} &nbsp;<i class="fa fa-quote-right"></i></div>
  1650. {block:Source}<div id="source">&mdash; {Source}</div>{/block:Source}
  1651. {/block:Quote}
  1652.  
  1653. {block:Text}
  1654. {block:Title}
  1655. <div id="toptitle"><div id="title">{Title}</div></div>{/block:Title}
  1656. {block:RebloggedFrom}
  1657. <div class="caption">{Body}</div>
  1658. {/block:RebloggedFrom}
  1659. {block:NotReblog}
  1660. <div style="text-align:left;padding:0px 10px 0px 10px;">{Body}</div>
  1661. {/block:NotReblog}
  1662. {/block:Text}
  1663.  
  1664. {block:link}
  1665. <div id="toptitle"><div id="title"><a href="{URL}"><div id="postlink"><i class="fa fa-link"></i>&nbsp; {Name}</a></div></div></div>
  1666. {block:Description}<div style="padding:0px 0px 0px 0px;padding-left:10px;padding-right:10px;">{Description}</div>{/block:Description}
  1667. {/block:link}
  1668.  
  1669. {block:Chat}
  1670. {block:Title}
  1671. <div id="title">{Title}</div>{/block:Title}
  1672. {/block:Text}
  1673. <div style="padding:0px 10px 10px 10px;">{block:lines}
  1674. {block:label}
  1675. <br><b>{label}</b>
  1676. {/block:label}
  1677. {line}
  1678. {/block:lines}</div>
  1679. {/block:Chat}
  1680.  
  1681. {block:Photo}
  1682. {LinkOpenTag}
  1683. <img src="{PhotoURL-HighRes}" alt="{PhotoAlt}" width="{text:post width}"/>{LinkCloseTag}
  1684. {/block:Photo}
  1685.  
  1686. {block:Photoset}
  1687. <div class="set"><center><div class="pxu"><div class="photo-slideshow" id="photoset_{PostID}" data-layout="{PhotosetLayout}">{block:Photos}
  1688. <div class="photo-data"><div class="pxu-photo"><img src="{PhotoURL-500}" width="{PhotoWidth-500}" height="{PhotoHeight-500}" data-highres="{PhotoURL-HighRes}" data-width="{PhotoWidth-HighRes}" data-height="{PhotoHeight-HighRes}"></div><a class="tumblr-box" rel="post-{PostID}" href="{PhotoURL-HighRes}"></a></div>{/block:Photos}</div></div></center></div>
  1689. {/block:Photoset}
  1690.  
  1691. <div class="video">{Video-700}</div>
  1692.  
  1693.  
  1694. {block:Audio}
  1695. <div id="audio">
  1696. <div id="audioinfo">
  1697. <div id="audioplayer" >{AudioPlayerWhite}</div>
  1698. <div id="albumart">{block:AlbumArt}<img src="{AlbumArtURL}">{/block:AlbumArt}</div>
  1699. <div id= "title" style="height:60%; bottom:10px; padding-top:20px;text-align:left;">
  1700. <span style="margin-left:60px;padding-top:30px;">
  1701. {block:TrackName}
  1702. {TrackName}
  1703. {/block:TrackName} - {block:Artist}
  1704. {Artist}
  1705. {/block:Artist}
  1706. </span>
  1707. </div>
  1708. </div> </div>
  1709. {/block:Audio}
  1710.  
  1711. {block:Answer}
  1712.  
  1713. <div id="toptitle"><div id="title"><div id="asker"><i class="fa fa-question-circle" aria-hidden="true"></i> &nbsp;{Asker} said: </div></div></div>
  1714. <div class="q">
  1715. <p>{Question}</p></div>
  1716.  
  1717. {block:NotReblog}
  1718. <div id="title"><div id="asker"><i class="fa fa-info-circle" aria-hidden="true"></i> &nbsp;<a href="/">{Name}</a> replied:</div></div>
  1719. <div class="q" style="padding-bottom:-10px">{Replies}</div>
  1720. {/block:NotReblog}
  1721.  
  1722. {block:RebloggedFrom}
  1723. <div id="title"><div id="asker"><i class="fa fa-info-circle" aria-hidden="true"></i>&nbsp;{Answerer}</a> replied: </div></div>
  1724. <div class="q" style="padding-bottom:-10px">{Replies}</div>
  1725. {/block:RebloggedFrom}
  1726. {/block:Answer}
  1727. {block:Caption}{block:RebloggedFrom}
  1728. <div class="caption" style="margin-left:0px;">{Caption}</div>
  1729. {/block:RebloggedFrom}
  1730. {block:NotReblog}
  1731. <div style="text-align:left;padding:10px 10px 10px 10px;">{Caption}</div>
  1732. {/block:NotReblog}{/block:Caption}
  1733.  
  1734.  
  1735.  
  1736. <!-- {block:ContentSource} {SourceURL} {/block:ContentSource} {block:RebloggedFrom} {ReblogRootURL} {ReblogParentURL} {/block:RebloggedFrom} -->
  1737.  
  1738. {block:Date}
  1739.  
  1740. <!-- post info -->
  1741. <div id="postinfo">
  1742.  
  1743. <!-- likes/reblogs/date/permalink/source -->
  1744. <div class="options">
  1745. <a href="{Permalink}" title="Posted on {ShortMonth} {DayOfMonth}, {Year} at {12Hour}:{Minutes} {AmPm}"><i class="fa fa-calendar" aria-hidden="true"></i>&nbsp;&nbsp;{ShortMonth} {DayOfMonth} </a>
  1746. {block:ContentSource}<a title="source: {SourceTitle}" href="{SourceURL}" ><i class="fa fa-history" aria-hidden="true"></i>&nbsp;SOURCE
  1747. </a>{/block:ContentSource}
  1748. {block:NoteCount}<a href="{Permalink}" style="margin-left:0px;" title="{NoteCount} notes"><i class="fa fa-thumbs-up" aria-hidden="true"></i>
  1749. {NoteCount}</a>{/block:NoteCount}
  1750. <a href="{ReblogURL}" target="_blank" class="reblog" title="reblog this post">
  1751. <i class="fa fa-refresh fa-spin-hover" aria-hidden="true">&nbsp;</i>&nbsp; REBLOG
  1752. </a>
  1753. <a href="#" class="like" title="like this post">{LikeButton}
  1754. <i class="fa fa-heart" aria-hidden="true"> </i>&nbsp; LIKE
  1755. </a>
  1756.  
  1757. </div>
  1758. <!-- tags -->
  1759. {block:HasTags}<div id="l"></div><div id="tags" {block:NoteCount} style="padding-top:10px;" {/block:NoteCount}>{block:Tags}<a href="{TagUrl}"><i class="fa fa-check-square-o" aria-hidden="true"></i>
  1760. &nbsp;{Tag}</a>&nbsp;&nbsp;&nbsp;{/block:Tags}</div>{/block:HasTags}
  1761. </div>
  1762. {/block:Date}
  1763.  
  1764.  
  1765. </div>
  1766. <!-- notes list -->
  1767. {block:PostNotes}
  1768. <div style="padding:0px 10px 0px 10px;" class="pagenotes">
  1769. {PostNotes}
  1770. </div>
  1771. {/block:PostNotes}
  1772. </div>
  1773.  
  1774. {/block:Posts}
  1775.  
  1776.  
  1777. <!-- unnesting captions -->
  1778. <script src="//code.jquery.com/jquery-2.2.4.min.js"></script>
  1779. <script src="http://static.tumblr.com/wgg6svp/OoTofxa0c/unnest.min.js"></script>
  1780. <script>
  1781. /*unnest tumblr captions script by @magnusthemes & @neothm (source: http://neothm.com/post/148902138319)*/
  1782. $(document).ready(function () {$(function(){ $('.posts').unnest({
  1783. yourCaption: ".caption",
  1784. wrapName: ".tumblr_parent",
  1785. newCaptionUsername: false,
  1786. originalPostCaptionUsername: false,
  1787. tumblrAvatars: false,
  1788. tumblrAvatarClass: ".tumblr_avatar",
  1789. usernameColon: false
  1790. }); });}); </script>
  1791.  
  1792.  
  1793.  
  1794.  
  1795. <!--
  1796. DO NOT REMOVE!!!
  1797. -->
  1798.  
  1799. <div id="credit"><a title="theme by #userchelle" href="https://the-jedi.tumblr.com/"><img src="https://68.media.tumblr.com/62496251ce73eb90b955cdfa12c0ac83/tumblr_op9av3V2XR1tbtydxo2_r1_75sq.png"/></a></div>
  1800.  
  1801. <!--
  1802. THANK YOU!!!
  1803. -->
  1804.  
  1805.  
  1806. </div>
  1807.  
  1808. </div>
  1809.  
  1810. <link href="//static.tumblr.com/qudkd6d/OcDnl99gb/style.css" rel="stylesheet" type="text/css"/>
  1811. <script src="//static.tumblr.com/qudkd6d/Az6nkemqr/pxuphotoset.min.js"></script>
  1812.  
  1813. <script>
  1814. /* PXU Photoset Script by Pixel Union, resizing tutorial by by @gukthemes & @cathms (source: http://gukthemes.com/post/149193631486/tutorial-540pxresponsive-photosets) */
  1815.  
  1816. $(document).ready(function(){
  1817. $('.photo-slideshow').pxuPhotoset({
  1818. lightbox:true,
  1819. rounded:false,
  1820. gutter:'2.5px',
  1821. borderRadius:'0px',
  1822. photoset:'.photo-slideshow',
  1823. photoWrap:'.photo-data',
  1824. photo:'.pxu-photo'
  1825. });
  1826. });
  1827. </script>
  1828.  
  1829.  
  1830. </body></html>
Advertisement
Add Comment
Please, Sign In to add comment