Advertisement
rottenfollow229

sheathemes

Jun 3rd, 2021 (edited)
870
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 82.27 KB | None | 0 0
  1.  
  2. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  3. <html xmlns="https://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  4.  
  5. <head>
  6.  
  7. <!--Custom Fonts-->
  8. <link rel="preconnect" href="https://fonts.gstatic.com">
  9. <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;700&family=Lato:wght@400;700&family=Merriweather:wght@400;700&family=Noto+Sans+JP:wght@400;700&family=Open+Sans:wght@400;700&family=Playfair+Display&family=Poppins:wght@400;700&family=Roboto:wght@400;700&family=Titillium+Web:wght@400;700&display=swap" rel="stylesheet">
  10. <!--Custom Fonts-->
  11.  
  12. <!--Homelinks Icons -->
  13. <link href="https://rawgit.com/lykmapipo/themify-icons/master/css/themify-icons.css" rel="stylesheet">
  14. <link href="https://maxst.icons8.com/vue-static/landings/line-awesome/line-awesome/1.3.0/css/line-awesome.min.css" rel="stylesheet">
  15. <!--Homelinks Icons-->
  16.  
  17.  
  18.     <title>{Title}</title>
  19.     <link rel="shortcut icon" href="{Favicon}">
  20.     <link rel="altertnate" type="application/rss+xml" href="{RSS}">
  21.     <meta charset="utf-8">
  22.     {block:Description}
  23.     <meta name="description" content="{MetaDescription}" />
  24.     {/block:Description}
  25.     <meta http-equiv="x-dns-prefetch-control" content="off"/>
  26.     <meta name="viewport" content="width=device-width, initial-scale=1">
  27.  
  28. <!--Custom Options-->
  29. <meta name="color:background" content="#f7f7f7" />
  30. <meta name="color:accent" content="#e7235e" />
  31. <meta name="color:accented text" content="#ffffff" />
  32. <meta name="color:Text" content="#585757" />    
  33. <meta name="color:bold" content="#278489"/>
  34. <meta name="color:italic" content="#e93b6f"/>
  35. <meta name="color:Links" content="#000000" />
  36. <meta name="color:Link Hover" content="#64848c" />
  37. <meta name="color:text selection" content="#ffffff" />
  38. <meta name="color:text selection background" content="#e7235e" />
  39. <meta name="color:Blockquote" content="#64848c" />
  40. <meta name="color:scrollbar" content="#364f6b" />
  41. <meta name="color:sidebar title" content="#ffffff" />
  42. <meta name="color:Posts" content="#ffffff" />
  43. <meta name="color:Post Title" content="#000000" />
  44. <meta name="color:Post Borders" content="#f6f6f6" />
  45. <meta name="color:question" content="#000000" />
  46. <meta name="color:question background" content="#fafafa" />
  47. <meta name="color:chat odd" content="#00000"/>
  48. <meta name="color:chat even" content="#e7235e"/>
  49. <meta name="color:pagination" content="#ffffff" />
  50. <meta name="color:permalink" content="#ffffff" />
  51. <meta name="color:permalink background" content="#192533" />
  52. <meta name="color:permalink hover" content="#dadada" />
  53. <meta name="color:footer text" content="#d1d1d1" />
  54.  
  55. <meta name="select:Background Attachment" content="fixed" title="fixed">
  56. <meta name="select:Background Attachment" content="scroll" title="scroll">
  57. <meta name="select:Background Repeat" content="repeat" title="repeat">
  58. <meta name="select:Background Repeat" content="no-repeat" title="no repeat">
  59.  
  60. <meta name="select:sidebar position" content="0" title="left">
  61. <meta name="select:sidebar position" content="2" title="right">
  62.  
  63. <meta name="select:Body Font" content="Open Sans" title="Open Sans">
  64. <meta name="select:Body Font" content="Lato" title="Lato">
  65. <meta name="select:Body Font" content="Titillium Web" title="Titillium Web">
  66. <meta name="select:Body Font" content="Noto Sans JP" title="Noto Sans JP">
  67. <meta name="select:Body Font" content="Roboto" title="Roboto">
  68. <meta name="select:Body Font" content="Inter" title="Inter">
  69. <meta name="select:Body Font" content="Poppins" title="Poppins">
  70.  
  71. <meta name="select:font size" content="11" title="11px">
  72. <meta name="select:font size" content="12" title="12px">
  73. <meta name="select:font size" content="13" title="13px">
  74. <meta name="select:font size" content="14" title="14px">
  75.  
  76. <meta name="select:text align" content="left" title="left">
  77. <meta name="select:text align" content="justify" title="justify">
  78. <meta name="select:desc text align" content="center" title="center">
  79. <meta name="select:desc text align" content="justify" title="justify">
  80.  
  81. <meta name="select:Post Size" content="400" title="400px">
  82. <meta name="select:Post Size" content="450" title="450px">
  83. <meta name="select:Post Size" content="475" title="475px">
  84. <meta name="select:Post Size" content="500" title="500px">
  85. <meta name="select:Post Size" content="525" title="525px">
  86. <meta name="select:Post Size" content="540" title="540px">
  87.  
  88. <meta name="select:Post Padding" content="0" title="0px">
  89. <meta name="select:Post Padding" content="2" title="2px">
  90. <meta name="select:Post Padding" content="5" title="5px">
  91. <meta name="select:Post Padding" content="10" title="10px">
  92. <meta name="select:Post Padding" content="15" title="15px">
  93. <meta name="select:Post Padding" content="20" title="20px">
  94.  
  95. <meta name="select:Photoset gutter" content="1" title="1px">
  96. <meta name="select:Photoset gutter" content="2" title="2px">
  97. <meta name="select:Photoset gutter" content="4" title="4px">
  98. <meta name="select:Photoset gutter" content="6" title="6px">
  99. <meta name="select:Photoset gutter" content="8" title="8px">
  100. <meta name="select:Photoset gutter" content="10" title="10px">
  101.  
  102. <meta name="text:margin bottom" content="50"/>
  103.  
  104. <meta name="if:Link1" content="1" />
  105. <meta name="if:Link2" content="1" />
  106. <meta name="if:Link3" content="1" />
  107. <meta name="if:Link4" content="1" />
  108. <meta name="if:Link5" content="1" />
  109. <meta name="if:Link6" content="1" />
  110. <meta name="if:Link7" content="1" />
  111. <meta name="if:Link8" content="1" />
  112. <meta name="if:Link9" content="1" />
  113.  
  114. <meta name="text:CustomLink1URL" content="Link 1 URL" />
  115. <meta name="text:CustomLink1Name" content="Link 1" />
  116. <meta name="text:CustomLink2URL" content="Link 2 URL" />
  117. <meta name="text:CustomLink2Name" content="Link 2" />
  118. <meta name="text:CustomLink3URL" content="Link 3 URL" />
  119. <meta name="text:CustomLink3Name" content="Link 3" />
  120. <meta name="text:CustomLink4URL" content="Link 4 URL" />
  121. <meta name="text:CustomLink4Name" content="Link 4" />
  122. <meta name="text:CustomLink5URL" content="Link 5 URL" />
  123. <meta name="text:CustomLink5Name" content="Link 5" />
  124. <meta name="text:CustomLink6URL" content="Link 6 URL" />
  125. <meta name="text:CustomLink6Name" content="Link 6" />
  126. <meta name="text:CustomLink7URL" content="Link 7 URL" />
  127. <meta name="text:CustomLink7Name" content="Link 7" />
  128. <meta name="text:CustomLink8URL" content="Link 8 URL" />
  129. <meta name="text:CustomLink8Name" content="Link 8" />
  130. <meta name="text:CustomLink9URL" content="Link 9 URL" />
  131. <meta name="text:CustomLink9Name" content="Link 9" />
  132.  
  133. <meta name="image:background" content=""/>
  134. <meta name="image:header" content=""/>
  135.  
  136. <meta name="if:inverted tumblr controls" content="1" />
  137. <meta name="if:Small Cursor" content="0" />
  138. <meta name="if:Custom Text Selection" content="0"/>
  139. <meta name="if:Faded Images" content="0"/>
  140. <meta name="if:Grayscale Images" content="0"/>
  141. <meta name="if:Show Captions" content="1"/>
  142.  
  143. <!--Custom Options-->
  144.  
  145. <!------------Smooth Scroll Script------------>
  146. <script src="//ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
  147. <script src="https://cdnjs.cloudflare.com/ajax/libs/smoothscroll/1.4.6/SmoothScroll.min.js"></script>
  148. <!------------Smooth Scroll Script------------>
  149.  
  150. <!--
  151.       NPF IMAGES READJUSTMENT | @glenthemes
  152.       v2.0 [last updated: 2021-04-18]
  153. -->
  154. <link href="//dl.dropbox.com/s/bnoj86mka0bkplb/npf-override.css" rel="stylesheet">
  155. <script src="//dl.dropbox.com/s/vwrm94pcg4c9e71/npf-evenize.js"></script>
  156.  
  157. <style type="text/css">
  158.  
  159. :root {
  160.     --NPF-Image-Spacing: 4px;
  161.     --NPF-Bottom-Gap-From-Captions: 1em;
  162. }
  163.  
  164. /*----------FADE-IN ANIMATION----------*/
  165.  
  166. @keyframes fadein {
  167.     from {opacity:0;}
  168.     to {opacity:1;}
  169. }
  170.  
  171. @-moz-keyframes fadein { /* Firefox */
  172.     from {opacity:0;}
  173.     to {opacity:1;}
  174. }
  175.  
  176. @-webkit-keyframes fadein { /* Safari and Chrome */
  177.     from {opacity:0;}
  178.     to {opacity:1;}
  179. }
  180.  
  181. @-o-keyframes fadein { /* Opera */
  182.     from {opacity:0;}
  183.     to {opacity: 1;}
  184. }
  185.  
  186. /*----------TUMBLR CONTROLS----------*/
  187.  
  188. iframe.tmblr-iframe {
  189.     position:fixed!important;
  190.     z-index: 300!important;
  191.     top: 80px!important;
  192.     right: 15px!important;
  193.     opacity:0.6!important;
  194.     filter:invert(1);
  195.     -webkit-filter:invert(1);
  196.     -o-filter:invert(1);
  197.     -moz-filter:invert(1);
  198.     -ms-filter:invert(1);
  199.     filter:invert(100%) hue-rotate(180deg);
  200.     -webkit-filter:invert(100%) hue-rotate(180deg);
  201.     -moz-filter:invert(100%) hue-rotate(180deg);
  202.     -o-filter:invert(100%) hue-rotate(180deg);
  203.     -ms-filter:invert(100%) hue-rotate(180deg);
  204.     transform:scale(0.7);
  205.     transform-origin:100% 0;
  206.     -webkit-transform:scale(0.7);
  207.     -webkit-transform-origin:100% 0;
  208.     -o-transform:scale(0.7);
  209.     -o-transform-origin:100% 0;
  210.     -moz-transform:scale(0.7);
  211.     -moz-transform-origin:100% 0;
  212.     -ms-transform:scale(0.7);
  213.     -ms-transform-origin:100% 0;
  214.     -webkit-transition: 0.8s ease;
  215.     -moz-transition: 0.8s ease;
  216.     -o-transition: 0.8s ease;
  217.     transition: 0.8s ease;
  218. }
  219.  
  220. iframe.tmblr-iframe:hover {
  221.     opacity:0.8!important;
  222.     -webkit-transition: 0.8s ease;
  223.     -moz-transition: 0.8s ease;
  224.     -o-transition: 0.8s ease;
  225.     transition: 0.8s ease;
  226. }
  227.  
  228. body.night iframe.tmblr-iframe {
  229.     opacity: 1;
  230.     filter:invert(0)!important;
  231.     -webkit-filter:invert(0)!important;
  232.     -o-filter:invert(0)!important;
  233.     -moz-filter:invert(0)!important;
  234.     -ms-filter:invert(0)!important;
  235.     filter:invert(100%) hue-rotate(180deg);
  236.     -webkit-filter:invert(100%) hue-rotate(180deg);
  237.     -moz-filter:invert(100%) hue-rotate(180deg);
  238.     -o-filter:invert(100%) hue-rotate(180deg);
  239.     -ms-filter:invert(100%) hue-rotate(180deg);
  240.     -webkit-transition: 0.8s ease;
  241.     -moz-transition: 0.8s ease;
  242.     -o-transition: 0.8s ease;
  243.     transition: 0.8s ease;
  244. }
  245.  
  246.  
  247. /*--------CUSTOM TUMBLR LIGHTBOX--------*/
  248.  
  249. .vignette, #vignette {
  250.     opacity:0;
  251. }
  252. .lightbox-image, #tumblr_lightbox img {
  253.     box-shadow:none !important;
  254.     border-radius:0 !important;
  255.     max-width:none;
  256. }
  257.  
  258. .tmblr-lightbox, #tumblr_lightbox {
  259.     background-color:rgba({RGBcolor:Background}, 0.6)!important;
  260.     transition: 0.6s;
  261. }
  262.  
  263. body.night .tmblr-lightbox, body.night #tumblr_lightbox {
  264.     background-color:rgba(49, 49, 49, 0.6)!important;
  265.     transition: 0.6s;
  266. }
  267.  
  268. .lightbox-image, #tumblr_lightbox img {
  269.     background-color: {color:posts}!important;
  270.     padding: 10px !important;
  271.     -moz-box-sizing:border-box;
  272.     box-sizing:border-box;
  273.     transition: 0.6s;
  274. }
  275.  
  276. body.night .lightbox-image, body.night #tumblr_lightbox img {
  277.     background-color: #414141!important;
  278.     transition: 0.6s;
  279. }
  280.  
  281. /*----------SCROLLBAR----------*/
  282.  
  283. ::-webkit-scrollbar {
  284.     width: 10px;
  285.     height: 6px;
  286. }
  287. ::-webkit-scrollbar-button {
  288.     width: 0px;
  289.     height: 0px;
  290. }
  291. ::-webkit-scrollbar-thumb {
  292.     background-color: {color:scrollbar};
  293.     border-radius: 20px;
  294.     border: 2px solid {color:Background};
  295.     transition: 0.6s;
  296. }
  297.  
  298. body.night::-webkit-scrollbar-thumb {
  299.     background-color: #F181A3!important;
  300.     border: 2px solid #313131!important;
  301.     transition: 0.6s;
  302. }
  303.  
  304. ::-webkit-scrollbar-track {
  305.     background: {color:posts};
  306.     border: 8px solid {color:posts};
  307.     border-radius: 20px;
  308.     transition: 0.6s;
  309. }
  310.  
  311. body.night::-webkit-scrollbar-track {
  312.     background-color: #414141!important;
  313.     border: 8px solid #414141!important;
  314.     transition: 0.6s;
  315. }
  316.  
  317. ::-webkit-scrollbar-corner {
  318.     background: transparent;
  319. }
  320.  
  321. /*----------TOOLTIPS----------*/
  322.  
  323. .tippy-tooltip.custom-theme {
  324.     background-color: {color:accent};
  325.     color: {color:accented text};
  326.     text-align:center;
  327.     font-size: 12px;
  328.     font-weight: 700;
  329. }
  330.  
  331. body.night .tippy-tooltip.custom-theme  {
  332.     background-color: #F181A3!important;
  333.     transition:.6s;
  334. }
  335.  
  336. .tippy-tooltip.custom-theme .tippy-svg-arrow {
  337.   fill: {color:accent};
  338. }
  339.  
  340. body.night .tippy-tooltip.custom-theme .tippy-svg-arrow {
  341.   fill: {color:accent};
  342. }
  343.  
  344. /*----------TEXT SELECTION----------*/
  345.  
  346. {block:ifCustomTextSelection}
  347. ::selection {
  348.     background: {color:text selection background};
  349.     color: {color:text selection};
  350.     transition: 0.6s;
  351. }
  352.  
  353. body.night::selection {
  354.     background: #F181A3!important;
  355.     transition: 0.6s;
  356. }
  357.  
  358. ::-moz-selection {
  359.     background: {color:text selection background};
  360.     color: {color:text selection};
  361.     transition: 0.6s;
  362. }
  363.  
  364. body.night::-moz-selection {
  365.     background: #F181A3!important;
  366.     transition: 0.6s;
  367. }
  368.  
  369. ::-webkit-selection {
  370.     background: {color:text selection background};
  371.     color: {color:text selection};
  372.     transition: 0.6s;
  373. }
  374.  
  375. body.night::-webkit-selection {
  376.     background: #F181A3!important;
  377.     transition: 0.6s;
  378. }
  379.  
  380. {/block:ifCustomTextSelection}
  381.  
  382. /*----------THEME BASICS----------*/
  383.  
  384. body {
  385.     color: {color:text};
  386.     font-family: {select:Body Font}, helvetica, sans-serif;
  387.     font-weight: 400;
  388.     font-size: {select:font size}px;
  389.     line-height:180%;
  390.     margin:0;
  391.     padding: 0;
  392.     text-align:left;
  393.     background: {color:background} url({image:Background}) center;
  394.     background-attachment: {select:Background Attachment};
  395.     background-repeat: {select:Background Repeat};
  396.     transition:.6s;
  397.     -webkit-font-smoothing: antialiased;
  398.     -moz-osx-font-smoothing: grayscale;
  399.     animation: fadein 2.5s;
  400.     -moz-animation: fadein 2.5s; /* Firefox */
  401.     -webkit-animation: fadein 2.5s; /* Safari and Chrome */
  402.     -o-animation: fadein  2.5s; /* Opera */
  403. }
  404.  
  405. body.night {
  406.     background: #313131;
  407.     color:#fff!important;
  408.     transition:.6s;
  409. }
  410.  
  411. p:empty {
  412.     display: none;
  413. }
  414.  
  415. b,strong {
  416.     color:{color:bold};
  417.     font-weight: 700;
  418. }
  419.  
  420. body.night b, body.night strong {
  421.     color: #83EEF1!important;
  422.     transition:.6s;
  423. }
  424.  
  425. i,em {
  426.     color:{color:italic};
  427. }
  428.  
  429. body.night i, body.night em {
  430.     color: #fff!important;
  431.     transition:.6s;
  432. }
  433.  
  434. a {
  435.     color:{color:links};
  436.     text-decoration:none;
  437.     -moz-transition-duration: 0.5s;
  438.     -o-transition-duration: 0.5s;
  439.     -webkit-transition-duration: 0.5s;
  440.     transition-duration: 0.5s;
  441. }
  442.  
  443. body.night a {
  444.     color:#fff!important;
  445.     transition:.6s;
  446. }
  447.  
  448. a:hover {
  449.     color:{color:link hover};
  450.     -moz-transition-duration: 0.5s;
  451.     -o-transition-duration: 0.5s;
  452.     -webkit-transition-duration: 0.5s;
  453.     transition-duration: 0.5s;
  454. }
  455.  
  456. hr {
  457.     width: 30%;
  458.     height: 1px;
  459.     background-color: {color:post borders};
  460.     color: {color:post borders};
  461.     border: 0px solid transparent;
  462. }
  463.  
  464. small,sub,sup {
  465.     font-size: calc({select:font size}px - 0.5px);
  466. }
  467.  
  468. h1,h2,h3 {
  469.     font-weight: 700;
  470.     font-size: 1.4em;
  471.     color: {color:bold};
  472.     transition:.6s;
  473. }
  474.  
  475. h4,h5,h6 {
  476.     font-weight: 700;
  477.     font-size: 1.2em;
  478.     color: {color:bold};
  479.     transition:.6s;
  480. }
  481.  
  482. body.night h1,h2,h3,h4,h5,h6 {
  483.     color: #F181A3;
  484.     transition:.6s;
  485. }
  486.  
  487. pre {
  488.     white-space: pre-wrap;
  489.     white-space: -moz-pre-wrap;
  490.     white-space: -pre-wrap;
  491.     white-space: -o-pre-wrap;
  492.     word-wrap: break-word;
  493.     padding: 5px 10px;
  494.     font-family: inherit;
  495.     font-weight: 400;
  496.     line-height: 150%;
  497.     color: {color:question};
  498.     background-color: {color:question background};
  499. }
  500.  
  501. blockquote:not(.tumblr_parent) {
  502.     padding-left: 10px;
  503.     margin: 10px;
  504.     border-left: 2px solid {color:blockquote};
  505.     transition: 0.6s;
  506. }
  507.  
  508. body.night blockquote:not(.tumblr_parent) {
  509.     border-left: 2px solid #83EEF1!important;
  510.     transition: 0.6s;
  511. }
  512.  
  513. blockquote img {
  514.     max-width: 100%;
  515.     height: auto;
  516. }
  517.  
  518. figure {
  519.   margin: 1em 3px;
  520. }
  521.  
  522. {block:ifSmallCursor}
  523. body, a { cursor:url("https://i.imgur.com/2qleX.jpg"), auto !important; }
  524. a:hover{cursor:url("https://i.imgur.com/IepP2.jpg"), auto !important;}
  525. {/block:ifSmallCursor}
  526.  
  527. /*----------PAGINATION----------*/
  528.  
  529. #pagination {
  530.     height:auto;
  531.     width:auto;
  532.     margin: 20px auto -60px auto;
  533.     text-align:center;
  534.     background-color: {color:permalink background};
  535.     padding: 15px 20px;
  536.     font-size: 1.1em;
  537.     transition:.6s;
  538. }
  539.  
  540. .current_page {
  541.     color:{color:pagination};
  542.     background-color:{color:accent};
  543.     padding: 5px 10px;
  544.     border-radius: 5px;
  545.     transition: 0.6s;
  546. }
  547.  
  548. body.night #pagination {
  549.     background: #414141;
  550.     transition:.6s;
  551. }
  552.  
  553. #pagination a {
  554.     margin: 0 10px;
  555.     padding: 5px 10px;
  556.     border-radius: 5px;
  557.     color: {color:pagination};
  558.     font-weight: 700;
  559.     -webkit-transition:all 0.8s ease-out;
  560.     -moz-transition:all 0.8s ease-out;
  561.     transition:all 0.8s ease-out;
  562.     transition: 0.6s;
  563. }
  564.  
  565. #pagination a:hover {
  566.     color: {color:accented text};
  567.     background-color: {color:accent};
  568.     -webkit-transition:all 0.8s ease-out;
  569.     -moz-transition:all 0.8s ease-out;
  570.     transition:all 0.8s ease-out;
  571. }
  572.  
  573. body.night #pagination a:hover, body.night .current_page {
  574.     background: #fc5185!important;
  575.     transition:.6s;
  576. }
  577.  
  578. /*----------POSIS CONTAINER----------*/
  579.  
  580. .cage {
  581.     width: 100%;
  582.     height: 100%;
  583.     position: relative;
  584. }
  585.  
  586. .wrap {
  587.     position: relative;
  588.     width: calc({select:post size}px + 410px);
  589.     margin: 0px auto 150px;
  590.     display: flex;
  591.     align-items: flex-start;
  592.     flex-flow: row wrap;
  593.     {block:PermalinkPage}
  594.     width: calc(540px + 410px);
  595.     margin-top: 50px;
  596.     {/block:PermalinkPage}
  597. }
  598.  
  599. .theme-box {
  600.     position: relative;
  601.     margin: 120px auto 0;
  602.     width: 950px;
  603.     background-color: #fff;
  604.     padding: 50px 40px;
  605.     box-sizing: border-box;
  606.     {block:PermalinkPage}
  607.     display: none;
  608.     {/block:PermalinkPage}
  609.     transition:.6s;
  610. }
  611.  
  612. .theme-box h2 {
  613.     margin: 0;
  614.     color: #000;
  615.     text-align: center;
  616.     padding-bottom: 50px;
  617.     position: relative;
  618. }
  619.  
  620. .theme-box h2:before {
  621.     content: '';
  622.     position: absolute;
  623.     left: 45%;
  624.     top: 38px;
  625.     background-color: #fc5185;
  626.     width: 8%;
  627.     height: 3px;
  628.     transition:.6s;
  629. }
  630.  
  631. body.night .theme-box {
  632.     background-color: #414141;
  633.     transition:.6s;
  634. }
  635.  
  636. body.night .theme-box h2 {
  637.     color: #fff!important;
  638. }
  639.  
  640. body.night .theme-box h2:before {
  641.     background-color: #F181A3;
  642. }
  643.  
  644. .theme-card {
  645.     position: relative;
  646.     width: 250px;
  647.     height: auto;
  648.     margin: 0 10px;
  649.     overflow: hidden;
  650. }
  651.  
  652. #theme-container {
  653.     position: relative;
  654.     display: flex;
  655.     justify-content: center;
  656.     align-items: center;
  657.     flex-wrap: wrap;
  658.     gap: 20px;
  659. }
  660.  
  661. .img-bx img {
  662.     width: 251px;
  663.     object-fit: cover;
  664. }
  665.  
  666. .content-bx {
  667.     position: absolute;
  668.     top: 0;
  669.     left: 0;
  670.     width: 100%;
  671.     height: 100%;
  672. }
  673.  
  674. .content-bx:before {
  675.     content: '';
  676.     position: absolute;
  677.     top: 0;
  678.     left: 0;
  679.     width: 100%;
  680.     height: 100%;
  681.     background-color: #fc5185;
  682.     transform: scaleX(0);
  683.     transition: transform 0.5s ease-in-out;
  684.     transform-origin: right;
  685.     transition-delay: 0.5s;
  686. }
  687.  
  688. body.night .content-bx:before  {
  689.     background-color: #F181A3!important;
  690. }
  691.  
  692. .theme-card:hover .content-bx:before {
  693.     transform: scaleX(1);
  694.     transition: transform 0.5s ease-in-out;
  695.     transform-origin: left;
  696.     transition-delay: 0s;
  697. }
  698.  
  699. .theme-card .content-bx {
  700.     display: flex;
  701.     justify-content: center;
  702.     align-items: center;
  703. }
  704.  
  705. .bx-content {
  706.     padding: 10px;
  707.     z-index: 1;
  708.     box-sizing: border-box;
  709.     transition: 0.5s;
  710.     transform: translateX(-300px);
  711.     transition-delay: 0s;
  712. }
  713.  
  714. .theme-card:hover .bx-content {
  715.     transform: translateX(0px);
  716.     transition-delay: 0.5s;
  717. }
  718. .bx-content h2 {
  719.     text-align: left;
  720.     color: #fff;
  721.     font-size: 1.1em;
  722.     padding-bottom: 0;
  723. }
  724.  
  725. .bx-content h2:before {
  726.     display: none;
  727. }
  728.  
  729. .bx-content p {
  730.     margin: 0;
  731.     color: #000;
  732. }
  733.  
  734. .bx-content a:hover {
  735.     color: #fff;
  736. }
  737.  
  738. #content {
  739.     position: relative;
  740.     margin: 60px auto 60px 60px;
  741.     width: {select:Post Size}px;
  742.     {block:PermalinkPage}
  743.     width: 540px;
  744.     {/block:PermalinkPage}
  745. }
  746.  
  747. .posts {
  748.     position: relative;
  749.     width: {select:post size}px;
  750.     background-color: {color:posts};
  751.     {block:IndexPage}
  752.     margin-bottom: {text:margin bottom}px;
  753.     {/block:IndexPage}
  754.     {block:PermalinkPage}
  755.     margin-bottom: 50px;
  756.     width: 540px;
  757.     {/block:PermalinkPage}
  758.     transition:.6s;
  759. }
  760.  
  761. body.night .posts {
  762.     background-color: #414141;
  763.     transition:.6s;
  764. }
  765.  
  766. .pinned {
  767.     position: absolute;
  768.     top: 0;
  769.     right: 0;
  770.     z-index: 2;
  771. }
  772.  
  773. .la-thumbtack {
  774.     font-size: 22px;
  775.     background-color: {color:accent};
  776.     color: {color:accented text};
  777.     padding: 5px;
  778.     transition: 0.6s;
  779. }
  780.  
  781. body.night .la-thumbtack {
  782.     background-color: #F181A3!important;
  783.     transition:.6s;
  784. }
  785.  
  786. .posts ul li {
  787.     list-style: none;
  788.     margin-left: -25px;
  789.     padding-left: 10;
  790. }
  791.  
  792. .posts ul li:before {
  793.     content: "―";
  794.     padding-right: 5px;
  795.     color: {color:accent};
  796.     transition:.6s;
  797. }
  798.  
  799. body.night .posts ul li:before {
  800.     color: #F181A3;
  801.     transition:.6s;
  802. }
  803.  
  804. .posts ol {
  805.     list-style-type: upper-roman;
  806.     text-transform: justify;
  807.     margin-left: -10px;
  808. }
  809.  
  810. .posts iframe {
  811.     max-width:100%;
  812.     display: block;
  813.     padding: 0;
  814.     margin: 0
  815. }
  816.  
  817. .posts img {
  818.     max-width: 100%;
  819.     display: block;
  820.     border: 0;
  821. }
  822.  
  823. .tumblr_video_container {
  824.     width: auto !important;
  825.     height: auto !important;
  826. }
  827.  
  828. .posts .photo img {
  829.     {block:ifFadedImages}
  830.     {block:IndexPage}
  831.     opacity: 0.6;
  832.     -moz-transition: all 0.8s ease-in;
  833.     -o-transition: all 0.8s ease-in;
  834.     -webkit-transition: all 0.8s ease-in;
  835.     transition: all 0.8s ease-in;
  836. }
  837.  
  838. .posts:hover .photo img {
  839.     opacity: 1.0;
  840.     -moz-transition: all 0.8s ease-in;
  841.     -o-transition: all 0.8s ease-in;
  842.     -webkit-transition: all 0.8s ease-in;
  843.     transition: all 0.8s ease-in;
  844.     {/block:IndexPage}
  845.     {/block:ifFadedImages}
  846. }
  847.  
  848. {block:ifGrayscaleImages}
  849. {block:IndexPage}
  850. .posts .photo img {
  851.     z-index: -9999999999999999999999999px;
  852.     -webkit-filter: grayscale(100%);
  853.     filter: grayscale(100%);
  854.     filter: gray;
  855.     /* IE 6-9 */
  856.     -moz-transition: all 0.8s ease-in;
  857.     -o-transition: all 0.8s ease-in;
  858.     -webkit-transition: all 0.8s ease-in;
  859.     transition: all 0.8s ease-in;
  860. }
  861.  
  862. .posts:hover .photo img {
  863.     -webkit-filter: none;
  864.     filter: none;
  865.     -moz-transition: all 0.8s ease-in;
  866.     -o-transition: all 0.8s ease-in;
  867.     -webkit-transition: all 0.8s ease-in;
  868.     transition: all 0.8s ease-in;
  869. }
  870. {/block:IndexPage}
  871. {/block:ifGrayscaleImages}
  872.  
  873. /*----------TEXT/CAPTION CONTAINER----------*/
  874.  
  875. .photo, .video, .photo-slideshow, .has-npf .reblog-list {
  876.     padding: {select:Post Padding}px;
  877. }
  878.  
  879. .has-npf {
  880.     box-sizing: border-box;
  881. }
  882.  
  883. .caption {
  884.     text-align: {select:text align};
  885. }
  886.  
  887. .caption figcaption {
  888.     padding: 15px;
  889. }
  890.  
  891. figcaption p {
  892.     margin: 5px 0 0;
  893. }
  894.  
  895. .caption img {
  896.     max-width: 100%;
  897.     height: auto;
  898. }
  899.  
  900. .reblog-list {
  901.     padding: 0 10px;
  902. }
  903.  
  904. .reblog-header {
  905.     padding: 20px 15px 0 15px;
  906. }
  907.  
  908. .reblog-header img {
  909.     width: 25px;
  910.     height: 25px;
  911.     display: inline-block;
  912.     vertical-align: middle;
  913.     margin-right: 10px;
  914.     border-radius: 100%;
  915. }
  916.  
  917. .inactive, .user, .deactivated {
  918.     font-weight: 700;
  919.     color: {color:links};
  920.     text-align: center;
  921. }
  922.  
  923. .user:hover {
  924.     color: {color:link hover};
  925. }
  926.  
  927. .reblog-content {
  928.     padding: 5px 15px;
  929. }
  930.  
  931. .read_more {
  932.     padding: 2px 10px;
  933.     font-weight: 700;
  934.     border-radius: 20px;
  935.     color: {color:accented text};
  936.     background-color: {color:accent};
  937.     border: 2px solid transparent;
  938.     transition: 0.6s;
  939. }
  940.  
  941. body.night .read_more {
  942.     background-color: #F181A3;
  943.     transition:.6s;
  944. }
  945.  
  946. .read_more:hover {
  947.     background-color: transparent;
  948.     color: {color:links};
  949.     border: 2px solid {color:accent};
  950. }
  951.  
  952. body.night .read_more:hover {
  953.     background-color: transparent;
  954.     border: 2px solid #F181A3!important;
  955.     transition:.6s;
  956. }
  957.  
  958. /*----------POST INFO & PERMALINKS----------*/
  959.  
  960. .time {
  961.    color: {color:permalink};
  962.     background-color: {color:permalink background};
  963.     display: flex;
  964.     flex-direction: row;
  965.     padding: 10px 15px;
  966.     justify-content: space-between;
  967.     align-items: center;
  968.     transition:.6s;
  969. }
  970.  
  971. body.night .time {
  972.     background-color: #525252;
  973.     transition:.6s;
  974. }
  975.  
  976. .la-stopwatch, .la-chart-bar {
  977.     font-size: 20px;
  978.     display: inline-block;
  979.     vertical-align: middle;
  980.     margin-right: 5px;
  981.     color: {color:accent};
  982. }
  983.  
  984. body.night .la-stopwatch, body.night .la-chart-bar {
  985.     color: #83EEF1!important;
  986. }
  987.  
  988. .time a {
  989.     color: {color:permalink};
  990. }
  991.  
  992. .time a:hover {
  993.     color: {color:permalink hover};
  994. }
  995.  
  996. /*----------LIKE/REBLOG----------*/
  997.  
  998. .likereblog {
  999.     text-align: center;
  1000.     z-index: 1;
  1001.     height: 25px;
  1002. }
  1003.  
  1004. .controls a {
  1005.     position:relative;
  1006.     display:inline-block;
  1007.     margin: 0 1px;
  1008.     vertical-align: middle;
  1009.     height: 18px;
  1010. }
  1011.  
  1012. .controls a:hover {
  1013.     color: {color:permalink hover};
  1014. }
  1015.  
  1016. .la-sync-alt {
  1017.     font-size: 18px;
  1018.     color: #fff;
  1019.     -moz-transition-duration: 0.5s;
  1020.     -o-transition-duration: 0.5s;
  1021.     -webkit-transition-duration: 0.5s;
  1022.     transition-duration: 0.5s;
  1023. }
  1024.  
  1025. .la-sync-alt:hover {
  1026.     color: {color:permalink hover};
  1027.     -moz-transition-duration: 0.5s;
  1028.     -o-transition-duration: 0.5s;
  1029.     -webkit-transition-duration: 0.5s;
  1030.     transition-duration: 0.5s;
  1031. }
  1032.  
  1033. .la-heart {
  1034.     color: #fff;
  1035.     font-size: 18px;
  1036.     -moz-transition-duration: 0.5s;
  1037.     -o-transition-duration: 0.5s;
  1038.     -webkit-transition-duration: 0.5s;
  1039.     transition-duration: 0.5s;
  1040. }
  1041.  
  1042. body.night .la-heart {
  1043.     color: #83EEF1!important;
  1044. }
  1045.  
  1046. body.night .la-sync-alt {
  1047.     color: #83EEF1!important;
  1048. }
  1049.  
  1050. .la-heart:hover {
  1051.     color: {color:permalink hover};
  1052. }
  1053.  
  1054. .controls .like .liked + .ti-heart {
  1055.    opacity: 1;
  1056. }
  1057.  
  1058. .controls .like .liked + .ti-heart {
  1059.      color: #ec5a5a;
  1060. }
  1061.  
  1062. .controls .like .like_button iframe {
  1063.    position:absolute;
  1064.    top: -1px;
  1065.    left:0;
  1066.    bottom:0;
  1067.    right:0;
  1068.    width:100%;
  1069.    height:100%;
  1070.    z-index:2;
  1071.    opacity:0.000001;
  1072. }
  1073.  
  1074. /*--------POST TAGS--------*/
  1075.  
  1076. .post_tags {
  1077.     padding: 10px 0 20px;
  1078.     white-space: nowrap;
  1079.     overflow: hidden;
  1080.     position: absolute;
  1081.     width: calc({select:post size}px - 20px);
  1082. }
  1083.  
  1084. .post_tags.draggable .post_tags_inner {
  1085.     cursor: col-resize;
  1086.     -webkit-touch-callout: none;
  1087.     -webkit-user-select: none;
  1088.     -khtml-user-select: none;
  1089.     -moz-user-select: none;
  1090.     -ms-user-select: none;
  1091.     user-select: none;
  1092. }
  1093.  
  1094. .post_tags_inner {
  1095.     float: left;
  1096.     position: relative;
  1097.     padding: 0px 20px 0px 0;
  1098. }
  1099.  
  1100. .post_tags a,
  1101. .post_tags .post_tag {
  1102.     display: inline-block;
  1103.     margin-left: 3px;
  1104.     color: {color:links};
  1105.     font-size: 12px;
  1106.     font-weight: 700;
  1107. }
  1108.  
  1109. .post_tags:after {
  1110.     content: '';
  1111.     position: absolute;
  1112.     right: 0;
  1113.     bottom: 0;
  1114.     width: 50px;
  1115.     height: 40px;
  1116.     background: -moz-linear-gradient(left, rgba({RGBcolor:container},0)0, rgba({RGBcolor:container},1)100%);
  1117.   background: -webkit-gradient(linear,left top,right top, color-stop(0%, rgba({RGBcolor:container},0)), color-stop(100%,{color:container}));
  1118.   background: -webkit-linear-gradient(left, rgba({RGBcolor:container},0)0,{color:container} 100%);
  1119.   background: -o-linear-gradient(left, rgba({RGBcolor:container},0)0, rgba({RGBcolor:container},1)100%);
  1120.   background: -ms-linear-gradient(left, rgba({RGBcolor:container},0)0, rgba({RGBcolor:container},1)100%);
  1121.   background: linear-gradient(toright, rgba({RGBcolor:container},0)0,{color:container} 100%);
  1122. }
  1123.  
  1124. .post_tags a:hover,
  1125. .post_tags .post_tag:hover,
  1126. .post_tags a:focus,
  1127. .post_tags .post_tag:focus,
  1128. .post_tags a:active,
  1129. .post_tags .post_tag:active {color:{color:permalink hover};}
  1130.  
  1131. /*----------PERMALINK PAGE----------*/
  1132.  
  1133. #perma {
  1134.     width: 540px;
  1135.     padding: 10px 5px;
  1136.     margin: 0 auto;
  1137.     background-color: {color:posts};
  1138.     text-align: center;
  1139.     text-transform: lowercase;
  1140.     box-sizing: border-box;
  1141.     position: relative;
  1142.     transition:.6s;
  1143. }
  1144.  
  1145. body.night #perma {
  1146.     background-color: #414141;
  1147.     transition:.6s;
  1148. }
  1149.  
  1150. #perma span {
  1151.     font-family: 'Merriweather', serif;
  1152.     font-size: 1.2em;
  1153. }
  1154.  
  1155. #permatg {
  1156.     width: 540px;
  1157.     padding: 10px;
  1158.     margin: 10px auto 10px;
  1159.     background-color: {color:posts};
  1160.     text-align: center;
  1161.     text-transform: lowercase;
  1162.     box-sizing: border-box;
  1163.     position: relative;
  1164.     transition:.6s;
  1165. }
  1166.  
  1167. body.night #permatg {
  1168.     background-color: #414141;
  1169.     transition:.6s;
  1170. }
  1171.  
  1172. #permatg a {
  1173.     display: inline-block;
  1174.     margin: 0 5px;
  1175.     color: {color:links};
  1176. }
  1177.  
  1178. #permatg a:hover {
  1179.     color: {color:link hover};
  1180. }
  1181.  
  1182. .rb {
  1183.     position: absolute;
  1184.     left: 46%;
  1185.     margin-top: 27px;
  1186.     display: inline-block;
  1187.     z-index: 1;
  1188. }
  1189.  
  1190. .root img, .via img {
  1191.     border-radius: 100%;
  1192.     padding: 3px;
  1193.     margin-right: 2px;
  1194.     background-color: {color:accent};
  1195.     transition:.6s;
  1196. }
  1197.  
  1198. body.night .root img, .via img {
  1199.     background-color: #F181A3;
  1200.     transition:.6s;
  1201. }
  1202.  
  1203. #notecontainer {
  1204.     margin: 10px auto;
  1205.     width: 540px;
  1206.     background-color: {color:posts};
  1207.     color: {color:text};
  1208.     position: relative;
  1209.     transition:.6s;
  1210. }
  1211.  
  1212. body.night #notecontainer  {
  1213.     background-color: #414141;
  1214.     color: #fff;
  1215.     transition:.6s;
  1216. }
  1217.  
  1218. #notecontainer ol.notes {
  1219.     list-style-type: none;
  1220.     margin: 0;
  1221.     padding: 0;
  1222.     font-size: {text:body font}px;
  1223. }
  1224.  
  1225. #notecontainer ol.notes li.note {
  1226.     padding: 15px;
  1227. }
  1228.  
  1229. #notecontainer img.avatar {
  1230.     margin-right: 10px;
  1231.     vertical-align: middle;
  1232.     width: 25px;
  1233.     height: 25px;
  1234.     border-radius: 5px;
  1235. }
  1236.  
  1237. #permpage {
  1238.     text-align: center;
  1239.     margin-top: 50px;
  1240. }
  1241.  
  1242. .ti-hand-point-left, .ti-hand-point-right {
  1243.     padding: 5px;
  1244.     font-size: 20px;
  1245.     line-height: 14px;
  1246.     display: inline-block;
  1247.     height: 16px;
  1248.     border-radius: 5px;
  1249.     margin: 0 10px;
  1250.     background-color: {color:accent};
  1251.     color: {color:accented text};
  1252.     -webkit-transition: all 0.6s ease;
  1253.     -moz-transition: all 0.6s ease;
  1254.     -o-transition: all 0.6s ease;
  1255.     transition: all 0.6s ease;
  1256. }
  1257.  
  1258. body.night .ti-hand-point-left, body.night .ti-hand-point-right {
  1259.     background-color: #F181A3;
  1260.     transition:.6s;
  1261. }
  1262.  
  1263. .ti-hand-point-left:hover, .ti-hand-point-right:hover {
  1264.     background-color: transparent;
  1265.     color: {color:links};
  1266.     -webkit-transition: all 0.6s ease;
  1267.     -moz-transition: all 0.6s ease;
  1268.     -o-transition: all 0.6s ease;
  1269.     transition: all 0.6s ease;
  1270. }
  1271.  
  1272. body.night .ti-hand-point-left:hover, body.night .ti-hand-point-right:hover {
  1273.     background-color: transparent;
  1274.     color: #fff;
  1275.     transition:.6s;
  1276. }
  1277.  
  1278. /*----------TUMBLR TEXT/LINKS----------*/  
  1279.  
  1280. .posts .title, .posts .link {
  1281.     color: {color:post title};
  1282.     padding: 20px 20px 10px;
  1283.     font-size: 1.5em;
  1284.     font-weight: 700;
  1285.     line-height: 200%;
  1286.     position: relative;
  1287.     transition:.6s;
  1288. }
  1289.  
  1290. body.night .posts .title, .posts .link {
  1291.     color: #fff!important;
  1292.     transition:.6s;
  1293. }
  1294.  
  1295. .posts .title:before, .posts .link:before {
  1296.     content: '';
  1297.     position: absolute;
  1298.     top: 95%;
  1299.     left: 20px;
  1300.     width: 12%;
  1301.     height: 3px;
  1302.     background-color: {color:accent};
  1303.     transition:.6s;
  1304. }
  1305.  
  1306. body.night .posts .title:before, body.night .posts .link:before {
  1307.     background-color: #F181A3!important;
  1308.     transition:.6s;
  1309. }
  1310.  
  1311. .posts .link a {
  1312.     color: {color:post title};
  1313.     -webkit-transition: 0.8s ease;
  1314.     -moz-transition: 0.8s ease;
  1315.     -o-transition: 0.8s ease;
  1316.     transition: 0.8s ease;
  1317. }
  1318.  
  1319. .posts .link a:hover {
  1320.     color: {color:link hover};
  1321.     -webkit-transition: 0.8s ease;
  1322.     -moz-transition: 0.8s ease;
  1323.     -o-transition: 0.8s ease;
  1324.     transition: 0.8s ease;
  1325. }
  1326.  
  1327. .thumbnail img {
  1328.     width: 100%;
  1329.     height: auto;
  1330.     display: block;
  1331. }
  1332.  
  1333. /*----------TUMBLR QUOTES----------*/  
  1334.  
  1335. .qt {
  1336.     padding: 20px 20px 0;
  1337.     display: flex;
  1338.     flex-direction: row;
  1339.     justify-content: space-between;
  1340. }
  1341.  
  1342. .quote {
  1343.     font-family: 'Playfair Display', serif;
  1344.     line-height: 150%;
  1345.     font-size: 1.6em;
  1346.     padding: 20px;
  1347.     color: {color:question};
  1348.     padding-left: 20px;
  1349.     border-left: 1px solid {color:post borders};
  1350. }
  1351.  
  1352. .la-quote-right {
  1353.     border: 2px dashed {color:accent};
  1354.     color: {color:links};
  1355.     padding: 5px;
  1356.     font-size: 1.2em;
  1357.     align-self: center;
  1358.     border-radius: 5px;
  1359. }
  1360.  
  1361. .quote-box {
  1362.     font-size: 20px;
  1363.     align-self: center;
  1364.     color: {color:text};
  1365.     margin-right: 20px;
  1366. }
  1367.  
  1368. .qtsource {
  1369.     padding: 0 20px 20px;
  1370. }
  1371.  
  1372. /*----------TUMBLR AUDIO----------*/
  1373.  
  1374. .audiowrapper {
  1375.     display: flex;
  1376.     flex-direction: row;
  1377.     width: 100%;
  1378.     box-sizing: border-box;
  1379.     padding: 20px;
  1380. }
  1381.  
  1382. iframe.tumblr_audio_player {
  1383.   height: 85px;
  1384. }
  1385.  
  1386. /*----------TUMBLR QUESTION/ANSWER----------*/
  1387.  
  1388. #askcont, #replycont {
  1389.     padding: 15px;
  1390.     display: flex;
  1391.     flex-direction: column;
  1392. }
  1393.  
  1394. #askcont img {
  1395.     float:left;
  1396.     display: inline-block;
  1397.     vertical-align: middle;
  1398.     margin-right: 20px;
  1399.     width: 40px;
  1400.     height: 40px;
  1401. }
  1402.  
  1403. #replycont img {
  1404.     float: right;
  1405.     display: inline-block;
  1406.     vertical-align: middle;
  1407.     margin-left: 20px;
  1408.     width: 40px;
  1409.     height: 40px;
  1410. }
  1411.  
  1412. #asker {
  1413.     text-transform: lowercase;
  1414.     color: {color:links};
  1415.     margin: 10px 0 20px;
  1416.     display: flex;
  1417.     transition:.6s;
  1418. }
  1419.  
  1420. body.night #asker  {
  1421.     transition:.6s;
  1422.     color: #F181A3;
  1423. }
  1424.  
  1425. #asking, #replying {
  1426.     align-self: center;
  1427.     line-height: 20px;
  1428. }
  1429.  
  1430. #replier {
  1431.     text-transform: lowercase;
  1432.     color: {color:links};
  1433.     margin-bottom: 20px;
  1434.     display: flex;
  1435.     justify-content: flex-end;
  1436.     transition:.6s;
  1437. }
  1438.  
  1439. body.night #replier {
  1440.     transition:.6s;
  1441.     color: #F181A3;
  1442. }
  1443.  
  1444. #replying {
  1445.     text-align: right;
  1446. }
  1447.  
  1448. #asker a, #replier a {
  1449.     color: {color:links};
  1450.     font-weight: 700;
  1451.     text-align: capitalize;
  1452.     font-size: 1.1em;
  1453. }
  1454.  
  1455. #asker a:hover, #replier a:hover {
  1456.     color: {color:links};
  1457. }
  1458.  
  1459. .question {
  1460.     display: block;
  1461.     text-align: justify;
  1462.     padding: 10px 15px;
  1463.     background-color: {color:question background};
  1464.     color: {color:question};
  1465. }
  1466.  
  1467. body.night .question {
  1468.     background: #525252;
  1469.     color: #fff;
  1470.     transition:.6s;
  1471. }
  1472.  
  1473. .answer {
  1474.     padding: 15px;
  1475.     background-color: {color:question background};
  1476.     color: {color:question};
  1477. }
  1478.  
  1479. body.night .answer {
  1480.     background: #525252;
  1481.     color: #fff;
  1482.     transition:.6s;
  1483. }
  1484.  
  1485. .question p {margin: 0!important;}
  1486. .answer p {margin: 0!important;}
  1487. .asker-link {font-weight: 700;}
  1488.  
  1489. /*----------TUMBLR CHAT----------*/
  1490.  
  1491. .chatp {
  1492.     padding: 20px;
  1493. }
  1494.  
  1495. .chat .line {
  1496.     margin-top: 0px;
  1497.     padding: 20px;
  1498.     border-bottom: 1px solid {color:post borders};
  1499. }
  1500.  
  1501. .chat .line:last-of-type {
  1502.     margin-bottom: 0px;
  1503.     border-bottom: none;
  1504. }
  1505.  
  1506. .chat .label {
  1507.     text-transform: capitalize;
  1508. }
  1509.  
  1510. .line:nth-child(odd) .label b {
  1511.     color: {color:chat odd};
  1512.     font-weight: 700;
  1513.     margin-right: 5px;
  1514.     font-size: 1.1em;
  1515.     transition:.6s;
  1516. }
  1517.  
  1518. body.night .line:nth-child(odd) .label b  {
  1519.     color:#fff!important;
  1520.     transition:.6s;
  1521. }
  1522.  
  1523. .line:nth-child(even) .label b {
  1524.     color: {color:chat even};
  1525.     font-weight: 700;
  1526.     margin-right: 5px;
  1527.     font-size: 1.1em;
  1528. }
  1529.  
  1530. body.night .line:nth-child(even) .label b {
  1531.     color: #83EEF1!important;
  1532.     transition:.6s;
  1533. }
  1534.  
  1535. #link-bar {
  1536.     height: 60px;
  1537.     position: fixed;
  1538.     top: 0;
  1539.     left: 0;
  1540.     right: 0;
  1541.     background-color: {color:posts};
  1542.     z-index: 99;
  1543.     display: flex;
  1544.     justify-content: space-between;
  1545.     align-items: center;
  1546.     padding: 0 0 0 20px;
  1547.     transition:.6s;
  1548. }
  1549.  
  1550. body.night #link-bar {
  1551.     background-color: #414141;
  1552.     transition:.6s;
  1553. }
  1554.  
  1555. #link-bar h2 {
  1556.     font-weight: 700;
  1557.     color: {color:links};
  1558.     transition:.6s;
  1559. }
  1560.  
  1561. body.night #link-bar h2 {
  1562.     color: #fff;
  1563. }
  1564.  
  1565. #link-bar img {
  1566.     width: 40px;
  1567.     height: 40px;
  1568.     display: inline-block;
  1569.     vertical-align: middle;
  1570.     margin-right: 10px;
  1571.     border-radius: 100%;
  1572. }
  1573.  
  1574. .info-button {
  1575.     display: none;
  1576. }
  1577.  
  1578. .la-sun, .la-moon {
  1579.     background-color: #43dde6;
  1580.     color: #000;
  1581.     padding: 20px;
  1582.     width: 60px;
  1583.     height: 60px;
  1584.     box-sizing: border-box;
  1585.     font-size: 20px;
  1586.     transition:.6s;
  1587. }
  1588.  
  1589. body.night .la-sun {
  1590.     color: #000!important;
  1591.     transition:.6s;
  1592. }
  1593.  
  1594. #link-bar a {
  1595.     display: inline-block;
  1596.     margin: 0 20px;
  1597.     font-weight: 700;
  1598.     color: {color:links};
  1599.     position: relative;
  1600. }
  1601.  
  1602. #link-bar a:before {
  1603.     content: '';
  1604.     position: absolute;
  1605.     left: 0;
  1606.     top: 25px;
  1607.     width: 0;
  1608.     height: 2px;
  1609.     background-color: transparent;
  1610.     transition: 0.8s;
  1611. }
  1612.  
  1613. #link-bar a:hover:before {
  1614.     content: '';
  1615.     position: absolute;
  1616.     left: 0;
  1617.     top: 25px;
  1618.     width: 100%;
  1619.     height: 2px;
  1620.     background-color: {color:accent};
  1621.     transition: 0.8s;
  1622. }
  1623.  
  1624. body.night #link-bar a:hover:before {
  1625.     background-color: #83EEF1!important;
  1626.     transition:.6s;
  1627. }
  1628.  
  1629. .slide-panel {
  1630.     display: none;
  1631. }
  1632.  
  1633. .header {
  1634.     position: relative;
  1635.     height: 95vh;
  1636.     top: 60px;
  1637.     right: 0;
  1638.     {block:PermalinkPage}
  1639.     display: none;
  1640.     {/block:PermalinkPage}
  1641. }
  1642.  
  1643. #small-header {
  1644.     display: none;
  1645. }
  1646.  
  1647. .header-image {
  1648.     width: 100%;
  1649.     height: 60%;
  1650.     background-color: #fc5185;
  1651.     transition:.6s;
  1652. }
  1653.  
  1654. .header-image img {
  1655.     width: 100%;
  1656.     height: auto;
  1657.     object-fit: cover;
  1658.     /*opacity: 0.8;*/
  1659. }
  1660.  
  1661. body.night .header-image {
  1662.     background-color: #F181A3;
  1663.     transition:.6s;
  1664. }
  1665.  
  1666. #description-bar {
  1667.     width: 100%;
  1668.     height: 40%;
  1669.     background-color: {color:permalink background};
  1670.     position: absolute;
  1671.     bottom: 0;
  1672.     display: flex;
  1673.     flex-direction: row;
  1674. }
  1675.  
  1676. .description {
  1677.     width: 50%;
  1678.     background-color: {color:posts};
  1679.     padding: 30px;
  1680.     box-sizing: border-box;
  1681.     transition:.6s;
  1682. }
  1683.  
  1684.  
  1685. body.night .description {
  1686.     background-color: #414141;
  1687.     transition:.6s;
  1688. }
  1689.  
  1690. .description h2 {
  1691.     position: relative;
  1692.     color: #000;
  1693.     font-size: 1.5em;
  1694.     transition:.6s;
  1695. }
  1696.  
  1697. body.night .description h2 {
  1698.     color: #fff;
  1699.     transition:.6s;
  1700. }
  1701.  
  1702. .description h2:before {
  1703.     content: '';
  1704.     position: absolute;
  1705.     top: 40px;
  1706.     left: 0;
  1707.     width: 8%;
  1708.     height: 3px;
  1709.     background-color: {color:accent};
  1710.     transition:.6s;
  1711. }
  1712.  
  1713. body.night .description h2:before {
  1714.     background-color: #F181A3;
  1715.     transition:.6s;
  1716. }
  1717.  
  1718. .description p {
  1719.     margin-top: 60px;
  1720. }
  1721.  
  1722. .navigation {
  1723.     width: 50%;
  1724.     background-color: {color:permalink bckground};
  1725.     padding: 30px;
  1726.     box-sizing: border-box;
  1727.     transition:.6s;
  1728. }
  1729.  
  1730. body.night .navigation {
  1731.     background-color: #525252;
  1732.     transition:.6s;
  1733. }
  1734.  
  1735. .navigation h2 {
  1736.     position: relative;
  1737.     color: #fff;
  1738.     font-size: 1.5em;
  1739. }
  1740.  
  1741. .navigation h2:before {
  1742.     content: '';
  1743.     position: absolute;
  1744.     top: 40px;
  1745.     left: 0;
  1746.     width: 8%;
  1747.     height: 3px;
  1748.     background-color: {color:accent};
  1749.     transition:.6s;
  1750. }
  1751.  
  1752. body.night .navigation h2:before {
  1753.     background-color: #F181A3;
  1754.     transition:.6s;
  1755. }
  1756.  
  1757. .morelinks {
  1758.     margin-top: 40px;
  1759.     display: flex;
  1760.     flex-wrap: wrap;
  1761.     justify-content: space-between;
  1762. }
  1763.    
  1764. .morelinks a {
  1765.     width: 25%;
  1766.     margin: 10px 1px;
  1767.     border: 2px solid #fff;
  1768.     color: #fff;
  1769.     padding: 5px 15px;
  1770.     border-radius: 30px;
  1771. }
  1772.    
  1773. .morelinks a:hover {
  1774.     border: 2px solid transparent;
  1775.     background-color: #fff;
  1776.     color: #444;
  1777.     transition: 0.6s;
  1778. }
  1779.    
  1780. body.night .morelinks a:hover {
  1781.     background-color: #414141;
  1782.     color: #fff;
  1783.     transition: 0.6s;
  1784. }
  1785.  
  1786. #sidebar-cont {
  1787.     margin-top: 60px;
  1788.     width: 350px;
  1789.     position: -webkit-sticky;
  1790.     position: sticky;
  1791.     top: 115px;
  1792.     {block:PermalinkPage}
  1793.     margin-top: 0;
  1794.     top: 110px;
  1795.     {/block:PermalinkPage}
  1796. }
  1797.  
  1798. .about-me-title {
  1799.     background-color: {color:permalink background};
  1800.     color: {color:permalink};
  1801.     font-size: 1.2em;
  1802.     font-weight: 700;
  1803.     line-height: 200%;
  1804.     position: relative;
  1805.     padding: 5px 20px;
  1806.     box-sizing: border-box;
  1807.     transition:.6s;
  1808. }
  1809.  
  1810. body.night .about-me-title {
  1811.     background-color: #525252;
  1812.     transition:.6s;
  1813. }
  1814.  
  1815. .about-me-title:before {
  1816.     content: '';
  1817.     position: absolute;
  1818.     top: 94%;
  1819.     left: 20px;
  1820.     width: 12%;
  1821.     height: 3px;
  1822.     background-color: {color:accent};
  1823.     transition:.6s;
  1824. }
  1825.  
  1826. body.night .about-me-title:before {
  1827.     background-color: #F181A3;
  1828.     transition:.6s;
  1829. }
  1830.  
  1831. .updates {
  1832.     background-color: {color:posts};
  1833.     padding: 20px;
  1834.     box-sizing: border-box;
  1835.     transition:.6s;
  1836. }
  1837.  
  1838. body.night .updates {
  1839.     background-color: #414141;
  1840.     transition:.6s;
  1841. }
  1842.  
  1843. .updates p {
  1844.     margin: 5px 0;
  1845. }
  1846.  
  1847. .bsearch {
  1848.     display: flex;
  1849. }
  1850.  
  1851. .search .query {
  1852.    border: 0;
  1853.    outline: 0;
  1854.    padding: 0;
  1855.    font-family: inherit;
  1856.    font-size: inherit;
  1857.    color: inherit;
  1858.    background-color: transparent;
  1859.    width: 55px;
  1860. }
  1861.  
  1862. .search {
  1863.     padding: 10px 10px;
  1864.     background-color: {color:question background};
  1865.     color: #000;
  1866.     text-align: left;
  1867.     width: 100%;
  1868.     line-height: 25px;
  1869. }
  1870.  
  1871. .ti-search {
  1872.     display: inline-block;
  1873.     background-color: {color:accent};
  1874.     color: {color:accented text};
  1875.     font-size: 12px;
  1876.     width: 8px;
  1877.     height: 8px;
  1878.     line-height: 8px;
  1879.     padding: 20px;
  1880. }
  1881.  
  1882. ::-webkit-input-placeholder {color: {color:text};}
  1883. :-moz-placeholder {color: inherit; opacity:1;}
  1884. ::-moz-placeholder {color: inherit; opacity:1;}
  1885. :-ms-input-placeholder {color: inherit;}
  1886.  
  1887. input:focus::-webkit-input-placeholder {color: transparent;}
  1888. input:focus:-moz-placeholder {color: transparent;}
  1889. input:focus::-moz-placeholder {color: transparent;}
  1890. input:focus:-ms-input-placeholder { color: transparent;}
  1891.  
  1892. #footer {
  1893.     position: relative;
  1894.     height: auto;
  1895.     padding: 50px 100px;
  1896.     background-color: {color:permalink background};
  1897.     display: flex;
  1898.     justify-content: space-around;
  1899.     flex-wrap: wrap;
  1900.     flex-direction: row;
  1901.     transition:.6s;
  1902. }
  1903.  
  1904. body.night #footer {
  1905.     background-color: #414141;
  1906.     transition:.6s;
  1907. }
  1908.  
  1909. #footer .disclaimer, #footer .quick-links, #footer .other-link {
  1910.     width: 30%;
  1911. }
  1912.  
  1913. .disclaimer h2, .quick-links h2, .other-link h2 {
  1914.    color: {color:permalink};
  1915.    position: relative;
  1916.    font-weight: 700;
  1917.    margin-bottom: 25px;
  1918. }
  1919.  
  1920. .disclaimer h2:before, .quick-links h2:before, .other-link h2:before {
  1921.     content: '';
  1922.     position: absolute;
  1923.     bottom: -10px;
  1924.     left: 0;
  1925.     width: 8%;
  1926.     height: 3px;
  1927.     background-color: {color:accent};
  1928. }
  1929.  
  1930. body.night .disclaimer h2:before, body.night .quick-links h2:before, body.night  .other-link h2:before {
  1931.     transition:.6s;
  1932.     background-color: #F181A3;
  1933. }
  1934.  
  1935. .disclaimer p {
  1936.     color: {color:footer text};
  1937.     transition:.6s;
  1938. }
  1939.  
  1940. body.night .disclaimer p {
  1941.     transition:.6s;
  1942.     color: #fff;
  1943. }
  1944.  
  1945. .quick-links {
  1946.     margin: 0;
  1947.     padding: 0;
  1948. }
  1949.  
  1950. .quick-links li {
  1951.     list-style: none;
  1952. }
  1953.  
  1954. .quick-links li a {
  1955.     color: {color:footer text};
  1956. }
  1957.  
  1958. .quick-links li a:hover {
  1959.     color: #999999;
  1960. }
  1961.  
  1962. .other-link a {
  1963.     display: inline-block;
  1964.     margin: 0 5px;
  1965. }
  1966.  
  1967. .quick-links li a:before {
  1968.     content: '-';
  1969.     margin-right: 5px;
  1970.     color: {color:accent};
  1971.     transition:.6s;
  1972. }
  1973.  
  1974. body.night li a:before {
  1975.     transition:.6s;
  1976.     color: #F181A3;
  1977. }
  1978.  
  1979. .la-discord, .la-coffee {
  1980.     font-size: 40px;
  1981.     color: {color:accent};
  1982.     -webkit-transition: 0.8s ease;
  1983.     -moz-transition: 0.8s ease;
  1984.     -o-transition: 0.8s ease;
  1985.     transition: 0.8s ease;
  1986. }
  1987.  
  1988. body.night .la-discord, body.night .la-coffee {
  1989.     color: #83EEF1!important;
  1990. }
  1991.  
  1992. .la-discord:hover, .la-coffee:hover {
  1993.     color: #999999;
  1994.     -webkit-transitfion: 0.8s ease;
  1995.     -moz-transition: 0.8s ease;
  1996.     -o-transition: 0.8s ease;
  1997.     transition: 0.8s ease;
  1998. }
  1999.  
  2000. /*----------THEME CREDIT/DO NOT REMOVE!!!---------*/
  2001.  
  2002. #bottom {
  2003.     bottom: 8px;
  2004.     position: fixed;
  2005.     right: 10px;
  2006.     z-index: 99;
  2007. }
  2008.  
  2009. #bottom a:hover {
  2010.     color: {color:accented text};
  2011. }
  2012.  
  2013. .la-arrow-circle-up {
  2014.     padding: 3px;
  2015.     font-size: 18px;
  2016.     width: 18px;
  2017.     display: block;
  2018.     background-color: {color:accent};
  2019.     color: {color:accented text};
  2020.     transition:.6s;
  2021. }
  2022.  
  2023. body.night .la-arrow-circle-up {
  2024.     background-color: #F181A3;
  2025.     transition:.6s;
  2026. }
  2027.  
  2028. /*----------SCROLL TO TOP---------*/
  2029.  
  2030. #scrollToTop:link,
  2031. #scrollToTop:visited {
  2032.     display: none;
  2033.     position: fixed;
  2034.     font-size: 12px;
  2035.     bottom: 11px;
  2036.     right: 10px;
  2037.     color: {color:accented text};
  2038.     padding: 0px 5px;
  2039.     width: auto;
  2040.     z-index: 900;
  2041.     font-weight: 700;
  2042. }
  2043.  
  2044. @media screen and (max-width: 950px) {
  2045.     html, body {
  2046.         overflow-x: hidden;
  2047.     }
  2048.    
  2049.     .tmblr-iframe--app-cta-button {
  2050.         display: none!important;
  2051.     }
  2052.    
  2053.     .info-button {
  2054.         display: block;
  2055.         width: 30px;
  2056.         height: 30px;
  2057.         box-sizing: border-box;
  2058.         cursor: pointer;
  2059.         border: none;
  2060.         outline: none;
  2061.         background-color: {color:accent};
  2062.         position: absolute;
  2063.         top: 15px;
  2064.         left: 25px;
  2065.         border-radius: 100%;
  2066.         overflow: hidden;
  2067.         transition: 0.6s;
  2068.     }
  2069.    
  2070.     body.night .info-button {
  2071.         background-color: #F181A3!important;
  2072.         transition:.6s;
  2073.     }
  2074.  
  2075.     .info-button span {
  2076.         display: block;
  2077.         width: 18px;
  2078.         height: 3px;
  2079.         background-color: {color:accented text};
  2080.         position: absolute;
  2081.         top: -6px;
  2082.         left: -25px;
  2083.         transition: .5s;
  2084.     }
  2085.    
  2086.     .info-button span:before {
  2087.         content: '';
  2088.         position: absolute;
  2089.         top: -5px;
  2090.         left: 0;
  2091.         width: 100%;
  2092.         height: 3px;
  2093.         background-color: {color:accented text};
  2094.         transition: .5s;
  2095.     }
  2096.  
  2097.     .info-button span:after {
  2098.         content: '';
  2099.         position: absolute;
  2100.         top: 5px;
  2101.         left: 0;
  2102.         width: 100%;
  2103.         height: 3px;
  2104.         background-color: {color:accented text};
  2105.         transition: .5s;
  2106.     }
  2107.    
  2108.     .info-button.toggle span {
  2109.         background-color: transparent;
  2110.     }
  2111.  
  2112.     .info-button.toggle span:before {
  2113.         top: 0;
  2114.         transform: rotate(45deg);
  2115.     }
  2116.  
  2117.     .info-button.toggle span:after {
  2118.         top: 0;
  2119.         transform: rotate(-45deg);
  2120.     }
  2121.    
  2122.     .header {
  2123.         display: none;
  2124.     }
  2125.    
  2126.     .homelinks {
  2127.         display: none;
  2128.     }
  2129.    
  2130.     #small-header {
  2131.         position: relative;
  2132.         display: block;
  2133.         background-color: {color:posts};
  2134.         margin: 150px auto 50px;
  2135.         width: 90%;
  2136.         padding: 40px;
  2137.         box-sizing: border-box;
  2138.         transition:.6s;
  2139.     }
  2140.  
  2141.     body.night #small-header {
  2142.         background-color: #414141!important;
  2143.         transition:.6s;
  2144.     }
  2145.  
  2146.     #small-header h2 {
  2147.         position: relative;
  2148.         color: #000;
  2149.         font-size: 1.5em;
  2150.         transition:.6s;
  2151.     }
  2152.  
  2153.     body.night #small-header h2 {
  2154.         color: #fff!important;
  2155.         transition:.6s;
  2156.     }
  2157.  
  2158.     #small-header h2:before {
  2159.         content: '';
  2160.         position: absolute;
  2161.         top: 40px;
  2162.         left: 0;
  2163.         width: 8%;
  2164.         height: 3px;
  2165.         background-color: {color:accent};
  2166.         transition:.6s;
  2167.     }
  2168.  
  2169.     body.night #small-header h2:before {
  2170.         background-color: #F181A3!important;
  2171.         transition:.6s;
  2172.     }
  2173.    
  2174.     #small-header p {
  2175.         margin-top: 45px;
  2176.     }
  2177.    
  2178.     .small-links a {
  2179.         display: inline-block;
  2180.         margin: 0 5px;
  2181.         font-weight: 700;
  2182.         color: {color:links};
  2183.         position: relative;
  2184.     }
  2185.    
  2186.     .small-links a:first-child {
  2187.         margin-left: 0;
  2188.     }
  2189.  
  2190.     .small-links a:before {
  2191.         content: '';
  2192.         position: absolute;
  2193.         left: 0;
  2194.         top: 25px;
  2195.         width: 0;
  2196.         height: 2px;
  2197.         background-color: transparent;
  2198.         transition: 0.8s;
  2199.     }
  2200.  
  2201.     .small-links a:hover:before {
  2202.         content: '';
  2203.         position: absolute;
  2204.         left: 0;
  2205.         top: 25px;
  2206.         width: 100%;
  2207.         height: 2px;
  2208.         background-color: {color:accent};
  2209.         transition: 0.8s;
  2210.     }
  2211.  
  2212.     body.night .small-links a:hover:before {
  2213.         background-color: #83EEF1!important;
  2214.         transition:.6s;
  2215.     }
  2216.    
  2217.     .theme-box {
  2218.         width: 90%;
  2219.         margin-top: 50px;
  2220.     }
  2221.    
  2222.     .theme-box h2 {
  2223.         text-align: left;
  2224.         padding-left: 30px;
  2225.     }
  2226.  
  2227.     .theme-box h2:before {
  2228.         content: '';
  2229.         position: absolute;
  2230.         left: 30px;
  2231.     }
  2232.    
  2233.     .theme-card {
  2234.         width: 90%;
  2235.         margin-bottom: 20px;
  2236.     }
  2237.    
  2238.     .img-bx img {
  2239.         width: 100%;
  2240.     }
  2241.    
  2242.     .bx-content {
  2243.         transform: translateX(-1000px);
  2244.     }
  2245.    
  2246.     .bx-content h2, .bx-content p {
  2247.         text-align: center;
  2248.         padding-left: 0;
  2249.     }
  2250.    
  2251.     .bx-content h2 {
  2252.         font-size: 1.5em;
  2253.     }
  2254.    
  2255.     .wrap {
  2256.         width: 90%;
  2257.     }
  2258.    
  2259.     #sidebar-cont {
  2260.         display: none;
  2261.     }
  2262.    
  2263.     #content, .posts, #notecontainer, #permatg, #perma {
  2264.         width: 100%;
  2265.         margin-left: 0;
  2266.         margin-right: 0;
  2267.     }
  2268.    
  2269.     .slide-panel {
  2270.         width: 100%;
  2271.         height: calc(100% - 60px);
  2272.         position: fixed;
  2273.         bottom: 0;
  2274.         left: -100%;
  2275.         background-color: {color:permalink background};
  2276.         z-index: 9;
  2277.         padding: 25px 30px;
  2278.         box-sizing: border-box;
  2279.         transition: 0.6s;
  2280.         display: block;
  2281.         overflow: auto;
  2282.     }
  2283.    
  2284.     .active {
  2285.         left: 0;
  2286.         transition: 0.6s;
  2287.     }
  2288.    
  2289.     body.night .slide-panel {
  2290.         background-color: #313131!important;
  2291.         transition:.6s;
  2292.     }
  2293.    
  2294.     .slide-panel h2 {
  2295.         color: #fff;
  2296.         padding-left: 20px;
  2297.     }
  2298.    
  2299.     .slide-updates {
  2300.         margin-top: 30px;
  2301.         padding: 0 20px;
  2302.     }
  2303.    
  2304.     .slide-updates b {
  2305.         color: {color:accent};
  2306.         padding-right: 5px;
  2307.     }
  2308.    
  2309.     .slide-updates p {
  2310.         color: #fff;
  2311.         transition:.6s;
  2312.     }
  2313.    
  2314.     body.night .slide-updates b {
  2315.         color: #83EEF1!important;
  2316.     }
  2317.    
  2318.     .small-navi {
  2319.         margin-top: 30px;
  2320.         display: flex;
  2321.         flex-wrap: wrap;
  2322.         justify-content: space-between;
  2323.     }
  2324.    
  2325.     .small-navi a {
  2326.         width: 20%;
  2327.         margin: 20px;
  2328.         border: 2px solid #fff;
  2329.         color: #fff;
  2330.         padding: 5px 15px;
  2331.         border-radius: 30px;
  2332.     }
  2333.    
  2334.     .small-navi a:hover {
  2335.         border: 2px solid transparent;
  2336.         background-color: #fff;
  2337.         color: #444;
  2338.         transition: 0.6s;
  2339.     }
  2340.    
  2341.     body.night .small-navi a:hover {
  2342.         background-color: #414141;
  2343.         color: #fff;
  2344.         transition: 0.6s;
  2345.     }
  2346.    
  2347.     .slide-about {
  2348.         padding: 20px;
  2349.         color: #fff;
  2350.     }
  2351.    
  2352.     .slide-about p {
  2353.         margin-top: 0;
  2354.     }
  2355.    
  2356.     .cred {
  2357.         display: none;
  2358.     }
  2359.    
  2360.     #scrollToTop:link, #scrollToTop:visited {
  2361.         right: 5px;
  2362.     }
  2363.    
  2364.     #footer {
  2365.         padding: 40px;
  2366.         flex-direction: column;
  2367.         box-sizing: border-box;
  2368.         gap: 20px;
  2369.     }
  2370.    
  2371.     #footer .disclaimer, #footer .quick-links, #footer .other-link {
  2372.         width: 100%;
  2373.     }
  2374.  
  2375.  
  2376. }
  2377.  
  2378. {CustomCSS}
  2379. </style>
  2380.  
  2381. <!-----------Scroll To Top Script----------->
  2382. <script type="text/javascript" src="https://static.tumblr.com/ikeq9mi/DfYl6o46t/scrolltotop.min.js"></script>
  2383. <!-----------Scroll To Top Script----------->
  2384.  
  2385. <script>
  2386. $(document).ready(function(){
  2387.       $('.daynight').click(function(){
  2388.          $('body').toggleClass('night');
  2389.          $('.daynight i').toggleClass('la-sun');
  2390.       });
  2391.     //SIDE PANEL SCRIPT
  2392.     $(document).ready(function(){
  2393.         $('.info-button').click(function(){
  2394.             $('.slide-panel').toggleClass('active');
  2395.             $('.info-button').toggleClass('toggle');
  2396.         })
  2397.     });
  2398. });
  2399. </script>
  2400.  
  2401. </head>
  2402.  
  2403. <body>
  2404.  
  2405. <footer id="bottom">
  2406. <!-----------SCROLL TO TOP ----------->
  2407. <a href="javascript:;" id="scrollToTop" rel="nofollow" title="scroll to top"><i class="las la-arrow-circle-up"></i></a>
  2408. <!-----------SCROLL TO TOP ----------->
  2409. </footer>
  2410.  
  2411. <div class="cage"> <!-----------BLOG CONTAINER----------->
  2412.  
  2413. <div id="link-bar">
  2414.     <button class="info-button">
  2415.         <a href="javascript:;" title="click for links">
  2416.             <span></span>
  2417.         </a>
  2418.     </button>
  2419.     <h2><img src="{PortraitURL-96}">{Title}</h2>
  2420.     <nav class="homelinks">
  2421.         <a href="/">Home</a> /
  2422.         <a href="/help">Help desk</a> /
  2423.         <a href="/terms">Portfolio</a> /
  2424.         <a href="/credit">Credits</a>
  2425.     </nav>
  2426.    
  2427.     <div class="daynight"><i class="las la-moon"></i></div>
  2428.    
  2429. </div>
  2430.  
  2431. <div class="slide-panel">
  2432.  
  2433.     <h2>About</h2>
  2434.     <div class="slide-about">
  2435.         <p>Greetings! you may call me Jadoori or Doori for short (she/her). I am a 29 year old graduate currently working full time so my overall activity on this blog will be sporadic at best. I started coding themes back in June of 2015 and officially opened my theme blog in July of that same year. Hopefully, you are be able to find free and premium themes and pages as well as various theme or tumblr related resources to best fit your needs.</p>
  2436.     </div>
  2437.    
  2438.     <h2>Navigation</h2>
  2439.     <nav class="small-navi">
  2440.         {block:ifLink1}<a href="{text:CustomLink1URL}">{text:CustomLink1Name}</a>{/block:ifLink1}
  2441.         {block:ifLink2}<a href="{text:CustomLink2URL}">{text:CustomLink2Name}</a>{/block:ifLink2}
  2442.         {block:ifLink3}<a href="{text:CustomLink3URL}">{text:CustomLink3Name}</a>{/block:ifLink3}
  2443.         {block:ifLink4}<a href="{text:CustomLink4URL}">{text:CustomLink4Name}</a>{/block:ifLink4}
  2444.         {block:ifLink5}<a href="{text:CustomLink5URL}">{text:CustomLink5Name}</a>{/block:ifLink5}
  2445.         {block:ifLink6}<a href="{text:CustomLink6URL}">{text:CustomLink6Name}</a>{/block:ifLink6}
  2446.         {block:ifLink7}<a href="{text:CustomLink7URL}">{text:CustomLink7Name}</a>{/block:ifLink7}
  2447.         {block:ifLink8}<a href="{text:CustomLink8URL}">{text:CustomLink8Name}</a>{/block:ifLink8}
  2448.         {block:ifLink9}<a href="{text:CustomLink9URL}">{text:CustomLink9Name}</a>{/block:ifLink9}
  2449.     </nav>
  2450.    
  2451.     <h2>Updates</h2>
  2452.    
  2453.     <div class="slide-updates">
  2454.         <p><b>1/17/2021:</b> [Duality] theme revamped</p>
  2455.         <p><b>12/31/2020:</b> [Aquiver] theme revamped</p>
  2456.         <p><b>12/18/2020:</b> [Viridity] theme revamped</p>
  2457.         <p><b>12/12/2020:</b> [Nefelibata] theme posted</p>
  2458.         <p><b>11/20/2020:</b> [Interdimensional] character page posted</p>
  2459.     </div>
  2460.    
  2461. </div>
  2462.  
  2463. <header class="header">
  2464.     <div class="header-image">
  2465.         <img src="{image:header}">
  2466.     </div>
  2467.    
  2468.     <div id="description-bar">
  2469.         <div class="description">
  2470.             <h2>Welcome to Sheathemes</h2>
  2471.             <p>Greetings! you may call me Jadoori or Doori for short (she/her). I am a 29 year old graduate currently working full time so my overall activity on this blog will be sporadic at best. I started coding themes back in June of 2015 and officially opened my theme blog in July of that same year. Hopefully, you are be able to find free and premium themes and pages as well as various theme or tumblr related resources to best fit your needs.</p>
  2472.         </div>
  2473.         <div class="navigation">
  2474.             <h2>Navigation</h2>
  2475.             <nav class="morelinks">
  2476.                 {block:ifLink1}<a href="{text:CustomLink1URL}">{text:CustomLink1Name}</a>{/block:ifLink1}
  2477.                 {block:ifLink2}<a href="{text:CustomLink2URL}">{text:CustomLink2Name}</a>{/block:ifLink2}
  2478.                 {block:ifLink3}<a href="{text:CustomLink3URL}">{text:CustomLink3Name}</a>{/block:ifLink3}
  2479.                 {block:ifLink4}<a href="{text:CustomLink4URL}">{text:CustomLink4Name}</a>{/block:ifLink4}
  2480.                 {block:ifLink5}<a href="{text:CustomLink5URL}">{text:CustomLink5Name}</a>{/block:ifLink5}
  2481.                 {block:ifLink6}<a href="{text:CustomLink6URL}">{text:CustomLink6Name}</a>{/block:ifLink6}
  2482.                 {block:ifLink7}<a href="{text:CustomLink7URL}">{text:CustomLink7Name}</a>{/block:ifLink7}
  2483.                 {block:ifLink8}<a href="{text:CustomLink8URL}">{text:CustomLink8Name}</a>{/block:ifLink8}
  2484.                 {block:ifLink9}<a href="{text:CustomLink9URL}">{text:CustomLink9Name}</a>{/block:ifLink9}
  2485.             </nav>
  2486.         </div>
  2487.     </div>
  2488. </header>
  2489.  
  2490. <header id="small-header">
  2491.     <h2>Welcome to Sheathemes</h2>
  2492.     <p>{Description}</p>
  2493.    
  2494.     <nav class="small-links">
  2495.         <a href="/">Home</a> /
  2496.         <a href="/help">Help desk</a> /
  2497.         <a href="/terms">Portfolio</a> /
  2498.         <a href="/credit">Credits</a>
  2499.     </nav>
  2500. </header>
  2501.  
  2502. <div class="theme-box">
  2503.     <h2>Featured themes</h2>
  2504.     <div id="theme-container">
  2505.     <div class="theme-card">
  2506.         <div class="img-bx">
  2507.             <img src="https://dl.dropboxusercontent.com/s/ecyevnlonud05sm/monumental.PNG?dl=0">
  2508.         </div>
  2509.         <div class="content-bx">
  2510.             <div class="bx-content">
  2511.                 <h2>Monumental</h2>
  2512.                 <p><a href="https://sheapvs.tumblr.com/monumental">preview</a> / <a href="https://pastebin.com/DCaS1snX">code</a> / <a href="https://raw.githubusercontent.com/sheathemes/Monumental/main/code">alt code</a> / <a href="https://sheathemes.tumblr.com/post/644490444120768512/monumental-preview-code-alt-features">details</a></p>
  2513.             </div>
  2514.         </div>
  2515.     </div>
  2516.    
  2517.     <div class="theme-card">
  2518.         <div class="img-bx">
  2519.             <img src="https://dl.dropboxusercontent.com/s/ar16ilo52q0vssi/Interdimensional.gif?dl=0">
  2520.         </div>
  2521.         <div class="content-bx">
  2522.             <div class="bx-content">
  2523.                 <h2>Interdimensional</h2>
  2524.                 <p><a href="http://sheapvs.tumblr.com/interdimensional">preview</a> / <a href="https://pastebin.com/TiDxEBQJ">code</a> / <a href="https://raw.githubusercontent.com/sheathemes/Interdimensional/main/code">alt code</a> / <a href="https://sheathemes.tumblr.com/post/635345309951819776/character-page-interdimensional-preview">details</a></p>
  2525.             </div>
  2526.         </div>
  2527.     </div>
  2528.    
  2529.     <div class="theme-card">
  2530.         <div class="img-bx">
  2531.             <img src="https://dl.dropboxusercontent.com/s/hit82gmnemuxxf3/Nefelibata.PNG?dl=0">
  2532.         </div>
  2533.         <div class="content-bx">
  2534.             <div class="bx-content">
  2535.                 <h2>Nefelibata</h2>
  2536.                 <p><a href="http://sheapvs.tumblr.com/nefelibata">preview</a> / <a href="https://pastebin.com/YNYDZUsD">code</a> / <a href="https://raw.githubusercontent.com/sheathemes/Nefelibata/main/code">alt code</a> / <a href="https://sheathemes.tumblr.com/post/637312250288521216/nefelibata-preview-code-alt">details</a></p>
  2537.             </div>
  2538.         </div>
  2539.     </div>
  2540.     </div>
  2541. </div>
  2542.  
  2543. <div class="wrap"> <!-----------POST CONTAINER----------->
  2544.  
  2545. <aside id="sidebar-cont">
  2546.  
  2547.         <div class="about-me-title">Disclaimer</div>
  2548.         <div class="updates">
  2549. Please be advised I do not claim or take ownership of any images, fonts, scripts, etc. used in my codes unless stated otherwise. For more information, please make sure to visit the credits page.  
  2550.         </div>
  2551.  
  2552.     <div class="about-me-title" style="margin-top:40px">Updates</div>
  2553.         <div class="updates">
  2554.             <p><b>1/17/2021:</b> [Duality] theme revamped</p>
  2555.             <p><b>12/31/2020:</b> [Aquiver] theme revamped</p>
  2556.             <p><b>12/18/2020:</b> [Viridity] theme revamped</p>
  2557.             <p><b>12/12/2020:</b> [Nefelibata] theme posted</p>
  2558.             <p><b>11/20/2020:</b> [Interdimensional] character page posted</p>
  2559.         </div>
  2560.        
  2561.     <div class="about-me-title" style="margin-top:40px">Statistics</div>
  2562.         <div class="updates">
  2563.         <p><b>Established:</b> July 8th 2017</p>
  2564.         <p><b>Online:</b>  <script language="JavaScript">
  2565.       var fhs = document.createElement('script');
  2566.       var fhs_id = "5491565";
  2567.       var ref = ('' + document.referrer + '');
  2568.       var pn = window.location;
  2569.       var w_h = window.screen.width + " x " + window.screen.height;
  2570.       fhs.src = "//freehostedscripts.net/ocounter.php?site=" + fhs_id + "&e1=Online&e2=Online&r=" + ref + "&wh=" + w_h + "&a=1&pn=" + pn + "";
  2571.       document.head.appendChild(fhs);
  2572.       document.write("<span id='o_" + fhs_id + "'></span>");
  2573.     </script>
  2574.         </p>
  2575.         <p><b>Visitors:</b> <script language="JavaScript">
  2576.       var fhsh = document.createElement('script');
  2577.       var fhs_id_h = "3258292";
  2578.       fhsh.src = "//freehostedscripts.net/ocount.php?site=" + fhs_id_h + "&name=Visits&a=1";
  2579.       document.head.appendChild(fhsh);
  2580.       document.write("<span id='h_" + fhs_id_h + "'></span>");
  2581.     </script></p>
  2582.    
  2583.     <p><b>Total themes:</b> 16 themes</p>
  2584.     <p><b>Total pages:</b> 8 pages</p>
  2585.     <p><b>Status:</b> semi-hiatus</p>
  2586.         </div>
  2587.    
  2588. </aside>
  2589.  
  2590. <section id="content"> <!-----------POST WRAPPER----------->
  2591.  
  2592. {block:posts inlineMediaWidth="1280"}
  2593.  
  2594. <article class="posts" post-type="{PostType}"> <!-----------POSTS----------->
  2595.  
  2596. {block:ContentSource}
  2597. <!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"
  2598. width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  2599. {/block:SourceLogo}
  2600. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  2601. {/block:ContentSource}
  2602.  
  2603. <!-- {block:NoRebloggedFrom}
  2604. {block:RebloggedFrom}{ReblogParentName}{/block:RebloggedFrom}
  2605. {/block:NoRebloggedFrom} -->
  2606.  
  2607. {block:IndexPage}{block:PinnedPostLabel} <div class="pinned"><a href="{Permalink}" title="{PinnedPostLabel}"><i class="las la-thumbtack"></i></a></div> {/block:PinnedPostLabel}{/block:IndexPage}
  2608.  
  2609. {block:Text}
  2610. <div class="text">
  2611. {block:Title}<div class="title">{Title}</div>{/block:Title}
  2612. <div class="caption">{block:NotReblog} <figcaption> {Body} </figcaption> {/block:NotReblog} {block:RebloggedFrom} <div class="reblog-list">
  2613.  
  2614. {block:Reblogs} <div class="{block:isOriginalEntry}original-reblog{/block:isOriginalEntry}"> <div class="reblog-header">
  2615.  
  2616. {block:IsActive} <a class="{block:isNotOriginalEntry}sub-reblog{/block:isNotOriginalEntry}" href="{Permalink}" target="_blank"> <img src="{PortraitURL-64}"> </a> {/block:IsActive}
  2617.  
  2618. {block:IsDeactivated} <span class="inactive {block:isNotOriginalEntry} sub-reblog{/block:isNotOriginalEntry}"> <img src="{PortraitURL-64}"> </span> {/block:IsDeactivated} {block:IsActive} <a target="_blank" href="{Permalink}" class="user"> {Username} </a> {/block:IsActive}
  2619.  
  2620. {block:IsDeactivated} <span class="inactive deactivated">{Username} </span> {/block:IsDeactivated} </div> <div class="reblog-content"> {Body} </div> </div> {/block:Reblogs} </div> {/block:RebloggedFrom} </div>
  2621. </div>
  2622. {/block:Text}
  2623.  
  2624. {block:Photo}
  2625. <div class="photo">
  2626. {LinkOpenTag}
  2627. <a href="#" onclick="Tumblr.Lightbox.init([{ width: {PhotoWidth-HighRes}, height: {PhotoHeight-HighRes}, low_res: '{PhotoURL-500}', high_res: '{PhotoURL-HighRes}' }]); $('body').toggleClass('tumblr_lightbox_active'); return false">
  2628. <center><img src="{PhotoURL-HighRes}" alt="{PhotoAlt}"></center>
  2629. </a>
  2630. {LinkCloseTag}
  2631. </div>
  2632. {block:IfShowCaptions}
  2633. {block:Caption} <div class="caption"> {block:NotReblog} <figcaption> {Caption} </figcaption> {/block:NotReblog} {block:RebloggedFrom} <div class="reblog-list">
  2634.  
  2635. {block:Reblogs} <div class="{block:isOriginalEntry}original-reblog{/block:isOriginalEntry}"> <div class="reblog-header">
  2636.  
  2637. {block:IsActive} <a class="{block:isNotOriginalEntry}sub-reblog{/block:isNotOriginalEntry}" href="{Permalink}" target="_blank"> <img src="{PortraitURL-64}"> </a> {/block:IsActive}
  2638.  
  2639. {block:IsDeactivated} <span class="inactive {block:isNotOriginalEntry} sub-reblog{/block:isNotOriginalEntry}"> <img src="{PortraitURL-64}"> </span> {/block:IsDeactivated}
  2640.  
  2641. {block:IsActive} <a target="_blank" href="{Permalink}" class="user">{Username} </a> {/block:IsActive}
  2642.  
  2643. {block:IsDeactivated} <span class="inactive deactivated">{Username} </span> {/block:IsDeactivated} </div> <div class="reblog-content"> {Body} </div> </div> {/block:Reblogs} </div> {/block:RebloggedFrom} </div> {/block:Caption}
  2644. {/block:IfShowCaptions}
  2645.  
  2646. {block:IfnotShowCaptions}
  2647. {block:PermalinkPage}
  2648. {block:Caption} <div class="caption"> {block:NotReblog} <figcaption> {Caption} </figcaption> {/block:NotReblog} {block:RebloggedFrom} <div class="reblog-list">
  2649.  
  2650. {block:Reblogs} <div class="{block:isOriginalEntry}original-reblog{/block:isOriginalEntry}"> <div class="reblog-header">
  2651.  
  2652. {block:IsActive} <a class="{block:isNotOriginalEntry}sub-reblog{/block:isNotOriginalEntry}" href="{Permalink}" target="_blank"> <img src="{PortraitURL-64}"> </a> {/block:IsActive}
  2653.  
  2654. {block:IsDeactivated} <span class="inactive {block:isNotOriginalEntry} sub-reblog{/block:isNotOriginalEntry}"> <img src="{PortraitURL-64}"> </span> {/block:IsDeactivated}
  2655.  
  2656. {block:IsActive} <a target="_blank" href="{Permalink}" class="user">{Username} </a> {/block:IsActive}
  2657.  
  2658. {block:IsDeactivated} <span class="inactive deactivated">{Username} </span> {/block:IsDeactivated} </div> <div class="reblog-content"> {Body} </div> </div> {/block:Reblogs} </div> {/block:RebloggedFrom} </div> {/block:Caption}
  2659. {/block:PermalinkPage}
  2660. {/block:IfnotShowCaptions}
  2661. {/block:Photo}
  2662.  
  2663. {block:Photoset}
  2664. <div class="photo-slideshow" id="photoset_{PostID}" data-layout="{PhotosetLayout}">{block:Photos}<div class="photo-data"><div class="pxu-photo"><img src="{PhotoURL-500}" width="{PhotoWidth-500}" height="{PhotoHeight-500}" data-highres="{PhotoURL-HighRes}" data-width="{PhotoWidth-HighRes}" data-height="{PhotoHeight-HighRes}"></div><a class="tumblr-box" rel="post-{PostID}" href="{PhotoURL-HighRes}"></a></div>{/block:Photos}</div>
  2665. {block:IfShowCaptions}
  2666. {block:Caption}
  2667. <div class="caption"> {block:NotReblog} <figcaption> {Caption} </figcaption> {/block:NotReblog} {block:RebloggedFrom}
  2668. <div class="reblog-list">
  2669.  
  2670. {block:Reblogs}
  2671. <div class="{block:isOriginalEntry}original-reblog{/block:isOriginalEntry}"> <div class="reblog-header">
  2672. {block:IsActive} <a class="{block:isNotOriginalEntry}sub-reblog{/block:isNotOriginalEntry}" href="{Permalink}" target="_blank"> <img src="{PortraitURL-64}"> </a> {/block:IsActive}
  2673.  
  2674. {block:IsDeactivated} <span class="inactive {block:isNotOriginalEntry} sub-reblog{/block:isNotOriginalEntry}"> <img src="{PortraitURL-64}"> </span> {/block:IsDeactivated}
  2675.  
  2676. {block:IsActive}
  2677. <a target="_blank" href="{Permalink}" class="user">{Username} </a> {/block:IsActive}
  2678.  
  2679. {block:IsDeactivated}
  2680. <span class="inactive deactivated">{Username} </span> {/block:IsDeactivated}
  2681. </div>
  2682. <div class="reblog-content"> {Body}</div></div> {/block:Reblogs} </div>
  2683. {/block:RebloggedFrom} </div>
  2684. {/block:Caption}
  2685. {/block:IfShowCaptions}
  2686.  
  2687. {block:IfnotShowCaptions}
  2688. {block:PermalinkPage}
  2689. {block:Caption}
  2690. <div class="caption"> {block:NotReblog} <figcaption> {Caption} </figcaption> {/block:NotReblog} {block:RebloggedFrom}
  2691. <div class="reblog-list">
  2692.  
  2693. {block:Reblogs}
  2694. <div class="{block:isOriginalEntry}original-reblog{/block:isOriginalEntry}"> <div class="reblog-header">
  2695. {block:IsActive} <a class="{block:isNotOriginalEntry}sub-reblog{/block:isNotOriginalEntry}" href="{Permalink}" target="_blank"> <img src="{PortraitURL-64}"> </a> {/block:IsActive}
  2696.  
  2697. {block:IsDeactivated} <span class="inactive {block:isNotOriginalEntry} sub-reblog{/block:isNotOriginalEntry}"> <img src="{PortraitURL-64}"> </span> {/block:IsDeactivated}
  2698.  
  2699. {block:IsActive}
  2700. <a target="_blank" href="{Permalink}" class="user">{Username} </a> {/block:IsActive}
  2701.  
  2702. {block:IsDeactivated}
  2703. <span class="inactive deactivated">{Username} </span> {/block:IsDeactivated}
  2704. </div>
  2705. <div class="reblog-content"> {Body}</div></div> {/block:Reblogs} </div>
  2706. {/block:RebloggedFrom} </div>
  2707. {/block:Caption}
  2708. {/block:PermalinkPage}
  2709. {/block:IfnotShowCaptions}
  2710. {/block:Photoset}
  2711.  
  2712. {block:Quote}
  2713. <div class="qt">
  2714. <div class="quote-box"><i class="las la-quote-right"></i></div>
  2715. <div class="quote">
  2716. {Quote}
  2717. </div>
  2718. </div>
  2719. {block:Source}<div class="qtsource"><br><center>{Source}</center></div>{/block:Source}
  2720. {/block:Quote}
  2721.  
  2722. {block:Link}
  2723. {block:Thumbnail}
  2724. <div class="thumbnail"><img src="{Thumbnail-HighRes}" alt="{Name}"></div>
  2725. {/block:Thumbnail}
  2726.  
  2727. <div class="link"><a href="{URL}">{Name} »</a> </div>
  2728. {block:Description}
  2729. <div class="caption">{block:NotReblog} <figcaption> {Description} </figcaption> {/block:NotReblog} {block:RebloggedFrom} <div class="reblog-list">
  2730.  
  2731. {block:Reblogs} <div class="{block:isOriginalEntry}original-reblog{/block:isOriginalEntry}"> <div class="reblog-header">
  2732.  
  2733. {block:IsActive} <a class="{block:isNotOriginalEntry}sub-reblog{/block:isNotOriginalEntry}" href="{Permalink}" target="_blank"> <img src="{PortraitURL-64}"> </a> {/block:IsActive}
  2734.  
  2735. {block:IsDeactivated} <span class="inactive {block:isNotOriginalEntry} sub-reblog{/block:isNotOriginalEntry}"> <img src="{PortraitURL-64}"> </span> {/block:IsDeactivated} {block:IsActive} <a target="_blank" href="{Permalink}" class="user"> {Username} </a> {/block:IsActive}
  2736.  
  2737. {block:IsDeactivated} <span class="inactive deactivated">{Username} </span> {/block:IsDeactivated} </div> <div class="reblog-content"> {Body} </div> </div> {/block:Reblogs} </div> {/block:RebloggedFrom} </div>
  2738. {/block:Description}
  2739. {/block:Link}
  2740.  
  2741. {block:Audio}
  2742. <div class="audiowrapper">
  2743. {AudioEmbed-640}
  2744. </div>
  2745. {block:IfShowCaptions}
  2746. {block:Caption} <div class="caption"> {block:NotReblog} <figcaption> {Caption} </figcaption> {/block:NotReblog} {block:RebloggedFrom} <div class="reblog-list">
  2747.  
  2748. {block:Reblogs} <div class="{block:isOriginalEntry}original-reblog{/block:isOriginalEntry}"> <div class="reblog-header">
  2749.  
  2750. {block:IsActive} <a class="{block:isNotOriginalEntry}sub-reblog{/block:isNotOriginalEntry}" href="{Permalink}" target="_blank"> <img src="{PortraitURL-64}"> </a> {/block:IsActive}
  2751.  
  2752. {block:IsDeactivated} <span class="inactive {block:isNotOriginalEntry} sub-reblog{/block:isNotOriginalEntry}"> <img src="{PortraitURL-64}"> </span> {/block:IsDeactivated}
  2753.  
  2754. {block:IsActive} <a target="_blank" href="{Permalink}" class="user">{Username} </a> {/block:IsActive}
  2755.  
  2756. {block:IsDeactivated} <span class="inactive deactivated">{Username} </span> {/block:IsDeactivated} </div> <div class="reblog-content"> {Body} </div> </div> {/block:Reblogs} </div> {/block:RebloggedFrom} </div> {/block:Caption}
  2757. {/block:IfShowCaptions}
  2758.  
  2759. {block:IfnotShowCaptions}
  2760. {block:PermalinkPage}
  2761. {block:Caption} <div class="caption"> {block:NotReblog} <figcaption> {Caption} </figcaption> {/block:NotReblog} {block:RebloggedFrom} <div class="reblog-list">
  2762.  
  2763. {block:Reblogs} <div class="{block:isOriginalEntry}original-reblog{/block:isOriginalEntry}"> <div class="reblog-header">
  2764.  
  2765. {block:IsActive} <a class="{block:isNotOriginalEntry}sub-reblog{/block:isNotOriginalEntry}" href="{Permalink}" target="_blank"> <img src="{PortraitURL-64}"> </a> {/block:IsActive}
  2766.  
  2767. {block:IsDeactivated} <span class="inactive {block:isNotOriginalEntry} sub-reblog{/block:isNotOriginalEntry}"> <img src="{PortraitURL-64}"> </span> {/block:IsDeactivated}
  2768.  
  2769. {block:IsActive} <a target="_blank" href="{Permalink}" class="user">{Username} </a> {/block:IsActive}
  2770.  
  2771. {block:IsDeactivated} <span class="inactive deactivated">{Username} </span> {/block:IsDeactivated} </div> <div class="reblog-content"> {Body} </div> </div> {/block:Reblogs} </div> {/block:RebloggedFrom} </div> {/block:Caption}
  2772. {/block:PermalinkPage}
  2773. {/block:IfnotShowCaptions}
  2774. {/block:Audio}
  2775.  
  2776. {block:Video}
  2777. <div class="video">{Video-500}</div>
  2778. {block:IfShowCaptions}
  2779. {block:Caption} <div class="caption"> {block:NotReblog} <figcaption> {Caption} </figcaption> {/block:NotReblog} {block:RebloggedFrom} <div class="reblog-list">
  2780.  
  2781. {block:Reblogs} <div class="{block:isOriginalEntry}original-reblog{/block:isOriginalEntry}"> <div class="reblog-header">
  2782.  
  2783. {block:IsActive} <a class="{block:isNotOriginalEntry}sub-reblog{/block:isNotOriginalEntry}" href="{Permalink}" target="_blank"> <img src="{PortraitURL-64}"> </a> {/block:IsActive}
  2784.  
  2785. {block:IsDeactivated} <span class="inactive {block:isNotOriginalEntry} sub-reblog{/block:isNotOriginalEntry}"> <img src="{PortraitURL-64}"> </span> {/block:IsDeactivated}
  2786.  
  2787. {block:IsActive} <a target="_blank" href="{Permalink}" class="user">{Username} </a> {/block:IsActive}
  2788.  
  2789. {block:IsDeactivated} <span class="inactive deactivated">{Username} </span> {/block:IsDeactivated}
  2790.  
  2791. </div> <div class="reblog-content"> {Body} </div> </div> {/block:Reblogs} </div> {/block:RebloggedFrom} </div> {/block:Caption}
  2792. {/block:IfShowCaptions}
  2793.  
  2794. {block:IfnotShowCaptions}
  2795. {block:PermalinkPage}
  2796. {block:Caption} <div class="caption"> {block:NotReblog} <figcaption> {Caption} </figcaption> {/block:NotReblog} {block:RebloggedFrom} <div class="reblog-list">
  2797.  
  2798. {block:Reblogs} <div class="{block:isOriginalEntry}original-reblog{/block:isOriginalEntry}"> <div class="reblog-header">
  2799.  
  2800. {block:IsActive} <a class="{block:isNotOriginalEntry}sub-reblog{/block:isNotOriginalEntry}" href="{Permalink}" target="_blank"> <img src="{PortraitURL-64}"> </a> {/block:IsActive}
  2801.  
  2802. {block:IsDeactivated} <span class="inactive {block:isNotOriginalEntry} sub-reblog{/block:isNotOriginalEntry}"> <img src="{PortraitURL-64}"> </span> {/block:IsDeactivated}
  2803.  
  2804. {block:IsActive} <a target="_blank" href="{Permalink}" class="user">{Username} </a> {/block:IsActive}
  2805.  
  2806. {block:IsDeactivated} <span class="inactive deactivated">{Username} </span> {/block:IsDeactivated}
  2807.  
  2808. </div> <div class="reblog-content"> {Body} </div> </div> {/block:Reblogs} </div> {/block:RebloggedFrom} </div> {/block:Caption}
  2809. {/block:PermalinkPage}
  2810. {/block:IfnotShowCaptions}
  2811. {/block:Video}
  2812.  
  2813. {block:Chat}
  2814. {block:Title}<div class="title">{Title}</div>{/block:Title}
  2815. <div class="chatp">
  2816. <div class="chat">{block:Lines}<div class="line">{block:Label}<span class="label"><b>{Label}</b></span><br><br>{/block:Label}
  2817. {Line}</div>{/block:Lines}</div>
  2818. </div>
  2819. {/block:Chat}
  2820.  
  2821. {block:Answer}
  2822. <div id="askcont">
  2823. <div id="asker">
  2824. <img src="{AskerPortraitURL-128}">
  2825. <div id="asking">
  2826. <div class="asker-link">{Asker}</div>
  2827. <div class="asker-text">asked a question</div>
  2828. </div>
  2829. </div>
  2830. <div class="question">{Question}</div>
  2831. </div>
  2832.  
  2833. {block:Answerer}
  2834. <div id="replycont">
  2835. <div id="replier">
  2836. <div id="replying">
  2837. <div class="replier-link">{Answerer}</div>
  2838. <div class="replier-text">replied to your question</div>
  2839. </div>
  2840. <img src="{AnswererPortraitURL-128}">
  2841. </div>
  2842. <div class="answer">{Answer}</div>
  2843. </div>
  2844. {/block:Answerer}
  2845.  
  2846. {block:NotReblog}  <div class="caption"><figcaption> {Answer} </figcaption> </div> {/block:NotReblog}
  2847. {block:RebloggedFrom} <div class="reblog-list">
  2848. {block:Reblogs} <div class="{block:isOriginalEntry}original-reblog{/block:isOriginalEntry}"> <div class="reblog-header">
  2849.  
  2850. {block:IsActive} <a class="{block:isNotOriginalEntry}sub-reblog{/block:isNotOriginalEntry}" href="{Permalink}" target="_blank"> <img src="{PortraitURL-64}"> </a> {/block:IsActive}
  2851.  
  2852. {block:IsDeactivated} <span class="inactive {block:isNotOriginalEntry} sub-reblog{/block:isNotOriginalEntry}"> <img src="{PortraitURL-64}"> </span> {/block:IsDeactivated}
  2853.  
  2854. {block:IsActive} <a target="_blank" href="{Permalink}" class="user">{Username} </a> {/block:IsActive}
  2855.  
  2856. {block:IsDeactivated} <span class="inactive deactivated">{Username} </span> {/block:IsDeactivated} </div>
  2857.  
  2858. <div class="reblog-content">{Body} </div> </div> {/block:Reblogs} </div> {/block:RebloggedFrom}
  2859. {/block:Answer}
  2860.  
  2861. {block:IndexPage} <!-----------POST INFO/PERMALINKS----------->
  2862. {block:Date}
  2863. <div class="time">
  2864. <div class="timestamp"><i class="las la-stopwatch"></i>
  2865. <a href="{Permalink}">{ShortMonth} {DayOfMonth}{DayOfMonthSuffix}</a>
  2866. {block:NoteCount}<a href="{Permalink}" style="margin-left:10px"><i class="las la-chart-bar"></i>{NoteCountWithLabel}</a>{/block:NoteCount}
  2867. </div>
  2868. {/block:Date}
  2869.  
  2870. <div class="likereblog" style="float: right;">
  2871. <div class="controls">
  2872. <a href="{ReblogURL}" target="_blank" title="reblog this post" class="reblog"><i class="las la-sync-alt"></i></a>
  2873. <a title="like this post" class="like">{LikeButton size="15"}
  2874. <i class="lar la-heart"></i></a>
  2875. </div>
  2876. </div>
  2877. </div>
  2878. {/block:IndexPage} <!-----------POST INFO/PERMALINKS----------->
  2879.  
  2880. <!-----------POST TAGS----------->
  2881. {block:IndexPage}
  2882. {block:HasTags}
  2883. <div class="post_tags draggable">
  2884. <div class="post_tags_inner">{block:Tags}
  2885. <a href="{TagURL}">#{Tag}</a>{/block:Tags}</div></div>
  2886. {/block:HasTags}
  2887. {/block:IndexPage}
  2888. <!-----------POST TAGS----------->
  2889.  
  2890. </article> <!-----------POSTS----------->
  2891.  
  2892. <!-----------PERMALINK PAGE----------->
  2893. {block:PermalinkPage}
  2894. {block:Date}
  2895. <div id="perma">
  2896. <span>
  2897. Posted {ShortMonth} {DayOfMonthWithZero}, {Year} @ {12Hour} {AmPm}
  2898. {block:NoteCount}with {NoteCountWithLabel}{/block:NoteCount}
  2899. </span>
  2900.  
  2901. {block:RebloggedFrom}
  2902. <div class="rb">
  2903. <a class="via" href="{ReblogParentURL}" title="{ReblogParentName}"><img src="{ReblogParentPortraitURL-16}"></a>
  2904. <a class="root" href="{ReblogRootURL}" title="{ReblogRootName}"><img src="{ReblogRootPortraitURL-16}"></a>
  2905. </div>
  2906. {/block:RebloggedFrom}
  2907.  
  2908. </div>
  2909.  
  2910. {block:HasTags}
  2911. <div id="permatg">
  2912. {block:Tags}<a href="{TagURL}" title="Tagged as">#{Tag}</a> {/block:Tags}
  2913. </div>
  2914. {/block:HasTags}
  2915.  
  2916. {block:PostNotes}
  2917. <div id="notecontainer">{PostNotes}</div>
  2918. {/block:PostNotes}
  2919.  
  2920. {block:PermalinkPagination}
  2921. <div id="permpage">
  2922.     {block:NextPost}
  2923.         <a href="{NextPost}" title="Previous Post"><span class="ti-hand-point-left"></span></a>
  2924.     {/block:NextPost}
  2925.    
  2926.     {block:PreviousPost}
  2927.         <a href="{PreviousPost}" title="Next Post"><span class="ti-hand-point-right"></span></a>
  2928.     {/block:PreviousPost}
  2929. </div>
  2930. {/block:PermalinkPagination}
  2931. {/block:Date}
  2932. {/block:PermalinkPage}
  2933. <!-----------PERMALINK PAGE----------->
  2934. {/block:Posts}
  2935.  
  2936. {block:IndexPage}
  2937. <footer id="pagination"> <!-----------PAGINATION----------->
  2938. {block:Pagination}
  2939. {block:PreviousPage}
  2940. <a href="{PreviousPage}">Prev</a>
  2941. {/block:PreviousPage}
  2942. {block:JumpPagination length="3"}
  2943. {block:CurrentPage}
  2944. <span class="current_page">{CurrentPage}</a></span>
  2945. {/block:CurrentPage}
  2946. {block:JumpPage}
  2947. <a class="jump_page" href="{URL}">{PageNumber}</a>
  2948. {/block:JumpPage}
  2949. {/block:JumpPagination}
  2950. {block:NextPage}
  2951. <a href="{NextPage}">Next</a>
  2952. {/block:NextPage}
  2953. {/block:Pagination}
  2954. </footer> <!-----------PAGINATION----------->
  2955. {/block:IndexPage}
  2956.  
  2957. </section><!------------------POSTS WRAPPER----------------------->
  2958.  
  2959. </div>  <!--------- POSTS CONTAINER ----------->
  2960.  
  2961. <footer id="footer">
  2962.     <div class="disclaimer">
  2963.         <h2>Disclaimer</h2>
  2964.         <p>All codes presented on this blog belongs to me and I own all rights to them. All reblogged posts and scripts used on my themes do not by any means belong to me unless stated otherwise. Credits go to their respective owners, which have all been documented in my credits page.</p>
  2965.         <p>sheathemes, {CopyrightYears} - all rights reserved - powered by tumblr</p>
  2966.     </div>
  2967.     <ul class="quick-links">
  2968.         <h2>Quick Links</h2>
  2969.         <li><a href="https://gravelyhumerus.tumblr.com/post/634056567701012480/how-to-change-your-theme">Theme installation guide (credit to gravelyhumerus)</a></li>
  2970.         <li><a href="/tagged/answers">Answered asks</a></li>
  2971.         <li><a href="/tagged/credit">credits</a></li>
  2972.         <li><a href="/tagged/thmrecs">theme recs</a></li>
  2973.         <li><a href="/tagged/pgrecs">page recs</a></li>
  2974.         <li><a href="/tagged/sheaupdates">blog updates</a></li>
  2975.     </ul>
  2976.    
  2977.     <div class="other-link">
  2978.         <h2>You can also reach me...</h2>
  2979.         <a href=""><i class="lab la-discord"></i></a>
  2980.         <a href="https://ko-fi.com/sheathemes"><i class="las la-coffee"></i></a>
  2981.     </div>
  2982. </footer>
  2983.  
  2984. </div> <!--------- BLOG CONTAINER ----------->
  2985.  
  2986. <!-------------------SCRIPTS/JQUERY (PART TWO)------------------->
  2987.  
  2988. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  2989.  
  2990. <!-----------Pixel Union photosets script----------->
  2991. <link href="https://static.tumblr.com/qudkd6d/OcDnl99gb/style.css" rel="stylesheet" type="text/css"/>
  2992. <script src="https://static.tumblr.com/yxfeliq/hHwojmt8m/bctphotoset.min.js"></script>
  2993. <!-----------Pixel Union photosets script----------->
  2994.  
  2995. <!---------- Responsive tumblr videos and external iframes script ---------->
  2996. <script src="https://rawgit.com/robinpx/tumblr/master/scripts/flexibleFrames/flexibleFrames.min.js"></script>
  2997. <!---------- Responsive tumblr videos and external iframes script ---------->
  2998.  
  2999. <!---------- inline images resizing script ---------->
  3000. <script src="//dl.dropbox.com/s/1mztc6y7i6ry9ri/gtresizing.js"> </script>
  3001. <!---------- inline images resizing script ---------->
  3002.  
  3003. <!-----------Tooltips Script----------->
  3004. <script src="https://unpkg.com/popper.js@1"></script> <script src="https://unpkg.com/tippy.js@5/dist/tippy-bundle.iife.js"></script> <link rel="stylesheet" href="https://unpkg.com/tippy.js@5/dist/svg-arrow.css" />
  3005. <!-----------Tooltips Script----------->
  3006.  
  3007. <script>
  3008. $(document).ready(function(){
  3009.     //pxu photosets by @ shythemes & bychloethemes
  3010.    $('.photo-slideshow').pxuPhotoset({
  3011.        lightbox: true,
  3012.        rounded: false,
  3013.        gutter: '{select:photoset gutter}px',
  3014.        photoset: '.photo-slideshow',
  3015.        photoWrap: '.photo-data',
  3016.        photo: '.pxu-photo'
  3017.    });
  3018.         tippy('a[title]', {
  3019.             theme: 'custom',
  3020.             arrow: tippy.roundArrow,
  3021.             zIndex: 9999999999,
  3022.             placement: 'auto',
  3023.             maxWidth: 300,
  3024.             content(reference) {
  3025.                 const title = reference.getAttribute('title');
  3026.                 reference.removeAttribute('title'); return title; },
  3027.            
  3028.         });
  3029.        
  3030.         //responsive tumblr videos and external iframes by @ nouvae
  3031.     function flexFrame() {
  3032.         $(".caption").each(function() {
  3033.             $(this).find("iframe").wrap("<div class='capframe'></div>"); // wrap iframe
  3034.             flexibleFrames($(".capframe"));
  3035.         });
  3036.         flexibleFrames($(".video"));
  3037.     }
  3038.    
  3039.     $(document).ready(flexFrame);
  3040.    
  3041.     // audio player fix by @ shudesigns
  3042.         var $audio = $('iframe.tumblr_audio_player');
  3043.         $audio.load(function() {
  3044.         $(this).contents().find('head').append('<style type="text/css">' +
  3045.       '.audio-player { background: {color:question background}; color: {color:question} !important; }' +
  3046.       '.audio-player .audio-info .track-artist { color: {color:question} !important; }' +
  3047.     '</style>');
  3048.   });
  3049. });
  3050. </script>
  3051.  
  3052. <!-----------Draggable Tags Script----------->
  3053. <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/jquery-ui.min.js"></script>
  3054. <script src="https://static.tumblr.com/pbhn8p5/OSRos9gz8/draggabletags.js"></script>
  3055. <!-----------Draggable Tags Script----------->
  3056.  
  3057. <!-------------------SCRIPTS/JQUERY (PART TWO)------------------->
  3058.  
  3059. </body>
  3060. </html> <!---------------------------END--------------------------->
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement