API tools faq
paste
Advertisement
likesmagic

birds of a feather by @gloriapritchetts

likesmagic
Jul 25th, 2024
405
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 48.67 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <link rel="stylesheet" media="screen" href="//assets.tumblr.com/client/prod/standalone/blog-network-npf/index.build.css">
  5.  
  6. <!--
  7. NPF images fix v3.0 by @glenthemes [2021]
  8. 💌 git.io/JRBt7
  9. --->
  10. <script src="//npf-images-v3.github.io/script.js"></script>
  11. <link rel="stylesheet" href="//npf-images-v3.github.io/recon.css">
  12. <style tmblr-npf>
  13. :root {
  14. --NPF-Caption-Spacing:1em;
  15. --NPF-Image-Spacing:7px;
  16. }
  17. </style>
  18. <script src="https://unpkg.com/phosphor-icons"></script>
  19. <script src="https://unpkg.com/@phosphor-icons/web"></script>
  20. <link rel="preconnect" href="https://fonts.googleapis.com">
  21. <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
  22. <link href="https://fonts.googleapis.com/css2?family=ABeeZee:ital@0;1&family=Karla:ital,wght@0,200..800;1,200..800&family=Montserrat:ital,wght@0,100..900;1,100..900&family=Nunito:ital,wght@0,200..1000;1,200..1000&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Quicksand:[email protected]&family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&family=Varela+Round&display=swap" rel="stylesheet">
  23.  
  24. <script src="//pull.cappuccicons.com/cpf.js"></script>
  25. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  26. <title>{Title} {block:TagPage}/ #{Tag}{/block:TagPage}{block:PostSummary}: {PostSummary}{/block:PostSummary}</title>
  27.  
  28. <link rel="shortcut icon" href="{Favicon}">
  29. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  30. {block:Description}<meta name="description" content="{MetaDescription}"/>{/block:Description}
  31. <meta charset="utf-8">
  32. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  33.  
  34. <!---
  35.  
  36. ♡ CODE BY GLORIAPRITCHETTS ♡
  37. rules and credits @ gloriapritchetts.tumblr.com/themes
  38.  
  39. --->
  40.  
  41. <meta name="image:sidebar" content="https://placehold.co/300x350/EEE/31343C"/>
  42. <meta name="image:header" content="https://placehold.co/500x200/EEE/31343C"/>
  43.  
  44. <meta name="color:background" content="#0f0f0f"/>
  45. <meta name="color:posts" content="#121212"/>
  46. <meta name="color:text" content="#fff"/>
  47. <meta name="color:accent" content="#64bffa"/>
  48. <meta name="color:borders" content="#181818"/>
  49. <meta name="color:gradient 1" content="#64bffa"/>
  50. <meta name="color:gradient 2" content="#c7e6f7"/>
  51. <meta name="color:dot 1" content="#64bffa"/>
  52. <meta name="color:dot 2" content="#c7e6f7"/>
  53. <meta name="color:dot 3" content="#64bffa"/>
  54.  
  55. <meta name="if:quicksand" content="0"/>
  56. <meta name="if:karla" content="0"/>
  57. <meta name="if:roboto" content="0"/>
  58. <meta name="if:nunito" content="0"/>
  59. <meta name="if:abeezee" content="0"/>
  60.  
  61. <meta name="select:shadow" content="0px"/>
  62. <meta name="select:shadow" content="10px"/>
  63.  
  64. <meta name="select:borders" content="0px"/>
  65. <meta name="select:borders" content="1px"/>
  66.  
  67. <meta name="select:border radius" content="0px"/>
  68. <meta name="select:border radius" content="5px"/>
  69. <meta name="select:border radius" content="10px"/>
  70.  
  71. <meta name="text:description" content="this looks best at two lines! la lalalalalal dee lal laal"/>
  72.  
  73. <meta name="if:updates" content="1"/>
  74.  
  75. <meta name="text:watching" content="watching"/>
  76. <meta name="text:listening to" content="listening to"/>
  77. <meta name="text:reading" content="reading"/>
  78. <meta name="text:working on" content="working on"/>
  79. <meta name="text:status" content="status"/>
  80.  
  81. <meta name="text:link 1 url" content="/"/>
  82. <meta name="text:link 1 title" content="link 1"/>
  83. <meta name="text:link 2 url" content="/"/>
  84. <meta name="text:link 2 title" content="link 2"/>
  85. <meta name="text:popup title" content="guide"/>
  86.  
  87. <meta name="text:name" content="name"/>
  88. <meta name="text:age" content="age"/>
  89. <meta name="text:pronouns" content="pronouns"/>
  90. <meta name="text:zodiac" content="zodiac"/>
  91.  
  92. <meta name="text:popup desc" content="keep this at one line!"/>
  93.  
  94. <meta name="text:popup link 1 url" content="/"/>
  95. <meta name="text:popup link 1 title" content="link 1"/>
  96. <meta name="text:popup link 2 url" content="/"/>
  97. <meta name="text:popup link 2 title" content="link 2"/>
  98. <meta name="text:popup link 3 url" content="/"/>
  99. <meta name="text:popup link 3 title" content="link 3"/>
  100. <meta name="text:popup link 4 url" content="/"/>
  101. <meta name="text:popup link 4 title" content="link 4"/>
  102.  
  103. <!----- css ----->
  104.  
  105. <style type="text/css">
  106.  
  107. /*----- general -----*/
  108.  
  109. ::-webkit-scrollbar {
  110. width: 0px;
  111. background: transparent;
  112. border-radius:{select:border radius};
  113. }
  114.  
  115. ::-webkit-scrollbar-thumb {
  116. background: transparent;
  117. border-radius:{select:border radius};
  118. }
  119.  
  120. body {
  121. font-size: 13.5px;
  122. color: {color:text};
  123. background-color: {color:background};
  124. line-height: 135%;
  125. word-wrap: break-word;
  126. letter-spacing: 0.3px;
  127. margin: 0;
  128. padding: 0;
  129. }
  130.  
  131. {block:ifquicksand}
  132. body {
  133. font-family: quicksand;
  134. font-size: 13.5px;
  135. }
  136. {/block:ifquicksand}
  137.  
  138. {block:ifkarla}
  139. body {
  140. font-family: karla;
  141. font-size: 13.5px;
  142. }
  143. {/block:ifkarla}
  144.  
  145. {block:ifroboto}
  146. body {
  147. font-family: roboto;
  148. font-size: 13.5px;
  149. }
  150. {/block:ifroboto}
  151.  
  152. {block:ifnunito}
  153. body {
  154. font-family: nunito;
  155. font-size: 13.5px;
  156. }
  157. {/block:ifnunito}
  158.  
  159. {block:ifabeezee}
  160. body {
  161. font-family: abeezee;
  162. font-size: 13.5px;
  163. }
  164. {/block:ifabeezee}
  165.  
  166. a {
  167. color: {color:text};
  168. position: relative;
  169. text-decoration: none;
  170. -webkit-transition: all 0.5s ease;
  171. transition: all 0.5s ease;
  172. -moz-transition: all 0.5s ease;
  173. -o-transition: all 0.5s ease;
  174. }
  175.  
  176. a:hover {
  177. border:none;
  178. text-decoration:none;
  179. color:{color:accent};
  180. text-shadow:none;
  181. -webkit-transition: all 0.5s ease;
  182. transition: all 0.5s ease;
  183. -moz-transition: all 0.5s ease;
  184. -o-transition: all 0.5s ease;
  185. }
  186.  
  187. blockquote {
  188. padding: 0 0 0 1.5em;
  189. border-left: 1px solid {color:borders};
  190. margin: 1.5em 0 1.5em 1.5em;
  191. }
  192.  
  193. h1.post-title {
  194. font-size:22px;
  195. color:{color:accent};
  196. text-align:left;
  197. margin-top:0.6em;
  198. border-bottom:1px solid {color:borders};
  199. padding-bottom:10px;
  200. margin-bottom:0em;
  201. }
  202.  
  203. h1 {
  204. font-size:19px;
  205. color:{color:accent};
  206. font-weight:bold;
  207. text-align:left;
  208. line-height:25px;
  209. border:none;
  210. box-shadow:none;
  211. }
  212.  
  213. h1 a {
  214. font-size:19px;
  215. color:{color:accent};
  216. font-weight:bold;
  217. text-align:left;
  218. line-height:25px;
  219. border:none;
  220. box-shadow:none;
  221. }
  222.  
  223. h1 a:hover {
  224. font-size:19px;
  225. color:{color:accent};
  226. font-weight:bold;
  227. text-align:left;
  228. line-height:25px;
  229. border:none;
  230. box-shadow:none;
  231. }
  232.  
  233. h2 {
  234. font-size:19px;
  235. color:{color:accent};
  236. text-align:center;
  237. line-height:22px;
  238. text-transform:justify;
  239. font-weight:bold;
  240. box-shadow:none;
  241. }
  242.  
  243. h2 a {
  244. font-size:19px;
  245. color:{color:accent};
  246. text-align:center;
  247. line-height:22px;
  248. text-transform:justify;
  249. font-weight:bold;
  250. border:none;
  251. box-shadow:none;
  252. }
  253.  
  254. h2 a:hover {
  255. font-size:19px;
  256. color:{color:accent};
  257. text-align:center;
  258. line-height:22px;
  259. text-transform:justify;
  260. font-weight:bold;
  261. border:none;
  262. box-shadow:none;
  263. }
  264.  
  265. bold, b, strong {
  266. font-weight:bold;
  267. color:{color:accent};
  268. }
  269.  
  270. i, em, italic {
  271. color:{color:gradient 2};
  272. }
  273.  
  274. small, sub, sup {
  275. font-size:13px;
  276. }
  277.  
  278. .tmblr-iframe-compact .tmblr-iframe--unified-controls { z-index: 999999999!important;margin-top: 2.9em;padding-right:0.3em;opacity: 0;visibility: hidden;-webkit-transition: all 0.5s;-moz-transition: all 0.5s;-ms-transition: all 0.5s;-o-transition: all 0.5s;transition: all 0.5s; }
  279.  
  280. body.controls-click .tmblr-iframe {
  281. opacity: 1.0;
  282. visibility: visible;
  283. -webkit-transition: all 0.5s;
  284. -moz-transition: all 0.5s;
  285. -ms-transition: all 0.5s;
  286. -o-transition: all 0.5s;
  287. transition: all 0.5s;
  288. }
  289.  
  290. /*----- sidebar -----*/
  291.  
  292. #sidebar {
  293. width:300px;
  294. height:550px;
  295. margin-top:1.5em;
  296. background:{color:posts};
  297. position:fixed;
  298. padding:20px;
  299. margin-left:-3em;
  300. border:{select:borders} solid {color:borders};
  301. border-radius:{select:border radius};
  302. box-shadow:0px 0px {select:shadow} {color:borders};
  303. }
  304.  
  305. #sidebarie {
  306. position:absolute;
  307. width:300px;
  308. height:350px;
  309. margin-top:3.5em;
  310. border-radius:{select:border radius}!important;
  311. object-fit: cover;
  312. }
  313.  
  314. #sidebarie img {
  315. width:300px;
  316. height:350px;
  317. object-fit: cover;
  318. }
  319.  
  320. #title {
  321. position:absolute;
  322. background: linear-gradient(to right, {color:Gradient 1}, {color:Gradient 2});
  323. margin-top:0em;
  324. margin-left:0em;
  325. width:280px;
  326. padding:10px;
  327. text-align:center;
  328. font-weight:bold;
  329. font-size:16px;
  330. line-height:18px;
  331. overflow-y:hidden;
  332. color:{color:posts};
  333. margin-bottom:0.5em;
  334. border-radius:{select:border radius};
  335. }
  336.  
  337. #title a {
  338. color:{color:posts};
  339. }
  340.  
  341. #desc {
  342. margin-top:30.2em;
  343. margin-left:0em;
  344. background:{color:background};
  345. padding:10px;
  346. width:280px;
  347. height:37px;
  348. text-align:center;
  349. border-radius:{select:border radius};
  350. }
  351.  
  352. #desc a {
  353. color:{color:accent};
  354. }
  355.  
  356. #desc a:hover {
  357. color:{color:gradient 2};
  358. }
  359.  
  360. #nav {
  361. width:500px;
  362. margin-top:0.7em;
  363. }
  364.  
  365. #nav li {
  366. display:inline-block;
  367. background: linear-gradient(to right, {color:Gradient 1}, {color:Gradient 2});
  368. padding:6px;
  369. width:80px;
  370. text-align:center;
  371. border-radius:{select:border radius};
  372. color:{color:posts};
  373. -webkit-transition: all 0.5s ease;
  374. transition: all 0.5s ease;
  375. -moz-transition: all 0.5s ease;
  376. -o-transition: all 0.5s ease;
  377. margin-right:12px;
  378. }
  379.  
  380. #nav a {
  381. color:{color:posts};
  382. -webkit-transition: all 0.5s ease;
  383. transition: all 0.5s ease;
  384. -moz-transition: all 0.5s ease;
  385. -o-transition: all 0.5s ease;
  386. }
  387.  
  388. #nav li:hover {
  389. transform: scale(0.9);
  390. -webkit-transition: all 0.5s ease;
  391. transition: all 0.5s ease;
  392. -moz-transition: all 0.5s ease;
  393. -o-transition: all 0.5s ease;
  394. }
  395.  
  396. #desc2 {
  397. margin-top:0.7em;
  398. margin-left:0em;
  399. background:{color:background};
  400. padding:10px;
  401. width:280px;
  402. height:10px;
  403. border-radius:{select:border radius};
  404. }
  405.  
  406. #desc2 a {
  407. color:{color:accent};
  408. -webkit-transition: all 0.5s ease;
  409. transition: all 0.5s ease;
  410. -moz-transition: all 0.5s ease;
  411. -o-transition: all 0.5s ease;
  412. }
  413.  
  414. #desc2 a:hover {
  415. color:{color:gradient 2};
  416. -webkit-transition: all 0.5s ease;
  417. transition: all 0.5s ease;
  418. -moz-transition: all 0.5s ease;
  419. -o-transition: all 0.5s ease;
  420. letter-spacing:2px;
  421. }
  422.  
  423. #desc2 i {
  424. color:{color:accent};
  425. }
  426.  
  427. .search .query {
  428. position:absolute;
  429. top:5.6em;
  430. left:2em;
  431. margin-top:54.3em;
  432. border: 0;
  433. outline: 0;
  434. width:280px;
  435. padding: 4px;
  436. padding-left:10px;
  437. font-size: 9px;
  438. letter-spacing:3px;
  439. text-transform:uppercase;
  440. background:transparent;
  441. color:{color:text};
  442. }
  443.  
  444. {block:ifabeezee}
  445. .search .query {
  446. font-family: abeezee;
  447. font-size: 9px;
  448. }
  449. {/block:ifabeezee}
  450.  
  451. {block:ifquicksand}
  452. .search .query {
  453. font-family: quicksand;
  454. font-size: 9px;
  455. margin-top:54.2em;
  456. }
  457. {/block:ifquicksand}
  458.  
  459. {block:ifkarla}
  460. .search .query {
  461. font-family: karla;
  462. font-size: 10.5px;
  463. margin-top:45.65em;
  464. }
  465. {/block:ifkarla}
  466.  
  467. {block:ifroboto}
  468. .search .query {
  469. font-family: roboto;
  470. font-size: 9px;
  471. margin-top:54.25em;
  472. }
  473. {/block:ifroboto}
  474.  
  475. {block:ifnunito}
  476. .search .query {
  477. font-family: nunito;
  478. font-size: 9px;
  479. margin-top:54.25em;
  480. }
  481. {/block:ifnunito}
  482.  
  483. ::-webkit-input-placeholder {color: inherit;}
  484. :-moz-placeholder {color: inherit; opacity:1;}
  485. ::-moz-placeholder {color: inherit; opacity:1;}
  486. :-ms-input-placeholder {color: inherit;}
  487.  
  488. input:focus::-webkit-input-placeholder {color: transparent;}
  489. input:focus:-moz-placeholder {color: transparent;}
  490. input:focus::-moz-placeholder {color: transparent;}
  491. input:focus:-ms-input-placeholder { color: transparent;}
  492.  
  493. /*----- heading -----*/
  494.  
  495. #heading {
  496. background: {color:posts};
  497. width: 100%;
  498. height:20px;
  499. padding:10px;
  500. position: fixed;
  501. z-index:99999999999!important;
  502. text-align:center;
  503. top:-50px;
  504. left:0px;
  505. border-bottom:{select:borders} solid {color:borders};
  506. box-shadow:0px 0px {select:shadow} {color:borders};
  507. transition: top 0.3s;
  508. }
  509.  
  510. #heading a {
  511. border-bottom:0px;
  512. margin:1em!important;
  513. }
  514.  
  515. #heading i {
  516. font-size:19px;
  517. color:{color:accent};
  518. -webkit-transition: all 0.5s ease;
  519. transition: all 0.5s ease;
  520. -moz-transition: all 0.5s ease;
  521. -o-transition: all 0.5s ease;
  522. }
  523.  
  524. #heading i:hover {
  525. color:{color:gradient 2};
  526. -webkit-transition: all 0.5s ease;
  527. transition: all 0.5s ease;
  528. -moz-transition: all 0.5s ease;
  529. -o-transition: all 0.5s ease;
  530. }
  531.  
  532. #linkiez {
  533. position:absolute;
  534. margin-left:-1em;
  535. -webkit-transition: all 0.5s ease;
  536. transition: all 0.5s ease;
  537. -moz-transition: all 0.5s ease;
  538. -o-transition: all 0.5s ease;
  539. }
  540.  
  541. #linkiez span {
  542. color:{color:accent};
  543. border:none;
  544. font-size:15px;
  545. -webkit-transition: all 0.5s ease;
  546. transition: all 0.5s ease;
  547. -moz-transition: all 0.5s ease;
  548. -o-transition: all 0.5s ease;
  549. }
  550.  
  551. #linkiez span:hover, #linkiez a:hover {
  552. letter-spacing:2px;
  553. }
  554.  
  555. {block:ifroboto}
  556. #linkiez {
  557. margin-top:0.6px;
  558. }
  559. {/block:ifroboto}
  560.  
  561. {block:ifnunito}
  562. #linkiez {
  563. margin-top:0.9px;
  564. }
  565. {/block:ifnunito}
  566.  
  567. #linkiez li {
  568. color:{color:accent};
  569. list-style-type:none;
  570. display:inline-block;
  571. text-align:center;
  572. font-size:15px;
  573. }
  574.  
  575. #linkiez a {
  576. color:{color:accent};
  577. border:none;
  578. font-size:15px;
  579. }
  580.  
  581. #linkiez a:hover, #linkiez span:hover {
  582. color:{color:gradient 2};
  583. border:none;
  584. -webkit-transition: all 0.5s ease;
  585. transition: all 0.5s ease;
  586. -moz-transition: all 0.5s ease;
  587. -o-transition: all 0.5s ease;
  588. }
  589.  
  590. .scrollToTop {
  591. text-decoration: none;
  592. position:fixed;
  593. top:-4px;
  594. right:1.4em;
  595. display:none;
  596. z-index:999999999999999999;
  597. }
  598.  
  599. .scrollToTop:hover{
  600. text-decoration:none;
  601. }
  602.  
  603. .controlz {
  604. position:fixed;
  605. top:9.5px;
  606. right:-3px;
  607. }
  608.  
  609. /*----- posts -----*/
  610.  
  611. main {
  612. position: relative;
  613. width: calc(250px + 540px + 150px);
  614. margin: auto;
  615. }
  616.  
  617. section {
  618. position:relative;
  619. top:50%;
  620. left:50%;
  621. width: 580px;
  622. margin-left: -130px;
  623. margin-top:50px;
  624. padding:20px;
  625. }
  626.  
  627. article {
  628. width: 540px;
  629. position: relative;
  630. margin-bottom:80px!important;
  631. background:{color:posts};
  632. padding:20px;
  633. border:{select:borders} solid {color:borders};
  634. border-radius:{select:border radius};
  635. box-shadow:0px 0px {select:shadow} {color:borders};
  636. }
  637.  
  638. article a {
  639. box-shadow:0px 2px 0px {color:borders};
  640. }
  641.  
  642. article a:hover {
  643. box-shadow:0px 2px 0px {color:accent};
  644. }
  645.  
  646. .posts li, .posts blockquote, figure, video, iframe, .video, .video iframe, figure.tmblr-embed.tmblr-full, figure.tmblr-embed.tmblr-full iframe, .caption iframe { max-width: 100%; }
  647.  
  648. .caption {
  649. list-style-type: none;
  650. margin-top:0.5em;
  651. margin-left:0.3em;
  652. }
  653.  
  654. .caption .username a {
  655. box-shadow:0px 2px 0px {color:borders};
  656. }
  657.  
  658. .caption .username a:hover {
  659. box-shadow:0px 2px 0px {color:accent};
  660. }
  661.  
  662. li {
  663. list-style-type:circle;
  664. }
  665.  
  666. li::marker {
  667. color: {color:accent};
  668. }
  669.  
  670. .text-caption:first-of-type { margin-top: 0.8em; }
  671.  
  672. .rbinfo {
  673. background: linear-gradient(to right, {color:Gradient 1}, {color:Gradient 2});
  674. padding:5px;
  675. padding-bottom:13px;
  676. padding-top:13px;
  677. border-radius:{select:border radius};
  678. color:{color:posts}!important;
  679. font-weight:normal!important;
  680. line-height:14px;
  681. }
  682.  
  683. .rbinfo span {
  684. font-weight:normal!important;
  685. margin-left:0em;
  686. }
  687.  
  688. .rbinfo a, .rbinfo .username {
  689. border:none;
  690. color:{color:posts}!important;
  691. box-shadow:none;
  692. }
  693.  
  694. .rbinfo .username {
  695. border:none;
  696. color:{color:posts}!important;
  697. margin-left:0.1em;
  698. box-shadow:none;
  699. margin-top:-0.2em;
  700. margin-bottom:0em;
  701. }
  702.  
  703. .rbinfo b {
  704. color:{color:posts}!important;
  705. }
  706.  
  707. .rbinfo .user-icon {
  708. width:2em;
  709. height:2em;
  710. outline:2px solid {color:posts};
  711. outline-offset:0px;
  712. margin-left:10px;
  713. margin-top:-1em!important;
  714. border-radius:100%;
  715. }
  716.  
  717. .rbinfo .user-icon img {
  718. border-radius:100%;
  719. }
  720.  
  721. .user-icon {
  722. display: inline-block;
  723. vertical-align: middle;
  724. width: 0.5em;
  725. height: 0.5em;
  726. margin-right: 0.6em;
  727. margin-top:0em;
  728. border-radius:100%;
  729. background:{color:accent};
  730. }
  731.  
  732. .username, .username a {
  733. display: inline-block;
  734. font-weight: bold;
  735. color:{color:accent};
  736. text-decoration:none;
  737. border-bottom:none;
  738. box-shadow:none!important;
  739. }
  740.  
  741. .username a:hover {
  742. font-weight: bold;
  743. color:{color:gradient 2};
  744. text-decoration:none;
  745. border-bottom:none;
  746. box-shadow:none;
  747. }
  748.  
  749. p.tmblr-attribution {margin-top: 1em !important;}
  750.  
  751. a.link-wrap {
  752. display: block;
  753. border: 1px solid {color:borders};
  754. }
  755.  
  756. .link { padding: 2em; }
  757.  
  758. .link-host, .link-txt { margin-top: 1.5em; }
  759.  
  760. .npf-link-block {
  761. margin-top: 1.5em;
  762. background-color: inherit;
  763. border: 1px solid inherit;
  764. color: inherit;
  765. }
  766.  
  767. img {
  768. margin: 0;
  769. display: block;
  770. height: auto;
  771. max-width: 100%;
  772. margin-bottom:5px;
  773. border-radius:{select:border radius};
  774. }
  775.  
  776. .photo-slideshow,
  777. .npf_photoset {
  778. border-radius:{select:border radius};
  779. }
  780.  
  781. .vignette, #vignette {opacity: 0;}
  782. .tmblr-lightbox, #tumblr_lightbox {background-color: rgba(130, 130, 130, 0.75) !important;}
  783.  
  784. .lightbox-image, #tumblr_lightbox img {
  785. box-shadow: none !important;
  786. border-radius: 0 !important;
  787. max-width: none;
  788. }
  789.  
  790. #tumblr_lightbox_caption, .lightbox-caption {
  791. color: #fff !important;
  792. font-family: inherit;
  793. margin-top: 1em !important;
  794. }
  795.  
  796. .post-content div.npf_row, .post div.npf_row, body div.npf_row {
  797. margin-left: 0 !important;
  798. margin-right: 0 !important;
  799. }
  800.  
  801. .quote { line-height: 160%; font-size: 1.25em; }
  802.  
  803. .quote p:first-of-type { margin-top: 0; }
  804. .quote p:last-of-type { margin-bottom: 0; }
  805.  
  806. .source { margin-top: 1.5em; }
  807.  
  808. .chat { padding: 0; margin: 0; }
  809. .chat li { list-style-type: none; margin-top: 1em; }
  810. .chat li:first-of-type { margin-top: 0; }
  811. .chatter { font-weight: bold; }
  812.  
  813. p.npf_chat, p.npf_chat b {font-family: inherit;}
  814.  
  815. /*----- asks -----*/
  816.  
  817. .question {
  818. background:{color:posts};
  819. color:{color:text};
  820. padding:20px;
  821. border-top-right-radius:35px;
  822. border-bottom-right-radius:35px;
  823. border-bottom-left-radius:35px;
  824. margin-top:5px;
  825. text-align:justify;
  826. position:relative;
  827. }
  828.  
  829. .asking {
  830. margin-top:1em;
  831. background:{color:background};
  832. border-radius:{select:border radius};
  833. padding:20px;
  834. color:{color:text};
  835. text-align:justify;
  836. }
  837.  
  838. .asking b, .asking a {
  839. font-weight:bold;
  840. color:{color:accent};
  841. border-bottom:0px solid;
  842. box-shadow:none;
  843. }
  844.  
  845. .asking a:hover {
  846. color:{color:gradient 2};
  847. border-bottom:0px solid;
  848. box-shadow:none;
  849. }
  850.  
  851. .question p:first-of-type { margin-top: 0; }
  852. .question p:last-of-type { margin-bottom: 0; }
  853.  
  854. .answer2 {
  855. font-weight:normal;
  856. text-transform:lowercase;
  857. text-align:justify;
  858. font-family: {text:font};
  859. font-size: 13.5px;
  860. color: {color:text};
  861. padding-top:3px;
  862. }
  863.  
  864. /*----- info -----*/
  865.  
  866. .info {
  867. height:21px;
  868. margin-top: 1.2em;
  869. padding:10px;
  870. background: linear-gradient(to right, {color:Gradient 1}, {color:Gradient 2});
  871. border-radius:{select:border radius};
  872. color:{color:posts};
  873. }
  874.  
  875. .info a {
  876. display: inline-block;
  877. vertical-align: middle;
  878. text-transform:lowercase;
  879. color:{color:posts};
  880. border-bottom:0px solid;
  881. padding-left:3px;
  882. box-shadow:none;
  883. }
  884.  
  885. .info a:hover {
  886. text-decoration:none;
  887. color:{color:posts};
  888. text-shadow:none;
  889. border-bottom:0px solid;
  890. box-shadow:none;
  891. }
  892.  
  893. .infopix {
  894. margin-top:-1.4em;
  895. margin-left:35.2em;
  896. width:100%;
  897. }
  898.  
  899. .info img {
  900. width: 1em;
  901. height: 1em;
  902. border-radius:100%;
  903. outline:2px solid {color:posts};
  904. outline-offset:0px;
  905. margin:2.2px;
  906. }
  907.  
  908. .but {
  909. margin-top:-19px;
  910. text-align:right;
  911. padding-right:5px;
  912. }
  913.  
  914. {block:ifquicksand}
  915. .info a {
  916. margin-top:-2px;
  917. }
  918.  
  919. .but {
  920. margin-top:-18px;
  921. }
  922. {/block:ifquicksand}
  923.  
  924. {block:ifkarla}
  925. .info a {
  926. margin-top:-3px;
  927. }
  928.  
  929. .but {
  930. margin-top:-18px;
  931. }
  932. {/block:ifkarla}
  933.  
  934. {block:ifroboto}
  935. .info a {
  936. margin-top:0px;
  937. }
  938.  
  939. .but {
  940. margin-top:-19px;
  941. }
  942. {/block:ifroboto}
  943.  
  944. {block:ifnunito}
  945. .info a {
  946. margin-top:1.2px;
  947. }
  948.  
  949. .but {
  950. margin-top:-19px;
  951. }
  952. {/block:ifnunito}
  953.  
  954. .buttons {
  955. top:0em;
  956. left:44em;
  957. position:absolute;
  958. z-index:999999!important;
  959. }
  960.  
  961. .buttons i {
  962. font-size:20px;
  963. -webkit-transition: all 0.5s ease;
  964. transition: all 0.5s ease;
  965. -moz-transition: all 0.5s ease;
  966. -o-transition: all 0.5s ease;
  967. color:{color:accent};
  968. }
  969.  
  970. .buttonscontrols a {
  971. background: {color:posts};
  972. border:{select:borders} solid {color:borders};
  973. box-shadow:0px 0px {select:shadow} {color:borders}!important;
  974. position:relative;
  975. display:inline-block;
  976. overflow:hidden;
  977. padding:8px;
  978. width:20px;
  979. height:20px;
  980. border-radius:{select:border radius};
  981. margin-bottom:0.3em;
  982. box-shadow:none;
  983. }
  984.  
  985. .buttonscontrols a:hover {
  986. background: linear-gradient(to right, {color:Gradient 1}, {color:Gradient 2});
  987. position:relative;
  988. display:inline-block;
  989. overflow:hidden;
  990. padding:8px;
  991. width:20px;
  992. height:20px;
  993. border:{select:borders} solid {color:borders};
  994. box-shadow:0px 0px {select:shadow} {color:borders}!important;
  995. border-radius:{select:border radius};
  996. box-shadow:none;
  997. transform: scale(0.9);
  998. -webkit-transition: all 0.6s ease;
  999. transition: all 0.6s ease;
  1000. -moz-transition: all 0.6s ease;
  1001. -o-transition: all 0.6s ease;
  1002. }
  1003.  
  1004. .buttons a:hover i {
  1005. color:{color:posts};
  1006. -webkit-transition: all 0.6s ease;
  1007. transition: all 0.6s ease;
  1008. -moz-transition: all 0.6s ease;
  1009. -o-transition: all 0.6s ease;
  1010. }
  1011.  
  1012. .buttonscontrols .like .like_button {
  1013. position:relative;
  1014. }
  1015.  
  1016. .buttonscontrols .like .like_button iframe {
  1017. position:absolute;
  1018. top:0;
  1019. left:0;
  1020. bottom:0;
  1021. right:0;
  1022. z-index:2;
  1023. opacity:0;
  1024. }
  1025.  
  1026. .tags {
  1027. word-wrap: break-word;
  1028. margin-top:1em!important;
  1029. margin-left:0em;
  1030. }
  1031.  
  1032. .tags a {
  1033. margin-right:0em;
  1034. color:{color:text};
  1035. font-weight:normal;
  1036. padding-right:0.4em;
  1037. box-shadow:none;
  1038. }
  1039.  
  1040. .tags a:hover {
  1041. text-decoration:none;
  1042. color:{color:accent};
  1043. text-shadow:none;
  1044. box-shadow:none;
  1045. }
  1046.  
  1047. .tags a:before {
  1048. content: '#';
  1049. }
  1050.  
  1051. /*----- notes -----*/
  1052.  
  1053. .notes { margin-top:-1em; }
  1054. .notes a { color:{color:accent}; text-decoration:none;border-bottom:0px solid;box-shadow:none; }
  1055. .notes a:hover { color:{color:gradient 2}; text-decoration:none;border-bottom:0px solid;box-shadow:none; }
  1056.  
  1057. ol.notes {
  1058. max-width: 100%;
  1059. padding: 0;
  1060. margin: 2em 0 0 0;
  1061. text-align:left;
  1062. }
  1063.  
  1064. ol.notes li.note { padding: 0.3em 0; list-style-type: none; }
  1065.  
  1066. ol.notes li.note img.avatar {
  1067. margin-right: 0.5em;
  1068. margin-top:0.4em;
  1069. vertical-align: middle;
  1070. display: inline-block;
  1071. width: 1em;
  1072. height: 1em;
  1073. border-radius:100%;
  1074. border:2px solid {color:accent};
  1075. }
  1076.  
  1077. /*----- pagination -----*/
  1078.  
  1079. #page-navigation { text-align: center; }
  1080. #page-navigation a, .current-page { margin: 0 0.5em;box-shadow:none;-webkit-transition: all 0.6s ease;transition: all 0.6s ease;-moz-transition: all 0.6s ease;-o-transition: all 0.6s ease; }
  1081. #page-navigation a:hover, #page-navigation i:hover { color:{color:gradient 2};-webkit-transition: all 0.6s ease;transition: all 0.6s ease;-moz-transition: all 0.6s ease;-o-transition: all 0.6s ease; }
  1082. #page-navigation i { color:{color:accent};font-size:20px;-webkit-transition: all 0.6s ease;transition: all 0.6s ease;-moz-transition: all 0.6s ease;-o-transition: all 0.6s ease; }
  1083. .current-page { font-weight: bold; color: {color:accent}; }
  1084.  
  1085. {CustomCSS}
  1086.  
  1087. /*----- tooltips -----*/
  1088.  
  1089. .tippy-tooltip.custom-theme {
  1090. background-color: {color:posts};
  1091. color: {color:accent};
  1092. text-align:center;
  1093. font-size:12.5px;
  1094. text-transform:lowercase;
  1095. border:{select:borders} solid {color:borders};
  1096. border-radius:{select:border radius};
  1097. box-shadow:0px 0px {select:shadow} {color:borders};
  1098. }
  1099.  
  1100. /*----- popup box -----*/
  1101.  
  1102. #pop {
  1103. width:100%;
  1104. height:100%;
  1105. top:0;left:0;
  1106. position:fixed;
  1107. z-index:999999999!important;
  1108. background:rgba(255,255,255,.8);
  1109. display:none;
  1110. }
  1111.  
  1112. .fade {
  1113. top:0;
  1114. left:0;
  1115. position:fixed;
  1116. z-index:1000;
  1117. width:100%;
  1118. height:100%;
  1119. }
  1120.  
  1121. .popup {
  1122. top:50%;
  1123. left:50%;
  1124. transform:translate(-50%,-50%);
  1125. position:fixed;
  1126. background:{color:posts}; /* background of popup box */
  1127. padding:20px; /* padding of popup box */
  1128. z-index:10000;
  1129. width:500px; /* width of popup */
  1130. height:508px;
  1131. border:{select:borders} solid {color:borders};
  1132. border-radius:{select:border radius};
  1133. box-shadow:0px 0px {select:shadow} {color:borders};
  1134. line-height:30px;
  1135. }
  1136.  
  1137. .grad {
  1138. background: linear-gradient(to right, {color:Gradient 1}, {color:Gradient 2});
  1139. border-radius:{select:border radius};
  1140. height:40px;
  1141. }
  1142.  
  1143. .grad2 {
  1144. position:absolute;
  1145. background:{color:posts};
  1146. color:{color:text};
  1147. letter-spacing:3px;
  1148. text-transform:uppercase;
  1149. font-size:9px;
  1150. margin-top:-3.2em;
  1151. margin-left:1.2em;
  1152. width:426px;
  1153. padding:2px;
  1154. line-height: 135%;
  1155. border-radius:{select:border radius};
  1156. }
  1157.  
  1158. .grad3 {
  1159. background:{color:dot 1};
  1160. border-radius:{select:border radius};
  1161. height:10px;
  1162. width:10px;
  1163. border-radius:100%;
  1164. margin-top:-1.9em;
  1165. margin-left:33.3em;
  1166. }
  1167.  
  1168. .grad4 {
  1169. background:{color:dot 2};
  1170. border-radius:{select:border radius};
  1171. height:10px;
  1172. width:10px;
  1173. border-radius:100%;
  1174. margin-top:-0.73em;
  1175. margin-left:34.4em;
  1176. }
  1177.  
  1178. .grad5 {
  1179. background:{color:dot 3};
  1180. border-radius:{select:border radius};
  1181. height:10px;
  1182. width:10px;
  1183. border-radius:100%;
  1184. margin-top:-0.75em;
  1185. margin-left:35.5em;
  1186. }
  1187.  
  1188. .gradd {
  1189. width:150px;
  1190. height:167px;
  1191. position:absolute;
  1192. margin-top:2em;
  1193. margin-left:0em;
  1194. object-fit: cover;
  1195. }
  1196.  
  1197. .gradd img {
  1198. width:150px;
  1199. height:167px;
  1200. border-radius:{select:border radius};
  1201. object-fit: cover;
  1202. }
  1203.  
  1204. .popup p {
  1205. background:{color:background};
  1206. border-radius:{select:border radius};
  1207. padding:10px;
  1208. text-align:center;
  1209. padding-top:35px;
  1210. padding-bottom:35px;
  1211. }
  1212.  
  1213. .popup a {
  1214. color:{color:accent};
  1215. border:none;
  1216. -webkit-transition: all 0.5s ease;
  1217. transition: all 0.5s ease;
  1218. -moz-transition: all 0.5s ease;
  1219. -o-transition: all 0.5s ease;
  1220. }
  1221.  
  1222. .popup a:hover {
  1223. color:{color:gradient 2};
  1224. border:none;
  1225. padding-left:30px;
  1226. -webkit-transition: all 0.5s ease;
  1227. transition: all 0.5s ease;
  1228. -moz-transition: all 0.5s ease;
  1229. -o-transition: all 0.5s ease;
  1230. }
  1231.  
  1232. .popup li {
  1233. list-style-type:none;
  1234. padding:5px;
  1235. text-align:left;
  1236. color:{color:accent};
  1237. border-bottom:1px solid {color:borders};
  1238. margin-bottom:0.6em;
  1239. }
  1240.  
  1241. .popup i {
  1242. font-size:17px;
  1243. }
  1244.  
  1245. .popup b {
  1246. background:{color:accent};
  1247. color:{color:posts};
  1248. padding:5px;
  1249. padding-left:7px;
  1250. padding-right:7px;
  1251. border-radius:{select:border radius};
  1252. }
  1253.  
  1254. .popup bb {
  1255. background:{color:gradient 2};
  1256. color:{color:posts};
  1257. padding:5px;
  1258. padding-left:7px;
  1259. padding-right:7px;
  1260. border-radius:{select:border radius};
  1261. font-weight:bold;
  1262. }
  1263.  
  1264. .popup h1 {
  1265. transform: rotate(-90deg);
  1266. background:{color:accent};
  1267. color:{color:posts};
  1268. padding:5px;
  1269. border-radius:{select:border radius};
  1270. width:140px;
  1271. font-size:15px;
  1272. box-shadow:0px 3px 0px {color:borders};
  1273. }
  1274.  
  1275. #headerg {
  1276. margin-top:2em;
  1277. margin-left:0em;
  1278. width:500px;
  1279. height:200px;
  1280. z-index:99999999999!important;
  1281. object-fit: cover;
  1282. }
  1283.  
  1284. #headerg img {
  1285. width:500px;
  1286. height:200px;
  1287. object-fit: cover;
  1288. }
  1289.  
  1290. .etc {
  1291. position:absolute;
  1292. top:0px;
  1293. left:1.4em;
  1294. margin-top:36em;
  1295. width:491px;
  1296. height:30px;
  1297. text-align:center;
  1298. padding:4px;
  1299. padding-left:0.6em;
  1300. background:{color:background};
  1301. color:{color:text};
  1302. border-radius:{select:border radius};
  1303. }
  1304.  
  1305. .etc b {
  1306. background:none;
  1307. color:{color:accent};
  1308. padding:0px;
  1309. padding-left:0px;
  1310. padding-right:0px;
  1311. }
  1312.  
  1313. {block:ifabeezee}
  1314. .etc {
  1315. font-family: abeezee;
  1316. font-size: 13.5px;
  1317. }
  1318. {/block:ifabeezee}
  1319.  
  1320. .etc a:hover {
  1321. color:{color:gradient 2};
  1322. border:none;
  1323. padding-left:0px;
  1324. -webkit-transition: all 0.5s ease;
  1325. transition: all 0.5s ease;
  1326. -moz-transition: all 0.5s ease;
  1327. -o-transition: all 0.5s ease;
  1328. }
  1329.  
  1330. </style>
  1331.  
  1332. <!--✻✻✻✻✻✻ UN-BLUE POLLS by @glenthemes ✻✻✻✻✻✻--> <link href="//static.tumblr.com/gtjt4bo/mXBrpdj0n/unblue-polls.css" rel="stylesheet"> <style> .poll-post { --Poll-Question-Font-Size: 16px; --Poll-Option-Background-Color: {color:accent}; --Poll-Option-Corner-Rounding: 18px; --Poll-Option-Border-Size: 0px; --Poll-Option-Border-Color: {color:borders}; --Poll-Option-Padding: 10px; --Poll-Option-Font-Size: 13.5px; --Poll-Option-Spacing: 10px; --Poll-Option-Text-Color: {color:posts}; --Poll-Option-HOVER-Border-Color: none; --Poll-Option-HOVER-Background-Color: {color:gradient 2}; --Poll-Option-HOVER-Text-Color: {color:accent}; --Poll-Option-HOVER-Speed: 0.5s; } </style>
  1333.  
  1334. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script><script>
  1335. $(document).ready(function(){
  1336. $('.click,.fade').click(function() {
  1337. $('#pop').fadeToggle();
  1338. });
  1339. });
  1340. </script>
  1341.  
  1342. </head>
  1343.  
  1344. <!----- html ----->
  1345.  
  1346. <body>
  1347.  
  1348. <!--✻✻✻✻✻✻ npf audio player by @glenthemes ✻✻✻✻✻✻-->
  1349. <script src="//tmblr-npf-audio.gitlab.io/s/init.js"></script>
  1350. <link href="//tmblr-npf-audio.gitlab.io/s/base.css" rel="stylesheet">
  1351. <script>
  1352. tumblr_npf_audio({
  1353. emptyTitleText: "Untitled track",
  1354. emptyArtistText: "Untitled artist",
  1355. emptyAlbumText: "Untitled album",
  1356.  
  1357. titleLabel: "Track:",
  1358. artistLabel: "Artist:",
  1359. albumLabel: "Album:"
  1360. });
  1361. </script>
  1362. <style edit-npf-audio-player>
  1363. .npf-audio-wrapper {
  1364. --NPF-Audio-Buttons-Size: 1.4rem;
  1365. --NPF-Audio-Buttons-Color: {color:accent};
  1366. --NPF-Audio-Buttons-Spacing: 1.3rem;
  1367. --NPF-Audio-Image-Size: 72px;
  1368. --NPF-Audio-Image-Spacing: 5px;
  1369. }
  1370.  
  1371. .npf-audio-background {
  1372. background-color: {color:background};
  1373. padding: 1.5rem;
  1374. border-radius:{select:border radius};
  1375. margin-top:-0.4em;
  1376. }
  1377.  
  1378. .npf-audio-title-label,
  1379. .npf-audio-artist-label,
  1380. .npf-audio-album-label {
  1381. font-weight: bold;
  1382. color:{color:accent};
  1383. }
  1384.  
  1385. .npf-audio-title,
  1386. .npf-audio-artist,
  1387. .npf-audio-album {
  1388. color: {color:text};
  1389. }
  1390.  
  1391. /*----- updates -----*/
  1392.  
  1393. .tab {
  1394. left:10px;
  1395. top:52px;
  1396. position:fixed;
  1397. width:350px;
  1398. height:auto;
  1399. max-height:100%;
  1400. overflow:hidden;
  1401. z-index:999999999999999;
  1402. }
  1403.  
  1404. .tab_content {
  1405. color:{color:text};
  1406. display:none;
  1407. padding:20px;
  1408. width:250px;
  1409. height:160px;
  1410. background:{color:posts};
  1411. border:{select:borders} solid {color:borders};
  1412. border-radius:{select:border radius};
  1413. }
  1414.  
  1415. .tab_content li {
  1416. list-style-type:none;
  1417. margin-bottom:8px;
  1418. line-height:25px;
  1419. }
  1420.  
  1421. {block:ifnunito}
  1422. .tab_content li {
  1423. list-style-type:none;
  1424. margin-bottom:9px;
  1425. line-height:25px;
  1426. }
  1427.  
  1428. .tab_content {
  1429. color:{color:text};
  1430. display:none;
  1431. padding:20px;
  1432. width:250px;
  1433. height:170px;
  1434. background:{color:posts};
  1435. border:{select:borders} solid {color:borders};
  1436. border-radius:{select:border radius};
  1437. }
  1438. {/block:ifnunito}
  1439.  
  1440. {block:ifroboto}
  1441. .tab_content {
  1442. color:{color:text};
  1443. display:none;
  1444. padding:20px;
  1445. width:250px;
  1446. height:163px;
  1447. background:{color:posts};
  1448. border:{select:borders} solid {color:borders};
  1449. border-radius:{select:border radius};
  1450. }
  1451. {/block:ifroboto}
  1452.  
  1453. {block:ifkarla}
  1454. .tab_content {
  1455. color:{color:text};
  1456. display:none;
  1457. padding:20px;
  1458. width:250px;
  1459. height:165px;
  1460. background:{color:posts};
  1461. border:{select:borders} solid {color:borders};
  1462. border-radius:{select:border radius};
  1463. }
  1464. {/block:ifkarla}
  1465.  
  1466. .tab_content b {
  1467. background:{color:accent};
  1468. color:{color:posts};
  1469. padding:5px;
  1470. padding-left:7px;
  1471. padding-right:7px;
  1472. border-radius:{select:border radius};
  1473. font-weight:bold;
  1474. margin-right:0.3em;
  1475. }
  1476.  
  1477. .tab_content bb {
  1478. background:{color:gradient 2};
  1479. color:{color:posts};
  1480. padding:5px;
  1481. padding-left:7px;
  1482. padding-right:7px;
  1483. border-radius:{select:border radius};
  1484. font-weight:bold;
  1485. margin-right:0.3em;
  1486. }
  1487.  
  1488. .tab_content i {
  1489. font-size:20px;
  1490. }
  1491.  
  1492. .tab_content a {
  1493. color:{color:text};
  1494. box-shadow:0px 2px 0px {color:borders};
  1495. }
  1496.  
  1497. .tab_content a:hover {
  1498. color:{color:accent};
  1499. box-shadow:0px 2px 0px {color:accent};
  1500. }
  1501.  
  1502. </style>
  1503.  
  1504. <main>
  1505.  
  1506. <!----- heading ----->
  1507.  
  1508. <script>
  1509. // When the user scrolls down 20px from the top of the document, slide down the navbar
  1510. window.onscroll = function() {scrollFunction()};
  1511.  
  1512. function scrollFunction() {
  1513. if (document.body.scrollTop > 20 || document.documentElement.scrollTop > 20) {
  1514. document.getElementById("heading").style.top = "0px";
  1515. } else {
  1516. document.getElementById("heading").style.top = "-50px";
  1517. }
  1518. }
  1519. </script>
  1520.  
  1521. <div id="heading">
  1522.  
  1523. <div id="linkiez">
  1524. <li><a href="/">home</a></li>
  1525. <li><a href="/ask">message</a></li>
  1526. <li><a href="/archive">archive</a></li>
  1527. {block:ifupdates}
  1528. <li><div class="tabs">&nbsp;&nbsp;&nbsp;<span>updates</span>&nbsp;&nbsp;&nbsp;</div></li>
  1529. {/block:ifupdates}
  1530. <li><a href="https://gloriapritchetts.tumblr.com">credit</a></li>
  1531. </div>
  1532.  
  1533. <a href="#" class="scrollToTop"title="scroll to top"style="position:absolute;top:-4px;right:40px;"><i class="ph ph-arrow-circle-up"></i></a>
  1534.  
  1535. <a class="controls-button"title="controls"style="position:absolute;top:-4px;right:18px;"><i class="ph ph-gear"></i></a>
  1536.  
  1537. </div> <!----- heading end ----->
  1538.  
  1539. <!----- heading on permalink page ----->
  1540. {block:PermalinkPage}
  1541. <div id="heading"style="top:0px;">
  1542.  
  1543. <div id="linkiez">
  1544. <li><a href="/">refresh</a></li>
  1545. <li><div class="tabs2">&nbsp;&nbsp;&nbsp;<span>contact</span>&nbsp;&nbsp;&nbsp;</div></li>
  1546. <li><a href="/archive">archive</a></li>
  1547. <li><div class="tabs">&nbsp;&nbsp;&nbsp;<span>updates</span>&nbsp;&nbsp;&nbsp;</div></li>
  1548. <li><a href="https://gloriapritchetts.tumblr.com"title="by drea">credit</a></li>
  1549. </div>
  1550.  
  1551. <a href="#" class="scrollToTop"title="scroll to top"style="position:absolute;top:-4px;right:40px;"><i class="ph ph-arrow-circle-up"></i></a>
  1552.  
  1553. <a class="controls-button"title="controls"style="position:absolute;top:-4px;right:18px;"><i class="ph ph-gear"></i></a>
  1554.  
  1555. </div> <!----- heading on permalink end ----->
  1556. {/block:PermalinkPage}
  1557.  
  1558. <!----- sidebar ----->
  1559.  
  1560. <div id="sidebar">
  1561. <div id="title"><a href="/">{Title}</a></div>
  1562. <img src="{image:sidebar}" id="sidebarie">
  1563. <div id="desc">{text:description}</div>
  1564. <div id="nav">
  1565. <li><a href="{text:link 1 url}">{text:link 1 title}</a></li>
  1566. <li><a href="{text:link 2 url}">{text:link 2 title}</a></li>
  1567. <li><div class="click"><a title="click me!">{text:popup title}</a></div></li>
  1568. </div>
  1569. <div id="desc2"><form class="search" action="javascript:return false">
  1570. <input type="text" class="query" placeholder="search {Name}...">
  1571. </form><div id="desc2i"style="position:absolute;margin-top:-0.3em;margin-left:20em;"><i class="ph ph-magnifying-glass"></i>
  1572. </div></a></div>
  1573. </div> <!----- sidebar end ----->
  1574.  
  1575. <!----- popup ----->
  1576.  
  1577. <div id="pop"> <div class="fade"></div>
  1578. <div class="popup">
  1579.  
  1580. <div class="grad"></div>
  1581. <div class="grad2">&nbsp;{Name}.tumblr.com</div>
  1582. <div class="grad3"></div>
  1583. <div class="grad4"></div>
  1584. <div class="grad5"></div>
  1585.  
  1586. <img src="{image:header}" id="headerg">
  1587.  
  1588. <h1 style="text-align:center;margin-top:5.7em;margin-left:-4em;position:absolute;">about me</h1>
  1589. <div class="bio"style="margin-top:1em;width:220px;margin-left:1em;{block:ifnunito}line-height:31px;{/block:ifnunito}">
  1590. <p><b>name</b> &nbsp;{text:name}<br>
  1591. <bb>age</bb> &nbsp;{text:age}<br>
  1592. <b>pronouns</b> &nbsp;{text:pronouns}<br>
  1593. <bb>zodiac</bb> &nbsp;{text:zodiac}</p>
  1594. </div>
  1595.  
  1596. <div class="bio"style="margin-top:-16em;margin-left:18em;">
  1597. <li><a href="{text:popup link 1 url}">{text:popup link 1 title}</a><div style="margin-top:-2em;margin-left:17.8em;"><i class="ph ph-caret-right"></i></div></li>
  1598.  
  1599. <li><a href="{text:popup link 2 url}">{text:popup link 2 title}</a><div style="margin-top:-2em;margin-left:17.8em;"><i class="ph ph-caret-right"></i></div>
  1600.  
  1601. <li><a href="{text:popup link 3 url}">{text:popup link 3 title}</a><div style="margin-top:-2em;margin-left:17.8em;"><i class="ph ph-caret-right"></i></div>
  1602.  
  1603. <li><a href="{text:popup link 4 url}">{text:popup link 4 title}</a><div style="margin-top:-2em;margin-left:17.8em;"><i class="ph ph-caret-right"></i></div>
  1604. </div>
  1605.  
  1606. <div class="etc">{text:popup desc}</div>
  1607.  
  1608. {block:ifquicksand}
  1609. <div class="etc"><div style="margin-top:-0.1em;">{text:popup desc}</div></div>{/block:ifquicksand}
  1610.  
  1611. {block:ifkarla}
  1612. <div class="etc"><div style="margin-top:-0.1em;">{text:popup desc}</div></div>{/block:ifkarla}
  1613.  
  1614. </div>
  1615. </div> <!----- popup end ----->
  1616.  
  1617. <section>
  1618.  
  1619. {block:TagPage}
  1620. <article>
  1621. <b>posts tagged under:</b> #{Tag}
  1622. </article>
  1623. {/block:TagPage}
  1624.  
  1625. <!----- posts ----->
  1626.  
  1627. {block:Posts}
  1628. <article class="posts" id="{PostID}">
  1629.  
  1630. <!----- rb/via ----->
  1631.  
  1632. <div class="rbinfo">
  1633. {block:RebloggedFrom}
  1634. <div class="user-icon"style="margin-top:0em;"><img src="{ReblogParentPortraitURL-64}"></div>
  1635. <div class="username"><a href="{Permalink}">{Name}</a><br><span>reblogged from <a href="{ReblogParentURL}"title="{ReblogParentTitle}">{ReblogParentName}</a></span></div>
  1636. {/block:RebloggedFrom}
  1637. {block:NotReblog}
  1638. <div class="user-icon"style="margin-top:0em;"><img src="{PortraitURL-64}"></div>
  1639. <div class="username"><a href="{Permalink}">{Name}</a><br><span>original post</span></div>
  1640. {/block:NotReblog}
  1641. </div> <!----- rb/via end ----->
  1642.  
  1643. <!----- buttons ----->
  1644.  
  1645. {block:Date}
  1646. <div class="buttons">
  1647. <div class="buttonscontrols">
  1648. {block:PinnedPostLabel}<a href="{Permalink}" class="pinned-post"title="pinned"><i class="ph ph-push-pin-simple"></i></a>{/block:PinnedPostLabel}
  1649.  
  1650. <a href="{ReblogURL}" target="_blank" class="reblog"title="reblog"><i class="ph ph-repeat"></i></a>
  1651.  
  1652. <a href="#" class="like"title="like"style="padding-bottom:8.5px;">{LikeButton}<i class="ph ph-heart"></i></a>
  1653.  
  1654. {block:ContentSource}<a href="{SourceURL}"title="source"><i class="ph ph-link"></i></a>{/block:ContentSource}
  1655. </div>
  1656. </div>
  1657. {/block:Date}
  1658.  
  1659. {block:Text}
  1660. {block:Title}<h1 class="post-title">{Title}</h1>{/block:Title}
  1661. {block:NotReblog}
  1662. <li class="caption text-caption">
  1663. {Body}
  1664. </li>
  1665. {/block:NotReblog}
  1666. {block:RebloggedFrom}
  1667. {block:Reblogs}
  1668. <li class="caption text-caption">
  1669. <div class="user-icon"></div>
  1670. <div class="username"><a href="{Permalink}">{Username}</a></div>
  1671. {Body}
  1672. </li>
  1673. {/block:Reblogs}
  1674. {/block:RebloggedFrom}
  1675. {/block:Text}
  1676.  
  1677. {block:Link}
  1678. <a href="{URL}" class="link-wrap">
  1679. {block:Thumbnail}<img src="{Thumbnail-HighRes}">{/block:Thumbnail}
  1680. <div class="link">
  1681. <div class="title">{Name}</div>
  1682. {block:Excerpt}<div class="link-txt">{Excerpt}</div>{/block:Excerpt}
  1683. {block:Host}<div class="link-host">{Host}</div>{/block:Host}
  1684. </div>
  1685. </a>
  1686. {block:Description}
  1687. {block:NotReblog}
  1688. <li class="caption">
  1689. {Description}
  1690. </li>
  1691. {/block:NotReblog}
  1692. {/block:Description}
  1693. {block:RebloggedFrom}
  1694. {block:Reblogs}
  1695. <li class="caption">
  1696. <div class="user-icon"></div>
  1697. <div class="username {block:IsDeactivated}deactive{/block:IsDeactivated}"><a href="{Permalink}">{Username}</a></div>
  1698. {Body}
  1699. </li>
  1700. {/block:Reblogs}
  1701. {/block:RebloggedFrom}
  1702. {/block:Link}
  1703.  
  1704. {block:Photo}
  1705. <div class="photo">
  1706. {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}" alt="{PhotoAlt}"></a>{LinkCloseTag}
  1707. </div>
  1708. {block:Caption}
  1709. {block:NotReblog}
  1710. <li class="caption">
  1711. {Caption}
  1712. </li>
  1713. {/block:NotReblog}
  1714. {block:RebloggedFrom}
  1715. {block:Reblogs}
  1716. <li class="caption">
  1717. <div class="user-icon"></div>
  1718. <div class="username {block:IsDeactivated}deactive{/block:IsDeactivated}"><a href="{Permalink}">{Username}</a></div>
  1719. {Body}
  1720. </li>
  1721. {/block:Reblogs}
  1722. {/block:RebloggedFrom}
  1723. {/block:Caption}
  1724. {/block:Photo}
  1725.  
  1726. {block:Photoset}
  1727. <div class="photo"style="margin-top:1em;">{Photoset-700}</div>
  1728. {block:Caption}
  1729. {block:NotReblog}
  1730. <li class="caption">
  1731. {Caption}
  1732. </li>
  1733. {/block:NotReblog}
  1734. {block:RebloggedFrom}
  1735. {block:Reblogs}
  1736. <li class="caption">
  1737. <div class="user-icon"></div>
  1738. <div class="username {block:IsDeactivated}deactive{/block:IsDeactivated}"><a href="{Permalink}">{Username}</a></div>
  1739. {Body}
  1740. </li>
  1741. {/block:Reblogs}
  1742. {/block:RebloggedFrom}
  1743. {/block:Caption}
  1744. {/block:Photoset}
  1745.  
  1746. {block:Video}
  1747. <div class="video">{Video-500}</div>
  1748. {block:Caption}
  1749. {block:NotReblog}
  1750. <li class="caption">
  1751. {Caption}
  1752. </li>
  1753. {/block:NotReblog}
  1754. {block:RebloggedFrom}
  1755. {block:Reblogs}
  1756. <li class="caption">
  1757. <div class="user-icon"></div>
  1758. <div class="username {block:IsDeactivated}deactive{/block:IsDeactivated}"><a href="{Permalink}">{Username}</a></div>
  1759. {Body}
  1760. </li>
  1761. {/block:Reblogs}
  1762. {/block:RebloggedFrom}
  1763. {/block:Caption}
  1764. {/block:Video}
  1765.  
  1766. {block:Quote}
  1767. <div class="quote">{Quote}</div>
  1768. {block:Source}<div class="source">{Source}</div>{/block:Source}
  1769. {/block:Quote}
  1770.  
  1771. {block:Chat}
  1772. {block:Title}<h1 class="post-title"><a href="{Permalink}">{Title}</a></h1>{/block:Title}
  1773. <ul class="chat">{block:Lines}
  1774. <li>
  1775. {block:Label}<div class="chatter">{Label}</div>{/block:Label}
  1776. {Line}
  1777. </li>
  1778. {/block:Lines}</ul>
  1779. {/block:Chat}
  1780.  
  1781. {block:Answer}
  1782. <div class="asking"><b>{Asker}</b> sent a message
  1783. <div class="question">{Question}</div></div>
  1784. {block:Answerer}
  1785. <div class="answer2">{Answer}</div>
  1786. {/block:Answerer}
  1787. {block:NotReblog}
  1788. <li class="caption">
  1789. {Replies}
  1790. </li></div>
  1791. {/block:NotReblog}
  1792. {block:RebloggedFrom}
  1793. {block:Reblogs}
  1794. <li class="caption">
  1795. <div class="user-icon"></div>
  1796. <div class="username {block:IsDeactivated}deactive{/block:IsDeactivated}"><a href="{Permalink}">{Username}</a></div>
  1797. {Body}
  1798. </li>
  1799. {/block:Reblogs}
  1800. {/block:RebloggedFrom}
  1801. {/block:Answer}
  1802.  
  1803. {block:Audio}
  1804. <div class="audiopost">
  1805. <div class="audiobox">
  1806. <div class="button">
  1807. {block:AudioPlayer}{AudioPlayer}{/block:AudioPlayer}
  1808. </div>
  1809. </div>
  1810. {block:AlbumArt}
  1811. <img src="{AlbumArtURL}" class="album-art">
  1812. {/block:AlbumArt}
  1813. <div class="audioinfo">
  1814. {block:TrackName}<li class="track">{TrackName}</li>{/block:TrackName}
  1815. {block:Artist}<li>{Artist}</li>{/block:Artist}
  1816. {block:Album}<li>{Album}</li>{/block:Album}
  1817. </div>
  1818. </div>
  1819. {block:Caption}
  1820. {block:NotReblog}
  1821. <li class="caption">
  1822. {Caption}
  1823. </li>
  1824. {/block:NotReblog}
  1825. {block:RebloggedFrom}
  1826. {block:Reblogs}
  1827. <li class="caption">
  1828. <div class="user-icon"></div>
  1829. <div class="username {block:IsDeactivated}deactive{/block:IsDeactivated}"><a href="{Permalink}">{Username}</a></div>
  1830. {Body}
  1831. </li>
  1832. {/block:Reblogs}
  1833. {/block:RebloggedFrom}
  1834. {/block:Caption}
  1835. {/block:Audio}
  1836.  
  1837. <!----- info ----->
  1838.  
  1839. {block:Date}
  1840. <div class="info">
  1841. <a href="{Permalink}"title="{TimeAgo}">{Month} {DayofMonth}, {Year}</a>
  1842.  
  1843. <div class="but">
  1844. {block:NoteCount}<a href="{Permalink}">{NoteCountWithLabel}</a>{/block:NoteCount}
  1845. </div>
  1846.  
  1847. </div>
  1848. {/block:Date}
  1849.  
  1850. <!----- tags ----->
  1851.  
  1852. {block:HasTags}
  1853. <div class="tags">
  1854. {block:Tags}
  1855. <a href="{TagURL}">{Tag}</a>
  1856. {/block:Tags}
  1857. </div>
  1858. {/block:HasTags}
  1859.  
  1860. <!----- notes ----->
  1861.  
  1862. {block:PermalinkPage}{block:Date}
  1863. {block:NoteCount}{block:PostNotes}
  1864. <div class="notes">
  1865. {PostNotes-64}
  1866. </div>
  1867. {/block:PostNotes}{/block:NoteCount}
  1868. {/block:Date}{/block:PermalinkPage}
  1869.  
  1870. </article>
  1871.  
  1872. {/block:Posts}
  1873.  
  1874. <!----- pagination ----->
  1875.  
  1876. {block:Pagination}
  1877. <article id="page-navigation">
  1878.  
  1879. {block:PreviousPage}
  1880. <div style="position:absolute; left:10px; margin-top:-0.15em;"><a href="{PreviousPage}"title="previous page"><i class="ph ph-arrow-circle-left"></i></a></div>
  1881. {/block:PreviousPage}
  1882.  
  1883. {block:JumpPagination length="5"}
  1884. {block:CurrentPage}<span class="current-page">{PageNumber}</span>{/block:CurrentPage}
  1885. {block:JumpPage}<a href="{URL}">{PageNumber}</a>{/block:JumpPage}
  1886. {/block:JumpPagination}
  1887.  
  1888. {block:NextPage}
  1889. <div style="position:absolute; right:10px;margin-top:-1.5em;"><a href="{NextPage}"title="next page"><i class="ph ph-arrow-circle-right"></i></a></div>{/block:NextPage}
  1890. </article>
  1891. {/block:Pagination}
  1892.  
  1893. </section>
  1894.  
  1895. </main>
  1896.  
  1897. <!----- scripts ----->
  1898.  
  1899. <script src="https://unpkg.com/popper.js@1"></script>
  1900. <script src="https://unpkg.com/tippy.js@5/dist/tippy-bundle.iife.js"></script>
  1901. <link rel="stylesheet" href="https://unpkg.com/tippy.js@5/dist/svg-arrow.css" />
  1902.  
  1903. <script>
  1904.  
  1905. $(document).ready(function(){
  1906.  
  1907. //Check to see if the window is top if not then display button
  1908. $(window).scroll(function(){
  1909. if ($(this).scrollTop() > 100) {
  1910. $('.scrollToTop').fadeIn();
  1911. } else {
  1912. $('.scrollToTop').fadeOut();
  1913. }
  1914. });
  1915.  
  1916. //Click event to scroll to top
  1917. $('.scrollToTop').click(function(){
  1918. $('html, body').animate({scrollTop : 0},800);
  1919. return false;
  1920. });
  1921.  
  1922. });
  1923.  
  1924.  
  1925. tippy('a[title]', {
  1926. theme: 'custom',
  1927. arrow: tippy.round,
  1928. zIndex: 9999999999,
  1929. maxWidth: 300,
  1930.  
  1931. content(reference) {
  1932. const title = reference.getAttribute('title');
  1933. reference.removeAttribute('title');
  1934. return title;
  1935. },
  1936. });
  1937. </script>
  1938.  
  1939. <script src="//ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
  1940.  
  1941. <script>
  1942. $(document).ready(function(){
  1943. $('.controls-button').click(function(){
  1944. $('body').toggleClass('controls-click');
  1945. });
  1946. });
  1947. </script>
  1948.  
  1949. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  1950. <script>
  1951. $(document).ready(function(){
  1952. $('.search').submit(function(event){
  1953. var value = $('input:first').val();
  1954. location.replace('https://{Name}.tumblr.com/tagged/' + value);
  1955. });
  1956. });
  1957. </script>
  1958.  
  1959. </body>
  1960.  
  1961. <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
  1962. <script>
  1963. $(document).ready(function(){
  1964. $(".tabs").click(function(){
  1965. $(".tab_content").slideToggle("slow");
  1966. });
  1967. });
  1968. </script>
  1969.  
  1970. <!----- updates ----->
  1971.  
  1972. <div class="tab">
  1973. <div class="tab_content">
  1974.  
  1975. <li><i class="ph ph-television"style="color:{color:accent};"></i>
  1976. <div style="margin-top:-2.2em;margin-left:2em;"><b>watching</b> {text:watching}</div></li>
  1977.  
  1978. <li><i class="ph ph-headphones"style="color:{color:gradient 2};"></i>
  1979. <div style="margin-top:-2.2em;margin-left:2em;"><bb>listening to</bb> {text:listening to}</div></li>
  1980.  
  1981. <li><i class="ph ph-book"style="color:{color:accent};"></i>
  1982. <div style="margin-top:-2.2em;margin-left:2em;"><b>reading</b> {text:reading} </div></li>
  1983.  
  1984. <li><i class="ph ph-magic-wand"style="color:{color:gradient 2};"></i>
  1985. <div style="margin-top:-2.2em;margin-left:2em;"><bb>working on</bb> {text:working on} </div></li>
  1986.  
  1987. <li><i class="ph ph-info"style="color:{color:accent};"></i>
  1988. <div style="margin-top:-2.2em;margin-left:2em;"><b>status</b> {text:status}</div></li>
  1989.  
  1990. </div>
  1991. </div> <!----- updates end ----->
  1992.  
  1993. </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!