Deprecated: The each() function is deprecated. This message will be suppressed on further calls in /home/zhenxiangba/zhenxiangba.com/public_html/phproxy-improved-master/index.php on line 456
thm 08 - waterfall - Pastebin.com
[go: Go Back, main page]
API tools faq
paste
annasthms

thm 08 - waterfall

annasthms
Sep 16th, 2018 (edited)
1,327
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 44.81 KB | None | 0 0
raw download clone embed print report
  1. <!DOCYTPE>
  2. <html>
  3.  
  4. <!----------------------------------------------------
  5.  
  6. credits:
  7.  
  8. - honeybee icon font by themehive
  9. - photosets.css by annasthms and espoirthemes
  10. - lightbox by magnusthemes
  11.  
  12. - waterfall by annasthms (september 5, 2018)
  13.  my theme for the #nojschallenge
  14.  more info @ https://annasthms.tumblr.com/more/thm/08
  15.  nojschallenge: https://annasthms.tumblr.com/nojs
  16.  
  17.  
  18. rules:
  19.  
  20. 1. don't remove the credit
  21. 2. don't steal/claim as yours
  22. 3. don't use as a base code
  23.  
  24. thank you!! ♡♡♡
  25.  
  26. ----------------------------------------------------->
  27.  
  28. <head>
  29.  
  30.   <title>{Title}{block:PostSummary} :: {PostSummary}{/block:PostSummary}{block:TagPage} :: #{Tag}{/block:TagPage}{block:SearchPage} :: {SearchQuery}{/block:SearchPage}{block:DayPage} :: {DayOfMonthWithZero}.{MonthNumberWithZero}.{ShortYear}{/block:DayPage}</title>
  31.   <link rel="shortcut icon" href="{Favicon}">
  32.   <link rel="alternate" type="application/rss+xml" href="{RSS}">
  33.   {block:Description}
  34.   <meta name="description" content="{MetaDescription}" />
  35.   {/block:Description}
  36.  
  37.   <link href="https://fonts.googleapis.com/css?family={text:google font}" rel="stylesheet">
  38.   <link href="https://solrainha.github.io/honeybee/honeybee.css" rel="stylesheet">
  39.   <link href="https://static.tumblr.com/0podkko/bwepdyarh/photosets.css" rel="stylesheet">
  40.   <link href="https://static.tumblr.com/0podkko/sI0pe7j2t/annasthms.css" rel="stylesheet">
  41.  
  42.   <meta name="image:header" content="{HeaderImage}" />
  43.   <meta name="image:avatar" content="" />
  44.   <meta name="image:background" content="" />
  45.  
  46.   <meta name="color:color 1" content="#93e9e8" />
  47.   <meta name="color:color 2" content="#148c8b" />
  48.   <meta name="color:font" content="#ffffff" />
  49.   <meta name="color:background" content="#111111" />
  50.   <meta name="color:header" content="#121a1f" />
  51.   <meta name="color:title" content="#094674" />
  52.   <meta name="color:description" content="#444444" />
  53.   <meta name="color:description box accent" content="#ffffff" />
  54.   <meta name="color:nav bar" content="#000000" />
  55.   <meta name="color:nav bar links" content="#93e9e8" />
  56.   <meta name="color:nav bar links hover" content="#148c8b" />
  57.   <meta name="color:nav bar links fade" content="#dddddd" />
  58.   <meta name="color:nav bar title" content="#148c8b" />
  59.   <meta name="color:post background 1" content="#000000" />
  60.   <meta name="color:post background 2" content="#2a2a2a" />
  61.   <meta name="color:post border" content="#2a2a2a" />
  62.   <meta name="color:lightbox background" content="#000000" />
  63.   <meta name="color:post info background" content="#2a2a2a" />
  64.   <meta name="color:post info links" content="#148c8b" />
  65.   <meta name="color:post info links hover" content="#aaaaaa" />
  66.   <meta name="color:tags" content="#ffffff" />
  67.   <meta name="color:tags hover" content="#93e9e8" />
  68.   <meta name="color:like and reblog buttons" content="#93e9e8" />
  69.   <meta name="color:like and reblog buttons hover" content="#148c8b" />
  70.   <meta name="color:like button liked" content="#148c8b" />
  71.   <meta name="color:permalink post notes background" content="#2a2a2a" />
  72.   <meta name="color:pagination" content="#148c8b" />
  73.   <meta name="color:pagination accent" content="#93e9e8" />
  74.  
  75.   <meta name="font:font" content="Avalon" />
  76.  
  77.   <meta name="select:post pages post location" content="left" title="left" />
  78.   <meta name="select:post pages post location" content="right" title="right" />
  79.   <meta name="select:post pages post location" content="al" title="alternate (left start)" />
  80.   <meta name="select:post pages post location" content="ar" title="alternate (right start)" />
  81.   <meta name="select:post info" content="info-hover opacity-0" title="plus icon on hover, 0% opacity" />
  82.   <meta name="select:post info" content="info-hover opacity-25" title="plus icon on hover, 25% opacity" />
  83.   <meta name="select:post info" content="info-hover opacity-50" title="plus icon on hover, 50% opacity" />
  84.   <meta name="select:post info" content="info-hover opacity-75" title="plus icon on hover, 75% opacity" />
  85.   <meta name="select:post info" content="info-always" title="always show plus icon" />
  86.   <meta name="select:post info" content="info-hide" title="always show post info" />
  87.   <meta name="select:post pages post width" content="250px" title="250px" />
  88.   <meta name="select:post pages post width" content="400px" title="400px" />
  89.   <meta name="select:post pages post width" content="500px" title="500px" />
  90.   <meta name="select:post pages post info width" content="250px" title="250px" />
  91.   <meta name="select:post pages post info width" content="300px" title="300px" />
  92.   <meta name="select:post pages post info width" content="350px" title="350px" />
  93.   <meta name="select:post pages post info width" content="400px" title="400px" />
  94.   <meta name="select:post pages post info width" content="450px" title="450px" />
  95.   <meta name="select:post pages post info width" content="500px" title="500px" />
  96.   <meta name="select:post margin" content="40px" title="40px" />
  97.   <meta name="select:post margin" content="45px" title="45px" />
  98.   <meta name="select:post margin" content="50px" title="50px" />
  99.   <meta name="select:post margin" content="55px" title="55px" />
  100.   <meta name="select:post margin" content="60px" title="60px" />
  101.   <meta name="select:post margin" content="65px" title="65px" />
  102.   <meta name="select:post margin" content="70px" title="70px" />
  103.   <meta name="select:permalink page post width" content="700px" title="700px" />
  104.   <meta name="select:permalink page post width" content="250px" title="250px" />
  105.   <meta name="select:permalink page post width" content="400px" title="400px" />
  106.   <meta name="select:permalink page post width" content="500px" title="500px" />
  107.   <meta name="select:pagination type" content="top" title="in navbar" />
  108.   <meta name="select:pagination type" content="bottom simple" title="below posts, simple pagination" />
  109.   <meta name="select:pagination type" content="bottom jump" title="below posts, jump pagination" />
  110.  
  111.   <meta name="if:header" content="1" />
  112.   <meta name="if:show avatar" content="1" />
  113.   <meta name="if:show blog title in header" content="1" />
  114.   <meta name="if:show blog description" content="1" />
  115.   <meta name="if:search bar" content="1" />
  116.   <meta name="if:show tags on index pages" content="1" />
  117.   <meta name="if:fill in heart when post liked" content="1" />
  118.   <meta name="if:show like button on index pages" content="1" />
  119.   <meta name="if:dark tumblr controls" content="1" />
  120.  
  121.   <meta name="text:blog title" content="waterfall" />
  122.   <meta name="text:blog description" content="here is where your description goes!" />
  123.   <meta name="text:google font" content="" />
  124.   <meta name="text:font size" content="16px" />
  125.   <meta name="text:header height" content="500px" />
  126.   <meta name="text:header width" content="100%" />
  127.   <meta name="text:header top offset" content="0px" />
  128.   <meta name="text:photoset image spacing" content="5px" />
  129.   <meta name="text:blog link one name" content="ask" />
  130.   <meta name="text:blog link one url" content="/ask" />
  131.   <meta name="text:blog link two name" content="" />
  132.   <meta name="text:blog link two url" content="" />
  133.   <meta name="text:blog link three name" content="" />
  134.   <meta name="text:blog link three url" content="" />
  135.   <meta name="text:blog link four name" content="" />
  136.   <meta name="text:blog link four url" content="" />
  137.   <meta name="text:blog link five name" content="" />
  138.   <meta name="text:blog link five url" content="" />
  139.  
  140.   <style>
  141.   * {
  142.     position: relative;
  143.     -webkit-box-sizing: border-box;
  144.             box-sizing: border-box;
  145.   }
  146.   body {
  147.     background: {color:background} url('{image:background}') no-repeat fixed center;
  148.     background-size: cover;
  149.     font-family: {block:Ifgooglefont}'{text:google font}', {/block:Ifgooglefont}{font:font};
  150.     font-size: {text:font size};
  151.     line-height: 1.5em;
  152.     color: {color:font};
  153.   }
  154.   a {
  155.     text-decoration: none;
  156.     color: {color:color 1};
  157.   }
  158.   a:hover {
  159.     color: {color:color 2};
  160.   }
  161.   p:first-child {
  162.     margin-top: 0 !important;
  163.   }
  164.   p:last-child {
  165.     margin-bottom: 0 !important;
  166.   }
  167.   p:empty {
  168.     display: none;
  169.   }
  170.   img {
  171.     max-width: 100%;
  172.     height: auto;
  173.     display: block;
  174.     margin: auto;
  175.   }
  176.  
  177.   /* header */
  178.   header {
  179.     height: {text:header height};
  180.     width: {text:header width};
  181.     margin-top: {text:header top offset};
  182.     background: {color:header} url('{image:header}');
  183.     background-size: cover;
  184.     background-position: center center;
  185.     background-repeat: no-repeat;
  186.     display: -webkit-box;
  187.     display: -ms-flexbox;
  188.     display: flex;
  189.     -webkit-box-align: center;
  190.         -ms-flex-align: center;
  191.             align-items: center;
  192.   }
  193.   {block:ifnotshowavatar}{block:ifnotavatarimage}{block:ifnotshowblogtitleinheader}{block:ifnotblogtitle}{block:ifnotshowblogdescription}{block:ifnotblogdescription}div#blog-info{display:none;}{/block:ifnotblogdescription}{/block:ifnotshowblogdescription}{/block:ifnotblogtitle}{/block:ifnotshowblogtitleinheader}{/block:ifnotavatarimage}{/block:ifnotshowavatar}
  194.   div#blog-info {
  195.     background: {color:description box accent};
  196.     background: rgba({RGBcolor:description box accent},0.8);
  197.     padding: 2em;
  198.     margin: auto;
  199.   }
  200.   div#blog-img, div#blog-about {
  201.     display: inline-block;
  202.     vertical-align: middle;
  203.   }
  204.   div#blog-img {
  205.     width: 100px;
  206.     height: 100px;
  207.   }
  208.   div#blog-img img {
  209.     height: 100%;
  210.     width: 100%;
  211.     border-radius: 100%;
  212.     border: 5px solid {color:description box accent};
  213.     -o-object-fit:cover;
  214.     object-fit:cover;
  215.   }
  216.   div#blog-about {
  217.     max-width: 40vw;
  218.     {block:ifshowavatar}{block:ifavatarimage}margin-left: 2em;{/block:ifavatarimage}{/block:ifshowavatar}
  219.   }
  220.   {block:ifnotshowblogtitleinheader}{block:ifnotblogtitle}{block:ifnotshowblogdescription}{block:ifnotblogdescription}div#blog-about {display: none;}{/block:ifnotblogdescription}{/block:ifnotshowblogdescription}{/block:ifnotblogtitle}{/block:ifnotshowblogtitleinheader}
  221.   div#blog-about div#blog-title {
  222.     font-weight: bold;
  223.     font-size: 1.5em;
  224.     color: {color:title};
  225.   }
  226.   div#blog-title + div#blog-description {
  227.     margin-top: 1em;
  228.   }
  229.   div#blog-description {
  230.     color: {color:description};
  231.   }
  232.  
  233.   /* nav bar */
  234.   nav {
  235.     position: -webkit-sticky;
  236.     position: sticky;
  237.     background: {color:nav bar};
  238.     background: rgba({RGBcolor:nav bar},0.8);
  239.     padding: 1em;
  240.     top: 0;
  241.     margin: auto;
  242.     width: {text:header width};
  243.     text-align: center;
  244.     z-index: 3;
  245.     -webkit-transition: 0.35s all;
  246.     transition: 0.35s all;
  247.   }
  248.   nav:hover {
  249.     background: {color:nav bar};
  250.     background: rgba({RGBcolor:nav bar},1);
  251.   }
  252.   nav a, div#navlinks, div#search {
  253.     display: inline-block;
  254.     -webkit-transition: 0.2s all ease-in-out;
  255.     transition: 0.2s all ease-in-out;
  256.   }
  257.   nav a#nav-title {
  258.     margin: 0 0.35em;
  259.     margin-right: 1.25em;
  260.     font-weight: bold;
  261.     color: {color:nav bar title};
  262.   }
  263.   div#navlinks, div#search {
  264.     margin: 0 0.35em;
  265.   }
  266.   div#navlinks a, div#search {
  267.     padding: 0 0.35em;
  268.     color: {color:nav bar links};
  269.   }
  270.   div#navlinks:hover a {
  271.     color: {color:nav bar links fade};
  272.   }
  273.   div#navlinks:hover a:hover {
  274.     color: {color:nav bar links hover};
  275.   }
  276.   div#search form {
  277.     margin: 0;
  278.   }
  279.   div#search input {
  280.     border: none;
  281.     outline: none;
  282.     color: {color:nav bar links};
  283.     background: transparent;
  284.     font-family: {block:Ifgooglefont}'{text:google font}', {/block:Ifgooglefont}{font:font};
  285.     font-size: 1em;
  286.     text-transform: lowercase;
  287.     width: 3.5em;
  288.     margin: 0;
  289.     padding: 0;
  290.     -webkit-transition: 0.2s all ease-in-out;
  291.     transition: 0.2s all ease-in-out;
  292.   }
  293.   div#search input::-webkit-input-placeholder {
  294.     color: {color:nav bar links fade};
  295.     -webkit-transition: 0.2s all ease-in-out;
  296.     transition: 0.2s all ease-in-out;
  297.   }
  298.   div#search input:-ms-input-placeholder {
  299.     color: {color:nav bar links fade};
  300.     -webkit-transition: 0.2s all ease-in-out;
  301.     transition: 0.2s all ease-in-out;
  302.   }
  303.   div#search input::-ms-input-placeholder {
  304.     color: {color:nav bar links fade};
  305.     -webkit-transition: 0.2s all ease-in-out;
  306.     transition: 0.2s all ease-in-out;
  307.   }
  308.   div#search input::placeholder {
  309.     color: {color:nav bar links fade};
  310.     -webkit-transition: 0.2s all ease-in-out;
  311.     transition: 0.2s all ease-in-out;
  312.   }
  313.   div#search input:hover::-webkit-input-placeholder {
  314.     color: {color:nav bar links hover};
  315.   }
  316.   div#search input:hover:-ms-input-placeholder {
  317.     color: {color:nav bar links hover};
  318.   }
  319.   div#search input:hover::-ms-input-placeholder {
  320.     color: {color:nav bar links hover};
  321.   }
  322.   div#search input:hover::placeholder {
  323.     color: {color:nav bar links hover};
  324.   }
  325.   div#search input:focus {
  326.     width: 5em;
  327.     margin-right: -1.5em;
  328.   }
  329.   nav a.prev, nav a.next {
  330.     text-transform: lowercase;
  331.   }
  332.   nav a.prev {
  333.     float: left;
  334.   }
  335.   nav a.next {
  336.     float: right;
  337.   }
  338.  
  339.   /* post container */
  340.   section#posts {
  341.     {block:IndexPage}width: calc({select:post pages post width} + {select:post pages post info width} + {select:post margin});{/block:IndexPage}
  342.     {block:PermalinkPage}width: {select:permalink page post width};{/block:PermalinkPage}
  343.     margin: 6em auto 3em;
  344.   }
  345.  
  346.   .post {
  347.     margin: {select:post margin} 0;
  348.   }
  349.  
  350.   /* post positioning */
  351.   {block:IndexPage}
  352.   .right article .contents {
  353.     margin-left: calc({select:post pages post info width} + {select:post margin});
  354.   }
  355.   .right article .contents .info {
  356.     left: calc(-1 * {select:post margin} - ({select:post pages post info width} / 2));
  357.     -webkit-transform: translate(-50%,-50%) scale(0);
  358.             transform: translate(-50%,-50%) scale(0);
  359.   }
  360.   .right article .contents input.info-toggle:checked ~ .info, .right article.info-hide .info {
  361.     -webkit-transform: translate(-50%,-50%) scale(1);
  362.             transform: translate(-50%,-50%) scale(1);
  363.   }
  364.   .right article .contents input.info-toggle, .right article .contents .info-toggle-back {
  365.     left: 0.5em;
  366.   }
  367.   .right .photo input.info-toggle, .right .photo .info-toggle-back {
  368.     left: calc({text:photoset image spacing} + 0.5em) !important;
  369.   }
  370.  
  371.   .al article:nth-child(even) .contents {
  372.     margin-left: calc({select:post pages post info width} + {select:post margin});
  373.   }
  374.   .al article:nth-child(even) .contents .info {
  375.     left: calc(-1 * {select:post margin} - ({select:post pages post info width} / 2));
  376.     -webkit-transform: translate(-50%,-50%) scale(0);
  377.             transform: translate(-50%,-50%) scale(0);
  378.   }
  379.   .al article:nth-child(even) .contents input.info-toggle:checked ~ .info, .al article.info-hide:nth-child(even) .info {
  380.     -webkit-transform: translate(-50%,-50%) scale(1);
  381.             transform: translate(-50%,-50%) scale(1);
  382.   }
  383.   .al article:nth-child(even) .contents input.info-toggle, .al article:nth-child(even) .contents .info-toggle-back {
  384.     left: 0.5em;
  385.   }
  386.   .al article.photo:nth-child(even) input.info-toggle, .al article.photo:nth-child(even) .info-toggle-back {
  387.     left: calc({text:photoset image spacing} + 0.5em) !important;
  388.   }
  389.  
  390.   .ar article:nth-child(odd) .contents {
  391.     margin-left: calc({select:post pages post info width} + {select:post margin});
  392.   }
  393.   .ar article:nth-child(odd) .contents .info {
  394.     left: calc(-1 * {select:post margin} - ({select:post pages post info width} / 2));
  395.     -webkit-transform: translate(-50%,-50%) scale(0);
  396.             transform: translate(-50%,-50%) scale(0);
  397.   }
  398.   .ar article:nth-child(odd) .contents input.info-toggle:checked ~ .info, .ar article.info-hide:nth-child(odd) .info {
  399.     -webkit-transform: translate(-50%,-50%) scale(1);
  400.             transform: translate(-50%,-50%) scale(1);
  401.   }
  402.   .ar article:nth-child(odd) .contents input.info-toggle, .ar article:nth-child(odd) .contents .info-toggle-back {
  403.     left: 0.5em;
  404.   }
  405.   .ar article.photo:nth-child(odd) input.info-toggle, .ar article.photo:nth-child(odd) .info-toggle-back {
  406.     left: calc({text:photoset image spacing} + 0.5em) !important;
  407.   }
  408.  
  409.   /* post contents */
  410.   .contents {
  411.     display: inline-block;
  412.     width: {select:post pages post width};
  413.     background: {color:post background 1};
  414.   }
  415.   .link .contents {
  416.     border: 3px solid {color:post border};
  417.   }
  418.   {/block:IndexPage}
  419.   {block:PermalinkPage}
  420.   .contents {
  421.     width: {select:permalink page post width};
  422.   }
  423.   {/block:PermalinkPage}
  424.   .contents iframe {
  425.     display: block;
  426.   }
  427.   .contents blockquote {
  428.     padding: 0 0 0 1em;
  429.     border-left: 1px solid;
  430.   }
  431.   .contents ol, ul {
  432.     padding: 0 0 0 1em;
  433.   }
  434.  
  435.   {block:PermalinkPage}
  436.   /* permalink title */
  437.   .perma-title {
  438.     background: {color:post background 2};
  439.     font-weight: bold;
  440.     font-size: 1.2em;
  441.     margin-bottom: 1em;
  442.     padding: 0.83em;
  443.   }
  444.   {/block:PermalinkPage}
  445.  
  446.   /* text post */
  447.   .body {
  448.     padding: 1em;
  449.     background: {color:post background 2};
  450.   }
  451.  
  452.   /* photo + photoset posts */
  453.   .image {
  454.     display: block;
  455.     border: 3px solid {color:post border};
  456.     padding: {text:photoset image spacing};
  457.   }
  458.   .image img {
  459.     {block:PermalinkPage}width: 700px;{/block:PermalinkPage}
  460.     height: auto;
  461.     display: block;
  462.   }
  463.   .image img.stay {
  464.     display: none;
  465.   }
  466.   .photoset-container {
  467.     border: 3px solid {color:post border};
  468.     padding: {text:photoset image spacing};
  469.   }
  470.   .photoset-grid {
  471.     grid-gap: {text:photoset image spacing};
  472.   }
  473.   label.photo-trigger {
  474.     display:block;
  475.     position:relative;
  476.     cursor:pointer;
  477.     -webkit-user-select:none;
  478.     -moz-user-select:none;
  479.     -ms-user-select:none;
  480.     user-select:none;
  481.   }
  482.   label.photo-trigger input {display:none;}
  483.   .lightbox {
  484.     position:fixed;
  485.     top:0;
  486.     left:0;
  487.     height:100%;
  488.     width:100%;
  489.     background:{color:lightbox background};
  490.     z-index:99999;
  491.     opacity:0;
  492.     visibility:hidden;
  493.   }
  494.   label.photo-trigger input:checked ~ .lightbox {visibility:visible; opacity:1;}
  495.   label.photo-trigger input:checked ~ img:not(.stay) {
  496.     width:auto;
  497.     height:auto;
  498.     max-height: 75vh;
  499.     max-width: 75vw;
  500.     position:fixed;
  501.     display:block;
  502.     top:50%;
  503.     left:50%;
  504.     z-index:100000;
  505.     -webkit-transform:translate(-50%,-50%);
  506.     transform:translate(-50%,-50%);
  507.   }
  508.   label.photo-trigger input:checked ~ img.stay {
  509.     display: block;
  510.   }
  511.  
  512.   /* chat posts */
  513.   .lines {
  514.     border: 0.25em solid {color:post border};
  515.   }
  516.   .line {
  517.     padding: 0.5em;
  518.   }
  519.   .line:nth-child(odd) {
  520.     background: {color:post background 2};
  521.   }
  522.   .label {
  523.     font-weight: bold;
  524.   }
  525.  
  526.   /* link posts */
  527.   .link-container a {
  528.     display: block;
  529.     background: {color:post background 2};
  530.   }
  531.   .link-container a span:first-child {
  532.     padding: 0.85em 1em;
  533.   }
  534.   .link-container img {
  535.     display: inline-block;
  536.     width: 3em;
  537.     height: auto;
  538.     vertical-align: middle;
  539.     margin-right: 1.15em;
  540.   }
  541.   .link-container span {
  542.     display: inline-block;
  543.     vertical-align: middle;
  544.     font-size: 1.1em;
  545.     font-weight: bold;
  546.   }
  547.   .link-container img + span {
  548.     max-width: calc(100% - 4.5em);
  549.     padding: 0.5em 0;
  550.     text-overflow: ellipsis;
  551.     white-space: nowrap;
  552.     overflow: hidden;
  553.   }
  554.   .orig-desc {
  555.     padding: 1em;
  556.     border-top: 3px solid {color:post border};
  557.   }
  558.  
  559.   /* quote posts */
  560.   .words {
  561.     border: 3px solid {color:post border};
  562.     padding: 1em;
  563.     min-height: 5em;
  564.   }
  565.   .words::first-letter {
  566.     background: {color:post background 2};
  567.     padding: 0.5em 0.75em;
  568.     margin-right: 0.5em;
  569.     float: left;
  570.     font-size: 1.25em;
  571.   }
  572.   {block:IndexPage}
  573.   .source {
  574.     font-style: italic;
  575.     text-transform: uppercase;
  576.     font-size: 0.75em;
  577.     line-height: 1.5em;
  578.     margin-bottom: 1em;
  579.   }
  580.   {/block:IndexPage}
  581.   {block:PermalinkPage}
  582.   .source {
  583.     font-style: italic;
  584.   }
  585.   .source::before {
  586.     content: '\2014';
  587.     margin-right: 0.25em;
  588.   }
  589.   {/block:PermalinkPage}
  590.  
  591.   /* audio posts */
  592.   .audio-player {
  593.     border: 3px solid {color:post border};
  594.   }
  595.   .audio-play, .audio-info {
  596.     display: inline-block;
  597.     vertical-align: middle;
  598.   }
  599.   .audio-play {
  600.     width: 5em;
  601.     height: 5em;
  602.     margin-right: 1em;
  603.   }
  604.   .audio-play:not(.has-img) {
  605.     background: #f2f2f2;
  606.   }
  607.   .audio-play span {
  608.     position: absolute;
  609.     top: 50%;
  610.     left: 50%;
  611.     -webkit-transform: translate(-50%, -50%);
  612.             transform: translate(-50%, -50%);
  613.     width: 27px;
  614.     height: 27px;
  615.     overflow: hidden;
  616.     border-radius: 100%;
  617.   }
  618.   .audio-play img + span {
  619.     opacity: 0.5;
  620.     -webkit-transition: 0.35s all;
  621.     transition: 0.35s all;
  622.   }
  623.   .audio-play:hover img + span {
  624.     opacity: 0.8;
  625.   }
  626.   .audio-play span iframe {
  627.     margin-left: -3px;
  628.   }
  629.   .audio-info {
  630.     padding: 0.5em 0.5em 0.5em 0;
  631.   }
  632.   .audio-play ~ .audio-info {
  633.     max-width: calc(100% - 6.5em);
  634.   }
  635.   span.audio-name {
  636.     text-decoration: underline;
  637.   }
  638.   .audio-plays {
  639.     font-size: 0.8em;
  640.   }
  641.   .audio-plays span {
  642.     font-size: 0.65em;
  643.     margin-right: 0.75em;
  644.     color: lightcoral;
  645.   }
  646.   .audio-embed iframe {
  647.     width: 100%;
  648.     display: block;
  649.   }
  650.   iframe.tumblr_audio_player {
  651.     height: 85px;
  652.   }
  653.   iframe.spotify_audio_player {
  654.     height: 80px;
  655.   }
  656.  
  657.   /* video posts */
  658.   {block:IndexPage}
  659.   .video-container div:not(.video-{select:post pages post width}) {
  660.     display: none;
  661.   }
  662.   {/block:IndexPage}
  663.   {block:PermalinkPage}
  664.   .video-container div:not(.video-{select:permalink page post width}) {
  665.     display: none;
  666.   }
  667.   {/block:PermalinkPage}
  668.   .video-250px iframe.instagram-media {
  669.     width: 250px !important;
  670.     min-width: 0 !important;
  671.     margin: 0 !important;
  672.   }
  673.   .video-container iframe.instagram-media {
  674.     margin: 0 !important;
  675.   }
  676.  
  677.   /* ask posts */
  678.   .qna {
  679.     border: 3px solid {color:post border};
  680.   }
  681.   .question, .reply {
  682.     display: table;
  683.     width: 100%;
  684.   }
  685.   .reply {
  686.     border-top: 3px solid {color:post border};
  687.   }
  688.   .question div, .reply div {
  689.     display: table-cell;
  690.     vertical-align: middle;
  691.   }
  692.   .qna .mark {
  693.     padding: 1em 1.5em;
  694.     background: {color:post background 2};
  695.     width: 4em;
  696.   }
  697.   .speech {
  698.     padding: 1em;
  699.     word-break: break-word;
  700.   }
  701.   .speech:empty {
  702.     padding: 0;
  703.   }
  704.   .speech:empty + .mark {
  705.     display: none;
  706.   }
  707.   .reply .speech :nth-last-child(2) {
  708.     display: inline;
  709.   }
  710.   span.person {
  711.     display: inline-block;
  712.     text-transform: lowercase;
  713.   }
  714.  
  715.   {block:IndexPage}
  716.   /* post info toggle */
  717.   input.info-toggle, .info-toggle-back {
  718.     position: absolute;
  719.     right: 0.5em;
  720.     bottom: 0.5em;
  721.     margin: 0;
  722.     height: 1.3em;
  723.     width: 1.3em;
  724.     font-size: 16px;
  725.     cursor: help;
  726.   }
  727.   .info-hide input.info-toggle, .info-hide .info-toggle-back {
  728.     display: none;
  729.   }
  730.   .photo input.info-toggle, .photo .info-toggle-back {
  731.     right: calc({text:photoset image spacing} + 0.5em);
  732.     bottom: calc({text:photoset image spacing} + 0.5em);
  733.   }
  734.   input.info-toggle {
  735.     position: absolute;
  736.     z-index: 2;
  737.     opacity: 0;
  738.   }
  739.   .info-toggle-back {
  740.     background: {color:post background 1};
  741.     z-index: 1;
  742.     padding: 0.35em;
  743.     -webkit-transition: 0.5s all;
  744.     transition: 0.5s all;
  745.   }
  746.   .info-always .info-toggle-back {
  747.     opacity: 1;
  748.   }
  749.   .info-hover.opacity-0 .info-toggle-back {
  750.     opacity: 0;
  751.   }
  752.   .info-hover.opacity-25 .info-toggle-back {
  753.     opacity: 0.25;
  754.   }
  755.   .info-hover.opacity-50 .info-toggle-back {
  756.     opacity: 0.5;
  757.   }
  758.   .info-hover.opacity-75 .info-toggle-back {
  759.     opacity: 0.75;
  760.   }
  761.   .info-hover.opacity-25.text .info-toggle-back, .info-hover.opacity-25.chat .info-toggle-back {
  762.     opacity: 0.15;
  763.   }
  764.   .info-hover.opacity-50.text .info-toggle-back, .info-hover.opacity-50.chat .info-toggle-back {
  765.     opacity: 0.25;
  766.   }
  767.   .info-hover.opacity-75.text .info-toggle-back, .info-hover.opacity-75.chat .info-toggle-back {
  768.     opacity: 0.5;
  769.   }
  770.   .info-hover.opacity-25 .audio-embed ~ .info-toggle-back {
  771.     opacity: 0.5;
  772.   }
  773.   .info-hover.opacity-50 .audio-embed ~ .info-toggle-back {
  774.     opacity: 0.75;
  775.   }
  776.   .info-hover.opacity-75 .audio-embed ~ .info-toggle-back {
  777.     opacity: 1;
  778.   }
  779.   .info-hover .contents:hover .info-toggle-back {
  780.     opacity: 1;
  781.   }
  782.   input.info-toggle:checked + .info-toggle-back {
  783.     padding:  0.35em;
  784.   }
  785.   input.info-toggle + .info-toggle-back span::before {
  786.     content: "\e2ab";
  787.     display: block;
  788.     position: absolute;
  789.     -webkit-transition: 0.5s all;
  790.     transition: 0.5s all;
  791.     -webkit-transform: scale(1);
  792.             transform: scale(1);
  793.     font-family: 'honeybee';
  794.     font-size: 0.6em;
  795.     font-weight: bold;
  796.     line-height: 1em;
  797.   }
  798.   input.info-toggle:checked + .info-toggle-back span::before {
  799.     -webkit-transform: scale(0);
  800.             transform: scale(0);
  801.   }
  802.   input.info-toggle + .info-toggle-back span::after {
  803.     content: "\e20e";
  804.     display: block;
  805.     position: absolute;
  806.     -webkit-transition: 0.5s all;
  807.     transition: 0.5s all;
  808.     -webkit-transform: scale(0);
  809.             transform: scale(0);
  810.     -webkit-transform-origin: center;
  811.             transform-origin: center;
  812.     font-family: 'honeybee';
  813.     font-size: 0.6em;
  814.     font-weight: bold;
  815.     line-height: 1em;
  816.   }
  817.   input.info-toggle:checked + .info-toggle-back span::after {
  818.     -webkit-transform: scale(1);
  819.             transform: scale(1);
  820.   }
  821.  
  822.   /* post info */
  823.   .info {
  824.     width: {select:post pages post info width};
  825.     max-height: 100%;
  826.     overflow: auto;
  827.     position: absolute;
  828.     top: 50%;
  829.     right: calc(-1 * {select:post margin} - ({select:post pages post info width} / 2));
  830.     -webkit-transform: translate(50%,-50%) scale(0);
  831.             transform: translate(50%,-50%) scale(0);
  832.     -webkit-transition: 0.5s all;
  833.     transition: 0.5s all;
  834.     background: {color:post info background};
  835.     padding: 1em;
  836.   }
  837.   .link-container + input ~ .info, .audio .info {
  838.     max-height: calc(100% + {select:post margin});
  839.   }
  840.   input.info-toggle:checked ~ .info, .info-hide .info {
  841.     -webkit-transform: translate(50%,-50%) scale(1);
  842.             transform: translate(50%,-50%) scale(1);
  843.   }
  844.   .info::-webkit-scrollbar {
  845.     width: 5px;
  846.     background: transparent;
  847.   }
  848.   .info::-webkit-scrollbar-track {
  849.     background: transparent;
  850.   }
  851.   .info::-webkit-scrollbar-thumb {
  852.     background: {color:color 2};
  853.   }
  854.  
  855.   /* post title */
  856.   .title {
  857.     font-weight: bold;
  858.     margin-bottom: 0.75em;
  859.     text-transform: uppercase;
  860.   }
  861.   {block:ifnotshowtagsonindexpages}.tags{display:none;}{/block:ifnotshowtagsonindexpages}
  862.   {/block:IndexPage}
  863.  
  864.   {block:PermalinkPage}
  865.   .perma-more {
  866.     margin-top: 2em;
  867.     background: {color:post background 2};
  868.     padding: 1em;
  869.   }
  870.   .perma-more:empty {
  871.     display: none;
  872.   }
  873.   .info {
  874.     margin-top: 2em;
  875.     background: {color:post info background};
  876.     padding: 0.75em 1em;
  877.   }
  878.   {/block:PermalinkPage}
  879.  
  880.   .post-info a, .rb-info a {
  881.     color: {color:post info links};
  882.   }
  883.   .post-info a:hover, .rb-info a:hover {
  884.     color: {color:post info links hover};
  885.   }
  886.  
  887.   /* post captions */
  888.   {block:IndexPage}
  889.   .caption, .more-link-description, .replies {
  890.     margin-bottom: 1em;
  891.   }
  892.   {/block:IndexPage}
  893.   .caption:empty, .more-link-description:empty, .replies:empty {
  894.     display: none;
  895.   }
  896.   .reblogged:not(:last-child) {
  897.     margin-bottom: 0.75em;
  898.   }
  899.   .reblogged > :not(.blog) {
  900.     margin: 0.5em 0;
  901.   }
  902.   .blog {
  903.     {block:PermalinkPage}font-weight: bold;{/block:PermalinkPage}
  904.   }
  905.   {block:IndexPage}
  906.   .blog.deactive {
  907.     text-decoration: line-through;
  908.     -webkit-text-decoration-color: rgba({RGBcolor:color 1}, 0.65);
  909.             text-decoration-color: rgba({RGBcolor:color 1}, 0.65);
  910.   }
  911.   {/block:IndexPage}
  912.   .blog + p {
  913.     margin-top: 0.25em !important;
  914.   }
  915.  
  916.   /* like + reblog buttons */
  917.   .share-post {
  918.     float: right;
  919.     z-index: 1;
  920.   }
  921.   .share-post > div {
  922.     font-size: 0.8em;
  923.     margin-top: 0.25em;
  924.     display: inline-block;
  925.     vertical-align: top;
  926.   }
  927.   .like-button {
  928.     height: 1em;
  929.     width: 1em;
  930.     margin-right: 0.5em;
  931.   }
  932.   .like-button div, .like-button iframe {
  933.     position: absolute;
  934.     height: 1.25em;
  935.     width: 100%;
  936.     top: 0;
  937.     left: 0;
  938.     z-index: 1;
  939.     opacity: 0;
  940.   }
  941.   .like-button span {
  942.     color: {color:like and reblog buttons};
  943.   }
  944.   .like-button .liked + span {
  945.     color: {color:like button liked};
  946.   }
  947.   {block:iffillinheartwhenpostliked}
  948.   .like-button .liked + span::before {
  949.     content: "\e154";
  950.   }
  951.   {/block:iffillinheartwhenpostliked}
  952.   .like-button div:hover + span {
  953.     color: {color:like and reblog buttons hover};
  954.   }
  955.   {block:IndexPage}{block:ifnotshowlikebuttononindexpages}.like-button {display:none!important;}{/block:ifnotshowlikebuttononindexpages}{/block:IndexPage}
  956.   .share-post a {
  957.     display: block;
  958.     height: 1em;
  959.     width: 1em;
  960.     color: {color:like and reblog buttons};
  961.   }
  962.   .share-post a:hover {
  963.     color: {color:like and reblog buttons hover};
  964.   }
  965.  
  966.   /* date + notecount */
  967.   a.permalink {
  968.     text-transform: lowercase;
  969.   }
  970.   span.notecount {
  971.     margin-left: 0.5em;
  972.   }
  973.   span.notecount span {
  974.     margin-right: 0.833em;
  975.     font-size: 0.6em;
  976.   }
  977.  
  978.   /* via + source */
  979.   .rb-info {
  980.     text-transform: lowercase;
  981.   }
  982.  
  983.   /* tags */
  984.   .tags span {
  985.     font-weight: bold;
  986.   }
  987.   .tags a {
  988.     margin-left: 0.5em;
  989.     color: {color:tags};
  990.   }
  991.   .tags a:hover {
  992.     color: {color:tags hover};
  993.   }
  994.  
  995.   /* post notes */
  996.   div#post-notes {
  997.     background: {color:permalink post notes background};
  998.     margin-top: 2em;
  999.     padding: 1em;
  1000.   }
  1001.   ol.notes {
  1002.     list-style: none;
  1003.     padding: 0;
  1004.     margin: 0;
  1005.   }
  1006.   ol.notes li:not(:last-child) {
  1007.     margin-bottom: 0.75em;
  1008.   }
  1009.   ol.notes li::before {
  1010.     font-family: 'honeybee';
  1011.     font-size: 0.7em;
  1012.     margin-right: 1em;
  1013.     vertical-align: middle;
  1014.   }
  1015.   ol.notes li.like::before {
  1016.     content: '\e155';
  1017.   }
  1018.   ol.notes li.reblog::before {
  1019.     content: '\e407';
  1020.   }
  1021.   ol.notes li.reply::before {
  1022.     content: '\e2ab';
  1023.   }
  1024.   ol.notes li.original_post::before {
  1025.     content: '\e398';
  1026.   }
  1027.   ol.notes img {
  1028.     display: none;
  1029.   }
  1030.   ol.notes blockquote {
  1031.     margin: 0.25em 0 0 0;
  1032.     border: none;
  1033.     background: rgba({RGBcolor:permalink post notes background}, 0.5);
  1034.     padding: 0.5em 0.75em;
  1035.     border-left: 1px solid;
  1036.   }
  1037.  
  1038.   /* pagination */
  1039.   div#pagination {
  1040.     margin-top: {select:post margin};
  1041.     text-align: center;
  1042.     font-size: 1.1em;
  1043.     text-transform: lowercase;
  1044.   }
  1045.   div#pagination > * {
  1046.     margin: 0 0.75em;
  1047.   }
  1048.   div#pagination a.page {
  1049.     color: {color:pagination};
  1050.   }
  1051.   div#pagination a:hover {
  1052.     text-decoration: underline;
  1053.     color: {color:pagination accent};
  1054.   }
  1055.   div#pagination span.page {
  1056.     padding: 0.5em 0.75em;
  1057.     background: {color:pagination accent};
  1058.     color: {color:background};
  1059.   }
  1060.   .top div#pagination, .bottom nav a.next, .bottom nav a.prev, .bottom.simple div#pagination .page, .bottom.jump div#pagination a.next, .bottom.jump div#pagination a.prev {
  1061.     display: none;
  1062.   }
  1063.  
  1064.   /***************************************************
  1065.  
  1066.               DO   NOT   TOUCH
  1067.  
  1068.   ***************************************************/
  1069.  
  1070.   div#credit {
  1071.     position: fixed;
  1072.     bottom: 5px;
  1073.     right: 5px;
  1074.     font-size: 0.8em;
  1075.     line-height: 1em;
  1076.   }
  1077.   div#credit a {
  1078.     display: block;
  1079.     background: #fff;
  1080.     padding: 5px 6px;
  1081.     color: #000;
  1082.     text-decoration: none;
  1083.   }
  1084.   div#credit a::before, div#credit a::after {
  1085.     opacity: 0;
  1086.     visibility: hidden;
  1087.     -webkit-transition: 0.2s all ease-in-out;
  1088.     transition: 0.2s all ease-in-out;
  1089.   }
  1090.   div#credit a::before {
  1091.     content: "";
  1092.     position: absolute;
  1093.     left:0%;
  1094.     top:50%;
  1095.     margin-left:-12px;
  1096.     -webkit-transform:translatey(-50%) rotate(-90deg);
  1097.             transform:translatey(-50%) rotate(-90deg);
  1098.     border-width: 4px 6px 0 6px;
  1099.     border-style: solid;
  1100.     border-color: {color:post background 2} transparent transparent transparent;
  1101.     z-index: 100;
  1102.   }
  1103.   div#credit a::after {
  1104.     content: attr(tooltip);
  1105.     position: absolute;
  1106.     left:0%;
  1107.     top:50%;
  1108.     margin-left:-8px;
  1109.     -webkit-transform: translateX(-100%)   translateY(-50%);
  1110.             transform: translateX(-100%)   translateY(-50%);
  1111.     background: {color:post background 2};
  1112.     text-align: center;
  1113.     color: {color:font};
  1114.     padding:4px 2px;
  1115.     font-size: 12px;
  1116.     min-width: 120px;
  1117.     pointer-events: none;
  1118.   }
  1119.   div#credit a:hover::before, div#credit a:hover::after {
  1120.     opacity: 1;
  1121.     visibility: visible;
  1122.   }
  1123.   /***************************************************/
  1124.  
  1125.   /* tumblr controls */
  1126.   .tmblr-iframe {
  1127.     {block:ifdarktumblrcontrols}-webkit-filter: invert(100%);filter: invert(100%);{/block:ifdarktumblrcontrols}
  1128.   }
  1129.   .top iframe.tmblr-iframe {
  1130.     top: auto !important;
  1131.     bottom: 2em !important;
  1132.     -webkit-transform: scale(0.8);
  1133.             transform: scale(0.8);
  1134.     -webkit-transform-origin: bottom right;
  1135.             transform-origin: bottom right;
  1136.   }
  1137.   .bottom iframe.tmblr-iframe {
  1138.     top: 1.75em !important;
  1139.     -webkit-transform: scale(0.8) translateY(-50%);
  1140.             transform: scale(0.8) translateY(-50%);
  1141.     -webkit-transform-origin: top right;
  1142.             transform-origin: top right;
  1143.   }
  1144.  
  1145.   {block:IndexPage}
  1146.   /* semi responsiveness */
  1147.   @media screen and (max-width:1100px) and (min-width:1001px) {
  1148.     section#posts {
  1149.       width: calc(400px + {select:post pages post info width} + {select:post margin});
  1150.     }
  1151.     .contents {
  1152.       width: 400px;
  1153.     }
  1154.     .video-container div:not(.video-400px) {
  1155.       display: none;
  1156.     }
  1157.     .video-400px {
  1158.       display: block !important;
  1159.     }
  1160.   }
  1161.   @media screen and (max-width:1000px) and (min-width:901px) {
  1162.     section#posts {
  1163.       width: calc(300px + {select:post pages post info width} + {select:post margin});
  1164.     }
  1165.     .contents {
  1166.       width: 300px;
  1167.     }
  1168.     .video-container div:not(.video-300px) {
  1169.       display: none;
  1170.     }
  1171.     .video-300px {
  1172.       display: block !important;
  1173.     }
  1174.   }
  1175.   @media screen and (max-width:900px) {
  1176.     section#posts {
  1177.       width: calc(250px + {select:post pages post info width} + {select:post margin});
  1178.     }
  1179.     .contents {
  1180.       width: 250px;
  1181.     }
  1182.     .video-container div:not(.video-250px) {
  1183.       display: none;
  1184.     }
  1185.     .video-250px {
  1186.       display: block !important;
  1187.     }
  1188.   }
  1189.   {/block:IndexPage}
  1190.  
  1191.   {CustomCSS}
  1192. </style>
  1193.  
  1194. </head>
  1195. <body class="{block:IndexPage}{select:post pages post location} {/block:IndexPage}{select:pagination type}">
  1196.   {block:ifheader}
  1197.   <header>
  1198.     <div id="blog-info">
  1199.       {block:ifshowavatar}{block:ifavatarimage}<div id="blog-img"><img src="{image:avatar}"></div>{/block:ifavatarimage}{/block:ifshowavatar}
  1200.       <div id="blog-about">
  1201.         {block:ifshowblogtitleinheader}{block:ifblogtitle}<div id="blog-title">{text:blog title}</div>{/block:ifblogtitle}{/block:ifshowblogtitleinheader}
  1202.         {block:ifshowblogdescription}{block:ifblogdescription}<div id="blog-description">{text:blog description}</div>{/block:ifblogdescription}{/block:ifshowblogdescription}
  1203.       </div>
  1204.     </div>
  1205.   </header>
  1206.   {/block:ifheader}
  1207.   <nav>
  1208.     {block:Pagination}{block:PreviousPage}<a href="{PreviousPage}" class="prev">{lang:Prev}</a>{/block:PreviousPage}{/block:Pagination}
  1209.     <a href="{BlogURL}" id="nav-title">{Title}</a><div id="navlinks">{block:Ifbloglinkoneurl}<a href="{text:blog link one url}" class="navlink">{text:blog link one name}</a>{/block:Ifbloglinkoneurl}{block:Ifbloglinktwourl}<a href="{text:blog link two url}" class="navlink">{text:blog link two name}</a>{/block:Ifbloglinktwourl}{block:Ifbloglinkthreeurl}<a href="{text:blog link three url}" class="navlink">{text:blog link three name}</a>{/block:Ifbloglinkthreeurl}{block:Ifbloglinkfoururl}<a href="{text:blog link four url}" class="navlink">{text:blog link four name}</a>{/block:Ifbloglinkfoururl}{block:Ifbloglinkfiveurl}<a href="{text:blog link five url}" class="navlink">{text:blog link five name}</a>{/block:Ifbloglinkfiveurl}{block:HasPages}{block:Pages}<a href="{URL}" class="navlink">{Label}</a>{/block:Pages}{/block:HasPages}<a href="/archive" class="navlink" style="text-transform:lowercase;">{lang:Archive}</a>{block:ifsearchbar}<div id="search"><form action="/search" method="get"><input type="text" name="q" value="{SearchQuery}" placeholder="{lang:Search}"/></form></div>{/block:ifsearchbar}</div>
  1210.     {block:Pagination}{block:NextPage}<a href="{NextPage}" class="next">{lang:Next}</a>{/block:NextPage}{/block:Pagination}
  1211.   </nav>
  1212.   <section id="posts">
  1213.     {block:Posts}<article class="post {PostType} {select:post info}" id="{PostID}">
  1214.  
  1215.       <div class="contents">
  1216.  
  1217.         {block:PermalinkPage}{block:Title}<div class="perma-title">{Title}</div>{/block:Title}{/block:PermalinkPage}
  1218.  
  1219.         {block:Text}<div class="body">{block:NotReblog}{Body}{/block:NotReblog}{block:RebloggedFrom}{block:Reblogs}<div class="reblogged"><div class="blog{block:IsDeactivated} deactive{/block:IsDeactivated}"><span>{block:HasPermalink}<a href="{Permalink}">{/block:HasPermalink}{Username}{block:HasPermalink}</a>{/block:HasPermalink}</span></div>{Body}</div>{/block:Reblogs}{/block:RebloggedFrom}</div>{/block:Text}
  1220.  
  1221.         {block:Photo}<div class="image"><label class="photo-trigger"><input type="checkbox"><img src="{PhotoURL-HighRes}" alt="{PhotoAlt}"><img src="{PhotoURL-HighRes}" alt="{PhotoAlt}" class="stay"><div class="lightbox"></div></label></div>{/block:Photo}
  1222.  
  1223.         {block:Photoset}<div class="photoset-container"><div class="photoset-grid" photoset-layout="{PhotosetLayout}">{block:Photos}<div><label class="photo-trigger"><input type="checkbox"><img src="{PhotoURL-HighRes}" /><div class="lightbox"></div></label></div>{/block:Photos}</div></div>{/block:Photoset}
  1224.  
  1225.         {block:Quote}<div class="words">{Quote}</div>{/block:Quote}
  1226.  
  1227.         {block:Link}<div class="link-container">
  1228.           <a href="{URL}" class="path" title="{Name}" {Target}>{block:Thumbnail}<img src="{Thumbnail-HighRes}">{/block:Thumbnail}<span>{Name}</span></a>
  1229.         </div>
  1230.         {block:Description}{block:NotReblog}<div class="orig-desc">{Description}</div>{/block:NotReblog}{block:RebloggedFrom}{block:Reblogs}{block:IsNotOriginalEntry}<div class="orig-description"><div class="blog{block:IsDeactivated} deactive{/block:IsDeactivated}"><span>{block:HasPermalink}<a href="{Permalink}">{/block:HasPermalink}{Username}{block:HasPermalink}</a>{/block:HasPermalink}</span></div>{Body}</div>{/block:IsNotOriginalEntry}{/block:Reblogs}{/block:RebloggedFrom}{/block:Description}
  1231.         {/block:Link}
  1232.  
  1233.         {block:Chat}<div class="lines">{block:Lines}<div class="line"><span class="label">{block:Label}{Label}{/block:Label}</span> {Line}</div>{/block:Lines}</div>{/block:Chat}
  1234.  
  1235.         {block:Audio}{block:AudioPlayer}<div class="audio-player">
  1236.           <div class="audio-play{block:AlbumArt} has-img{/block:AlbumArt}">
  1237.             {block:AlbumArt}<img src="{AlbumArtURL}">{/block:AlbumArt}
  1238.             {AudioPlayer}
  1239.           </div>
  1240.           <div class="audio-info">
  1241.             <div class="audio-track">{block:TrackName}<span class="audio-name">{TrackName}</span>{/block:TrackName}{block:Artist} by {Artist}{/block:Artist}</div>
  1242.             {block:PlayCount}<div class="audio-plays"><span class="th th-heart-1"></span>{PlayCount}</div>{/block:PlayCount}
  1243.           </div>
  1244.         </div>{/block:AudioPlayer}{block:AudioEmbed}<div class="audio-embed">{AudioEmbed}</div>{/block:AudioEmbed}{/block:Audio}
  1245.  
  1246.         {block:Video}<div class="video-container"><div class="video-250px">{VideoEmbed-250}</div><div class="video-400px">{VideoEmbed-400}</div><div class="video-500px">{VideoEmbed-500}</div><div class="video-700px">{VideoEmbed-700}</div></div>{/block:Video}
  1247.  
  1248.         {block:Answer}
  1249.         <div class="qna">
  1250.           <div class="question">
  1251.             <div class="mark"><span class="th th-question-o"></span></div>
  1252.             <div class="speech"><span class="person">{Asker} &mdash; </span> {Question}</div>
  1253.           </div>
  1254.           <div class="reply">
  1255.             <div class="speech">{Answer}{block:Answerer} <span class="person"> &mdash; {Answerer}</span>{/block:Answerer}</div>
  1256.             <div class="mark"><span class="th th-exclamation-o"></span></div>
  1257.           </div>
  1258.         </div>
  1259.         {/block:Answer}
  1260.  
  1261.         {block:IndexPage}
  1262.         <input type="checkbox" class="info-toggle">
  1263.         <div class="info-toggle-back"><span class="th"></span></div>
  1264.         {/block:IndexPage}
  1265.  
  1266.         {block:PermalinkPage}
  1267.         <div class="perma-more">{block:Link}{block:Description}{block:RebloggedFrom}{block:Reblogs}{block:IsNotOriginalEntry}<div class="reblogged"><div class="blog{block:IsDeactivated} deactive{/block:IsDeactivated}"><span>{block:HasPermalink}<a href="{Permalink}">{/block:HasPermalink}{Username}{block:HasPermalink}</a>{/block:HasPermalink}</span></div>{Body}</div>{/block:IsNotOriginalEntry}{/block:Reblogs}{/block:RebloggedFrom}{/block:Description}{/block:Link}{block:Quote}{block:Source}<div class="source">{Source}</div>{/block:Source}{/block:Quote}{block:Answer}{block:Answerer}{block:Reblogs}<div class="qna"><div class="blog{block:IsDeactivated} deactive{/block:IsDeactivated}">{block:HasPermalink}<a href="{Permalink}">{/block:HasPermalink}{Username}{block:HasPermalink}</a>{/block:HasPermalink}</div>{Body}</div>{/block:Reblogs}{/block:Answerer}{/block:Answer}{block:Caption}{block:NotReblog}{Caption}{/block:NotReblog}{block:RebloggedFrom}{block:Reblogs}<div class="reblogged"><div class="blog{block:IsDeactivated} deactive{/block:IsDeactivated}"><span>{block:HasPermalink}<a href="{Permalink}">{/block:HasPermalink}{Username}{block:HasPermalink}</a>{/block:HasPermalink}</span></div>{Body}</div>{/block:Reblogs}{/block:RebloggedFrom}{/block:Caption}</div>
  1268.         {/block:PermalinkPage}
  1269.  
  1270.         {block:Date}
  1271.         <div class="info">
  1272.           {block:IndexPage}
  1273.           {block:Title}<div class="title">{Title}</div>{/block:Title}
  1274.           {block:Link}{block:Description}{block:RebloggedFrom}<div class="more-link-description">{block:Reblogs}{block:IsNotOriginalEntry}<div class="reblogged"><div class="blog{block:IsDeactivated} deactive{/block:IsDeactivated}"><span>{block:HasPermalink}<a href="{Permalink}">{/block:HasPermalink}{Username}{block:HasPermalink}</a>{/block:HasPermalink}</span></div>{Body}</div>{/block:IsNotOriginalEntry}{/block:Reblogs}</div>{/block:RebloggedFrom}{/block:Description}{/block:Link}
  1275.           {block:Quote}{block:Source}<div class="source">{Source}</div>{/block:Source}{/block:Quote}
  1276.           {block:Answer}{block:Answerer}<div class="replies">{block:Reblogs}<div class="qna"><div class="blog{block:IsDeactivated} deactive{/block:IsDeactivated}">{block:HasPermalink}<a href="{Permalink}">{/block:HasPermalink}{Username}{block:HasPermalink}</a>{/block:HasPermalink}</div>{Body}</div>{/block:Reblogs}</div>{/block:Answerer}{/block:Answer}
  1277.           {block:Caption}<div class="caption">{block:NotReblog}{Caption}{/block:NotReblog}{block:RebloggedFrom}{block:Reblogs}<div class="reblogged"><div class="blog{block:IsDeactivated} deactive{/block:IsDeactivated}"><span>{block:HasPermalink}<a href="{Permalink}">{/block:HasPermalink}{Username}{block:HasPermalink}</a>{/block:HasPermalink}</span></div>{Body}</div>{/block:Reblogs}{/block:RebloggedFrom}</div>{/block:Caption}
  1278.           {/block:IndexPage}
  1279.           <div class="share-post"><div class="like-button">{LikeButton}<span class="th th-heart-1-o"></span></div><div class="reblog-button"><a href="{ReblogURL}"><span class="th th-undo-arrow"></span></a></div></div>
  1280.           <div class="post-info"><a href="{Permalink}" class="permalink" title="{TimeAgo}">{ShortMonth} {DayOfMonthWithZero}{block:NoteCount}<span class="notecount"><span class="th th-heart-1"></span>{NoteCount}</span>{/block:NoteCount}</a></div>
  1281.           {block:RebloggedFrom}{block:PermalinkPage}<div class="rb-info"><a href="{ReblogParentURL}">{lang:Via}: {ReblogParentName},</a> <a href="{ReblogRootURL}">{lang:Source}: {ReblogRootName}</a></div>{/block:PermalinkPage}{/block:RebloggedFrom}
  1282.           {block:HasTags}<div class="tags"><span>#</span>{block:Tags}<a href="{TagURL}">{Tag}</a>{/block:Tags}</div>{/block:HasTags}
  1283.           <!--{block:ContentSource}<a href="{SourceURL}">{SourceTitle}</a>{/block:ContentSource}-->
  1284.         </div>
  1285.         {/block:Date}
  1286.  
  1287.       </div>
  1288.  
  1289.       {block:PostNotes}<div id="post-notes">{PostNotes}</div>{/block:PostNotes}
  1290.  
  1291.     </article>
  1292.     {/block:Posts}
  1293.  
  1294.     {block:Pagination}<div id="pagination">
  1295.       {block:PreviousPage}<a href="{PreviousPage}" class="prev">{lang:Prev}</a>{/block:PreviousPage}
  1296.       {block:JumpPagination length="5"}{block:CurrentPage}<span class="page">{PageNumber}</span>{/block:CurrentPage}{block:JumpPage}<a href="{URL}" class="jump page">{PageNumber}</a>{/block:JumpPage}{/block:JumpPagination}
  1297.       {block:NextPage}<a href="{NextPage}" class="next">{lang:Next}</a>{/block:NextPage}
  1298.     </div>{/block:Pagination}
  1299.  
  1300.   </section>
  1301.  
  1302.   <div id="credit"><a href="https://annasthms.tumblr.com/" tooltip="theme by annasthms">a</a></div>
  1303.  
  1304.   <div id="hi"></div>
  1305.  
  1306. </body>
  1307. </html>
Add Comment
Please, Sign In to add comment
Public Pastes
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!