API tools faq
paste
Petra1999

FLORA THEME | cloudythms.tumblr.com

Petra1999
Aug 22nd, 2018
3,343
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 5 52.68 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html><head><link rel="alternate" type="application/rss+xml" href="{RSS}">{block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}<meta name="viewport" content="width=device-width, initial-scale=1.0"><script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script><script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  2.  
  3. <!-----------------------------------------------------------------------
  4.  
  5.  
  6.         {   cloudythms
  7.                      flora theme    }
  8.          
  9.                       by
  10.              cloudythms.tumblr.com
  11.        contact me if you have questions!
  12.  
  13.  
  14. ......  rules  ......
  15.  
  16. * edit as much as you want
  17. * do not remove the credit
  18. * do not steal parts of my codes
  19. * do not redistribute or use as base
  20.  
  21.  
  22. ......  credits  ......
  23.  
  24. svg icons:          flaticon.com
  25. icon font:          fontawesome / linearicons
  26. fonts:              fonts.google.com
  27. photosets:          @5ppi
  28. source/via fix:     @neothm
  29. unnest captions:    @neothm
  30. video resizer:      @shythemes
  31. custom like/reblog: @shythemes
  32. soundcloud player:  @shythemes
  33. tumblr controls:    @cyantists
  34. smoothscroll:       @zacharyfury
  35. tooltips:           @tutorial-baby
  36. audio post style:   @lmthemeslp-tut
  37. full credits:       cloudythms.tumblr.com/credits
  38.  
  39. ---------------------------------------------------------------------->
  40.  
  41.  
  42. <!-- Text that appears on the tab / browser window
  43.    Change the {Title} to any text if you want to. -->
  44. <title>{Title}
  45. {block:PostSummary} - {PostSummary}{/block:PostSummary}</title>
  46.  
  47.  
  48. <!-- Favicon (little image that's shown in the browser)
  49.    Change {Favicon} to your image URL. Leave the "". -->
  50. <link rel="shortcut icon" href="{Favicon}"/>
  51.  
  52.  
  53. <!-- --------------------------- OPTIONS --------------------------- -->
  54.  
  55. <!-- Images -->
  56. <meta name="image:Background" content="0"/>
  57.  
  58. <!-- Colors -->
  59. <meta name="color:Background" content="#f8f8f8" />
  60. <meta name="color:Content Background" content="#ffffff" />
  61. <meta name="color:Text" content="#393939" />
  62. <meta name="color:Accent" content="#f2992e" />
  63. <meta name="color:Border" content="#ededed" />
  64. <meta name="color:Permalink" content="#aaaaaa" />
  65.  
  66. <!-- Dropdowns -->
  67. <meta name="select:Post Width" content="500" title="500px">
  68. <meta name="select:Post Width" content="600" title="600px">
  69. <meta name="select:Post Width" content="700" title="700px">
  70. <meta name="select:Post Width" content="300" title="300px">
  71. <meta name="select:Post Width" content="400" title="400px">
  72.  
  73. <meta name="select:Font Size" content="12px" title="12">
  74. <meta name="select:Font Size" content="10px" title="10">
  75. <meta name="select:Font Size" content="11px" title="11">
  76. <meta name="select:Font Size" content="13px" title="13">
  77. <meta name="select:Font Size" content="14px" title="14">
  78.  
  79. <meta name="select:Font" content="Open Sans" title="Open Sans">
  80. <meta name="select:Font" content="Karla" title="Karla">
  81. <meta name="select:Font" content="Roboto Slab" title="Roboto Slab">
  82. <meta name="select:Font" content="Lora" title="Lora">
  83. <meta name="select:Font" content="Fira Mono" title="Fira Mono">
  84. <meta name="select:Font" content="Roboto Mono" title="Roboto Mono">
  85.  
  86. <meta name="select:Post Distance" content="10" title="10px">
  87. <meta name="select:Post Distance" content="30" title="30px">
  88. <meta name="select:Post Distance" content="50" title="50px">
  89. <meta name="select:Post Distance" content="70" title="70px">
  90. <meta name="select:Post Distance" content="90" title="90px">
  91. <meta name="select:Post Distance" content="0" title="none">
  92.  
  93. <meta name="select:Post Padding" content="pad-tiny" title="tiny">
  94. <meta name="select:Post Padding" content="pad-small" title="small">
  95. <meta name="select:Post Padding" content="pad-medium" title="medium">
  96. <meta name="select:Post Padding" content="pad-big" title="big">
  97. <meta name="select:Post Padding" content="pad-huge" title="huge">
  98.  
  99. <meta name="select:Link1 Icon" content="lnr lnr-link" title="link">
  100. <meta name="select:Link1 Icon" content="lnr lnr-user" title="person">
  101. <meta name="select:Link1 Icon" content="lnr lnr-heart" title="heart">
  102. <meta name="select:Link1 Icon" content="lnr lnr-star" title="star">
  103. <meta name="select:Link1 Icon" content="lnr lnr-tag" title="tag">
  104. <meta name="select:Link1 Icon" content="lnr lnr-list" title="list">
  105. <meta name="select:Link1 Icon" content="lnr lnr-bookmark" title="bookmark">
  106. <meta name="select:Link2 Icon" content="lnr lnr-link" title="link">
  107. <meta name="select:Link2 Icon" content="lnr lnr-user" title="person">
  108. <meta name="select:Link2 Icon" content="lnr lnr-heart" title="heart">
  109. <meta name="select:Link2 Icon" content="lnr lnr-star" title="star">
  110. <meta name="select:Link2 Icon" content="lnr lnr-tag" title="tag">
  111. <meta name="select:Link2 Icon" content="lnr lnr-list" title="list">
  112. <meta name="select:Link2 Icon" content="lnr lnr-bookmark" title="bookmark">
  113. <meta name="select:Link3 Icon" content="lnr lnr-link" title="link">
  114. <meta name="select:Link3 Icon" content="lnr lnr-user" title="person">
  115. <meta name="select:Link3 Icon" content="lnr lnr-heart" title="heart">
  116. <meta name="select:Link3 Icon" content="lnr lnr-star" title="star">
  117. <meta name="select:Link3 Icon" content="lnr lnr-tag" title="tag">
  118. <meta name="select:Link3 Icon" content="lnr lnr-list" title="list">
  119. <meta name="select:Link3 Icon" content="lnr lnr-bookmark" title="bookmark">
  120. <meta name="select:Link4 Icon" content="lnr lnr-link" title="link">
  121. <meta name="select:Link4 Icon" content="lnr lnr-user" title="person">
  122. <meta name="select:Link4 Icon" content="lnr lnr-heart" title="heart">
  123. <meta name="select:Link4 Icon" content="lnr lnr-star" title="star">
  124. <meta name="select:Link4 Icon" content="lnr lnr-tag" title="tag">
  125. <meta name="select:Link4 Icon" content="lnr lnr-list" title="list">
  126. <meta name="select:Link4 Icon" content="lnr lnr-bookmark" title="bookmark">
  127. <meta name="select:Link5 Icon" content="lnr lnr-link" title="link">
  128. <meta name="select:Link5 Icon" content="lnr lnr-user" title="person">
  129. <meta name="select:Link5 Icon" content="lnr lnr-heart" title="heart">
  130. <meta name="select:Link5 Icon" content="lnr lnr-star" title="star">
  131. <meta name="select:Link5 Icon" content="lnr lnr-tag" title="tag">
  132. <meta name="select:Link5 Icon" content="lnr lnr-list" title="list">
  133. <meta name="select:Link5 Icon" content="lnr lnr-bookmark" title="bookmark">
  134.  
  135. <!-- Booleans -->
  136. <meta name="if:Wait for Images to Load" content="1"/>
  137. <meta name="if:Show Tumblr Controls" content="1"/>
  138. <meta name="if:Collapse Tumblr Controls" content="1"/>
  139. <meta name="if:Repeat Background Image" content="0"/>
  140. <meta name="if:Big Posts On Permalinks" content="1"/>
  141. <meta name="if:Accent Stripes" content="1"/>
  142. <meta name="if:Two Column Navigation" content="1"/>
  143. <meta name="if:Show Notes on Index" content="1"/>
  144. <meta name="if:Show Date on Index" content="0"/>
  145. <meta name="if:Show Tags" content="1"/>
  146. <meta name="if:Show Captions" content="1"/>
  147.  
  148. <meta name="if:Show Home Link" content="1"/>
  149. <meta name="if:Show Ask Link" content="1"/>
  150. <meta name="if:Show Submit Link" content="0"/>
  151. <meta name="if:Show Archive Link" content="0"/>
  152. <meta name="if:Show Random Link" content="0"/>
  153. <meta name="if:Show Blog Pages" content="0"/>
  154.  
  155. <!-- Text -->
  156. <meta name="text:Home Link Text" content="Index"/>
  157. <meta name="text:Submit Link Text" content="Submit"/>
  158. <meta name="text:Archive Link Text" content="Archive"/>
  159. <meta name="text:Ask Link Text" content="Contact"/>
  160. <meta name="text:Ask Link" content="/ask"/>
  161.  
  162. <meta name="text:Link1 Title" content=""/>
  163. <meta name="text:Link1 URL" content="/link1"/>
  164. <meta name="text:Link2 Title" content=""/>
  165. <meta name="text:Link2 URL" content="/link2"/>
  166. <meta name="text:Link3 Title" content=""/>
  167. <meta name="text:Link3 URL" content="/link3"/>
  168. <meta name="text:Link4 Title" content=""/>
  169. <meta name="text:Link4 URL" content="/link4"/>
  170. <meta name="text:Link5 Title" content=""/>
  171. <meta name="text:Link5 URL" content="/link5"/>
  172.  
  173.  
  174.  
  175. <!-- ---------------------------------------------------------------- -->
  176. <!-- ----------------------- C S S - S T A R T ---------------------- -->
  177. <!-- ---------------------------------------------------------------- -->
  178. <style>
  179.  
  180. /* variables */
  181.  
  182. :root {
  183.     --distance-left:10vw;    
  184. }
  185.  
  186.  
  187.  
  188. body {
  189.     background-color:{color:background};
  190.     color:{color:text};  
  191.     font-family: "{select:Font}", Arial, sans-serif;
  192.     font-size: {select:Font Size};
  193.     text-align:left;
  194.     margin:0;
  195.    
  196.     /* background image */
  197.     {block:IfBackgroundImage}
  198.         background-image:url({image:Background});
  199.         background-attachment: fixed;
  200.         {block:IfRepeatBackgroundImage}
  201.             background-repeat: repeat;
  202.         {/block:IfRepeatBackgroundImage}
  203.         {block:IfNotRepeatBackgroundImage}
  204.             background-repeat: no-repeat;
  205.             -webkit-background-size: cover;
  206.             -o-background-size: cover;
  207.             background-size: cover;
  208.         {/block:IfNotRepeatBackgroundImage}
  209.     {/block:IfBackgroundImage}
  210.    
  211. }
  212.  
  213. b, strong {
  214.    
  215. }
  216.  
  217. i, em {
  218.    
  219. }
  220.  
  221. a, a:visited, a:link, a:active {
  222.     text-decoration:none;
  223. }
  224.  
  225. a:hover {
  226.    
  227. }
  228.  
  229. img{
  230.     opacity:1;
  231.     border:none;
  232.     text-decoration:none;
  233. }
  234.  
  235. h1, h2, h3, h4, h5, h6{
  236.     font-weight:normal;
  237.     margin:0;
  238. }
  239.  
  240. strike {
  241.     -webkit-text-decoration: line-through solid black;
  242.        -moz-text-decoration: line-through solid black;
  243.             text-decoration: line-through solid black;
  244. }
  245.  
  246. small {
  247.     font-size: 0.9em;
  248. }
  249.  
  250. big {
  251.     font-size: 1.1em;
  252. }
  253.  
  254. pre {
  255.     white-space: pre-wrap;
  256.     white-space: -moz-pre-wrap;
  257.     white-space: -pre-wrap;
  258.     white-space: -o-pre-wrap;
  259.     word-wrap: break-word;
  260. }
  261.  
  262. blockquote{
  263.     border-left:1px solid {color:accent};
  264.     padding-left:10px;
  265.     margin-left:5px;
  266. }
  267.  
  268. hr {
  269.     border: 0;
  270.     height: 0;
  271.     border-top: 1px solid rgba(0, 0, 0, 0.1);
  272.     border-bottom: 1px solid rgba(255, 255, 255, 0.3);
  273. }
  274.  
  275. code {
  276.     display: block;
  277.     margin: 25px 10px;
  278.     background: {color:background};
  279.     padding: 20px;
  280.     max-height:90vh;
  281.     overflow:auto;
  282.     -webkit-border-radius: 5px;
  283.             border-radius: 5px;
  284. }
  285.  
  286. ol{
  287.     padding-left: 27px;
  288. }
  289. ol li {
  290.     padding-left: 5px;
  291. }
  292. ul{
  293.     list-style: none;
  294.     padding-left:10px;
  295. }
  296. ul li:before {
  297.     content: '—';
  298.     margin:0 5px;
  299. }
  300.  
  301.  
  302. /* selection */
  303.  
  304. ::-moz-selection {
  305.   background: rgba(0,0,0,0.3);
  306.   color: #ffffff;
  307. }
  308. ::-moz-selection {
  309.   background: rgba(0,0,0,0.3);
  310.   color: #ffffff;
  311. }
  312.  
  313.  
  314. /* scrollbar */
  315.  
  316. ::-webkit-scrollbar-thumb:vertical {
  317. background-color:rgba(0,0,0,0.3); /* slider */
  318. height:100px;
  319. -webkit-border-radius:15px;
  320. border-radius:15px;
  321. }
  322. ::-webkit-scrollbar-thumb:horizontal {
  323. background-color:rgba(0,0,0,0.3); /* slider */
  324. height:100px !important;
  325. }
  326. ::-webkit-scrollbar {
  327. height:10px;
  328. width:10px; /* slider */
  329. background-color:{color:background}; /* main color */
  330. }
  331.  
  332.  
  333. /* scroll to top button */
  334.  
  335. #scrolltotop {
  336.      display:block;
  337.      position:fixed;
  338.      z-index:99;
  339.      bottom:40px;
  340.      right:10px;
  341.      text-align:right;
  342.      cursor:help;
  343.      color:black;
  344.      opacity:0;
  345.      -webkit-transition:0.5s ease;
  346.      -o-transition:0.5s ease;
  347.      -moz-transition:0.5s ease;
  348.      transition:0.5s ease;
  349.      border:0;
  350.      line-height: 120%;
  351. }
  352.  
  353.  
  354.  
  355.  
  356. /****************************** layout ******************************/
  357.  
  358. :root { --postWidth:{select:Post Width}px; --navWidth:250px; }
  359.  
  360.  
  361. main {
  362.    
  363.     display:-ms-grid;
  364.     display:grid;
  365.     grid-gap: 0 0;
  366.  
  367.     justify-content: stretch;
  368.     -webkit-justify-content: stretch;
  369.            -webkit-box-pack: stretch;
  370.               -moz-box-pack: stretch;
  371.               -ms-flex-pack: stretch;
  372.    
  373.     align-content: stretch;
  374.     -webkit-align-content: stretch;
  375.        -ms-flex-line-pack: stretch;
  376.        
  377.     align-items: stretch;
  378.     -webkit-align-items: stretch;
  379.       -webkit-box-align: stretch;
  380.          -moz-box-align: stretch;
  381.          -ms-flex-align: stretch;
  382.    
  383.     justify-items: stretch;
  384.     grid-auto-columns: auto;
  385.     grid-auto-rows: auto;
  386.     grid-auto-flow: row;
  387.  
  388. }
  389.  
  390.  
  391.  
  392. /* sidebar layout*/
  393. main {
  394.   -ms-grid-rows:auto;
  395.   -ms-grid-columns: var(--navWidth) auto;
  396.   grid-template:
  397.       "navigation content" auto
  398.       / var(--navWidth) auto;
  399. }
  400. section {
  401.     -ms-grid-row:1;
  402.     -ms-grid-column:2;
  403.     grid-area:content;
  404.    
  405.     width:100% !important;
  406.     max-width:none !important;
  407. }
  408. article {
  409.     -webkit-box-sizing:border-box;
  410.        -moz-box-sizing:border-box;
  411.             box-sizing:border-box;
  412.     width:var(--postWidth);
  413.     max-width:-webkit-calc(95vw - var(--navWidth));
  414.     max-width:   -moz-calc(95vw - var(--navWidth));
  415.     max-width:        calc(95vw - var(--navWidth));
  416.    
  417.     margin-left: 5vw;
  418. }
  419. nav {
  420.     -ms-grid-row:1;
  421.     -ms-grid-column:1;
  422.     grid-area:navigation;
  423.    
  424.     -webkit-box-sizing: border-box;
  425.        -moz-box-sizing: border-box;
  426.             box-sizing: border-box;
  427.     width: var(--navWidth);
  428.    
  429.     justify-self: center;
  430.     -ms-grid-column-align: center;
  431. }
  432. #menulink {
  433.     display:none;
  434. }
  435. #menu {
  436.     display:inline;
  437. }
  438. .pagination.pagination-bottom {
  439.     display:none;
  440. }
  441. {block:IfBigPostsOnPermalinks}{block:PermalinkPage}
  442. section, article {
  443.     min-width:500px;
  444. }
  445. {/block:PermalinkPage}{/block:IfBigPostsOnPermalinks}
  446.  
  447.  
  448.  
  449. /* fixed */
  450. .sidebar {
  451.     -ms-grid-row:1;
  452.     -ms-grid-column:1;
  453.     grid-area:navigation;
  454.    
  455.     -webkit-box-sizing: border-box;
  456.        -moz-box-sizing: border-box;
  457.             box-sizing: border-box;
  458.     width: var(--navWidth);
  459. }
  460. nav {
  461.     justify-self: initial;
  462.     -ms-grid-column-align: initial;
  463.    
  464.     position:fixed;
  465.     z-index:1;
  466.     height: 100%;
  467. }
  468.  
  469. nav:before {
  470.     top
  471. }
  472.  
  473.  
  474.  
  475.  
  476.  
  477. /* topbar layout */
  478. @media only screen and (max-width: 992px) {
  479.     main {
  480.         -ms-grid-rows:auto auto;
  481.         -ms-grid-columns:auto;
  482.             grid-template:
  483.           "navigation" auto
  484.           "content" auto
  485.           / auto;
  486.     }
  487.     section {
  488.         -ms-grid-row:1;
  489.         -ms-grid-column:2;
  490.         grid-area:content;
  491.     }
  492.     article, .pagination {
  493.         -webkit-box-sizing:border-box;
  494.            -moz-box-sizing:border-box;
  495.                 box-sizing:border-box;
  496.         width:var(--postWidth);
  497.         max-width:-webkit-calc(95vw);
  498.         max-width:   -moz-calc(95vw);
  499.         max-width:        calc(95vw);
  500.         margin:0 auto;
  501.     }
  502.     article:last-of-type {
  503.         margin-bottom:0;
  504.     }
  505.     nav {
  506.         z-index: 99999;
  507.         -ms-grid-row:1;
  508.         -ms-grid-column:1;
  509.         grid-area:navigation;
  510.        
  511.         -webkit-box-sizing: border-box;
  512.            -moz-box-sizing: border-box;
  513.                 box-sizing: border-box;
  514.         width: 100%;
  515.         justify-self: center;
  516.         position: initial;
  517.         height: auto;
  518.        
  519.         display:-webkit-box;
  520.         display:-webkit-flex;
  521.         display:-moz-box;
  522.         display:-ms-flexbox;
  523.         display:flex;
  524.        
  525.         justify-content: center;
  526.         -webkit-justify-content: center;
  527.                -webkit-box-pack: center;
  528.                   -moz-box-pack: center;
  529.                   -ms-flex-pack: center;
  530.                
  531.     }
  532.     .nav-wrapper {
  533.        
  534.     }
  535.     section, article {
  536.         min-width:initial;
  537.     }
  538.     #menulink {
  539.         display:inline-block;
  540.         cursor:pointer;
  541.     }
  542.     #menu {
  543.         display:none;
  544.     }
  545.     .pagination.pagination-top {
  546.         display:none;
  547.     }
  548.     .pagination.pagination-bottom {
  549.         display:block;
  550.         margin-top: 10vh;
  551.         margin-bottom: 10vh;
  552.     }
  553.    
  554.    
  555.    
  556.     /* fixed */
  557.     :root {
  558.         --navHeight:25vh;
  559.     }
  560.     nav {
  561.         position:fixed;
  562.         min-height:var(--navHeight);
  563.     }
  564.     article:first-of-type {
  565.         margin-top:-webkit-calc(var(--navHeight) + 50px) !important;
  566.         margin-top:   -moz-calc(var(--navHeight) + 50px) !important;
  567.         margin-top:        calc(var(--navHeight) + 50px) !important;
  568.     }
  569.    
  570. }
  571.  
  572.  
  573.  
  574.  
  575. /****************************** sidebar ******************************/
  576.  
  577.  
  578. nav {
  579.     padding:20px;
  580.     padding-top:50px;
  581.     background:{color:content background};
  582.     overflow: hidden;
  583.     border-right: 1px solid {color:border};
  584. }
  585.  
  586. nav img {
  587.     width:50px;
  588.     height:50px;
  589. }
  590.  
  591. #blogtitle {
  592.     display: block;
  593.     font-size: 1.7em;
  594.     color:{color:accent};
  595.     text-align:center;
  596.     letter-spacing: 0.05em;
  597.     -webkit-transition: 0.5s ease;
  598.     -o-transition: 0.5s ease;
  599.     -moz-transition: 0.5s ease;
  600.     transition: 0.5s ease;
  601. }
  602. #blogtitle:hover {
  603.     letter-spacing: 0.1em;
  604. }
  605.  
  606. #description {
  607.     margin: 2em 0.5em;
  608.     text-align: center;
  609.     font-style: italic;
  610.     line-height: 150%;
  611.     letter-spacing: 0.05em;
  612. }
  613.  
  614. #description a {
  615.     color:{color:text};
  616.     border-bottom:1px solid {color:accent};
  617.     -webkit-transition: 0.3s ease;
  618.     -o-transition: 0.3s ease;
  619.     -moz-transition: 0.3s ease;
  620.     transition:0.3s ease;
  621. }
  622. #description a:hover {
  623.     color:{color:accent};
  624.     border-bottom:1px solid {color:text};
  625. }
  626.  
  627.  
  628. .bar-top, .bar-bottom {
  629.     z-index: 2;
  630.     position:fixed;
  631.     width:inherit;
  632.     height:1.5%;
  633.     background-color:{color:accent};
  634.     opacity: 0.85;
  635. }
  636. .bar-top  { top:0;  }
  637. .bar-bottom { bottom:0; }
  638.  
  639.  
  640.  
  641.  
  642. /* navigation */
  643.  
  644. .navigation {
  645.     border-top:1px solid {color:border};
  646.     border-bottom:1px solid {color:border};
  647.     padding: 2em 0;
  648.     margin: 2.5em 0.5em;
  649. }
  650.  
  651. .navigation a {
  652.     display: inline-block;
  653.     color:{color:text};
  654.     -webkit-transition: 0.4s ease;
  655.     -o-transition: 0.4s ease;
  656.     -moz-transition: 0.4s ease;
  657.     transition:0.4s ease;
  658.     margin: 1em 0;
  659.     line-height: 1em;
  660.    
  661.     {block:IfNotTwoColumnNavigation}
  662.     width: 80%;
  663.     margin: 0.7em 10%;
  664.     {/block:IfNotTwoColumnNavigation}
  665. }
  666.  
  667. {block:IfTwoColumnNavigation}
  668. .navigation a {
  669.     width: 45%;
  670. }
  671. .navigation a:nth-of-type(odd) {
  672.     margin-left:10%;
  673. }
  674. {/block:IfTwoColumnNavigation}
  675.  
  676. .navigation a:hover {
  677.     color:{color:accent};
  678. }
  679. .navigation a i {
  680.     display:inline-block;
  681.     margin-right:5px;
  682.     margin-left:0px;
  683.     -webkit-transition: 0.4s ease;
  684.     -o-transition: 0.4s ease;
  685.     -moz-transition: 0.4s ease;
  686.     transition:0.4s ease;
  687. }
  688. .navigation a i, .navigation a:hover i {
  689.     color:{color:text};
  690. }
  691. .navigation a:hover i {
  692.     margin-right:7px;
  693.     margin-left:-2px;
  694. }
  695. .lnr {
  696.    
  697. }
  698.  
  699.  
  700.  
  701. /* pagination */
  702.  
  703. .pagination {
  704.     text-align:center;
  705.     padding-bottom:50px;
  706.     margin:0 auto;
  707.     color:{color:accent};
  708. }
  709. .pagination a {
  710.     display:inline-block;
  711.     margin:0 5px;
  712.     color:{color:accent};
  713.     -webkit-transition: 0.4s ease;
  714.     -o-transition: 0.4s ease;
  715.     -moz-transition: 0.4s ease;
  716.     transition:0.4s ease;
  717. }
  718. .pagination a:hover {
  719.     color:{color:text};
  720. }
  721. a.current_page {
  722.     font-weight: bold
  723. }
  724. a.current_page:hover {
  725.     color:{color:accent};
  726. }
  727. .lnr.lnr-chevron-right, .lnr.lnr-chevron-left {
  728.     font-weight: bold;
  729.     vertical-align: middle;
  730. }
  731.  
  732.  
  733.  
  734.  
  735. @media only screen and (max-width: 992px) {
  736.     .sidebar {
  737.         display:none;
  738.     }
  739.     nav {
  740.         padding:1em;
  741.         overflow:hidden;
  742.         border-right:none;
  743.         border-bottom:1px solid {color:border};;
  744.         {block:IfAccentStripes}
  745.         border-bottom: 0.5em solid {color:accent};
  746.         {/block:IfAccentStripes}
  747.     }
  748.     .nav-wrapper {
  749.         align-self: center;
  750.     }
  751.     #blogtitle {
  752.         display:block;
  753.         margin-bottom: 0.5em;
  754.     }
  755.     #description {
  756.         display:none;
  757.     }
  758.     .navigation {
  759.         margin:0;
  760.         padding: 1em 0;
  761.         display: -webkit-box;
  762.         display: -webkit-flex;
  763.         display: -moz-box;
  764.         display: -ms-flexbox;
  765.         display: flex;
  766.         -webkit-flex-wrap: wrap;
  767.             -ms-flex-wrap: wrap;
  768.                 flex-wrap: wrap;
  769.         -webkit-box-pack: center;
  770.         -webkit-justify-content: center;
  771.            -moz-box-pack: center;
  772.             -ms-flex-pack: center;
  773.                 justify-content: center;
  774.     }
  775.     #menu-inner {
  776.         display: -webkit-box;
  777.         display: -webkit-flex;
  778.         display: -moz-box;
  779.         display: -ms-flexbox;
  780.         display: flex;
  781.         -webkit-flex-wrap: wrap;
  782.             -ms-flex-wrap: wrap;
  783.                 flex-wrap: wrap;
  784.         -webkit-box-pack: center;
  785.         -webkit-justify-content: center;
  786.            -moz-box-pack: center;
  787.             -ms-flex-pack: center;
  788.                 justify-content: center;
  789.     }
  790.     .navigation a, .navigation a:nth-of-type(odd) {
  791.         width:20%;
  792.         width: initial;
  793.         margin: 0.5em 0;
  794.         margin-right: 1.25em;
  795.         margin-left:1.25em;
  796.     }
  797.     .pagination {
  798.         padding-bottom:0;
  799.         margin: 0.7em 0;
  800.         width: 100%;
  801.     }
  802. }
  803.  
  804.  
  805.  
  806.  
  807.  
  808. /******************************* posts *******************************/
  809.  
  810.  
  811. /* wrapper */
  812.  
  813. section {
  814.     position:relative;
  815.     min-height:100vh;
  816.     justify-self: center;
  817.     -ms-grid-column-align: center;
  818. }
  819.  
  820.  
  821. /* post */
  822.  
  823. article {
  824.     position:relative;
  825.     margin-bottom:{select:Post Distance}px;
  826.     {block:PermalinkPage}margin-bottom:0px;{/block:PermalinkPage}
  827. }
  828. article:first-of-type {
  829.     margin-top:{select:Post Distance}px;
  830. }
  831.  
  832.  
  833. /* post content */
  834.  
  835. .post-content {
  836.     background-color:{color:content background};
  837.     border: 1px solid {color:border};
  838. }
  839.  
  840. article img, article li, article blockquote {
  841.     max-width: 100%;
  842.     height:auto;
  843. }
  844.  
  845.  
  846.  
  847. /* caption */
  848.  
  849. .caption {
  850.     width:100%;
  851.     margin-top:10px;
  852. }
  853. .tumblr_parent {
  854.  
  855. }
  856. .tumblr_parent p {
  857.     margin:5px 10px 5px 0px;
  858. }
  859. .caption a {
  860.     display:inline-block;
  861.     color:{color:text};
  862.     border-bottom:1px solid {color:accent};
  863.     -webkit-transition: 0.3s ease;
  864.     -o-transition: 0.3s ease;
  865.     -moz-transition: 0.3s ease;
  866.     transition:0.3s ease;
  867.     padding-bottom:0px;
  868.     margin-bottom:1px;
  869. }
  870. .caption a:hover {
  871.     color:{color:accent};
  872.     border-bottom:1px solid {color:text};
  873.     padding-bottom:1px;
  874.     margin-bottom:0px;
  875. }
  876. .tumblr_parent h2 {
  877.     font-size: 1.1em;
  878.     display: block;
  879.     margin-top: 1.2em;
  880. }
  881. a.tumblr_blog {
  882.     margin-top: 15px;
  883.     color:{color:accent};
  884. }
  885.  
  886.  
  887. /* post types */
  888.  
  889. /*text*/
  890. .title {
  891.     font-size: 1.1em;
  892.     margin-bottom: 1.2em;
  893.     text-align: center;
  894.     word-wrap: break-word;
  895.     letter-spacing: 0.1em;
  896.     text-transform: uppercase;
  897.     display: block;
  898.     color: {color:accent};
  899. }
  900.  
  901. /*link*/
  902. .title a {
  903.     color: {color:text};
  904.     border-bottom:1px solid {color:accent};
  905.     -webkit-transition: 0.5s ease;
  906.     -o-transition: 0.5s ease;
  907.     -moz-transition: 0.5s ease;
  908.     transition:0.5s ease;
  909. }
  910. .title a:hover {
  911.     border-bottom:1px solid {color:text};
  912. }
  913.  
  914. /*quote*/
  915. .quote{
  916.     text-align: center;
  917.     font-size: 1.2em;
  918.     font-style: italic;
  919.     letter-spacing: 0.05em;
  920. }
  921. .source {
  922.     margin-top:15px;
  923.     margin-right:5px;
  924.     text-align:center;
  925. }
  926.  
  927. /*audio*/
  928. .audio {
  929.     padding:5px;
  930. }
  931. .cover {
  932.     display:inline-block;
  933.     vertical-align:middle;
  934.     position: relative;
  935.     z-index: 1;
  936.     width:64px;
  937.     height:64px;
  938.     -webkit-border-radius:50%;
  939.     -moz-border-radius:50%;
  940.             border-radius:50%;
  941. }
  942. .cover img {
  943.     -webkit-border-radius:50%;
  944.     -moz-border-radius:50%;
  945.             border-radius:50%;
  946. }
  947. .playbutton {
  948.     width: 30px;
  949.     height: 30px;
  950.     overflow: hidden;
  951.     position: relative;
  952.     z-index: 1000;
  953.     margin-top:6px;
  954.     margin-left:5px;
  955. }
  956. .playbox {
  957.     display:inline-block;
  958.     vertical-align:middle;
  959.     background-color: #f2f2f2;
  960.     position: absolute;
  961.     z-index: 1000;
  962.     margin-top: 12px;
  963.     margin-left: 12px;
  964.     width:40px;
  965.     height:40px;
  966.     opacity:0.8;
  967.     -webkit-border-radius:50%;
  968.     -moz-border-radius:50%;
  969.             border-radius:50%;
  970. }
  971. .audioinfo {
  972.     border-left:2px solid {color:accent};
  973.     display: inline-block;
  974.     margin-left: 20px;
  975.     padding: 5px 10px;
  976.     vertical-align: middle;
  977.     white-space:nowrap;
  978.     overflow:hidden;
  979.     max-width:80%;
  980. }
  981. @media only screen and (max-width: 992px) {
  982.     .audioinfo {
  983.         display: block;
  984.         margin-left: 0;
  985.         margin-top: 10px;
  986.     }
  987. }
  988. .tn {
  989.     font-weight:bold;
  990.     color:{color:accent};
  991. }
  992. .al {
  993.     font-style:italic;
  994. }
  995. .ar {
  996.    
  997. }
  998.  
  999.  
  1000. /*asks*/
  1001. .ask {
  1002.    
  1003. }
  1004. .ask img, .answerer img {
  1005.     width: 25px;
  1006.     height: 25px;
  1007.     display: inline-block;
  1008.     vertical-align: middle;
  1009.     margin-left: 1em;
  1010.     margin-right: 1em;
  1011.     border-radius: 20%;
  1012.     -webkit-border-radius:20%;
  1013.     -moz-border-radius:20%;
  1014. }
  1015. .asker {
  1016.     text-align: right;
  1017. }
  1018. .asker a, .asker a:hover,
  1019. .answerer a {
  1020.     color:{color:text};
  1021. }
  1022. .answer {
  1023.    
  1024. }
  1025. .answerer {
  1026.     margin-top: 2em;
  1027. }
  1028. .question,
  1029. .answerer-answer {
  1030.     background-color: rgba(0, 0, 0, 0.05);
  1031.     padding: 1em;
  1032.     text-align: right;
  1033.     margin-top: 1em;
  1034. }
  1035. .answerer-answer {
  1036.     padding: 1px 10px;
  1037.     text-align:left;
  1038. }
  1039.  
  1040.  
  1041.  
  1042. /*chat*/
  1043. .chat ol {
  1044.     padding:0;
  1045.     list-style:none;
  1046. }
  1047. .line {
  1048.     padding:5px 0;
  1049.     border-left:1px solid {color:accent};
  1050.     padding-left:10px;
  1051.     margin-bottom:5px;
  1052. }
  1053. .line:last-child {
  1054.     border-bottom:0;
  1055. }
  1056. .label {
  1057.     font-weight:bold;
  1058.     display:block;
  1059. }
  1060.  
  1061.  
  1062.  
  1063. /* 5ppi photosets */
  1064. .photoset.pad-tiny { --photosetPadding:1%; }
  1065. .photoset.pad-small { --photosetPadding:2%; }
  1066. .photoset.pad-medium { --photosetPadding:3%; }
  1067. .photoset.pad-big { --photosetPadding:4%; }
  1068. .photoset.pad-huge { --photosetPadding:5%; }
  1069. .photo-row {
  1070.     padding:-webkit-calc(var(--photosetPadding) / 2) 0;
  1071.     padding:-moz-calc(var(--photosetPadding) / 2) 0;
  1072.     padding:calc(var(--photosetPadding) / 2) 0;
  1073.     display:-webkit-box;
  1074.     display:-webkit-flex;
  1075.     display:-moz-box;
  1076.     display:-ms-flexbox;
  1077.     display:flex;
  1078. }
  1079. .image-container {
  1080.     cursor:pointer;
  1081.     padding:0 -webkit-calc(var(--photosetPadding) / 3);
  1082.     padding:0 -moz-calc(var(--photosetPadding) / 3);
  1083.     padding:0 calc(var(--photosetPadding) / 3);
  1084. }
  1085. .image {
  1086.     width:100%;
  1087.     height:100%;
  1088.     display:block;
  1089.     -o-object-fit:cover;
  1090.        object-fit:cover;
  1091. }
  1092.  
  1093. .photo-row:first-of-type { padding-top:0; }
  1094. .photo-row:last-of-type { padding-bottom:0; }
  1095. .image-container:first-child { padding-left:0; }
  1096. .image-container:last-child { padding-right:0; }
  1097. .photo-row-1 .image-container { width:100%; }
  1098. .photo-row-2 .image-container { width:50%; }
  1099. .photo-row-3 .image-container { width:33.3333333%; }
  1100.  
  1101.  
  1102.  
  1103.  
  1104. /***************************** post info *****************************/
  1105.  
  1106. .post-content.pad-tiny,
  1107. .post-info.pad-tiny,
  1108. .post-notes.pad-tiny { padding:1%; }
  1109. .post-content.pad-small,
  1110. .post-info.pad-small,
  1111. .post-notes.pad-small { padding:2%; }
  1112. .post-content.pad-medium,
  1113. .post-info.pad-medium,
  1114. .post-notes.pad-medium { padding:3%; }
  1115. .post-content.pad-big,
  1116. .post-info.pad-big,
  1117. .post-notes.pad-big { padding:4%; }
  1118. .post-content.pad-huge,
  1119. .post-info.pad-huge,
  1120. .post-notes.pad-huge { padding:5%; }
  1121.  
  1122. .post-info {
  1123.     font-size: 0.9em;
  1124.     text-transform:lowercase;
  1125.     background-color:{color:content background};
  1126.     border: 1px solid {color:border};
  1127.     border-top: none;
  1128.     color:{color:permalink};
  1129. }
  1130.  
  1131. .post-info a {
  1132.     margin-right:10px;
  1133.     color:{color:permalink};
  1134.     -webkit-transition: 0.5s ease;
  1135.     -o-transition: 0.5s ease;
  1136.     -moz-transition: 0.5s ease;
  1137.     transition:0.5s ease;
  1138. }
  1139.  
  1140. .post-info a:hover{
  1141.     color:{color:accent};
  1142. }
  1143.  
  1144. @media only screen and (max-width: 992px) {
  1145.     .srcvia {
  1146.         font-size: 0.9em;
  1147.     }
  1148. }
  1149. .srcvia img {
  1150.     width:20px;
  1151.     height:20px;
  1152. }
  1153.  
  1154. .tags {
  1155.     font-size: 0.9em;
  1156.     margin: 20px;
  1157.     display: -webkit-box;
  1158.     display: -webkit-flex;
  1159.     display: -moz-box;
  1160.     display: -ms-flexbox;
  1161.     display: flex;
  1162.     -webkit-flex-wrap: wrap;
  1163.         -ms-flex-wrap: wrap;
  1164.             flex-wrap: wrap;
  1165.     -webkit-box-pack: center;
  1166.     -webkit-justify-content: center;
  1167.        -moz-box-pack: center;
  1168.         -ms-flex-pack: center;
  1169.             justify-content: center;
  1170.     word-break: break-all;
  1171. }
  1172. .tags a {
  1173.     color:{color:permalink};
  1174.     -webkit-transition: 0.5s ease;
  1175.     -o-transition: 0.5s ease;
  1176.     -moz-transition: 0.5s ease;
  1177.     transition:0.5s ease;
  1178.     border-bottom:1px dotted transparent;
  1179.     margin: 0 7px;
  1180. }
  1181. .tags a:hover {
  1182.     color:{color:text};
  1183.     border-bottom:1px dotted {color:accent};
  1184. }
  1185.  
  1186. .perma-pagination {
  1187.     text-align: center;
  1188.     padding-bottom: 50px;
  1189.     margin: 0 auto;
  1190.     margin-top: 20px;
  1191. }
  1192. .perma-pagination a {
  1193.     display: inline-block;
  1194.     margin: 0 10px;
  1195.     color:{color:permalink};
  1196.     -webkit-transition: 0.5s ease;
  1197.     -o-transition: 0.5s ease;
  1198.     -moz-transition: 0.5s ease;
  1199.     transition:0.5s ease;
  1200. }
  1201. .perma-pagination a:hover {
  1202.     color:{color:accent};
  1203. }
  1204.  
  1205.  
  1206.  
  1207. /* reblog/like buttons */
  1208.  
  1209. .post-info .rl-buttons {
  1210.     display:inline;
  1211.     font-size: 1.2em;
  1212.     line-height: 100%;
  1213. }
  1214. .post-info .rl-buttons .like-b {
  1215.     position:relative;
  1216.     display:inline-block;
  1217.     height:1em;
  1218.     line-height:1em;
  1219.     overflow:hidden;
  1220.     margin-bottom:-1px;
  1221.     margin-right: 3px;
  1222. }
  1223. .post-info .rl-buttons .like-b .b *,
  1224. .post-info .rl-buttons .reblog-b {
  1225.     color:{color:permalink};
  1226.     -webkit-transition: 0.5s ease;
  1227.     -o-transition: 0.5s ease;
  1228.     -moz-transition: 0.5s ease;
  1229.     transition:0.5s ease;
  1230. }
  1231. .post-info .rl-buttons .like-b:hover .b *,
  1232. .post-info .rl-buttons .reblog-b:hover {
  1233.     color:{color:accent};
  1234. }
  1235. .post-info .rl-buttons .like-b .liked + .b * {
  1236.     color:{color:accent};
  1237.     font-weight: bold;
  1238. }
  1239. .post-info .rl-buttons .like-b .like_button iframe {
  1240.     position:absolute;
  1241.     top:0;
  1242.     left:0;
  1243.     z-index:2;
  1244.     opacity:0.000001;
  1245. }
  1246. .fas.fa-sync {
  1247.     font-size: 0.88em;
  1248.     padding-top: 1px;
  1249.     display: inline-block;
  1250.     vertical-align: top;
  1251. }
  1252. .far.fa-heart {
  1253.     display: inline-block;
  1254.     padding-left: 1px;
  1255. }
  1256.  
  1257.  
  1258.  
  1259.  
  1260. /* list of notes */
  1261.  
  1262. .post-notes {
  1263.     background-color:{color:content background};
  1264.     border: 1px solid {color:border};
  1265.     text-align:left;
  1266.     font-size: 0.9em;
  1267.     color:{color:permalink};
  1268. }
  1269. .post-notes a {
  1270.     cursor:help;
  1271.     color:{color:permalink};
  1272. }
  1273. .post-notes img {
  1274.     -webkit-border-radius:50%;
  1275.             border-radius:50%;
  1276.     vertical-align:middle;
  1277.     margin-right:5px;
  1278. }
  1279. .post-notes ol {
  1280.     list-style:none;
  1281. }
  1282. .post-notes li {
  1283.     padding:5px 0px;
  1284.     text-align:left;
  1285. }
  1286. .post-notes .action a:first-of-type {
  1287.     color:{color:accent};
  1288.     -webkit-transition: 0.5s ease;
  1289.     -o-transition: 0.5s ease;
  1290.     -moz-transition: 0.5s ease;
  1291.     transition:0.5s ease;
  1292. }
  1293. .post-notes .action a:first-of-type:hover {
  1294.     color:{color:text};
  1295. }
  1296. .post-notes blockquote {
  1297.    
  1298. }
  1299. .more_notes_link_container {
  1300.     text-align:left!important;
  1301.     text-transform:lowercase;
  1302.     color:{color:text};
  1303. }
  1304. .retags, div.retags a { /* xkit */
  1305.     color:gray!important;
  1306.     font-size:9px!important; }
  1307.     div.retags {
  1308.     margin-bottom:5px;
  1309.     margin-left:40px;
  1310.     display:none;
  1311. }
  1312.  
  1313.  
  1314.  
  1315.  
  1316. /***************************** loading *****************************/
  1317.  
  1318. #loader-wrapper {
  1319.     position: fixed;
  1320.     top: 0;
  1321.     left:0;
  1322.     width: 100%;
  1323.     height: 100%;
  1324.     background: {color:background};
  1325.     z-index: 9999999999999990;
  1326.     display: -webkit-box;
  1327.     display: -webkit-flex;
  1328.     display: -moz-box;
  1329.     display: -ms-flexbox;
  1330.     display: flex;
  1331.     -webkit-box-pack: center;
  1332.     -webkit-justify-content: center;
  1333.        -moz-box-pack: center;
  1334.         -ms-flex-pack: center;
  1335.             justify-content: center;
  1336.     -webkit-box-align: center;
  1337.     -webkit-align-items: center;
  1338.        -moz-box-align: center;
  1339.         -ms-flex-align: center;
  1340.             align-items: center;
  1341. }
  1342. #loader {
  1343.     z-index: 9999999999999991;
  1344. }
  1345. .loaded #loader {
  1346.     opacity: 0;
  1347.     transition: all 0.3s ease-out;
  1348.     -webkit-transition: all 0.3s ease-out;
  1349.     -moz-transition: all 0.3s ease-out;
  1350.     -o-transition: all 0.3s ease-out;
  1351. }
  1352. .loaded #loader-wrapper {
  1353.     visibility: hidden;
  1354.     opacity: 0;
  1355.     transition: opacity 0.3s 0.3s ease-out, visibility 0.3s 0.6s;
  1356.     -webkit-transition: opacity 0.3s 0.3s ease-out, visibility 0.3s 0.6s;
  1357.     -moz-transition: opacity 0.3s 0.3s ease-out, visibility 0.3s 0.6s;
  1358.     -o-transition: opacity 0.3s 0.3s ease-out, visibility 0.3s 0.6s;
  1359. }
  1360. .no-js #loader-wrapper {
  1361.     display: none;
  1362. }
  1363.  
  1364. .sk-circle {
  1365.   margin: 100px auto;
  1366.   width: 2em;
  1367.   height: 5em;
  1368.   position: relative;
  1369. }
  1370. .sk-circle .sk-child {
  1371.   width: 100%;
  1372.   height: 100%;
  1373.   position: absolute;
  1374.   left: 0;
  1375.   top: 0;
  1376. }
  1377. .sk-circle .sk-child:before {
  1378.   content: '';
  1379.   display: block;
  1380.   margin: 0 auto;
  1381.   width: 15%;
  1382.   height: 15%;
  1383.   background-color: {color:accent};
  1384.   border-radius: 100%;
  1385.   -webkit-animation: sk-circleBounceDelay 1.2s infinite ease-in-out both;
  1386.           animation: sk-circleBounceDelay 1.2s infinite ease-in-out both;
  1387. }
  1388. .sk-circle .sk-circle2 {
  1389.   -webkit-transform: rotate(30deg);
  1390.       -ms-transform: rotate(30deg);
  1391.           transform: rotate(30deg); }
  1392. .sk-circle .sk-circle3 {
  1393.   -webkit-transform: rotate(60deg);
  1394.       -ms-transform: rotate(60deg);
  1395.           transform: rotate(60deg); }
  1396. .sk-circle .sk-circle4 {
  1397.   -webkit-transform: rotate(90deg);
  1398.       -ms-transform: rotate(90deg);
  1399.           transform: rotate(90deg); }
  1400. .sk-circle .sk-circle5 {
  1401.   -webkit-transform: rotate(120deg);
  1402.       -ms-transform: rotate(120deg);
  1403.           transform: rotate(120deg); }
  1404. .sk-circle .sk-circle6 {
  1405.   -webkit-transform: rotate(150deg);
  1406.       -ms-transform: rotate(150deg);
  1407.           transform: rotate(150deg); }
  1408. .sk-circle .sk-circle7 {
  1409.   -webkit-transform: rotate(180deg);
  1410.       -ms-transform: rotate(180deg);
  1411.           transform: rotate(180deg); }
  1412. .sk-circle .sk-circle8 {
  1413.   -webkit-transform: rotate(210deg);
  1414.       -ms-transform: rotate(210deg);
  1415.           transform: rotate(210deg); }
  1416. .sk-circle .sk-circle9 {
  1417.   -webkit-transform: rotate(240deg);
  1418.       -ms-transform: rotate(240deg);
  1419.           transform: rotate(240deg); }
  1420. .sk-circle .sk-circle10 {
  1421.   -webkit-transform: rotate(270deg);
  1422.       -ms-transform: rotate(270deg);
  1423.           transform: rotate(270deg); }
  1424. .sk-circle .sk-circle11 {
  1425.   -webkit-transform: rotate(300deg);
  1426.       -ms-transform: rotate(300deg);
  1427.           transform: rotate(300deg); }
  1428. .sk-circle .sk-circle12 {
  1429.   -webkit-transform: rotate(330deg);
  1430.       -ms-transform: rotate(330deg);
  1431.           transform: rotate(330deg); }
  1432. .sk-circle .sk-circle2:before {
  1433.   -webkit-animation-delay: -1.1s;
  1434.           animation-delay: -1.1s; }
  1435. .sk-circle .sk-circle3:before {
  1436.   -webkit-animation-delay: -1s;
  1437.           animation-delay: -1s; }
  1438. .sk-circle .sk-circle4:before {
  1439.   -webkit-animation-delay: -0.9s;
  1440.           animation-delay: -0.9s; }
  1441. .sk-circle .sk-circle5:before {
  1442.   -webkit-animation-delay: -0.8s;
  1443.           animation-delay: -0.8s; }
  1444. .sk-circle .sk-circle6:before {
  1445.   -webkit-animation-delay: -0.7s;
  1446.           animation-delay: -0.7s; }
  1447. .sk-circle .sk-circle7:before {
  1448.   -webkit-animation-delay: -0.6s;
  1449.           animation-delay: -0.6s; }
  1450. .sk-circle .sk-circle8:before {
  1451.   -webkit-animation-delay: -0.5s;
  1452.           animation-delay: -0.5s; }
  1453. .sk-circle .sk-circle9:before {
  1454.   -webkit-animation-delay: -0.4s;
  1455.           animation-delay: -0.4s; }
  1456. .sk-circle .sk-circle10:before {
  1457.   -webkit-animation-delay: -0.3s;
  1458.           animation-delay: -0.3s; }
  1459. .sk-circle .sk-circle11:before {
  1460.   -webkit-animation-delay: -0.2s;
  1461.           animation-delay: -0.2s; }
  1462. .sk-circle .sk-circle12:before {
  1463.   -webkit-animation-delay: -0.1s;
  1464.           animation-delay: -0.1s; }
  1465.  
  1466. @-webkit-keyframes sk-circleBounceDelay {
  1467.   0%, 80%, 100% {
  1468.     -webkit-transform: scale(0);
  1469.             transform: scale(0);
  1470.   } 40% {
  1471.     -webkit-transform: scale(1);
  1472.             transform: scale(1);
  1473.   }
  1474. }
  1475.  
  1476. @keyframes sk-circleBounceDelay {
  1477.   0%, 80%, 100% {
  1478.     -webkit-transform: scale(0);
  1479.             transform: scale(0);
  1480.   } 40% {
  1481.     -webkit-transform: scale(1);
  1482.             transform: scale(1);
  1483.   }
  1484. }
  1485.  
  1486.  
  1487. /***************************** your css *****************************/
  1488. /* paste css below this line */
  1489.  
  1490.  
  1491.  
  1492. {CustomCSS}</style></head><body>
  1493. <!-- ---------------------------------------------------------------- -->
  1494. <!-- ----------------------- H T M L - S T A R T -------------------- -->
  1495. <!-- ---------------------------------------------------------------- -->
  1496. <div id="loader-wrapper"><div id="loader">
  1497. <div class="sk-circle">
  1498.   <div class="sk-circle1 sk-child"></div>
  1499.   <div class="sk-circle2 sk-child"></div>
  1500.   <div class="sk-circle3 sk-child"></div>
  1501.   <div class="sk-circle4 sk-child"></div>
  1502.   <div class="sk-circle5 sk-child"></div>
  1503.   <div class="sk-circle6 sk-child"></div>
  1504.   <div class="sk-circle7 sk-child"></div>
  1505.   <div class="sk-circle8 sk-child"></div>
  1506.   <div class="sk-circle9 sk-child"></div>
  1507.   <div class="sk-circle10 sk-child"></div>
  1508.   <div class="sk-circle11 sk-child"></div>
  1509.   <div class="sk-circle12 sk-child"></div>
  1510. </div>
  1511. </div></div>
  1512.  
  1513. <div class="container">
  1514.  
  1515.  
  1516. <!-- ------------------------------ nav ---------------------------- -->
  1517. <main>
  1518.  
  1519. <div class="sidebar">
  1520.     {block:IfAccentStripes}
  1521.     <div class="bar-top"></div>
  1522.     <div class="bar-bottom"></div>
  1523.     {/block:IfAccentStripes}
  1524. </div>
  1525. <nav><div class="nav-wrapper">
  1526.    
  1527.     {block:IfSidebarImage}
  1528.     <img src="{image:Sidebar}">
  1529.     {/block:IfSidebarImage}
  1530.    
  1531.     <a href="/" id="blogtitle">{Title}</a>
  1532.     <div id="description">{Description}</div>
  1533.    
  1534.    
  1535.     <!-- ---------- navigation ---------- -->
  1536.     <div class="navigation">
  1537.    
  1538. <!-- home -->{block:IfShowHomeLink}<a href="/"><i class="lnr lnr-home"></i>{block:IfHomeLinkText}{text:Home Link Text}{/block:IfHomeLinkText}{block:IfNotHomeLinkText}Home{/block:IfNotHomeLinkText}</a>{/block:IfShowHomeLink}<!--
  1539.    
  1540. ask -->{block:AskEnabled}{block:IfShowAskLink}<a href="{text:Ask Link}"><i class="lnr lnr-bubble"></i>{block:IfAskLinkText}{text:Ask Link Text}{/block:IfAskLinkText}{block:IfNotAskLinkText}Ask{/block:IfNotAskLinkText}</a>{/block:IfShowAskLink}{/block:AskEnabled}<!--
  1541.    
  1542. menu --><a id="menulink"><i class="lnr lnr-map"></i>Menu</a><!--
  1543.  
  1544.  
  1545. submit --><span id="menu"><span id="menu-inner">{block:SubmissionsEnabled}{block:IfShowSubmitLink}<a href="/submit"><i class="lnr lnr-inbox"></i>{text:Submit Link Text}</a>{/block:IfShowSubmitLink}{/block:SubmissionsEnabled}<!--
  1546.    
  1547. custom links -->{block:IfLink1Title}<a href="{text:Link1 URL}"><i class="{select:Link1 Icon}"></i>{text:Link1 Title}</a>{/block:IfLink1Title}{block:IfLink2Title}<a href="{text:Link2 URL}"><i class="{select:Link2 Icon}"></i>{text:Link2 Title}</a>{/block:IfLink2Title}{block:IfLink3Title}<a href="{text:Link3 URL}"><i class="{select:Link3 Icon}"></i>{text:Link3 Title}</a>{/block:IfLink3Title}{block:IfLink4Title}<a href="{text:Link4 URL}"><i class="{select:Link4 Icon}"></i>{text:Link4 Title}</a>{/block:IfLink4Title}{block:IfLink5Title}<a href="{text:Link5 URL}"><i class="{select:Link5 Icon}"></i>{text:Link5 Title}</a>{/block:IfLink5Title}<!--
  1548.    
  1549. blog pages -->{block:IfShowBlogPages}{block:HasPages}{block:Pages}<a href="{URL}"><i class="lnr lnr-link"></i>{Label}</a>{/block:Pages}{/block:HasPages}{/block:IfShowBlogPages}<!--
  1550.    
  1551. random -->{block:IfShowRandomLink}<a href="/random"><i class="lnr lnr-undo"></i>Random</a>{/block:IfShowRandomLink}<!--
  1552.  
  1553. archive -->{block:IfShowArchiveLink}<a href="/archive"><i class="lnr lnr-history"></i>{block:IfArchiveLinkText}{text:Archive Link Text}{/block:IfArchiveLinkText}{block:IfNotArchiveLinkText}Archive{/block:IfNotArchiveLinkText}</a>{/block:IfShowArchiveLink}</span></span>
  1554.    
  1555.     </div>
  1556.  
  1557.  
  1558.     <!-- ---------- pagination ---------- -->
  1559.    
  1560.     <div class="pagination pagination-top">
  1561.     {block:Pagination}
  1562.    
  1563.     {block:PreviousPage}
  1564.     <a href="{PreviousPage}"<i class="lnr lnr-chevron-left"></i></a>
  1565.     {/block:PreviousPage}
  1566.    
  1567.     <a class="current_page">{CurrentPage}</a>
  1568.     <a class="current_page">/</a>
  1569.     <a class="current_page">{TotalPages}</a>
  1570.    
  1571.     {block:NextPage}
  1572.     <a href="{NextPage}"<i class="lnr lnr-chevron-right"></i></a>
  1573.     {/block:NextPage}
  1574.    
  1575.     {/block:Pagination}
  1576.     </div>
  1577.  
  1578.  
  1579.  
  1580. </div></nav>
  1581. <!-- ---------------------------- posts -------------------------- -->
  1582. <section>
  1583. {block:Posts}
  1584. <article id="{PostID}">
  1585.  
  1586.  
  1587. <!-- source/via fix -->
  1588. {block:ContentSource}<!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />{/block:SourceLogo}{block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->{/block:ContentSource}<!-- {block:NoRebloggedFrom}{block:RebloggedFrom}{ReblogParentName}{/block:RebloggedFrom}{/block:NoRebloggedFrom} -->
  1589.  
  1590.  
  1591.  
  1592. <div class="post-content {select:Post Padding}">
  1593.  
  1594. <!-- ---------- post types ---------- -->
  1595.  
  1596. {block:Text}
  1597.     {block:Title}<div class="title">{Title}</div>{/block:Title}
  1598.     <div class="caption">{Body}</div>
  1599. {/block:Text}
  1600.  
  1601. {block:Link}
  1602.     <div class="title"><a href="{URL}">{Name}</a></div>
  1603.     {block:Description}
  1604.     <div class="caption">{Description}</div>
  1605.     {/block:Description}
  1606. {/block:Link}
  1607.  
  1608. {block:Quote}
  1609.     <div class="quote">{Quote}</div>
  1610.     {block:Source}<div class="source">{Source}</div>{/block:Source}
  1611. {/block:Quote}
  1612.  
  1613. {block:Chat}
  1614.     {block:Title}<div class="title">{Title}</div>{/block:Title}
  1615.     <div class="chat">
  1616.     <ol>{block:Lines}
  1617.     <li class="line {Alt}">
  1618.         {block:Label}<span class="label">{Label}</span>{/block:Label}
  1619.         {Line}
  1620.     </li>
  1621.     {/block:Lines}</ol>
  1622.     </div>
  1623. {/block:Chat}
  1624.  
  1625. {block:Photo}
  1626.     <img src="{PhotoURL-500}" alt="{PhotoAlt}" style="width:100%;"/>
  1627. {/block:Photo}
  1628.  
  1629. {block:Photoset}
  1630.     <div class="photoset {select:Post Padding}" data-layout="{PhotosetLayout}">
  1631.     {block:Photos}<div class="image-container"
  1632.    data-width="{PhotoWidth-HighRes}"
  1633.    data-height="{PhotoHeight-HighRes}"
  1634.    data-lowres="{PhotoURL-500}"
  1635.    data-highres="{PhotoURL-HighRes}">
  1636.     <img src="{PhotoURL-HighRes}" alt="{PhotoAlt}" class="image"/>
  1637.     </div>{/block:Photos}</div>
  1638. {/block:Photoset}
  1639.  
  1640. {block:Video}
  1641.     <div class="video">{Video-500}</div>
  1642. {/block:Video}
  1643.  
  1644. {block:Audio}
  1645.     <div class="audio">
  1646.     <div class="playbox"><div class="playbutton">
  1647.     {block:AudioPlayer}{AudioPlayerWhite}{/block:AudioPlayer}
  1648.     </div></div>
  1649.     <div class="cover">
  1650.     {block:AlbumArt}<img src="{AlbumArtURL}">{/block:AlbumArt}
  1651.     </div>
  1652.     <div class="audioinfo">
  1653.     <div class="tn">{block:TrackName}{TrackName}{/block:TrackName}</div>
  1654.     <div class="al">{block:Album}{Album}{/block:Album}</div>
  1655.     <div class="ar">{block:Artist}{Artist}{/block:Artist}</div>
  1656.     </div></div>
  1657. {/block:Audio}
  1658.  
  1659. {block:Answer}
  1660.     <div class="ask">
  1661.         <div class="asker">{Asker}<img src="{AskerPortraitURL-48}"></div>
  1662.         <div class="question">{Question}</div>
  1663.     </div>
  1664.     <div class="answer">
  1665.         {block:Answerer}
  1666.         <div class="answerer">
  1667.             <img src="{AnswererPortraitURL-48}">{Answerer}
  1668.         </div>
  1669.         <div class="answerer-answer">{Answer}</div>
  1670.         {/block:Answerer}
  1671.         <div class="replies caption">{Replies}</div>
  1672.     </div>
  1673. {/block:Answer}
  1674.  
  1675. {block:IfShowCaptions}
  1676. {block:Caption}
  1677. <div class="caption">{Caption}</div>
  1678. {/block:Caption}
  1679. {/block:IfShowCaptions}
  1680.  
  1681.  
  1682. </div>
  1683.  
  1684. <!-- ---------- post information ---------- -->
  1685.  
  1686. {block:Date}
  1687. <div class="post-info {select:Post Padding}">
  1688.  
  1689.  
  1690. <span style="float:left;">
  1691.  
  1692. {block:IndexPage}
  1693.  
  1694. <!-- note count -->
  1695. {block:IfShowNotesOnIndex}
  1696. {block:NoteCount}
  1697. <a href="{Permalink}">{NoteCountWithLabel}</a>
  1698. {/block:NoteCount}
  1699. {/block:IfShowNotesOnIndex}
  1700.  
  1701. <!-- date -->
  1702. {block:IfShowDateOnIndex}
  1703. <a href="{Permalink}">
  1704. {ShortMonth} {DayOfMonth}{DayOfMonthSuffix} {Year}
  1705. </a>
  1706. {/block:IfShowDateOnIndex}
  1707.  
  1708. {/block:IndexPage}
  1709. {block:PermalinkPage}
  1710.  
  1711. <!-- note count -->
  1712. {block:NoteCount}
  1713. <a href="{Permalink}">{NoteCountWithLabel}</a>
  1714. {/block:NoteCount}
  1715.  
  1716. <!-- date -->
  1717. <a href="{Permalink}">
  1718. {ShortMonth} {DayOfMonth}{DayOfMonthSuffix} {Year}
  1719. </a>
  1720.  
  1721. <!-- src/via -->
  1722. {block:RebloggedFrom}<div class="srcvia">
  1723. source: <a href="{ReblogRootURL}">{ReblogRootName}</a>
  1724. via: <a href="{ReblogParentURL}">{ReblogParentName}</a>
  1725. </div>{/block:RebloggedFrom}
  1726.  
  1727. {/block:PermalinkPage}
  1728.  
  1729. </span><span style="float:right;">
  1730. <!-- reblog/like buttons -->
  1731. <div class="rl-buttons">
  1732.     <a class="reblog-b" href="{ReblogURL}" target="_blank">
  1733.         <i class="fas fa-sync"></i></a>
  1734.     <a class="like-b">{LikeButton}<span class="b">
  1735.         <i class="far fa-heart"></i></span></a>
  1736. </div>
  1737. </span>
  1738. <div style="clear:both;"></div>
  1739.  
  1740.  
  1741. </div> <!-- /post-info -->
  1742.  
  1743.  
  1744. <!-- tags -->
  1745. {block:HasTags}{block:IfShowTags}
  1746. <div class="tags">
  1747.     {block:Tags}<a href="{TagUrl}"># {Tag}</a>{/block:Tags}
  1748. </div>
  1749. {/block:IfShowTags}{/block:HasTags}
  1750.  
  1751.  
  1752. <!-- ---------- post notes ---------- -->
  1753.  
  1754. {block:PostNotes}
  1755. <div class="post-notes {select:Post Padding}">{PostNotes}</div>
  1756. {/block:PostNotes}
  1757.  
  1758.  
  1759. <!-- ---------- perma pagination ---------- -->
  1760.  
  1761. {block:PermalinkPagination}
  1762. <div class="perma-pagination">
  1763.     {block:NextPost}
  1764.     <a href="{NextPost}">newer post</a>
  1765.     {/block:NextPost}
  1766.     {block:PreviousPost}
  1767.     <a href="{PreviousPost}">older post</a>
  1768.     {/block:PreviousPost}
  1769.  
  1770. </div>
  1771. {/block:PermalinkPagination}
  1772.  
  1773.  
  1774. {/block:Date}
  1775. </article> <!-- /post -->
  1776. {/block:Posts}
  1777.  
  1778.  
  1779.  
  1780. <!-- ---------- pagination ---------- -->
  1781.    
  1782. <div class="pagination pagination-bottom">
  1783. {block:Pagination}
  1784.  
  1785. {block:PreviousPage}
  1786. <a href="{PreviousPage}"<i class="lnr lnr-chevron-left"></i></a>
  1787. {/block:PreviousPage}
  1788.  
  1789. <a class="current_page">{CurrentPage}</a>
  1790. <a class="current_page">/</a>
  1791. <a class="current_page">{TotalPages}</a>
  1792.  
  1793. {block:NextPage}
  1794. <a href="{NextPage}"<i class="lnr lnr-chevron-right"></i></a>
  1795. {/block:NextPage}
  1796.  
  1797. {/block:Pagination}
  1798. </div>
  1799.  
  1800.  
  1801. <!-- ---------------------------- etc -------------------------- -->
  1802.  
  1803.  
  1804.  
  1805. </section></main>
  1806.  
  1807.  
  1808.  
  1809.  
  1810. <!-- ---------- credit ---------- -->
  1811.  
  1812. <link href="https://static.tumblr.com/tpbx7ye/yiLpc9kpz/cloudythms.css" rel="stylesheet">
  1813. <style>
  1814. #credit { font-size:1em; }
  1815. #credit a, #credit a:before { color:{color:accent}; } #credit a:hover, #credit :hover:before { color:{color:accent} !important; }
  1816. </style>
  1817. <!-- credit link. you may move but not remove. -->
  1818. <div id="credit"><a href="https://cloudythms.tumblr.com/">
  1819. <i class="far fa-copyright"></i></a></div>
  1820. <!-- theme by cloudythms.tumblr.com -->
  1821.  
  1822.  
  1823. <!-- ---------- tumblr controls  ---------- -->
  1824.  
  1825. {block:IfCollapseTumblrControls}
  1826. <div class="hcontrols"><svg version="1.1" id="Layer_1" xmlns="https://www.w3.org/2000/svg" xmlns:xlink="https://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 216 216" enable-background="new 0 0 216 216" xml:space="preserve">
  1827. <path d="M89.834,1.75H3c-1.654,0-3,1.346-3,3v13.334c0,1.654,1.346,3,3,3h86.833c1.653,0,3-1.346,3-3V4.75
  1828. C92.834,3.096,91.488,1.75,89.834,1.75z"/>
  1829. <path d="M89.834,36.75H3c-1.654,0-3,1.346-3,3v13.334c0,1.654,1.346,3,3,3h86.833c1.653,0,3-1.346,3-3V39.75
  1830. C92.834,38.096,91.488,36.75,89.834,36.75z"/>
  1831. <path d="M89.834,71.75H3c-1.654,0-3,1.346-3,3v13.334c0,1.654,1.346,3,3,3h86.833c1.653,0,3-1.346,3-3V74.75
  1832. C92.834,73.095,91.488,71.75,89.834,71.75z"/>
  1833. </svg></div>
  1834. {/block:IfCollapseTumblrControls}
  1835.  
  1836. <!-- --------------------------- SCRIPTS --------------------------- -->
  1837.  
  1838.  
  1839. <!-- Fonts -->
  1840. <link href="https://fonts.googleapis.com/css?family=Fira+Mono|Lora|Open+Sans|Roboto+Mono|Roboto+Slab|Karla&amp;subset=latin-ext" rel="stylesheet">
  1841.  
  1842. <!-- FontAwesome -->
  1843. <link href="//maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css" rel="stylesheet"> <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.1.0/css/all.css" integrity="sha384-lKuwvrZot6UHsBSfcMvOkWwlCMgc0TaWr+30HWe3a4ltaBwTZhyTEggF5tJv8tbt" crossorigin="anonymous">
  1844.  
  1845. <!-- Linearicons -->
  1846. <link rel="stylesheet" href="https://cdn.linearicons.com/free/1.0.0/icon-font.min.css">
  1847.  
  1848. <!-- Smooth Scroll -->
  1849. <script src="https://cdnjs.cloudflare.com/ajax/libs/smoothscroll/1.4.1/SmoothScroll.min.js"></script>
  1850.  
  1851. <!-- Video Resizer -->
  1852. <script src="//static.tumblr.com/fwgzvyf/Oj1o08f6h/shythemes.vr.js"></script>
  1853.  
  1854.  
  1855. <!-- Tooltips -->
  1856. <script src="https://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  1857. <script>
  1858. (function($){
  1859. $(document).ready(function(){
  1860. $("a[title]").style_my_tooltips({
  1861. tip_follows_cursor:true,
  1862. tip_delay_time:30, /* put a higher number for more delay */
  1863. tip_fade_speed:300, /* put a higher number for a slower fade */
  1864. attribute:"title"
  1865. });
  1866. });
  1867. })(jQuery);
  1868. </script>
  1869. <style>
  1870. .tooltip{
  1871. display: inline;
  1872. position: relative;}
  1873. #s-m-t-tooltip {
  1874.     max-width:300px;
  1875.     border-radius: 0px;
  1876.     padding:3px 4px 4px 4px;
  1877.     margin:20px 7px -2px 20px;
  1878.     background-color:{color:background};
  1879.     border:1px solid #e0e0e0;
  1880.     border-radius: 5px 5px 5px 5px;
  1881.     font-size:0.8em;
  1882.     letter-spacing:0.5px;
  1883.     color:{color:text};
  1884.     z-index:9999999999999999;
  1885. }</style>
  1886.  
  1887.  
  1888. <!-- un-nest tumblr captions -->
  1889. <script src="https://static.tumblr.com/wgg6svp/OoTofxa0c/unnest.min.js"></script>
  1890. <script> $(function(){  $('article').unnest({
  1891.     yourCaption: ".caption",
  1892.     wrapName: ".tumblr_parent",
  1893.     newCaptionUsername: true,
  1894.     originalPostCaptionUsername: false,
  1895.     tumblrAvatars: false,
  1896.     tumblrAvatarClass: ".tumblr_avatar",
  1897.     usernameColon: false
  1898.     // .tumblr_blog
  1899.   }); }); </script>
  1900. <style>
  1901.   blockquote.tumblr_parent { border:0; margin:0; }
  1902. </style>
  1903.  
  1904.  
  1905. <!-- 5ppi photosets -->
  1906. <script>window.addEventListener('load', startup, false);
  1907. function startup() {
  1908.     let photosets = document.getElementsByClassName("photoset");
  1909.     for (let i = 0, n = photosets.length; i < n; i++) {
  1910.        makeLightboxes(photosets[i]);
  1911.        makePhotoset(photosets[i]);
  1912.    }
  1913. }</script><script src="https://static.tumblr.com/tpbx7ye/HTypdre1l/5ppiphotosets.js"></script>
  1914.  
  1915.  
  1916. <!-- tumblr controls -->
  1917. <style>
  1918. iframe.tmblr-iframe {
  1919.     z-index:99999999999999!important;
  1920.     right:0!important;
  1921.     opacity:0.3;
  1922.     padding-right:10px;
  1923.         filter:invert(1) contrast(150%);
  1924.         -webkit-filter:invert(1) contrast(150%);
  1925.      transition: all 0.5s linear 0s;
  1926.      transform:scale(0.65);
  1927.      transform-origin:100% 0;
  1928.     -webkit-transform:scale(0.65);
  1929.     -webkit-transform-origin:100% 0;
  1930.     -ms-transform:scale(0.65);
  1931.     -ms-transform-origin:100% 0;
  1932. }
  1933. iframe.tmblr-iframe:hover {
  1934.     opacity:0.5!important;
  1935. }
  1936.  
  1937. {block:IfCollapseTumblrControls}
  1938. iframe.tmblr-iframe {
  1939.     opacity:0;
  1940.     padding-right:38px;
  1941. }
  1942. .hcontrols {
  1943.     position:fixed;
  1944.     top:0;
  1945.     right:0;
  1946.     z-index:999999999;
  1947. }
  1948. .hcontrols svg {
  1949.     width:25px;
  1950.     height:20px;
  1951.     padding:12px;
  1952.     padding-right:0px;
  1953. }
  1954. .hcontrols svg path {
  1955.     fill: {color:accent};
  1956.     opacity: 0.5;
  1957. }
  1958. {/block:IfCollapseTumblrControls}
  1959.  
  1960. {block:IfNotShowTumblrControls}
  1961. iframe.tmblr-iframe, iframe.tmblr-iframe:hover, .hcontrols {
  1962.     display:none !important;
  1963. }
  1964. {/block:IfNotShowTumblrControls}
  1965. @media only screen and (max-width: 992px) {
  1966. iframe.tmblr-iframe, iframe.tmblr-iframe:hover, .hcontrols {
  1967.     display:none !important;
  1968. }
  1969. }
  1970.  
  1971. </style>
  1972.  
  1973.  
  1974. <!-- soundcloud player -->
  1975. <script>
  1976. // minimal soundcloud player © shythemes.tumblr
  1977. $(document).ready(function(){
  1978.    var color = '#efefef'; // color of play button (hex)
  1979.    $('.soundcloud_audio_player').each(function(){
  1980.        $(this).attr({ src: $(this).attr('src').split('&')[0] + '&amp;liking=false&amp;sharing=false&amp;auto_play=false&amp;show_comments=false&amp;continuous_play=false&amp;buying=false&amp;show_playcount=false&amp;show_artwork=true&amp;origin=tumblr&amp;color=' + color.split('#')[1], height: 20, width: '100%' });
  1981.    });
  1982. });
  1983. </script>
  1984.  
  1985.  
  1986. <!-- no tumblr redirects -->
  1987. <script>
  1988. $(document).ready(function(){
  1989. //remove tumblr redirects script by magnusthemes@tumblr
  1990.   $('a[href*="t.umblr.com/redirect"]').each(function(){
  1991.       var originalURL = $(this).attr("href").split("?z=")[1].split("&t=")[0];
  1992.       var replaceURL = decodeURIComponent(originalURL);
  1993.       $(this).attr("href", replaceURL);
  1994.   });
  1995. });
  1996. </script>
  1997.  
  1998.  
  1999. <!-- scroll to top -->
  2000. <script>
  2001. $(function(){
  2002.     $("#scrolltotop").click(function(){        
  2003.         $("html, body").animate({scrollTop : 0}, 500);
  2004.     });
  2005. });
  2006. $(window).scroll(function(){
  2007.     if (document.body.scrollTop > 20
  2008.         || document.documentElement.scrollTop > 20) {
  2009.         $("#scrolltotop").css("opacity","1");
  2010.     } else {
  2011.         $("#scrolltotop").css("opacity","0");
  2012.     }
  2013. });
  2014. </script>
  2015.  
  2016.  
  2017. <!-- menu -->
  2018. <script>
  2019. $(function(){
  2020.    $("#menulink").click(function(){
  2021.         $("#menu").fadeToggle(500);  
  2022.    });
  2023. });
  2024. </script>
  2025.  
  2026.  
  2027. <!-- finish loading -->
  2028. {block:IfNotWaitForImagesToLoad}
  2029. <script> // do not wait for images
  2030.     $(document).ready(function() {
  2031.             $('body').addClass('loaded');
  2032.     });
  2033. </script>
  2034. {/block:IfNotWaitForImagesToLoad}
  2035. {block:IfWaitForImagesToLoad}
  2036. <script> // wait for images
  2037.     $(window).bind('load', function(){
  2038.         $('body').addClass('loaded');
  2039.     })
  2040. </script>
  2041. {/block:IfWaitForImagesToLoad}
  2042.  
  2043.  
  2044. </div> <!-- /container -->
  2045.    
  2046. </body></html>
Advertisement
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!