API tools faq
paste
Advertisement
PetitePixel

Theme #002: Animal

PetitePixel
Oct 18th, 2019
2,328
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 50.09 KB | None | 0 0
raw download clone embed print report
  1. <!---
  2.  
  3.  
  4. THEME #002: ANIMAL
  5. CREATED BY PETITEPIXEL FOR PERSONAL USE.
  6. PLEASE DO NOT TAKE ANY OF
  7. MY CODE OR CLAIM AS YOUR OWN. IF YOU HAVE
  8. QUESTIONS PLEASE CONTACT PETITEPIXEL AT
  9. PETITEPIXEL.TUMBLR.COM/MAIL
  10.  
  11.  
  12. --->
  13.  
  14.  
  15. <html>
  16. <head>
  17.  
  18. <title>{Title}</title>
  19. <link rel="shortcut icon" href="{Favicon}">
  20. <link rel="altertnate" type="application/rss+xml" href="{RSS}">
  21. <meta name="description" content="" />
  22. <meta http-equiv="x-dns-prefetch-control" content="off"/>
  23.  
  24. <script type="text/javascript" src="https://static.tumblr.com/iuggpng/bGqm4yfv9/jquery-1.7.2.js"></script>
  25.  
  26.  
  27.  
  28. <!-- DEFAULT VARIABLES -->
  29. <meta name="color:background" content="#ffffff"/>
  30. <meta name="color:background two" content="#ffdcdc"/>
  31. <meta name="color:blockquote" content="#f0f0f0"/>
  32. <meta name="color:blockquote border" content="#ffdcdc"/>
  33. <meta name="color:blogroll background" content="#ffdbdb"/>
  34. <meta name="color:blogroll links" content="#fff"/>
  35. <meta name="color:blogroll text" content="#ecada6"/>
  36. <meta name="color:chat even" content="#fff0f0"/>
  37. <meta name="color:chat odd" content="#ffcece"/>
  38. <meta name="color:chat text" content="#363636"/>
  39. <meta name="color:highlight background" content="#ffdcdc"/>
  40. <meta name="color:highlight text" content="#ffffff"/>
  41. <meta name="color:info links" content="#ffffff"/>
  42. <meta name="color:info background" content="#ffcbcb"/>
  43. <meta name="color:link excerpt background" content="#ffdcdc"/>
  44. <meta name="color:links" content="#ecada6"/>
  45. <meta name="color:links hover" content="#000"/>
  46. <meta name="color:music player background" content="#ecada6"/>
  47. <meta name="color:music song title" content="#fff"/>
  48. <meta name="color:music track info" content="#363636"/>
  49. <meta name="color:nav links" content="#363636"/>
  50. <meta name="color:nav links hover" content="#000000"/>
  51. <meta name="color:nav links background" content="#ffdcdc"/>
  52. <meta name="color:nav links border" content="#000"/>
  53. <meta name="color:nav links active" content="#fff"/>
  54. <meta name="color:nav links background active" content="#000000"/>
  55. <meta name="color:nav links border active" content="#fff"/>
  56. <meta name="color:posts" content="#fff"/>
  57. <meta name="color:post borders" content="#f0f0f0"/>
  58. <meta name="color:post title" content="#ecada6"/>
  59. <meta name="color:post title background" content="#ffdcdc"/>
  60. <meta name="color:question background" content="#ecada6"/>
  61. <meta name="color:quote border" content="#cccccc"/>
  62. <meta name="color:sidebar" content="#ecada6"/>
  63. <meta name="color:sidebar title" content="#fff"/>
  64. <meta name="color:tags" content="#666666"/>
  65. <meta name="color:tag page titles" content="#fff"/>
  66. <meta name="color:tag page title background" content="#ecada6"/>
  67. <meta name="color:text" content="#363636"/>
  68.  
  69. <!-- DEFAULT SCROLLBAR -->
  70. <meta name="color:scrollbar track" content="#ffdcdc"/>
  71. <meta name="color:scrollbar accent" content="#ffcbcb"/>
  72. <meta name="color:highlight text" content="#363636"/>
  73.  
  74. <!-- DEFAULT TOOLTIPS -->
  75. <meta name="color:tooltip background" content="#ecada6"/>
  76. <meta name="color:tooltip text" content="#fff"/>
  77. <meta name="color:tooltip accent" content="#ffdcdc"/>
  78.  
  79. <!-- DEFAULT IMAGE -->
  80. <meta name="image:background" content="https://static.tumblr.com/jubuz4o/du0pzc8up/pinkleopard.png"/>
  81. <meta name="image:sidebar" content="https://static.tumblr.com/jubuz4o/CWopzc8tw/savsidebar.png"/>
  82. <meta name="image:profile" content="https://static.tumblr.com/jubuz4o/CWopzc8tw/savsidebar.png"/>
  83.  
  84. <!-- DEFAULT TEXT -->
  85. <meta name="text:Lightbox RGBO" content="255, 203, 203, 0.8"/>
  86. <meta name="text:Container Shadow" content="255, 203, 203"/>
  87. <meta name="text:Title One" content="Theme #002: Animal"/>
  88.  
  89.  
  90.  
  91. <style type="text/css">
  92. /* --- FOLLOW BUTTONS --------------------------------- */
  93. iframe.tmblr-iframe {
  94. z-index:99999999999999!important;
  95. top:-2px!important;
  96. right:0!important;
  97. opacity:0;
  98. padding-right:38px;
  99. /* delete invert(1) from here */
  100. filter:invert(1) contrast(150%);
  101. -webkit-filter:invert(1) contrast(150%);
  102. -o-filter:invert(1) contrast(150%);
  103. -moz-filter:invert(1) contrast(150%);
  104. -ms-filter:invert(1) contrast(150%);
  105. /* to here if your blog has a dark background */
  106. transform:scale(0.65);
  107. transform-origin:100% 0;
  108. -webkit-transform:scale(0.65);
  109. -webkit-transform-origin:100% 0;
  110. -o-transform:scale(0.65);
  111. -o-transform-origin:100% 0;
  112. -moz-transform:scale(0.65);
  113. -moz-transform-origin:100% 0;
  114. -ms-transform:scale(0.65);
  115. -ms-transform-origin:100% 0;}
  116.  
  117. iframe.tmblr-iframe:hover {
  118. opacity:0.6!important;}
  119.  
  120. .hcontrols {
  121. position:fixed;
  122. top:0;
  123. right:0;
  124. z-index:999999999;}
  125.  
  126. .hcontrols svg {
  127. width:14px;
  128. height:14px;
  129. padding:9px;}
  130.  
  131. .hcontrols svg path {
  132. fill:{color:text};/* change this to change the color of the icon */}
  133.  
  134.  
  135.  
  136.  
  137.  
  138. /* --- SCROLLBAR --------------------------------- */
  139. ::-webkit-scrollbar {
  140. height:0px;
  141. width:6px;
  142. background:{color:scrollbar track};
  143. border-left:1px solid {color:scrollbar track};
  144. }
  145.  
  146. ::-webkit-scrollbar-thumb:vertical {
  147. height:auto;
  148. width:7px;
  149. border-left:1px solid {color:scrollbar track};
  150. background:{color:scrollbar accent};
  151. }
  152.  
  153. ::-webkit-scrollbar-thumb:hotizontal {
  154. display:none;
  155. }
  156.  
  157. ::selection {
  158. background:{color:scrollbar accent};
  159. color:{color:highlight text};
  160. }
  161.  
  162. ::-webkit-selection {
  163. background:{color:scrollbar accent};
  164. color:{color:highlight text};
  165. }
  166.  
  167. ::-moz-selection {
  168. background:{color:scrollbar accent};
  169. color:{color:highlight text};
  170. }
  171.  
  172.  
  173.  
  174.  
  175.  
  176. /* --- LIGHTBOX --------------------------------- */
  177. .vignette, #vignette {
  178. opacity:0;
  179. }
  180. .lightbox-image, #tumblr_lightbox img {
  181. box-shadow:none !important;
  182. border-radius:0 !important;
  183. max-width:none;
  184. }
  185.  
  186. .tmblr-lightbox, #tumblr_lightbox {
  187. background-color:rgba({text:Lightbox RGBO}) !important;
  188. }
  189.  
  190. .lightbox-image, #tumblr_lightbox img {
  191. border:5px solid #fff !important;
  192. -moz-box-sizing:border-box;
  193. box-sizing:border-box;
  194. }
  195.  
  196. .lightbox-caption, #tumblr_lightbox_caption {
  197. visibility: hidden;
  198. }
  199.  
  200.  
  201.  
  202.  
  203.  
  204. /* --- TOOLIPS --------------------------------- */
  205. #s-m-t-tooltip {
  206. max-width: 300px;
  207. padding: 3px 7px;
  208. margin: -20px 0px 0px 20px;
  209. background: {color:tooltip background};
  210. color: {color:tooltip text};
  211. font-size: 7px;
  212. font-family: 'Barlow', sans-serif;
  213. font-weight: 700;
  214. text-transform: uppercase;
  215. opacity: 1;
  216. letter-spacing: 1px;
  217. border-bottom:1px solid {color:tooltip accent};
  218. z-index: 999999999999;
  219. }
  220.  
  221.  
  222.  
  223.  
  224.  
  225. /* --- BODY --------------------------------- */
  226. body {
  227. line-height: 1.5;
  228. font-weight: 400;
  229. font-size: 10px;
  230. font-family: 'Barlow', sans-serif;
  231. color: {color:text};
  232. background: {color:background two};
  233. background-image: url('{image:background}');
  234. background-repeat: repeat;
  235. background-position: center;
  236. background-attachment: fixed;
  237. }
  238.  
  239. a {
  240. color: {color:links};
  241. text-decoration: none;
  242. -moz-transition-duration: 0.5s;
  243. -o-transition-duration: 0.5s;
  244. -webkit-transition-duration: 0.5s;
  245. transition-duration: 0.5s;
  246. }
  247.  
  248. a:hover {
  249. color: {color:links hover};
  250. -moz-transition-duration: 0.5s;
  251. -o-transition-duration: 0.5s;
  252. -webkit-transition-duration: 0.5s;
  253. transition-duration: 0.5s;
  254. }
  255.  
  256. .container {
  257. margin: 65px auto 0px auto;
  258. padding: 10px;
  259. width: 800px;
  260. height: 500px;
  261. background:#fff;
  262. overflow-x:hidden;
  263. background:{color:background};
  264. box-shadow:0px 0px 20px {text:Container Shadow};
  265. }
  266.  
  267.  
  268.  
  269.  
  270.  
  271. /* --- POSTS --------------------------------- */
  272. .entries {
  273. margin: 10px 0px 20px 260px;
  274. width: 420px;
  275. }
  276.  
  277. .posts {
  278. position: relative;
  279. margin-left:20px;
  280. padding: 10px;
  281. width: 400px;
  282. background:{color:posts};
  283. border:1px solid {color:post borders};
  284. }
  285.  
  286. .posts img {
  287. max-width: 100%;
  288. height: auto;
  289. list-style-type:none;
  290. cursor: pointer;
  291. }
  292.  
  293. .posts li, .posts ol {
  294. max-width: 100%;
  295. height: auto;
  296. list-style-type:none;
  297. }
  298.  
  299. .texts {
  300. text-align: justify;
  301. margin-top: -5px;
  302. padding-top: 0px;
  303. padding-right: 5px;
  304. padding-left: 5px;
  305. padding-bottom: 0px;
  306. }
  307.  
  308. .texts ul, .texts ul li{
  309. list-style-type: square!important;
  310. }
  311.  
  312. .texts ol, .texts ol li {
  313. list-style-type: upper-roman!important;
  314. }
  315.  
  316. h1, h2, h3 {
  317. margin-top: 0px;
  318. padding:15px;
  319. text-align: center;
  320. text-transform: uppercase;
  321. line-height: 1.5;
  322. font-weight: 700;
  323. font-size: 16px;
  324. font-family: 'Barlow', sans-serif;
  325. color: {color:post title};
  326. background: {color:post title background};
  327. }
  328.  
  329.  
  330.  
  331.  
  332.  
  333. /* --- REBLOG LAYOUT --------------------------------- */
  334. .reblog-header {
  335. margin-top: -10px;
  336. margin-left: -10px;
  337. padding: 5px;
  338. width: 410px;
  339. border-bottom: 1px solid {color:post borders};
  340. background:{color:posts};
  341. }
  342.  
  343. .reblog-avatar {
  344. display: inline-block;
  345. margin-bottom: -10px;
  346. padding: 10px;
  347. vertical-align: middle;
  348. line-height: 2.8;
  349. }
  350.  
  351. .reblog-avatar img {
  352. width: 20px;
  353. height: auto;
  354. border-radius: 4px;
  355. }
  356.  
  357. .username {
  358. display: inline-block;
  359. margin-left: -6px;
  360. text-transform: uppercase;
  361. vertical-align: middle;
  362. letter-spacing:0.5;
  363. font-weight: 600;
  364. font-size: 8px;
  365. color:{color:text};
  366. }
  367.  
  368. .username a {
  369. color:{color:links};
  370. }
  371.  
  372. .username a:hover {
  373. color:{color:links hover};
  374. }
  375.  
  376. .reblog-list {
  377. margin-left: -5px;
  378. padding: 5px;
  379. width: 400px;
  380. }
  381.  
  382. .reblog-content {
  383. margin-left: -5px;
  384. padding: 5px;
  385. width: 400px;
  386. overflow:hidden;
  387. }
  388.  
  389. .reblog-content img {
  390. height: auto!important;
  391. max-width: 400px!important;
  392. min-width: 400px!important;
  393. }
  394.  
  395.  
  396.  
  397.  
  398.  
  399. /* --- UNESTED CAPTIONS --------------------------------- */
  400. .tumblr_blog {
  401. display: block;
  402. margin-bottom: 5px;
  403. margin-top: 5px;
  404. vertical-align: middle;
  405. line-height: 28px;
  406. font-weight: 700;
  407. font-size: 10px;
  408. font-family: 'Barlow', sans-serif;
  409. }
  410.  
  411. a.tumblr_blog {
  412. display: inline-block;
  413. margin-top: 6px;
  414. padding-top: 3px;
  415. padding-left: 5px;
  416. padding-right: 5px;
  417. padding-bottom: 3px;
  418. height: 13px;
  419. text-transform: uppercase;
  420. line-height: 1.4;
  421. font-weight: 700;
  422. font-size: 9px;
  423. color: {color:text};
  424. }
  425.  
  426. .tumblr_avatar {
  427. display: inline-block;
  428. float: left;
  429. margin-top: 5px;
  430. margin-right: 5px;
  431. width: 20px;
  432. height: 20px;
  433. border-radius: 2px;
  434. }
  435.  
  436. .tmblr-attribution {
  437. margin-top: -5px;
  438. margin-left: 10px;
  439. width: 95%;
  440. padding: 5px;
  441. text-transform: uppercase;
  442. font-size:7px;
  443. text-align: right;
  444. }
  445.  
  446.  
  447.  
  448.  
  449.  
  450. /* --- BLOCKQUOTES --------------------------------- */
  451. blockquote {
  452. margin-left: 0px;
  453. padding: 5px;
  454. width: 385px;
  455. background:{color:blockquote};
  456. border-left: 2px solid {color:blockquote border};
  457. }
  458.  
  459. blockquote blockquote {
  460. background:{color:blockquote};
  461. border: none;
  462. padding:0px;
  463. }
  464.  
  465. blockquote img {
  466. height: auto!important;
  467. max-width: 350px!important;
  468. }
  469.  
  470. .texts blockquote {
  471. margin-left: -2px;
  472. padding: 5px;
  473. width: 380px;
  474. background:{color:blockquote};
  475. border-left: 2px solid {color:blockquote border};
  476. }
  477.  
  478.  
  479.  
  480.  
  481.  
  482. /* --- TABS --------------------------------- */
  483. .tabs {
  484. display:block;
  485. margin-left:0px;
  486. width:200px;
  487. }
  488.  
  489. /*----- Tab Links -----*/
  490.  
  491. /* Clearfix */
  492. .tab-links:after {
  493. display:block;
  494. clear:both;
  495. content:'';
  496. }
  497.  
  498. .tab-links {
  499. margin-left:2px;
  500. padding:0px;
  501. }
  502.  
  503. .tab-links li {
  504. display:inline-block;
  505. list-style:none;
  506. text-align: center;
  507. }
  508.  
  509. .tab-links a {
  510. display:inline-block;
  511. margin:3px 3px;
  512. padding:5px;
  513. min-width: 80px;
  514. color:{color:nav links};
  515. background:{color:nav links background};
  516. transition:all linear 0.15s;
  517. border-bottom:1px solid transparent;
  518. border-top:1px solid transparent;
  519. }
  520.  
  521. .tab-links a:hover {
  522. border-bottom:1px solid {color:nav links border};
  523. text-decoration:none;
  524. }
  525.  
  526. li.active a, li.active a:hover {
  527. background:transparent;
  528. color:{color:nav links active};
  529. background:{color:nav links background active};
  530. border-bottom:1px solid {color:nav links border active};
  531. -webkit-transition: all .3s;
  532. -moz-transition: all .3s;
  533. -o-transition: all .3s;
  534. -ms-transition: all .3s;
  535. transition: all .3s;
  536. }
  537.  
  538. /*----- Content of Tabs -----*/
  539. .tab-content {
  540. padding:15px;
  541. border-radius:0px;
  542. }
  543.  
  544. .tab {
  545. display:none;
  546. }
  547.  
  548. .tab.active {
  549. display:block;
  550. }
  551.  
  552. #tab2 {
  553. margin: 5px 0px 75px 230px;
  554. width: 560px;
  555. background:{color:posts};
  556. }
  557.  
  558. #tab3 {
  559. margin: 5px 0px 75px 230px;
  560. width: 560px;
  561. background:{color:posts};
  562. }
  563.  
  564. #tab4 {
  565. margin: 5px 0px 75px 230px;
  566. width: 560px;
  567. background:{color:posts};
  568. }
  569.  
  570. #tab5 {
  571. margin: 5px 0px 75px 230px;
  572. width: 560px;
  573. background:{color:posts};
  574. }
  575.  
  576.  
  577.  
  578.  
  579.  
  580. /* --- SIDEBAR --------------------------------- */
  581. .sidebar {
  582. position: fixed;
  583. padding: 10px;
  584. top:65px;
  585. left:270px;
  586. width: 200px;
  587. height: 500px;
  588. background:{color:sidebar};
  589. }
  590.  
  591. .sidebar img {
  592. margin-top:10px;
  593. margin-bottom:10px;
  594. width:150px;
  595. height: 150px;
  596. border-radius:100%;
  597. }
  598.  
  599. .tit {
  600. position: relative;
  601. margin-bottom:5px;
  602. width: 200px;
  603. text-align:center;
  604. text-transform:uppercase;
  605. line-height: 1.2;
  606. font-weight: 700;
  607. font-size: 14px;
  608. color:{color:sidebar title};
  609. }
  610.  
  611. .desc {
  612. position: relative;
  613. width: 200px;
  614. text-align: justify;
  615. }
  616.  
  617. .credit {
  618. position:relative;
  619. margin-top:-42px;
  620. margin-left:100px;
  621. }
  622.  
  623. .credit a {
  624. display:inline-block;
  625. margin:3px 3px;
  626. padding:5px;
  627. min-width: 80px;
  628. text-align:center;
  629. color:{color:nav links};
  630. background:{color:nav links background};
  631. transition:all linear 0.15s;
  632. border-bottom:1px solid transparent;
  633. border-top:1px solid transparent;
  634. }
  635.  
  636. .credit a:hover {
  637. border-bottom:1px solid ;
  638. text-decoration:none;
  639. }
  640.  
  641.  
  642.  
  643.  
  644.  
  645. /* --- PAGNATION --------------------------------- */
  646. .pagi {
  647. position:relative;
  648. margin-top:60px;
  649. margin-left: -5px;
  650. padding: 5px;
  651. width: 200px;
  652. font-size: 12px;
  653. font-family: 'Barlow', sans-serif;
  654. font-weight: 400;
  655. line-height: 1.8;
  656. letter-spacing: 0.5px;
  657. font-style: italic;
  658. text-transform: uppercase;
  659. text-align: center;
  660. {block:AskPage}
  661. display:none!important;
  662. {/block:AskPage}
  663. }
  664.  
  665. .pagi a {
  666. color:{color:links hover};
  667. margin: 0px 8px;
  668. }
  669.  
  670. .pagi a:hover {
  671. color:{color:nav links};
  672. margin: 0px 8px;
  673. }
  674.  
  675. .current_page {
  676. padding-top: 5px;
  677. padding-left:10px;
  678. padding-right: 10px;
  679. padding-bottom: 5px;
  680. font-weight: 700;
  681. color:{color:nav links};
  682. background:{color:nav links background};
  683. border-radius: 4px;
  684. }
  685.  
  686.  
  687.  
  688.  
  689.  
  690. /* --- AUDIO POSTS --------------------------------- */
  691. #cover img {
  692. float: left;
  693. margin-left: 0px;
  694. width: 70px;
  695. height: 70px;
  696. }
  697.  
  698. .audioplayer {
  699. margin-top: 3px;
  700. margin-left: 3px;
  701. padding: 3px;
  702. width: 24px;
  703. height: 24px;
  704. overflow: hidden;
  705. }
  706.  
  707. #audioplayerbackground {
  708. position: absolute;
  709. z-index: 1;
  710. width: 40px;
  711. height: 40px;
  712. margin-top: 15px;
  713. margin-left: 15px;
  714. background: #fff;
  715. opacity: 0.6;
  716. -webkit-transition: opacity 0.8s linear;
  717. -webkit-transition: all 0.5s ease-out;
  718. -moz-transition: all 0.5s ease-out;
  719. transition: all 0.5s ease-out;
  720. }
  721.  
  722. #audioplayerbackground:hover {
  723. opacity: .4;
  724. -webkit-transition: opacity 0.8s linear;
  725. -webkit-transition: all 0.5s ease-out;
  726. -moz-transition: all 0.5s ease-out;
  727. transition: all 0.5s ease-out;
  728. }
  729.  
  730. .track {
  731. text-transform: uppercase;
  732. letter-spacing: 0px;
  733. font-style: bold;
  734. font-size: 14px;
  735. font-weight: 700;
  736. font-family: 'Barlow', sans-serif;
  737. color: {color:music song title};
  738. }
  739.  
  740. .musician {
  741. display: block;
  742. margin-top: 0px;
  743. margin-left: 75px;
  744. margin-bottom: 10px;
  745. padding-top: 15px;
  746. padding-right: 30px;
  747. padding-left: 20px;
  748. width: 275px;
  749. height: 55px;
  750. letter-spacing: 1px;
  751. line-height: 1.3;
  752. text-align: left;
  753. font-style: none;
  754. font-size: 10px;
  755. font-family: 'Barlow', sans-serif;
  756. color: {color:music track info};
  757. background: {color:music player background};
  758. }
  759.  
  760. .spotify_audio_player {
  761. height: 80px !important;
  762. width: 400px;
  763. }
  764.  
  765.  
  766.  
  767.  
  768.  
  769. /* --- QUESTIONS + ANSWERS --------------------------------- */
  770. .question {
  771. margin-bottom: 10px;
  772. padding: 20px;
  773. background: {color:question background};
  774. }
  775.  
  776. .asker-question {
  777. margin-top: 10px;
  778. text-align: justify;
  779. line-height: 1.4;
  780. }
  781.  
  782. .asker {
  783. display: block;
  784. margin-top: -38px;
  785. margin-left: 50px;
  786. font-family: 'Barlow Semi Condensed', sans-serif;
  787. font-weight: 700;
  788. font-size: 14px;
  789. text-transform: uppercase;
  790. }
  791.  
  792. .asker-icon {
  793. margin-right: 5px;
  794. margin-bottom: 5px;
  795. width: 30px;
  796. height: 30px;
  797. border: 5px solid {color:posts};
  798. background: {color:posts};
  799. }
  800.  
  801. .asker span {
  802. display: block;
  803. vertical-align: middle;
  804. margin-top: -5px;
  805. margin-left: 0px;
  806. font-size: 9px;
  807. font-weight: 400!important;
  808. text-transform: lowercase;
  809. }
  810.  
  811. .asker a {
  812. margin-left: 0px;
  813. color:{color:links};
  814. font-weight: 700;
  815. }
  816.  
  817. .asker a:hover {
  818. color:{color:links hover};
  819. font-weight: 700;
  820. }
  821.  
  822. .answerer {
  823. display: block;
  824. margin-top: -52px;
  825. margin-left: 40px;
  826. margin-bottom: 10px;
  827. font-family: 'Barlow Semi Condensed', sans-serif;
  828. font-weight: 700;
  829. font-size: 11px;
  830. text-transform: uppercase;
  831. }
  832.  
  833. .answerer-icon {
  834. margin-right: 5px;
  835. margin-bottom: 25px;
  836. width: 24px;
  837. height: 24px;
  838. border: 5px solid {color:posts};
  839. background: {color:posts};
  840. }
  841.  
  842. .answerer a {
  843. margin-left: 0px;
  844. color:{color:links};
  845. font-weight: 700;
  846. }
  847.  
  848. .answerer a:hover {
  849. color:{color:links hover};
  850. font-weight: 700;
  851. }
  852.  
  853. .answerer-question {
  854. margin-top: 10px;
  855. padding: 15px;
  856. text-align: justify;
  857. line-height: 1.8;
  858. background: {color:question background};
  859. }
  860.  
  861. .replies {
  862. margin-top:-10px;
  863. padding: 5px;
  864. text-align: justify;
  865. background:{color:blockqote};
  866. }
  867.  
  868.  
  869.  
  870.  
  871.  
  872. /* --- LINK POSTS --------------------------------- */
  873. .link-tit {
  874. margin-top: 0px;
  875. padding:15px;
  876. text-align: center;
  877. text-transform: uppercase;
  878. line-height: 1.3;
  879. font-weight: 700;
  880. font-size: 16px;
  881. font-family: 'Barlow', sans-serif;
  882. color: {color:post title};
  883. background: {color:post title background};
  884. }
  885.  
  886. .link-tit a {
  887. color: {color:post title};
  888. background: {color:post title background};
  889. }
  890.  
  891. .link-tit a:hover {
  892. color: {color:links};
  893. background: {color:post title background};
  894. }
  895.  
  896. .linkexpt {
  897. margin-top: 10px;
  898. margin-left: 1px;
  899. padding: 5px;
  900. width: 385px;
  901. background:{color:link excerpt background};
  902. border-left: 2px solid {color:blockquote border};
  903. }
  904.  
  905. .linkdesc {
  906. text-align:justify;
  907. background:{color:posts};
  908. }
  909.  
  910.  
  911.  
  912.  
  913.  
  914. /* --- QUOTES --------------------------------- */
  915. .qwrap {
  916. padding: 5px;
  917. }
  918.  
  919. .quote {
  920. margin: 30px;
  921. padding: 30px;
  922. text-align: center;
  923. line-height: 1.4;
  924. font-style: italic;
  925. font-size: 14px;
  926. font-weight: 900;
  927. color: {color:text};
  928. border-top: 1px solid {color:quote border};
  929. border-bottom: 1px solid {color:quote border};
  930. }
  931.  
  932. .quote a {
  933. display: block;
  934. color: {color:links};
  935. }
  936.  
  937. .source {
  938. display: block;
  939. margin-top: 10px;
  940. line-height: 1.2!important;
  941. font-weight: 400;
  942. font-size: 10px;
  943. }
  944.  
  945. .source a.tumblr_blog {
  946. display: none;
  947. line-height: 1.2;
  948. }
  949.  
  950.  
  951.  
  952.  
  953.  
  954. /* --- CHAT --------------------------------- */
  955. .chat {
  956. width: 490px;
  957. color: {color:chat text};
  958. }
  959.  
  960. .chat ol {
  961. padding: 0;
  962. line-height: 180%;
  963. list-style-type: none !important;
  964. color: {color:chat text};
  965. }
  966.  
  967. .chat li {
  968. list-style-type: none !important;
  969. color: {color:chat text};
  970. }
  971.  
  972. .line.odd {
  973. list-style-type: none !important;
  974. margin-bottom: 2px;
  975. padding: 5px;
  976. color: {color:chat text};
  977. background: {color:chat odd};
  978. }
  979.  
  980. .line.even {
  981. list-style-type: none !important;
  982. margin-bottom: 2px;
  983. padding: 5px;
  984. color: {color:chat text};
  985. background: {color:chat even};
  986. }
  987.  
  988. .label {
  989. padding-right: 1px;
  990. letter-spacing: 0px;
  991. text-transform: uppercase;
  992. font-weight: 700;
  993. font-size: 10px;
  994. font-family: 'Barlow', sans-serif;
  995. color: {color:chat text};
  996. }
  997.  
  998.  
  999.  
  1000.  
  1001.  
  1002. /* --- VIDEO POSTS --------------------------------- */
  1003. .tumblr_video_container {
  1004. width:500px!important;
  1005. height:auto!important;
  1006. }
  1007.  
  1008. video {
  1009. width:500px!important;
  1010. height:auto!important;
  1011. }
  1012.  
  1013. blockquote video {
  1014. width:500px!important;
  1015. height:auto!important;
  1016. }
  1017.  
  1018.  
  1019.  
  1020.  
  1021.  
  1022. /* --- DATE + TAGS + REBLOG/LIKED --------------------------------- */
  1023. .bottom {
  1024. position: relative;
  1025. margin: 5px 0px 5px 20px;
  1026. padding: 0px;
  1027. width: 422px;
  1028. background:transparent;
  1029. }
  1030.  
  1031. .bottom a {
  1032. color:{color:info links};
  1033. text-transform: uppercase;
  1034. font-weight: 700;
  1035. }
  1036.  
  1037. .date {
  1038. display: inline-block;
  1039. margin-right: 4px;
  1040. padding: 8px;
  1041. min-width: 100px;
  1042. max-width: 100px;
  1043. text-align: center;
  1044. color:{color:info links};
  1045. background:{color:info background};
  1046. border-bottom: 1px solid {color:info background};
  1047. }
  1048.  
  1049. .date:hover {
  1050. border-bottom: 1px solid {color:nav links border};
  1051. }
  1052.  
  1053. .nted {
  1054. display: inline-block;
  1055. margin-right: 4px;
  1056. padding: 8px;
  1057. min-width: 100px;
  1058. max-width: 100px;
  1059. text-align: center;
  1060. color:{color:info links};
  1061. background:{color:info background};
  1062. border-bottom: 1px solid {color:info background};
  1063. }
  1064.  
  1065. .nted:hover {
  1066. border-bottom: 1px solid {color:nav links border};
  1067. }
  1068.  
  1069. .rblg {
  1070. display: inline-block;
  1071. margin-right: 5px;
  1072. padding: 8px;
  1073. min-width: 70px;
  1074. max-width: 70px;
  1075. text-align: center;
  1076. color:{color:info links};
  1077. background:{color:info background};
  1078. border-bottom: 1px solid {color:info background};
  1079. }
  1080.  
  1081. .rblg:hover {
  1082. border-bottom: 1px solid {color:nav links border};
  1083. }
  1084.  
  1085. .lkd {
  1086. display: inline-block;
  1087. margin-right:0px;
  1088. padding: 8px;
  1089. min-width: 70px;
  1090. max-width: 70px;
  1091. text-align: center;
  1092. color:{color:info links};
  1093. background:{color:info background};
  1094. border-bottom: 1px solid {color:info background};
  1095. }
  1096.  
  1097. .lkd:hover {
  1098. border-bottom: 1px solid {color:nav links border};
  1099. }
  1100.  
  1101. .like-b {
  1102. position:relative;
  1103. display:inline-block;
  1104. height:1em;
  1105. line-height:1em;
  1106. overflow:hidden;
  1107. margin-bottom:-1px;
  1108. }
  1109.  
  1110. .like-b .like_button iframe {
  1111. position:absolute;
  1112. top:0;
  1113. left:0;
  1114. bottom:0;
  1115. right:0;
  1116. z-index:2;
  1117. opacity:0;
  1118. }
  1119.  
  1120. .like-b .liked + .b {
  1121. color:inherit;
  1122. }
  1123.  
  1124. .like-b .liked + .b:after {
  1125. content:'d it!';
  1126. }
  1127.  
  1128. .tgs {
  1129. width:422px;
  1130. font-size:10px;
  1131. margin:3px 15px 60px 25px;
  1132. text-transform:lowercase;
  1133. font-style:italic;
  1134. word-wrap:break-word;
  1135. }
  1136.  
  1137. .tgs a {
  1138. color:{color:tags};
  1139. }
  1140.  
  1141. .tgs a:not(:last-of-type) {
  1142. margin-right:5px;
  1143. }
  1144.  
  1145.  
  1146.  
  1147.  
  1148.  
  1149.  
  1150. /* --- POST NOTES --------------------------------- */
  1151. ol.notes {
  1152. margin-left: -20px;
  1153. margin-top: -20px;
  1154. list-style-type: none;
  1155. width: 520px;
  1156. }
  1157.  
  1158. ol.notes a {
  1159. padding-left: 5px;
  1160. color: {color:links};
  1161. text-decoration: none;
  1162. text-transform: uppercase;
  1163. }
  1164.  
  1165. ol.notes a:hover {
  1166. padding-left: 5px;
  1167. color: {color:links hover};
  1168. text-transform: uppercase;
  1169. }
  1170.  
  1171. ol.notes li.note {
  1172. margin-top: 4px;
  1173. padding: 4px 6px;
  1174. width: 520px;
  1175. background: {color:posts};
  1176. }
  1177.  
  1178. ol.notes li.note img.avatar {
  1179. display: inline-block;
  1180. vertical-align: -5px;
  1181. width: 16px;
  1182. height: 16px;
  1183. border-radius: 100%;
  1184. }
  1185.  
  1186. ol.notes li.note blockquote {
  1187. margin-left: 20px;
  1188. padding-left: 8px;
  1189. border-left: 2px solid {color:accent};
  1190. }
  1191.  
  1192.  
  1193.  
  1194.  
  1195.  
  1196. /* --- TAB#2 CONTACT PAGE --------------------------------- */
  1197. q {
  1198. display:block;
  1199. margin-bottom: 2px;
  1200. padding:15px;
  1201. width: 530px;
  1202. font-size: 12px;
  1203. color: {color:info links};
  1204. background:{color:info background};
  1205. }
  1206.  
  1207. ans {
  1208. display:block;
  1209. margin-bottom: 10px;
  1210. padding:15px;
  1211. width: 530px;
  1212. color: {color:text};
  1213. background:{color:blockquote};
  1214. }
  1215.  
  1216.  
  1217.  
  1218.  
  1219.  
  1220. /* --- TAB#3 ABOUT PAGE --------------------------------- */
  1221. .pic {
  1222. display: block;
  1223. position: relative;
  1224. margin-top: 0px;
  1225. margin-left:75px;
  1226. z-index: 3;
  1227. }
  1228.  
  1229. .pic img {
  1230. float: left;
  1231. margin-right: 10px;
  1232. margin-bottom: 7px;
  1233. width: 120px;
  1234. height: 120px;
  1235. border-radius: 50%;
  1236. border: 5px solid {color:background};
  1237. z-index: 3;
  1238. }
  1239.  
  1240. .statbox {
  1241. position: relative;
  1242. margin-top: 15px;
  1243. margin-left: 135px;
  1244. width: 300px;
  1245. padding: 5px;
  1246. z-index: 6;
  1247. }
  1248.  
  1249. bt {
  1250. display: inline-block;
  1251. margin-top: 3px;
  1252. margin-bottom: 3px;
  1253. padding: 2px;
  1254. min-width: 80px;
  1255. text-align: center;
  1256. font-weight: 700;
  1257. text-transform: uppercase;
  1258. letter-spacing: 0.5;
  1259. color: {color:info links};
  1260. background: {color:links};
  1261. }
  1262.  
  1263. ba {
  1264. display: inline-block;
  1265. margin-left: 5px;
  1266. padding: 2px;
  1267. }
  1268.  
  1269. b, strong #tab3 {
  1270. color: {color:text};
  1271. font-weight: 700;
  1272. font-size: 11px;
  1273. letter-spacing: 0.5;
  1274. text-transform: uppercase;
  1275. font-style: italic;
  1276. border-bottom: 1px solid {color:links};
  1277. }
  1278.  
  1279. .abttit::before {
  1280. content: "";
  1281. position: absolute;
  1282. margin-top: 12px;
  1283. margin-left: -52px;
  1284. width: 40px;
  1285. border-bottom: 1px solid {color:links};
  1286. }
  1287.  
  1288. .abttit::after {
  1289. content: "";
  1290. position: absolute;
  1291. margin-top: 12px;
  1292. margin-left: 10px;
  1293. width: 40px;
  1294. border-bottom: 1px solid {color:links};
  1295. }
  1296.  
  1297. .abttit {
  1298. margin-top: 0px;
  1299. padding: 10px;
  1300. text-align: center;
  1301. text-transform: uppercase;
  1302. font-size: 14px;
  1303. font-weight: 700;
  1304. font-family: 'Barlow', sans-serif;
  1305. }
  1306.  
  1307. .about {
  1308. position: relative;
  1309. margin-top: 25px;
  1310. margin-bottom: 5px;
  1311. padding: 5px;
  1312. line-height: 1.8;
  1313. text-align: left;
  1314. font-size: 10px;
  1315. font-family: 'Barlow', sans-serif;
  1316. }
  1317.  
  1318.  
  1319.  
  1320.  
  1321.  
  1322. /* --- TAB#4 TAGS PAGE --------------------------------- */
  1323. .column {
  1324. float: left;
  1325. margin: 20px;
  1326. width: 135px;
  1327. height: auto;
  1328. }
  1329.  
  1330. .theads {
  1331. display: block;
  1332. position: relative;
  1333. margin-top: 2px;
  1334. margin-bottom: 0px;
  1335. width: 130px;
  1336. height: 30px;
  1337. }
  1338.  
  1339. .fa-angle-double-right {
  1340. margin-top:5px;
  1341. width: 10px;
  1342. height: 11px;
  1343. border-radius: 10%;
  1344. padding:5px;
  1345. color:#fff;
  1346. font-size:12px;
  1347. background:{color:nav links background};
  1348. float:left;
  1349. }
  1350.  
  1351. .tagtitle {
  1352. display: block;
  1353. position: relative;
  1354. margin-top: -10px;
  1355. margin-bottom: 4px;
  1356. margin-left: 19px;
  1357. padding: 3px;
  1358. width: 126px;
  1359. text-indent: 2px;
  1360. color: {color:tag page titles};
  1361. background:{color:tag page title background};
  1362. font-weight: 700;
  1363. font-size: 10px;
  1364. letter-spacing: 0;
  1365. text-transform: uppercase;
  1366. }
  1367.  
  1368. .tabtags {
  1369. display: block;
  1370. width: 150px;
  1371. margin-top: 2px;
  1372. line-height: 1.8;
  1373. text-align:center;
  1374. }
  1375.  
  1376. .tabtags a {
  1377. display: block;
  1378. padding: 2px;
  1379. color: {color:links};
  1380. font-weight: 300;
  1381. font-size: 10px;
  1382. letter-spacing: 0;
  1383. border-bottom: 1px solid {color:background two};
  1384. }
  1385.  
  1386. .tabtags a:hover {
  1387. display: block;
  1388. padding: 2px;
  1389. color: {color:links hover};
  1390. font-weight: 300;
  1391. font-size: 10px;
  1392. letter-spacing: 0;
  1393. border-bottom: 1px solid {color:links};
  1394. }
  1395.  
  1396. b, strong #tab4 {
  1397. color: {color:text};
  1398. font-weight: 700;
  1399. font-size: 11px;
  1400. letter-spacing: 0.5;
  1401. text-transform: uppercase;
  1402. font-style: italic;
  1403. border-bottom: 1px solid {color:links};
  1404. }
  1405.  
  1406.  
  1407.  
  1408.  
  1409.  
  1410. /* --- TAB#5 BLOGROLL PAGE --------------------------------- */
  1411. .wrap {
  1412. margin: 5px;
  1413. width: 560px;
  1414. height: auto;
  1415. }
  1416.  
  1417. .broll {
  1418. display: table;
  1419. margin-top: 10px;
  1420. margin-left:0px;
  1421. width:290px;
  1422. height:auto;
  1423. }
  1424.  
  1425. .br {
  1426. position: relative;
  1427. margin-left: -9px;
  1428. margin-top: -10px;
  1429. width: 660px;
  1430. overflow: auto;
  1431. padding: 16px;
  1432. text-decoration: none;
  1433. }
  1434.  
  1435. .flw {
  1436. position: relative;
  1437. display: inline-block;
  1438. float: left;
  1439. margin-top: 5px;
  1440. margin-right:18px;
  1441. margin-left: -8px;
  1442. margin-bottom: 10px;
  1443. width: 250px;
  1444. height: 40px;
  1445. padding: 10px;
  1446. text-transform: uppercase;
  1447. background: {color:blogroll background};
  1448. border: 1px solid {color:blogroll background};
  1449. border-radius: 3px;
  1450. }
  1451.  
  1452. .flw img {
  1453. float: left;
  1454. margin: 0px 10px 0px 0px;
  1455. width:40px;
  1456. border-radius:3px;
  1457. }
  1458.  
  1459. .name {
  1460. display: block;
  1461. margin-top: 8px;
  1462. vertical-align: middle;
  1463. font-weight: 700;
  1464. }
  1465.  
  1466. .name a {
  1467. display: block;
  1468. color:{color:blogroll links}!important;
  1469. }
  1470.  
  1471. .name span {
  1472. display: inline-block;
  1473. margin-top: -3px;
  1474. color: {color:blogroll text};
  1475. font-weight: 400;
  1476. width: 120px!important;
  1477. text-overflow: ellipsis;
  1478. white-space: nowrap;
  1479. overflow: hidden;
  1480. }
  1481.  
  1482. .broll li {
  1483. display:inline-block;
  1484. margin:5px!important;
  1485. }
  1486.  
  1487.  
  1488. {CustomCSS}
  1489. </style>
  1490. </head>
  1491.  
  1492.  
  1493. <body>
  1494. <div class="container">
  1495.  
  1496.  
  1497. <div class="sidebar">
  1498. <center><a title="Click to startover" href="/"><img src="{image:sidebar}"></a></center>
  1499. <div class="tit">{text:title one}</div><!--- end tit --->
  1500. <div class="desc">{Description}</div><!--- end desc --->
  1501. <div class="tabs">
  1502. <ul class="tab-links">
  1503. <li class="active"><a href="#tab1">Blog</a></li>
  1504. <li><a href="#tab2">Message</a></li>
  1505. <li><a href="#tab3">About</a></li>
  1506. <li><a href="#tab4">Site Map</a></li>
  1507. <li><a href="#tab5">Blogroll</a></li>
  1508. </ul>
  1509. <div class="credit"><a href="https://petitepixel.tumblr.com/" target="_blank">Petite Pixel</a></div><!-- end credit -->
  1510. </div><!-- end tabs -->
  1511.  
  1512. <div class="pagi">
  1513. {block:Pagination}{block:JumpPagination length="5"}{block:CurrentPage}
  1514. <span class="current_page">{PageNumber}</span>
  1515. {/block:CurrentPage}{block:JumpPage}
  1516. <a class="jump_page" href="{URL}">{PageNumber}</a>
  1517. {/block:JumpPage}{/block:JumpPagination}{/block:Pagination}
  1518. </div><!--- end pagi --->
  1519. </div><!--- end sidebar --->
  1520.  
  1521.  
  1522.  
  1523. <div class="tabs">
  1524. <!-- TAB 1 -->
  1525. <div id="tab1" class="tab active"><div class="tab-content">
  1526.  
  1527. <div class="entries">
  1528.  
  1529. {block:ContentSource}
  1530. <!-- {SourceURL}{block:SourceLogo}<img src=”{BlackLogoURL}”
  1531. width=”{LogoWidth}” height=”{LogoHeight}” alt=”{SourceTitle}” />
  1532. {/block:SourceLogo}
  1533. {block:NoSourceLogo}{SourceLink}
  1534. {/block:NoSourceLogo} -->
  1535. {/block:ContentSource}{block:ReblogParent}
  1536. {/block:ReblogParent}
  1537.  
  1538.  
  1539.  
  1540. {block:Posts}
  1541. <div class="posts" id="{PostID}">
  1542.  
  1543. <!-- TEXT POSTS -->
  1544. {block:Text}
  1545. {block:Title}<h1>{Title}</h1>{/block:Title}
  1546. {block:NotReblog}
  1547. <div class="texts">{Body}</div><!--- end texts --->
  1548. {/block:NotReblog}
  1549.  
  1550. {block:RebloggedFrom}
  1551. <div class="reblog-list">
  1552. {block:Reblogs}
  1553. <div class="{block:isOriginalEntry}original-reblog{/block:isOriginalEntry}">
  1554. <div class="reblog-header"><div class="reblog-avatar">
  1555. {block:IsActive}
  1556. <a class="{block:isNotOriginalEntry}sub-reblog{/block:isNotOriginalEntry}" href="{Permalink}" target="_blank"><img src="{PortraitURL-64}"></a>
  1557. {/block:IsActive}
  1558.  
  1559. {block:IsDeactivated}
  1560. <span class="inactive {block:isNotOriginalEntry} sub-reblog{/block:isNotOriginalEntry}"><img src="{PortraitURL-64}"></span>
  1561. {/block:IsDeactivated}</div><!-- end reblog-avatar -->
  1562.  
  1563. <div class="username">
  1564. {block:IsActive}
  1565. <a target="_blank" href="{Permalink}">{Username}</a>
  1566. {/block:IsActive}
  1567.  
  1568. {block:IsDeactivated}
  1569. <span class="inactive">{Username}</span>
  1570. {/block:IsDeactivated}
  1571. </div><!-- end username -->
  1572. </div><!-- end reblog-header -->
  1573. <div class="reblog-content">{Body}</div><!-- end reblog-content -->
  1574. </div><!-- end orginal entry -->
  1575. {/block:Reblogs}
  1576. </div><!-- end reblog-list -->
  1577. {/block:RebloggedFrom}
  1578. {/block:Text}
  1579.  
  1580.  
  1581. <!-- ANSWER POSTS -->
  1582. {block:Answer}
  1583. <div class="question">
  1584. <div class="asker-icon"><img src="{AskerPortraitURL-30}"></div>
  1585. <div class="asker">{Asker} <span>sent me something</span></div>
  1586. <div class="asker-question">{Question}</div>
  1587. </div><!-- end question -->
  1588.  
  1589. {block:Answerer}
  1590. <div class="answer">
  1591. <div class="answerer-question">
  1592. <div class="answerer-icon"><img src="{AnswererPortraitURL-24}"></div>
  1593. <div class="answerer">{Answerer}</div>
  1594. {Answer}</div>
  1595. </div><!-- end answer -->
  1596. {/block:Answerer}
  1597.  
  1598. <div class="replies">
  1599. {Replies}
  1600. </div><!-- end replies -->
  1601. {/block:Answer}
  1602.  
  1603.  
  1604. <!-- PHOTO POSTS -->
  1605. {block:Photo}<center>
  1606. {LinkOpenTag}<a href="#" onclick="Tumblr.Lightbox.init([{ width: {PhotoWidth-HighRes}, height: {PhotoHeight-HighRes}, low_res: '{PhotoURL-500}', high_res: '{PhotoURL-HighRes}' }]); $('body').toggleClass('tumblr_lightbox_active'); return false"><img src="{PhotoURL-HighRes}"></a>{LinkCloseTag}</center>
  1607. {block:Caption}<div class="cap">{Caption}</div>{/block:Caption}
  1608. {/block:Photo}
  1609.  
  1610.  
  1611. <!-- PHOTOSETS POSTS -->
  1612. {block:Photoset}
  1613. <div class="photo-slideshow" id="photoset_{PostID}" data-layout="{PhotosetLayout}">{block:Photos}<div class="photo-data"><div class="pxu-photo"><img src="{PhotoURL-500}" width="{PhotoWidth-500}" height="{PhotoHeight-500}" data-highres="{PhotoURL-HighRes}" data-width="{PhotoWidth-HighRes}" data-height="{PhotoHeight-HighRes}"></div><a class="tumblr-box" rel="post-{PostID}" href="{PhotoURL-HighRes}"></a></div>{/block:Photos}</div>
  1614. {block:Caption}<div class="cap">{Caption}</div>{/block:Caption}
  1615. {/block:Photoset}
  1616.  
  1617.  
  1618. <!-- QUOTE POSTS -->
  1619. {block:Quote}
  1620. <div class="qwrap">
  1621. <div class="quote">
  1622. {Quote}
  1623. {block:Source}
  1624. <div class="source">- {Source}</div>
  1625. {/block:Source}
  1626. </div>
  1627. {block:Caption}<div class="cap">{Caption}</div>{/block:Caption}
  1628. </div>
  1629. {/block:Quote}
  1630.  
  1631.  
  1632. <!-- CHAT POSTS -->
  1633. {block:Chat}
  1634. {block:Title}
  1635. <h1>{Title}</h1>
  1636. {/block:Title}
  1637. <div class="post">
  1638. {block:Lines}
  1639. <li class="line {Alt}">
  1640. {block:Label}
  1641. <span class="label">
  1642. {Label}</span>
  1643. {/block:Label}{Line}</li>
  1644. {/block:Lines}
  1645. </div>
  1646. {block:Caption}<div class="cap">{Caption}</div>{/block:Caption}
  1647. {/block:Chat}
  1648.  
  1649.  
  1650. <!-- LINK POSTS -->
  1651. {block:Link}
  1652. {block:Thumbnail}<img src="{Thumbnail}">{/block:Thumbnail}
  1653. <div class="link-tit"><a href="{URL}" target="_blank">{Name}</a></div>
  1654. {block:Excerpt}<div class="linkexpt">{Excerpt}</div>{/block:Excerpt}
  1655. {block:Description}<div class="linkdesc">{Description}</div>{/block:Description}
  1656. {block:Caption}<div class="cap">{Caption}</div>{/block:Caption}
  1657. {/block:Link}
  1658.  
  1659.  
  1660. <!-- VIDEO POSTS -->
  1661. {block:Video}
  1662. <div class="video">{Video-500}</div>
  1663. {block:Caption}<div class="cap">{Caption}</div>{/block:Caption}
  1664. {/block:Video}
  1665.  
  1666.  
  1667. <!-- AUDIO POSTS -->
  1668. {block:Audio}
  1669. <div id="cover">{block:AlbumArt}<img src="{AlbumArtURL}">{/block:AlbumArt}</div>
  1670. <div id="audioplayerbackground"><div class="audioplayer">{block:AudioPlayer}
  1671. {AudioPlayerBlack}{/block:AudioPlayer}</div></div>
  1672. <div class="musician">
  1673. <span class="track">
  1674. {block:TrackName} {TrackName} {/block:TrackName}</span>
  1675. <br>by {block:Artist} {Artist} {/block:Artist}
  1676. <br>
  1677. {block:Album}
  1678. {Album}<br>
  1679. {/block:Album}</div>
  1680. {block:Caption}<div class="cap">{Caption}</div>{/block:Caption}
  1681. {/block:Audio}
  1682. </div><!--- end posts --->
  1683.  
  1684.  
  1685. <div class="bottom">
  1686. <div class="date">{block:Date}<a title="Posted at {12HourWithZero}:{Minutes}{AmPm}" href="{Permalink}">{Month} {MonthNumberWithZero}, {Year}</a>{/block:Date}</div><!--- end date ---> <div class="nted"><a href="{Permalink}">{NoteCountWithLabel}</a></div><!--- end nted ---> <div class="rblg"><a href="{ReblogURL}" target="_blank">Reblog</a></div><!--- end rblg ---><div class="lkd"><a class="like-b" href="#">{LikeButton}<span class="b">like</span></a></div><!--- end lkd --->
  1687. </div><!--- end bottom --->
  1688.  
  1689.  
  1690. <div class="tgs">
  1691. {block:HasTags}{block:Tags}<a href="{TagURL}">#{Tag}</a>{/block:Tags}{/block:HasTags}
  1692. </div><!--- end tgs --->
  1693.  
  1694.  
  1695. {/block:Posts}
  1696.  
  1697. {block:PostNotes}
  1698. {PostNotes}
  1699. {/block:PostNotes}
  1700.  
  1701. {block:ContentSource}
  1702. <!-- {SourceURL}{block:SourceLogo}<img src=”{BlackLogoURL}” width=”{LogoWidth}” height=”{LogoHeight}” alt=”{SourceTitle}” />
  1703. {/block:SourceLogo}
  1704. {block:NoSourceLogo}{SourceLink}
  1705. {/block:NoSourceLogo} -->
  1706. {/block:ContentSource}{block:ReblogParent}
  1707. {/block:ReblogParent}
  1708. </div><!--- end entries --->
  1709.  
  1710.  
  1711. </div><!-- end tabcontent -->
  1712. </div><!-- end tab 1 -->
  1713.  
  1714.  
  1715.  
  1716.  
  1717.  
  1718.  
  1719. <!-- TAB 2 -->
  1720. <div id="tab2" class="tab"><div class="tabcontent">
  1721. <h1>FAQ + Contact</h1>
  1722. <q>This is a question. Wrap it in < q > without the spaces of course.</q>
  1723. <ans>This is your answer. Wrap it in < ans > again without the spaces. Countine as many times as your like!</ans>
  1724. <p><iframe frameborder="0" scrolling="no" width="100%" height="200" src="https://www.tumblr.com/ask_form/{Name}.tumblr.com" style="background-color:transparent; overflow:hidden;" id="ask_form"></iframe><!--[if IE]><script type="text/javascript">document.getElementById('ask_form').allowTransparency=true;</script><![endif]--></p>
  1725. </div><!-- end tabcontent -->
  1726. </div><!-- end tab 2 -->
  1727.  
  1728.  
  1729.  
  1730.  
  1731.  
  1732.  
  1733. <!-- TAB 3 -->
  1734. <div id="tab3" class="tab"><div class="tabcontent">
  1735. <h1>About the Blogger</h1>
  1736. <div class="pic"><img src="{image:profile}"></div><!-- end of pic -->
  1737. <div class="statbox">
  1738. <bt>Name:</bt><ba>YOUR NAME HERE</ba><br>
  1739. <bt>Gender:</bt><ba>YOUR GENDER HERE</ba><br>
  1740. <bt>Pronouns:</bt><ba>YOUR PRONOUNS HERE</ba><br>
  1741. <bt>Location:</bt><ba>YOUR LOCATION HERE</ba><br>
  1742. <bt>Personality:</bt><ba>YOUR PERSONALITY HERE</ba>
  1743. </div><!-- end statbox -->
  1744.  
  1745. <div class="about">
  1746. <!--title here --><div class="abttit">Title Here.</div><!--title here -->
  1747. Fill this up with good stuff about you that you would love for people to know. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede mollis pretium. Integer tincidunt. Cras dapibus. Vivamus elementum semper nisi. Aenean vulputate eleifend tellus. Aenean leo ligula, porttitor eu, consequat vitae, eleifend ac, enim. Aliquam lorem ante, dapibus in, viverra quis, feugiat a, tellus. Phasellus viverra nulla ut metus varius laoreet. Quisque rutrum. Aenean imperdiet. Etiam ultricies nisi vel augue. Curabitur ullamcorper ultricies nisi. Nam eget dui. Etiam rhoncus. Maecenas tempus, tellus eget condimentum rhoncus, sem quam semper libero, sit amet adipiscing sem neque sed ipsum. Nam quam nunc, blandit vel, luctus pulvinar, hendrerit id, lorem. Maecenas nec odio et ante tincidunt tempus. Donec vitae sapien ut libero venenatis faucibus. Nullam quis ante. Etiam sit amet orci eget eros faucibus tincidunt.
  1748. </div><!-- end of about -->
  1749. </div><!-- end tabcontent -->
  1750. </div><!-- end tab 3 -->
  1751.  
  1752.  
  1753.  
  1754.  
  1755.  
  1756.  
  1757. <!-- TAB 4 -->
  1758. <div id="tab4" class="tab"><div class="tabcontent">
  1759. <!-- page title here --><h1>Site Map</h1><!--title here -->
  1760.  
  1761. <div class="column">
  1762. <div class="theads"><i class="fas fa-angle-double-right"></i>&nbsp;<div class="tagtitle">Title Here</div></div><!-- end theads -->
  1763. <div class="tabtags">
  1764. <a href="/">link</a>
  1765. <a href="/">link</a>
  1766. <a href="/">link</a>
  1767. <a href="/">link</a>
  1768. </div><!-- end tabtags -->
  1769. </div><!-- end column -->
  1770.  
  1771.  
  1772.  
  1773. <div class="column">
  1774. <div class="theads"><i class="fas fa-angle-double-right"></i>&nbsp;<div class="tagtitle">Title Here</div></div><!-- end theads -->
  1775. <div class="tabtags">
  1776. <a href="/">link</a>
  1777. <a href="/">link</a>
  1778. <a href="/">link</a>
  1779. <a href="/">link</a>
  1780. </div><!-- end tabtags -->
  1781. </div><!-- end column -->
  1782.  
  1783.  
  1784.  
  1785. <div class="column">
  1786. <div class="theads"><i class="fas fa-angle-double-right"></i>&nbsp;<div class="tagtitle">Title Here</div></div><!-- end theads -->
  1787. <div class="tabtags">
  1788. <a href="/">link</a>
  1789. <a href="/">link</a>
  1790. <a href="/">link</a>
  1791. <a href="/">link</a>
  1792. </div><!-- end tabtags -->
  1793. </div><!-- end column -->
  1794.  
  1795.  
  1796.  
  1797. <div class="column">
  1798. <div class="theads"><i class="fas fa-angle-double-right"></i>&nbsp;<div class="tagtitle">Title Here</div></div><!-- end theads -->
  1799. <div class="tabtags">
  1800. <a href="/">link</a>
  1801. <a href="/">link</a>
  1802. <a href="/">link</a>
  1803. <a href="/">link</a>
  1804. </div><!-- end tabtags -->
  1805. </div><!-- end column -->
  1806.  
  1807.  
  1808.  
  1809. <div class="column">
  1810. <div class="theads"><i class="fas fa-angle-double-right"></i>&nbsp;<div class="tagtitle">Title Here</div></div><!-- end theads -->
  1811. <div class="tabtags">
  1812. <a href="/">link</a>
  1813. <a href="/">link</a>
  1814. <a href="/">link</a>
  1815. <a href="/">link</a>
  1816. </div><!-- end tabtags -->
  1817. </div><!-- end column -->
  1818.  
  1819.  
  1820. </div><!-- end tabcontent -->
  1821. </div><!-- end tab 4 -->
  1822.  
  1823.  
  1824.  
  1825.  
  1826.  
  1827.  
  1828. <!-- TAB 5 -->
  1829. <div id="tab5" class="tab"><div class="tabcontent">
  1830. <h1>Blogroll</h1>
  1831. <div class="wrap">
  1832. {block:Following}
  1833. <div class="broll">
  1834. <div class="br">
  1835. {block:Followed}
  1836. <div class="flw">
  1837. <a href="{FollowedURL}"><img src="{FollowedPortraitURL-40}"></a> <div class="name"><a title="{FollowedTitle}" href="{FollowedURL}" target="_blank">{FollowedName}</a> <span>{FollowedTitle}</span></div>
  1838. </div><!-- end flw -->
  1839. {block:Followed}
  1840. </div><!--- end br --->
  1841. </div><!--- end broll --->
  1842. {/block:Following}
  1843. </div><!--- end wrap --->
  1844.  
  1845. </div><!-- end tabcontent -->
  1846. </div><!-- end tab 5 -->
  1847.  
  1848. </div><!-- END OF TABS -->
  1849. </div><!--- end container --->
  1850.  
  1851.  
  1852.  
  1853. <!---------------------------------------------------------------------------
  1854.  
  1855. ALL THE CODING SCRIPTS.
  1856. DO NOT TOUCH/MESS WITH.
  1857.  
  1858. ---------------------------------------------------------------------------->
  1859.  
  1860.  
  1861.  
  1862. <!--- ALL IN ONE --->
  1863. <script>
  1864. $(document).ready(function() {
  1865. $('.tabs .tab-links a').on('click', function(e) {
  1866. var currentAttrValue = $(this).attr('href');
  1867.  
  1868. // Show/Hide Tabs
  1869. $('.tabs ' + currentAttrValue).fadeIn(600).siblings().hide();
  1870.  
  1871. // Change/remove current tab to active
  1872. $(this).parent('li').addClass('active').siblings().removeClass('active');
  1873.  
  1874. e.preventDefault();
  1875. });
  1876. });
  1877. </script><script>
  1878. $(document).ready(function() {
  1879. $('#filterOptions li a').click(function() {
  1880. // fetch the class of the clicked item
  1881. var ourClass = $(this).attr('class');
  1882.  
  1883. // reset the active class on all the buttons
  1884. $('#filterOptions li').removeClass('active');
  1885. // update the active state on our clicked button
  1886. $(this).parent().addClass('active');
  1887.  
  1888. if(ourClass == 'all') {
  1889. // show all our items
  1890. $('#ourHolder').children('div.item').show();
  1891. }
  1892. else {
  1893. // hide all elements that don't share ourClass
  1894. $('#ourHolder').children('div:not(.' + ourClass + ')').hide();
  1895. // show all elements that do share ourClass
  1896. $('#ourHolder').children('div.' + ourClass).show();
  1897. }
  1898. return false;
  1899. });
  1900. });
  1901. </script>
  1902.  
  1903.  
  1904. <!-- FONT AWSOME -->
  1905. <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.0.12/css/all.css" integrity="sha384-G0fIWCsCzJIMAVNQPfjH08cyYaUtMwjJwqiRKxxE/rx96Uroj1BtIQ6MLJuheaO9" crossorigin="anonymous">
  1906.  
  1907.  
  1908. <!-- GOOGLE FONT -->
  1909. <link href="https://fonts.googleapis.com/css?family=Barlow:400,700&display=swap" rel="stylesheet">
  1910.  
  1911.  
  1912. <!-- GUTTERS: DONT TOUCH -->
  1913. <link href="https://static.tumblr.com/qudkd6d/OcDnl99gb/style.css" rel="stylesheet" type="text/css"/>
  1914. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  1915. <script src="https://static.tumblr.com/qudkd6d/Az6nkemqr/pxuphotoset.min.js"></script>
  1916.  
  1917. <script>
  1918. $(document).ready(function(){
  1919. $('.photo-slideshow').pxuPhotoset({
  1920. lightbox: true,
  1921. rounded: false,
  1922. gutter: '2px',
  1923. borderRadius: '0px',
  1924. photoset: '.photo-slideshow',
  1925. photoWrap: '.photo-data',
  1926. photo: '.pxu-photo'
  1927. });
  1928. });
  1929. </script>
  1930.  
  1931.  
  1932. <!-- TOOLTIP: DONT TOUCH -->
  1933. <script src="https://static.tumblr.com/fiw4iub/4jdnu5ta4/jquery.style-my-tooltips.js"></script>
  1934.  
  1935. <script>
  1936. (function($){
  1937. $(document).ready(function(){
  1938. $("a[title]").style_my_tooltips({
  1939. tip_follows_cursor:true,
  1940. tip_delay_time:90,
  1941. tip_fade_speed:600,
  1942. attribute:"title"
  1943. });
  1944. });
  1945. })(jQuery);
  1946. </script>
  1947.  
  1948.  
  1949. <!-- VIDEO RESIZE -->
  1950. <script src ="//static.tumblr.com/fwgzvyf/Oj1o08f6h/shythemes.vr.js"></script>
  1951.  
  1952. <script>
  1953. $(document).ready(function(){
  1954. resizeVideos();
  1955. });
  1956. function resizeVideos() {
  1957. $('.video:not(.resized) iframe:not(.tumblr_video_iframe)').each(function(){
  1958. var vw = $(this).width();
  1959. var vh = $(this).height();
  1960. var scale = $(this).parents('.video').width() / vw;
  1961. $(this).attr({
  1962. width: Math.floor($(this).attr('width') * scale),
  1963. height: Math.floor($(this).attr('height') * scale)
  1964. });
  1965. $(this).parents('.video').addClass('resized');
  1966. });
  1967. $('.video:not(.resized) .tumblr_video_iframe').each(function(){
  1968. var vw = $(this).width();
  1969. var vh = $(this).height();
  1970. var scale = $(this).parents('.video').width() / vw;
  1971. $(this).css({
  1972. 'transform': 'scale(' + scale + ')',
  1973. 'margin': vh * (scale - 1) / 2 + 'px ' + vw * (scale - 1) / 2 + 'px'
  1974. });
  1975. $(this).parents('.tumblr_video_container').css({
  1976. width: Math.floor(vw * ( scale + 1 ) / 2),
  1977. height: Math.floor(vh * ( scale + 1 ) / 2)
  1978. });
  1979. $(this).parents('.video').addClass('resized');
  1980. });
  1981. }
  1982. </script>
  1983.  
  1984.  
  1985. <!--- UNESTED CAPTIONS --->
  1986. <script src="https://static.tumblr.com/wgg6svp/OoTofxa0c/unnest.min.js"></script>
  1987.  
  1988. <script>
  1989. $(function(){
  1990. $('.posts').unnest({
  1991. yourCaption: ".cap",
  1992. {Caption}
  1993. wrapName: ".tumblr_parent",
  1994. newCaptionUsername: false,
  1995. originalPostCaptionUsername: false,
  1996. tumblrAvatars: true,
  1997. tumblrAvatarClass: ".tumblr_avatar",
  1998. usernameColon: false
  1999. });
  2000. });
  2001. </script>
  2002.  
  2003.  
  2004. <!-- SOUNDCLOUD PLAYER -->
  2005. <script>
  2006. $(document).ready(function(){
  2007. var color = '{color:music background}'; // color of play button (hex)
  2008. $('.soundcloud_audio_player').each(function(){
  2009. $(this).attr({ src: $(this).attr('src').split('&')[0] + '&amp;liking=false&amp;sharing=false&amp;auto_play=false&amp;show_comments=false&amp;continuous_play=false&amp;buying=false&amp;show_playcount=false&amp;show_artwork=true&amp;origin=tumblr&amp;color=' + color.split('#')[1], height: 116, width: '100%' });
  2010. });
  2011. });
  2012. </script>
  2013.  
  2014.  
  2015. <!-- TUMBLR CONTROLS -->
  2016. <div class="hcontrols"><svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 216 216" enable-background="new 0 0 216 216" xml:space="preserve"><path d="M106.6,134c14.3,0,26-11.7,26-26s-11.7-26-26-26s-26,11.7-26,26S92.2,134,106.6,134z M106.6,94c7.7,0,14,6.3,14,14s-6.3,14-14,14s-14-6.3-14-14S98.9,94,106.6,94z M40.4,124.6l7.2,3.3c3,1.4,4.4,4.8,3.3,7.9l-2.8,7.4c-2.1,5.7-1.4,11.8,2.1,16.7c3.4,5,9,7.9,15,7.9c2.2,0,4.4-0.4,6.5-1.2l7.4-2.8c0.7-0.3,1.4-0.4,2.2-0.4c2.4,0,4.7,1.4,5.7,3.7l3.3,7.2c3,6.6,9.4,10.7,16.6,10.7s13.6-4.1,16.6-10.7l3.3-7.2c1-2.2,3.2-3.7,5.7-3.7c0.7,0,1.5,0.1,2.2,0.4l7.4,2.8c2.1,0.8,4.3,1.2,6.5,1.2c0,0,0,0,0,0c5.9,0,11.5-3,15-7.9c3.4-5,4.2-11.1,2.1-16.7l-2.8-7.4c-1.1-3.1,0.3-6.5,3.3-7.9l7.2-3.3c6.6-3,10.7-9.4,10.7-16.6s-4.1-13.6-10.7-16.6l-7.2-3.3c-3-1.4-4.4-4.8-3.3-7.9l2.8-7.4c2.1-5.7,1.4-11.8-2.1-16.7c-3.4-5-9-7.9-15-7.9c-2.2,0-4.4,0.4-6.5,1.2l-7.4,2.8c-0.7,0.3-1.4,0.4-2.2,0.4c-2.4,0-4.7-1.4-5.7-3.7l-3.3-7.2c-3-6.6-9.4-10.7-16.6-10.7S93,35.2,90,41.8l-3.3,7.2c-1,2.2-3.2,3.7-5.7,3.7c-0.7,0-1.5-0.1-2.2-0.4l-7.4-2.8c-2.1-0.8-4.3-1.2-6.5-1.2c-5.9,0-11.5,3-15,7.9c-3.4,5-4.2,11.1-2.1,16.7l2.8,7.4c1.1,3.1-0.3,6.5-3.3,7.9l-7.2,3.3c-6.6,3-10.7,9.4-10.7,16.6S33.8,121.6,40.4,124.6z M45.3,102.3l7.2-3.3c8.7-4,12.9-14.1,9.5-23l-2.8-7.4c-1-2.7,0-4.7,0.7-5.7c1.6-2.4,4.6-3.4,7.4-2.3l7.4,2.8c2.1,0.8,4.2,1.2,6.4,1.2c0,0,0,0,0,0c7.1,0,13.6-4.2,16.6-10.7l3.3-7.2c1.5-3.4,4.7-3.7,5.7-3.7s4.1,0.3,5.7,3.7l3.3,7.2c3,6.5,9.5,10.7,16.6,10.7c2.2,0,4.3-0.4,6.4-1.2l7.4-2.8c2.8-1,5.7,0,7.4,2.3c0.7,1,1.7,3,0.7,5.7l-2.8,7.4c-3.3,8.9,0.8,19,9.5,23l7.2,3.3c3.4,1.5,3.7,4.7,3.7,5.7s-0.3,4.1-3.7,5.7l-7.2,3.3c-8.7,4-12.9,14.1-9.5,23l2.8,7.4c1,2.7,0,4.7-0.7,5.7c-1.6,2.4-4.6,3.4-7.4,2.3l-7.4-2.8c-2.1-0.8-4.2-1.2-6.4-1.2c-7.1,0-13.6,4.2-16.6,10.7l-3.3,7.2c-1.5,3.4-4.7,3.7-5.7,3.7s-4.1-0.3-5.7-3.7l-3.3-7.2c-3-6.5-9.5-10.7-16.6-10.7c-2.2,0-4.3,0.4-6.4,1.2l-7.4,2.8c-2.8,1-5.7,0-7.4-2.3c-0.7-1-1.7-3-0.7-5.7l2.8-7.4c3.3-8.9-0.8-19-9.5-23l-7.2-3.3c-3.4-1.5-3.7-4.7-3.7-5.7S41.9,103.9,45.3,102.3z"/></svg></div>
  2017.  
  2018.  
  2019. </body>
  2020. </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!