API tools faq
paste
Advertisement
userbru

theme twenty-four.

userbru
Jul 16th, 2022 (edited)
927
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 54.58 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2. <html xmlns="https://www.w3.org/1999/xhtml">
  3. <head>
  4. <title>{Title}</title>
  5. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  6. <link rel="shortcut icon" href="{Favicon}">
  7. {block:Description}
  8. <meta name="description" content="{MetaDescription}">
  9. {/block:Description}
  10. <meta name="viewport" content="width=device-width, initial-scale=1">
  11.  
  12. <!--
  13.  
  14. THEME #24 BY BRU
  15.  
  16. icons by cappuccicons, font-awesome, phosphoricons, boxicons
  17. navbar by codinglab
  18. tooltips by tippy
  19. NPF fix by glenthemes
  20. fade-in by cory laviska
  21. tumblr controls, masonry by maziekeen
  22. popup by odeysseus
  23. searchbox/entries by glenthemes
  24. update tab by mercury themes
  25. not found by fukuo
  26. scroll to top by paulund
  27. animated link by tobias sahlin
  28. update tab by mercurythms
  29.  
  30.  
  31. -->
  32.  
  33. <meta name="color:Background" content="#141517">
  34. <meta name="color:Posts" content="#1d1f24">
  35. <meta name="color:Sidenav" content="#c67d89">
  36. <meta name="color:Subtitle" content="#ffbec9"/>
  37. <meta name="color:Gradient 1" content="#000000"/>
  38. <meta name="color:Gradient 2" content="#d4a7af"/>
  39. <meta name="color:Gradient 3" content="#fea99b"/>
  40. <meta name="color:Sidelink Hover Button" content="#fff"/>
  41. <meta name="color:Text" content="#fff">
  42. <meta name="color:Borders" content="#141517">
  43. <meta name="color:Links" content="#fea99b">
  44. <meta name="color:Hover" content="#999999">
  45. <meta name="color:Asks" content="#ffb7c3">
  46. <meta name="color:Text Ask" content="#000"/>
  47. <meta name="color:Select Text" content="#f1f1f1"/>
  48. <meta name="color:Custom Scrollbar" content="#333"/>
  49. <meta name="color:Gradient 1 Tooltips" content="#ffb3b3"/>
  50. <meta name="color:Gradient 2 Tooltips" content="#ffdada"/>
  51. <meta name="color:Not Found Gradient BG 1" content="#d2c1fe"/>
  52. <meta name="color:Not Found Gradient BG 2" content="#8172aa"/>
  53. <meta name="color:Not Found Text" content="#000"/>
  54. <meta name="color:Not Found Link" content="#ffccd8"/>
  55.  
  56. <meta name="image:Sidebar Image" content=""/>
  57.  
  58. <meta name="if:Sidebar Image" content="1" />
  59.  
  60. <meta name="text:Subtitle" content="Subtitle here"/>
  61. <meta name="text:Desktop Description" content="Desktop description here"/>
  62. <meta name="text:Home Title" content="Home"/>
  63. <meta name="text:Ask Title" content="Ask"/>
  64. <meta name="text:Link 1 Url" content="/"/>
  65. <meta name="text:Link 1 Title" content=""/>
  66. <meta name="text:Link 2 Url" content="/"/>
  67. <meta name="text:Link 2 Title" content=""/>
  68. <meta name="text:Link 3 Url" content="/"/>
  69. <meta name="text:Link 3 Title" content=""/>
  70. <meta name="text:Link 4 Url" content="/"/>
  71. <meta name="text:Link 4 Title" content=""/>
  72. <meta name="text:Pop Up" content="/">
  73.  
  74.  
  75. <!---- ABOUT TEXT --->
  76.  
  77. <meta name="text:Name" content=""/>
  78. <meta name="text:Tracked Tag" content=""/>
  79. <meta name="text:Age" content=""/>
  80. <meta name="text:Pronouns" content=""/>
  81. <meta name="text:Sexuality" content=""/>
  82. <meta name="text:Country" content=""/>
  83. <meta name="text:Race Ethnicity" content=""/>
  84. <meta name="text:Zodiac" content=""/>
  85.  
  86.  
  87.  
  88. <!-- GOOGLE FONTS & ICON FONTS-->
  89.  
  90. <link rel="preconnect" href="https://fonts.googleapis.com">
  91. <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
  92. <link href="https://fonts.googleapis.com/css2?family=Manrope:wght@300&family=Poppins&display=swap" rel="stylesheet">
  93. <link href="https://fonts.googleapis.com/css2?family=Nunito&display=swap" rel="stylesheet">
  94. <link href="https://fonts.googleapis.com/css2?family=Aclonica&family=Elsie+Swash+Caps:wght@900&family=Merienda:wght@700&display=swap" rel="stylesheet">
  95.  
  96.  
  97. <script src="https://cdn.jsdelivr.net/npm/@phosphor-icons/[email protected]"></script>
  98. <link href='https://unpkg.com/[email protected]/css/boxicons.min.css' rel='stylesheet'>
  99.  
  100. <script src="//ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
  101.  
  102. <link rel="stylesheet" href="https://maxst.icons8.com/vue-static/landings/line-awesome/line-awesome/1.3.0/css/line-awesome.min.css">
  103.  
  104. <!-- SCRIPTS -->
  105.  
  106. <script src="//ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
  107.  
  108. <!--
  109. NPF IMAGES READJUSTMENT | @glenthemes
  110. v2.0 [last updated: 2021-06-03]
  111. -->
  112. <link href="//glen-npf-2020.glitch.me/npf-override.css" rel="stylesheet">
  113. <script src="//glen-npf-2020.glitch.me/npf-evenize.js"></script>
  114.  
  115. <style type="text/css">
  116. :root {
  117. --NPF-Image-Spacing:4px;
  118. --NPF-Bottom-Gap-From-Captions:1em;
  119. }
  120. </style>
  121.  
  122. <script type="text/javascript" src="https://static.tumblr.com/iuggpng/bGqm4yfv9/jquery-1.7.2.js"></script>
  123.  
  124. <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.9.0/css/all.css"></link>
  125.  
  126. <link href="https://static.tumblr.com/5omyijl/bzrn2yg7i/style-my-tooltips.css" rel="stylesheet" type="text/css" />
  127. <script src="https://static.tumblr.com/0siu224/Ljlqmh1nv/masonry.pkgd.min.js"></script>
  128.  
  129. <script src="https://static.tumblr.com/5omyijl/RZtn2yg9v/jquery.style-my-tooltips.js"></script> <script> (function($){ $(document).ready(function(){ $("[title]").style_my_tooltips({ tip_follows_cursor:true, tip_delay_time:200, tip_fade_speed:300 }); }); })(jQuery); </script>
  130.  
  131. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script><script>
  132. $(document).ready(function(){
  133. $('.click,.fade').click(function() {
  134. $('#pop').fadeToggle();
  135. });
  136. });
  137. </script>
  138.  
  139. <script type="text/javascript">
  140. if(location.href=='https://{name}.tumblr.com/ask') location.replace('https://{name}.tumblr.com/msg');;
  141. </script>
  142.  
  143.  
  144. <style type="text/css">
  145.  
  146.  
  147. /* UPDATE TABS */
  148.  
  149. #update-icon {
  150. display: flex;
  151. flex-direction: row-reverse;
  152. justify-content: center;
  153. align-items: center;
  154. position: fixed;
  155. height:100vh;
  156. top: 0;
  157. right: 20px;
  158. z-index: 50;
  159. }
  160.  
  161. #update-icon i {
  162. font-size: 21px;
  163. color: {color:Links};
  164. }
  165.  
  166.  
  167. #update-wrapper {display: none;}
  168.  
  169. #update-content {
  170. display: flex;
  171. justify-content: center;
  172. align-items: center;
  173. margin-right: 10px;
  174. }
  175.  
  176. #update-arrow {
  177. border-top: 10px solid transparent;
  178. border-bottom: 10px solid transparent;
  179. border-left: 10px solid {color:Posts};
  180.  
  181. }
  182.  
  183. #update-box {
  184. width: 160px;
  185. font-size: 12px;
  186. padding: 1em;
  187. background: {color:Posts};
  188. color: {color:Text};
  189. border-radius: 5px;
  190. }
  191.  
  192. #update-box i {font-size: 1em; }
  193.  
  194. .update-title {font-weight: bold; font-size: 14px; line-height: 1.6em;}
  195.  
  196.  
  197. /* NAVBAR */
  198.  
  199. nav {
  200. position: fixed;
  201. top: -10px;
  202. right:0;
  203. height: 90px;
  204. width: 100%;
  205. z-index: 100;
  206. backdrop-filter: blur(16px) saturate(180%);
  207. -webkit-backdrop-filter: blur(16px) saturate(180%);
  208. background-color: rgb(29,31,36, 0.76);
  209. border: 1px solid rgba(209, 213, 219, 0.3);
  210.  
  211. }
  212.  
  213.  
  214. nav .nav-bar{
  215. position: relative;
  216. height: 100%;
  217. max-width: 1000px;
  218. width: 100%;
  219. margin: 0 auto;
  220. padding: 0 30px;
  221. display: flex;
  222. align-items: center;
  223. justify-content: space-between;
  224. }
  225.  
  226. nav .nav-bar .sidebarOpen{
  227. color: {color:text};
  228. font-size: 25px;
  229. padding: 10px;
  230. cursor: pointer;
  231. display: none;
  232. }
  233. nav .nav-bar .logo a{
  234. font-size: 30px;
  235. font-weight: 400;
  236. color: {color:text};
  237. text-decoration: none;
  238. font-family: 'Aclonica', sans-serif;
  239.  
  240.  
  241. }
  242.  
  243.  
  244. .nav-bar .nav-links{
  245. display: flex;
  246. align-items: center;
  247. }
  248.  
  249. .nav-bar .nav-links li{
  250. margin: 0 5px;
  251. list-style: none;
  252. font-family:'Poppins', sans-serif;
  253. }
  254.  
  255. .nav-links li a{
  256. position: relative;
  257. font-size: 15px;
  258. font-weight: 400;
  259. color: {color:text};
  260. text-decoration: none;
  261. padding: 10px;
  262. }
  263.  
  264. .nav-links li a::before{
  265. content: '';
  266. position: absolute;
  267. left: 50%;
  268. bottom: 0;
  269. transform: translateX(-50%);
  270. height: 6px;
  271. width: 6px;
  272. border-radius: 50%;
  273. background-color: {color:gradient 3};
  274. opacity: 0;
  275. transition: all 0.3s ease;
  276. }
  277.  
  278.  
  279. .nav-links li:hover a::before{
  280. opacity: 1;
  281. }
  282.  
  283.  
  284.  
  285. @media (max-width: 790px) {
  286. nav .nav-bar .sidebarOpen{
  287. display: block;
  288. }
  289.  
  290. .menu{
  291. position: fixed;
  292. height: 100%;
  293. width: 320px;
  294. left: -100%;
  295. top: 0;
  296. padding: 20px;
  297. backdrop-filter: blur(19px) saturate(92%);
  298. -webkit-backdrop-filter: blur(19px) saturate(92%);
  299. background-color: rgba(217, 177, 255, 0.69);
  300. border: 1px solid rgba(209, 213, 219, 0.3);
  301. z-index: 100;
  302. transition: all 0.4s ease;
  303. }
  304.  
  305. nav.active .menu{
  306. left: -0%;
  307. }
  308.  
  309. nav.active .nav-bar .navLogo a{
  310. opacity: 0;
  311. transition: all 0.3s ease;
  312. }
  313.  
  314. .menu .logo-toggle{
  315. display: block;
  316. width: 100%;
  317. display: flex;
  318. align-items: center;
  319. justify-content: space-between;
  320. }
  321.  
  322.  
  323. .nav-bar .nav-links{
  324. flex-direction: column;
  325. padding-top: 30px;
  326. width:90%;
  327. }
  328.  
  329. .nav-links li a{
  330. display: block;
  331. margin-top: 20px;
  332. }
  333. }
  334.  
  335.  
  336.  
  337.  
  338. /* ABOUT */
  339.  
  340. .about {
  341. height: 100%;
  342. width: 0;
  343. position: fixed;
  344. z-index: 9999999;
  345. top: 0;
  346. left: 0;
  347. background-color: {color:Background};
  348. overflow-x: hidden;
  349. transition: 0.5s;
  350. padding-top: 60px;
  351. color:#fff;
  352. }
  353.  
  354. .about a {
  355. text-decoration: none;
  356. color:#fff;
  357. display: block;
  358. transition: 0.3s;
  359. }
  360.  
  361. .about a:hover {
  362. color: {color:gradient 2};
  363. }
  364.  
  365. .about a::before {
  366. content: "";
  367. position: justify;
  368. display: block;
  369. width:100%;
  370. height:0px;
  371. bottom: 0;
  372. left: 0;
  373. background-image:linear-gradient(to right, {color:gradient 2}, {color:gradient 3});
  374. transform: scaleX(0);
  375. transition: transform 0.3s ease;
  376. }
  377.  
  378. .about a:hover::before {
  379. transform: scaleX(1);
  380. }
  381.  
  382.  
  383. .about .closebtn {
  384. position: absolute;
  385. top:0;
  386. right: 25px;
  387. font-size: 12px;
  388. margin-left: 50px;
  389. border:1px solid {color:Hover};
  390. border-radius:4px;
  391. padding:10px;
  392. }
  393.  
  394. .closebtn {
  395. margin-top:15px;
  396. }
  397.  
  398. .about-icon {
  399. width:100px;
  400. border-radius:100%;
  401. }
  402.  
  403. main {
  404. transition: margin-left .5s;
  405. padding: 16px;
  406. }
  407.  
  408. .about h3 {
  409. font-family:'Poppins',sans-serif;
  410. font-size:14px;
  411. font-weight:bold;
  412. }
  413.  
  414. .about h4 {
  415. font-family:'Manrope', sans-serif;
  416. font-size:12px;
  417. margin-top:-10px;
  418. }
  419.  
  420. .about-info {
  421. display:flex;
  422. justify-content:center;
  423. flex-wrap:wrap;
  424. gap:30px;
  425. padding:10px;
  426. }
  427.  
  428. .about-title {
  429. font-family:'Poppins',sans-serif;
  430. font-weight:bold;
  431. display: block;
  432. padding: 6px 5px 0;
  433. }
  434. .about li {
  435. list-style-type:circle;
  436. font-family:'Manrope', sans-serif;
  437. display: inline-block;
  438. padding: 5px 5px 0;
  439. }
  440.  
  441.  
  442. /* each profile box */
  443. .profile {
  444. margin-left:100px;
  445. margin-bottom: 25px;
  446. margin-top:20px;
  447. box-sizing: border-box;
  448. width:720px;
  449. outline: 1px solid {color:Hover}; /* you'll have to change the color here, or delete this line if you don't want the border */
  450. }
  451.  
  452. /* each row wrapping the first info,
  453. ex: 1 row: full name and main aliases, 2 row: birth year and species/gender */
  454. .profile-row {
  455. display: flex;
  456. justify-content: center;
  457. }
  458.  
  459. /* each info individually (name and description), full name is an info, main aliases is an info, links is an info, birth year is an info */
  460. .profile-info {
  461. width: 700px;
  462. display: inline-block;
  463. margin: 5px 15px;
  464. }
  465.  
  466. .profile-title {
  467. font-weight: bold;
  468. padding: 0 5px 0;
  469. margin-top:20px;
  470. display: block;
  471. text-transform: uppercase;
  472. font-family:'Poppins', sans-serif;
  473. color:{color:Gradient 2};
  474. }
  475.  
  476. .profile-description {
  477. max-height: 200px;
  478. padding: 0 5px 0;
  479. display: inline-block;
  480. overflow: auto;
  481. }
  482.  
  483. .about h1 {
  484. text-align:center;
  485. text-transform:uppercase;
  486. font-family:'Poppins', sans-serif;
  487. font-weight:bold;
  488. }
  489.  
  490. .social-wrap a {
  491. font-size: 26px;
  492. font-weight:400;
  493. color: #000;
  494. list-style-type: none;
  495. display: inline-block;
  496. padding: 15px 13px 10px;
  497. margin-right:10px;
  498. text-shadow:none;
  499. margin-left:20px;
  500. margin-right:30px;
  501. padding:10px;
  502. margin-top:10px;
  503. margin-bottom:10px;
  504. border-radius:10px 10px 10px 10px;
  505. }
  506.  
  507.  
  508. .social-wrap a:hover {
  509. color:{color:Sidelink Hover Button};
  510. }
  511.  
  512.  
  513.  
  514.  
  515.  
  516. /*GENERAL SECTION */
  517.  
  518.  
  519. /* TOOLTIPS */
  520. .tippy-tooltip.gradient-theme {
  521. background-image:linear-gradient(to right, {color:gradient 1 tooltips}, {color:gradient 2 tooltips});
  522. color:#000;
  523. text-align:center;
  524. font-family:'Public Sans', sans-serif;
  525. font-weight:bold;
  526. text-transform:uppercase;
  527. letter-spacing:1px;
  528. font-size:0.90em;
  529. box-shadow: 7px 7px 7px -9px rgba(000,000,000, 0.45);}
  530.  
  531. .tippy-tooltip.gradient-theme .tippy-svg-arrow {
  532. fill:var(--text);}
  533.  
  534. /* ----- TUMBLR CONTROLS ---- */
  535.  
  536.  
  537. .controls-button {
  538. position: fixed;
  539. cursor: help;
  540. top: 20px;
  541. right: 2rem;
  542. z-index: 1000;
  543. cursor: pointer;
  544. right:1.5rem;
  545. }
  546.  
  547. .tmblr-iframe {
  548. z-index: 999999999!important;
  549. opacity: 0;
  550. visibility: hidden;
  551. width:30px;
  552. -webkit-transition: all 0.5s;
  553. -moz-transition: all 0.5s;
  554. -ms-transition: all 0.5s;
  555. -o-transition: all 0.5s;
  556. transition: all 0.5s;
  557. }
  558.  
  559. body.controls-click .tmblr-iframe {
  560. opacity: 1;
  561. margin-right: 4rem;
  562. display:inline;
  563. vertical-align:bottom;
  564. visibility: visible;
  565. -webkit-transition: all 0.5s;
  566. -moz-transition: all 0.5s;
  567. -ms-transition: all 0.5s;
  568. -o-transition: all 0.5s;
  569. transition: all 0.5s;
  570. }
  571.  
  572.  
  573.  
  574.  
  575. /*END OF GENERAL: TUMBLR CONTROLS */
  576.  
  577. /*GENERAL: SCROLLBAR */
  578.  
  579. ::-webkit-scrollbar {
  580. width:0px;
  581. height:17px;
  582. }
  583. ::-webkit-scrollbar {
  584. background-color:rgb(255,255,255); /* background color */
  585. }
  586. ::-webkit-scrollbar-track {
  587. border:8px solid rgb(255,255,255); /* background color */
  588. background-color:rgb(230,230,230); /* light border color */
  589. }
  590. ::-webkit-scrollbar-thumb {
  591. border:8px solid rgb(255,255,255); /* background color */
  592. background-color:rgb(144,144,144); /* dark border color */
  593. min-height:24px;
  594. min-width:24px;
  595. }
  596. /*END OF GENERAL: SCROLLBAR */
  597.  
  598. /*GENERAL: SELECTION */
  599.  
  600. ::selection {
  601. background: {color:gradient 3};
  602. color:#000;
  603. }
  604.  
  605. ::-moz-selection {
  606. background: {color:gradient 3};
  607. color:#000;
  608. }
  609.  
  610. /*END OF GENERAL: SELECT */
  611.  
  612. /*GENERAL: STYLING */
  613.  
  614. body {
  615. font-size:12px;
  616. font-family: 'Manrope', sans-serif;
  617. text-align:justify;
  618. margin:0;
  619. line-height:1.5em;
  620. -moz-osx-font-smoothing:grayscale;
  621. -webkit-font-smoothing:antialiased;
  622. font-smoothing:antialiased;
  623. color:{color:text};
  624. background:{color:background};
  625. opacity: 1;
  626. transition: 1s opacity;
  627.  
  628. }
  629.  
  630. body.fade-out {
  631. opacity: 0;
  632. transition: none;
  633. }
  634.  
  635. html {
  636. background-color: {color:background};
  637. }
  638.  
  639. #s-m-t-tooltip {
  640. font-size:12px;
  641. font-family: 'Manrope', sans-serif;
  642. max-width:300px;
  643. background:{color:posts};
  644. margin:10px;
  645. padding:5px;
  646. border:0px;
  647. border-radius:0px;
  648. color:{color:text};
  649. z-index:999999;
  650. font-style:none;
  651. box-shadow: 0px 0px 0px rgba(0,0,0,.1);
  652. text-transform:lowercase;
  653. }
  654.  
  655.  
  656. a {
  657. color:{color:links};
  658. text-decoration:none;
  659. font-family:'Poppins', sans-serif;
  660. position:relative;
  661. cursor:pointer;
  662. -webkit-transition:all 0.2s;
  663. -moz-transition:all 0.2s;
  664. -ms-transition:all 0.2s;
  665. -o-transition:all 0.2s;
  666. transition:all 0.2s;
  667. }
  668.  
  669. a:hover {
  670. text-decoration:none;
  671. color:{color:Sidelink Hover Button};
  672. -webkit-transition:all 0.2s;
  673. -moz-transition:all 0.2s;
  674. -ms-transition:all 0.2s;
  675. -o-transition:all 0.2s;
  676. transition:all 0.2s;
  677. }
  678.  
  679.  
  680. a::before {
  681. content: "";
  682. position: absolute;
  683. display: block;
  684. width: 100%;
  685. height: 2px;
  686. bottom: 0;
  687. left: 0;
  688. background-image:linear-gradient(to right, {color:gradient 2}, {color:gradient 3});
  689. transform: scaleX(0);
  690. transition: transform 0.3s ease;
  691. }
  692.  
  693. a:hover::before {
  694. transform: scaleX(1);
  695. }
  696.  
  697. small, sub, sup {
  698. font-size:12px;
  699. }
  700.  
  701. b, 700, strong {
  702. color:{color:links};
  703. }
  704.  
  705. .entry h1 {
  706. font-size:18px!important;
  707. }
  708.  
  709. pre {
  710. font-size:12px;
  711. font-family: 'Manrope', sans-serif;
  712. }
  713.  
  714.  
  715. blockquote {
  716. display:block;
  717. margin:0;
  718. margin-left:5px;
  719. margin-right:5px;
  720. padding-left:10px;
  721. border-left:2px #f1f1f1 solid;
  722. }
  723.  
  724. blockquote blockquote {
  725. border:none;
  726. padding:0;
  727. margin:0;
  728. }
  729.  
  730.  
  731. img {
  732. border:0;
  733. max-width:100%;
  734. height:auto;
  735. margin-left:0px;
  736. }
  737.  
  738. hr {
  739. margin:1em 0;
  740. border:0;
  741. height:1px;
  742. -moz-box-sizing:border-box;
  743. box-sizing:border-box;
  744. background-color:{color:borders};
  745. }
  746.  
  747. ol {
  748. margin-left:-25px;
  749. }
  750.  
  751. ul {
  752. margin-left:-25px;
  753. }
  754.  
  755. li {
  756. list-style-type:circle;
  757. }
  758.  
  759. /*END OF GENERAL: STYLING */
  760.  
  761. /*GENERAL: CONTAINERS */
  762.  
  763. .main {
  764. margin:150px auto;
  765. padding-left:300px;
  766. width:540px;
  767. }
  768.  
  769. .asidecontainer {
  770. position:fixed;
  771. height:100%;
  772. margin-left:-380px;
  773. }
  774.  
  775. /*END OF GENERAL: CONTAINERS */
  776.  
  777.  
  778.  
  779.  
  780. /*END OF GENERAL SECTION */
  781.  
  782.  
  783. /*-------------------------------------------------------------------------*/
  784.  
  785.  
  786. /*SIDEBAR SECTION */
  787.  
  788.  
  789. /*SIDEBAR: GENERAL */
  790.  
  791. aside {
  792. width:300px;
  793. height:auto;
  794. padding:10px 10px 0px 10px;
  795. margin-left:-60px;
  796. top: {text:post margin}px;
  797. text-align:Center;
  798. position:fixed;
  799. overflow:hidden;
  800. background:{color:posts};
  801. border-radius: 12px;
  802. border: 1px solid rgba(209, 213, 219, 0.3);
  803. }
  804.  
  805. /*END OF SIDEBAR: GENERAL */
  806.  
  807. /*SIDEBAR: IMAGE */
  808.  
  809. aside img {
  810. width:300px;
  811. border-radius:5px;
  812. margin-top:10px;
  813. }
  814.  
  815. /*END OF SIDEBAR: IMAGE */
  816.  
  817. /*SIDEBAR: TITLE*/
  818.  
  819. .subtitle {
  820. margin-top:10px;
  821. font-family:'Poppins', sans-serif;
  822. font-size:12px;
  823. vertical-align:middle;
  824. color:{color:Subtitle};
  825. border-bottom:0px solid {color:Borders};
  826. }
  827.  
  828. /*END OF SIDEBAR: TITLE*/
  829.  
  830. /*SIDEBAR: DESCRIPTION */
  831.  
  832. .description {
  833. color:{color:text}!important;
  834. margin-bottom:20px;
  835. text-align:left;
  836. margin-top:10px;
  837. font-size:13px;
  838. border:0.5px solid {color:Borders};
  839. padding:10px;
  840. }
  841.  
  842. /*END OF SIDEBAR: DESCRIPTION */
  843.  
  844. /*SIDEBAR: NAVIGATION */
  845.  
  846. .sidenav {
  847. overflow:visible;
  848. margin-top:0px;
  849. padding:10px;
  850. margin-left:-10px;
  851. backdrop-filter: blur(16px) saturate(180%);
  852. -webkit-backdrop-filter: blur(16px) saturate(180%);
  853. background-color:{color:Sidenav};
  854. border: 1px solid rgba(209, 213, 219, 0.3);
  855. border-radius:0px 0px 12px 12px;
  856. width:100%;
  857. height:50px;
  858. }
  859.  
  860. .sidenav a {
  861. color:{color:links};
  862. margin-bottom:10px;
  863. display:inline-block;
  864. vertical-align:middle;
  865. margin-right:5px;
  866. font-weight:600;
  867. padding:10px;
  868. border-radius:100%;
  869. color:#fff;
  870.  
  871. }
  872.  
  873. .sidenav a:hover {
  874. color:{color:Sidelink Hover Button};
  875. }
  876.  
  877. .sidenav a::before {
  878. content: "";
  879. position: absolute;
  880. display: block;
  881. width: 100%;
  882. height: 0px;
  883. bottom: 0;
  884. left: 0;
  885. background-image:linear-gradient(to right, {color:gradient 2}, {color:gradient 3});
  886. transform: scaleX(0);
  887. transition: transform 0.3s ease;
  888. }
  889.  
  890. .sidenav a:hover::before {
  891. transform: scaleX(1);
  892. }
  893.  
  894.  
  895. /*---------------- SEARCH BOX ---------------------*/
  896.  
  897. /* POP UP BOX */
  898.  
  899. .click { cursor:help } /* for question mark cursor on hover */
  900.  
  901. #pop {
  902. width:100%;
  903. height:100%;
  904. top:0;left:0;
  905. position:fixed;
  906. z-index:999;
  907. background:rgba(20,21,23,.9); /* background of popup. adjust the .9 for the opacity of the background (1 will be solid white, .5 will be semi transparent, etc.) */
  908. display:none;
  909. }
  910. .fade {
  911. top:0;
  912. left:0;
  913. position:fixed;
  914. z-index:1000;
  915. width:100%;
  916. height:100%;
  917. }
  918.  
  919. .popup {
  920. top:50%;
  921. left:50%;
  922. font-family:'Manrope', sans-serif;
  923. text-transform:lowercase;
  924. font-weight:400;
  925. color:{color:Text}!important;
  926. transform:translate(-50%,-50%);
  927. position:fixed;
  928. background:{color:posts}; /* background of popup box */
  929. padding:20px; /* padding of popup box */
  930. z-index:10000;
  931. width:600px!important;
  932. height:440px;/* width of popup */
  933. border:1px solid {color:Borders}; /* popup border */
  934. }
  935.  
  936. .popup a {
  937. background:none!important;
  938. padding:0px!important;
  939. color:{color:Links}!important;
  940. text-transform:none!important;
  941. }
  942.  
  943. /* SEARCH BOX */
  944.  
  945. #searchblock {
  946. position:fixed;
  947. top:0;
  948. left:0;
  949. right:0;
  950. margin-top:50px;
  951. margin-left:50px;
  952. margin-right:50px;
  953. height:0px;
  954. text-align:center;
  955. }
  956.  
  957. .typing, .typing::placeholder, #searchentries, #searchentries a, .enter {
  958. background-color:{color:posts};
  959. padding:5px;
  960. text-transform:uppercase;
  961. letter-spacing:0.5px;
  962. color:#999;
  963. font-size:12px;
  964. text-align:left;
  965. }
  966.  
  967. .typing, #searchentries {
  968. width:400px;
  969. }
  970.  
  971. .typing {
  972. margin-bottom:0px;
  973. outline:none;
  974. border:0px solid transparent;
  975. }
  976.  
  977. .typing::placeholder {
  978. padding:0px;!important;
  979. }
  980.  
  981. #searchentries {
  982. margin-top:10px;
  983. background-color:{color:posts};!important;
  984. }
  985.  
  986. #searchentries a {
  987. display:block;
  988. margin-bottom:5px;
  989. text-align:center!important;
  990. }
  991.  
  992. #searchentries a:hover {
  993. background-color:{color:posts};!important;
  994. }
  995.  
  996.  
  997. #searchentries a::before {
  998. content: "";
  999. position: absolute;
  1000. display: block;
  1001. width: 100%;
  1002. height: 0px!important;
  1003. bottom: 0;
  1004. left: 0;
  1005. background-image:linear-gradient(to right, {color:gradient 2}, {color:gradient 3});
  1006. transform: scaleX(0);
  1007. transition: transform 0.3s ease;
  1008. }
  1009.  
  1010. #searchentries a:hover::before {
  1011. transform: scaleX(1);
  1012. }
  1013.  
  1014. .enter {
  1015. margin-left:4px;
  1016. margin-bottom:0px;
  1017. outline:none;
  1018. border:0px solid transparent;
  1019. cursor:pointer;
  1020. }
  1021.  
  1022.  
  1023. /* SCROLL TO TOP */
  1024.  
  1025. .scrollToTop{
  1026. width:100px;
  1027. height:130px;
  1028. padding:10px;
  1029. text-align:center;
  1030. background: whiteSmoke;
  1031. font-weight: bold;
  1032. color: #444;
  1033. text-decoration: none;
  1034. position:fixed;
  1035. top:75px;
  1036. right:40px;
  1037. display:none;
  1038. background: url('arrow_up.png') no-repeat 0px 20px;
  1039. }
  1040. .scrollToTop:hover{
  1041. text-decoration:none;
  1042. }
  1043.  
  1044.  
  1045. /*END OF SIDEBAR: NAVIGATION */
  1046.  
  1047.  
  1048. /*END OF SIDEBAR SECTION */
  1049.  
  1050.  
  1051. /*-------------------------------------------------------------------------*/
  1052.  
  1053.  
  1054. /*POSTS SECTION */
  1055.  
  1056.  
  1057. /*POSTS: GENERAL */
  1058.  
  1059. .content {
  1060. margin:0px 0px;
  1061. }
  1062.  
  1063. .entry {
  1064. width:580px;
  1065. margin-bottom:150px;
  1066. padding:10px;
  1067. background-color:{color:Posts};
  1068. border-radius: 12px;
  1069. border: 1px solid rgba(209, 213, 219, 0.3);
  1070. }
  1071.  
  1072. .entry 700, b, strong {
  1073. color:{color:links};
  1074. }
  1075.  
  1076. .entry:last-child {
  1077. margin-bottom:0;
  1078. }
  1079.  
  1080. .post {
  1081. margin:0px 0px 0px 0px;
  1082. width:540px;
  1083. position:relative;
  1084. padding:20px;
  1085. }
  1086.  
  1087. .text:last-child, .text *:last-child {
  1088. margin-bottom:0px;
  1089. }
  1090.  
  1091. .vignette, #vignette {
  1092. opacity:0;
  1093. }
  1094.  
  1095. .lightbox-image, #tumblr_lightbox img {
  1096. box-shadow:none !important;
  1097. border-radius:0px !important;
  1098. max-width:none;
  1099. }
  1100. .tmblr-lightbox, #tumblr_lightbox {
  1101. background-color:rgba(255,255,255,.75) !important;
  1102. }
  1103.  
  1104. /*END OF POSTS: GENERAL */
  1105.  
  1106. /*POSTS: CAPTIONS */
  1107.  
  1108. .caption {
  1109. width:540px;
  1110. margin-top:10px;
  1111. padding:0px;
  1112. margin-bottom:0px;
  1113. border:0;
  1114. text-align:justify;
  1115. }
  1116.  
  1117. .caption blockquote {
  1118. max-width:540px;
  1119. font-weight:normal;
  1120. border:0;
  1121. margin:0px 0px 7px 0px;
  1122. padding:0;
  1123. }
  1124.  
  1125. .caption blockquote:last-child {
  1126. margin:0px;
  1127. }
  1128.  
  1129. .caption p {
  1130. padding:0;
  1131. margin:0;
  1132. }
  1133.  
  1134. .caps blockquote {
  1135. max-width:540px;
  1136. margin:10px 0px 10px 0px;
  1137. font-weight:normal;
  1138. border-left:1px solid {color:borders};
  1139. padding-left:10px;
  1140. padding-right:10px;
  1141. }
  1142.  
  1143. .caps a.tumblr_blog {
  1144. padding-bottom:0px;
  1145. border-bottom:0;
  1146. text-overflow:ellipsis;
  1147. vertical-align:middle;
  1148. font-weight: 600;
  1149. text-transform:lowercase;
  1150. color:{color:links}!important;
  1151. -webkit-transition:all 0.2s;
  1152. -moz-transition:all 0.2s;
  1153. -ms-transition:all 0.2s;
  1154. -o-transition:all 0.2s;
  1155. transition:all 0.2s;
  1156. margin-top:0px;
  1157. margin-bottom:0px;
  1158. line-height:16px!important;
  1159. }
  1160.  
  1161. .caps a.tumblr_blog:hover {
  1162. color:{color:links}!important;
  1163. text-decoration:none;
  1164. -webkit-transition:all 0.2s;
  1165. -moz-transition:all 0.2s;
  1166. -ms-transition:all 0.2s;
  1167. -o-transition:all 0.2s;
  1168. transition:all 0.2s;
  1169. }
  1170.  
  1171. .caps .ic{
  1172. width:18px;
  1173. height:18px;
  1174. margin-right:10px;
  1175. display:inline-block;
  1176. float:left;
  1177. background:transparent;
  1178. text-align:left;
  1179. padding:0;
  1180. margin-left:0;
  1181. margin-top:0;
  1182. }
  1183.  
  1184. .caps {
  1185. margin:0px 0px 0px 0px;
  1186. padding:0;
  1187. border-left:0;
  1188. }
  1189.  
  1190. .caps p {
  1191. margin:5px 0 5px 0;
  1192. font-weight:normal;
  1193. padding:0;
  1194. border-left:0;
  1195. }
  1196.  
  1197. .caps p:last-child {
  1198. margin:5px 0 0 0;
  1199. }
  1200.  
  1201. .caps b {
  1202. color:{color:links};
  1203. font-weight:400;
  1204. }
  1205.  
  1206. .caps hr {
  1207. margin:0;
  1208. border:0;
  1209. }
  1210.  
  1211. .caps img {
  1212. margin-top:10px;
  1213. max-width:100%;
  1214. display:inline-block;
  1215. }
  1216.  
  1217. /*END OF POSTS: CAPTIONS */
  1218.  
  1219. /*POSTS: ASKS */
  1220.  
  1221. .askerbg {
  1222. padding: 0px;
  1223. border-radius: 100px;
  1224.  
  1225. }
  1226.  
  1227.  
  1228. .askerbg img {
  1229. border-radius:100px!important;
  1230. width:50px!important;
  1231. }
  1232.  
  1233. .question {
  1234. width:auto;
  1235. font-family: 'Poppins', sans-serif;
  1236. margin-top: 10px;
  1237. margin-bottom:20px;
  1238. color:{color:text ask};
  1239. padding: 10px;
  1240. border-radius:1px 15px 15px 15px;
  1241. background:{color:Asks};
  1242. }
  1243.  
  1244. /*END OF POSTS: ASKS */
  1245.  
  1246. /*POSTS: STYLES */
  1247.  
  1248. .chat {
  1249. list-style-type:none;
  1250. margin-bottom:10px;
  1251. }
  1252.  
  1253. .chat .label {
  1254. line-height:1.5em;
  1255. }
  1256.  
  1257. .quote {
  1258. margin-bottom:5px;
  1259. }
  1260.  
  1261. .source {
  1262. }
  1263.  
  1264. .media {
  1265. position:relative;
  1266. display:inline-block;
  1267. width:100%;
  1268. }
  1269.  
  1270. .media img {
  1271. position:relative;
  1272. display:inline-block;
  1273. width:540px!important;
  1274. }
  1275.  
  1276. .media a::before {
  1277. content: "";
  1278. position: absolute;
  1279. display: block;
  1280. width: 100%;
  1281. height: 0px!important;
  1282. bottom: 0;
  1283. left: 0;
  1284. background-image:linear-gradient(to right, {color:gradient 2}, {color:gradient 3});
  1285. transform: scaleX(0);
  1286. transition: transform 0.3s ease;
  1287. }
  1288.  
  1289. .media a:hover::before {
  1290. transform: scaleX(1);
  1291. }
  1292.  
  1293.  
  1294. .audio {
  1295. text-align:center;
  1296. display:flex;
  1297. border-bottom:1px solid {color:Borders};
  1298. align-items: center;
  1299. position: relative;
  1300. }
  1301.  
  1302. .album-art {
  1303. z-index: 1;
  1304. display: inline-block;
  1305. vertical-align: middle;
  1306. float: left;
  1307. width: 8rem;
  1308. height: 8rem;
  1309. }
  1310.  
  1311. .button {
  1312. width:30px;
  1313. height:30px;
  1314. display:inline-block;
  1315. vertical-align:middle;
  1316. overflow: hidden;
  1317. position: relative;
  1318. z-index: 2;
  1319. margin: 0.7rem;
  1320. display:hidden;
  1321. }
  1322.  
  1323. .audiobox {
  1324. background-color: #f2f2f2;
  1325. z-index: 3;
  1326. position: absolute;
  1327. margin: 2.8rem;
  1328. border-radius: 50%;
  1329. backdrop-filter: blur(3px) saturate(179%);
  1330. -webkit-backdrop-filter: blur(3px) saturate(179%);
  1331. background-color: rgba(229, 228, 255, 0.04);
  1332. border-radius: 12px;
  1333. border: 1px solid rgba(209, 213, 219, 0.3);
  1334. }
  1335.  
  1336. .audio_trackinfo {
  1337. width:8rem;
  1338. height:6rem;
  1339. display: flex;
  1340. flex: 4;
  1341. align-items: flex-start;
  1342. justify-content: center;
  1343. flex-direction: column;
  1344. padding: 0.5rem;
  1345. padding: 1rem;
  1346. color:{color:Text};
  1347. }
  1348.  
  1349. .audio_trackname {
  1350. font-weight:600;
  1351. font-family:'Poppins', sans-serif;
  1352. color:{color:Text};
  1353. text-align:center;
  1354. font-size:1.6rem;
  1355. }
  1356.  
  1357. .spotify_audio_player {
  1358. max-width: 100%;
  1359. height: 80px;
  1360. }
  1361.  
  1362. /*END OF POSTS: STYLES */
  1363.  
  1364. /*END OF POSTS SECTION /*
  1365.  
  1366.  
  1367. /*-------------------------------------------------------------------------*/
  1368.  
  1369.  
  1370. /*POST INFO SECTION */
  1371.  
  1372.  
  1373. /*POST INFO: BOTTOM */
  1374.  
  1375. .postinfo {
  1376. margin:65px 0 0 0;
  1377. margin:20px 0px 0px 0px;
  1378. text-align:left;
  1379. color:#fff;
  1380. background:transparent;
  1381. line-height:1.5em!important;
  1382. background-color:{color:Sidenav};
  1383. border: 1px solid rgba(209, 213, 219, 0.3);
  1384. border-radius:0px 0px 12px 12px;
  1385. width:100%;
  1386. height:auto;
  1387. padding:10px;
  1388. margin-left:-10px;
  1389. margin-bottom:-10px;
  1390.  
  1391. }
  1392.  
  1393. .postinfo b {
  1394. }
  1395.  
  1396. .postinfo a {
  1397. display:inline-block;
  1398. height:14px;
  1399. line-height:10px;
  1400. color:#fff;
  1401. }
  1402.  
  1403.  
  1404. .postinfo i {
  1405. font-style: normal;
  1406. }
  1407.  
  1408. .postinfo a:hover {
  1409. color:#000;
  1410. }
  1411.  
  1412. .postinfo p {
  1413. margin-top:-10px!important;
  1414. }
  1415.  
  1416. svg {
  1417. width:12px;
  1418. height:auto;
  1419. opacity:.7;
  1420. padding:1px;
  1421. display:block;
  1422. color:#fff;
  1423. overflow:visible;
  1424. margin-left:5px;
  1425. margin-top:-3px;
  1426. background:transparent;
  1427. }
  1428.  
  1429. .controls a {
  1430. position:relative;
  1431. display:inline-block;
  1432. overflow:hidden;
  1433. padding:5px;
  1434. width:18px;
  1435. height:12px;
  1436. color:#333;
  1437. margin-left:-7px;
  1438. background:transparent;
  1439. }
  1440.  
  1441. .controls a::before {
  1442. content: "";
  1443. position: absolute;
  1444. display: block;
  1445. width: 100%;
  1446. height: 0px;
  1447. bottom: 0;
  1448. left: 0;
  1449. background-image:linear-gradient(to right, {color:gradient 2}, {color:gradient 3});
  1450. transform: scaleX(0);
  1451. transition: transform 0.3s ease;
  1452. }
  1453.  
  1454. .controls a:hover::before {
  1455. transform: scaleX(1);
  1456. }
  1457.  
  1458.  
  1459. .controls .reblog {
  1460. opacity:0.93;
  1461. background:transparent;
  1462. }
  1463.  
  1464. .controls .reblog svg {
  1465. width:16px;
  1466. background:transparent;
  1467. }
  1468.  
  1469. .controls .like .liked + svg {
  1470. opacity:1;
  1471. background:transparent;
  1472. }
  1473.  
  1474. .controls .like .liked + svg path {
  1475. fill:#ffaaaa;
  1476. }
  1477.  
  1478. .controls .like .like_button {
  1479. position:relative;
  1480. background:transparent;
  1481. }
  1482.  
  1483. .controls .like .like_button iframe {
  1484. position:absolute;
  1485. top:0;
  1486. left:0;
  1487. bottom:0;
  1488. right:0;
  1489. z-index:2;
  1490. opacity:0.000001;
  1491. }
  1492.  
  1493. .tags {
  1494. color:{color:links}!important;
  1495. word-break:break-word;
  1496. text-align:left;
  1497. text-transform:lowercase;
  1498. opacity:1;
  1499. -webkit-transition: all 0.7s ease;
  1500. transition: all 0.7s ease;
  1501. -moz-transition: all 0.7s ease;
  1502. -o-transition: all 0.7s ease;
  1503. text-align:justify!important;
  1504. }
  1505.  
  1506. .tags a {
  1507. font-style:none;
  1508. margin-right:2px;
  1509. margin-top:10px;
  1510. border-radius:4px;
  1511. text-transform:lowercase;
  1512. color:#fff;
  1513. }
  1514.  
  1515. .tags a:hover {
  1516. text-decoration:none;
  1517. color:#000;
  1518. }
  1519.  
  1520. /*END OF POST INFO: BOTTOM */
  1521.  
  1522. /*POST INFO: PERMALINK */
  1523.  
  1524. ol.notes {
  1525. list-style-type:none!important;
  1526. font-style:normal;
  1527. margin-top:-137px;
  1528. margin-left:0px;
  1529. width:580px;
  1530. }
  1531.  
  1532. li.note {
  1533. margin-left:30px;
  1534. padding:10px;
  1535. font-style:normal;
  1536. width:580px;
  1537. list-style-type:circle!important;
  1538. }
  1539.  
  1540. li.note:before {
  1541. content:"";
  1542. padding:0;
  1543. list-style-type:none!important;
  1544. }
  1545.  
  1546. .more_notes_link, .notes_loading {
  1547. float:center;
  1548. text-align:center!important;
  1549. text-transform:lowercase!important;
  1550. font-weight:400!important;
  1551. }
  1552.  
  1553. .notes img {
  1554. display:inline;
  1555. width:20px;
  1556. border-radius:100%;
  1557. margin-right:10px;
  1558. }
  1559.  
  1560. .notes {
  1561. background-color:{color:posts};
  1562. margin-right:0px;
  1563. margin-left:0px;
  1564. width:580px;
  1565. padding:10px;
  1566. margin-top:-60px;
  1567. border-radius:5px;
  1568. }
  1569.  
  1570. ol.notes li.note blockquote {
  1571. border:0;
  1572. padding:0px 0px;
  1573. margin:0px 0 0 0px;
  1574. list-style-type:none!important;
  1575. }
  1576.  
  1577. /*END OF POST INFO: PERMALINK */
  1578.  
  1579.  
  1580. /*END OF POST INFO SECTION */
  1581.  
  1582.  
  1583. /*-------------------------------------------------------------------------*/
  1584.  
  1585.  
  1586. /*PAGINATION SECTION */
  1587.  
  1588.  
  1589. /*PAGINATION: GENERAL */
  1590.  
  1591. .pagi {
  1592. margin-top:20px;
  1593. text-align:center;
  1594. font-size:14px;
  1595. margin-left:10px;
  1596. padding-top:20px;
  1597. width:540px;
  1598. }
  1599.  
  1600. .pagi a {
  1601. color:{color:links};
  1602. }
  1603.  
  1604. .pagi a:hover {
  1605. color:{color:hover};
  1606. }
  1607.  
  1608. /*END OF PAGINATION: GENERAL */
  1609.  
  1610.  
  1611. /*END OF PAGINATION SECTION */
  1612.  
  1613. /* MASONRY NAVIGATION CSS PART */
  1614. .masonry-navigation {
  1615. width: 100%;
  1616. border-bottom: 1px solid #e2e2e2;
  1617. margin-bottom:15px;
  1618. }
  1619.  
  1620. .masonry-navigation:last-child {
  1621. border:none;
  1622. }
  1623.  
  1624. .masonry-navigation-item.one-column {
  1625. width: 100%;
  1626. padding: 0 5px;
  1627. margin-bottom: 10px;
  1628. }
  1629.  
  1630. .masonry-navigation-item.one-column ul {
  1631. display: flex;
  1632. flex-wrap: wrap;
  1633. margin: 0;
  1634. padding: 0;
  1635. }
  1636.  
  1637. /* if you have any problem with one colum lists (ul li) you edit here */
  1638. .masonry-navigation-item.one-column ul li {
  1639. margin: 4px 15px;
  1640. padding: 0;
  1641. }
  1642.  
  1643. /* if they don't display two columns correctly, try to decrease the value on width: 240px */
  1644. .masonry-navigation-item.two-columns {
  1645. width: 240px;
  1646. padding: 0 5px;
  1647. margin-bottom: 10px;
  1648. }
  1649.  
  1650. /* if they don't display three columns correctly, try to decrease the value on width: 160px */
  1651. .masonry-navigation-item.three-columns {
  1652. width: 160px;
  1653. padding: 0 5px;
  1654. margin-bottom: 10px;
  1655. }
  1656.  
  1657. /* edit height: 215px to adjust the box height if you add the class scroll in the html */
  1658. .masonry-navigation-item.scroll {
  1659. height:215px;
  1660. overflow-y: scroll;
  1661. }
  1662.  
  1663.  
  1664. /* ----------- NOT FOUND PAGE ---------*/
  1665.  
  1666. .wrapper_notfound {
  1667. position: fixed;
  1668. visibility:hidden;
  1669. left: 0px;
  1670. top: 0px;
  1671. width: 100%;
  1672. height: 100%;
  1673. background-image:linear-gradient(to right, {color:Not Found Gradient BG 1}, {color:Not Found Gradient BG 2});
  1674. z-index: 999999999999;
  1675. }
  1676.  
  1677. .actual_notfound {
  1678. position: absolute;
  1679. color:{color:Not Found Text};
  1680. left:50%;
  1681. top:50%;
  1682. font-family:'Poppins', sans-serif;
  1683. transform:translate(-50%, -50%);
  1684. width:calc(600px + 0.25vw);
  1685. font-size:calc(22px + 0.25vw);
  1686. line-height:170%;
  1687. text-align: center;
  1688. }
  1689.  
  1690. .actual_notfound a {
  1691. color:{color:Not Found Link};
  1692. text-decoration: none;
  1693. }
  1694.  
  1695. .actual_notfound::selection {
  1696. color:{color:select background};
  1697. }
  1698.  
  1699. /*-----*/
  1700.  
  1701.  
  1702. /*-------------------------------------------------------------------------*/
  1703.  
  1704. #credit {
  1705. position: fixed;
  1706. bottom: 20px;
  1707. right: 20px;
  1708. font-size: 15px;
  1709. color:{color:text};
  1710. border:1px solid {color:Borders};
  1711. border-radius:3px;
  1712. padding:10px;
  1713. background-image:linear-gradient(to right, {color:gradient 2}, {color:gradient 3});
  1714. }
  1715.  
  1716. </style></head>
  1717.  
  1718. <body>
  1719.  
  1720. <script>
  1721. document.body.classList.add('fade-out');
  1722. window.addEventListener('DOMContentLoaded', () => {
  1723. document.body.classList.remove('fade-out');
  1724. });
  1725. </script>
  1726.  
  1727.  
  1728. <div id="pop"> <div class="fade"></div>
  1729. <div class="popup">
  1730. <div id="searchblock">
  1731.  
  1732. <form class="find" action="/search" method="get">
  1733.  
  1734. <a class="expand"><input class="typing" type="text" name="q" value="{SearchQuery}" placeholder="looking for something?" autocomplete="off"/></a>
  1735.  
  1736. <input class="enter" type="submit" value="search"/>
  1737.  
  1738. </form>
  1739.  
  1740. <div id="searchentries">
  1741. <a href="/tagged/">entry name</a><br>
  1742. <a href="/tagged/">entry name</a><br>
  1743. <a href="/tagged/">entry name</a><br>
  1744. <a href="/tagged/">entry name</a><br>
  1745. <a href="/tagged/">entry name</a><br>
  1746. <a href="/tagged/">entry name</a>
  1747.  
  1748. </div><!--END 'searchentries' div-->
  1749. </div><!--END 'searchblock' div-->
  1750. </div>
  1751. </div>
  1752.  
  1753.  
  1754.  
  1755. <!--- UPDATE TABS--->
  1756.  
  1757. <div id="update-icon">
  1758. <a title="updates"><i class="la la-plus"></i></a>
  1759. <div id="update-wrapper"><div id="update-content">
  1760. <div id="update-box">
  1761. <div class="update-title">title here</div>
  1762. <p><li><i>update.</i></p>
  1763. <a href="https://mercurythms.tumblr.com/" style="font-size:10px">cr</a>.
  1764. </div>
  1765. <div id="update-arrow"></div>
  1766. </div></div></div>
  1767.  
  1768. <!-- NAVBAR -->
  1769.  
  1770. <nav>
  1771. <div class="nav-bar">
  1772. <i class='bx bx-menu sidebarOpen' ></i>
  1773.  
  1774. <span class="logo navLogo"><a href="/">{Title}</a></span>
  1775.  
  1776. <div class="menu">
  1777.  
  1778. <ul class="nav-links">
  1779. <li><a href="/"><i class="ph-house"></i></a></li>
  1780. <li><a href="/ask"><i class="ph-envelope"></i></a></li>
  1781. <li><a style="font-size:15px;cursor:pointer" onclick="openAbout()"><i class="ph-planet"></i></a></li>
  1782. <li><a href="{text:Link 2 Url}"><i class="ph-pencil-simple"></i></a></li>
  1783. <li><a href="{text:Link 3 Url}"><i class="ph-map-trifold"></i></a></li>
  1784. <li><a href="{text:Link 4 Url}"><i class="ph-code"></i></a></li>
  1785. </ul>
  1786. </div>
  1787.  
  1788. </div>
  1789. </nav>
  1790.  
  1791.  
  1792. <!-- ABOUT MENU -->
  1793.  
  1794. <div id="myabout" class="about">
  1795. <a href="javascript:void(0)" class="closebtn" onclick="closeAbout()"><i class="cp cp-cross" style="font-size:11px"></i> close</a>
  1796.  
  1797. <center>
  1798. <img src="{PortraitURL-128}" class="about-icon">
  1799. <a href="/"><h3 style="font-size:15px; text-transform:uppercase;">{Title}</h3></a>
  1800. <h4>@{Name} / {name}.tumblr.com</h4>
  1801. </center>
  1802.  
  1803. <div class="profile">
  1804. <div class="profile-row">
  1805. <div class="profile-info">
  1806. <div class="profile-title"><i class="cp cp-user"></i> name.</div>
  1807. <div class="profile-description">{text:Name}</div>
  1808. </div> <!-- this closes the profile-info -->
  1809. <div class="profile-info">
  1810. <div class="profile-title"><i class="cp cp-target-o"></i> tracked tag.</div>
  1811. <div class="profile-description">{text:Tracked Tag}</div>
  1812. </div> <!-- this closes the profile-info -->
  1813. </div> <!-- this closes the profile-row -->
  1814. <div class="profile-row">
  1815. <div class="profile-info">
  1816. <div class="profile-title"><i class="cp cp-balloons"></i> age.</div>
  1817. <div class="profile-description">{text:Age}</div>
  1818. </div> <!-- this closes the profile-info -->
  1819. <div class="profile-info">
  1820. <div class="profile-title"><i class="cp cp-stars"></i> pronouns.</div>
  1821. <div class="profile-description">{text:Pronouns}</div>
  1822. </div> <!-- this closes the profile-info -->
  1823. </div> <!-- this closes the profile-row -->
  1824. <div class="profile-row">
  1825. <div class="profile-info">
  1826. <div class="profile-title"><i class="cp cp-rainbow"></i> sexuality.</div>
  1827. <div class="profile-description">{text:Sexuality}</div>
  1828. </div> <!-- this closes the profile-info -->
  1829. <div class="profile-info">
  1830. <div class="profile-title"><i class="cp cp-location"></i> country.</div>
  1831. <div class="profile-description">{text:Country}</div>
  1832. </div> <!-- this closes the profile-info -->
  1833. </div> <!-- this closes the profile-row -->
  1834. <div class="profile-row">
  1835. <div class="profile-info">
  1836. <div class="profile-title"><i class="cp cp-earth"></i> race/ethnicity.</div>
  1837. <div class="profile-description">{text:Race Ethnicity}</div>
  1838. </div> <!-- this closes the profile-info -->
  1839. <div class="profile-info">
  1840. <div class="profile-title"><i class="cp cp-z-gemini"></i> zodiac.</div>
  1841. <div class="profile-description">{text:Zodiac}</div>
  1842. </div> <!-- this closes the profile-info -->
  1843. </div> <!-- this closes the profile-row -->
  1844. <div class="profile-row">
  1845. <div class="profile-info">
  1846. <div class="profile-title"><i class="cp cp-sunflower"></i> About me.</div>
  1847. <div class="profile-description">You can write whatever you want about yourself here! You can add links, <b>bolded texts</b>, <i>italics</i>, <strike>strike text</strike> & etc.
  1848.  
  1849. <p>You can also start a new paragraph!</p>
  1850. </div>
  1851. </div> <!-- this closes the profile-info -->
  1852. </div> <!-- this closes the profile-row -->
  1853. <div class="profile-row">
  1854. <div class="profile-info">
  1855. <div class="profile-title"><i class="cp cp-like"></i> likes </div>
  1856. <div class="profile-description">List here the things you like!
  1857.  
  1858. </div>
  1859. </div> <!-- this closes the profile-info -->
  1860. <div class="profile-info">
  1861. <div class="profile-title"><i class="cp cp-forbidden"></i> dislikes</div>
  1862. <div class="profile-description">List here the things you don't like! </div>
  1863. </div> <!-- this closes the profile-info -->
  1864. </div> <!-- this closes the profile-row -->
  1865. </div> <!-- this closes the profile -->
  1866.  
  1867. <center><h1>Social Media</h1></center>
  1868. <div class="profile">
  1869. <div class="profile-row">
  1870. <div class="profile-info">
  1871.  
  1872. <div class="social-wrap">
  1873.  
  1874. <a href="https://twitter.com/" title="twitter"><i class="ph-twitter-logo" style="color:#fff;"></i></a>
  1875.  
  1876. <a href="https://instagram.com/" title="instagram"><i class="ph-instagram-logo" style="color:#fff;"></i></a>
  1877.  
  1878. <a href="https://open.spotify.com/user/" title="spotify"><i class="ph-spotify-logo" style="color:#fff;"></i></a>
  1879.  
  1880. <a href="https://www.youtube.com/channel/" title="youtube"><i class="ph-youtube-logo" style="color:#fff;"></i></a>
  1881.  
  1882. <a href="https://discord.com/users/" title="discord"><i class="ph-discord-logo" style="color:#fff;"></i></a>
  1883.  
  1884. <a href="https://ko-fi.com/" title="ko-fi"><i class="ph-coffee" style="color:#fff;"></i></a>
  1885.  
  1886. <a href="https://www.paypal.com/paypalme/" title="paypal me"><i class="ph-wallet" style="color:#fff;"></i></a>
  1887.  
  1888. <a href="https://archiveofourown.org/users/" title="ao3"><i class="ph-bookmark-simple" style="color:#fff;"></i></a>
  1889.  
  1890. <a href="https://letterboxd.com/" title="letterboxd"><i class="ph-dots-three-outline" style="color:#fff;"></i></a>
  1891.  
  1892.  
  1893. <a href="https://br.pinterest.com/" title="pinterest"><i class="ph-pinterest-logo" style="color:#fff;"></i></a>
  1894.  
  1895. </div>
  1896.  
  1897. </div> <!-- this closes the profile-info -->
  1898. </div> <!-- this closes the profile-row -->
  1899. </div> <!-- this closes the profile -->
  1900.  
  1901. <h1>Tags</h1>
  1902. <div class="profile">
  1903. <div class="profile-row">
  1904. <div class="profile-info">
  1905. <div class="profile-title"><i class="cp cp-pencil"></i> tags.</div>
  1906. <div class="profile-description">
  1907.  
  1908. <li><a href="/tagged/">tag name</a></li> |
  1909. <li><a href="/tagged/">tag name</a></li> |
  1910. <li><a href="/tagged/">tag name</a></li> |
  1911. <li><a href="/tagged/">tag name</a></li> |
  1912. <li><a href="/tagged/">tag name</a></li> |
  1913. <li><a href="/tagged/">tag name</a></li>
  1914.  
  1915. </div>
  1916. </div> <!-- this closes the profile-info -->
  1917.  
  1918. <div class="profile-info">
  1919. <div class="profile-title"><i class="cp cp-tv"></i> more tags.</div>
  1920. <div class="profile-description">
  1921.  
  1922. <li><a href="/tagged/">tag name</a></li> |
  1923. <li><a href="/tagged/">tag name</a></li> |
  1924. <li><a href="/tagged/">tag name</a></li> |
  1925. <li><a href="/tagged/">tag name</a></li> |
  1926. <li><a href="/tagged/">tag name</a></li> |
  1927. <li><a href="/tagged/">tag name</a></li> |
  1928. <li><a href="/tagged/">tag name</a></li> |
  1929. <li><a href="/tagged/">tag name</a></li>
  1930. </div>
  1931. </div> <!-- this closes the profile-info -->
  1932. </div> <!-- this closes the profile-row -->
  1933. </div>
  1934. <h1><i class="cp cp-moon"></i></h1>
  1935. <div class="profile">
  1936. <div class="profile-row">
  1937. <div class="profile-info">
  1938. <center>
  1939. <li>© <a href="https://geminicodes.tumblr.com/" style="display:inline-block">bru</a>, 2022. </li>
  1940. <li>all rights reserved.</li>
  1941. <li>powered by tumblr.</li>
  1942. <li>theme by bru.</li>
  1943. </center>
  1944. </div> <!-- this closes the profile-info -->
  1945. </div> <!-- this closes the profile-row -->
  1946. </div> <!-- this closes the profile -->
  1947.  
  1948. <section>
  1949. <div class="about-info">
  1950.  
  1951. <div class="about-info">
  1952.  
  1953. <div class="about-title">Name</div>
  1954. <li>one</li>
  1955.  
  1956. <div class="about-title">Name</div>
  1957. <li>one</li>
  1958.  
  1959. <div class="about-title">Name</div>
  1960. <li>one</li>
  1961. <p>
  1962.  
  1963. <div class="about-title">Name</div>
  1964. <li>one</li>
  1965.  
  1966. <div class="about-title">Name</div>
  1967. <li>one</li>
  1968.  
  1969. <div class="about-title">Name</div>
  1970. <li>one</li>
  1971.  
  1972. </div>
  1973. </section>
  1974. </div>
  1975.  
  1976. <div class="main">
  1977. <div class="credit">
  1978.  
  1979. </div>
  1980.  
  1981. <div class="asidecontainer">
  1982. <aside>
  1983.  
  1984. {block:IfSidebarImage}
  1985. <img src="{image:sidebar image}">
  1986. {/block:IfSidebarImage}
  1987.  
  1988. <div class="subtitle">
  1989. <i class="ph-butterfly" style="vertical-align:middle; font-size:12px"></i> {text:subtitle}
  1990. <p>
  1991. </div>
  1992.  
  1993. <div class="description">
  1994. {text:Desktop Description}
  1995. </div>
  1996.  
  1997. <div class="sidenav">
  1998. <a href="https://tumblr.com/dashboard" title="Back to dash"><i class="ph-sign-out" style="font-size:14px; font-weight:700"></i></a>
  1999. <a href="https://tumblr.com/message/{Name}" title="DM me"><i class="ph-chats-circle" style="font-size:15px"></i></a>
  2000. <a href="{text:Pop Up}" title="Search this blog"><i class="ph-magnifying-glass" style="font-size:14px; font-weight:700"></i></a>
  2001. <a href="#" class="Scroll To Top" title="Scroll To Top"><i class="ph-arrow-line-up" style="font-size:14px; font-weight:700"></i></a>
  2002.  
  2003. </div>
  2004.  
  2005. </aside>
  2006.  
  2007. </div>
  2008.  
  2009. <div class="content">
  2010.  
  2011. {block:Posts}
  2012. <article class="entry {block:Photo}ph{/block:Photo}{block:Photoset}ph{/block:Photoset}" id="{PostID}">
  2013. <section class="post" id="{PostID}">
  2014.  
  2015. <center>{block:PinnedPostLabel}<a href="{Permalink}" class="pinned-post" style="display:inline-block; vertical-align:middle; text-transform:uppercase; font-weight:bold;margin-bottom:10px"><i class="fas fa-thumbtack" style="font-size:9px;"></i> pinned post </a>{/block:PinnedPostLabel}</center>
  2016.  
  2017.  
  2018. {block:Audio}
  2019. <div class="type-audio post">
  2020. <div class="audio">
  2021. <div class="audiobox">
  2022. <div class="button">
  2023. {block:AudioPlayer}{AudioPlayer}{/block:AudioPlayer}
  2024. </div>
  2025. </div>
  2026. <div class="album-art">
  2027. {block:AlbumArt}
  2028. <img src="{AlbumArtURL}" />
  2029. {/block:AlbumArt}
  2030. </div>
  2031.  
  2032. {block:TrackName}
  2033. <div class="audio_trackinfo">
  2034. <div class="audio_trackname">{TrackName}</div>
  2035. {block:Artist}
  2036. <div class="audio_artist">{Artist}</div>{/block:Artist}
  2037. {block:Album}<div class="audio_album">{Album}</div>{/block:Album}
  2038. </div>
  2039. {/block:TrackName}
  2040. </div>
  2041. {/block:Audio}
  2042.  
  2043. {block:Photo}
  2044. <div class="media" id="{PostID}">
  2045. <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>
  2046. </div>
  2047. {/block:Photo}
  2048.  
  2049. {block:Photoset}
  2050. <div class="media photoset" id="{PostID}">
  2051. <div class="photo-slideshow" id="photoset_{PostID}" data-layout="{PhotosetLayout}">
  2052.  
  2053. {block:Photos}
  2054. <div class="photo-data">
  2055. <div class="pxu-photo">
  2056. <img src="{PhotoURL-500}" width="{PhotoWidth-500}" height="{PhotoHeight-500}" data-highres="{PhotoURL-HighRes}" data-width="{PhotoWidth-HighRes}" data-height="{PhotoHeight-HighRes}"></div>
  2057. <a class="tumblr-box" rel="post-{PostID}" href="{PhotoURL-HighRes}"></a></div>
  2058. {/block:Photos}
  2059. </div></div>
  2060. {/block:Photoset}
  2061.  
  2062. {block:Video}
  2063. <div class="media video" id="{PostID}">{Video-500}</div>
  2064. {/block:Video}
  2065.  
  2066. {block:Answer}
  2067. <div class="ask" id="{PostID}">
  2068. <table style="padding-bottom:5px;margin-bottom:5px;">
  2069. <tr>
  2070. <td class="askerbg" style="vertical-align:top;padding-right:10px;"><img src="{AskerPortraitURL-64}"></td><td style="vertical-align:top;"><strong>{Asker}</strong> asked at {12HourWithZero}:{Minutes}{AmPm}:
  2071. <div class="question">{Question}</div>
  2072. </td>
  2073. </tr>
  2074. </table>
  2075. {Answer}
  2076. {/block:Answer}
  2077.  
  2078. {block:Chat}
  2079. {block:Title}
  2080. <h1>{Title}</h1>
  2081. {/block:Title}
  2082.  
  2083. <ul class="chat text">
  2084. {block:Lines}
  2085. <li class="line">
  2086. {block:Label}
  2087. <span class="label">{Label}&nbsp; </span>
  2088. {/block:Label}
  2089. {Line}</li>
  2090. {/block:Lines}</ul>
  2091. {/block:Chat}
  2092.  
  2093. {block:Link}
  2094. <h1>
  2095. <a href="{URL}">{Name}</a></h1>
  2096. {block:Description}
  2097. <div class="caption">{Description}</div>
  2098. {/block:Description}
  2099. {/block:Link}
  2100.  
  2101. {block:Quote}
  2102. <div class="quote" id="{PostID}">{Quote}</div>
  2103. {block:Source}
  2104. <div class="source">— {Source}</div>
  2105. {/block:Source}
  2106. {/block:Quote}
  2107.  
  2108. {block:Text}
  2109. {block:Title}
  2110. <h1>{Title}</h1>
  2111. {/block:Title}
  2112. {block:Body}
  2113. <div class="caption">{Body}</div>
  2114. {/block:Body}
  2115. {/block:Text}
  2116.  
  2117. {block:Caption}
  2118. <div class="caption" id="{PostID}">{Caption}</div>
  2119. {/block:Caption}
  2120.  
  2121. </section>
  2122.  
  2123. {block:Date}
  2124. <div class="postinfo">
  2125.  
  2126. <a href="{Permalink}">{DayOfMonth}/{MonthNumberWithZero}/{ShortYear}</a>
  2127. {block:NoteCount}
  2128. <i class="ph-activity"></i> <a href="{Permalink}">{NoteCountWithLabel}</a>
  2129. {/block:NoteCount}
  2130.  
  2131. <span style="float:right;"><span class="controls"><a href="{ReblogURL}" target="_blank" class="reblog"> <svg xmlns="https://www.w3.org/2000/svg" viewBox="0 0 640 512"><path fill="currentColor" d="M629.657 343.598L528.971 444.284c-9.373 9.372-24.568 9.372-33.941 0L394.343 343.598c-9.373-9.373-9.373-24.569 0-33.941l10.823-10.823c9.562-9.562 25.133-9.34 34.419.492L480 342.118V160H292.451a24.005 24.005 0 0 1-16.971-7.029l-16-16C244.361 121.851 255.069 96 276.451 96H520c13.255 0 24 10.745 24 24v222.118l40.416-42.792c9.285-9.831 24.856-10.054 34.419-.492l10.823 10.823c9.372 9.372 9.372 24.569-.001 33.941zm-265.138 15.431A23.999 23.999 0 0 0 347.548 352H160V169.881l40.416 42.792c9.286 9.831 24.856 10.054 34.419.491l10.822-10.822c9.373-9.373 9.373-24.569 0-33.941L144.971 67.716c-9.373-9.373-24.569-9.373-33.941 0L10.343 168.402c-9.373 9.373-9.373 24.569 0 33.941l10.822 10.822c9.562 9.562 25.133 9.34 34.419-.491L96 169.881V392c0 13.255 10.745 24 24 24h243.549c21.382 0 32.09-25.851 16.971-40.971l-16.001-16z"></path></svg></a>
  2132.  
  2133. <a href="#" class="like">{LikeButton} <svg xmlns="https://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="currentColor" d="M462.3 62.6C407.5 15.9 326 24.3 275.7 76.2L256 96.5l-19.7-20.3C186.1 24.3 104.5 15.9 49.7 62.6c-62.8 53.6-66.1 149.8-9.9 207.9l193.5 199.8c12.5 12.9 32.8 12.9 45.3 0l193.5-199.8c56.3-58.1 53-154.3-9.8-207.9z"></path></svg></a></span></span>
  2134.  
  2135. {block:HasTags}
  2136. <div class="tags">
  2137. {block:Tags}
  2138. <a href="{TagURL}">#{Tag}</a>
  2139. {/block:Tags}
  2140. </div>
  2141. {/block:HasTags}
  2142.  
  2143. </div>
  2144. {/block:Date}
  2145.  
  2146. </article>
  2147.  
  2148. <!--- TUMBLR CONTROLS -->
  2149.  
  2150.  
  2151. <div title="Tumblr Controls" class="controls-button"><i class="ph-gear" style="font-size:20px"></i></div>
  2152.  
  2153.  
  2154.  
  2155.  
  2156. {block:PostNotes} {PostNotes} {/block:PostNotes} {/block:Posts} <!-- {block:ContentSource}{SourceURL}{/block:ContentSource}{block:RebloggedFrom}{ReblogRootURL}{ReblogParentURL}{/block:RebloggedFrom} --> </div>
  2157.  
  2158. {block:Pagination}
  2159. <div class="pagi">
  2160. {block:PreviousPage}
  2161. <a href="{PreviousPage}" title="previous page">previous</a> /
  2162. {/block:PreviousPage}
  2163. {block:NextPage}
  2164. <a href="{NextPage}" title="next page">next</a>
  2165. {/block:NextPage}
  2166. </div>
  2167. {/block:Pagination}
  2168. </div>
  2169.  
  2170. <!----- CREDIT do not remove. ----->
  2171.  
  2172. <a href="https://geminicodes.tumblr.com" title="by bru" id="credit"><i class='bx bx-moon' ></i></a>
  2173.  
  2174.  
  2175.  
  2176. <!--- NOT FOUND PAGE -->
  2177.  
  2178. <div class="wrapper_notfound">
  2179. <div class="actual_notfound">
  2180. <h1><i class="ph-prohibit-bold" style="display:inline-block; vertical-align:middle"></i> not found!</h1>
  2181. sorry! the url you requested could not be found :(
  2182. <a href="/">try again?</a>
  2183. </div>
  2184. </div>
  2185.  
  2186.  
  2187.  
  2188. <!-- SCRIPTS -->
  2189.  
  2190.  
  2191. <script src="https://cdnjs.cloudflare.com/ajax/libs/smoothscroll/1.4.1/SmoothScroll.min.js"></script>
  2192.  
  2193. <script>feather.replace();</script>
  2194.  
  2195. <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  2196.  
  2197.  
  2198. <!-- SEARCH ENTRIES -->
  2199.  
  2200. <script>
  2201. $(document).ready(function(){
  2202. $('.expand').click(function(list){
  2203. list.stopPropagation();
  2204. $("#searchentries").slideToggle('slow');
  2205. });
  2206. });
  2207.  
  2208. $(document).click(function(outside){
  2209. var box = $('#searchentries');
  2210. if(!box.is(outside.target) && box.has(outside.target).length === 0){
  2211. $('#searchentries').slideUp('slow');
  2212. }
  2213. });
  2214. </script>
  2215. <!--- TUMBLR CONTROLS -->
  2216.  
  2217. <script src=“//ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js”></script>
  2218.  
  2219. <script>
  2220. $('.controls-button').click(function(){
  2221. $('body').toggleClass('controls-click');
  2222. });
  2223. </script>
  2224.  
  2225. <!-- CAPTIONS -->
  2226.  
  2227. <script src="https://static.tumblr.com/wgg6svp/I8Yobwo15/unnest.min.js"></script>
  2228.  
  2229. <script> $('article').unnest({ yourCaption: ".caption", wrapName: ".caps", newCaptionUsername: true, originalPostCaptionUsername: false, tumblrAvatars: false, tumblrAvatarClass: ".ic", usernameColon: false }); </script>
  2230.  
  2231. <script src="//static.tumblr.com/fwgzvyf/l6jnyutne/shythemes.vr.js"></script>
  2232.  
  2233. <link href="https://static.tumblr.com/qudkd6d/OcDnl99gb/style.css" rel="stylesheet" type="text/css"/>
  2234.  
  2235. <script src="https://static.tumblr.com/yxfeliq/hHwojmt8m/bctphotoset.min.js"></script>
  2236.  
  2237. <script> $(document).ready(function(){ $('.photo-slideshow').pxuPhotoset({ lightbox: true, rounded: 'corners', gutter: '4px', borderRadius: '0px', photoset: '.photo-slideshow', photoWrap: '.photo-data', photo: '.pxu-photo' }); }); </script>
  2238.  
  2239.  
  2240. <script src="https://unpkg.com/popper.js@1"></script>
  2241. <script src="https://unpkg.com/tippy.js@5/dist/tippy-bundle.iife.js"></script>
  2242. <link rel="stylesheet" href="https://unpkg.com/tippy.js@5/dist/svg-arrow.css" />
  2243.  
  2244.  
  2245. <!--- SCROLL TO TOP -->
  2246.  
  2247. <script>
  2248. $(document).ready(function(){
  2249.  
  2250. //Click event to scroll to top
  2251. $('.scrollToTop').click(function(){
  2252. $('html, body').animate({scrollTop : 0},800);
  2253. return false;
  2254. });
  2255.  
  2256. });
  2257. </script>
  2258.  
  2259.  
  2260. <!--- TOOLTIPS -->
  2261.  
  2262. <script>
  2263.  
  2264. tippy('a[title]', {
  2265. theme: 'gradient',
  2266. arrow: false,
  2267. zIndex: 9999999999,
  2268. maxWidth: 300,
  2269.  
  2270. content(reference) {
  2271. const title = reference.getAttribute('title');
  2272. reference.removeAttribute('title');
  2273. return title;
  2274. },
  2275. });
  2276.  
  2277. </script>
  2278.  
  2279.  
  2280. <!-- masonry navigation -->
  2281.  
  2282. <script type="text/javascript">
  2283. // masonry navigation
  2284. var elements = document.getElementsByClassName('masonry-navigation');
  2285. var msnry;
  2286. var nElements = elements.length;
  2287. for(var i = 0; i < nElements; i++){
  2288. msnry = new Masonry( elements[i], {
  2289. // columnWidth: 268,
  2290. gutter: 10,
  2291. itemSelector: '.masonry-navigation-item',
  2292. });
  2293. }
  2294. </script>
  2295.  
  2296. <script>
  2297. $(document).ready(function() {
  2298. if ($('p:contains("The URL you requested could not be found.")').html()) {
  2299. $(".wrapper_notfound").css( "visibility", "visible" );
  2300. $(".article_position").remove();
  2301. $('title').prepend( "Not Found | " ); }
  2302. });
  2303. </script>
  2304.  
  2305. <script>
  2306. /* Set the width of the side navigation to 250px and the left margin of the page content to 250px and add a black background color to body */
  2307. function openAbout() {
  2308. document.getElementById("myabout").style.width = "900px";
  2309. document.getElementById(".main").style.marginLeft = "250px";
  2310. document.body.style.backgroundColor = "rgba(0,0,0,0.4)";
  2311. }
  2312.  
  2313. /* Set the width of the side navigation to 0 and the left margin of the page content to 0, and the background color of body to white */
  2314. function closeAbout() {
  2315. document.getElementById("myabout").style.width = "0";
  2316. document.getElementById("#main").style.marginLeft = "0";
  2317. document.body.style.backgroundColor = "white";
  2318. }
  2319. </script>
  2320.  
  2321. <script>
  2322. $(document).ready(function(){
  2323. $("#update-icon").click(function(){
  2324. $("#update-wrapper").fadeToggle();
  2325. });
  2326. });
  2327. </script>
  2328.  
  2329. </body>
  2330.  
  2331. </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!