API tools faq
paste
Advertisement
diamondthemes

Right There Theme

diamondthemes
Jul 16th, 2017
375
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 35.51 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2. <html>
  3.  
  4. <!-----------------------------------------------------------------------
  5.  
  6. *@FelineThemes*
  7.  
  8. Right There Theme @aurorant
  9.  
  10.  
  11. — DO NOT delete the bottom right credit.
  12. — Do not copy or steal any code.
  13. — Do not claim as yours.
  14. — Full credits - @diamondthemes
  15.  
  16. ------------------------------------------------------------------------>
  17.  
  18. <head>
  19. <!-------------------------------- FONTS ------------------------------->
  20.  
  21. <style>
  22. @font-face {
  23. font-family: 'Sanies';
  24. src: url('http://static.tumblr.com/3dpmlma/pSgot4lnd/sanies_script.ttf') format('truetype');
  25. font-weight: normal;
  26. font-style: normal;
  27.  
  28. }
  29.  
  30. </style>
  31.  
  32. <style>
  33. @font-face {
  34. font-family: 'Better Together';
  35. src: url('http://static.tumblr.com/3dpmlma/fMiot4lsn/better_together_script_1_.ttf');
  36. font-weight: normal;
  37. font-style: normal;
  38.  
  39. }
  40.  
  41. </style>
  42.  
  43. <style>
  44. @font-face {
  45. font-family: 'Georgina Light';
  46. src: url('http://static.tumblr.com/3dpmlma/Clvot4lyw/georgina_light.ttf');
  47. font-weight: normal;
  48. font-style: normal;
  49.  
  50. }
  51.  
  52. </style>
  53.  
  54. <style>
  55. @font-face {
  56. font-family: 'Amarillo';
  57. src: url('http://static.tumblr.com/3dpmlma/hhoosgwcd/amarillo_1_.ttf');
  58. font-weight: normal;
  59. font-style: normal;
  60. </style>
  61.  
  62. <style>
  63. @font-face {
  64. font-family: 'Bromello';
  65. src: url('http://static.tumblr.com/3dpmlma/FEFot7130/bromello.ttf') format('truetype');
  66. font-weight: normal;
  67. font-style: normal;
  68.  
  69. }
  70.  
  71. </style>
  72.  
  73. <!-------------------------------- FONTS ------------------------------->
  74.  
  75. <!---------------------------------------------------------------------->
  76.  
  77. <title>{Title}</title>
  78.  
  79. <link href="https://68.media.tumblr.com/453075500a18e0effbcdf38f85b21e0e/tumblr_olhtbvZxN81vqph3ho2_400.png" rel="icon" type="image/x-icon" />
  80.  
  81. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  82.  
  83. {block:Description}
  84. <meta name="description" content="{MetaDescription}"/>
  85. {/block:Description}
  86.  
  87. <!---------------------------------------------------------------------->
  88.  
  89. <meta name="color:Main Font Color" content="#aaaaaa"/>
  90. <meta name="color:Color 1" content="#accee1"/>
  91. <meta name="color:Color 2" content="#000000"/>
  92.  
  93. <meta name="color:Border Top" content="#000000"/>
  94. <meta name="color:Border Left" content="#000000"/>
  95. <meta name="color:Border Right" content="#000000"/>
  96. <meta name="text:Border Top Height" content="27px"/>
  97. <meta name="text:Border Left Width" content="30px"/>
  98. <meta name="text:Border Right Width" content="30px"/>
  99.  
  100. <meta name="text:Border Top Height 2" content="27px"/>
  101. <meta name="text:Border Left Width 2" content="30px"/>
  102. <meta name="text:Border Right Width 2" content="30px"/>
  103.  
  104. <meta name="select:Description Font" content="'Open Sans Condensed', sans-serif;" title="Open Sans Condensed"/>
  105. <meta name="select:Description Font" content="'Raleway', sans-serif;" title="Raleway"/>
  106. <meta name="select:Description Font" content="'Bellefair', serif;" title="Bellefair"/>
  107. <meta name="select:Description Font" content="'Quicksand', sans-serif;" title="Quicksand"/>
  108.  
  109. <meta name="if:Scroll To Top Button" content="1"/>
  110. <meta name="if:Loading Screen" content="1"/>
  111.  
  112. <meta name="image:Sidebar Icon" content=""/>
  113.  
  114. <meta name="select:Photoset Gutter Size" content="3px"/>
  115. <meta name="select:Photoset Gutter Size" content="5px"/>
  116. <meta name="select:Photoset Gutter Size" content="7px"/>
  117.  
  118. <meta name="if:Archive Link" content="1"/>
  119.  
  120. <meta name="text:Your Name" content="Name/Nickname"/>
  121.  
  122. <!---------------------------------------------------------------------->
  123.  
  124. <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script> <!-- jQuery, you only need ONE of these libraries! -->
  125.  
  126. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script> <!-- Style My Tooltips-->
  127.  
  128. <script src="http://static.tumblr.com/wgijwsy/u2vm2hxv6/jquery.infinitescroll.min.js"></script> <!--- Infinite Scroll--->
  129.  
  130. <script src="http://static.tumblr.com/wgijwsy/Ebfm2v4gy/jquery.masonry.min.js"></script> <!--- Masonry --->
  131.  
  132. <script src="http://static.tumblr.com/iwtk77u/Yhym2yygt/jquery.imagesloaded.min.js"></script> <!-- Images Loaded -->
  133.  
  134. <script src="http://static.tumblr.com/qudkd6d/Az6nkemqr/pxuphotoset.min.js"></script> <!-- PXU -->
  135.  
  136. <link href="https://static.tumblr.com/qudkd6d/OcDnl99gb/style.css" rel="stylesheet" type="text/css"/> <!--- PXU Styling --->
  137.  
  138. <script src="//static.tumblr.com/wgg6svp/OoTofxa0c/unnest.min.js"></script> <!-- Unnest Caption -->
  139.  
  140. <script type="text/javascript" src="//static.tumblr.com/ikeq9mi/DfYl6o46t/scrolltotop.min.js"></script> <!--- To Top Button ---->
  141.  
  142. <link href="//maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet"> <!--Font Awesome Icons-->
  143.  
  144. <link href="https://fonts.googleapis.com/css?family=Open+Sans+Condensed:300|Raleway|Petit+Formal+Script|Roboto+Condensed|Dancing+Script|Bubbler+One|Bellefair|Quicksand|Fresca" rel="stylesheet"> <!--- FONTS --->
  145.  
  146.  
  147. <style type="text/css">
  148.  
  149. /*------------------------------- BORDERS -----------------------------*/
  150.  
  151. #top{position:fixed;left:0px;top:0;width:100%;height:{text:Border Top Height};background:{color:Border Top};z-index:6;}
  152. #left{position:fixed;left:0px;bottom:0;height:100%;width:{text:Border Left Width};background:{color:Border Left};z-index:6;}
  153. #right{position:fixed;right:0px;bottom:0;height:100%;width:{text:Border Right Width};background:{color:Border Right};z-index:6;}
  154.  
  155. #top2{position:fixed;left:0px;top:24px;width:100%;height:{text:Border Top Height 2};background:{color:Border Top};z-index:6;}
  156. #left2{position:fixed;left:24px;bottom:0;height:100%;width:{text:Border Left Width 2};background:{color:Border Left};z-index:6;}
  157. #right2{position:fixed;right:24px;bottom:0;height:100%;width:{text:Border Right Width 2};background:{color:Border Right};z-index:6;}
  158.  
  159. /*------------------------------- BORDERS -----------------------------*/
  160.  
  161. /*------------------------------ SIDEBAR ------------------------------*/
  162.  
  163. /*---- Sidebar Icon ----*/
  164.  
  165. #avatar{
  166. position:fixed;
  167. margin-top:190px;
  168. margin-left:125px;
  169. padding:3px;
  170. width:120px;
  171. height:120px;
  172. border:1px solid {color:Color 2};
  173. z-index:10;
  174. border-radius:100%;
  175. }
  176.  
  177. /*---- General Sidebar ----*/
  178.  
  179. #sidebar{
  180. position:fixed;
  181. z-index:100;
  182. top:200px;
  183. left:100px;
  184. width:305px;
  185. height:135px;
  186. text-align:center;
  187. /* border-top:1px solid {color:Color 1}; */
  188.  
  189. }
  190.  
  191. /*---- Blogtitle ----*/
  192.  
  193. #sb-blogtitle{
  194. font-family: 'Georgina Light';
  195. font-size:46px;
  196. color:{color:Color 1};
  197. text-align:center;
  198. margin-top:-55px;
  199. margin-left:98px;
  200. position:absolute;
  201. width:auto;
  202. }
  203.  
  204. /*----- Description -----*/
  205.  
  206. #sb-description{
  207. margin:-4px 0px 5px 163px; /*top right bottom left*/
  208. padding:10px;
  209. background-color:#ffffff;
  210. color:#000000;
  211. width:80px;
  212. height:107px;
  213. font-family:{select:Description Font};
  214. border-top: 1px solid {color:Color 1};
  215. border-right: 1px solid {color:Color 1};
  216. font-size:13px; /*max font size 13 or you'll throw out the sidebar*/
  217. }
  218.  
  219. /*----- Links -----*/
  220.  
  221. #sb-links{
  222. text-align:center;
  223. margin-top:3px;
  224. font-size:8px;
  225. }
  226.  
  227. #tabs-n-links {
  228. margin-left:-10px;
  229. display:inline-block;
  230. padding:3px;
  231. width:250px;
  232. }
  233.  
  234. .tab-links, .links{
  235. display:inline-block;
  236. margin:9px 0px 0px -180px; /*top right bottom left*/
  237. }
  238.  
  239. .tab-links:after, .links:after {
  240. display:inline-block;
  241. clear:both;
  242. }
  243.  
  244. .tab-links li, .links li {
  245. display:inline-block;
  246. list-style:none;
  247. margin:0px 3px 0px 3px; /*top right bottom left*/
  248. width:20px;
  249. height:20px;
  250. background-color:#ffffff;
  251. }
  252.  
  253. .tab-links a, .links a {
  254. display:inline-block;
  255. width:20px;
  256. height:20px;
  257. background-color:#fff
  258. -webkit-transition: all .9s ease;
  259. -moz-transition: all .9s ease;
  260. -o-transition: all .9s ease;
  261. -ms-transition: all .9s ease;
  262. transition: all .9s ease;
  263. }
  264.  
  265. .tab-links span, .links span{
  266. position:relative;
  267. width:20px;
  268. height:20px;
  269. font-size:16px;
  270. color:{color:Color 1};
  271. display: flex;
  272. align-items: center;
  273. justify-content: center;
  274. }
  275.  
  276. .tab-links li:hover a, .links li:hover a{
  277. background-color:#fff;
  278. color:{color:Color 2};
  279. }
  280.  
  281. li.main-active a, li.main-active:hover a{
  282. background-color:#fff;
  283. -webkit-transition: all .9s ease;
  284. -moz-transition: all .9s ease;
  285. -o-transition: all .9s ease;
  286. -ms-transition: all .9s ease;
  287. transition: all .9s ease;
  288. margin-top:2px;
  289. }
  290.  
  291. /*------------------------------ SIDEBAR ------------------------------*/
  292.  
  293.  
  294. /*------------------------------ POSTS --------------------------------*/
  295.  
  296. #container{
  297. position:absolute;
  298. {block:IndexPage}
  299. top:30px;
  300. {/block:IndexPage}
  301. {block:PermalinkPage}
  302. top:40px;
  303. {/block:PermalinkPage}
  304. }
  305.  
  306.  
  307. .entry{
  308. position:relative;
  309. margin:20px 0px 20px 0px;
  310. {block:IndexPage}
  311. width:250px;
  312. {/block:IndexPage}
  313. {block:PermalinkPage}
  314. width:500px;
  315. {/block:PermalinkPage}
  316. }
  317.  
  318. /*.entry img hover{
  319. -webkit-filter: grayscale(100%); /* Safari 6.0 - 9.0
  320. filter: grayscale(100%);
  321. } */
  322.  
  323. .thepost{
  324. {block:IndexPage}
  325. width:250px;
  326. {/block:IndexPage}
  327. {block:PermalinkPage}
  328. width:500px;
  329. {/block:PermalinkPage}
  330. }
  331.  
  332. .postcontents{
  333. position:relative;
  334. }
  335.  
  336. iframe, img, embed, object, video {
  337. max-width: 100%;
  338. }
  339.  
  340. /*---- Text Post ----*/
  341.  
  342. .tp-title, .cp-title{
  343. padding:3px;
  344. margin-bottom:3px;
  345. text-align:center;
  346. font-family: 'Sanies';
  347. color:{color:Color 2};
  348. border-top:1px solid {color:Color 2};
  349. }
  350.  
  351. .tp-title{
  352. font-size:26px;
  353. }
  354.  
  355. .tp-body{
  356. padding:7px;
  357. border-bottom:1px solid {color:Color 2};
  358.  
  359. }
  360.  
  361. /*---- Quote Post ----*/
  362.  
  363. .qp-body{
  364. text-align:left;
  365. padding:5px;
  366. border-top:1px solid {color:Color 2};
  367. border-bottom:1px solid {color:Color 2};
  368. font-family: 'Quicksand';
  369. }
  370.  
  371. .qp-source{
  372. text-align:right;
  373. font-size:14px;
  374. font-family:{select:Description Font};
  375. }
  376.  
  377. .short{
  378. font-size:18px;
  379. }
  380.  
  381. .medium{
  382. font-size:16px;
  383. }
  384.  
  385. .long{
  386. font-size:14px;
  387. }
  388.  
  389. /*---- Link Post ----*/
  390.  
  391. .p-link{
  392. display:block;
  393. padding:10px;
  394. background-color:{color:Color 1};
  395. font-family: 'Petit Formal Script', cursive;
  396. font-size:15px;
  397. color:#ffffff;
  398. -webkit-transition: all .4s ease;
  399. -moz-transition: all .4s ease;
  400. -o-transition: all .4s ease;
  401. transition: all .4s ease;
  402. border-top:3px double {color:Color 2};
  403. border-bottom:3px double {color:Color 2};
  404. }
  405.  
  406. a.p-link:hover{
  407. background-color:{color:Color 2};
  408. }
  409.  
  410. .lp-desc{
  411. margin-top:3px;
  412. padding:5px;
  413. background-color:{color:Color 2};
  414. }
  415.  
  416.  
  417. .lp-desc p{
  418. margin:3px 5px 3px 5px;
  419. font-size:10px;
  420. color:#ffffff;
  421. }
  422.  
  423. /*---- Chat Posts ----*/
  424.  
  425. .cp-title{
  426. font-size:15px;
  427. }
  428.  
  429. .cp-body{
  430. font-size:10px;
  431. }
  432.  
  433. .odd, .even{
  434. margin-top:5px;
  435. margin-bottom:5px;
  436. padding:5px;
  437. border:1px solid {color:Color 2};
  438. background-color:#ffffff;
  439. }
  440.  
  441. .odd chatter{
  442. color:{color:Color 2};
  443. }
  444.  
  445. .even chatter{
  446. color:{color:Color 1};
  447. }
  448.  
  449. /*---- Photo Post ----*/
  450.  
  451. #photopost{
  452. position:relative;
  453. overflow:hidden;
  454. -webkit-filter: grayscale(0%);
  455. padding:4px;
  456. border:2px solid {color:Color 2};
  457. }
  458.  
  459. .photohovereffect{
  460. position:absolute;
  461. top:0px;
  462. bottom:0px;
  463. left:0px;
  464. right:0px;
  465. background-color:#ffffff;
  466. -webkit-transition: all .4s ease;
  467. -moz-transition: all .4s ease;
  468. -o-transition: all .4s ease;
  469. transition: all .4s ease;
  470. padding-left:4px;
  471. padding-top:6px;
  472. padding-right:4px;
  473. padding-bottom:4px;
  474. text-transform: uppercase;
  475. text-align:right;
  476. font-size:14px;
  477. font-family:'Raleway';
  478. opacity:0;
  479.  
  480. }
  481.  
  482. .entry:hover .photohovereffect{
  483. opacity:0.6;
  484. -webkit-filter: grayscale(100%);
  485. }
  486.  
  487. /*--Photo Perma--*/
  488.  
  489. .p-permalinks{
  490. position:absolute;
  491. padding:1px;
  492. top:4px;
  493. left:4px;
  494. font-size:26px;
  495. width:236px;
  496. opacity:0;
  497. text-align:center;
  498. -webkit-transition: all .4s ease;
  499. -moz-transition: all .4s ease;
  500. -o-transition: all .4s ease;
  501. transition: all .4s ease;
  502. transition-delay:0s;
  503. background-color:{color:Color 2};
  504. }
  505.  
  506. .entry:hover .p-permalinks{
  507. opacity:1;
  508. transition-delay:0.4s;
  509. }
  510.  
  511. a.photo-perma{
  512. display:inline-block;
  513. position:relative;
  514. margin-top:-15px;
  515. width:auto;
  516. height:30px;
  517. overflow:hidden;
  518. font-size:20px;
  519. color:#fff;
  520. text-transform:uppercase;
  521. }
  522.  
  523. .photo-perma i{
  524. position:relative;
  525. width:40px;
  526. height:40px;
  527. display: flex;
  528. align-items: center;
  529. justify-content: center;
  530. -webkit-transition: all .4s ease;
  531. -moz-transition: all .4s ease;
  532. -o-transition: all .4s ease;
  533. }
  534.  
  535. .like .like_button {
  536. position:relative;
  537.  
  538. }
  539.  
  540. .like .like_button iframe {
  541. position:absolute;
  542. z-index:2;
  543. top:0px;
  544. bottom:0px;
  545. left:0px;
  546. right:0px;
  547. opacity:1;
  548. zoom:750%;
  549. }
  550.  
  551. /*--- Question Posts ---*/
  552.  
  553. .asked{
  554. position:relative;
  555. }
  556.  
  557. .asker-icon{
  558. position:absolute;
  559. top:0px;
  560. left:0px;
  561. width:46px;
  562. height:46px;
  563. }
  564.  
  565. .asker-icon img{
  566. width:46px;
  567. height:46px;
  568. border-radius:100%;
  569. border:1px solid {color:Color 2};
  570. padding:2px;
  571. }
  572.  
  573. .askerquestion{
  574. position:relative;
  575. margin-left:55px;
  576. height:40px;
  577. padding:5px;
  578. border-top:1px solid {color:Color 2};
  579. color:#000;
  580. }
  581.  
  582. .askerquestion a{
  583. color:#000
  584. }
  585.  
  586. .theanswer{
  587. position:relative;
  588. margin-top:5px;
  589. }
  590.  
  591. .answered-q{
  592. padding:5px;
  593. color:#000;
  594. border-top:1px solid {color:Color 1};
  595. border-left:1px solid {color:Color 1};
  596. background-color:#ffffff;
  597. }
  598.  
  599. /*---- Text Based Permas ----*/
  600.  
  601. #textperma{
  602. position:relative;
  603. margin:5px -3px 0px 0px;
  604. text-align:right;
  605. text-transform:uppercase;
  606. }
  607.  
  608. #textperma a perm{
  609. display:inline-block;
  610. margin-right:3px;
  611. width:20px;
  612. height:20px;
  613. background-color:#fff;
  614. text-align:center;
  615. font-size:10px;
  616. color:{color:Color 1};
  617. -webkit-transition: all .4s ease;
  618. -moz-transition: all .4s ease;
  619. -o-transition: all .4s ease;
  620. transition: all .4s ease;
  621. text-transform:uppercase;
  622. }
  623.  
  624. #textperma a:hover perm{
  625. background-color:#ffffff;
  626. color:#000000;
  627. text-transform:uppercase;
  628. }
  629.  
  630. #textperma i{
  631. width:20px;
  632. height:20px;
  633. display: flex;
  634. align-items: center;
  635. justify-content: center;
  636. -webkit-transition: all .4s ease;
  637. -moz-transition: all .4s ease;
  638. -o-transition: all .4s ease;
  639. transition: all .4s ease;
  640. text-transform:uppercase;
  641. }
  642.  
  643.  
  644. /*----Like Button Style----*/
  645.  
  646. #textperma .like .like_button iframe {
  647. position:absolute;
  648. z-index:2;
  649. top:0px;
  650. bottom:0px;
  651. left:0px;
  652. right:0px;
  653. opacity:0;
  654. }
  655.  
  656. /*----------------------PERMALINK PAGE---------------------*/
  657.  
  658. .thepostinfo{
  659. margin:10px 0px 10px 0px;
  660. max-height:300px;
  661. overflow:auto;
  662. padding:10px;
  663. background-color:{color:Color 2};
  664. }
  665.  
  666.  
  667. /*SCROLLBARS SPECIFICALLY FOR CAPTIONS*/
  668. .thepostinfo::-webkit-scrollbar {
  669. width: 5px;
  670. }
  671.  
  672. .thepostinfo::-webkit-scrollbar-track {
  673. background-color:#eeeeee;
  674. }
  675.  
  676. .thepostinfo::-webkit-scrollbar-thumb {
  677. border-top:2px solid {color:Color 2};
  678. border-bottom:2px solid {color:Color 2};
  679. border-left:2px solid {color:Color 2};
  680. border-right:2px solid {color:Color 2};
  681. background-color:#ffffff;
  682. }
  683.  
  684. .postinfo{
  685. margin:2px 0px 2px 0px;
  686. padding:5px;
  687. background-color:#ffffff;
  688. color:#000;
  689. }
  690.  
  691. .posttag{
  692. display:inline-block;
  693. margin:5px;
  694. padding:3px;
  695. background-color:{color:Color 1};
  696. font-size:10px;
  697. color:#ffffff;
  698. -webkit-transition: all .4s ease;
  699. -moz-transition: all .4s ease;
  700. -o-transition: all .4s ease;
  701. transition: all .4s ease;
  702. }
  703.  
  704. .posttag:hover{
  705. background-color:{color:Color 2};
  706. }
  707.  
  708.  
  709. ol.notes{
  710. margin:10px 0px 0px 0px;
  711. max-height:200px;
  712. overflow:auto;
  713. padding:0px;
  714. border:1px solid {color:Color 2};
  715. background-color:#ffffff;
  716. list-style-type:none;
  717. }
  718.  
  719. /*NOTES SPECIFIC SCROLLBARS*/
  720.  
  721. ol.notes::-webkit-scrollbar {
  722. width: 5px;
  723. }
  724.  
  725. ol.notes::-webkit-scrollbar-track {
  726. background-color:#ffffff;
  727. }
  728.  
  729. ol.notes::-webkit-scrollbar-thumb {
  730. border-top:5px solid #ffffff;
  731. border-bottom:5px solid #ffffff;
  732. border-left:2px solid #ffffff;
  733. border-right:2px solid #ffffff;
  734. background-color:{color:Color 2};
  735. }
  736.  
  737. ol.notes li{
  738. position:relative;
  739. margin-top:-1px;
  740. padding:10px 25px 10px 10px;
  741. border-top:1px solid {color:Color 2};
  742. }
  743.  
  744. ol.notes blockquote{
  745. display:inline-block;
  746. font-size:11px;
  747. }
  748.  
  749.  
  750. ol.notes img{
  751. position:absolute;
  752. top:5px;
  753. right:5px;
  754. width:15px;
  755. height:15px;
  756. }
  757.  
  758. .caption{
  759. padding:10px;
  760. background-color:#ffffff;
  761. color:#cccccc;
  762. }
  763.  
  764. .caption a{
  765. color:{color:Color 2};
  766. }
  767.  
  768. .caption b{
  769. color:{color:Color 1};
  770. }
  771.  
  772. .caption h2{
  773. text-align:left;
  774. color:{color:Color 2};
  775. }
  776.  
  777. .tumblr_parent {
  778. margin:0px 0px 5px 0px;
  779. }
  780.  
  781. .tumblr_avatar{
  782. display:none;
  783. }
  784.  
  785. /*------------------------------ POSTS --------------------------------*/
  786.  
  787.  
  788. /*------------------------- LOADING SCREEN ----------------------------*/
  789. #loading {
  790. position:fixed;
  791. top:0px;
  792. bottom:0px;
  793. left:0px;
  794. right:0px;
  795. z-index: 99999999999999999999999999999999999999999;
  796. background-color:#ffffff;
  797. }
  798.  
  799. #loadmessage{
  800. position:fixed;
  801. top:50%;
  802. left:50%;
  803. transform:translate(-50%,-50%);
  804. font-family: 'Petit Formal Script', cursive;
  805. font-size:50px;
  806. color:{color:Color 1};
  807. }
  808. /*---------------------------------------------------------------------*/
  809.  
  810.  
  811. /*------------------------------ BASICS -------------------------------*/
  812.  
  813. .tab-content-posts{ /*The main container of the entire blog*/
  814. position:absolute;
  815. top:20px;
  816. left:52%;
  817. transform:translateX(-50%);
  818. width:540px;
  819. }
  820.  
  821. .tab-content{
  822. position:fixed;
  823. top:20px;
  824. left:52%;
  825. transform:translateX(-50%);
  826. width:540px;
  827. }
  828.  
  829. .main-tab {
  830. display:none;
  831. }
  832.  
  833. .main-tab.active {
  834. display:block;
  835. }
  836.  
  837.  
  838. #infscr-loading {
  839. display: none !important;
  840. }
  841.  
  842. #scrollToTop:link,
  843. #scrollToTop:visited {
  844. display:none;
  845. position:fixed;
  846. bottom:15px;
  847. left:60px;
  848. font-size:30px;
  849. color:{color:Color 1};
  850. }
  851.  
  852. #s-m-t-tooltip {
  853. margin:15px 0px 0px 10px;
  854. padding:5px;
  855. background-color:{color:Color 1};
  856. font-size:10px;
  857. text-align:center;
  858. color:#ffffff;
  859. z-index:99999999999999999999999999999999999;
  860. }
  861.  
  862. ::-moz-selection { /* Code for Firefox */
  863. color: #ffffff;
  864. background: {color:Color 1};
  865. }
  866.  
  867. ::selection {
  868. color: #ffffff;
  869. background: {color:Color 1};
  870. }
  871.  
  872. body{
  873. background-color:#ffffff;
  874. text-align:justify;
  875. font-family: 'Raleway';
  876. font-size:11px;
  877. color:{color:Main Font Color};
  878. }
  879.  
  880. body::-webkit-scrollbar {
  881. width: 4px;
  882. }
  883.  
  884. body::-webkit-scrollbar-track {
  885. background-color:#ffffff;
  886. }
  887.  
  888. body::-webkit-scrollbar-thumb {
  889. border: #ffffff;
  890. background-color:{color:Color 1};
  891. }
  892.  
  893. blockquote{
  894. margin:0px;
  895. }
  896.  
  897. img{
  898. vertical-align:middle;
  899. }
  900.  
  901. hr{
  902. margin:5px 0px 5px 0px;
  903. height:1px;
  904. border:none;
  905. background-color:#cccccc;
  906. }
  907.  
  908. h1{
  909. margin:0px 0px 5px 0px;
  910. font-family: 'amarillo';
  911. font-size:20px;
  912. color:{color:Color 1};
  913. }
  914.  
  915. h2{
  916. font-family: 'amarillo';
  917. font-size:15px;
  918. }
  919.  
  920. p{
  921. margin:5px 0px 5px 0px;
  922. text-align:justify;
  923. font-family: 'Raleway';
  924. font-size:11px;
  925. }
  926.  
  927. ol{
  928. text-align:left;
  929. font-family: 'Raleway';
  930. font-size:11px;
  931. }
  932.  
  933. ul{
  934. text-align:left;
  935. font-family: 'Raleway';
  936. font-size:11px;
  937. }
  938.  
  939. a{
  940. text-decoration:none;
  941. color:{color:Color 1};
  942. }
  943.  
  944. .tmblr-iframe{
  945. position:fixed;
  946. margin-top:1px;
  947. margin-right:0px;
  948. opacity:0.5;
  949. z-index:1000000000000000000000000000000000000000000000000 !important;
  950. -webkit-filter: invert(50%);
  951. }
  952.  
  953. /*------------------------------ BASICS -------------------------------*/
  954.  
  955. </style>
  956.  
  957. </head>
  958.  
  959.  
  960. <body>
  961.  
  962. <!---------------------------- TRANSPARENT
  963.  
  964. <img src="" height='250' style='position:fixed;bottom:40px;left:60px;z-index:999;background-color:#fff'/>
  965.  
  966. <!---------------------------- TRANSPARENT ----------------------------->
  967.  
  968. <!------------------------------ BORDERS ------------------------------->
  969.  
  970. <div id="top"></div>
  971. <div id="left"></div>
  972. <div id="right"></div>
  973. <div id="top2"></div>
  974. <div id="left2"></div>
  975. <div id="right2"></div>
  976.  
  977. <!------------------------------ BORDERS ------------------------------->
  978.  
  979. <!---------------------------- SIDEBAR ICON ---------------------------->
  980. <div id="avatar"><img style="border-radius:100%" src="{image:Sidebar Icon}"/></div> <!--you have to change this manually-->
  981. <!---------------------------- SIDEBAR ICON ---------------------------->
  982.  
  983. <!------------------------------ SIDEBAR ------------------------------->
  984. <div id="sidebar">
  985. <!--------------------------->
  986. <a href="/">
  987. <div id="sb-blogtitle"><div class="blogtitle">{Title}</div></div>
  988. </a>
  989. <!--------------------------->
  990. <div id="sb-description">{Description}</div>
  991. <!--------------------------->
  992. <div id="sb-links">
  993.  
  994. <div id="tabs-n-links">
  995. <ul class="tab-links">
  996. <li class="main-active"><a href="/" title="refresh"><span><i class="fa fa-refresh" aria-hidden="true"></i></span></a></li>
  997.  
  998. <li><a href="/" title="ask away"><span><i class="fa fa-envelope-open" aria-hidden="true"></i></span></a></li>
  999.  
  1000. <li><a href="/" title="explore"><span><i class="fa fa-bars" aria-hidden="true"></i></span></a></li>
  1001.  
  1002. <li><a href="/" title="about"><span><i class="fa fa-address-book" aria-hidden="true"></i></span></a></li>
  1003. </ul>
  1004. </div>
  1005.  
  1006. <!---- I separated the tab links from the regular links as regular links seem to screw up in the ul for tabs ----->
  1007.  
  1008. <ul class="links">
  1009. {block:ifArchiveLink}
  1010. <a href="/archive" title="history"><span><i class="fa fa-bookmark" aria-hidden="true"></i></span></a>
  1011. {/block:ifArchiveLink}
  1012. </ul>
  1013.  
  1014. </div>
  1015. <!--------------------------->
  1016. </div>
  1017. <!------------------------------ SIDEBAR ------------------------------->
  1018.  
  1019.  
  1020.  
  1021. <!---------------------------------------------------------------------->
  1022. <div id="tabs-n-links"><!-- Start Of Tabs -->
  1023.  
  1024. <!----------------------------- TAB 1 -------------------------------->
  1025. <div id="blog-page1" class="tab main-active"><div class="tab-content-posts">
  1026. <div id="container">
  1027. {block:Posts}
  1028. <div class="entry">
  1029. <!-------------------------------------------------------------------->
  1030. <div class="thepost {PostType}">
  1031. <!----------------------------------------------------->
  1032. {block:Text}
  1033. <div class="post text">
  1034. {block:Title}<div class="tp-title">{Title}</div>{/block:Title}
  1035. <div class="tp-body">{Body}</div>
  1036. <!----------------------->
  1037. {block:IndexPage}
  1038. <div id="textperma">
  1039. <a href="{Permalink}" title="{NoteCount} NOTES"><perm><i class="fa fa-comments-o"></i></perm></a>
  1040.  
  1041. <a href="{ReblogURL}" title="REBLOG" target="blank"><perm><i class="fa fa-refresh"></i></perm></a>
  1042.  
  1043. <a title="{12Hour}:{Minutes} {CapitalAmPm}"><perm><i class="fa fa-clock-o"></i></perm></a>
  1044. </div>
  1045. {/block:IndexPage}
  1046. <!----------------------->
  1047. </div>
  1048. {/block:Text}
  1049. <!----------------------------------------------------->
  1050.  
  1051.  
  1052. <!----------------------------------------------------->
  1053. {block:Quote}
  1054. <div class="post quote {Length}">
  1055. <div class="qp-body">
  1056. ❝ {Quote} ❞
  1057. {block:Source}<div class="qp-source">— {Source}</div>{/block:Source}
  1058. </div>
  1059. <!----------------------->
  1060. {block:IndexPage}
  1061. <div id="textperma">
  1062. <a href="{Permalink}" title="{NoteCount} NOTES"><perm><i class="fa fa-comments-o"></i></perm></a>
  1063.  
  1064. <a href="{ReblogURL}" title="REBLOG" target="blank"><perm><i class="fa fa-refresh"></i></perm></a>
  1065.  
  1066. <a title="{12Hour}:{Minutes} {CapitalAmPm}"><perm><i class="fa fa-clock-o"></i></perm></a>
  1067. </div>
  1068. {/block:IndexPage}
  1069. <!----------------------->
  1070. </div>
  1071. {/block:Quote}
  1072. <!----------------------------------------------------->
  1073.  
  1074.  
  1075. <!----------------------------------------------------->
  1076. {block:Link}
  1077. <div class="post link">
  1078. <div class="lp-bg">
  1079. <a href="{URL}" class="p-link {Target}" target="blank">{Name}</a>
  1080.  
  1081. <div class="lp-desc">
  1082. {block:Description}{Description}{/block:Description}
  1083. </div>
  1084. </div>
  1085. <!----------------------->
  1086. {block:IndexPage}
  1087. <div id="textperma">
  1088. <a href="{Permalink}" title="{NoteCount} NOTES"><perm><i class="fa fa-comments-o"></i></perm></a>
  1089.  
  1090. <a href="{ReblogURL}" title="REBLOG" target="blank"><perm><i class="fa fa-refresh"></i></perm></a>
  1091.  
  1092. <a title="{12Hour}:{Minutes} {CapitalAmPm}"><perm><i class="fa fa-clock-o"></i></perm></a>
  1093. </div>
  1094. {/block:IndexPage}
  1095. <!----------------------->
  1096. </div>
  1097. {/block:Link}
  1098. <!----------------------------------------------------->
  1099.  
  1100.  
  1101. <!----------------------------------------------------->
  1102. {block:Chat}
  1103. <div class="post chat">
  1104. {block:Title}<div class="cp-title">{Title}</div>{/block:Title}
  1105.  
  1106. <div class="cp-body">
  1107. {block:Lines}
  1108. <div class="{Alt} user_{UserNumber}">
  1109. {block:Label}<chatter>{Label}</chatter>{/block:Label}
  1110. {Line}
  1111. </div>
  1112. {/block:Lines}
  1113. </div>
  1114.  
  1115. <!----------------------->
  1116. {block:IndexPage}
  1117. <div id="textperma">
  1118. <a href="{Permalink}" title="{NoteCount} NOTES"><perm><i class="fa fa-comments-o"></i></perm></a>
  1119.  
  1120. <a href="{ReblogURL}" title="REBLOG" target="blank"><perm><i class="fa fa-refresh"></i></perm></a>
  1121.  
  1122. <a title="{12Hour}:{Minutes} {CapitalAmPm}"><perm><i class="fa fa-clock-o"></i></perm></a>
  1123. </div>
  1124. {/block:IndexPage}
  1125. <!----------------------->
  1126. </div>
  1127. {/block:Chat}
  1128. <!----------------------------------------------------->
  1129.  
  1130.  
  1131. <!----------------------------------------------------->
  1132. {block:Video}
  1133. <div class="post video">
  1134. {block:IndexPage}{Video-250}{/block:IndexPage}
  1135. {block:PermalinkPage}{Video-500}{/block:PermalinkPage}
  1136. </div>
  1137. <!----------------------->
  1138. {block:IndexPage}
  1139. <div id="textperma">
  1140. <a href="{Permalink}" title="{NoteCount} NOTES"><perm><i class="fa fa-comments-o"></i></perm></a>
  1141.  
  1142. <a href="{ReblogURL}" title="REBLOG" target="blank"><perm><i class="fa fa-refresh"></i></perm></a>
  1143.  
  1144. <a title="{12Hour}:{Minutes} {CapitalAmPm}"><perm><i class="fa fa-clock-o"></i></perm></a>
  1145. </div>
  1146. {/block:IndexPage}
  1147. <!----------------------->
  1148. {block:Video}
  1149. <!----------------------------------------------------->
  1150.  
  1151.  
  1152.  
  1153. <!----------------------------------------------------->
  1154. {block:Audio}
  1155. <div class="post audio">
  1156. {block:AudioEmbed}
  1157. {block:IndexPage}{block:AudioEmbed-250}{/block:IndexPage}
  1158. {block:PermalinkPage}{AudioEmbed-500}{/block:PermalinkPage}
  1159. {/block:AudioEmbed}
  1160.  
  1161. {block:AudioPlayer}{AudioPlayer}{/block:AudioPlayer}
  1162. </div>
  1163. {/block:Audio}
  1164. <!----------------------------------------------------->
  1165.  
  1166.  
  1167. <!----------------------------------------------------->
  1168. {block:Photoset}
  1169. <div class="post photoset">
  1170.  
  1171. <div class="photo-slideshow" id="photoset_{PostID}" data-layout="{PhotosetLayout}">
  1172. {block:Photos}
  1173. <div class="photo-data"><div class="pxu-photo">
  1174. <img src="{PhotoURL-500}" width="{PhotoWidth-500}" height="{PhotoHeight-500}" data-highres="{PhotoURL-HighRes}" data-width="{PhotoWidth-HighRes}" data-height="{PhotoHeight-HighRes}">
  1175. </div>
  1176. <a class="tumblr-box" rel="post-{PostID}" href="{PhotoURL-HighRes}"></a>
  1177. </div>
  1178. {/block:Photos}
  1179. </div>
  1180. <!----------------------->
  1181. {block:IndexPage}
  1182. <div id="textperma">
  1183. <a href="{Permalink}" title="{NoteCount} NOTES"><perm><i class="fa fa-comments-o"></i></perm></a>
  1184.  
  1185. <a href="{ReblogURL}" title="REBLOG" target="blank"><perm><i class="fa fa-refresh"></i></perm></a>
  1186.  
  1187. <a title="{12Hour}:{Minutes} {CapitalAmPm}"><perm><i class="fa fa-clock-o"></i></perm></a>
  1188. </div>
  1189. {/block:IndexPage}
  1190. <!----------------------->
  1191. </div>
  1192. {/block:Photoset}
  1193. <!----------------------------------------------------->
  1194.  
  1195.  
  1196. <!----------------------------------------------------->
  1197. {block:Photo}
  1198. <div class="post photo">
  1199. <div id="photopost">
  1200. <div class="thephoto">
  1201. <img src="{PhotoURL-500}" alt="{PhotoAlt}"/>
  1202. </div>
  1203. <!---------------------------------->
  1204. {block:IndexPage}
  1205. <div class="photohovereffect"></div>
  1206. <div class="p-permalinks">
  1207.  
  1208. <a href="{Permalink}" class="photo-perma" title="{NoteCount} NOTES"><i class="fa fa-align-left" aria-hidden="true"></i></a>
  1209.  
  1210. <a href="{ReblogURL}" class="photo-perma" title="REBLOG"><i class="fa fa-refresh"></i></a>
  1211.  
  1212. <a href="{Permalink}" class="photo-perma" title="{12Hour}:{Minutes} {CapitalAmPm}"><i class="fa fa-clock-o" aria-hidden="true"></i></a>
  1213.  
  1214. </div>
  1215. {/block:IndexPage}
  1216. <!---------------------------------->
  1217. </div>
  1218. </div>
  1219. {/block:Photo}
  1220. <!----------------------------------------------------->
  1221.  
  1222.  
  1223. <!----------------------------------------------------->
  1224. {block:Answer}
  1225. <div class="post answer">
  1226.  
  1227. <div class="thequestion">
  1228. <div class="asker-icon"><img src="{AskerPortraitURL-96}"></div>
  1229. <div class="askerquestion">
  1230. {Asker} asked: <br>
  1231. {Question}
  1232. </div>
  1233. </div>
  1234.  
  1235. {block:NotReblog}
  1236. <div class="theanswer">
  1237. <div class="answered-q">
  1238. {text:Your Name} replied: <br>
  1239. {Answer}
  1240. </div>
  1241. </div>
  1242. {/block:NotReblog}
  1243.  
  1244.  
  1245. {block:IndexPage}
  1246. <div id="textperma">
  1247. <a href="{Permalink}" title="{NoteCount} NOTES"><perm><i class="fa fa-comments-o"></i></perm></a>
  1248.  
  1249. <a href="{ReblogURL}" title="REBLOG" target="blank"><perm><i class="fa fa-refresh"></i></perm></a>
  1250.  
  1251. <a title="{12Hour}:{Minutes} {CapitalAmPm}"><perm><i class="fa fa-clock-o"></i></perm></a>
  1252. </div>
  1253. {/block:IndexPage}
  1254. <!----------------------->
  1255. </div>
  1256. {/block:Answer}
  1257. <!----------------------------------------------------->
  1258. </div>
  1259. {block:PermalinkPage}
  1260. <div class="thepostinfo">
  1261. <div class="postinfo">
  1262. <span><i class="pe-7s-date"></i></span>
  1263. <center><info><i class="fa fa-clock-o"></i> {DayOfMonthWithZero}.{MonthNumberWithZero}.{ShortYear}</info></center>
  1264. </div>
  1265.  
  1266. <div class="postinfo">
  1267. <center><i class="fa fa-bar-chart" aria-hidden="true"></i> {NoteCount} </center>
  1268. </div>
  1269.  
  1270. {block:RebloggedFrom}
  1271. <center><a href="{ReblogParentURL}" target="blank"><div class="postinfo">
  1272. <i class="fa fa-refresh" aria-hidden="true"></i> {ReblogParentName}
  1273. </div></a></center>
  1274. {/block:RebloggedFrom}
  1275.  
  1276. {block:ContentSource}
  1277. <center><a href="{SourceURL}" target="blank"><div class="postinfo">
  1278. <i class="fa fa-globe" aria-hidden="true"></i> {SourceTitle}
  1279. </div></a></center>
  1280. {block:ContentSource}
  1281.  
  1282. {block:Caption}<div class="caption">{Caption}</div>{/block:Caption}
  1283.  
  1284.  
  1285. {block:HasTags}
  1286. <div class="postinfo">
  1287. <span><i class="pe-7s-ticket"></i></span>
  1288. <info><i class="fa fa-tags" aria-hidden="true"></i></info>
  1289. </div>
  1290.  
  1291. {block:Tags}
  1292. <a hreg="{TagURL}" class="posttag">{Tag}</a>
  1293. {/block:Tags}
  1294. {/block:HasTags}
  1295. </div>
  1296.  
  1297. {block:PostNotes}
  1298. {PostNotes-64}
  1299. {/block:PostNotes}
  1300.  
  1301. {/block:PermalinkPage}
  1302. </div>
  1303. {/block:Posts}
  1304. </div>
  1305. </div></div>
  1306.  
  1307. <!---------------------------------------------------------------------->
  1308.  
  1309.  
  1310. <!---------------------------- LOADING SCREEN -------------------------->
  1311.  
  1312. {block:ifLoadingScreen}
  1313. <div id="loading">
  1314. <div id="loadmessage">Loading . . . </div>
  1315. </div>
  1316. {/block:ifLoadingScreen}
  1317. <!---------------------------------------------------------------------->
  1318.  
  1319. {block:ifScrollToTopButton}
  1320. <a href="javascript:;" id="scrollToTop" rel="nofollow" title="Back To Top"><i class="fa fa-arrow-up"></i></a>
  1321.  
  1322. {/block:ifScrollToTopButton}
  1323.  
  1324. <!-------------------- PAGINATION - DON'T REMOVE ----------------------->
  1325. {block:Pagination}
  1326. <div class="pagination" style="visibility:hidden;">
  1327. {block:NextPage}
  1328. <a href="{NextPage}" id="next">Next</a>
  1329. {/block:NextPage}
  1330. </div>
  1331. {/block:Pagination}
  1332.  
  1333. <!------------ Functionality [BE CAREFUL, EASY TO FUCK UP] ------------->
  1334. <script>
  1335. $(function(){
  1336.  
  1337. // ------------------------- LOADING SCREEN ----------------------------
  1338.  
  1339. {block:ifLoadingScreen}
  1340. $(window).load(function () {
  1341. setTimeout(function() {
  1342. $("#loading").fadeOut("slow");
  1343. }, 6600);
  1344. });
  1345. {/block:ifLoadingScreen}
  1346.  
  1347. // ------------------------- Style My Tooltips -------------------------
  1348.  
  1349. (function($){
  1350. $(document).ready(function(){
  1351. $("a[title]").style_my_tooltips({
  1352. tip_follows_cursor:true,
  1353. tip_delay_time:90,
  1354. tip_fade_speed:600,
  1355. attribute:"title"
  1356. });
  1357. });
  1358. })(jQuery);
  1359.  
  1360.  
  1361.  
  1362.  
  1363. // ----------------------- Unnest by NEO --------------------------------
  1364.  
  1365. $('.entry').unnest({ //posts themselves
  1366. yourCaption: ".caption", //caption div
  1367. wrapName: ".tumblr_parent", //unnested captions
  1368. newCaptionUsername: true, //add username
  1369. originalPostCaptionUsername: true, //adds username regardless
  1370. tumblrAvatars: true, // user avatars
  1371. tumblrAvatarClass: ".tumblr_avatar", // avatar class
  1372. usernameColon: false
  1373. });
  1374.  
  1375. //---------------------------- PXU Photosets ----------------------------
  1376.  
  1377. $('.photo-slideshow').pxuPhotoset({
  1378. lightbox: false,
  1379. rounded: false,
  1380. gutter: '{select:Photoset Gutter Size}',
  1381. photoset: '.photo-slideshow',
  1382. photoWrap: '.photo-data',
  1383. photo: '.pxu-photo'
  1384. });
  1385.  
  1386. });
  1387.  
  1388. // -------------------------- Infinite Scroll ---------------------------
  1389.  
  1390. {block:IndexPage}
  1391. (function () {
  1392. var $blogcontent = $('#container'); //posts container
  1393. $blogcontent.imagesLoaded(function () {
  1394. $blogcontent.masonry({
  1395. itemSelector: '.entry', //posts themselves
  1396. isAnimated:false,
  1397. columnWidth:250,
  1398. gutterWidth:40,
  1399. });
  1400. });
  1401. $blogcontent.infinitescroll({
  1402. navSelector : "div.pagination", //pagination div
  1403. nextSelector : ".pagination a#next", //pagination next
  1404. itemSelector : ".entry",
  1405. loading: {
  1406. finishedMsg: "<p>You have reached the end of the internet. Now go outside and get some fresh air.</p>", // if you scroll that far
  1407. msg: null,
  1408. msgText: "",
  1409. },
  1410. },
  1411.  
  1412. function( newElements ) {
  1413. var $newElems = $( newElements );
  1414. $newElems.find('.photo-slideshow').pxuPhotoset({ //pxu callback
  1415. lightbox: false,
  1416. rounded: false,
  1417. gutter: '3px',
  1418. photoset: '.photo-slideshow',
  1419. photoWrap: '.photo-data',
  1420. photo: '.pxu-photo'
  1421. },
  1422.  
  1423. function(){
  1424. $blogcontent.masonry({
  1425. itemSelector: '.entry',
  1426. columnWidth:250,
  1427. gutterWidth:40,
  1428. });
  1429. });
  1430. var $newElems = $(newElements).css({
  1431. opacity: 0,
  1432. zIndex: -1,
  1433. });
  1434. $newElems.imagesLoaded(function(){
  1435. $newElems.animate({ opacity: 1, zIndex: 1 });
  1436. $blogcontent.masonry( 'appended', $newElems );
  1437. });
  1438.  
  1439. });
  1440. })();
  1441. {/block:IndexPage}
  1442. </script>
  1443. <!---------------------------------------------------------------------->
  1444.  
  1445.  
  1446. <!--DO NOT REMOVE-->
  1447. <div style="bottom:15px;right:30px;position:fixed;"><a href="http://diamondthemes.tumblr.com/"><img title="diamondthemes" style="width:16px; height:16px" src="http://data.whicdn.com/images/73645613/original.png"/></a></div>
  1448. <!--DO NOT REMOVE-->
  1449. </body>
  1450.  
  1451.  
  1452. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!