themesbyces

(Responsive) Theme — Calypso

Aug 28th, 2020 (edited)
2,343
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
CSS 37.90 KB | None | 0 0
  1. <!DOCTYPE html PUBLIC>
  2.  
  3. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  4.  
  5. <html>
  6.  
  7. <head>
  8.  
  9. <title>{Title}</title>
  10.  
  11. <link rel="shortcut icon" href="{Favicon}">
  12.  
  13. <!--
  14.  
  15. theme: calypso
  16. designed and coded by ghcstfaec
  17. see credits @ https://ghcstfaec.tumblr.com/credits
  18.  
  19. -->
  20.  
  21. <!-- Metadata -->
  22.  
  23. <meta name="color:Background" content="#f8f8f8"/>
  24. <meta name="color:Border" content="#d2d2d2"/>
  25. <meta name="color:Chat Even Background" content="#f0f0f0"/>
  26. <meta name="color:Header Background" content="#000000"/>
  27. <meta name="color:Left Background" content="#ffffff"/>
  28. <meta name="color:Link" content="#000000"/>
  29. <meta name="color:Link Hover" content="#cfcfcf"/>
  30. <meta name="color:Like" content="#ec6363"/>
  31. <meta name="color:Main Color" content="#ccbbcc"/>
  32. <meta name="color:Pin" content="#31a49d"/>
  33. <meta name="color:Post Background" content="#ffffff"/>
  34. <meta name="color:Scrollbar" content="#000000"/>
  35. <meta name="color:Text" content="#555555"/>
  36. <meta name="color:Tooltip Background" content="#000000"/>
  37. <meta name="color:Tooltip Color" content="#ffffff"/>
  38.  
  39. <meta name="select:Body Font" content="Karla" title="Karla"/>
  40. <meta name="select:Body Font" content="Montserrat" title="Montserrat"/>
  41. <meta name="select:Body Font" content="Muli" title="Muli"/>
  42. <meta name="select:Body Font" content="Open Sans" title="Open Sans"/>
  43. <meta name="select:Body Font" content="Poppins" title="Poppins"/>
  44. <meta name="select:Body Font" content="Raleway" title="Raleway"/>
  45. <meta name="select:Body Font" content="Work Sans" title="Work Sans"/>
  46.  
  47. <meta name="select:Body Font Size" content="1rem" title="1rem"/>
  48. <meta name="select:Body Font Size" content="0.9rem" title="0.9rem"/>
  49. <meta name="select:Body Font Size" content="0.8rem" title="0.8rem"/>
  50.  
  51. <meta name="select:Uppercase Font Size" content="0.9rem" title="0.9rem"/>
  52. <meta name="select:Uppercase Font Size" content="0.8rem" title="0.8rem"/>
  53.  
  54. <meta name="image:Sidebar Image" content="https://i.imgur.com/AMkLIAi.png"/>
  55. <meta name="image:Icon Image" content="https://i.imgur.com/gEI5k9I.png"/>
  56.  
  57. <meta name="text:Title" content="Calypso"/>
  58.  
  59. <meta name="text:Location" content="Whereabouts"/>
  60. <meta name="text:Birthday" content="Date Of Birth"/>
  61. <meta name="text:Likes" content="Things You Like"/>
  62.  
  63. <meta name="text:Link 1 URL" content="/"/>
  64. <meta name="text:Link 1 Name" content="Link One"/>
  65. <meta name="text:Link 2 URL" content="/"/>
  66. <meta name="text:Link 2 Name" content="Link Two"/>
  67. <meta name="text:Link 3 URL" content="/"/>
  68. <meta name="text:Link 3 Name" content="Link Three"/>
  69. <meta name="text:Link 4 URL" content="/"/>
  70. <meta name="text:Link 4 Name" content="Link Four"/>
  71. <meta name="text:Link 5 URL" content="/"/>
  72. <meta name="text:Link 5 Name" content="Link Five"/>
  73. <meta name="text:Link 6 URL" content="/"/>
  74. <meta name="text:Link 6 Name" content="Link Six"/>
  75. <meta name="text:Link 7 URL" content="/"/>
  76. <meta name="text:Link 7 Name" content="Link Seven"/>
  77.  
  78. <meta name="text:Updates Title" content="Blog Updates"/>
  79.  
  80. <meta name="text:Update Date 1" content="MM/DD/YYYY"/>
  81. <meta name="text:Update 1" content="Lorem ipsum dolor sit amet, consectetuer adipiscing elit."/>
  82. <meta name="text:Update Date 2" content="MM/DD/YYYY"/>
  83. <meta name="text:Update 2" content="Lorem ipsum dolor sit amet, consectetuer adipiscing elit."/>
  84. <meta name="text:Update Date 3" content="MM/DD/YYYY"/>
  85. <meta name="text:Update 3" content="Lorem ipsum dolor sit amet, consectetuer adipiscing elit."/>
  86.  
  87. <meta name="if:Submit Link" content="1"/>
  88.  
  89. <meta name="if:Updates" content="1"/>
  90.  
  91. <meta name="if:Hide Tags" content="0"/>
  92. <meta name="if:Show Tags" content="1"/>
  93.  
  94. <!-- Google Fonts Script -->
  95.  
  96. <link href="https://fonts.googleapis.com/css2?family=Karla:ital,wght@0,400;0,700;1,400;1,700&family=Montserrat:ital,wght@0,400;0,700;1,400;1,700&family=Muli:ital,wght@0,400;0,700;1,400;1,700&family=Open+Sans:ital,wght@0,400;0,700;1,400;1,700&family=Poppins:ital,wght@0,400;0,700;0,800;1,400;1,700;1,800&family=Raleway:ital,wght@0,400;0,700;1,400;1,700&family=Work+Sans:ital,wght@0,400;0,700;1,400;1,700&display=swap" rel="stylesheet">
  97.  
  98. <link href="https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,700;1,400;1,700&family=Rubik:ital,wght@0,400;0,700;1,400;1,700&display=swap" rel="stylesheet">
  99.  
  100. <!-- jQuery Script -->
  101.  
  102. <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
  103.  
  104. <!-- Styled Tooltips Script -->
  105.  
  106. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  107.  
  108. <script src="https://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  109.  
  110. <script>
  111. (function($){
  112. $(document).ready(function(){
  113. $("a[title]").style_my_tooltips({
  114. tip_follows_cursor:true,
  115. tip_delay_time:90,
  116. tip_fade_speed:600,
  117. attribute:"title"
  118. });
  119. });
  120. })(jQuery);
  121. </script>
  122.  
  123. <!-- Font Awesome Script -->
  124.  
  125. <link href="//use.fontawesome.com/releases/v6.0.0/css/all.css" rel="stylesheet">
  126.  
  127. <!-- Search Bar Script -->
  128.  
  129. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  130.  
  131. <script>
  132. $(document).ready(function(){
  133. $('.search').submit(function(event){
  134. var value = $('input:first').val();
  135. location.replace('http://{Name}.tumblr.com/tagged/' + value);
  136. });
  137. });
  138. </script>
  139.  
  140. <!-- Side Naviagion Script -->
  141.  
  142. <script>
  143. function openNav() {
  144. document.getElementById("panel").style.width = "250px";
  145. }
  146. function closeNav() {
  147. document.getElementById("panel").style.width = "0";
  148. }
  149. </script>
  150.  
  151. <!-- Hide & Show Script -->
  152.  
  153. <script src="//ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
  154.  
  155. <script>
  156. $(document).ready(function(){
  157. $('.tags').hide();
  158. $('.tags-title').click(function() {
  159. $(this).closest('.entries').find('.tags').slideToggle(500);
  160. });
  161. });
  162. </script>
  163.  
  164. <!--✻✻✻✻✻✻  npf audio player by @glenthemes  ✻✻✻✻✻✻-->
  165.  
  166. <script src="//tmblr-npf-audio.gitlab.io/s/init.js"></script>
  167.  
  168. <link href="//tmblr-npf-audio.gitlab.io/s/base.css" rel="stylesheet">
  169.  
  170. <script>
  171. tumblr_npf_audio({
  172. emptyTitleText: "",
  173. emptyArtistText: "",
  174. emptyAlbumText: "",
  175. titleLabel: "",    
  176. artistLabel: "",
  177. albumLabel: "",
  178. });
  179. </script>
  180.  
  181. <!-- Unnest Captions Script -->
  182.  
  183. <script src="//code.jquery.com/jquery-2.2.4.min.js"></script>
  184.  
  185. <script src="https://static.tumblr.com/wgg6svp/OoTofxa0c/unnest.min.js"></script>
  186.  
  187. <script>
  188. $(function(){  $('.entries').unnest({
  189. yourCaption: ".text, .caption",
  190. wrapName: ".tumblr_parent",
  191. newCaptionUsername: false,
  192. originalPostCaptionUsername: false,
  193. tumblrAvatars: true,
  194. tumblrAvatarClass: ".tumblr_avatar",
  195. usernameColon: false
  196. });
  197. });
  198. </script>
  199.  
  200. <!--
  201.         NPF images fix v4.0 by @glenthemes [2023]
  202.         💌 gitlab.com/glen-npf/v4-beta
  203. --->
  204.  
  205. <link href="//glen-npf.gitlab.io/v4-beta/main.css" rel="stylesheet">
  206.  
  207. <script src="//glen-npf.gitlab.io/v4-beta/use.js"></script>
  208. <style>
  209. :root {
  210. --NPF-Images-Spacing:1px;
  211. --NPF-Caption-Spacing:1em;
  212. --NPF-Move-1st-Photoset:"no";
  213. --Text-Container-Selector:".caption";
  214. --Text-Reblogs-Selector:".tumblr_parent";
  215. }
  216. </style>
  217.  
  218. <!-- Inline Images Resizing Script -->
  219.  
  220. <script>
  221. $(".tmblr-full, figure").each(function(){
  222. var imgWidth = $(this).attr("data-orig-width"),
  223. img = $(this).find("img"),
  224. imgSrc = img.attr("src");
  225. $('figure').css({'margin-left':'0','margin-right':'0','display':'inline-block'});
  226. if (imgWidth >= 500){
  227. img.attr("src",imgSrc.replace("_500.","_1280."));
  228. $('.tmblr-full img, figure img').css({'width':'auto','height':'auto','vertical-align':'middle'});
  229. }
  230. });  
  231. </script>
  232.  
  233. <!-- PXU Script -->
  234.  
  235. <link href="https://static.tumblr.com/qudkd6d/OcDnl99gb/style.css" rel="stylesheet" type="text/css"/>
  236.  
  237. <script src="https://static.tumblr.com/qudkd6d/Az6nkemqr/pxuphotoset.min.js"></script>
  238.  
  239. <script>
  240. $(document).ready(function(){
  241. $('.photo-slideshow').pxuPhotoset({
  242. lightbox: true,
  243. rounded: false,
  244. gutter: '1px',
  245. borderRadius: '0px',
  246. photoset: '.photo-slideshow',
  247. photoWrap: '.photo-data',
  248. photo: '.pxu-photo'
  249. });
  250. });
  251. </script>
  252.  
  253. <!-- Responsive Tumblr Videos Script -->
  254.  
  255. <script src="//cdn.jsdelivr.net/gh/robinpx/tumblr@master/scripts/flexibleFrames/flexibleFrames.min.js"></script>
  256.  
  257. <script>
  258. $(document).ready(function() {
  259. flexibleFrames($(".video"));  
  260. });
  261. </script>
  262.  
  263. <style type="text/css">
  264.  
  265. .tmblr-iframe--app-cta-button {
  266. display: none!important;
  267. }
  268.  
  269. iframe.tmblr-iframe {
  270. right: 192px;
  271. top: 17px!important;
  272. }
  273.  
  274. ::-webkit-scrollbar-thumb:vertical {
  275. background: {color:Scrollbar};
  276. }
  277.  
  278. ::-webkit-scrollbar {
  279. width: 1px;
  280. }
  281.  
  282. ::selection {
  283. background: {color:Main Color};
  284. color: white;
  285. }
  286.  
  287. ::-moz-selection {
  288. background: {color:Main Color};
  289. color: white;
  290. }
  291.  
  292. #s-m-t-tooltip {
  293. background: {color:Tooltip Background};
  294. border-radius: 5px;
  295. color: {color:Tooltip Color};
  296. font-size: {select:Uppercase Font Size};
  297. margin-top: 30px;
  298. padding: 5px;
  299. text-align: center;
  300. text-transform: uppercase;
  301. z-index: 999999999999999999999999999999999999;
  302. }
  303.  
  304. body {
  305. background: {color:Background};
  306. color: {color:Text};
  307. cursor: url(https://i.imgur.com/lhPqll6.png), progress;
  308. font-family: '{select:Body Font}', sans-serif;
  309. font-size: {select:Body Font Size};
  310. font-style: normal;
  311. font-weight: 400;
  312. hyphens: auto;
  313. letter-spacing: 1px;
  314. margin: 0px;
  315. text-align: left;
  316. text-transform: none;
  317. word-wrap: break-word;
  318. }
  319.  
  320. a {
  321. color: {color:Link};
  322. text-decoration: none;
  323. -webkit-transition: all 0.5s ease;
  324. -moz-transition: all 0.5s ease;
  325. -o-transition: all 0.5s ease;
  326. }
  327.  
  328. a:hover {
  329. color: {color:Link Hover};
  330. }
  331.  
  332. b {
  333. font-weight: 700;
  334. }
  335.  
  336. h1 {
  337. font-family: 'Playfair Display', serif;
  338. font-size: 1.2rem;
  339. font-weight: bold;
  340. margin-block-start: 0em;
  341. text-transform: lowercase;
  342. }
  343.  
  344. h2 {
  345. font-family: 'Rubik', sans-serif;
  346. font-size: 1rem;
  347. font-weight: bold;
  348. margin-block-start: 0em;
  349. }
  350.  
  351. blockquote {
  352. border-left: 1px solid {color:Border};
  353. margin: 5px;
  354. padding-left: 5px;
  355. }
  356.  
  357. blockquote img {
  358. height: auto;
  359. max-width: 100%;
  360. }
  361.  
  362. blockquote blockquote {
  363. border-left: 1px solid {color:Border};
  364. padding-left: 5px;
  365. }
  366.  
  367. pre {
  368. background: #f8f8f8;
  369. border-radius: 5px;
  370. padding: 10px;
  371. word-wrap: break-all;
  372. white-space: pre-wrap;
  373. }
  374.  
  375. #header {
  376. align-items: center;
  377. background: {color:Header Background};
  378. display: flex;
  379. height: 48px;
  380. justify-content: space-between;
  381. overflow: auto;
  382. padding: 20px;
  383. position: fixed;
  384. top: 0px;
  385. width: calc(100% - 40px);
  386. z-index: 1;
  387. }
  388.  
  389. .main-links {
  390. display: flex;
  391. flex-direction: row;
  392. flex-wrap: wrap;
  393. margin: -5px;
  394. }
  395.  
  396. .main-links a {
  397. background: {color:Post Background};
  398. border: 1px solid {color:Border};
  399. border-radius: 100px;
  400. color: {color:Main Color};
  401. display: inline-block;
  402. font-size: 0.9rem;
  403. font-variant: normal;
  404. height: 0.9rem;
  405. line-height: 1;
  406. margin: 5px;
  407. padding: 10px;
  408. text-rendering: auto;
  409. width: 0.9rem;
  410. }
  411.  
  412. .main-links a:hover {
  413. background: {color:Main Color};
  414. color: {color:Post Background};
  415. }
  416.  
  417. .avatar-image {
  418. height: 48px;
  419. width: 48px;
  420. }
  421.  
  422. .avatar-image img {
  423. border-radius: 100px;
  424. height: 48px;
  425. width: 48px;
  426. }
  427.  
  428. .mns-wrapper {
  429. display: flex;
  430. float: right;
  431. }
  432.  
  433. .mobile-navigation {
  434. background: {color:Post Background};
  435. border: 1px solid {color:Border};
  436. border-radius: 100px;
  437. color: {color:Main Color};
  438. display: none;
  439. font-size: 0.9rem;
  440. font-variant: normal;
  441. height: 0.9rem;
  442. line-height: 1;
  443. padding: 10px;
  444. text-rendering: auto;
  445. width: 0.9rem;
  446. }
  447.  
  448. .side-navigation {
  449. background: {color:Post Background};
  450. border-right: 1px solid {color:Border};
  451. height: 100%;
  452. left: -1px;
  453. overflow-x: hidden;
  454. position: fixed;
  455. top: 0px;
  456. transition: 0.5s;
  457. width: 0px;
  458. z-index: 1;
  459. }
  460.  
  461. .side-navigation .close-panel {
  462. font-size: 0.9rem;
  463. position: absolute;
  464. right: 20px;
  465. top: 20px;
  466. z-index: 1;
  467. }
  468.  
  469. #alt-main-links {
  470. font-size: {select:Uppercase Font Size};
  471. margin-top: 20px;
  472. margin-left: 20px;
  473. text-transform: uppercase;
  474. width: 210px;
  475. }
  476.  
  477. #alt-main-links a {
  478. background: {color:Post Background};
  479. border: 1px solid {color:Border};
  480. border-radius: 100px;
  481. display: block;
  482. margin-bottom: 20px;
  483. }
  484.  
  485. .search-wrapper {
  486. align-items: center;
  487. background: {color:Post Background};
  488. border: 1px solid {color:Border};
  489. border-radius: 100px;
  490. display: flex;
  491. margin-left: 10px;
  492. width: 170px;
  493. }
  494.  
  495. .search  {
  496. border: none;
  497. display: inline-block;
  498. margin-bottom: 0px;
  499. padding: 0px;
  500. position: relative;
  501. width: calc(100% - 54.39px);
  502. }
  503.  
  504. .query {
  505. background: none;
  506. border: none;
  507. color: {color:Text};
  508. font-family: '{select:Body Font}', sans-serif;
  509. font-size: {select:Uppercase Font Size};
  510. letter-spacing: 1px;
  511. padding: 0px;
  512. text-align: left;
  513. text-transform: uppercase;
  514. outline: 0;
  515. width: 100%;
  516. }
  517.  
  518. #left {
  519. background: {color:Left Background};
  520. border-right: 1px solid {color:Border};
  521. height: calc(100% - 88px);
  522. left: 0px;
  523. overflow-y: scroll;
  524. position: fixed;
  525. top: 88px;
  526. width: 250px;
  527. }
  528.  
  529. #user-information {
  530. width: 250px;
  531. }
  532.  
  533. .sidebar-image {
  534. height: 100px;
  535. width: 250px;
  536. }
  537.  
  538. .sidebar-image img {
  539. height: 100px;
  540. width: 250px;
  541. }
  542.  
  543. .iitndl-wrapper {
  544. margin-left: 20px;
  545. margin-top: -41px;
  546. width: 210px;
  547. }
  548.  
  549. .icon-image {
  550. height: 70px;
  551. width: 70px;
  552. }
  553.  
  554. .icon-image img {
  555. background: #ffffff;
  556. border-radius: 100px;
  557. height: 70px;
  558. padding: 3px;
  559. width: 70px;
  560. }
  561.  
  562. .title {
  563. color: {color:Main Color};
  564. font-family: 'Rubik', sans-serif;
  565. font-weight: bold;
  566. margin-top: 30px;
  567. text-transform: lowercase;
  568. }
  569.  
  570. .name {
  571. text-transform: lowercase;
  572. }
  573.  
  574. .description {
  575. margin-top: 15px;
  576. }
  577.  
  578. .info {
  579. font-size: {select:Uppercase Font Size};
  580. margin: -5px;
  581. margin-top: 15px;
  582. text-transform: uppercase;
  583. }
  584.  
  585. .info li {
  586. display: inline;
  587. list-style-type: none;
  588. margin: 5px;
  589. }
  590.  
  591. #right {
  592. background: {color:Left Background};
  593. border-left: 1px solid {color:Border};
  594. height: calc(100% - 88px);
  595. overflow-y: scroll;
  596. position: fixed;
  597. right: 0px;
  598. top: 88px;
  599. width: 250px;
  600. }
  601.  
  602. #box-wrapper {
  603. margin-top: 20px;
  604. margin-left: 20px;
  605. position: absolute;
  606. width: 210px;
  607. }
  608.  
  609. #box {
  610. margin-bottom: 20px;
  611. }
  612.  
  613. .box-title {
  614. background: {color:Post Background};
  615. border: 1px solid {color:Border};
  616. border-radius: 100px;
  617. display: block;
  618. font-size: {select:Uppercase Font Size};
  619. margin-bottom: 20px;
  620. text-transform: uppercase;
  621. }
  622.  
  623. .updates {
  624. align-items: center;
  625. display: flex;
  626. margin-bottom: 15px;
  627. }
  628.  
  629. .updates-icon {
  630. width: 34.39px;
  631. }
  632.  
  633. .uduc-wrapper {
  634. margin-left: 10px;
  635. }
  636.  
  637. .updates-date {
  638. color: {color:Main Color};
  639. font-size: {select:Uppercase Font Size};
  640. text-transform: uppercase;
  641. }
  642.  
  643. .updates-content {
  644. font-size: {select:Uppercase Font Size};
  645. text-transform: uppercase;
  646. }
  647.  
  648. #container {
  649. margin-bottom: 50px;
  650. margin-left: 251px;
  651. margin-top: 138px;
  652. width: calc(100% - 502px);
  653. }
  654.  
  655. #posts {
  656. margin-left: auto;
  657. margin-right: auto;
  658. width: 522px;
  659. }
  660.  
  661. #links {
  662. font-size: {select:Uppercase Font Size};
  663. margin: -5px;
  664. margin-bottom: 50px;
  665. text-transform: uppercase;
  666. display: flex;
  667. flex-direction: row;
  668. flex-wrap: wrap;
  669. }
  670.  
  671. #links a {
  672. background: {color:Main Color};
  673. border-radius: 100px;
  674. color: {color:Post Background};
  675. margin: 5px;
  676. padding: 10px;
  677. }
  678.  
  679. #links a:hover {
  680. color: {color:Link Hover};
  681. }
  682.  
  683. .entries {
  684. margin-bottom: 50px;
  685. width: 522px;
  686. }
  687.  
  688. .entries-wrapper {
  689. background: {color:Post Background};
  690. border: 1px solid {color:Border};
  691. border-radius: 5px;
  692. padding: 10px;
  693. width: 500px;
  694. }
  695.  
  696. .entries img {
  697. height: auto;
  698. max-width: 100%;
  699. }
  700.  
  701. .npf_row img {
  702. width: 100%;
  703. }
  704.  
  705. .tmblr-full {
  706. margin-bottom: 10px;
  707. }
  708.  
  709. .npf_inst {
  710. margin-bottom: 20px;
  711. }
  712.  
  713. .npf-wrapper {
  714. margin: 0px;
  715. }
  716.  
  717. .npf-wrapper .tmblr-full {
  718. display: flex;
  719. }
  720.  
  721. .text-wrapper {
  722. margin: 0px;
  723. }
  724.  
  725. .read_more {
  726. background: {color:Main Color};
  727. border: 1px solid {color:Border};
  728. border-radius: 5px;
  729. color: white;
  730. display: inline-block;
  731. font-size: {select:Uppercase Font Size};
  732. padding: 10px;
  733. text-align: center;
  734. text-transform: uppercase;
  735. width: calc(100% - 22px);
  736. }
  737.  
  738. .read_more:hover {
  739. background: white;
  740. color: {color:Main Color};
  741. }
  742.  
  743. .vignette, #vignette {
  744. opacity: 0;
  745. }
  746.  
  747. .lightbox-image, #tumblr_lightbox img {
  748. border-radius: 0!important;
  749. box-shadow: none!important;
  750. max-width: none;
  751. }
  752.  
  753. .tmblr-lightbox, #tumblr_lightbox {
  754. background-attachment: fixed;
  755. background-image: url('https://i.imgur.com/7wF2zbK.png');
  756. background-repeat: repeat;
  757. }
  758.  
  759. .lightbox-caption, #tumblr_lightbox_caption {
  760. visibility: hidden;
  761. }
  762.  
  763. .text p {
  764. margin-top: 0px;
  765. }
  766.  
  767. .caption {
  768. margin-top: 20px;
  769. }
  770.  
  771. .caption p {
  772. margin-top: 0px;
  773. }
  774.  
  775. blockquote.tumblr_parent {
  776. border: none;
  777. border-bottom: 1px solid {color:Border};
  778. margin: 0px;
  779. margin-bottom: 20px;
  780. padding: 0px;
  781. }
  782.  
  783. blockquote.tumblr_parent:last-child {
  784. border-bottom: 0px;
  785. }
  786.  
  787. blockquote.user-reblog {
  788. border: none;
  789. margin: 0px;
  790. padding: 0px;
  791. }
  792.  
  793. .tumblr_avatar {
  794. border-radius: 100px;
  795. height: 30px;
  796. margin-bottom: 20px;
  797. width: 30px;
  798. }
  799.  
  800. .tumblr_avatar img {
  801. height: 30px;
  802. width: 30px;
  803. }
  804.  
  805. .user-image img {
  806. height: 30px;
  807. width: 30px;
  808. }
  809.  
  810. a.tumblr_blog {
  811. font-size: {select:Body Font Size};
  812. font-weight: bold;
  813. margin-top: calc((30px - {select:Body Font Size}) / 4);
  814. display: inline-block;
  815. position: absolute;
  816. margin-left: 10px;
  817. text-align: center;
  818. text-transform: lowercase;
  819. }
  820.  
  821. .ask-wrapper {
  822. width: 100%;
  823. }
  824.  
  825. .asker-wrapper {
  826. overflow: auto;
  827. width: 100%;
  828. }
  829.  
  830. .asker-question {
  831. border: 1px solid {color:Border};
  832. border-radius: 5px;
  833. font-size: {select:Uppercase Font Size};
  834. padding: 10px;
  835. padding-bottom: 27.195px;
  836. text-transform: uppercase;
  837. }
  838.  
  839. .asker-question p {
  840. margin-block-start: 0em;
  841. }
  842.  
  843. .asker-question p:last-of-type {
  844. margin-block-end: 0em;
  845. }
  846.  
  847. .asker-icon {
  848. background: {color:Chat Even Background};
  849. border-radius: 100px;
  850. display: inline-block;
  851. float: left;
  852. font-size: {select:Uppercase Font Size};
  853. margin-left: 10px;
  854. margin-top: -17.195px;
  855. padding-right: 10px;
  856. text-transform: uppercase;
  857. }
  858.  
  859. .quote-wrapper {
  860. width: 100%;
  861. }
  862.  
  863. .quote a.tumblr_blog {
  864. font-size: {select:Uppercase Font Size};
  865. font-weight: normal;
  866. margin-top: 0px;
  867. margin-left: 0px;
  868. display: inline-block;
  869. position: relative;
  870. text-align: center;
  871. text-transform: uppercase;
  872. }
  873.  
  874. .quote-icon {
  875. background: {color:Chat Even Background};
  876. border-radius: 100px;
  877. color: {color:Main Color};
  878. font-size: 0.9rem;
  879. height: 0.9rem;
  880. margin-left: auto;
  881. margin-right: auto;
  882. margin-top: -17.195px;
  883. padding: 10px;
  884. width: 0.9rem;
  885. }
  886.  
  887. .quote {
  888. border: 1px solid {color:Border};
  889. border-radius: 5px;
  890. font-family: 'Playfair Display', serif;
  891. font-weight: bold;
  892. padding: 10px;
  893. padding-bottom: 26.4px;
  894. text-align: center;
  895. }
  896.  
  897. .website {
  898. background: {color:Main Color};
  899. color: {color:Post Background};
  900. font-size: {select:Uppercase Font Size};
  901. padding: 10px;
  902. text-transform: uppercase;
  903. }
  904.  
  905. .website a {
  906. color: {color:Post Background};
  907. }
  908.  
  909. .website a:hover {
  910. color: {color:Link Hover};
  911. }
  912.  
  913. .chat {
  914. font-size: {select:Uppercase Font Size};
  915. text-transform: uppercase;
  916. }
  917.  
  918. .chat li {
  919. list-style-type: none;
  920. }
  921.  
  922. .chat li:nth-child(odd) {
  923. background: {color:Main Color};
  924. color: {color:Post Background};
  925. padding: 10px;
  926. }
  927.  
  928. .chat li:nth-child(even) {
  929. background: {color:Chat Even Background};
  930. color: {color:Main Color};
  931. padding: 10px;
  932. }
  933.  
  934. .audio iframe {
  935. height: 85px;
  936. width: 100%;
  937. }
  938.  
  939. /** spotify fix by glenthemes **/
  940.  
  941. iframe[src*='open.spotify.com'][src*='track'], figure[data-npf*='open.spotify.com'][data-npf*='track']{
  942. height: 85px!important;
  943. margin-bottom: 0px;
  944. }
  945.  
  946. figure {
  947. display: flex;
  948. width: 100%;
  949. }
  950.  
  951. figcaption.npf-audio-wrapper {
  952. width: 100%;
  953. }
  954.  
  955. .npf-audio-wrapper {
  956. --NPF-Audio-Buttons-Size: 1.4rem;
  957. --NPF-Audio-Buttons-Color: #555555;
  958. --NPF-Audio-Buttons-Spacing: 1.3rem;
  959. --NPF-Audio-Image-Size: 85px;
  960. --NPF-Audio-Image-Spacing: 0px;
  961. }
  962.  
  963. span.npf-audio-title {
  964. font-weight: bold;
  965. }
  966.  
  967. .npf-audio-background {
  968. background-color: #f2f2f2;
  969. padding: 1.5rem;
  970. }
  971.  
  972. video {
  973. height: auto;
  974. width: 100%;
  975. }
  976.  
  977. .source {
  978. background: {color:Chat Even Background};
  979. border-radius: 5px;
  980. display: inline-block;
  981. font-size: {select:Uppercase Font Size};
  982. margin-top: 10px;
  983. padding: 5px;
  984. text-transform: uppercase;
  985. }
  986.  
  987. .pinned-post {
  988. background: {color:Pin};
  989. border-radius: 5px;
  990. color: {color:Post Background};
  991. font-size: {select:Uppercase Font Size};
  992. margin-bottom: 20px;
  993. padding: 10px;
  994. text-transform: uppercase;
  995. }
  996.  
  997. .vsd {
  998. border-bottom: 1px solid {color:Border};
  999. font-size: {select:Uppercase Font Size};
  1000. margin: -10px;
  1001. margin-bottom: 10px;
  1002. overflow: auto;
  1003. padding: 10px;
  1004. text-transform: uppercase;
  1005. }
  1006.  
  1007. .pslr {
  1008. border-top: 1px solid {color:Border};
  1009. font-size: {select:Uppercase Font Size};
  1010. margin: -10px;
  1011. margin-top: 10px;
  1012. padding: 10px;
  1013. overflow: auto;
  1014. text-transform: uppercase;
  1015. }
  1016.  
  1017. .post-notes {
  1018. display: inline-block;
  1019. }
  1020.  
  1021. .like-b {
  1022. display: inline-block;
  1023. margin-right: 10px;
  1024. position: relative;
  1025. }
  1026.  
  1027. .like-b .like_button iframe {
  1028. bottom: 0px;
  1029. left: 0px;
  1030. opacity: 0;
  1031. position: absolute;
  1032. right: 0px;
  1033. top: 0px;
  1034. }
  1035.  
  1036. .like-b .liked + .b {
  1037. color: {color:Like};
  1038. }
  1039.  
  1040. .tags-notes {
  1041. font-size: {select:Uppercase Font Size};
  1042. margin-top: 20px;
  1043. text-align: center;
  1044. text-transform: uppercase;
  1045. }
  1046.  
  1047. .tags-title {
  1048. background: {color:Main Color};
  1049. border-radius: 100px;
  1050. color: {color:Post Background};
  1051. display: inline-block;
  1052. padding: 5px;
  1053. }
  1054.  
  1055. .tags-title a {
  1056. -webkit-transition: all 0.5s ease;
  1057. -moz-transition: all 0.5s ease;
  1058. -o-transition: all 0.5s ease;
  1059. }
  1060.  
  1061. .tags-title:hover {
  1062. color: {color:Link Hover};
  1063. }
  1064.  
  1065. .tags {
  1066. margin-top: 10px;
  1067. text-transform: uppercase;
  1068. }
  1069.  
  1070. .tags-alternate {
  1071. font-size: {select:Uppercase Font Size};
  1072. text-transform: uppercase;
  1073. }
  1074.  
  1075. ol.notes {
  1076. background: {color:Post Background};
  1077. border: 1px solid {color:Border};
  1078. border-radius: 5px;
  1079. font-size: {select:Uppercase Font Size};
  1080. margin-top: 20px;
  1081. padding: 0px;
  1082. text-align: left;
  1083. text-transform: uppercase;
  1084. }
  1085.  
  1086. ol.notes li {
  1087. list-style-type: none;
  1088. margin: 10px;
  1089. }
  1090.  
  1091. ol.notes li.note img.avatar {
  1092. border-radius: 100px;
  1093. vertical-align: -4px;
  1094. height: 16px;
  1095. margin-right: 10px;
  1096. width: 16px;
  1097. }
  1098.  
  1099. .more_notes_link {
  1100. background: {color:Main Color};
  1101. border-radius: 5px;
  1102. color: white;
  1103. display: inline-block;
  1104. padding: 5px 10px 5px 10px;
  1105. text-align: center;
  1106. }
  1107.  
  1108. .pagination {
  1109. align-items: baseline;
  1110. display: flex;
  1111. font-size: {select:Uppercase Font Size};
  1112. justify-content: space-between;
  1113. text-align: center;
  1114. text-transform: uppercase;
  1115. }
  1116.  
  1117. .navigation {
  1118. align-self: baseline;
  1119. display: inline-block;
  1120. }
  1121.  
  1122. .navigation a {
  1123. background: {color:Main Color};
  1124. border: 1px solid {color:Main Color};
  1125. border-radius: 5px;
  1126. color: {color:Post Background};
  1127. padding: 5px;
  1128. }
  1129.  
  1130. .navigation a:hover {
  1131. background: {color:Post Background};
  1132. color: {color:Main Color};
  1133. }
  1134.  
  1135. .pages {
  1136. background: {color:Main Color};
  1137. border: 1px solid {color:Main Color};
  1138. border-radius: 5px;
  1139. color: {color:Post Background};
  1140. align-self: baseline;
  1141. display: inline-block;
  1142. padding: 5px;
  1143. }
  1144.  
  1145. #credit {
  1146. bottom: 15px;
  1147. font-size: 0.7rem;
  1148. position: fixed;
  1149. right: 15px;
  1150. text-transform: uppercase;
  1151. }
  1152.  
  1153. #credit a {
  1154. color: {color:Link};
  1155. }
  1156.  
  1157. #credit a:hover {
  1158. color: {color:Link Hover};
  1159. }
  1160.  
  1161. @media only screen and (max-width: 1000px) {
  1162.  
  1163. iframe.tmblr-iframe {
  1164. display: none!important;
  1165. }
  1166.  
  1167. .main-links {
  1168. display: none;
  1169. }
  1170.  
  1171. .mobile-navigation {
  1172. display: inline-block;
  1173. }
  1174.  
  1175. #left {
  1176. display: none;
  1177. }
  1178.  
  1179. #right {
  1180. display: none;
  1181. }
  1182.  
  1183. #container {
  1184. margin-left: 0px;
  1185. width: 100%;
  1186. }
  1187.  
  1188. #posts {
  1189. width: 422px;
  1190. }
  1191.  
  1192. .entries {
  1193. margin-bottom: 50px;
  1194. width: 422px;
  1195. }
  1196.  
  1197. .entries-wrapper {
  1198. background: {color:Post Background};
  1199. border: 1px solid {color:Border};
  1200. border-radius: 5px;
  1201. padding: 10px;
  1202. width: 400px;
  1203. }
  1204.  
  1205. .entries img {
  1206. max-width: 100%;
  1207. }
  1208.  
  1209. .audio iframe {
  1210. width: 400px;
  1211. }
  1212.  
  1213. }
  1214.  
  1215. @media only screen and (max-width: 500px) {
  1216.  
  1217. #posts {
  1218. width: 262px;
  1219. }
  1220.  
  1221. .entries {
  1222. margin-bottom: 50px;
  1223. width: 262px;
  1224. }
  1225.  
  1226. .entries-wrapper {
  1227. background: {color:Post Background};
  1228. border: 1px solid {color:Border};
  1229. border-radius: 5px;
  1230. padding: 10px;
  1231. width: 250px;
  1232. }
  1233.  
  1234. .entries img {
  1235. max-width: 100%;
  1236. }
  1237.  
  1238. .audio iframe {
  1239. width: 250px;
  1240. }
  1241.  
  1242. }
  1243.  
  1244. {CustomCSS}
  1245.    
  1246. </style>
  1247.    
  1248. </head>
  1249.  
  1250. <body>
  1251.  
  1252. <div id="header">
  1253.  
  1254. <div class="main-links">
  1255. <a href="/" title="Home"><i class="far fa-arrow-alt-circle-left"></i></a>
  1256. {block:AskEnabled}<a href="/ask" title="Ask"><i class="far fa-envelope" style="vertical-align: center;"></i></a>{/block:AskEnabled}
  1257. {block:SubmissionsEnabled}{block:IfSubmitLink}<a href="/submit" title="Submit"><i class="fas fa-file-import"></i></a>{/block:IfSubmitLink}{/block:SubmissionsEnabled}
  1258. <a href="/archive" title="Archive"><i class="far fa-calendar-plus"></i></a>
  1259. </div>
  1260.  
  1261. <div class="avatar-image"><img src="{PortraitURL-48}"/></div>
  1262.  
  1263. <div class="mns-wrapper">
  1264.  
  1265. <a class="mobile-navigation" onclick="openNav()" title="Blog Menu"><i class="fas fa-list-ul"></i></a>
  1266.  
  1267. <div class="search-wrapper">
  1268. <i class="fas fa-search" style="background: {color:Main Color};border-radius: 100px;color: {color:Post Background};font-size: 0.9rem;margin-right: 10px;padding: 10px;width: 0.9rem;"></i>
  1269. <form class="search" action="javascript:return false">
  1270. <input type="text" class="query" placeholder="Search This Blog">
  1271. </form>
  1272. </div>
  1273.  
  1274. </div>
  1275.  
  1276. </div>
  1277.  
  1278. <!-- Start of Mobile Navigation -->
  1279.  
  1280. <div id="panel" class="side-navigation">
  1281.  
  1282. <a href="javascript:void(0)" class="close-panel" onclick="closeNav()"><i class="far fa-times-circle"></i></a>
  1283.  
  1284. <div id="user-information">
  1285.  
  1286. <div class="sidebar-image"><img src="{image:Sidebar Image}"/></div>
  1287.  
  1288. <div class="iitndl-wrapper">
  1289.  
  1290. <div class="icon-image"><img src="{image:Icon Image}"/></div>
  1291.  
  1292. <div class="title">{text:Title}</div>
  1293.  
  1294. <div class="name">@{Name}</div>
  1295.  
  1296. {block:Description}<div class="description">{Description}</div>{/block:Description}
  1297.  
  1298. <div class="info">
  1299. {block:ifLocation}<li><i class="fas fa-map-marker-alt" style="color: {color:Main Color};margin-right: 5px;"></i>{text:Location}</li>{/block:ifLocation}
  1300. {block:ifBirthday}<li><i class="fas fa-birthday-cake" style="color: {color:Main Color};margin-right: 5px;"></i>{text:Birthday}</li>{/block:ifBirthday}
  1301. {block:ifLikes}<li><i class="far fa-heart" style="color: {color:Main Color};margin-right: 5px;"></i>{text:Likes}</li>{block:ifLikes}
  1302. <li><i class="far fa-calendar-alt" style="color: {color:Main Color};margin-right: 5px;"></i>{CopyrightYears}</li>
  1303. </div>
  1304.  
  1305. </div>
  1306.  
  1307. </div>
  1308.  
  1309. <div id="alt-main-links">
  1310. <a href="/"><i class="far fa-arrow-alt-circle-left" style="background: {color:Main Color};border-radius: 100px;color: {color:Post Background};font-size: 0.9rem;margin-right: 10px;padding: 10px;width: 0.9rem;margin-right: 10px;padding: 10px;width: 0.9rem;"></i>Home</a>
  1311. {block:AskEnabled}<a href="/ask"><i class="far fa-envelope" style="background: {color:Main Color};border-radius: 100px;color: {color:Post Background};font-size: 0.9rem;margin-right: 10px;padding: 10px;width: 0.9rem;"></i>Ask</a>{/block:AskEnabled}
  1312. {block:SubmissionsEnabled}{block:IfSubmitLink}<a href="/submit"><i class="fas fa-file-import" style="background: {color:Main Color};border-radius: 100px;color: {color:Post Background};font-size: 0.9rem;margin-right: 10px;padding: 10px;width: 0.9rem;"></i>Submit</a>{/block:IfSubmitLink}{/block:SubmissionsEnabled}
  1313. <a href="/archive"><i class="far fa-calendar-plus" style="background: {color:Main Color};border-radius: 100px;color: {color:Post Background};font-size: 0.9rem;margin-right: 10px;padding: 10px;width: 0.9rem;"></i>Archive</a>
  1314. </div>
  1315.  
  1316. <div id="box-wrapper">
  1317.  
  1318. {block:IfUpdates}
  1319. <div id="box">
  1320.  
  1321. <div class="box-title"><i class="far fa-calendar-alt" style="background: {color:Main Color};border-radius: 100px;color: {color:Post Background};font-size: 0.9rem;margin-right: 10px;padding: 10px;width: 0.9rem;"></i>{text:Updates Title}</div>
  1322.  
  1323. <div class="box-content">
  1324. {block:ifUpdate1}
  1325. <div class="updates">
  1326. <div class="updates-icon"><i class="far fa-clock" style="background: {color:Main Color};border-radius: 100px;color: {color:Post Background};font-size: 0.9rem;margin-right: 10px;padding: 10px;width: 0.9rem;"></i></div>
  1327. <div class="uduc-wrapper">
  1328. <div class="updates-date">{text:Update Date 1}</div>
  1329. <div class="updates-content">{text:Update 1}</div>
  1330. </div>
  1331. </div>
  1332. {block:ifUpdate1}
  1333.  
  1334. {block:ifUpdate2}
  1335. <div class="updates">
  1336. <div class="updates-icon"><i class="far fa-clock" style="background: {color:Main Color};border-radius: 100px;color: {color:Post Background};font-size: 0.9rem;margin-right: 10px;padding: 10px;width: 0.9rem;"></i></div>
  1337. <div class="uduc-wrapper">
  1338. <div class="updates-date">{text:Update Date 2}</div>
  1339. <div class="updates-content">{text:Update 2}</div>
  1340. </div>
  1341. </div>
  1342. {block:ifUpdate2}
  1343.  
  1344. {block:ifUpdate3}
  1345. <div class="updates">
  1346. <div class="updates-icon"><i class="far fa-clock" style="background: {color:Main Color};border-radius: 100px;color: {color:Post Background};font-size: 0.9rem;margin-right: 10px;padding: 10px;width: 0.9rem;"></i></div>
  1347. <div class="uduc-wrapper">
  1348. <div class="updates-date">{text:Update Date 3}</div>
  1349. <div class="updates-content">{text:Update 3}</div>
  1350. </div>
  1351. </div>
  1352. {block:ifUpdate3}
  1353. </div>
  1354.  
  1355. </div>
  1356. {/block:IfUpdates}
  1357.  
  1358. </div>
  1359.  
  1360. </div>
  1361.  
  1362. <!-- End of Mobile Navigation -->
  1363.  
  1364. <div id="left">
  1365.  
  1366. <div id="user-information">
  1367.  
  1368. <div class="sidebar-image"><img src="{image:Sidebar Image}"/></div>
  1369.  
  1370. <div class="iitndl-wrapper">
  1371.  
  1372. <div class="icon-image"><img src="{image:Icon Image}"/></div>
  1373.  
  1374. <div class="title">{text:Title}</div>
  1375.  
  1376. <div class="name">@{Name}</div>
  1377.  
  1378. {block:Description}<div class="description">{Description}</div>{/block:Description}
  1379.  
  1380. <div class="info">
  1381. {block:ifLocation}<li><i class="fas fa-map-marker-alt" style="color: {color:Main Color};margin-right: 5px;"></i>{text:Location}</li>{/block:ifLocation}
  1382. {block:ifBirthday}<li><i class="fas fa-birthday-cake" style="color: {color:Main Color};margin-right: 5px;"></i>{text:Birthday}</li>{/block:ifBirthday}
  1383. {block:ifLikes}<li><i class="far fa-heart" style="color: {color:Main Color};margin-right: 5px;"></i>{text:Likes}</li>{block:ifLikes}
  1384. <li><i class="far fa-calendar-alt" style="color: {color:Main Color};margin-right: 5px;"></i>{CopyrightYears}</li>
  1385. </div>
  1386.  
  1387. </div>
  1388.  
  1389. </div>
  1390.  
  1391. </div>
  1392.  
  1393. <div id="right">
  1394.  
  1395. <div id="box-wrapper">
  1396.  
  1397. {block:IfUpdates}
  1398. <div id="box">
  1399.  
  1400. <div class="box-title"><i class="far fa-calendar-alt" style="background: {color:Main Color};border-radius: 100px;color: {color:Post Background};font-size: 0.9rem;margin-right: 10px;padding: 10px;width: 0.9rem;"></i>{text:Updates Title}</div>
  1401.  
  1402. <div class="box-content">
  1403. {block:ifUpdate1}
  1404. <div class="updates">
  1405. <div class="updates-icon"><i class="far fa-clock" style="background: {color:Main Color};border-radius: 100px;color: {color:Post Background};font-size: 0.9rem;margin-right: 10px;padding: 10px;width: 0.9rem;"></i></div>
  1406. <div class="uduc-wrapper">
  1407. <div class="updates-date">{text:Update Date 1}</div>
  1408. <div class="updates-content">{text:Update 1}</div>
  1409. </div>
  1410. </div>
  1411. {block:ifUpdate1}
  1412.  
  1413. {block:ifUpdate2}
  1414. <div class="updates">
  1415. <div class="updates-icon"><i class="far fa-clock" style="background: {color:Main Color};border-radius: 100px;color: {color:Post Background};font-size: 0.9rem;margin-right: 10px;padding: 10px;width: 0.9rem;"></i></div>
  1416. <div class="uduc-wrapper">
  1417. <div class="updates-date">{text:Update Date 2}</div>
  1418. <div class="updates-content">{text:Update 2}</div>
  1419. </div>
  1420. </div>
  1421. {block:ifUpdate2}
  1422.  
  1423. {block:ifUpdate3}
  1424. <div class="updates">
  1425. <div class="updates-icon"><i class="far fa-clock" style="background: {color:Main Color};border-radius: 100px;color: {color:Post Background};font-size: 0.9rem;margin-right: 10px;padding: 10px;width: 0.9rem;"></i></div>
  1426. <div class="uduc-wrapper">
  1427. <div class="updates-date">{text:Update Date 3}</div>
  1428. <div class="updates-content">{text:Update 3}</div>
  1429. </div>
  1430. </div>
  1431. {block:ifUpdate3}
  1432. </div>
  1433.  
  1434. </div>
  1435. {/block:IfUpdates}
  1436.  
  1437. </div>
  1438.  
  1439. </div>
  1440.  
  1441. <div id="container">
  1442.  
  1443. <div id="posts">
  1444.  
  1445. <div id="links">
  1446. {block:ifLink1URL}<a href="{text:Link 1 URL}">{text:Link 1 Name}</a>{/block:ifLink1URL}
  1447. {block:ifLink2URL}<a href="{text:Link 2 URL}">{text:Link 2 Name}</a>{/block:ifLink2URL}
  1448. {block:ifLink3URL}<a href="{text:Link 3 URL}">{text:Link 3 Name}</a>{/block:ifLink3URL}
  1449. {block:ifLink4URL}<a href="{text:Link 4 URL}">{text:Link 4 Name}</a>{/block:ifLink4URL}
  1450. {block:ifLink5URL}<a href="{text:Link 5 URL}">{text:Link 5 Name}</a>{/block:ifLink5URL}
  1451. {block:ifLink6URL}<a href="{text:Link 6 URL}">{text:Link 6 Name}</a>{/block:ifLink6URL}
  1452. {block:ifLink7URL}<a href="{text:Link 7 URL}">{text:Link 7 Name}</a>{/block:ifLink7URL}
  1453. </div>
  1454.  
  1455. {block:Posts}
  1456.  
  1457. <div class="entries" id="{PostID}" post-type="{PostType}">
  1458.  
  1459. {block:PinnedPostLabel}
  1460. <div class="pinned-post">
  1461. <i class="fas fa-star" style="margin-right: 5px;"></i>{PinnedPostLabel}
  1462. </div>
  1463. {/block:PinnedPostLabel}
  1464.  
  1465. <div class="entries-wrapper">
  1466.  
  1467. {block:Date}
  1468. <div class="vsd">
  1469. {block:RebloggedFrom}<i class="fas fa-sync-alt" style="margin-right: 5px;"></i><a href="{ReblogParentURL}">Via</a>{/block:RebloggedFrom}  
  1470. {block:ContentSource}{block:RebloggedFrom}(<i class="far fa-folder" style="margin-right: 5px;"></i><a href="{ReblogRootURL}">Source</a>){/block:RebloggedFrom}{/block:ContentSource}
  1471. <font style="float: right;">
  1472. <a href="{Permalink}"><i class="far fa-clock" style="color: {color:Text};margin-right: 5px;"></i>{ShortMonth} {DayOfMonth}, {Year}</a>
  1473. </font>
  1474. </div>
  1475. {block:Date}
  1476.  
  1477. {block:Text}
  1478. {block:NotReblog}
  1479. <div class="npf-wrapper">
  1480. {block:Title}
  1481. <h1>{Title}</h1>
  1482. {/block:Title}
  1483. {Body}
  1484. </div>
  1485. {/block:NotReblog}
  1486. {block:RebloggedFrom}
  1487. <div class="text-wrapper">
  1488. {block:Title}
  1489. <h1>{Title}</h1>
  1490. {/block:Title}
  1491. <div class="text">
  1492. {Body}
  1493. </div>
  1494. </div>
  1495. {/block:RebloggedFrom}
  1496. {/block:Text}
  1497.  
  1498. {block:Answer}
  1499. <div class="ask-wrapper">
  1500. <div class="asker-wrapper">
  1501. <div class="asker-question">
  1502. {Question}
  1503. </div>
  1504. <div class="asker-icon">
  1505. <i class="far fa-question-circle" style="background: {color:Main Color};border-radius: 100px;color: {color:Post Background};font-size: 0.9rem;margin-right: 10px;padding: 10px;width: 0.9rem;"></i><a href="{AskerURL}">{Asker}</a>
  1506. </div>
  1507. </div>
  1508. <div class="caption">
  1509. {Answer}
  1510. </div>
  1511. </div>
  1512. {/block:Answer}
  1513.  
  1514. {block:Quote}
  1515. <div class="quote-wrapper">
  1516. <div class="quote">
  1517. "{Quote}</i>"
  1518. {block:Source}
  1519. <br><br>
  1520. <font style="font-family: '{select:Body Font}', sans-serif;font-size: {select:Uppercase Font Size};font-weight: normal;text-transform: uppercase;">
  1521. — {Source}
  1522. </font>
  1523. {/block:Source}
  1524. </div>
  1525. <div class="quote-icon"><i class="far fa-comment-dots" style="vertical-align: top;"></i></div>
  1526. </div>
  1527. {/block:Quote}
  1528.  
  1529. {block:Link}
  1530. {block:Thumbnail}
  1531. <img src="{Thumbnail}" style="margin-bottom: 10px;"/>
  1532. {/block:Thumbnail}
  1533. <div class="website"><i class="fas fa-external-link-alt" style="margin-right: 10px;"></i><a href="{URL}" target="_blank">{Name}{block:Excerpt}<br><br>{Excerpt}{/block:Excerpt}
  1534. </a></div>
  1535. {block:Description}
  1536. <div class="caption">
  1537. {Description}
  1538. </div>
  1539. {/block:Description}
  1540. {/block:Link}
  1541.  
  1542. {block:Chat}
  1543. <div class="chat">
  1544. {block:Title}
  1545. <h1>{Title}</h1>
  1546. {/block:Title}
  1547. {block:Lines}
  1548. <li>{block:Label}{Label}{/block:Label}
  1549. {Line}
  1550. </li>
  1551. {/block:Lines}
  1552. </div>
  1553. {/block:Chat}
  1554.  
  1555. {block:Audio}
  1556. <div class="audio">
  1557. {AudioEmbed}
  1558. </div>
  1559. {block:Caption}
  1560. <div class="caption">{Caption}</div>
  1561. {/block:Caption}
  1562. {/block:Audio}
  1563.  
  1564. {block:Photo}
  1565. <a href="#" onclick="Tumblr.Lightbox.init([{ width: {PhotoWidth-HighRes}, height: {PhotoHeight-HighRes}, low_res: '{PhotoURL-HighRes}', high_res: '{PhotoURL-HighRes}' }]); $('body').toggleClass('tumblr_lightbox_active'); return false"><img src="{PhotoURL-HighRes}"></a>
  1566. {block:Caption}
  1567. <div class="text-wrapper">
  1568. <div class="caption">{Caption}</div>
  1569. </div>
  1570. {/block:Caption}
  1571. {/block:Photo}
  1572.  
  1573. {block:Photoset}
  1574. <div class="photo-slideshow" id="photoset_{PostID}" data-layout="{PhotosetLayout}">{block:Photos}<div class="photo-data"><div class="pxu-photo"><img src="{PhotoURL-500}" width="{PhotoWidth-500}" height="{PhotoHeight-500}" data-highres="{PhotoURL-HighRes}" data-width="{PhotoWidth-HighRes}" data-height="{PhotoHeight-HighRes}"></div><a class="tumblr-box" rel="post-{PostID}" href="{PhotoURL-HighRes}"></a></div>{/block:Photos}</div>
  1575. {block:Caption}
  1576. <div class="text-wrapper">
  1577. <div class="caption">{Caption}</div>
  1578. </div>
  1579. {/block:Caption}
  1580. {/block:Photoset}
  1581.  
  1582. {block:Video}
  1583. <div class="video">
  1584. {Video-500}
  1585. </div>
  1586. {block:Caption}
  1587. <div class="caption">{Caption}</div>
  1588. {/block:Caption}
  1589. {/block:Video}
  1590.  
  1591. {block:ContentSource}
  1592. <div class="source">
  1593. <i class="fas fa-paper-plane" style="color: {color:Main Color};margin-right: 5px;"></i><a href="{SourceURL}" title="{SourceTitle}">Source</a>
  1594. </div>
  1595. {/block:ContentSource}
  1596.  
  1597. {block:Date}
  1598. <div class="pslr">
  1599. {block:NoteCount}<div class="post-notes"><i class="far fa-comment-alt" style="margin-right: 5px;"></i><a href="{Permalink}">With {NoteCountWithLabel}</a></div>{/block:NoteCount}
  1600. <font style="float: right;">
  1601. <a class="like-b" href="#">{LikeButton}<div class="b"><i class="far fa-heart"></i></div></a>
  1602. <a href="{ReblogURL}" target="_blank"><i class="fas fa-undo-alt"></i></a>
  1603. </font>
  1604. </div>
  1605. {/block:Date}
  1606.  
  1607. </div>
  1608.  
  1609. {block:Date}
  1610. <div class="tags-notes">
  1611. {block:IfHideTags}
  1612. {block:HasTags}
  1613. <a class="tags-title"><i class="fas fa-ellipsis-h" style="margin-right: 5px;"></i>Show Tags</a>
  1614. <div class="tags">
  1615. {block:Tags}
  1616. <a href="{TagURL}" style="margin-right: 5px;"><font style="color: {color:Main Color};margin-right: 5px;">•</font>{Tag}</a>
  1617. {/block:Tags}
  1618. </div>
  1619. {/block:HasTags}
  1620. {/block:IfHideTags}
  1621. {block:IfShowTags}
  1622. {block:HasTags}
  1623. <div class="tags-alternate">
  1624. {block:Tags}
  1625. <a href="{TagURL}" style="margin-right: 5px;"><font style="color: {color:Main Color};margin-right: 5px;">•</font>{Tag}</a>
  1626. {/block:Tags}
  1627. </div>
  1628. {/block:HasTags}
  1629. {/block:IfShowTags}
  1630. {block:PostNotes}
  1631. {PostNotes}
  1632. {/block:PostNotes}
  1633. </div>
  1634. {block:Date}
  1635.  
  1636. </div>
  1637.  
  1638. {/block:Posts}
  1639.  
  1640. {block:Pagination}
  1641. <div class="pagination">
  1642. {block:PreviousPage}
  1643. <div class="navigation">
  1644. <a href="{PreviousPage}"><i class="fas fa-angle-left" style="margin-right: 5px;"></i>Prev</a>
  1645. </div>
  1646. {/block:PreviousPage}
  1647. <div class="pages">
  1648. {CurrentPage} / {TotalPages}
  1649. </div>
  1650. {block:NextPage}
  1651. <div class="navigation">
  1652. <a href="{NextPage}">Next<i class="fas fa-angle-right" style="margin-left: 5px;"></i></a>
  1653. </div>
  1654. {/block:NextPage}
  1655. </div>
  1656. {/block:Pagination}
  1657.  
  1658. </div>
  1659.  
  1660. </div>
  1661.  
  1662. <div id="credit"><a href="http://ghcstfaec.tumblr.com/" title="ghcstfaec" target="_blank">GHCST</a></div>
  1663.  
  1664. </body>
  1665.  
  1666. </html>
Advertisement
Add Comment
Please, Sign In to add comment