Advertisement
Katting

Coffee Break

Aug 23rd, 2017
901
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 56.52 KB | None | 0 0
  1. <!DOCTYPE html>
  2. <html>
  3.  
  4. <!-----------------------------------------------------------------------
  5.  
  6. *** PLEASE READ THIS AS IT CONTAINS INPORTANT INFO ***
  7.  
  8. Feline Themes Presents: Coffee Break
  9.  
  10. You may make as many cosmetic changes as you'd like to this theme such as changing fonts, colors, and simple stuff like that. Just please don't make this theme look like an entirely new theme, okay? :)
  11.  
  12. Do not use as a base code! And do not reupload this theme as your own, no matter how much you edit it, and keep both credit links intact (although you may edit the credit link int the sidebar to be a credit popup if you'd like).
  13.  
  14. You may look at my coding to see how I did certain things, but please don't copy & paste any of the CSS/HTML.
  15.  
  16.  
  17. *FONTS USED*
  18.  
  19. - Trebuchet MS [This font does not require an installed library, as it is a basic web font. Feel free to install and use whatever font/fonts you want though!]
  20.  
  21. *INCLUDED PLUGINS*
  22.  
  23. - jQuery (YOU DO NOT NEED TO ADD THIS AGAIN FOR POPUPS OR ANYTHING ELSE)
  24. - Infinite Scroll
  25. - Masonry
  26. - Unnest
  27. - PXU
  28. - Styled Tooltips
  29.  
  30. *OTHER INFO*
  31.  
  32. - I have tested the following post types: Text, Photos/Photosets, Quotes, Asks, Videos, Chats. I didn't really touch the audio posts as I don't see them used often.
  33.  
  34. - This theme has a LOT of meta tags for adding links, about info, As this is a beginner friendly theme. If you know how to edit HTML, which I'm assuming a lot of you do, it is MUCH EASIER to edit in the theme editor. I know if all looks jumbled in some places, but I'm sure you can figure it out.. if not the tags are there. :)
  35.  
  36. Enjoy and let me know if you use it so I can see! :)
  37.  
  38.  
  39. © Feline Themes 2017
  40.  
  41. ------------------------------------------------------------------------>
  42.  
  43. <head>
  44.  
  45. <!---------------------------------------------------------------------->
  46.  
  47. <title>{Title}</title>
  48.  
  49. <link href="{Favicon}" rel="icon" type="image/x-icon" />
  50.  
  51. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  52.  
  53. {block:Description}
  54. <meta name="description" content="{MetaDescription}"/>
  55. {/block:Description}
  56.  
  57. <!---------------------------------------------------------------------->
  58.  
  59. <meta name="color:Main Font Color" content="#414141"/>
  60. <meta name="color:Color 1" content="#beb6a8"/>
  61. <meta name="color:Color 2" content="#686560"/>
  62.  
  63. <meta name="if:Enable About Tab" content="1"/>
  64. <meta name="if:Enable Links Tab" content="1"/>
  65. <meta name="if:Archive Link" content="1"/>
  66. <meta name="if:Scroll To Top Button" content="1"/>
  67. <meta name="if:Loading Screen" content="1"/>
  68. <meta name="if:Hide All Post Notes" content="1"/>
  69. <meta name="if:Black And White On Hover" content="0"/>
  70. <meta name="if:Hide Text Posts" content="1"/>
  71. <meta name="if:Hide Quote Posts" content="1"/>
  72. <meta name="if:Hide Link Posts" content="1"/>
  73. <meta name="if:Hide Chat Posts" content="1"/>
  74. <meta name="if:Hide Video Posts" content="1"/>
  75. <meta name="if:Hide Answer Posts" content="1"/>
  76. <meta name="if:Hide Photoset Posts" content="0"/>
  77.  
  78. <meta name="text:Links Category One Title" content="Category 1"/>
  79. <meta name="text:Links Category One Link One Title" content="Cat 1 - Link 1"/>
  80. <meta name="text:Links Category One Link One URL" content="http://"/>
  81. <meta name="text:Links Category Two Link One URL" content="http://"/>
  82. <meta name="text:Links Category One Link Two Title" content="Cat 1 - Link 2"/>
  83. <meta name="text:Links Category One Link Two URL" content="http://"/>
  84. <meta name="text:Links Category One Link Three Title" content="Cat 1 - Link 3"/>
  85. <meta name="text:Links Category One Link Three URL" content="http://"/>
  86. <meta name="text:Links Category One Link Four Title" content="Cat 1 - Link 4"/>
  87. <meta name="text:Links Category One Link Four URL" content="http://"/>
  88. <meta name="text:Links Category One Link Five Title" content="Cat 1 - Link 5"/>
  89. <meta name="text:Links Category One Link Five URL" content="http://"/>
  90. <meta name="text:Links Category One Link Six Title" content="Cat 1 - Link 6"/>
  91. <meta name="text:Links Category One Link Six URL" content="http://"/>
  92. <meta name="text:Links Category One Link Seven Title" content="Cat 1 - Link 7"/>
  93. <meta name="text:Links Category One Link Seven URL" content="http://"/>
  94. <meta name="text:Links Category One Link Eight Title" content="Cat 1 - Link 8"/>
  95. <meta name="text:Links Category One Link Eight URL" content="http://"/>
  96. <meta name="text:Links Category One Link Nine Title" content="Cat 1 - Link 9"/>
  97. <meta name="text:Links Category One Link Nine URL" content="http://"/>
  98. <meta name="text:Links Category One Link Ten Title" content="Cat 1 - Link 10"/>
  99. <meta name="text:Links Category One Link Ten URL" content="http://"/>
  100. <meta name="text:Links Category Two Title" content="Category 2"/>
  101. <meta name="text:Links Category Two Link One Title" content="Cat 2 - Link 1"/>
  102. <meta name="text:Links Category Two Link One URL" content="http://"/>
  103. <meta name="text:Links Category Two Link Two Title" content="Cat 2 - Link 2"/>
  104. <meta name="text:Links Category Two Link Two URL" content="http://"/>
  105. <meta name="text:Links Category Two Link Three Title" content="Cat 2 - Link 3"/>
  106. <meta name="text:Links Category Two Link Three URL" content="http://"/>
  107. <meta name="text:Links Category Two Link Four Title" content="Cat 2 - Link 4"/>
  108. <meta name="text:Links Category Two Link Four URL" content="http://"/>
  109. <meta name="text:Links Category Two Link Five Title" content="Cat 2 - Link 5"/>
  110. <meta name="text:Links Category Two Link Five URL" content="http://"/>
  111. <meta name="text:Links Category Two Link Six Title" content="Cat 2 - Link 6"/>
  112. <meta name="text:Links Category Two Link Six URL" content="http://"/>
  113. <meta name="text:Links Category Two Link Seven Title" content="Cat 2 - Link 7"/>
  114. <meta name="text:Links Category Two Link Seven URL" content="http://"/>
  115. <meta name="text:Links Category Two Link Eight Title" content="Cat 2 - Link 8"/>
  116. <meta name="text:Links Category Two Link Eight URL" content="http://"/>
  117. <meta name="text:Links Category Two Link Nine Title" content="Cat 2 - Link 9"/>
  118. <meta name="text:Links Category Two Link Nine URL" content="http://"/>
  119. <meta name="text:Links Category Two Link Ten Title" content="Cat 2 - Link 10"/>
  120. <meta name="text:Links Category Two Link Ten URL" content="http://"/>
  121. <meta name="text:Links Category Three Title" content="Category 3"/>
  122. <meta name="text:Links Category Three Link One Title" content="Cat 3 - Link 1"/>
  123. <meta name="text:Links Category Three Link One URL" content="http://"/>
  124. <meta name="text:Links Category Three Link Two Title" content="Cat 3 - Link 2"/>
  125. <meta name="text:Links Category Three Link Two URL" content="http://"/>
  126. <meta name="text:Links Category Three Link Three Title" content="Cat 3 - Link 3"/>
  127. <meta name="text:Links Category Three Link Three URL" content="http://"/>
  128. <meta name="text:Links Category Three Link Four Title" content="Cat 3 - Link 4"/>
  129. <meta name="text:Links Category Three Link Four URL" content="http://"/>
  130. <meta name="text:Links Category Three Link Five Title" content="Cat 3 - Link 5"/>
  131. <meta name="text:Links Category Three Link Five URL" content="http://"/>
  132. <meta name="text:Links Category Three Link Six Title" content="Cat 3 - Link 6"/>
  133. <meta name="text:Links Category Three Link Six URL" content="http://"/>
  134. <meta name="text:Links Category Three Link Seven Title" content="Cat 3 - Link 7"/>
  135. <meta name="text:Links Category Three Link Seven URL" content="http://"/>
  136. <meta name="text:Links Category Three Link Eight Title" content="Cat 3 - Link 8"/>
  137. <meta name="text:Links Category Three Link Eight URL" content="http://"/>
  138. <meta name="text:Links Category Three Link Nine Title" content="Cat 3 - Link 9"/>
  139. <meta name="text:Links Category Three Link Nine URL" content="http://"/>
  140. <meta name="text:Links Category Three Link Ten Title" content="Cat 3 - Link 10"/>
  141. <meta name="text:Links Category Three Link Ten URL" content="http://"/>
  142. <meta name="text:Links Category Four Title" content="Category 4"/>
  143. <meta name="text:Links Category Four Link One Title" content="Cat 4 - Link 1"/>
  144. <meta name="text:Links Category Four Link One URL" content="http://"/>
  145. <meta name="text:Links Category Four Link Two Title" content="Cat 4 - Link 2"/>
  146. <meta name="text:Links Category Four Link Two URL" content="http://"/>
  147. <meta name="text:Links Category Four Link Three Title" content="Cat 4 - Link 3"/>
  148. <meta name="text:Links Category Four Link Three URL" content="http://"/>
  149. <meta name="text:Links Category Four Link Four Title" content="Cat 4 - Link 4"/>
  150. <meta name="text:Links Category Four Link Four URL" content="http://"/>
  151. <meta name="text:Links Category Four Link Five Title" content="Cat 4 - Link 5"/>
  152. <meta name="text:Links Category Four Link Five URL" content="http://"/>
  153. <meta name="text:Links Category Four Link Six Title" content="Cat 4 - Link 6"/>
  154. <meta name="text:Links Category Four Link Six URL" content="http://"/>
  155. <meta name="text:Links Category Four Link Seven Title" content="Cat 4 - Link 7"/>
  156. <meta name="text:Links Category Four Link Seven URL" content="http://"/>
  157. <meta name="text:Links Category Four Link Eight Title" content="Cat 4 - Link 8"/>
  158. <meta name="text:Links Category Four Link Eight URL" content="http://"/>
  159. <meta name="text:Links Category Four Link Nine Title" content="Cat 4 - Link 9"/>
  160. <meta name="text:Links Category Four Link Nine URL" content="http://"/>
  161. <meta name="text:Links Category Four Link Ten Title" content="Cat 4 - Link 10"/>
  162. <meta name="text:Links Category Four Link Ten URL" content="http://"/>
  163.  
  164. <meta name="text:FAQ Section One Title" content="FASK Section 1"/>
  165. <meta name="text:FAQ Section One Text" content="Write whatever you might wants your followers to know in here. I know this isn't the fanciest FASK out there, but it's easy for those who don't want to work with HTML to use. Most people use these sections to tell their followers what they will, and will not do. You can also add in random FAQs, why you unfollow, whatever you want!"/>
  166. <meta name="text:FAQ Section Two Title" content="FASK Section 2"/>
  167. <meta name="text:FAQ Section Two Text" content="I have added 3 sections for you to work with. If you know how you can always go in and add more, and if you want less.. just don't fill out this section for 1 or 2 of these sections."/>
  168. <meta name="text:FAQ Section Three Title" content="FASK Section 3"/>
  169. <meta name="text:FAQ Section Three Text" content="These long texts are honestly so much easier to edit in the edit HTML editor if you are comfortable doing so, but you don't have to do it that way."/>
  170.  
  171. <meta name="text:Your Name" content="Name/Nickname"/>
  172. <meta name="text:Your Birthday" content="xx/xx/xxxx"/>
  173. <meta name="text:Your Age" content="XX"/>
  174. <meta name="text:Your Star Sign" content="Star Sign"/>
  175. <meta name="text:Your Personality Type" content="MBTI Type"/>
  176. <meta name="text:Your General Location" content="State/Country"/>
  177. <meta name="text:Quote" content="Write your favorite quote in here!">
  178. <meta name="text:Your Bio" content="Write your bio here. This can be anything you want your followers/vistors to know about your, your blog, or whatever. Have fun writing this! Try to make it atleast 3-5 lines long, but you really don't need to have a bio at all here if you don't want, lol. You can make this section pretty much as long as you please, I set it up to scroll after so much writing!"/>
  179.  
  180. <meta name="text:Twitter Username" content="twitter"/>
  181. <meta name="text:Pinterest Username" content="pinterest"/>
  182. <meta name="text:Instagram Username" content="instagram"/>
  183. <meta name="text:YouTube URL" content="http://"/>
  184. <meta name="text:WeHeartIt Username" content="weheartit"/>
  185. <meta name="text:Snapchat URL" content="http://"/>
  186. <meta name="text:Snapchat Username" content="snapchat"/>
  187. <meta name="text:Sideblog Username" content="katting"/>
  188. <meta name="text:Website Title" content="My Website"/>
  189. <meta name="text:Website URL" content="http://"/>
  190.  
  191. <!---------------------------------------------------------------------->
  192.  
  193. <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script> <!-- jQuery, you only need ONE of these libraries! -->
  194.  
  195. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script> <!-- Style My Tooltips-->
  196.  
  197. <script src="http://static.tumblr.com/wgijwsy/u2vm2hxv6/jquery.infinitescroll.min.js"></script> <!--- Infinite Scroll--->
  198.  
  199. <script src="http://static.tumblr.com/wgijwsy/Ebfm2v4gy/jquery.masonry.min.js"></script> <!--- Masonry --->
  200.  
  201. <script src="http://static.tumblr.com/iwtk77u/Yhym2yygt/jquery.imagesloaded.min.js"></script> <!-- Images Loaded -->
  202.  
  203. <script src="http://static.tumblr.com/qudkd6d/Az6nkemqr/pxuphotoset.min.js"></script> <!-- PXU -->
  204.  
  205. <link href="https://static.tumblr.com/qudkd6d/OcDnl99gb/style.css" rel="stylesheet" type="text/css"/> <!--- PXU Styling --->
  206.  
  207. <script src="//static.tumblr.com/wgg6svp/OoTofxa0c/unnest.min.js"></script> <!-- Unnest Caption -->
  208.  
  209. <script type="text/javascript" src="//static.tumblr.com/ikeq9mi/DfYl6o46t/scrolltotop.min.js"></script> <!--- To Top Button ---->
  210.  
  211. <link href="//maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet"> <!--Font Awesome Icons-->
  212.  
  213. <style type="text/css">
  214.  
  215.  
  216. /*------------------------------ HEADER ------------------------------*/
  217.  
  218. /*---- General Header ----*/
  219.  
  220. #header{
  221. position:fixed;
  222. z-index:100;
  223. top:60px;
  224. left:32%;
  225. width:620px;
  226. text-align:center;
  227. }
  228.  
  229. /*---- Links ----*/
  230.  
  231. #h-links{
  232. margin:0px -20px 0px -20px;
  233. text-align:center;
  234. background-color:{color:Color 1};
  235. }
  236.  
  237. #tabs-n-links {
  238. margin-left:0px;
  239. display:inline-block;
  240. }
  241.  
  242. .tab-links, .links{
  243. display:inline-block;
  244. margin:0px 0px 0px 0px;
  245. padding:0px;
  246. }
  247.  
  248. .tab-links:after, .links:after {
  249. display:inline-block;
  250. clear:both;
  251. }
  252.  
  253. .tab-links li, .links li {
  254. display:inline-block;
  255. list-style:none;
  256. margin:0px;
  257. width:100px;
  258. height:30px;
  259. }
  260.  
  261. .tab-links a, .links a {
  262. display:inline-block;
  263. width:100px;
  264. height:30px;
  265. background-color:{color:Color 1};
  266. -webkit-transition: all .9s ease;
  267. -moz-transition: all .9s ease;
  268. -o-transition: all .9s ease;
  269. -ms-transition: all .9s ease;
  270. transition: all .9s ease;
  271. }
  272.  
  273. .tab-links span, .links span{
  274. position:relative;
  275. width:100px;
  276. height:30px;
  277. text-transform:uppercase;
  278. font-size:10px;
  279. color:#ffffff;
  280. display: flex;
  281. align-items: center;
  282. justify-content: center;
  283. }
  284.  
  285. .tab-links li:hover a, .links li:hover a{
  286. background-color:{color:Color 2};
  287. }
  288.  
  289. li.main-active a, li.main-active:hover a{
  290. background-color:{color:Color 2};
  291. -webkit-transition: all .9s ease;
  292. -moz-transition: all .9s ease;
  293. -o-transition: all .9s ease;
  294. -ms-transition: all .9s ease;
  295. transition: all .9s ease;
  296. }
  297.  
  298. /*------------------------------ HEADER ------------------------------*/
  299.  
  300.  
  301. /*------------------------------ SIDEBAR -----------------------------*/
  302.  
  303. #sidebar{
  304. position:fixed;
  305. z-index:100;
  306. bottom:40px;
  307. left:6%;
  308. width:220px;
  309. }
  310.  
  311. #blogtitle{
  312. padding-bottom:5px;
  313. border-bottom:1px solid {color:Color 1};
  314. text-align:center;
  315. text-transform:uppercase;
  316. font-size:25px;
  317. color:{color:Main Font Color};
  318. }
  319.  
  320. #blogtitle a{
  321. color:{color:Main Font Color};
  322. }
  323.  
  324. #description{
  325. padding:5px;
  326. font-size:10px;
  327. color:{color:Main Font Color};
  328. }
  329.  
  330. #social-links{
  331. margin-top:5px;
  332. text-align:center;
  333. font-size:15px;
  334. }
  335.  
  336. #social-links a{
  337. margin:0px 2px 0px 2px;
  338. }
  339.  
  340. /*------------------------------ POSTS --------------------------------*/
  341.  
  342. #container{
  343. position:absolute;
  344. top:30px;
  345. }
  346.  
  347. /*-------------------------- HIDE POSTS BY TYPE -----------------------*/
  348. {block:IndexPage}
  349. {block:ifHideTextPosts}
  350. .{block:TagPage}unhide-{/block:TagPage}text{
  351. display:none;
  352. margin:0px;
  353. width:0px;
  354. }
  355. {/block:ifHideTextPosts}
  356.  
  357. {block:ifHideQuotePosts}
  358. .{block:TagPage}unhide-{/block:TagPage}quote{
  359. display:none;
  360. margin:0px;
  361. width:0px;
  362. }
  363. {/block:ifHideQuotePosts}
  364.  
  365. {block:ifHideLinkPosts}
  366. .{block:TagPage}unhide-{/block:TagPage}link{
  367. display:none;
  368. margin:0px;
  369. width:0px;
  370. }
  371. {/block:ifHideLinkPosts}
  372.  
  373. {block:ifHideChatPosts}
  374. .{block:TagPage}unhide-{/block:TagPage}chat{
  375. display:none;
  376. margin:0px;
  377. width:0px;
  378. }
  379. {/block:ifHideChatPosts}
  380.  
  381. {block:ifHideVideoPosts}
  382. .{block:TagPage}unhide-{/block:TagPage}video{
  383. display:none;
  384. margin:0px;
  385. width:0px;
  386. }
  387. {/block:ifHideVideoPosts}
  388.  
  389. {block:ifHideAnswerPosts}
  390. .{block:TagPage}unhide-{/block:TagPage}answer{
  391. display:none;
  392. margin:0px;
  393. width:0px;
  394. }
  395. {/block:ifHideAnswerPosts}
  396.  
  397. {block:ifHidePhotosetPosts}
  398. .{block:TagPage}unhide-{/block:TagPage}photoset{
  399. display:none;
  400. margin:0px;
  401. width:0px;
  402. }
  403. {/block:ifHidePhotosetPosts}
  404. {/block:IndexPage}
  405. /*-------------------------- HIDE POSTS BY TYPE -----------------------*/
  406.  
  407.  
  408. .entry{
  409. position:relative;
  410. margin:5px 0px 5px 0px;
  411. {block:IndexPage}
  412. width:200px;
  413. {/block:IndexPage}
  414. {block:PermalinkPage}
  415. width:620px;
  416. {/block:PermalinkPage}
  417. }
  418.  
  419. .thepost{
  420. {block:IndexPage}
  421. width:200px;
  422. {/block:IndexPage}
  423. {block:PermalinkPage}
  424. width:450px;
  425. {/block:PermalinkPage}
  426. }
  427.  
  428. .postcontents{
  429. position:relative;
  430. }
  431.  
  432. iframe, img, embed, object, video {
  433. max-width: 100%;
  434. }
  435.  
  436. /*---- Text Post ----*/
  437.  
  438. .tp-title, .cp-title{
  439. margin-bottom:5px;
  440. text-transform:uppercase;
  441. text-align:center;
  442. color:{color:Color 1};
  443. }
  444.  
  445. .tp-title{
  446. font-size:25px;
  447. }
  448.  
  449. .tp-body, .qp-body{
  450. padding:0px 0px 5px 0px;
  451. }
  452.  
  453. /*---- Quote Post ----*/
  454.  
  455. .qp-body{
  456. text-align:left;
  457. }
  458.  
  459. .qp-source{
  460. text-align:right;
  461. font-size:9px;
  462. }
  463.  
  464. .short{
  465. font-size:18px;
  466. }
  467.  
  468. .medium{
  469. font-size:16px;
  470. }
  471.  
  472. .long{
  473. font-size:14px;
  474. }
  475.  
  476. /*---- Link Post ----*/
  477.  
  478. .p-link{
  479. display:block;
  480. padding:10px;
  481. background-color:{color:Color 1};
  482. font-size:15px;
  483. color:#ffffff;
  484. -webkit-transition: all .4s ease;
  485. -moz-transition: all .4s ease;
  486. -o-transition: all .4s ease;
  487. transition: all .4s ease;
  488. }
  489.  
  490. a.p-link:hover{
  491. background-color:{color:Color 2};
  492. }
  493.  
  494. .lp-desc{
  495. margin-top:3px;
  496. padding:5px;
  497. background-color:{color:Color 2};
  498. }
  499.  
  500.  
  501. .lp-desc p{
  502. margin:3px 5px 3px 5px;
  503. font-size:10px;
  504. color:#ffffff;
  505. }
  506.  
  507. /*---- Chat Posts ----*/
  508.  
  509. .cp-title{
  510. font-size:15px;
  511. }
  512.  
  513. .cp-body{
  514. font-size:10px;
  515. }
  516.  
  517. .odd, .even{
  518. margin-top:5px;
  519. margin-bottom:5px;
  520. }
  521.  
  522. .odd chatter{
  523. color:{color:Color 2};
  524. }
  525.  
  526. .even chatter{
  527. color:{color:Color 1};
  528. }
  529.  
  530. /*---- Photo Post ----*/
  531.  
  532. #photopost{
  533. position:relative;
  534. overflow:hidden;
  535. }
  536.  
  537. #photopost img{
  538. -webkit-transition: all .4s ease;
  539. -moz-transition: all .4s ease;
  540. -o-transition: all .4s ease;
  541. transition: all .4s ease;
  542. }
  543.  
  544. #photopost:hover img{
  545. {block:IndexPage}
  546. {block:ifBlackAndWhiteOnHover}
  547. filter:grayscale(100%);
  548. {/block:ifBlackAndWhiteOnHover}
  549. {/block:IndexPage}
  550. }
  551.  
  552. .photohovereffect{
  553. position:absolute;
  554. top:0px;
  555. bottom:0px;
  556. left:0px;
  557. right:0px;
  558. opacity:0;
  559. background-color:#ffffff;
  560. -webkit-transition: all .4s ease;
  561. -moz-transition: all .4s ease;
  562. -o-transition: all .4s ease;
  563. transition: all .4s ease;
  564. }
  565.  
  566. .entry:hover .photohovereffect{
  567. opacity:0.5;
  568. }
  569.  
  570. /*--Photo Perma--*/
  571.  
  572. .p-permalinks{
  573. position:absolute;
  574. top:50%;
  575. left:50%;
  576. transform:translate(-50%,-50%);
  577. width:150px;
  578. opacity:0;
  579. text-align:center;
  580. -webkit-transition: all .4s ease;
  581. -moz-transition: all .4s ease;
  582. -o-transition: all .4s ease;
  583. transition: all .4s ease;
  584. transition-delay:0s;
  585. }
  586.  
  587. .entry:hover .p-permalinks{
  588. opacity:1;
  589. transition-delay:0.4s;
  590. }
  591.  
  592. a.photo-perma{
  593. display:block;
  594. position:relative;
  595. margin:5px 0px 5px 0px;
  596. padding:10px;
  597. overflow:hidden;
  598. background-color:{color:Color 1};
  599. font-size:12px;
  600. color:#ffffff;
  601. -webkit-transition: all .4s ease;
  602. -moz-transition: all .4s ease;
  603. -o-transition: all .4s ease;
  604. transition: all .4s ease;
  605. }
  606.  
  607. a.photo-perma:hover{
  608. background-color:{color:Color 2};
  609. }
  610.  
  611. .like .like_button {
  612. position:relative;
  613.  
  614. }
  615.  
  616. .like .like_button iframe {
  617. position:absolute;
  618. z-index:2;
  619. top:0px;
  620. bottom:0px;
  621. left:0px;
  622. right:0px;
  623. opacity:1;
  624. zoom:750%;
  625. }
  626.  
  627. /*--- Question Posts ---*/
  628.  
  629. .asked{
  630. position:relative;
  631. }
  632.  
  633.  
  634. .askerquestion{
  635. position:relative;
  636. padding:10px;
  637. background-color:{color:Color 1};
  638. font-size:9px;
  639. color:#ffffff;
  640. }
  641.  
  642. .askerquestion a{
  643. color:#ffffff;
  644. }
  645.  
  646. .theanswer{
  647. position:relative;
  648. }
  649.  
  650. .answered-q{
  651. font-size:9px;
  652. padding:7px 3px 3px 3px;
  653. }
  654.  
  655. .answered-q p{
  656. font-size:9px;
  657. }
  658.  
  659. /*---- Text Based Permas ----*/
  660.  
  661. #textperma{
  662. position:relative;
  663. margin:5px -3px 0px 0px;
  664. padding:5px 0px 0px 0px;
  665. border-top:1px solid {color:Color 1};
  666. font-size:8px;
  667. text-align:right;
  668. }
  669.  
  670. #textperma a{
  671. display:inline-block;
  672. margin:0px 3px 0px 3px;
  673. text-align:center;
  674. color:{color:Color 2};
  675. -webkit-transition: all .4s ease;
  676. -moz-transition: all .4s ease;
  677. -o-transition: all .4s ease;
  678. transition: all .4s ease;
  679. }
  680.  
  681. /*----------------------PERMALINK PAGE---------------------*/
  682.  
  683. .thepostinfo{
  684. position:absolute;
  685. top:0px;
  686. right:0px;
  687. margin:0px;
  688. width:160px;
  689. }
  690.  
  691. .postinfo{
  692. margin:0px 0px -1px 0px;
  693. padding:5px;
  694. border-top:1px solid {color:Color 2};
  695. border-bottom:1px solid {color:Color 2};
  696. }
  697.  
  698. .posttag{
  699. display:inline-block;
  700. margin:5px;
  701. padding:3px;
  702. background-color:{color:Color 1};
  703. font-size:9px;
  704. color:#ffffff;
  705. -webkit-transition: all .4s ease;
  706. -moz-transition: all .4s ease;
  707. -o-transition: all .4s ease;
  708. transition: all .4s ease;
  709. }
  710.  
  711. .posttag:hover{
  712. background-color:{color:Color 2};
  713. }
  714.  
  715.  
  716. .notes_list{
  717. {block:ifHideAllPostNotes}
  718. margin-top:15px;
  719. margin-bottom:15px;
  720. {/block:ifHideAllPostNotes}
  721. }
  722.  
  723. .notes_head{
  724. margin:0px 0px 5px 0px;
  725. text-align:center;
  726. text-transform:uppercase;
  727. font-size:15px;
  728. color:{color:Color 1};
  729. }
  730.  
  731. .notes_body{
  732. display:none;
  733. }
  734.  
  735.  
  736. ol.notes{
  737. margin:0px;
  738. padding:0px;
  739. background-color:#ffffff;
  740. list-style-type:none;
  741. }
  742.  
  743. ol.notes li{
  744. position:relative;
  745. padding:5px;
  746. }
  747.  
  748. ol.notes a{
  749. color:{color:Color 1};
  750. }
  751.  
  752. ol.notes blockquote{
  753. display:inline;
  754. font-size:11px;
  755. }
  756.  
  757.  
  758. ol.notes img{
  759. display:none;
  760. }
  761.  
  762. .caption{
  763. margin-top:15px;
  764. padding:10px;
  765. background-color:#ffffff;
  766. }
  767.  
  768. .caption h2{
  769. text-align:left;
  770. color:{color:Color 1};
  771. }
  772.  
  773. .tumblr_parent {
  774. margin:0px 0px 5px 0px;
  775. }
  776.  
  777. .tumblr_avatar{
  778. display:none;
  779. }
  780.  
  781. /*------------------------------ POSTS --------------------------------*/
  782.  
  783.  
  784.  
  785. /*------------------------------- FASK --------------------------------*/
  786.  
  787. #fask-infos{
  788. margin:0px 0px 15px 0px;
  789. }
  790.  
  791. .fasksection{
  792. padding:15px 0px 15px 0px;
  793. }
  794.  
  795. /*---------------------------------------------------------------------*/
  796.  
  797.  
  798.  
  799. /*----------------------------- ABOUT ---------------------------------*/
  800.  
  801. #about-icon{
  802. display:inline-block;
  803. width:200px;
  804. height:200px;
  805. overflow:hidden;
  806. vertical-align:text-top;
  807. }
  808.  
  809. #about-icon img{
  810. width:200px;
  811. }
  812.  
  813. #about-basics{
  814. position:relative;
  815. display:inline-block;
  816. margin-left:10px;
  817. width:405px;
  818. height:200px;
  819. vertical-align:text-top;
  820. }
  821.  
  822. .a-info{
  823. margin-bottom:5px;
  824. border-left:11px solid {color:Color 1};
  825. padding-left:5px;
  826. }
  827.  
  828. .a-info b{
  829. color:{color:Color 1};
  830. }
  831.  
  832. #about-quote{
  833. position:absolute;
  834. right:0px;
  835. bottom:0px;
  836. width:350px;
  837. text-align:right;
  838. font-size:18px;
  839. }
  840.  
  841. #about-bio{
  842. margin-top:15px;
  843. max-height:250px;
  844. overflow:auto;
  845. padding:15px;
  846. background-color:{color:Color 1};
  847. color:#ffffff;
  848. }
  849.  
  850. #about-bio::-webkit-scrollbar {
  851. width: 5px;
  852. }
  853.  
  854. #about-bio::-webkit-scrollbar-track {
  855. border-top:5px solid {color:Color 1};
  856. border-bottom:5px solid {color:Color 1};
  857. border-left:2px solid {color:Color 1};
  858. border-right:2px solid {color:Color 1};
  859. background-color:#ffffff;
  860. }
  861.  
  862. #about-bio::-webkit-scrollbar-thumb {
  863. border-top:5px solid {color:Color 1};
  864. border-bottom:5px solid {color:Color 1};
  865. border-left:2px solid {color:Color 1};
  866. border-right:2px solid {color:Color 1};
  867. background-color:{color:Color 2};
  868. }
  869.  
  870. /*----------------------------- ABOUT ---------------------------------*/
  871.  
  872.  
  873.  
  874. /*----------------------------- LINKS ---------------------------------*/
  875.  
  876. #links-col{
  877. display:inline-block;
  878. vertical-align:text-top;
  879. margin:0px 10px 0px 10px;
  880. width:280px;
  881. text-align:center;
  882. }
  883.  
  884. .links-category{
  885. margin-bottom:10px;
  886. text-align:left;
  887. }
  888.  
  889. .the-links{
  890. padding-top:5px;
  891. }
  892.  
  893. .the-links a{
  894. display:block;
  895. padding:3px;
  896. -webkit-transition: all .4s ease;
  897. -moz-transition: all .4s ease;
  898. -o-transition: all .4s ease;
  899. transition: all .4s ease;
  900. }
  901.  
  902. .the-links a:hover{
  903. color:#ffffff;
  904. background-color:{color:Color 1};
  905. }
  906.  
  907. .links-header{
  908. padding-bottom:5px;
  909. border-bottom:1px solid {color:Color 2};
  910. text-transform:uppercase;
  911. font-size:18px;
  912. color:{color:Color 1};
  913. }
  914.  
  915. /*----------------------------- LINKS ---------------------------------*/
  916.  
  917.  
  918.  
  919. /*------------------------- LOADING SCREEN ----------------------------*/
  920. #loading {
  921. position:fixed;
  922. top:0px;
  923. bottom:0px;
  924. left:0px;
  925. right:0px;
  926. z-index: 100000;
  927. background-color:#ffffff;
  928. }
  929.  
  930. #loadmessage{
  931. position:fixed;
  932. top:50%;
  933. left:50%;
  934. transform:translate(-50%,-50%);
  935. font-size:50px;
  936. color:{color:Color 1};
  937. }
  938. /*---------------------------------------------------------------------*/
  939.  
  940.  
  941.  
  942. #top1, #left1, #bottom1, #right1, #top2, #bottom2, #left2, #right2, #tlcorner, #brcorner{
  943. z-index:10000000000;
  944. }
  945.  
  946. #top1, #left1, #bottom1, #right1{
  947. position:fixed;
  948. background-color:{color:Color 1};
  949. }
  950.  
  951. #top1, #bottom1{
  952. left:0px;
  953. right:0px;
  954. height:5px;
  955. }
  956.  
  957. #top1{
  958. top:0px;
  959. }
  960.  
  961. #bottom1{
  962. bottom:0px;
  963. }
  964.  
  965. #left1, #right1{
  966. top:0px;
  967. bottom:0px;
  968. width:5px;
  969. }
  970.  
  971. #left1{
  972. left:0px;
  973. }
  974.  
  975. #right1{
  976. right:0px;
  977. }
  978.  
  979. #tlcorner, #trcorner, #blcorner, #brcorner{
  980. position:fixed;
  981. width:150px;
  982. height:150px;
  983. transform:rotate(45deg);
  984. background-color:{color:Color 1};
  985. box-shadow:0 0 5px #000000;
  986. }
  987.  
  988. #tlcorner,#trcorner{
  989. top:-75px;
  990. }
  991.  
  992. #tlcorner{
  993. left:-75px;
  994. }
  995.  
  996. #trcorner{
  997. right:-75px;
  998. }
  999.  
  1000. #blcorner, #brcorner{
  1001. bottom:-75px;
  1002. }
  1003.  
  1004. #blcorner{
  1005. left:-75px;
  1006. }
  1007.  
  1008. #brcorner{
  1009. right:-75px;
  1010. }
  1011.  
  1012.  
  1013.  
  1014. /*------------------------------ BASICS -------------------------------*/
  1015.  
  1016. .tab-content-posts{ /*The main container of the entire blog*/
  1017. position:absolute;
  1018. top:80px;
  1019. left:32%;
  1020. width:620px;
  1021. }
  1022.  
  1023. .tab-content{
  1024. position:fixed;
  1025. top:110px;
  1026. left:32%;
  1027. width:620px;
  1028. }
  1029.  
  1030. .main-tab {
  1031. display:none;
  1032. }
  1033.  
  1034. .main-tab.active {
  1035. display:block;
  1036. }
  1037.  
  1038.  
  1039. #infscr-loading {
  1040. display: none !important;
  1041. }
  1042.  
  1043. #scrollToTop:link,
  1044. #scrollToTop:visited {
  1045. display:none;
  1046. position:fixed;
  1047. bottom:10px;
  1048. left:10px;
  1049. font-size:15px;
  1050. color:{color:Color 2};
  1051. }
  1052.  
  1053. #s-m-t-tooltip {
  1054. margin:15px 0px 0px 10px;
  1055. padding:5px;
  1056. background-color:{color:Color 2};
  1057. font-size:10px;
  1058. text-align:center;
  1059. color:#ffffff;
  1060. z-index:99999999999999999999999999999999999;
  1061. }
  1062.  
  1063. ::-moz-selection { /* Code for Firefox */
  1064. color: #ffffff;
  1065. background: {color:Color 1};
  1066. }
  1067.  
  1068. ::selection {
  1069. color: #ffffff;
  1070. background: {color:Color 1};
  1071. }
  1072.  
  1073. body{
  1074. background-color:#ffffff;
  1075. text-align:justify;
  1076. font-family: 'Trebuchet MS';
  1077. font-size:11px;
  1078. color:{color:Main Font Color};
  1079. }
  1080.  
  1081. body::-webkit-scrollbar {
  1082. width: 0px;
  1083. }
  1084.  
  1085. blockquote{
  1086. margin:0px;
  1087. }
  1088.  
  1089. img{
  1090. vertical-align:middle;
  1091. }
  1092.  
  1093. hr{
  1094. margin:5px 0px 5px 0px;
  1095. height:1px;
  1096. border:none;
  1097. background-color:{color:Color 2};
  1098. }
  1099.  
  1100. h1{
  1101. margin:0px 0px 5px 0px;
  1102. text-transform:uppercase;
  1103. font-size:20px;
  1104. color:{color:Color 1};
  1105. }
  1106.  
  1107. h2{
  1108. text-transform:uppercase;
  1109. font-size:15px;
  1110. }
  1111.  
  1112. p{
  1113. margin:5px 0px 5px 0px;
  1114. text-align:justify;
  1115. font-family: 'Trebuchet MS';
  1116. font-size:11px;
  1117. }
  1118.  
  1119. ol{
  1120. text-align:left;
  1121. font-family: 'Trebuchet MS';
  1122. font-size:11px;
  1123. }
  1124.  
  1125. ul{
  1126. text-align:left;
  1127. font-family: 'Trebuchet MS';
  1128. font-size:11px;
  1129. }
  1130.  
  1131. a{
  1132. text-decoration:none;
  1133. color:{color:Color 1};
  1134. }
  1135.  
  1136. iframe.tmblr-iframe {
  1137. z-index:99999999999999!important;
  1138. top:5px!important;
  1139. right:5px!important;
  1140. opacity:0.7;
  1141. transform:scale(0.6);
  1142. transform-origin:100% 0;
  1143. -webkit-transform:scale(0.6);
  1144. -webkit-transform-origin:100% 0;
  1145. -o-transform:scale(0.6);
  1146. -o-transform-origin:100% 0;
  1147. -moz-transform:scale(0.6);
  1148. -moz-transform-origin:100% 0;
  1149. -ms-transform:scale(0.6);
  1150. -ms-transform-origin:100% 0;}
  1151.  
  1152. /*------------------------------ BASICS -------------------------------*/
  1153.  
  1154. </style>
  1155.  
  1156. </head>
  1157.  
  1158.  
  1159. <body>
  1160.  
  1161.  
  1162. <!------------------------------ HEADER ------------------------------->
  1163. <div id="header">
  1164. <!--------------------------->
  1165. <div id="h-links">
  1166. <div id="tabs-n-links">
  1167. <ul class="tab-links">
  1168. <!----- IMPORTANT : If you want to use popups or regular links, they will not work in the tab-links ul/div! You must put them in the links ul/div instead, or put them into the links tab I created for this theme, an updates tab or in the little sidebar if you wish to use it that way ---->
  1169. <li class="main-active"><a href="#blog"><span>Home</span></a></li>
  1170. {block:AskEnabled}
  1171. <li><a href="#fask"><span>Ask</span></a></li>
  1172. {block:AskEnabled}
  1173. {block:ifEnableAboutTab}<li><a href="#about"><span>About</a></li>{/block:ifEnableAboutTab}
  1174. {block:ifEnableLinksTab}<li><a href="#links"><span>Links</span></a></li>{/block:ifEnableLinksTab}
  1175. </ul>
  1176. </div>
  1177. <!---- I separated the tab links from the regular links as regular links seem to screw up in the ul for tabs ----->
  1178. <ul class="links">
  1179. {block:ifArchiveLink}
  1180. <li><a href="/archive"><span>Past</span></a></li>
  1181. {/block:ifArchiveLink}
  1182. <li><a href="http://katting.tk" target="blank"><span>Credit</span></a></li>
  1183. </ul>
  1184. </div>
  1185. <!--------------------------->
  1186. </div>
  1187. <!------------------------------ HEADER ------------------------------->
  1188.  
  1189.  
  1190.  
  1191. <!------------------------------ SIDEBAR ------------------------------->
  1192. <div id="sidebar">
  1193. <div id="blogtitle"><a href="/" title="Refresh">{Title}</a></div>
  1194. <div id="description">{Description}</div>
  1195. <div id="social-links">
  1196. {block:ifTwitterUsername}<a href="http://twitter.com/{text:Twitter Username}" target="blank"><i class="fa fa-twitter"></i></a>{/block:ifTwitterUsername}
  1197. {block:ifPinterestUsername}<a href="http://pinterest.com/{text:Pinterest Username}" target="blank"><i class="fa fa-pinterest"></i></a>{/block:ifPinterestUsername}
  1198. {block:ifInstagramUsername}<a href="http://instagram.com/{text:Instagram Username}" target="blank"><i class="fa fa-instagram"></i></a>{/block:ifInstagramUsername}
  1199. {block:ifYouTubeURL}<a href="{text:YouTube URL}" target="blank"><i class="fa fa-youtube"></i></a>{/block:ifYouTubeURL}
  1200. {block:ifWeHeartItUsername}<a href="http://weheartit.com/{text:WeHeartIt Username}" target="blank"><i class="fa fa-heart"></i></a>{/block:ifWeHeartItUsername}
  1201. {block:ifSnapchatUsername}<a href="{text:Snapchat URL}" title="@{text:Snapchat Username}" target="blank"><i class="fa fa-snapchat-ghost"></i></a>{/block:ifSnapchatUsername}
  1202. {block:ifSideblogUsername}<a href="http://{text:Sideblog Username}.tumblr.com" target="blank"><i class="fa fa-tumblr"></i></a>{/block:ifSideblogUsername}
  1203. {block:ifWebsiteURL}<a href="{text:Website URL}" {block:ifWebsiteTitle}title="{text:Website Title}"{/block:ifWebsiteTitle} target="blank"><i class="fa fa-globe"></i></a>{/block:ifWebsiteURL}
  1204. </div>
  1205. </div>
  1206. <!------------------------------ SIDEBAR ------------------------------->
  1207.  
  1208.  
  1209. <!---------------------------------------------------------------------->
  1210. <div id="tabs-n-links"><!-- Start Of Tabs -->
  1211.  
  1212. <!----------------------------- TAB 1 -------------------------------->
  1213. <div id="blog" class="tab main-active"><div class="tab-content-posts">
  1214. <div id="container">
  1215. {block:Posts}
  1216. <div class="entry">
  1217. <!-------------------------------------------------------------------->
  1218. <div class="thepost {PostType}">
  1219. <!----------------------------------------------------->
  1220. {block:Text}
  1221. <div class="post text">
  1222. {block:Title}<div class="tp-title">{Title}</div>{/block:Title}
  1223. <div class="tp-body">{Body}</div>
  1224. <!----------------------->
  1225. {block:IndexPage}
  1226. <div id="textperma">
  1227. <a href="{ReblogURL}" target="blank">Reblog</a>
  1228. <a href="{Permalink}" target="blank">{TimeAgo} with {NoteCountWithLabel}</a>
  1229. </div>
  1230. {/block:IndexPage}
  1231. <!----------------------->
  1232. </div>
  1233. {/block:Text}
  1234. <!----------------------------------------------------->
  1235.  
  1236.  
  1237. <!----------------------------------------------------->
  1238. {block:Quote}
  1239. <div class="post quote {Length}">
  1240. <div class="qp-body">
  1241. "{Quote}"
  1242. {block:Source}<div class="qp-source">- {Source}</div>{/block:Source}
  1243. </div>
  1244. <!----------------------->
  1245. {block:IndexPage}
  1246. <div id="textperma">
  1247. <a href="{ReblogURL}" target="blank">Reblog</a>
  1248. <a href="{Permalink}" target="blank">{TimeAgo} with {NoteCountWithLabel}</a>
  1249. </div>
  1250. {/block:IndexPage}
  1251. <!----------------------->
  1252. </div>
  1253. {/block:Quote}
  1254. <!----------------------------------------------------->
  1255.  
  1256.  
  1257. <!----------------------------------------------------->
  1258. {block:Link}
  1259. <div class="post link">
  1260. <div class="lp-bg">
  1261. <a href="{URL}" class="p-link {Target}" target="blank">{Name}</a>
  1262.  
  1263. <div class="lp-desc">
  1264. {block:Description}{Description}{/block:Description}
  1265. </div>
  1266. </div>
  1267. <!----------------------->
  1268. {block:IndexPage}
  1269. <div id="textperma">
  1270. <a href="{ReblogURL}" target="blank">Reblog</a>
  1271. <a href="{Permalink}" target="blank">{TimeAgo} with {NoteCountWithLabel}</a>
  1272. </div>
  1273. {/block:IndexPage}
  1274. <!----------------------->
  1275. </div>
  1276. {/block:Link}
  1277. <!----------------------------------------------------->
  1278.  
  1279.  
  1280. <!----------------------------------------------------->
  1281. {block:Chat}
  1282. <div class="post chat">
  1283. {block:Title}<div class="cp-title">{Title}</div>{/block:Title}
  1284.  
  1285. <div class="cp-body">
  1286. {block:Lines}
  1287. <div class="{Alt} user_{UserNumber}">
  1288. {block:Label}<chatter>{Label}</chatter>{/block:Label}
  1289. {Line}
  1290. </div>
  1291. {/block:Lines}
  1292. </div>
  1293.  
  1294. <!----------------------->
  1295. {block:IndexPage}
  1296. <div id="textperma">
  1297. <a href="{ReblogURL}" target="blank">Reblog</a>
  1298. <a href="{Permalink}" target="blank">{TimeAgo} with {NoteCountWithLabel}</a>
  1299. </div>
  1300. {/block:IndexPage}
  1301. <!----------------------->
  1302. </div>
  1303. {/block:Chat}
  1304. <!----------------------------------------------------->
  1305.  
  1306.  
  1307. <!----------------------------------------------------->
  1308. {block:Video}
  1309. <div class="post video">
  1310. {block:IndexPage}{Video-250}{/block:IndexPage}
  1311. {block:PermalinkPage}{Video-500}{/block:PermalinkPage}
  1312. </div>
  1313. <!----------------------->
  1314. {block:IndexPage}
  1315. <div id="textperma">
  1316. <a href="{ReblogURL}" target="blank">Reblog</a>
  1317. <a href="{Permalink}" target="blank">{TimeAgo} with {NoteCountWithLabel}</a>
  1318. </div>
  1319. {/block:IndexPage}
  1320. <!----------------------->
  1321. {block:Video}
  1322. <!----------------------------------------------------->
  1323.  
  1324.  
  1325.  
  1326. <!----------------------------------------------------->
  1327. {block:Audio}
  1328. <div class="post audio">
  1329. {block:AudioEmbed}
  1330. {block:IndexPage}{block:AudioEmbed-250}{/block:IndexPage}
  1331. {block:PermalinkPage}{AudioEmbed-500}{/block:PermalinkPage}
  1332. {/block:AudioEmbed}
  1333.  
  1334. {block:AudioPlayer}{AudioPlayer}{/block:AudioPlayer}
  1335. </div>
  1336. {/block:Audio}
  1337. <!----------------------------------------------------->
  1338.  
  1339.  
  1340. <!----------------------------------------------------->
  1341. {block:Photoset}
  1342. <div class="post photoset">
  1343.  
  1344. <div class="photo-slideshow" id="photoset_{PostID}" data-layout="{PhotosetLayout}">
  1345. {block:Photos}
  1346. <div class="photo-data"><div class="pxu-photo">
  1347. <img src="{PhotoURL-500}" width="{PhotoWidth-500}" height="{PhotoHeight-500}" data-highres="{PhotoURL-HighRes}" data-width="{PhotoWidth-HighRes}" data-height="{PhotoHeight-HighRes}">
  1348. </div>
  1349. <a class="tumblr-box" rel="post-{PostID}" href="{PhotoURL-HighRes}"></a>
  1350. </div>
  1351. {/block:Photos}
  1352. </div>
  1353. <!----------------------->
  1354. {block:IndexPage}
  1355. <div id="textperma">
  1356. <a href="{ReblogURL}" target="blank">Reblog</a>
  1357. <a href="{Permalink}" target="blank">{TimeAgo} with {NoteCountWithLabel}</a>
  1358. </div>
  1359. {/block:IndexPage}
  1360. <!----------------------->
  1361. </div>
  1362. {/block:Photoset}
  1363. <!----------------------------------------------------->
  1364.  
  1365.  
  1366. <!----------------------------------------------------->
  1367. {block:Photo}
  1368. <div class="post photo">
  1369. <div id="photopost">
  1370. <div class="thephoto">
  1371. <img src="{PhotoURL-500}" alt="{PhotoAlt}"/>
  1372. </div>
  1373. <!---------------------------------->
  1374. {block:IndexPage}
  1375. <div class="photohovereffect"></div>
  1376. <div class="p-permalinks">
  1377. <a href="{Permalink}" class="photo-perma">{TimeAgo}</a>
  1378. <a href="{Permalink}" class="photo-perma">{NoteCountWithLabel}</a>
  1379. <a href="{ReblogURL}" class="photo-perma">Reblog</a>
  1380. </div>
  1381. {/block:IndexPage}
  1382. <!---------------------------------->
  1383. </div>
  1384. </div>
  1385. {/block:Photo}
  1386. <!----------------------------------------------------->
  1387.  
  1388.  
  1389. <!----------------------------------------------------->
  1390. {block:Answer}
  1391. <div class="post answer">
  1392.  
  1393. <div class="thequestion">
  1394. <div class="askerquestion">
  1395. {Asker} asked: {Question}
  1396. </div>
  1397. </div>
  1398.  
  1399. {block:NotReblog}
  1400. <div class="theanswer">
  1401. <div class="answered-q">
  1402. {text:Your Name} Replied:
  1403. {Answer}
  1404. </div>
  1405. </div>
  1406. {/block:NotReblog}
  1407.  
  1408.  
  1409. {block:IndexPage}
  1410. <div id="textperma">
  1411. <a href="{ReblogURL}" target="blank">Reblog</a>
  1412. <a href="{Permalink}" target="blank">{TimeAgo} with {NoteCountWithLabel}</a>
  1413. </div>
  1414. {/block:IndexPage}
  1415. <!----------------------->
  1416. </div>
  1417. {/block:Answer}
  1418. <!----------------------------------------------------->
  1419. </div>
  1420. {block:PermalinkPage}
  1421. <div class="thepostinfo">
  1422. <div class="postinfo">
  1423. <span><i class="pe-7s-date"></i></span>
  1424. <info>{Month} {DayOfMonth}, {Year}</info>
  1425. </div>
  1426.  
  1427. {block:RebloggedFrom}
  1428. <div class="postinfo">
  1429. Reblogged from : <a href="{ReblogParentURL}" target="blank">{ReblogParentName}</a>
  1430. </div>
  1431. {/block:RebloggedFrom}
  1432.  
  1433. {block:ContentSource}
  1434. <div class="postinfo">
  1435. Source : <a href="{SourceURL}" target="blank">{SourceTitle}</a>
  1436. </div>
  1437. {block:ContentSource}
  1438.  
  1439. <div class="postinfo">
  1440. {NoteCountWithLabel}
  1441. </div>
  1442.  
  1443. {block:HasTags}
  1444. <div class="postinfo">
  1445. <span><i class="pe-7s-ticket"></i></span>
  1446. <info>Tags</info>
  1447. </div>
  1448.  
  1449. {block:Tags}
  1450. <a hreg="{TagURL}" class="posttag">{Tag}</a>
  1451. {/block:Tags}
  1452. {/block:HasTags}
  1453. </div>
  1454.  
  1455. {block:Caption}<div class="caption">{Caption}</div>{/block:Caption}
  1456.  
  1457. {block:PostNotes}
  1458. <div class="notes_list">
  1459. <p class="notes_head">Show/Hide Notes</p>
  1460. <div class="notes_body">{PostNotes-64}</div>
  1461. </div>
  1462. {/block:PostNotes}
  1463.  
  1464. {/block:PermalinkPage}
  1465. </div>
  1466. {/block:Posts}
  1467. </div>
  1468. </div></div>
  1469. <!----------------------------- TAB 1 -------------------------------->
  1470.  
  1471.  
  1472.  
  1473.  
  1474.  
  1475. <!----------------------------- TAB 2 -------------------------------->
  1476. <div id="fask" class="main-tab"><div class="tab-content">
  1477.  
  1478. <div id="fask-infos">
  1479. {block:ifFAQSectionOneText}
  1480. <div class="fasksection">
  1481. {block:ifFAQSectionOneTitle}<h1>{text:FAQ Section One Title}</h1>{/block:ifFAQSectionOneTitle}
  1482. {text:FAQ Section One Text}
  1483. </div>
  1484. {/block:ifFAQSectionOneText}
  1485.  
  1486.  
  1487. {block:ifFAQSectionTwoText}
  1488. <div class="fasksection">
  1489. {block:ifFAQSectionTwoTitle}<h1>{text:FAQ Section Two Title}</h1>{/block:ifFAQSectionTwoTitle}
  1490. {text:FAQ Section Two Text}
  1491. </div>
  1492. {/block:ifFAQSectionTwoText}
  1493.  
  1494. {block:ifFAQSectionThreeText}
  1495. <div class="fasksection">
  1496. {block:ifFAQSectionThreeTitle}<h1>{text:FAQ Section Three Title}</h1>{/block:ifFAQSectionThreeTitle}
  1497. {text:FAQ Section Three Text}
  1498. </div>
  1499. {/block:ifFAQSectionThreeText}
  1500. </div>
  1501. <!---------------------------------------------------------------------->
  1502. <div id="ask">
  1503. <!------------------------------Ask Form-------------------------------->
  1504. <iframe frameborder="0" scrolling="yes" width="100%" height="190" src="http://www.tumblr.com/ask_form/{Name}.tumblr.com" style="background-color:transparent; overflow:hidden;" id="ask_form"></iframe>
  1505. <!---------------------------------------------------------------------->
  1506. </div>
  1507. </div></div>
  1508. <!----------------------------- TAB 2 -------------------------------->
  1509.  
  1510.  
  1511.  
  1512.  
  1513.  
  1514. <!----------------------------- TAB 3 -------------------------------->
  1515. {block:ifEnableAboutTab}
  1516. <div id="about" class="main-tab"><div class="tab-content">
  1517.  
  1518. <div id="about-icon">
  1519. <img src="http://api.tumblr.com/v2/blog/{Name}.tumblr.com/avatar/512/">
  1520. </div>
  1521. <div id="about-basics">
  1522. <div class="a-info"><b>Name:</b> {text:Your Name}</div>
  1523. {block:ifYourBirthday}<div class="a-info"><b>Birthday:</b> {text:Your Birthday}</div>{/block:ifYourBirthday}
  1524. {block:ifYourAge}<div class="a-info"><b>Age:</b> {text:Your Age}</div>{/block:ifYourAge}
  1525. {block:ifYourStarSign}<div class="a-info"><b>Star Sign:</b> {text:Your Star Sign}</div>{/block:ifYourStarSign}
  1526. {block:ifYourPersonalityType}<div class="a-info"><b>Personality Type:</b> {text:Your Personality Type}</div>{/block:ifYourPersonalityType}
  1527. {block:ifYourGeneralLocation}<div class="a-info"><b>I Live In:</b> {text:Your General Location}</div>{/block:ifYourGeneralLocation}
  1528. {block:ifQuote}<div id="about-quote">"{text:Quote}"</div>{/block:ifQuote}
  1529. </div>
  1530. {block:ifYourBio}<div id="about-bio">{text:Your Bio}</div>{/block:ifYourBio}
  1531. </div></div>
  1532. {/block:ifEnableAboutTab}
  1533. <!----------------------------- TAB 3 -------------------------------->
  1534.  
  1535.  
  1536.  
  1537. <!----------------------------- TAB 4 --------------------------------->
  1538. {block:ifEnableLinksTab}
  1539. <div id="links" class="main-tab"><div class="tab-content">
  1540. <div id="links-col">
  1541. {block:ifLinksCategoryOneLinkOneTitle}
  1542. <div class="links-category">
  1543. {block:ifLinksCategoryOneTitle}<div class="links-header">{text:Links Category One Title}</div>{/block:ifLinksCategoryOneTitle}
  1544. <div class="the-links">
  1545. <a href="{text:Links Category One Link One URL}">{text:Links Category One Link One Title}</a>
  1546. {block:ifLinksCategoryOneLinkTwoTitle}<a href="{text:Links Category One Link Two URL}">{text:Links Category One Link Two Title}</a> {/block:ifLinksCategoryOneLinkTwoTitle}
  1547. {block:ifLinksCategoryOneLinkThreeTitle}<a href="{text:Links Category One Link Three URL}">{text:Links Category One Link Three Title}</a> {/block:ifLinksCategoryOneLinkThreeTitle}
  1548. {block:ifLinksCategoryOneLinkFourTitle}<a href="{text:Links Category One Link Four URL}">{text:Links Category One Link Four Title}</a> {/block:ifLinksCategoryOneLinkFourTitle}
  1549. {block:ifLinksCategoryOneLinkFiveTitle}<a href="{text:Links Category One Link Five URL}">{text:Links Category One Link Five Title}</a> {/block:ifLinksCategoryOneLinkFiveTitle}
  1550. {block:ifLinksCategoryOneLinkSixTitle}<a href="{text:Links Category One Link Six URL}">{text:Links Category One Link Six Title}</a> {/block:ifLinksCategoryOneLinkSixTitle}
  1551. {block:ifLinksCategoryOneLinkSevenTitle}<a href="{text:Links Category One Link Seven URL}">{text:Links Category One Link Seven Title}</a> {/block:ifLinksCategoryOneLinkSevenTitle}
  1552. {block:ifLinksCategoryOneLinkEightTitle}<a href="{text:Links Category One Link Eight URL}">{text:Links Category One Link Eight Title}</a> {/block:ifLinksCategoryOneLinkEightTitle}
  1553. {block:ifLinksCategoryOneLinkNineTitle}<a href="{text:Links Category One Link Nine URL}">{text:Links Category One Link Nine Title}</a> {/block:ifLinksCategoryOneLinkNineTitle}
  1554. {block:ifLinksCategoryOneLinkTenTitle}<a href="{text:Links Category One Link Ten URL}">{text:Links Category One Link Ten Title}</a> {/block:ifLinksCategoryOneLinkTenTitle}
  1555. </div>
  1556. </div>
  1557. {/block:ifLinksCategoryOneLinkOneTitle}
  1558. {block:ifLinksCategoryThreeLinkOneTitle}
  1559. <div class="links-category">
  1560. {block:ifLinksCategoryThreeTitle}<div class="links-header">{text:Links Category Three Title}</div>{/block:ifLinksCategoryThreeTitle}
  1561. <div class="the-links">
  1562. <a href="{text:Links Category Three Link One URL}">{text:Links Category Three Link One Title}</a>
  1563. {block:ifLinksCategoryThreeLinkTwoTitle}<a href="{text:Links Category Three Link Two URL}">{text:Links Category Three Link Two Title}</a> {/block:ifLinksCategoryThreeLinkTwoTitle}
  1564. {block:ifLinksCategoryThreeLinkThreeTitle}<a href="{text:Links Category Three Link Three URL}">{text:Links Category Three Link Three Title}</a> {/block:ifLinksCategoryThreeLinkThreeTitle}
  1565. {block:ifLinksCategoryThreeLinkFourTitle}<a href="{text:Links Category Three Link Four URL}">{text:Links Category Three Link Four Title}</a> {/block:ifLinksCategoryThreeLinkFourTitle}
  1566. {block:ifLinksCategoryThreeLinkFiveTitle}<a href="{text:Links Category Three Link Five URL}">{text:Links Category Three Link Five Title}</a> {/block:ifLinksCategoryThreeLinkFiveTitle}
  1567. {block:ifLinksCategoryThreeLinkSixTitle}<a href="{text:Links Category Three Link Six URL}">{text:Links Category Three Link Six Title}</a> {/block:ifLinksCategoryThreeLinkSixTitle}
  1568. {block:ifLinksCategoryThreeLinkSevenTitle}<a href="{text:Links Category Three Link Seven URL}">{text:Links Category Three Link Seven Title}</a> {/block:ifLinksCategoryThreeLinkSevenTitle}
  1569. {block:ifLinksCategoryThreeLinkEightTitle}<a href="{text:Links Category Three Link Eight URL}">{text:Links Category Three Link Eight Title}</a> {/block:ifLinksCategoryThreeLinkEightTitle}
  1570. {block:ifLinksCategoryThreeLinkNineTitle}<a href="{text:Links Category Three Link Nine URL}">{text:Links Category Three Link Nine Title}</a> {/block:ifLinksCategoryThreeLinkNineTitle}
  1571. {block:ifLinksCategoryThreeLinkTenTitle}<a href="{text:Links Category Three Link Ten URL}">{text:Links Category Three Link Ten Title}</a> {/block:ifLinksCategoryThreeLinkTenTitle}
  1572. </div>
  1573. </div>
  1574. {/block:ifLinksCategoryThreeLinkOneTitle}
  1575. </div>
  1576.  
  1577. <div id="links-col">
  1578. {block:ifLinksCategoryTwoLinkOneTitle}
  1579. <div class="links-category">
  1580. {block:ifLinksCategoryTwoTitle}<div class="links-header">{text:Links Category Two Title}</div>{/block:ifLinksCategoryTwoTitle}
  1581. <div class="the-links">
  1582. <a href="{text:Links Category Two Link One URL}">{text:Links Category Two Link One Title}</a>
  1583. {block:ifLinksCategoryTwoLinkTwoTitle}<a href="{text:Links Category Two Link Two URL}">{text:Links Category Two Link Two Title}</a> {/block:ifLinksCategoryTwoLinkTwoTitle}
  1584. {block:ifLinksCategoryTwoLinkThreeTitle}<a href="{text:Links Category Two Link Three URL}">{text:Links Category Two Link Three Title}</a> {/block:ifLinksCategoryTwoLinkThreeTitle}
  1585. {block:ifLinksCategoryTwoLinkFourTitle}<a href="{text:Links Category Two Link Four URL}">{text:Links Category Two Link Four Title}</a> {/block:ifLinksCategoryTwoLinkFourTitle}
  1586. {block:ifLinksCategoryTwoLinkFiveTitle}<a href="{text:Links Category Two Link Five URL}">{text:Links Category Two Link Five Title}</a> {/block:ifLinksCategoryTwoLinkFiveTitle}
  1587. {block:ifLinksCategoryTwoLinkSixTitle}<a href="{text:Links Category Two Link Six URL}">{text:Links Category Two Link Six Title}</a> {/block:ifLinksCategoryTwoLinkSixTitle}
  1588. {block:ifLinksCategoryTwoLinkSevenTitle}<a href="{text:Links Category Two Link Seven URL}">{text:Links Category Two Link Seven Title}</a> {/block:ifLinksCategoryTwoLinkSevenTitle}
  1589. {block:ifLinksCategoryTwoLinkEightTitle}<a href="{text:Links Category Two Link Eight URL}">{text:Links Category Two Link Eight Title}</a> {/block:ifLinksCategoryTwoLinkEightTitle}
  1590. {block:ifLinksCategoryTwoLinkNineTitle}<a href="{text:Links Category Two Link Nine URL}">{text:Links Category Two Link Nine Title}</a> {/block:ifLinksCategoryTwoLinkNineTitle}
  1591. {block:ifLinksCategoryTwoLinkTenTitle}<a href="{text:Links Category Two Link Ten URL}">{text:Links Category Two Link Ten Title}</a> {/block:ifLinksCategoryTwoLinkTenTitle}
  1592. </div>
  1593. </div>
  1594. {/block:ifLinksCategoryTwoLinkOneTitle}
  1595. {block:ifLinksCategoryFourLinkOneTitle}
  1596. <div class="links-category">
  1597. {block:ifLinksCategoryFourTitle}<div class="links-header">{text:Links Category Four Title}</div>{/block:ifLinksCategoryFourTitle}
  1598. <div class="the-links">
  1599. <a href="{text:Links Category Four Link One URL}">{text:Links Category Four Link One Title}</a>
  1600. {block:ifLinksCategoryFourLinkTwoTitle}<a href="{text:Links Category Four Link Two URL}">{text:Links Category Four Link Two Title}</a> {/block:ifLinksCategoryFourLinkTwoTitle}
  1601. {block:ifLinksCategoryFourLinkThreeTitle}<a href="{text:Links Category Four Link Three URL}">{text:Links Category Four Link Three Title}</a> {/block:ifLinksCategoryFourLinkThreeTitle}
  1602. {block:ifLinksCategoryFourLinkFourTitle}<a href="{text:Links Category Four Link Four URL}">{text:Links Category Four Link Four Title}</a> {/block:ifLinksCategoryFourLinkFourTitle}
  1603. {block:ifLinksCategoryFourLinkFiveTitle}<a href="{text:Links Category Four Link Five URL}">{text:Links Category Four Link Five Title}</a> {/block:ifLinksCategoryFourLinkFiveTitle}
  1604. {block:ifLinksCategoryFourLinkSixTitle}<a href="{text:Links Category Four Link Six URL}">{text:Links Category Four Link Six Title}</a> {/block:ifLinksCategoryFourLinkSixTitle}
  1605. {block:ifLinksCategoryFourLinkSevenTitle}<a href="{text:Links Category Four Link Seven URL}">{text:Links Category Four Link Seven Title}</a> {/block:ifLinksCategoryFourLinkSevenTitle}
  1606. {block:ifLinksCategoryFourLinkEightTitle}<a href="{text:Links Category Four Link Eight URL}">{text:Links Category Four Link Eight Title}</a> {/block:ifLinksCategoryFourLinkEightTitle}
  1607. {block:ifLinksCategoryFourLinkNineTitle}<a href="{text:Links Category Four Link Nine URL}">{text:Links Category Four Link Nine Title}</a> {/block:ifLinksCategoryFourLinkNineTitle}
  1608. {block:ifLinksCategoryFourLinkTenTitle}<a href="{text:Links Category Four Link Ten URL}">{text:Links Category Four Link Ten Title}</a> {/block:ifLinksCategoryFourLinkTenTitle}
  1609. </div>
  1610. </div>
  1611. {/block:ifLinksCategoryFourLinkOneTitle}
  1612. </div>
  1613. </div></div>
  1614. {/block:ifEnableLinksTab}
  1615. <!----------------------------- TAB 4 --------------------------------->
  1616.  
  1617.  
  1618. </div><!-- END OF TABS -->
  1619. <!---------------------------------------------------------------------->
  1620.  
  1621.  
  1622. <div id="top1"></div>
  1623. <div id="bottom1"></div>
  1624. <div id="left1"></div>
  1625. <div id="right1"></div>
  1626. <div id="tlcorner"></div>
  1627. <div id="brcorner"></div>
  1628.  
  1629.  
  1630. <style>
  1631. #cred{
  1632. position:fixed;
  1633. z-index:9999999999999999999999999999999999999999999999!important;
  1634. bottom:5px;
  1635. right:5px;
  1636. width:15px;
  1637. height:15px;
  1638. padding:5px;
  1639. border-radius:90px;
  1640. background-color:{color:Color 2};
  1641. display: flex;
  1642. align-items: center;
  1643. justify-content: center;
  1644. text-align:center;
  1645. font-size:14px;
  1646. color:#ffffff;
  1647. webkit-transition: all 1s ease;
  1648. -moz-transition: all 1s ease;
  1649. -o-transition: all 1s ease;
  1650. transition:all 1s ease; /*smooth transitions*/
  1651. }
  1652. </style>
  1653. <a href="http://felinethemes.tumblr.com" title="Feline Themes" target="blank"><div id="cred"><i class="fa fa-paw"></i></div></a>
  1654.  
  1655. <!---------------------------- LOADING SCREEN -------------------------->
  1656.  
  1657. {block:ifLoadingScreen}
  1658. <div id="loading">
  1659. <div id="loadmessage">Loading . . . </div>
  1660. </div>
  1661. {/block:ifLoadingScreen}
  1662. <!---------------------------------------------------------------------->
  1663.  
  1664. {block:ifScrollToTopButton}
  1665. <a href="javascript:;" id="scrollToTop" rel="nofollow" title="Back To Top"><i class="fa fa-arrow-up"></i></a>
  1666. {/block:ifScrollToTopButton}
  1667.  
  1668. <!-------------------- PAGINATION - DON'T REMOVE ----------------------->
  1669. {block:Pagination}
  1670. <div class="pagination" style="visibility:hidden;">
  1671. {block:NextPage}
  1672. <a href="{NextPage}" id="next">Next</a>
  1673. {/block:NextPage}
  1674. </div>
  1675. {/block:Pagination}
  1676.  
  1677. <!------------ Functionality [BE CAREFUL, EASY TO FUCK UP] ------------->
  1678. <script>
  1679. $(function(){
  1680.  
  1681. // ------------------------- LOADING SCREEN ----------------------------
  1682.  
  1683. {block:ifLoadingScreen}
  1684. $(window).load(function () {
  1685. setTimeout(function() {
  1686. $("#loading").fadeOut("slow");
  1687. }, 6600);
  1688. });
  1689. {/block:ifLoadingScreen}
  1690.  
  1691. // ------------------------- Style My Tooltips -------------------------
  1692.  
  1693. (function($){
  1694. $(document).ready(function(){
  1695. $("a[title]").style_my_tooltips({
  1696. tip_follows_cursor:true,
  1697. tip_delay_time:90,
  1698. tip_fade_speed:600,
  1699. attribute:"title"
  1700. });
  1701. });
  1702. })(jQuery);
  1703.  
  1704.  
  1705. // ----------------- All-In-One by NeonBike Themes ---------------------
  1706.  
  1707. $(document).ready(function() {
  1708. $('#tabs-n-links .tab-links a').on('click', function(e) {
  1709. var currentAttrValue = $(this).attr('href');
  1710.  
  1711. // Show/Hide Tabs
  1712. $('#tabs-n-links ' + currentAttrValue).fadeIn(900).siblings().hide();
  1713.  
  1714. // Change/remove current tab to active
  1715. $(this).parent('li').addClass('main-active').siblings().removeClass('main-active');
  1716.  
  1717. e.preventDefault();
  1718. });
  1719. });
  1720.  
  1721. $(document).ready(function() {
  1722. $('#filterOptions li a').click(function() {
  1723. // fetch the class of the clicked item
  1724. var ourClass = $(this).attr('class');
  1725.  
  1726. // reset the active class on all the buttons
  1727. $('#filterOptions li').removeClass('main-active');
  1728. // update the active state on our clicked button
  1729. $(this).parent().addClass('main-active');
  1730.  
  1731. if(ourClass == 'all') {
  1732. // show all our items
  1733. $('#ourHolder').children('div.item').show();
  1734. }
  1735. else {
  1736. // hide all elements that don't share ourClass
  1737. $('#ourHolder').children('div:not(.' + ourClass + ')').hide();
  1738. // show all elements that do share ourClass
  1739. $('#ourHolder').children('div.' + ourClass).show();
  1740. }
  1741. return false;
  1742. });
  1743. });
  1744.  
  1745.  
  1746. // --------------------------- Notes Sliders ----------------------------
  1747.  
  1748. $(document).ready(function(){
  1749. $(".notes_body").hide();
  1750. $(".notes_head").click(function(){
  1751. $(this).next(".notes_body").slideToggle('slow');
  1752. }); });
  1753.  
  1754. // ----------------------- Unnest by NEO --------------------------------
  1755.  
  1756. $('.entry').unnest({ //posts themselves
  1757. yourCaption: ".caption", //caption div
  1758. wrapName: ".tumblr_parent", //unnested captions
  1759. newCaptionUsername: true, //add username
  1760. originalPostCaptionUsername: true, //adds username regardless
  1761. tumblrAvatars: true, // user avatars
  1762. tumblrAvatarClass: ".tumblr_avatar", // avatar class
  1763. usernameColon: false
  1764. });
  1765.  
  1766. //---------------------------- PXU Photosets ----------------------------
  1767.  
  1768. $('.photo-slideshow').pxuPhotoset({
  1769. lightbox: false,
  1770. rounded: false,
  1771. gutter: '2px',
  1772. photoset: '.photo-slideshow',
  1773. photoWrap: '.photo-data',
  1774. photo: '.pxu-photo'
  1775. });
  1776.  
  1777. });
  1778.  
  1779. // -------------------------- Infinite Scroll ---------------------------
  1780.  
  1781. {block:IndexPage}
  1782. (function () {
  1783. var $blogcontent = $('#container'); //posts container
  1784. $blogcontent.imagesLoaded(function () {
  1785. $blogcontent.masonry({
  1786. itemSelector: '.entry', //posts themselves
  1787. isAnimated:false,
  1788. columnWidth:200,
  1789. gutterWidth:10,
  1790. });
  1791. });
  1792. $blogcontent.infinitescroll({
  1793. navSelector : "div.pagination", //pagination div
  1794. nextSelector : ".pagination a#next", //pagination next
  1795. itemSelector : ".entry",
  1796. loading: {
  1797. finishedMsg: "<p>You have reached the end of the internet. Now go outside and get some fresh air.</p>", // if you scroll that far
  1798. msg: null,
  1799. msgText: "",
  1800. },
  1801. },
  1802.  
  1803. function( newElements ) {
  1804. var $newElems = $( newElements );
  1805. $newElems.find('.photo-slideshow').pxuPhotoset({ //pxu callback
  1806. lightbox: false,
  1807. rounded: false,
  1808. gutter: '3px',
  1809. photoset: '.photo-slideshow',
  1810. photoWrap: '.photo-data',
  1811. photo: '.pxu-photo'
  1812. },
  1813.  
  1814. function(){
  1815. $blogcontent.masonry({
  1816. itemSelector: '.entry',
  1817. columnWidth:200,
  1818. gutterWidth:10,
  1819. });
  1820. });
  1821. var $newElems = $(newElements).css({
  1822. opacity: 0,
  1823. zIndex: -1,
  1824. });
  1825. $newElems.imagesLoaded(function(){
  1826. $newElems.animate({ opacity: 1, zIndex: 1 });
  1827. $blogcontent.masonry( 'appended', $newElems );
  1828. });
  1829.  
  1830. });
  1831. })();
  1832. {/block:IndexPage}
  1833. </script>
  1834. <!---------------------------------------------------------------------->
  1835.  
  1836. </body>
  1837.  
  1838.  
  1839. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement