nonspace

THEME #03 :: STATIC

Jan 28th, 2019
1,337
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 5 38.60 KB | None | 0 0
  1. <!DOCTYPE html>
  2.  
  3.   <!--STATIC (Theme #03) by @nonspace.      
  4.    Find more of my work at https://nonspace.tumblr.com  
  5.  
  6.    Don't steal.  
  7.    Don't claim as your own.
  8.    Don't use as base code.
  9.    Editing for personal use is fine!
  10.  
  11.    Need help? Have a look at this themes FAQ:
  12.    https://nonspace.tumblr.com/tagged/theme-help:+static
  13.    Or my general FAQ: https://nonspace.tumblr.com/help/support
  14.  
  15.    If you find any bugs please report them to me.
  16.    -->
  17.  
  18. <html>
  19. <head>
  20.   <meta charset="utf-8">
  21.   <meta name="viewport" content="width=device-width">
  22.   <link rel="icon" type="image/png" href="{Favicon}">
  23.   <link rel="alternate" type="application/rss+xml" href="{RSS}">
  24.   <title>{Title}{block:SearchPage} :: ({lang:Search results for SearchQuery}){/block:SearchPage}{block:TagPage} :: #{Tag}{/block:TagPage}{block:PermalinkPage}{block:PostSummary} :: {PostSummary}{/block:PostSummary}{/block:PermalinkPage}</title>
  25.   {block:Description}
  26.   <meta name="description" content="{MetaDescription}" />
  27.   {/block:Description}
  28.  
  29.   {block:Hidden}
  30.   <meta name="theme-color" content="">
  31.  
  32.   <meta name="image:Background" content="" />
  33.  
  34.   <meta name="if:Scroll Top" content="0" />
  35.   <meta name="if:Fixed Pagination" content="0" />
  36.  
  37.   <meta name="color:Text" content="#4f4f4f" />
  38.   <meta name="color:Background" content="#f7f7f7" />
  39.   <meta name="color:Accent" content="#fa7268" />
  40.   <meta name="color:Accent Text" content="#fff" />
  41.   <meta name="color:Links" content="#8c8c8c" />
  42.   <meta name="color:Link Hover" content="#444444" />
  43.   <meta name="color:Blockquote" content="#efefef" />
  44.   <meta name="color:Title Color" content="#000" />
  45.  
  46.   <meta name="select:Post Width" title="540" content="540" />
  47.   <meta name="select:Post Width" title="700" content="700" />
  48.   <meta name="select:Post Width" title="500" content="500" />
  49.   <meta name="select:Post Width" title="450" content="450" />
  50.   <meta name="select:Post Width" title="400" content="400" />
  51.   <meta name="select:Post Width" title="300" content="300" />
  52.  
  53.   <meta name="text:Font" content="Open Sans" />
  54.   <meta name="text:Font Two" content="Chivo" />
  55.  
  56.   <meta name="text:Font Size" content="16"/>
  57.   <meta name="text:Icon Font Class" content="far fa-moon"/>
  58.  
  59.   <meta name="text:Link One Title" content=""/>
  60.   <meta name="text:Link One URL" content=""/>
  61.  
  62.   <meta name="text:Link Two Title" content=""/>
  63.   <meta name="text:Link Two URL" content=""/>
  64.  
  65.   <meta name="text:Link Three Title" content=""/>
  66.   <meta name="text:Link Three URL" content=""/>
  67.  
  68.   <meta name="text:Link Four Title" content=""/>
  69.   <meta name="text:Link Four URL" content=""/>
  70.  
  71.   <meta name="text:Link Five Title" content=""/>
  72.   <meta name="text:Link Five URL" content=""/>
  73.  
  74.   <meta name="text:Twitter URL" content=""/>
  75.   <meta name="text:Instagram URL" content=""/>
  76.   <meta name="text:Pinterest URL" content=""/>
  77.  
  78.   {/block:Hidden}
  79.  
  80.   <!--FONTS-->
  81.   <link href="https://fonts.googleapis.com/css?family={text:font}|{text:font two}:300,300i,400,400i,700,700i&amp;subset=cyrillic,cyrillic-ext,greek,greek-ext,latin-ext,vietnamese" rel="stylesheet">
  82.  
  83.   <!--FONT AWESOME-->
  84.   <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.0/css/all.css" integrity="sha384-lZN37f5QGtY3VHgisS14W3ExzMWZxybE1SJSEsQp9S+oqd12jhcu+A56Ebc1zFSJ" crossorigin="anonymous">
  85.  
  86.   <link href="//dl.dropbox.com/s/vpi3f9s7nhpe7v7/honeybee.css" rel="stylesheet">
  87.  
  88.   <!--jQUERY-->
  89.   <script src="https://code.jquery.com/jquery-3.1.0.js"></script>
  90.   <script src="https://www.dl.dropboxusercontent.com/s/2ob91mnz4zil9lq/scrollTop.js"></script>
  91.  
  92.   <noscript>
  93.     <style type="text/css">
  94.         #copyright {display: block;}
  95.     </style>
  96.   </noscript>
  97.  
  98. <style>
  99.  
  100. /*GENERAL*/
  101. *{
  102.   box-sizing: border-box;
  103.   padding: 0;
  104.   margin: 0;
  105.   -webkit-font-smoothing: antialiased;
  106.   -moz-osx-font-smoothing: grayscale;
  107. }
  108.  
  109. body, html {
  110.   font: {text:font size}px '{text:font}';
  111.   background: {color:background};
  112.   {block:IfBackgroundImage}
  113.     background: url('{image:Background}');
  114.     background-size: cover;
  115.     background-repeat: no-repeat;
  116.   {/block:IfBackgroundImage}
  117.   position: relative;
  118.   color: {color:text};
  119. }
  120.  
  121. ::selection {
  122.   background: {color:accent};
  123.   color: {color:accent text};
  124. }
  125.  
  126. ::-moz-selection {
  127.   background: {color:accent};
  128.   color: {color:accent text};
  129. }
  130.  
  131. b, strong {
  132.   color: {color:accent};
  133. }
  134.  
  135. a {
  136.   text-decoration: none;
  137.   color: {color:links};
  138. }
  139.  
  140. a:hover {
  141.   color: {color:link hover};
  142. }
  143.  
  144. i {
  145.   {color:links}
  146. }
  147. strike {}
  148.  
  149. pre {
  150.   margin 20px 10px;
  151.   background: {color:blockquote};
  152.   padding: 10px 10px;
  153.   font: {text:font size}px monospace;
  154.   letter-spacing: 0px;
  155.   text-align: left;
  156.   width: 100%;
  157.   line-height: 160%;
  158.   overflow: wrap;
  159.   white-space: pre-wrap;       /* css-3 */
  160.   white-space: -moz-pre-wrap;  /* Mozilla, since 1999 */
  161.   white-space: -pre-wrap;      /* Opera 4-6 */
  162.   white-space: -o-pre-wrap;    /* Opera 7 */
  163.   word-wrap: break-word;
  164. }
  165.  
  166. code {
  167.   font-family: monospace;
  168. }
  169.  
  170. small, sub {
  171.   font-size: calc({text:font size}px - 1px);
  172. }
  173.  
  174. blockquote {
  175.   border-left: 5px solid {color:blockquote};
  176.   margin-left: 15px !important;
  177.   padding: 0 20px 0 20px;
  178. }
  179.  
  180. .npf_color_joey {
  181. color:#ff492f;
  182. }
  183.  
  184. .npf_color_monica {
  185. color:#ff8a00;
  186. }
  187.  
  188. .npf_color_chandler {
  189. color:#973ff4;
  190. }
  191.  
  192. .npf_color_phoebe {
  193. color:#fcf01d;
  194. }
  195.  
  196. .npf_color_rachel {
  197. color:#00b8ff;
  198. }
  199.  
  200. .npf_color_ross {
  201. color:#00cf35;
  202. }
  203.  
  204. .npf_color_niles {
  205. color:#ff62ce;
  206. }
  207.  
  208. .npf_color_frasier {
  209. color:#001935;
  210. }
  211.  
  212. .npf_color_mr_big {
  213. color:#000c1a;
  214. }
  215.  
  216. .permalink blockquote {
  217.   margin: 10px 0;
  218. }
  219.  
  220. .caption ul {
  221.   margin: 20px 0 20px 35px;
  222.   text-align: justify;
  223. }
  224.  
  225. .caption li {
  226.   margin: 5px 0;
  227. }
  228.  
  229. /*headlines*/
  230. h1, h2, h3, h4, h5 {
  231.   font-family: {text:Font Two};
  232. }
  233.  
  234. h1 {
  235.   font-size: calc({text:font size}px + 10px);
  236.   padding: 25px;
  237.   line-height: 100%;
  238. }
  239.  
  240. h3 { /*quote*/
  241.   font-size: calc({text:font size}px + 5px);
  242. }
  243.  
  244. input#mobile_button {
  245.   display: none;
  246. }
  247.  
  248. #mobile_menu {
  249.   display: none;
  250. }
  251.  
  252. /*transitions*/
  253. a, body > iframe:first-child,
  254. #tumblr_controls,
  255. .post_header i,
  256. nav ul i,
  257. aside ul i,
  258. .custom_like_button,
  259. .buttons i {
  260.   -ms-transition: 0.5s;
  261.   -moz-transition: 0.5s;
  262.   -webkit-transition: 0.5s;
  263.   transition: 0.5s;
  264. }
  265.  
  266. /*animations*/
  267. main {
  268. -webkit-animation: fadein 2s; /* Safari, Chrome and Opera > 12.1 */
  269.   -moz-animation: fadein 2s; /* Firefox < 16 */
  270.  -ms-animation: fadein 2s; /* Internet Explorer */
  271.  -o-animation: fadein 2s; /* Opera < 12.1 */
  272.  animation: fadein 2s;
  273. }
  274.  
  275. aside{
  276.  -webkit-animation: fadein 1s; /* Safari, Chrome and Opera > 12.1 */
  277.   -moz-animation: fadein 1s; /* Firefox < 16 */
  278.  -ms-animation: fadein 1s; /* Internet Explorer */
  279.  -o-animation: fadein 1s; /* Opera < 12.1 */
  280.  animation: fadein 1s;
  281. }
  282.  
  283. @keyframes fadein {
  284.    from { opacity: 0; }
  285.    to   { opacity: 1; }
  286. }
  287.  
  288.  
  289.  
  290. /*LAYOUT*/
  291.  
  292. #tumblr_controls {display: none; z-index: 9;}
  293.  
  294. #wrapper {
  295.  display: flex;
  296.  flex-direction: row;
  297.  width: 100%;
  298.  height: auto;
  299.  margin: 0 auto;
  300. }
  301.  
  302. /*post container*/
  303. main {
  304.  position: relative;
  305.  height: auto;
  306.  width: calc(100vw - 560px);
  307.  margin-left: 560px;
  308. }
  309.  
  310. /*sidebar*/
  311. aside {
  312.  position: fixed;
  313.  left: 50px;
  314.  bottom: 50px;
  315.  display: flex;
  316.  flex-direction: column;
  317.  justify-content: center;
  318.  height: 100%;
  319.  width: 510px;
  320.  padding: 100px;
  321. }
  322.  
  323. /*footer*/
  324. footer {
  325.  height: 50px;
  326.  width: calc(100% - 560px);
  327.  margin-left: 560px;
  328.  background: {color:accent};
  329.  color: {color:accent text};
  330.  text-align: center;
  331. }
  332.  
  333. {block:IfFixedPagination}
  334.  footer {
  335.    position: fixed;
  336.    bottom: 0;
  337.  }
  338.  
  339.  #nnspc, #copyright {
  340.    position: fixed !important;
  341.    bottom: 50px;
  342.  }
  343.  
  344.  #scrolltop {
  345.    position: fixed !important;
  346.    bottom: 100px;
  347.  }
  348. {/block:IfFixedPagination}
  349.  
  350. #copyright {
  351.  display: none;
  352. }
  353.  
  354.  
  355. /*SIDEBAR*/
  356. #page_title {
  357.  
  358. }
  359.  
  360. #page_title h1 {
  361.  color: {color:title color};
  362.  font-size: calc({text:font size}px + 15px);
  363. }
  364.  
  365. #desc {
  366.  font-size: calc({text:font size}px - 1px);
  367.  line-height: 150%;
  368. }
  369.  
  370. #desc span:empty {
  371.  padding: 0;
  372. }
  373.  
  374. #side_img {
  375.  display: none;
  376.  width: 100%;
  377.  height: 250px;
  378.  object-fit: cover;
  379. }
  380.  
  381. {block:ifSidebarImage}
  382. #side_img {
  383.  display: ;
  384. }
  385. {/block:ifSidebarImage}
  386.  
  387. nav {
  388.  position: fixed;
  389.  left: 0;
  390.  width: 50px;
  391.  height: 100%;
  392.  background: {color:accent};
  393.  padding: 0px 0px;
  394. }
  395.  
  396. nav ul {
  397.  position: absolute;
  398.  bottom: 0px;
  399.  left: 50px;
  400.  -webkit-transform: rotate(-90deg);
  401.  -ms-transform: rotate(-90deg);
  402.  transform: rotate(-90deg);
  403.  transform-origin: bottom left;  
  404.  height: 50px;
  405.  width: 100vh;
  406.  display: flex;
  407.  list-style-type: none;
  408. }
  409.  
  410. nav li a, nav li i {  
  411.  display: flex !important;
  412.  align-items: center;
  413.  height: 50px;
  414.  padding: 0 25px;
  415.  color: {color:accent text};
  416.  text-transform: uppercase;
  417.  font-size: 14px;
  418. }
  419.  
  420. nav li a {
  421.  font-family: {text:font two};
  422. }
  423.  
  424. nav li i {
  425.  justify-content: center;
  426.  font-size: 20px;
  427. }
  428.  
  429. nav li i {
  430.  background: {color:accent text};
  431.  color: {color:accent};
  432.  width: 50px;
  433.  -webkit-transform: rotate(90deg);
  434.  -ms-transform: rotate(90deg);
  435.  transform: rotate(90deg);
  436. }
  437.  
  438. nav li i:hover {
  439.  -webkit-transform: rotate(360deg);
  440.  -moz-transform: rotate(360deg);
  441.  -ms-transform: rotate(360deg);
  442.  -o-transform: rotate(360deg);
  443.  background: {color:accent};
  444.  color: {color:accent text};
  445. }
  446.  
  447. aside ul {
  448.  list-style-type: none;
  449.  margin: 25px;
  450. }
  451.  
  452. aside ul li {
  453.  margin: 5px 0;
  454. }
  455.  
  456. aside ul li a {
  457.  color: {color:text};
  458.  font-family: {text:font two};
  459. }
  460.  
  461. aside ul li i, .post_header i {
  462.  padding: 8px;
  463.  background: {color:accent};
  464.  color: {color:accent text};
  465.  margin-right: 10px;
  466. }
  467.  
  468. #search_bar {
  469.  position: fixed;
  470.  left: 50px;
  471.  bottom: 0;
  472.  width: 510px;
  473.  display: flex;
  474.  flex-direction: row;
  475. }
  476.  
  477. #search_bar form {
  478.  flex: 1;
  479. }
  480.  
  481. #search_bar input, #search_bar select, #search_bar textarea{
  482.  height: 50px;
  483.  width: 100%;
  484.  border: 0;
  485.  padding: 20px;
  486.  font-size: {text:font size}px;
  487. }
  488.  
  489. #search_bar input:focus {
  490.  border: 0;
  491.  box-shadow: none;
  492.  outline: 0;
  493. }
  494.  
  495. #search_bar a, #search_bar .fa-search {
  496.  height: 50px;
  497.  width: 50px;
  498.  color: {color:links};
  499.  background: rgba(127,127,127,0.05);
  500.  font-size: 20px;
  501.  padding: 15px;
  502. }
  503.  
  504. #search_bar a:nth-of-type(2n) {
  505.  background: rgba(127,127,127,0.1);
  506. }
  507.  
  508. #search_bar a:hover {
  509.  background: {color:accent};
  510.  color: {color:accent text};
  511.  cursor: pointer;
  512. }
  513.  
  514. /*POSTS*/
  515. .article_wrapper {
  516.  padding: 80px 20px;
  517. }
  518.  
  519. {block:PermalinkPage}
  520. .article_wrapper {
  521.  padding-bottom: 0;
  522. }
  523. {/block:PermalinkPage}
  524.  
  525. .article_wrapper:nth-of-type(2n) {
  526.  background: rgba(127,127,127,.05);
  527. }
  528.  
  529. article {
  530.  max-width: {select:post width}px;
  531. }
  532.  
  533. .post {
  534.  display: flex;
  535.  flex-direction: column;
  536.  position: relative;
  537.  height: auto;
  538.  margin: auto;
  539.  max-width: {select:post width};
  540.  color: {color:text};
  541. }
  542.  
  543. .post_header {
  544.  display: flex;
  545.  flex-direction: row;
  546.  flex-wrap: wrap;
  547.  font-family: {text:font two};
  548.  align-items: center;
  549.  margin-bottom: 10px;
  550. }
  551.  
  552. .pinfo > img {
  553.   width: 50px;
  554. }
  555.  
  556. .post_body {
  557.   max-width: {select:post width};
  558. }
  559.  
  560. .cpt {
  561.   max-width: {select:post width}px;
  562. }
  563.  
  564. .post_footer {
  565.   display: flex;
  566.   justify-content: space-between;
  567.   margin: 10px 0 0 0;
  568.   width: 100%;
  569. }
  570.  
  571. .post_title {
  572.   width: 100%;
  573. }
  574.  
  575. .post_title h1 {
  576.   line-height: 150%;
  577.   color: {color:title color};
  578.   padding: 15px 0;
  579. }
  580.  
  581. /*CAPTIONS & UNNEST*/
  582. .caption {
  583.  margin-top: 0px;
  584.   line-height: 150%;
  585.   text-align: justify;
  586. }
  587.  
  588. .reblog_list {
  589.   background: {color:post background};
  590. }
  591.  
  592. .reblog_body, .caption {
  593.   padding: 15px 0 25px;
  594. }
  595.  
  596. .caption h2 {
  597.   margin-bottom: 10px; width: 100%; text-align: left;
  598. }
  599.  
  600. .caption p a,
  601. .caption ul a {
  602.   padding: 0 0px;
  603.   box-shadow: inset 0 -2px {color:accent};
  604. }
  605.  
  606. .caption a:hover {
  607.   box-shadow: inset 0 -50px {color:accent};
  608.   color: {color:accent text};
  609. }
  610.  
  611. .caption p {}
  612.  
  613. .caption *, #desc * {
  614.   margin: 15px 0;
  615. }
  616.  
  617. .caption p:empty, #desc p:empty {
  618.   margin: 0;
  619. }
  620.  
  621. .caption p:only-child {
  622.   margin: 0;
  623. }
  624.  
  625. .caption :first-child {
  626.   margin-top: 0;
  627. }
  628.  
  629. .caption :last-child, #desc :last-child {
  630.   margin-bottom: 0;
  631. }
  632.  
  633. .caption > :only-child {
  634.   margin: 0 auto;
  635. }
  636.  
  637. .caption :first-child:not(:empty) {
  638.   margin-top: 0;
  639. }
  640.  
  641. .caption blockquote p {
  642.   margin: 0 auto;
  643. }
  644.  
  645. .caption img {
  646.   max-width: 100%;
  647. }
  648.  
  649. .caption hr {
  650.   border-style: solid;
  651.   color: {color:accent};
  652. }
  653.  
  654. .reblog_parent {
  655.   padding: 0px 0px 0px 0px;
  656.   margin: 0px 0px;
  657. }
  658.  
  659. .reblog_parent:first-child {
  660.   margin-top: 0;
  661. }
  662.  
  663. .reblog_parent:last-child {
  664.   margin-bottom: 0;
  665. }
  666.  
  667. .reblog_header,
  668. .asker,
  669. .answerer {
  670.   display: flex;
  671.   align-items: center;
  672.   font-family: {text:Font Two};
  673.   text-transform: uppercase;
  674.   color: {color:accent};
  675.   margin-top: 15px;
  676. }
  677.  
  678. .reblog_header img,
  679. .reblog_header i,
  680. .asker img,
  681. .answerer img {
  682.   height: 32px;
  683.   margin-right: 10px;
  684. }
  685.  
  686. .answerer {
  687.   margin-top: 0;
  688.  
  689. }
  690.  
  691. /*deactivated user*/
  692. .reblog_header i {
  693.   display: flex;
  694.   align-items: center;
  695. }
  696.  
  697. .answerer {
  698.   flex-direction: row-reverse;
  699. }
  700.  
  701. .answerer img {
  702.   margin: 0 0 0 10px;
  703. }
  704.  
  705. .reblog_body {
  706.   margin-top: 0px;
  707. }
  708.  
  709. .reblog_header a,
  710. .asker,
  711. .answerer {
  712.   text-decoration: none;
  713.   color: {color:accent};
  714. }
  715.  
  716. .reblog .qh,
  717. .reblog .lh,
  718. .reblog .audio_post,
  719. .reblog .spotify_audio_player,
  720. .reblog .soundcloud_audio_player  {
  721.   margin-bottom: 20px;
  722. }
  723.  
  724. .reblog.chat .reblog-list  {
  725.   display: none;
  726. }
  727.  
  728. /*POST TYPES*/
  729.  
  730. /*photo*/
  731. .post_photo img {
  732.   max-width: 100%;
  733.   line-height: 100%;
  734. }
  735.  
  736. /*photoset*/
  737. iframe.photoset {
  738.   max-width: {select:post width}px;
  739. }
  740.  
  741. /*link*/
  742. .lh a {
  743.   padding: 0 5px;
  744.   color: {color:accent text};
  745. }
  746. .lh.caption {
  747.   background: {color:accent};
  748.   padding: 15px;
  749. }
  750.  
  751. /*chat*/
  752. .chat_lines {
  753.   padding: 10px;
  754. }
  755.  
  756. .chat_lines.odd {
  757.   background: {color:accent};
  758.   color: {color:accent text};
  759. }
  760.  
  761. .chat_lines.odd b {
  762.   color: {color:accent text};
  763. }
  764.  
  765. /*video*/
  766. .tumblr_video_container {
  767.   position: relative;
  768.   overflow: hidden;
  769.   padding-top: 56.25%;
  770.   width: 100%!important;
  771.   height: 100%!important;
  772. }
  773.  
  774. .tumblr_video_iframe {
  775.   position: absolute;
  776.   top: 0;
  777.   left: 0;
  778.   width: 100%!important;
  779.   height: 100%!important;
  780.   border: 0;
  781. }
  782.  
  783. .tumblr_video_container {
  784.   max-height: 540px!important;
  785.   overflow: hidden;
  786.   margin-bottom: 5px;
  787. }
  788.  
  789. #youtube_iframe {
  790.   width: 100%!important;
  791. }
  792.  
  793. /*ask*/
  794. .asker a,
  795. .answerer a {
  796.   padding: 5px;
  797.   color: {color:accent text};
  798. }
  799.  
  800. .question {
  801.   margin-bottom: 15px;
  802.   padding: 5px 15px;
  803.   background: {color:blockquote};
  804. }
  805.  
  806. .question .caption,
  807. .question .caption a {
  808.   margin-bottom: 0;
  809. }
  810.  
  811. .answerer .caption {
  812.   margin-top: 5px;
  813. }
  814.  
  815. .answerer ~ .caption {
  816.   margin-bottom: 25px;
  817. }
  818.  
  819. .answerer {
  820.   text-align: right;
  821.   margin-bottom: 0px;
  822.   background: {color:accent};
  823. }
  824.  
  825. /*audio*/
  826. .spotify_audio_player,
  827. .soundcloud_audio_player  {
  828.   width: 100%; height: 80px;
  829. }
  830.  
  831. .audio_post {
  832.   width: 100%; display: flex;
  833.   flex-wrap: wrap;
  834.   align-items: center;
  835. }
  836.  
  837. .audio_player {
  838.   position: relative;
  839.   margin-right: 25px;
  840. }
  841.  
  842. .audio_player img {
  843.   width: 150px;
  844. }
  845.  
  846. .play_button {
  847.   position: absolute;
  848.   height: 50px;
  849.   width: 50px;
  850.   top: 40px;
  851.   left: 45px;
  852.   border-radius: 50%;
  853.   overflow: hidden;
  854. }
  855.  
  856. .tumblr_audio_player {
  857.   width: 150px;
  858.   height: 150px;
  859.   transform: scale(2.1);
  860.   padding: 37px 33.5px;
  861. }
  862.  
  863. .audio_info ul {
  864.   flex-grow: 1;
  865.   overflow-y: auto;
  866. }
  867.  
  868. .audio_info ul span {
  869.   background: {color:accent};
  870.   color: {color:accent text};
  871.   font-weight: normal;
  872.   text-transform: capitalize;
  873.   margin: 0px 20px 0 0;
  874.   padding: 0 10px;
  875. }
  876.  
  877. .audio_info ul li {
  878.   display: flex;
  879.   justify-content: space-between;
  880.   align-items: center;
  881.   text-align: right;
  882.   padding: 5px 0;
  883.   line-height: 200%;
  884. }
  885.  
  886. .audio_info ul li:first-of-type {padding-top: 0;}
  887. .audio_info ul li:last-of-type {padding-bottom: 0;}
  888. .audio_info ul li:only-of-type {padding: 0;}
  889.  
  890. /*POST INFO*/
  891. .post_info {
  892.   display: flex;
  893.   flex-direction: row-reverse;
  894.   justify-content: space-between;
  895. }
  896.  
  897. .post_header i,
  898. .pdate a,
  899. .pnotes a {
  900.   display: flex;
  901.   align-items: center;
  902.   justify-content: center;
  903. }
  904.  
  905. .post_header .pinfo {
  906.   background: rgba(127,127,127,0.1);
  907. }
  908.  
  909. .post_header .pinfo a:hover {
  910.   background: {color:accent};
  911.   color: {color:accent text};
  912. }
  913.  
  914. .pinfo img {
  915.   height: 50px;
  916.   width: 50px;
  917. }
  918.  
  919. .ptags {
  920.   max-width: {select:post width}px;
  921.   margin: 5px 0;
  922.   line-height: 250%;
  923. }
  924.  
  925. .ptags a {
  926.   font-size: calc({text:font size}px - 1px);
  927.   font-family: {text:font two};
  928.   margin: 0 10px 0 0;
  929.   color: {color:accent text};
  930.   padding: 10px 10px;
  931.   background: {color:accent};
  932. }
  933.  
  934. .pdate {
  935.   padding: 0px;
  936.   text-transform: uppercase;
  937.   width: auto;
  938. }
  939.  
  940. .pdate a {
  941.   background: rgba(255,255,255,0.05);
  942. }
  943.  
  944. .pnotes {
  945.   text-align: right;
  946. }
  947.  
  948. .pnotes a {
  949.   background: rgba(255,255,255,0.1);
  950. }
  951.  
  952. .pdate a,
  953. .pnotes a {
  954.   padding: 0 15px 0 0; height: 100%;
  955. }
  956.  
  957. .pdate a
  958.  
  959. .answer .rblg {
  960.   display: none;
  961. }
  962.  
  963. /*BUTTONS & CONTROLS*/
  964. .buttons {
  965.  display: flex;
  966.   justify-self: flex-end;
  967.   margin-left: auto;
  968. }
  969.  
  970. .buttons a,
  971. .buttons i,
  972. .custom_like_button {
  973.   font-size: calc({text:font size}px + 4px);
  974.   color: {color:links};
  975. }
  976.  
  977. .buttons a:hover,
  978. .buttons i:hover {
  979.   color: {color:accent};
  980. }
  981.  
  982. .custom_like_button {
  983.   position: relative;
  984.   margin-left: 10px;
  985. }
  986.  
  987. .custom_like_button:hover {cursor: pointer;}
  988. .like_button {
  989.   position: absolute;
  990.   top: 0;
  991.   left: 0;
  992.   width: 100%;
  993.   height: 100%;
  994.   z-index: 9;
  995.   opacity: 0.0001;
  996. }
  997.  
  998. .like_button.liked + i {
  999.   color: {color:accent};
  1000. }
  1001.  
  1002.  
  1003. /*PAGINATION*/
  1004. #pagination {
  1005.  position: relative;
  1006.  height: 100%;
  1007.  display: flex;
  1008.   justify-content: center;
  1009.   align-items: center;
  1010. }
  1011.  
  1012. #pagination a, #pagination b {
  1013.   display: flex;
  1014.   align-items: center;
  1015.   justify-content: center;
  1016.   color: {color:accent text};
  1017.   width: 50px;
  1018.   height: 100%;
  1019.   background: rgba(255,255,255,0.1);
  1020.   font-family: {text:font two};
  1021. }
  1022.  
  1023. #pagination a:nth-of-type(2n) {
  1024.   background: rgba(255,255,255,0.15);
  1025. }
  1026.  
  1027. #pagination a:hover {
  1028.   background: none;
  1029. }
  1030.  
  1031. #pagination b {
  1032.   color: {color:accent text};
  1033.   background: {color:accent};
  1034. }
  1035.  
  1036. #pagination b,
  1037. #pagination a,
  1038. #pagination i {
  1039.   font-size: 25px;
  1040. }
  1041.  
  1042.  
  1043. /*tags, search, etc headlines*/
  1044. .tag_info {
  1045.   position: relative;
  1046.   max-width: {select:post width}px;
  1047.   margin: 80px auto;
  1048. }
  1049.  
  1050. .tag_info:after {
  1051.   position: absolute;
  1052.   content: "";
  1053.   width: 15%;
  1054.   height: 5px;
  1055.   background: {color:accent};
  1056.   background-image: -webkit-linear-gradient(left, transparent 0%, {color:accent} 50%, transparent 100%);
  1057.   background-image: -moz-linear-gradient(left,  transparent 0%, {color:accent} 50%, transparent 100%);
  1058.   background-image: -o-linear-gradient(left,  transparent 0%, {color:accent} 50%, transparent 100%);
  1059.   background-image: linear-gradient(to right, {color:accent} 80%, transparent 100%);
  1060. }
  1061.  
  1062. .tag_info h2 {
  1063.   text-align: left;
  1064. }
  1065.  
  1066. .no_post h2 {
  1067.   background: none;
  1068. }
  1069.  
  1070.  
  1071. /*PERMALINK*/
  1072. .permalink {
  1073.   position: relative;
  1074.   max-width: {select:post width}px;
  1075.   margin: 25px auto 100px auto;
  1076. }
  1077.  
  1078. .pl i,
  1079. .pl a {
  1080.   margin: 0 5px 5px 0;
  1081. }
  1082.  
  1083. .plnotes {
  1084.   margin: 25px 0;
  1085.   max-width: {select:post width}px;
  1086. }
  1087.  
  1088. .plnotes ol {
  1089.   margin: 50px 0;
  1090.   padding: 0;
  1091.   list-style-type: none;
  1092. }
  1093.  
  1094. .plnotes ol li {
  1095.   margin: 5px 0;
  1096.   padding: 0;
  1097.   font-size: calc({text:font size}px - 1px);
  1098.   color: {color:links};
  1099. }
  1100.  
  1101. .plnotes ol li a {
  1102.   text-transform: uppercase;
  1103.   margin: 0 5px;
  1104.   color: {color:links};
  1105.   font-family: {text:font two};
  1106.   font-size: calc({text:font size}px - 1px);
  1107. }
  1108.  
  1109. .plnotes ol li blockquote a {
  1110.   text-transform: none;
  1111.   font-weight: normal;
  1112. }
  1113.  
  1114. .plnotes img {
  1115.   display: none;
  1116.   vertical-align: middle;
  1117. }
  1118.  
  1119. .plnotes img,
  1120. .plnotes a {
  1121.   margin: 0 5px 0 0;
  1122. }
  1123.  
  1124. .avatar_frame {
  1125.   display: none;
  1126. }
  1127.  
  1128. .more_notes_link_container {
  1129.   margin-top: 50px!important;
  1130. }
  1131.  
  1132. .more_notes_link_container a {
  1133.   font-style: normal!important;
  1134. }
  1135.  
  1136. .note.like::before,
  1137. .note.reblog::before,
  1138. .note.reply::before {
  1139.   font-family: 'Font Awesome 5 Free','Font Awesome 5 Brands';
  1140.   font-weight: 900;
  1141.   display: inline-block;
  1142. }
  1143.  
  1144. .note.reblog::before {
  1145.   content: "\f079";
  1146.   display: inline;
  1147.   width: 1.25em;
  1148. }
  1149.  
  1150. .note.like::before {
  1151.   content: "\f004";
  1152.   display: inline;
  1153.   width: 1.25em;
  1154. }
  1155.  
  1156. .note.reply::before {
  1157.   width: 1.25em;
  1158.   display: inline-block;
  1159.   text-align:center;
  1160.   content: "\f075";
  1161. }
  1162.  
  1163. #scrolltop {
  1164.   position: fixed;
  1165.   right: 30px;
  1166.   font-size: 25px;
  1167.   padding: 15px 20px;
  1168.   filter: opacity(0.3);
  1169.   cursor: pointer;
  1170.   display: none;
  1171.   z-index: 8;
  1172.   background: {color:accent};
  1173.   -webkit-animation: fadein 1s; /* Safari, Chrome and Opera > 12.1 */
  1174.   -moz-animation: fadein 1s; /* Firefox < 16 */
  1175.  -ms-animation: fadein 1s; /* Internet Explorer */
  1176.  -o-animation: fadein 1s; /* Opera < 12.1 */
  1177.  animation: fadein 1s;
  1178. }
  1179.  
  1180. #scrolltop i {
  1181.  color: {color:accent text};
  1182. }
  1183.  
  1184. #scrolltop:hover {
  1185.  filter: opacity(1);
  1186. }
  1187.  
  1188. #scrolltop:focus {
  1189.  outline:0;
  1190. }
  1191.  
  1192. #nnspc {
  1193.  background: {color:accent} !important;
  1194.  color: {color:accent text} !important;
  1195. }
  1196.  
  1197. /*OTHER PAGES*/
  1198. {block:AskPage}
  1199. .caption {
  1200.  line-height: 100%;
  1201.  background: none;
  1202.  padding: 0;}
  1203. {/block:AskPage}
  1204.  
  1205. {block:SubmitPage}
  1206. .caption {
  1207.  line-height: 100%;
  1208.  background: none;
  1209.  padding: 0;
  1210. }
  1211. {/block:SubmitPage}
  1212.  
  1213. /*HOVER*/
  1214. nav a:hover,
  1215. .post_header i:hover,
  1216. .ptags a:hover {
  1217.  background: rgba(255,255,255,0.1);
  1218.  color: {color:accent text};  
  1219. }
  1220.  
  1221. .ptags a:hover {
  1222.  color: {color:text};
  1223.  cursor: pointer;
  1224. }
  1225.  
  1226. aside ul li a:hover {
  1227.  color: {color:accent};
  1228. }
  1229.  
  1230. /*MEDIA QUERIES*/
  1231. @media only screen and (max-width: 1100px) {
  1232.  aside {
  1233.    position: fixed;
  1234.    flex-direction: row;
  1235.    justify-content: unset;
  1236.    height: 50px;
  1237.    width: 100%;
  1238.    z-index: 8;
  1239.    top: 0;
  1240.    left: 0;
  1241.    padding: 0;
  1242.    background: {color:accent};
  1243.  }
  1244.  
  1245.  nav,
  1246.  #desc,
  1247.  #search_bar,
  1248.  aside ul {
  1249.    display: none;
  1250.  }
  1251.  
  1252.  #page_title {
  1253.    height: 50px;
  1254.  }
  1255.  
  1256.  #page_title h1 {
  1257.    padding: 10px 15px;
  1258.    color: {color:accent text};
  1259.  }
  1260.  
  1261.  main,
  1262.  footer {
  1263.    margin: 0 auto;
  1264.    width: 100vw;
  1265.  }
  1266.  
  1267.  #scrolltop {
  1268.    display: none;
  1269.  }
  1270.  
  1271.  #mobile_menu, #mobile_button {
  1272.    display: block;
  1273.  }
  1274.  
  1275.  #mobile_menu {
  1276.    height: 0px;
  1277.    display: block;
  1278.    overflow: hidden;
  1279.    padding: 0 0 0;
  1280.    list-style-type: none;
  1281.    transition: height 0.5s ease-out;
  1282.    position: fixed;
  1283.    min-width: 100%;
  1284.    top: 73px;
  1285.    background: {color:background};
  1286.    z-index: 99;
  1287.    text-align: center;
  1288.    overflow-y: auto;
  1289.  }
  1290.  
  1291.  #mobile_menu li {
  1292.    padding: 10px 20px;
  1293.  }
  1294.  
  1295.  #mobile_menu li a {
  1296.    color: {color:text};
  1297.    font-size: calc({text:font size}px + 10px);
  1298.    text-transform: capitalize;
  1299.  }
  1300.  
  1301.  #tumblr_controls {
  1302.    display: block;
  1303.    position: fixed;
  1304.    top: 0px;
  1305.    right: 0;
  1306.    padding: 10px 20px;
  1307.    font-size: 22px;
  1308.    background: {color:accent};
  1309.    color: {color:accent text};
  1310.    visibility: visible;
  1311.    height: 50px;
  1312.    z-index: 9;
  1313.  }
  1314.  
  1315.  label#tumblr_controls:hover,
  1316.  input#mobile_button:checked ~ label {
  1317.    cursor: pointer;
  1318.    background:{color:border two};
  1319.  }
  1320.  
  1321.  input#mobile_button:checked ~ ul#mobile_menu {
  1322.    height: calc(100% - 73px);
  1323.    transition: height 0.5s ease-in;
  1324.    padding: 35px 0 0 0;
  1325.  }
  1326. }
  1327.  
  1328. {CustomCss}
  1329.  
  1330. </style>
  1331.  
  1332. </head>
  1333.  
  1334. <body>
  1335.   {block:ifScrollTop}
  1336.   <div id="scrolltop" role="button" tabindex="0"><i class="fas fa-arrow-up"></i></div>
  1337.   {/block:ifScrollTop}
  1338. <!--CONTROLS & MOBILE--------------------------------------------------->
  1339.   <!--MOBILE NAVIGATION-->
  1340.   <input id="mobile_button" type="checkbox" name="mobile_menu" />
  1341.   <label id="tumblr_controls" for="mobile_button"><i class="fas fa-bars"></i></label>
  1342.   <ul id="mobile_menu">
  1343.     <li><a href="/" title="Home">Home</a></li>
  1344.     {block:AskEnabled}
  1345.     <li><a href="/ask" title="{AskLabel}">{AskLabel}</a></li>
  1346.     {/block:AskEnabled}
  1347.     {block:SubmissionsEnabled}
  1348.     <li><a href="/submit" title="{SubmitLabel}">{SubmitLabel}
  1349.       </a>
  1350.     </li>
  1351.     {/block:SubmissionsEnabled}
  1352.     <!--custom links-->
  1353.     {block:HasPages}
  1354.     {block:Pages}
  1355.     <li><a href="{URL}">{Label}
  1356.       </a>
  1357.     </li>
  1358.     {/block:Pages}
  1359.     {/block:HasPages}
  1360.     {block:Iflinkoneurl}
  1361.     <li><a href="{text:link one url}">{text:link one title}
  1362.       </a>
  1363.     </li>
  1364.     {/block:Iflinkoneurl}
  1365.     {block:Iflinktwourl}
  1366.     <li><a href="{text:link two url}">{text:link two title}
  1367.       </a>
  1368.     </li>
  1369.     {/block:Iflinktwourl}
  1370.     {block:Iflinkthreeurl}
  1371.     <li><a href="{text:link three url}">{text:link three title}
  1372.       </a>
  1373.     </li>
  1374.     {/block:Iflinkthreeurl}
  1375.     {block:Iflinkfoururl}
  1376.     <li><a href="{text:link four url}">{text:link four title}
  1377.       </a>
  1378.     </li>
  1379.     {/block:Iflinkfoururl}
  1380.     {block:Iflinkfiveurl}
  1381.     <li><a href="{text:link five url}"> {text:link five title}
  1382.       </a>
  1383.     </li>
  1384.     {/block:Iflinkfiveurl}
  1385.   </ul>
  1386. <!--CONTROLS END-------------------------------------------------------->
  1387.  
  1388. <!--CONTAINER----------------------------------------------------------->
  1389.   <div id="wrapper">
  1390.     <nav>
  1391.       <ul>
  1392.         <li><i class="{text:Icon Font Class}"></i></li>
  1393.         <li><a href="/" title="Home">Home</a></li>
  1394.         {block:AskEnabled}
  1395.         <li><a href="/ask" title="{AskLabel}">{AskLabel}</a></li>
  1396.         {/block:AskEnabled}
  1397.         {block:SubmissionsEnabled}
  1398.         <li><a href="/submit" title="{SubmitLabel}">{SubmitLabel}</a></li>
  1399.         {/block:SubmissionsEnabled}
  1400.         <li><a href="/archive" title="Archive">{lang:Archive}</a></li>
  1401.       </ul>
  1402.     </nav>
  1403.     <aside>
  1404.       <!--PAGE TITLE & ICON-->
  1405.       <div id="page_title">
  1406.         <a href="/">
  1407.           <h1>{Title}</h1>
  1408.         </a>
  1409.       </div>
  1410.       {block:ifSidebarImage}
  1411.       <img id="side_img" src="{image:sidebar}">
  1412.       {/block:ifSidebarImage}
  1413.       {block:ShowDescription}
  1414.       {block:Description}
  1415.       <div id="desc">
  1416.         {Description}
  1417.       </div>
  1418.       {/block:Description}
  1419.       {/block:ShowDescription}
  1420.         <ul>
  1421.           <!--custom links-->
  1422.           {block:HasPages}
  1423.           {block:Pages}
  1424.           <li><i class="fas fa-link"></i><a href="{URL}">{Label}
  1425.             </a>
  1426.           </li>
  1427.           {/block:Pages}
  1428.           {/block:HasPages}
  1429.           {block:Iflinkoneurl}
  1430.           <li><i class="fas fa-link"></i><a href="{text:link one url}">{text:link one title}
  1431.             </a>
  1432.           </li>
  1433.           {/block:Iflinkoneurl}
  1434.           {block:Iflinktwourl}
  1435.           <li><i class="fas fa-link"></i><a href="{text:link two url}">{text:link two title}
  1436.             </a>
  1437.           </li>
  1438.           {/block:Iflinktwourl}
  1439.           {block:Iflinkthreeurl}
  1440.           <li><i class="fas fa-link"></i><a href="{text:link three url}">{text:link three title}
  1441.             </a>
  1442.           </li>
  1443.           {/block:Iflinkthreeurl}
  1444.           {block:Iflinkfoururl}
  1445.           <li><i class="fas fa-link"></i><a href="{text:link four url}">{text:link four title}
  1446.             </a>
  1447.           </li>
  1448.           {/block:Iflinkfoururl}
  1449.           {block:Iflinkfiveurl}
  1450.           <li><i class="fas fa-link"></i><a href="{text:link five url}"> {text:link five title}
  1451.             </a>
  1452.           </li>
  1453.           {/block:Iflinkfiveurl}
  1454.         </ul>
  1455.     </aside>
  1456.    
  1457.     <div id="search_bar">
  1458.       <i class="fas fa-search"></i>
  1459.       <form action="/search" method="get">
  1460.           <input id="search_input" type="text" name="q"
  1461.            value="{SearchQuery}" placeholder="{lang:Search}...">
  1462.       </form>
  1463.       {block:IfTwitterUrl}
  1464.       <a href="{text:twitter url}"><i class="fab fa-twitter"></i></a>
  1465.       {/block:IfTwitterUrl}
  1466.       {block:IfInstagramUrl}
  1467.       <a href="{text:instagram url}"><i class="fab fa-instagram"></i></a>
  1468.       {/block:IfInstagramUrl}
  1469.       {block:IfPinterestUrl}
  1470.       <a href="{text:pinterest url}"><i class="fab fa-pinterest-p"></i></a>
  1471.       {/block:IfPinterestUrl}
  1472.     </div>
  1473.    
  1474. <!--POST CONTAINER------------------------------------------------------>
  1475.     <main>
  1476.       <!--TAG & SEARCH RESULT INFO-->
  1477.       {block:TagPage}
  1478.       <div class="tag_info">
  1479.         <h1><span></span>
  1480.           Posts tagged "{Tag}"
  1481.         </h1>
  1482.       </div>
  1483.       {block:TagPage}
  1484.       {block:SearchPage}
  1485.       <div class="tag_info">
  1486.         <h1><span></span>
  1487.           {SearchResultCount} results for "{SearchQuery}"
  1488.         </h1>
  1489.       </div>
  1490.       {block:SearchPage}
  1491.       {block:NoPosts}
  1492.       <div class="tag_info no_post">
  1493.         <h1>No posts found.</h1>
  1494.       </div>
  1495.       {/block:NoPosts}
  1496.       <!--POSTS-->
  1497.       {block:Posts}
  1498.       <div class="article_wrapper">
  1499.         <article id="{PostID}" class="post {PostType} {TagsAsClasses}">
  1500.           {block:IndexPage}
  1501.           <div class="post_header">
  1502.             {block:Title}
  1503.               <div class="post_title">
  1504.                 <h1>{Title}</h1>
  1505.               </div>
  1506.               {/block:Title}
  1507.             {block:Date}
  1508.             <div class="pdate pinfo">
  1509.               <a href="{Permalink}"><i class="far fa-clock"></i> {DayOfMonthWithZero} {ShortMonth} {Year}</a>
  1510.             </div>
  1511.             {/block:Date}
  1512.             <div class="pnotes pinfo">
  1513.               <a href="{Permalink}"><i class="far fa-star"></i> {NoteCount}</a>
  1514.             </div>
  1515.           </div>
  1516.           <!--post_header-->
  1517.           {/block:IndexPage}
  1518.           <!--POST BODY-->
  1519.           <div class="post_body">
  1520.             <div class="cpt">
  1521.               <!--TEXT-->
  1522.               {block:Text}
  1523.               {block:NotReblog}
  1524.               <div class="caption">
  1525.                 {Body}
  1526.               </div>
  1527.               {block:NotReblog}
  1528.               {/block:Text}
  1529.               <!--PHOTO-->
  1530.               {block:Photo}
  1531.               <div class="post_photo">
  1532.                 {LinkOpenTag}
  1533.                 <img src="{PhotoURL-HighRes}" alt="{PhotoAlt}">
  1534.                 {LinkCloseTag}
  1535.               </div>
  1536.               {/block:Photo}
  1537.               <!--PHOTOSET-->
  1538.               {block:Photoset}
  1539.               {Photoset-700}
  1540.               {/block:Photoset}
  1541.               <!--QUOTE-->
  1542.               {block:Quote}
  1543.               <div class="qh caption">
  1544.                 <h3>{Quote}</h3>
  1545.               </div>
  1546.               {block:NotReblog}
  1547.               {block:Source}
  1548.               <div class="caption">
  1549.                 <span class="qsrc">{Source}</span>
  1550.               </div>
  1551.               {/block:Source}
  1552.               {/block:NotReblog}
  1553.               {/block:Quote}
  1554.               <!--LINK-->
  1555.               {block:Link}
  1556.               <div class="lh caption">
  1557.                 <h3><a title="{URL}" href="{URL}">
  1558.                   <i class="fas fa-link"></i>
  1559.                   {Name}</a>
  1560.                 </h3>
  1561.               </div>
  1562.               <!--
  1563.                {block:Thumbnail}
  1564.                  <img class="thumb" src="{Thumbnail-HighRes}"></img>
  1565.                {/block:Thumbnail}-->
  1566.               {block:NotReblog}
  1567.               {block:Description}
  1568.               <div class="caption">
  1569.                 {Description}
  1570.               </div>
  1571.               {/block:Description}
  1572.               {/block:NotReblog}
  1573.               {/block:Link}
  1574.               <!--CHAT-->
  1575.               {block:Chat}
  1576.               <div class="post_title">
  1577.                 {block:Title}
  1578.                 <h1>{Title}</h1>
  1579.                 {/block:Title}
  1580.               </div>
  1581.               <div class="caption">
  1582.                 {block:Lines}
  1583.                 <div class="chat_lines {Alt}">
  1584.                   {block:Label}<b>{Label}</b>{/block:Label} {Line}
  1585.                 </div>
  1586.                 {/block:Lines}
  1587.               </div>
  1588.               {/block:Chat}
  1589.               <!--AUDIO-->
  1590.               {block:Audio}
  1591.               <div class="audio_post">
  1592.                 {block:AudioPlayer}
  1593.                 <div class="audio_player">
  1594.                   {block:AlbumArt}
  1595.                   <img src="{AlbumArtURL}">
  1596.                   {/block:AlbumArt}
  1597.                   <div class="play_button">{AudioPlayer}</div>
  1598.                 </div>
  1599.                 {/block:AudioPlayer}
  1600.                 <div class="audio_info">
  1601.                   <ul>
  1602.                     <li><span>Name:</span>{block:TrackName}{TrackName}{/block:TrackName}</li>
  1603.                     <li><span>Artist:</span>{block:Artist}{Artist}{/block:Artist}</li>
  1604.                     <li><span>Plays:</span>{block:PlayCount}{FormattedPlayCount}{/block:PlayCount}</li>
  1605.                   </ul>
  1606.                 </div>
  1607.               </div>
  1608.               {/block:Audio}
  1609.               <!--VIDEO-->
  1610.               {block:Video}
  1611.               <div class="vid">{Video-700}</div>
  1612.               {/block:Video}
  1613.               <!--ASK-->
  1614.               {block:Answer}
  1615.               <div class="question">
  1616.                 <div class="asker">
  1617.                   <img src="{AskerPortraitURL-64}">
  1618.                   {lang:Asker asked 2}:
  1619.                 </div>
  1620.                 <div class="caption">"{Question}"</div>
  1621.               </div>
  1622.               <!--ask-->
  1623.               {block:Answerer}
  1624.               <div class="answerer">
  1625.                 <img src="{AnswererPortraitURL-64}">
  1626.                 {Answerer}
  1627.               </div>
  1628.               <div class="caption">{Answer}</div>
  1629.               {/block:Answerer}
  1630.               {block:NotReblog}
  1631.               <div class="caption">
  1632.                 {Replies}
  1633.               </div>
  1634.               {/block:NotReblog}
  1635.               {/block:Answer}
  1636.               <!--CAPTION-->
  1637.               {block:NotReblog}
  1638.               {block:Caption}
  1639.               <div class="caption">
  1640.                 {Caption}
  1641.               </div>
  1642.               {/block:Caption}
  1643.               {/block:NotReblog}
  1644.               <div class="reblog-list">
  1645.                 {block:Reblogs}
  1646.                 <div class="reblog_parent">
  1647.                   <div class="reblog_header">
  1648.                     {block:IsActive}
  1649.                     <img src="{PortraitURL-64}">
  1650.                     <a target="_blank" href="{Permalink}">{Username}</a>
  1651.                     {/block:IsActive}
  1652.                     {block:IsDeactivated}
  1653.                     <i class="fas fa-user-times"></i>
  1654.                     {Username}
  1655.                     {block:IsDeactivated}
  1656.                   </div>
  1657.                   <div class="reblog_body caption">
  1658.                     {Body}
  1659.                   </div>
  1660.                 </div>
  1661.                 {/block:Reblogs}
  1662.               </div>
  1663.             </div>
  1664.           </div>
  1665.           <!--post_body-->
  1666.           {block:IndexPage}
  1667.           <div class="post_footer">
  1668.             <!--tags-->
  1669.             {block:HasTags}
  1670.             <div class="ptags pinfo">
  1671.               {block:Tags}<a href="{TagURL}">#{Tag}</a>{/block:Tags}
  1672.             </div>
  1673.             {/block:HasTags}
  1674.             <!--post buttons-->
  1675.             <div class="buttons pinfo">
  1676.               <a href="{ReblogURL}" title="Reblog this post"><i class="fas fa-retweet"></i></a>
  1677.               <div class="custom_like_button" title="Like this post">
  1678.                 {LikeButton}
  1679.                 <i class="fas fa-heart"></i>
  1680.                 <span></span>
  1681.               </div>
  1682.             </div>
  1683.             <!--buttons-->
  1684.           </div>
  1685.           {/block:IndexPage}
  1686.         </article>
  1687.         <!--post-->
  1688.       </div>
  1689.       {block:PermalinkPage}
  1690.       <div class="permalink {TagsAsClasses}">
  1691.         <!--tags-->
  1692.         {block:HasTags}
  1693.         <div class="pl via ptags">
  1694.           <i class="fas fa-tags"></i>
  1695.           {block:Tags}<a href="{TagURL}">{text:tag}{Tag}</a>{/block:Tags}
  1696.         </div>
  1697.         {/block:HasTags}
  1698.         <!--date-->
  1699.         {block:Date}
  1700.         <div class="pl via">
  1701.           <i>{lang:Posted TimeAgo}, {DayofMonthWithSuffix} {Month} & {NoteCountWithLabel}</a>
  1702.        </div>
  1703.        {/block:Date}
  1704.        <!--source-->
  1705.        <!--if reblog-->
  1706.        {block:RebloggedFrom}
  1707.        <div class="pl via">
  1708.          <i>{lang:Source}:</i>
  1709.          <a href="{ReblogRootURL}">
  1710.          {ReblogRootName}
  1711.          </a>
  1712.        </div>
  1713.        {/block:RebloggedFrom}
  1714.        {block:NotReblog}
  1715.        {block:Source}
  1716.        <div class="pl via">
  1717.          <i>{lang:Source}:</i>
  1718.          <a href="{Permalink}">
  1719.          {Name}
  1720.          </a>
  1721.        </div>
  1722.        {/block:Source}
  1723.        {/block:NotReblog}
  1724.        <!--post notes-->
  1725.        {block:PostNotes}
  1726.        <div class="plnotes">{PostNotes}</div>
  1727.        {/block:PostNotes}
  1728.      </div>
  1729.      <!--permalink-->
  1730.      {/block:PermalinkPage}
  1731.      <!--HIDE SOURCE & VIA-->
  1732.      {block:ContentSource}
  1733.      <!-- {SourceURL}
  1734.        {block:SourceLogo}
  1735.        <img src="{BlackLogoURL}" width="{LogoWidth}"
  1736.        height="{LogoHeight}" alt="{SourceTitle}" />
  1737.        {/block:SourceLogo}
  1738.        {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  1739.      {/block:ContentSource}
  1740.      <!--{block:NoRebloggedFrom}{block:RebloggedFrom}{ReblogParentName}
  1741.        {/block:RebloggedFrom}{/block:NoRebloggedFrom} -->
  1742.      {/block:Posts}
  1743.    </main>  
  1744. <!--POST CONTAINER END-------------------------------------------------->
  1745.    
  1746. <!--COPYRIGHT----------------------------------------------------------->
  1747.    <div id="copyright" style="position: fixed; bottom: 0; right: 0; padding: 10px; background: {color:accent}; z-index: 8;"><a style="font-family: helvetica; font-weight: bold; letter-spacing: -1px; color: {color:accent text};" href="https://nonspace.tumblr.com">nonspace.</a></div>
  1748. <!--COPYRIGHT-- END----------------------------------------------------->
  1749.   </div>
  1750.   <!--container-->
  1751.  
  1752. <!--FOOTER-------------------------------------------------------------->
  1753.   {block:Pagination}
  1754.   <footer>
  1755.     <div id="pagination">
  1756.       {block:PreviousPage}<a href="{PreviousPage}"><i class="far fa-arrow-alt-circle-left"></i></a>
  1757.       {/block:PreviousPage}
  1758.       {block:JumpPagination length="5"}
  1759.       {block:CurrentPage}<b>{CurrentPage}</b>{/block:CurrentPage}
  1760.       {block:JumpPage}<a class="jump_page" href="{URL}">{PageNumber}</a>
  1761.       {/block:JumpPage}
  1762.       {/block:JumpPagination}
  1763.       {block:NextPage}<a href="{NextPage}"><i class="far fa-arrow-alt-circle-right"></i></a>{/block:NextPage}
  1764.     </div>
  1765.   </footer>
  1766.   {/block:Pagination}
  1767.  
  1768. <!--FOOTER END---------------------------------------------------------->
  1769.  
  1770. <!--CONTAINER END------------------------------------------------------->
  1771.  
  1772. <script>
  1773.     if (typeof window.iExist == 'undefined') {
  1774.       $('#copyright').css({
  1775.           'display' : 'block',
  1776.       });
  1777.     }
  1778. </script>
  1779. </body>
  1780. </html>
Advertisement
Add Comment
Please, Sign In to add comment