Mephistia

1cebee Theme

Jan 5th, 2021 (edited)
884
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 35.41 KB | None | 0 0
  1.  
  2.  
  3. <!--
  4.  
  5.  
  6.     ICE BEE THEME BY MEPHISTIA
  7.     mephistia-themes // mephistia-arts
  8.     2021 ⓒ Some Rights Reserved
  9.    
  10.    
  11.    
  12.     -- TERMS OF USE:
  13.        - Don't remove/edit the credits
  14.        - Don't use as base code
  15.        - Don't steal parts of the code
  16.        - Edit only for personal use
  17.        - Don't claim as yours (you can state you made modifications)
  18.        - Don't redistribute (original or edited)
  19.        - Don't hesitate to send an ask if you have any doubts!
  20.        
  21.    
  22.    
  23.     -- CREDITS (tutorials and resources):
  24.        - Base code by @sorrism
  25.        - photosets.css by @annasthms and @espoirthemes
  26.        - Responsive Videos and iframes by @nouvae
  27.        - Ask bubble & link post style by @todorokiscute
  28.        - Remove Tumblr's redirects by @magnusthemes
  29.        - Change color of Audio Player by @shudesigns
  30.        -- NON-TUMBLR:
  31.            - Masonry & imagesLoaded scripts (desandro.com)
  32.            - Google Fonts (fonts.google.com)
  33.            - Remix Icon library (remixicon.com)
  34.            - JavaScript code prettifier (github.com/googlearchive/code-prettify)
  35.            - Tooltips tutorial (w3schools.com/howto/howto_css_tooltip.asp)
  36.    
  37.    
  38.     -->
  39. <!DOCTYPE html>
  40. <head>
  41.     <title>{block:PostSummary}{PostSummary} : {/block:PostSummary}{Title}</title>
  42.     <link rel="shortcut icon" href="{favicon}">
  43.     <link rel="alternate" type="application/rss+xml" href="{RSS}">
  44.     {block:Description}
  45.     <meta name="description" content="{MetaDescription}" />
  46.     {/block:Description}
  47.     <!--Google Fonts-->
  48.     <link rel="preconnect" href="https://fonts.gstatic.com">
  49.     <link href="https://fonts.googleapis.com/css2?family={text:Google Font 1}:ital,wght@0,300;0,400;0,700;1,300;1,400;1,700&family={text:Google Font 2}&display=swap" rel="stylesheet">
  50.     <!--photosets.css by @annasthms and @espoirthemes
  51.         https://annasthms.github.io/photosets/
  52.         -->
  53.     <link href="https://static.tumblr.com/0podkko/xIbplezmo/modified_photosets.css" rel="stylesheet">
  54.     <!--Remix Icons-->
  55.     <link href="https://cdn.jsdelivr.net/npm/[email protected]/fonts/remixicon.css" rel="stylesheet">
  56.     <!--Default Variables-->
  57.     <meta name="color:Background" content="#f9f9f9"/>
  58.     <meta name="color:Post Text" content="#1f1e21"/>
  59.     <meta name="color:Text" content="##1f1e21"/>
  60.     <meta name="color:Accent" content="#1cebee"/>
  61.     <meta name="color:Title"content="#1f1e21"/>
  62.     <meta name="color:Scrollbar" content="#d5d5d5" />
  63.     <meta name="color:Icon BG" content="#00343c"/>
  64.     <meta name="color:Posts" content="#EAF4F6"/>
  65.     <meta name="select:Post Width" content="250" title="250px"/>
  66.     <meta name="select:Post Width" content="300" title="300px"/>
  67.     <meta name="select:Post Width" content="350" title="350px"/>
  68.     <meta name="select:Post Width" content="400" title="400px"/>
  69.     <meta name="select:Post Width" content="450" title="450px"/>
  70.     <meta name="select:Post Width" content="500" title="500px"/>
  71.     <meta name="select:Post Width" content="540" title="540px"/>
  72.     <meta name="if:Max 1 Column" content="1" />
  73.     <meta name="if:Max 2 Columns" content="1" />
  74.     <meta name="if:Max 3 Columns" content="1" />
  75.     <meta name="if:Max 4 Columns" content="1" />
  76.     <meta name="if:Show Archive Btn" content="1" />
  77.     <meta name="if:Site Borders" content="1" />
  78.     <meta name="text:Link 1 URL" content="" />
  79.     <meta name="text:Link 1 icon" content="" />
  80.     <meta name="text:Link 1 text" content="" />
  81.     <meta name="text:Link 2 URL" content="" />
  82.     <meta name="text:Link 2 icon" content="" />
  83.     <meta name="text:Link 2 text" content="" />
  84.     <meta name="text:Link 3 URL" content="" />
  85.     <meta name="text:Link 3 icon" content="" />
  86.     <meta name="text:Link 3 text" content="" />
  87.     <meta name="text:Google Font 1" content="Signika" />
  88.     <meta name="text:Google Font 2" content="Montserrat" />
  89.     <style type="text/css">
  90.         /*tumblr controls and lightbox*/
  91.         #tumblr_controls:hover, .tmblr-iframe:hover {
  92.         opacity:1!important;
  93.         }
  94.         #tumblr_controls, .tmblr-iframe {
  95.         position:fixed!important;
  96.         opacity:.6!important;
  97.         -webkit-transition:opacity .3s linear;
  98.         transition:opacity .3s linear;
  99.         -webkit-filter:none;
  100.         -moz-filter:none;
  101.         -o-filter:none;
  102.         -ms-filter:none;
  103.         filter:none;
  104.         -webkit-backface-visibility:hidden;
  105.         -moz-box-sizing:content-box;
  106.         box-sizing:content-box;
  107.         padding:4px;
  108.         -webkit-transform:scale(0.7);
  109.         -webkit-transform-origin: 100% 0%;
  110.         -ms-transform-origin:100% 0%;
  111.         -ms-transform:scale(0.7);
  112.         transform:scale(0.7);
  113.         transform-origin:100% 0%;
  114.         }
  115.         #vignette, .vignette {
  116.         opacity:0;
  117.         }
  118.         #tumblr_lightbox img, .lightbox-image {
  119.         box-shadow:none!important;
  120.         border-radius:0!important;
  121.         max-width:none;
  122.         }
  123.         #tumblr_lightbox_caption, .lightbox-caption {
  124.         visibility:hidden;
  125.         }
  126.         /*scrollbar*/
  127.         ::-webkit-scrollbar{
  128.         height:11px;
  129.         width:11px;
  130.         background:inherit;
  131.         }
  132.         ::-webkit-scrollbar-thumb {background:{color:scrollbar};}
  133.         ::-webkit-scrollbar-track {background:{color:text};}
  134.         ::-webkit-scrollbar-thumb, ::-webkit-scrollbar-track {border:5px solid {color:background};}
  135.         /*main structure*/
  136.         *{
  137.         box-sizing: border-box;
  138.         }
  139.         body {
  140.         background: {color:background};
  141.         {block:IfSiteBorders}    
  142.         background: rgba({RGBcolor:accent}, .3)!important;
  143.         {/block:IfSiteBorders}
  144.         color:{color:text};
  145.         font:.8rem {text:Google Font 2}, sans-serif;
  146.         word-wrap:break-word;    
  147.         margin:0;
  148.         line-height: 1.2rem;
  149.         text-align:justify;
  150.         }
  151.         a {
  152.         color:{color:text};
  153.         text-decoration:none;
  154.         transition:opacity .3s linear;    
  155.         -webkit-transition:opacity .3s linear;
  156.         -o-transition:opacity .3s linear;
  157.         -moz-transition:opacity .3s linear;  
  158.         opacity: 1;
  159.         }
  160.         a, a img {cursor:pointer;}
  161.         a:hover {
  162.         opacity: 0.6;
  163.         text-decoration:none;
  164.         }
  165.         img {
  166.         opacity:1;
  167.         border:0;
  168.         text-decoration:none;
  169.         max-width:100%;
  170.         height:auto;
  171.         display:block;
  172.         }
  173.         blockquote {
  174.         padding:.25em 0 .25em 15px;
  175.         margin-left: 1rem;
  176.         border-left:2px solid {color:Icon BG};
  177.         }
  178.         pre {
  179.         padding:0;
  180.         margin:0;
  181.         line-height:inherit!important;
  182.         background:transparent;
  183.         font-family:inherit!Important;
  184.         font-size:inherit!important;
  185.         white-space:pre-wrap;
  186.         white-space:-moz-pre-wrap;
  187.         white-space:-pre-wrap;
  188.         white-space:-o-pre-wrap;
  189.         word-wrap:break-word;
  190.         }
  191.         p {margin:1em 0;}
  192.         p:first-of-type {margin-top:0;}
  193.         p:last-of-type {margin-bottom:0;}
  194.         b, b a, strong a {
  195.         font-weight:bold!important;
  196.         color:{color:title};
  197.         }
  198.         small, big, sub, pre {
  199.         font-size:1em!important;
  200.         line-height:1.4em!important;
  201.         vertical-align:baseline!important;
  202.         }
  203.         h1, h2, h3, h4 {
  204.         margin:1.5em 0;
  205.         font-size:1.5em;
  206.         padding:0;
  207.         color:{color:title};
  208.         font-weight:bold;
  209.         font-family: {text:Google Font 1};
  210.         }
  211.         .posts h1:first-child, .posts h2:first-child, .posts h3:first-child, .posts h4:first-child {margin-top:0;}
  212.         hr {
  213.         border:none;
  214.         box-shadow:0;
  215.         margin:2em auto;
  216.         width:75px;
  217.         border-top:1px solid {color:text};
  218.         }
  219.         strong{
  220.         border-bottom: 2px solid {color:accent};
  221.         }
  222.         /*containers*/
  223.         .wrap {
  224.         {block:IfSiteBorders}  
  225.         position: absolute;
  226.         top: 0;
  227.         bottom: 0;
  228.         left: 0;
  229.         right: 0;
  230.         {/block:IfSiteBorders}    
  231.         margin: 2%;
  232.         background-color: {color:background};
  233.         padding: 30px 150px;
  234.         border-radius: 5px;
  235.         overflow: auto;
  236.         border: 25px solid {color:background};
  237.         }
  238.         main{
  239.         margin-left: calc(300px + 5%);
  240.         }
  241.         /*sidebar*/
  242.         aside {
  243.         position: fixed;
  244.         padding: 10px;
  245.         height: 100%;
  246.         width: 300px;
  247.         text-align: left;
  248.         color:{color:text};
  249.         }
  250.         #blogtitle {
  251.         font-size:1.5rem;
  252.         color:{color:title};
  253.         font-family: {text:Google Font 1};
  254.         font-weight: bold;
  255.         border:0;
  256.         border-radius: 5px;
  257.         margin-left: 12px;
  258.         }
  259.         #description {margin:25px 0;}
  260.         .sidebar-user{
  261.         display: flex;
  262.         align-items: center;
  263.         }
  264.         .blog-img{
  265.         border-radius: 5px;
  266.         box-shadow: {color:title} -4px 4px 0;
  267.         }
  268.         nav {
  269.         display:block;
  270.         margin-top:10px;
  271.         }
  272.         nav ul{
  273.         list-style-type: none;
  274.         padding: 0;
  275.         column-count: 4;
  276.         width: 155px;
  277.         }
  278.         nav i{
  279.         color: {color:accent};
  280.         }
  281.         nav li{
  282.         display: inline-block;
  283.         margin-right: 8px;
  284.         margin-bottom: 6px;
  285.         }
  286.         nav li a{
  287.         transition-property: opacity;
  288.         transition-duration: .3s;
  289.         transition-timing-function: ease-in-out;
  290.         padding: 18px;
  291.         background-color: {color:Icon BG};
  292.         text-align: center;
  293.         width: 30px;
  294.         display: flex;
  295.         height: 30px;
  296.         justify-content: center;
  297.         align-items: center;
  298.         border-radius: 5px;  
  299.         }
  300.         .updates{
  301.         font-size: .7rem;
  302.         }
  303.         .updates ul {
  304.         list-style-type: none;
  305.         padding: 0;
  306.         }
  307.         .updates li {
  308.         margin-bottom: 15px;
  309.         }
  310.         .updates strong{
  311.         font-weight: bold;
  312.         margin-right: 8px;
  313.         }
  314.         /*pagination*/
  315.         footer {
  316.         color:{color:text};
  317.         margin: 0 auto 45px auto;
  318.         text-align: center;
  319.         }
  320.         footer span {
  321.         text-align:right;
  322.         display:inline-block;
  323.         }
  324.         .current_page {
  325.         font-weight:bold;
  326.         color:{color:title};
  327.         }
  328.         footer a {
  329.         display:inline-block;
  330.         border:0;
  331.         margin:0 5px;
  332.         }
  333.         svg {
  334.         margin-bottom: -6px;
  335.         }
  336.         #infscr-loading {display:none!important;}
  337.         /*posts*/
  338.         section {
  339.         margin:0 auto 25px;
  340.         }
  341.         #msnry-limit{
  342.         margin: auto;
  343.         max-width:
  344.         {block:IfMax1Column} calc({select:Post Width}px + 80px){/block:IfMax1Column}
  345.         {block:IfMax2Columns} calc(calc(2 * {select:Post Width}px) + 160px){/block:IfMax2Columns}
  346.         {block:IfMax3Columns} calc(calc(3 * {select:Post Width}px) + 240px){/block:IfMax3Columns}
  347.         {block:IfMax4Columns} calc(calc(4 * {select:Post Width}px) + 320px){/block:IfMax4Columns}
  348.         !important;
  349.         }
  350.         .posts {
  351.         width:{select:Post Width}px;
  352.         height: auto;
  353.         margin: 0 auto 75px;
  354.         display:inline-block;
  355.         }
  356.         .captioned::before, .textpost::before {
  357.         content: "";
  358.         position: absolute;
  359.         top: -27px;
  360.         z-index: 9;
  361.         left: 0px;
  362.         width: 100%;
  363.         border-top: 30px solid {color:text};
  364.         border-top-left-radius: 5px;
  365.         border-top-right-radius: 5px;
  366.         }
  367.         .captioned, .textpost{
  368.         position:relative;
  369.         }
  370.         .posts img:hover{
  371.         cursor: pointer;
  372.         }
  373.         [photoset-layout]{
  374.         grid-gap: 3px;
  375.         }
  376.         .ph {
  377.         position:relative;
  378.         overflow:visible;
  379.         }
  380.         .ph img {
  381.         width:100%;
  382.         display:block;
  383.         }
  384.         .single-photo{
  385.         display: inline-block;
  386.         border-radius: 5px;
  387.         {block:PermalinkPage} display:flex;{/block:PermalinkPage}
  388.         }
  389.         .to-zoom{
  390.         overflow: hidden;
  391.         border-top-left-radius: 5px;
  392.         border-top-right-radius: 5px;
  393.         {block:PermalinkPage} border-radius: 0!important; margin: auto;{/block:PermalinkPage}
  394.         }
  395.         .to-zoom img{
  396.         width: 100% !important;
  397.         height: 100% !important;
  398.         transition: transform .4s ease-in-out;
  399.         transform: scale(1);
  400.         }
  401.         .to-zoom:hover img{
  402.         transform: scale(1.15);
  403.         }
  404.         /*titles*/
  405.         .title {
  406.         color:{color:title};
  407.         font-size:1.25em;
  408.         line-height:1.75em;
  409.         }
  410.         .title a {color:{color:title};}
  411.         .post-title{
  412.         font-weight:bold;
  413.         font-size: .95rem;
  414.         font-family: {text:Google Font 1};
  415.         }
  416.         /*captions*/
  417.         .comment {
  418.         padding:.5rem;
  419.         list-style:none;
  420.         border-radius: 5px;
  421.         border-top:none;
  422.         background-color: {color:Posts};
  423.         position: initial;
  424.         }    
  425.         .comment:last-of-type {padding-bottom:5px!important;}
  426.         .user {
  427.         display: flex;
  428.         line-height: 1.3rem;
  429.         margin: .6rem 0 0;
  430.         align-content: space-evenly;
  431.         font-family: Signika;
  432.         font-size: 0.85rem;
  433.         color: {color:accent};
  434.         }
  435.         .user-info{
  436.         position: absolute;
  437.         top: -31px;
  438.         left: 3px;
  439.         z-index: 99;
  440.         }
  441.         .inactive:hover:after {
  442.         content:'deactivated';
  443.         }
  444.         .user-img {
  445.         width: 20px !important;
  446.         height: 20px!important;
  447.         border-radius: 50%;
  448.         height: auto;
  449.         margin-right: 5px;
  450.         }
  451.         .captioned .comment:first-of-type {padding-top:8px; margin-top: -5px;}
  452.         .tex li, .tex blockquote {text-align:left;}
  453.         .tex a, #description a, .updates a{
  454.         text-decoration: underline 2px {color:accent};
  455.         color:{color:title};
  456.         padding: 2px;
  457.         }
  458.         .tex{
  459.         padding: 10px 5px;
  460.         color:{color:post text};
  461.         }
  462.         .ph .tex p, .quote, .source, .replies{text-align:center;}
  463.         .tex p .tumblr_blog, .tex.hide p {display: none;}
  464.         .tex.hide blockquote p{display:block;}
  465.         .read_more{
  466.         padding: 3px 8px;
  467.         display: inline-block;
  468.         }
  469.         /*quote*/
  470.         .source {margin-top:5px;}
  471.         .quote{
  472.         position:relative;
  473.         border-left: 5px solid {color:accent};
  474.         }
  475.         .quote-icon{
  476.         color: {color:accent};
  477.         font-size: 1.5rem;
  478.         }
  479.         /*audio*/
  480.         .audio{
  481.         display:flex;
  482.         flex-wrap: wrap;
  483.         background-color: {color:posts}
  484.         }
  485.         .audio:hover{
  486.         cursor: pointer;
  487.         }
  488.         .noalbumart {
  489.         background-color: {color:Icon BG};
  490.         width: 85px;
  491.         height: 85px;
  492.         margin-bottom: -85px;
  493.         }
  494.         /*asks*/
  495.         /* style by todorokiscute */
  496.         .question{
  497.         width:100%;
  498.         position:relative;
  499.         display:flex;
  500.         }
  501.         .ask{
  502.         width:calc(100% - 70px);
  503.         background:{color:Icon BG};
  504.         padding:20px;
  505.         position:relative;
  506.         border-radius:5px;
  507.         color:{color:background};
  508.         }
  509.         .ask::after{
  510.         content:' ';
  511.         display:block;
  512.         border:13px solid transparent;
  513.         border-left-color:{color:Icon BG};
  514.         position:absolute;
  515.         right:-26px;
  516.         top:12px;
  517.         }
  518.         .asker-avatar{
  519.         width:50px;
  520.         height:50px;
  521.         object-fit:cover;
  522.         position:absolute;
  523.         right:0;
  524.         border-radius:50%;
  525.         }
  526.         .asker b,
  527.         .asker b a{
  528.         font-family: {text:Google Font 1};
  529.         color:{color:background};
  530.         }
  531.         .replies{
  532.         padding:1.5rem .5rem;
  533.         }
  534.         /*chat*/
  535.         .chat {
  536.         text-align:left;    
  537.         margin:0;    
  538.         padding:0;
  539.         list-style:none;
  540.         }
  541.         p.npf_chat{
  542.         padding: 5px 10px;
  543.         display: inline-block;
  544.         border-radius: 5px;
  545.         }
  546.         p.npf_chat:nth-child(odd) {
  547.         margin-right: 20%;
  548.         text-align: left;
  549.         background-color: {color:accent};    
  550.         position:relative;
  551.         }
  552.         p.npf_chat:nth-child(even) {
  553.         margin-left: 20%;
  554.         text-align: right;
  555.         background-color: {color:background};
  556.         position:relative;
  557.         }
  558.         p.npf_chat:nth-child(even)::after{
  559.         content:' ';
  560.         display:block;
  561.         border:10px solid transparent;
  562.         border-left-color:{color:background};
  563.         position:absolute;
  564.         right:-17px;
  565.         bottom:5px;
  566.         }
  567.         p.npf_chat:nth-child(odd)::before{
  568.         content:' ';
  569.         display:block;
  570.         border:10px solid transparent;
  571.         border-right-color:{color:accent};
  572.         position:absolute;
  573.         left:-17px;
  574.         bottom:5px;
  575.         }
  576.         .l {
  577.         padding:15px 0;
  578.         border-bottom:1px solid {color:text};
  579.         }
  580.         .label {
  581.         font-weight:bold;
  582.         color:{color:title};
  583.         display:inline-block;
  584.         }
  585.         .l:first-of-type {padding-top:0;}
  586.         .l:last-of-type {
  587.         padding-bottom:0;
  588.         border:0;
  589.         }
  590.         /*links style by todorokiscute*/
  591.         /* all link box */
  592.         a.link{
  593.         background: {color:posts};
  594.         display:inline-block;
  595.         width:100%;
  596.         color:{color:text};
  597.         padding:0 0.5rem;
  598.         text-decoration:none;
  599.         }
  600.         .link-url{
  601.         font-size:.7rem;
  602.         }
  603.         .link-title{
  604.         font-size:1rem;
  605.         font-family: {text:Google Font 1};
  606.         margin-top: 8px;
  607.         }
  608.         .link-desc{
  609.         font-size:.7rem;
  610.         font-style:italic;
  611.         color: rgba({RGBcolor:text}, .8);
  612.         margin-top: 8px;
  613.         }
  614.         .link-title,
  615.         .link-url,
  616.         .link-desc,
  617.         .thumbnail{
  618.         cursor:pointer;
  619.         }
  620.         /* if the links generates a thumbnail (image)*/
  621.         .thumbnail img{
  622.         all:unset;
  623.         width:calc(100% + 2em);
  624.         display:block;
  625.         margin:.4em 0;
  626.         margin-left:-1em;
  627.         }
  628.         /*permalink and notes*/
  629.         .when {
  630.         position:relative;
  631.         float: right;
  632.         margin-top: 6px;
  633.         }
  634.         .when span {display:block;}
  635.         .when a{
  636.         display:inline-block;
  637.         }
  638.         .when a:hover{
  639.         opacity: 1!important;
  640.         }
  641.         .when i{margin-right:3px;}
  642.         .tags {
  643.         margin: 6px 0;
  644.         float: left;
  645.         font-size:.7rem;
  646.         max-width: 60%;
  647.         }
  648.         .tags a {
  649.         font-style:italic;
  650.         color:{color:text};
  651.         display:inline;
  652.         margin-right: 5px;
  653.         padding: 2px 5px 0 2px;
  654.         }    
  655.         ol.notes {
  656.         list-style-type:none;
  657.         padding:0px;
  658.         margin: 50px auto;
  659.         text-align: justify;
  660.         }
  661.         ol.notes li.note {
  662.         display:block;
  663.         padding:0;
  664.         margin:5px 0;
  665.         }
  666.         ol.notes li.note img.avatar {display:none!important;}
  667.         a.more_notes_link {
  668.         display:block;
  669.         text-align:center;
  670.         color:{color:title};
  671.         }
  672.         code{padding: 5px;}
  673.         /* Preloader */
  674.         #preloader{
  675.         background-color: {color:background};
  676.         position: fixed;
  677.         left: 0;
  678.         top: 0;
  679.         display: flex;
  680.         align-items: center;
  681.         justify-content: space-around;
  682.         z-index: 999;
  683.         width: 100%;
  684.         height: 100%;
  685.         }
  686.         .lds-spinner {
  687.         color: {color:text};
  688.         display: inline-block;
  689.         position: relative;
  690.         width: 80px;
  691.         height: 80px;
  692.         }
  693.         .lds-spinner div {
  694.         transform-origin: 40px 40px;
  695.         animation: lds-spinner 1.2s linear infinite;
  696.         }
  697.         .lds-spinner div:after {
  698.         content: " ";
  699.         display: block;
  700.         position: absolute;
  701.         top: 3px;
  702.         left: 37px;
  703.         width: 6px;
  704.         height: 18px;
  705.         border-radius: 20%;
  706.         background: {color:text};
  707.         }
  708.         .lds-spinner div:nth-child(1) {
  709.         transform: rotate(0deg);
  710.         animation-delay: -1.1s;
  711.         }
  712.         .lds-spinner div:nth-child(2) {
  713.         transform: rotate(30deg);
  714.         animation-delay: -1s;
  715.         }
  716.         .lds-spinner div:nth-child(3) {
  717.         transform: rotate(60deg);
  718.         animation-delay: -0.9s;
  719.         }
  720.         .lds-spinner div:nth-child(4) {
  721.         transform: rotate(90deg);
  722.         animation-delay: -0.8s;
  723.         }
  724.         .lds-spinner div:nth-child(5) {
  725.         transform: rotate(120deg);
  726.         animation-delay: -0.7s;
  727.         }
  728.         .lds-spinner div:nth-child(6) {
  729.         transform: rotate(150deg);
  730.         animation-delay: -0.6s;
  731.         }
  732.         .lds-spinner div:nth-child(7) {
  733.         transform: rotate(180deg);
  734.         animation-delay: -0.5s;
  735.         }
  736.         .lds-spinner div:nth-child(8) {
  737.         transform: rotate(210deg);
  738.         animation-delay: -0.4s;
  739.         }
  740.         .lds-spinner div:nth-child(9) {
  741.         transform: rotate(240deg);
  742.         animation-delay: -0.3s;
  743.         }
  744.         .lds-spinner div:nth-child(10) {
  745.         transform: rotate(270deg);
  746.         animation-delay: -0.2s;
  747.         }
  748.         .lds-spinner div:nth-child(11) {
  749.         transform: rotate(300deg);
  750.         animation-delay: -0.1s;
  751.         }
  752.         .lds-spinner div:nth-child(12) {
  753.         transform: rotate(330deg);
  754.         animation-delay: 0s;
  755.         }
  756.         @keyframes lds-spinner {
  757.         0% {
  758.         opacity: 1;
  759.         }
  760.         100% {
  761.         opacity: 0;
  762.         }
  763.         }
  764.         /* Tooltip container */
  765.         .tooltip {
  766.         position: relative;
  767.         display: flex;
  768.         font-size: .75rem;
  769.         }
  770.         /* Tooltip text */
  771.         .tooltip .tooltiptext {
  772.         visibility: hidden;
  773.         width: 120px;
  774.         background-color: {color:text};
  775.         color: {color:background};
  776.         text-align: center;
  777.         padding: 5px 0;
  778.         border-radius: 6px;
  779.         /* Position the tooltip text */
  780.         position: absolute;
  781.         z-index: 1;
  782.         bottom: 125%;
  783.         left: 50%;
  784.         margin-left: -60px;
  785.         /* Fade in tooltip */
  786.         opacity: 0;
  787.         transition: opacity 0.3s ease-in-out;
  788.         }
  789.         /* Tooltip arrow */
  790.         .tooltip .tooltiptext::after {
  791.         content: "";
  792.         position: absolute;
  793.         top: 100%;
  794.         left: 50%;
  795.         margin-left: -5px;
  796.         border-width: 5px;
  797.         border-style: solid;
  798.         border-color: {color:text} transparent transparent transparent;
  799.         }
  800.         /* Show the tooltip text when you mouse over the tooltip container */
  801.         .tooltip:hover .tooltiptext {
  802.         visibility: visible;
  803.         opacity: 1!important;
  804.         }
  805.         @media screen and (max-width: 1017px){
  806.             *{font-size:2vw!important;}
  807.             body{line-height: normal;}
  808.             .updates{max-width: initial!important;}
  809.             aside{
  810.             position: relative;
  811.             width: 100%;
  812.             text-align: center;
  813.             padding-right:0;
  814.             height: auto;
  815.             }
  816.             section{margin: 0 auto;}
  817.             footer{margin-left: -15%;}
  818.             main{margin-left:10%;}
  819.             .sidebar-user{justify-content: center;}
  820.             nav ul{margin:25px auto;}
  821.             .updates{text-align: left;
  822.             max-width: 200px;
  823.             margin: 0 auto 40px auto;}
  824.         }
  825.         @media screen and (max-width: 815px){
  826.             .wrap{
  827.             margin: 0;
  828.             width: 100%;
  829.             height: 100%;
  830.             }
  831.         }
  832.         {CustomCSS}
  833.     </style>
  834. </head>
  835. <body>
  836.     <!--Comment this div to remove preloader (or see changes in the editor) -->
  837.     <div id="preloader">
  838.         <div class="lds-spinner">
  839.             <div></div>
  840.             <div></div>
  841.             <div></div>
  842.             <div></div>
  843.             <div></div>
  844.             <div></div>
  845.             <div></div>
  846.             <div></div>
  847.             <div></div>
  848.             <div></div>
  849.             <div></div>
  850.             <div></div>
  851.         </div>
  852.     </div>
  853.     <!--end preloader-->
  854.     <div class="wrap">
  855.         <aside>
  856.             <div class="sidebar-user">
  857.                 <img class="blog-img" src="{PortraitURL-64}" alt="{Title}"/>
  858.                 <a id="blogtitle" href="/">{Title}</a>
  859.             </div>
  860.             <div id="description">{Description}</div>
  861.             <nav>
  862.                 <ul>
  863.                     <li>
  864.                         <div class="tooltip">
  865.                             <a href="/"><i class="ri-home-4-line"></i></a>
  866.                             <span class="tooltiptext">{lang:Home}</span>
  867.                         </div>
  868.                     </li>
  869.                     {block:ifLink1URL}
  870.                     <li>
  871.                         <div class="tooltip">
  872.                             <a href="{text:Link 1 URL}">{text:Link 1 icon}</a>
  873.                             <span class="tooltiptext">{text:Link 1 text}</span>
  874.                         </div>
  875.                     </li>
  876.                     {/block:ifLink1URL}
  877.                     {block:AskEnabled}
  878.                     <li>
  879.                         <div class="tooltip">
  880.                             <a href="/ask"><i class="ri-mail-line"></i></a>
  881.                             <span class="tooltiptext">{AskLabel}</span>
  882.                         </div>
  883.                     </li>
  884.                     {/block:AskEnabled}
  885.                     {block:ifLink2URL}
  886.                     <li>
  887.                         <div class="tooltip">
  888.                             <a href="{text:Link 2 URL}">{text:Link 2 icon}</a>
  889.                             <span class="tooltiptext">{text:Link 2 text}</span>
  890.                         </div>
  891.                     </li>
  892.                     {/block:ifLink2URL}
  893.                     {block:ifShowArchiveBtn}
  894.                     <li>
  895.                         <div class="tooltip">
  896.                             <a href="/archive"><i class="ri-folder-line"></i></a>
  897.                             <span class="tooltiptext">{lang:Archive}</span>
  898.                         </div>
  899.                     </li>
  900.                     {/block:ifShowArchiveBtn}
  901.                     {block:ifLink3URL}
  902.                     <li>
  903.                         <div class="tooltip">
  904.                             <a href="{text:Link 3 URL}">{text:Link 3 icon}</a>
  905.                             <span class="tooltiptext">{text:Link 3 text}</span>
  906.                         </div>
  907.                     </li>
  908.                     {/block:ifLink3URL}
  909.                     {block:SubmissionsEnabled}
  910.                     <li>
  911.                         <div class="tooltip">
  912.                             <a href="/submit"><i class="ri-upload-2-line"></i></a>
  913.                             <span class="tooltiptext">{SubmitLabel}</span>
  914.                         </div>
  915.                     </li>
  916.                     {/block:SubmissionsEnabled}
  917.                     <li>
  918.                         <div class="tooltip">
  919.                             <a href="https://mephistia-themes.tumblr.com/tagged/my%20theme"><i class="ri-code-s-slash-line"></i></a>
  920.                             <span class="tooltiptext">Theme</span>
  921.                         </div>
  922.                     </li>
  923.                 </ul>
  924.             </nav>
  925.            
  926. <!-------------------------------- UPDATES BEGIN ------------------------------------>
  927.  
  928.             <div class="updates">
  929.                 <ul>
  930.                     <li><strong>
  931.                    
  932.                         update title 1
  933.                        
  934.                         </strong>
  935.                         <span>
  936.                        
  937.                         update description...
  938.                        
  939.                         </span>
  940.                     </li>
  941.                     <li><strong>
  942.                    
  943.                         update title 2
  944.                        
  945.                         </strong>
  946.                         <span>
  947.                        
  948.                         update description... a bit longer just in case
  949.                        
  950.                         </span>
  951.                     </li>
  952.                 </ul>
  953.             </div>
  954. <!-------------------------------- UPDATES END ------------------------------------>
  955.  
  956.  
  957.         </aside>
  958.         <main>
  959.             <div id="msnry-limit">
  960.                 <section {block:IndexPage}id="entries"{/block:IndexPage} {block:HomePage} class="permalink"{/block:HomePage}>
  961.                 {block:Posts}
  962.                 <!-- {block:NoRebloggedFrom}
  963.                     {block:RebloggedFrom}{ReblogParentName}{/block:RebloggedFrom}
  964.                     {/block:NoRebloggedFrom} -->
  965.                 {block:ContentSource}
  966.                 <!-- {SourceURL}
  967.                     {block:SourceLogo}<img src="{BlackLogoURL}"width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />{/block:SourceLogo}
  968.                     {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  969.                 {/block:ContentSource}
  970.                 <article class="{posttype}post {block:IndexPage}posts {/block:IndexPage} {block:caption}captioned{/block:caption}">
  971.                     <!-- text posts -->
  972.                     {block:Text}
  973.                     {block:Notreblog}
  974.                     <li class="comment {block:Title}ted{/block:Title}">
  975.                         {block:Title}
  976.                         <div class="post-title">{title}</div>
  977.                         {/block:Title}
  978.                         <div class="tex">{body}</div>
  979.                     </li>
  980.                     <div class="user-info">
  981.                         <a class="user" {block:HasPermalink}href="{Permalink}"{/block:HasPermalink}target="_blank">
  982.                         <img class="user-img" src="{PortraitURL-64}" alt="{PhotoAlt}"/>
  983.                         {PostAuthorName}
  984.                         </a>
  985.                     </div>
  986.                     {/block:Notreblog}
  987.                     {block:Rebloggedfrom}
  988.                     {block:Reblogs}
  989.                     <div class="caption">
  990.                         <div class="reblogs">
  991.                             <li class="comment {block:Title}ted{/block:Title}">
  992.                                 {block:Title}
  993.                                 <div class="post-title">{title}</div>
  994.                                 {/block:Title}
  995.                                 <div class="tex">{Body}</div>
  996.                             </li>
  997.                             <div class="user-info">
  998.                                 {block:IsActive}
  999.                                 <a class="user" {block:HasPermalink}href="{Permalink}"{/block:HasPermalink}target="_blank">
  1000.                                 <img class="user-img" src="{PortraitURL-64}" alt="{PhotoAlt}"/>
  1001.                                 {username}
  1002.                                 </a>
  1003.                                 {/block:IsActive}
  1004.                                 {block:IsDeactivated}
  1005.                                 <div class="user inactive">
  1006.                                     <img class="user-img" src="{PortraitURL-64}" alt="{PhotoAlt}"/>
  1007.                                     {username}
  1008.                                 </div>
  1009.                                 {/block:IsDeactivated}
  1010.                             </div>
  1011.                         </div>
  1012.                         {/block:Reblogs}
  1013.                     </div>
  1014.                     {/block:RebloggedFrom}
  1015.                     {/block:Text}
  1016.                     <div class="ph">
  1017.                         <!-- photo posts -->
  1018.                         {block:Photo}
  1019.                         <div class="single-photo" photoset-layout="{PhotosetLayout}">
  1020.                             <div class="to-zoom" data-width="{PhotoWidth-HighRes}" data-height="{PhotoHeight-HighRes}" data-lowres="{PhotoURL-500}" data-highres="{PhotoURL-HighRes}" onclick="lightbox(this)"><img src="{PhotoURL-HighRes}" alt="{PhotoAlt}" /></div>
  1021.                         </div>
  1022.                         {/block:Photo}
  1023.                         <!-- photoset -->
  1024.                         {block:Photoset}
  1025.                         <div class="photoset-grid" photoset-layout="{PhotosetLayout}">
  1026.                             {block:Photos}
  1027.                             <div class="to-zoom" data-width="{PhotoWidth-HighRes}" data-height="{PhotoHeight-HighRes}" data-lowres="{PhotoURL-500}" data-highres="{PhotoURL-HighRes}" onclick="lightbox(this)"><img src="{PhotoURL-HighRes}" alt="{PhotoAlt}" /></div>
  1028.                             {/block:Photos}
  1029.                         </div>
  1030.                         {/block:Photoset}
  1031.                         <!-- panorama -->
  1032.                         {block:Panorama}
  1033.                         <img src="{photourl-panorama}" alt="{photoalt}">
  1034.                         {/block:Panorama}
  1035.                         <!-- video posts -->
  1036.                         {block:Video}
  1037.                         <div class="video">
  1038.                             {Video-500}
  1039.                         </div>
  1040.                         {/block:Video}
  1041.                         <!--Audio posts-->
  1042.                         {block:Audio}
  1043.                         <div class="audio">
  1044.                             <div class="noalbumart"></div>
  1045.                             {AudioEmbed}
  1046.                         </div>
  1047.                         {/block:Audio}
  1048.                         <!-- captions -->
  1049.                         {block:caption}
  1050.                         {block:Reblogs}
  1051.                         <li class="comment">
  1052.                             <div class="tex">{body}</div>
  1053.                         </li>
  1054.                         <div class="user-info">
  1055.                             {block:IsOriginalEntry}
  1056.                             {block:IsActive}
  1057.                             <a class="user" {block:HasPermalink}href="{Permalink}"{/block:HasPermalink}target="_blank">
  1058.                             <img class="user-img" src="{PortraitURL-64}" alt="{PhotoAlt}"/>
  1059.                             {username}
  1060.                             </a>
  1061.                             {/block:IsActive}
  1062.                             {block:IsDeactivated}
  1063.                             <div class="user inactive">
  1064.                                 <img class="user-img" src="{PortraitURL-64}" alt="{PhotoAlt}"/>
  1065.                                 {username}
  1066.                             </div>
  1067.                             {/block:IsDeactivated}
  1068.                             {/block:IsOriginalEntry}
  1069.                             {block:IsNotOriginalEntry}
  1070.                             <a class="user" {block:HasPermalink}href="{Permalink}"{/block:HasPermalink}target="_blank">
  1071.                             <img class="user-img" src="{PortraitURL-64}" alt="{PhotoAlt}"/>
  1072.                             {username}
  1073.                             </a>
  1074.                             {/block:IsNotOriginalEntry}
  1075.                         </div>
  1076.                         {/block:Reblogs}
  1077.                         {block:NotReblog}
  1078.                         <li class="comment">
  1079.                             <div class="tex">{caption}</div>
  1080.                         </li>
  1081.                         <div class="user-info">
  1082.                             <a class="user" {block:HasPermalink}href="{Permalink}"{/block:HasPermalink}target="_blank">
  1083.                             <img class="user-img" src="{PortraitURL-64}" alt="{PhotoAlt}"/>
  1084.                             {PostAuthorName}
  1085.                             </a>
  1086.                         </div>
  1087.                         {/block:NotReblog}
  1088.                         {/block:caption}
  1089.                     </div>
  1090.                     <!-- quote posts -->
  1091.                     {block:Quote}
  1092.                     <li class="comment quote">
  1093.                         <span class="quote-icon"><i class="ri-double-quotes-l"></i></span>
  1094.                         <div class="title">{quote}</div>
  1095.                         {block:Source}
  1096.                         <div class="source">{source}</div>
  1097.                     </li>
  1098.                     {/block:Source}
  1099.                     {/block:Quote}
  1100.                     <!-- chat posts -->
  1101.                     {block:Chat}
  1102.                     {block:Title}
  1103.                     <div id="title">{title}</div>
  1104.                     {/block:Title}
  1105.                     <ol class="chat {block:Title}ted{/block:Title}">
  1106.                         {block:lines}
  1107.                         <li class="l {Alt}">
  1108.                             {block:label}
  1109.                             <span class="label">{label}</span>
  1110.                             {/block:label}            
  1111.                             {line}
  1112.                         </li>
  1113.                         {/block:lines}
  1114.                     </ol>
  1115.                     {/block:Chat}
  1116.                     <!--Link posts-->
  1117.                     <!-- post link style by todorokiscute -->
  1118.                     {block:Link}
  1119.                     <li class="comment captioned">
  1120.                         <div class="post-link">
  1121.                             <a href="{URL}" class="link" {Target}>
  1122.                                 <div class="link-url">
  1123.                                     {block:Host}{Host}{/block:Host}
  1124.                                 </div>
  1125.                                 {block:Thumbnail}
  1126.                                 <div class="thumbnail">
  1127.                                     <img src="{Thumbnail}"/>
  1128.                                 </div>
  1129.                                 {/block:Thumbnail}
  1130.                                 <div class="link-title">
  1131.                                     {Name}
  1132.                                 </div>
  1133.                                 <div class="link-desc">
  1134.                                     {block:Excerpt}
  1135.                                     {Excerpt}
  1136.                                     {/block:Excerpt}
  1137.                                 </div>
  1138.                             </a>
  1139.                         </div>
  1140.                         {block:Notreblog}
  1141.                         {block:Description}
  1142.                     <li class="comment">
  1143.                         <div class="tex">{Description}</div>
  1144.                     </li>
  1145.                     {/block:Description}
  1146.                     <div class="user-info">
  1147.                         <a class="user" {block:HasPermalink}href="{Permalink}"{/block:HasPermalink}target="_blank">
  1148.                         <img class="user-img" src="{PortraitURL-64}" alt="{PhotoAlt}"/>
  1149.                         {username}
  1150.                         </a>
  1151.                     </div>
  1152.                     {/block:Notreblog}
  1153.                     {block:Rebloggedfrom}
  1154.                     {block:Reblogs}
  1155.                     {block:Description}
  1156.                     <li class="comment">
  1157.                         <div class="tex hide">{Description}</div>
  1158.                     </li>
  1159.                     {/block:Description}
  1160.                     <div class="caption">
  1161.                         <div class="reblogs">
  1162.                             <div class="user-info">
  1163.                                 {block:IsActive}
  1164.                                 <a class="user" {block:HasPermalink}href="{Permalink}"{/block:HasPermalink}target="_blank">
  1165.                                 <img class="user-img" src="{PortraitURL-64}" alt="{PhotoAlt}"/>
  1166.                                 {username}
  1167.                                 </a>
  1168.                                 {/block:IsActive}
  1169.                                 {block:IsDeactivated}
  1170.                                 <div class="user inactive">
  1171.                                     <img class="user-img" src="{PortraitURL-64}" alt="{PhotoAlt}"/>
  1172.                                     {username}
  1173.                                 </div>
  1174.                                 {/block:IsDeactivated}
  1175.                             </div>
  1176.                         </div>
  1177.                         {/block:Reblogs}
  1178.                     </div>
  1179.                     {/block:RebloggedFrom}
  1180.                     </li>
  1181.                     {/block:Link}
  1182.                     <!-- link end here -->
  1183.                     <!--answer posts-->
  1184.                     <!-- Post question by todorokiscute -->
  1185.                     {block:Answer}
  1186.                     <div class="question">
  1187.                         <img class="asker-avatar" src="{AskerPortraitURL-96}" alt="">
  1188.                         <div class="ask">
  1189.                             <div class="asker"><b>{Asker}:</b> {Question}</div>
  1190.                         </div>
  1191.                     </div>
  1192.                     <div class="replies comment">
  1193.                         {Replies}
  1194.                     </div>
  1195.                     {/block:Answer}
  1196.                     <!-- Post question end -->
  1197.                     {block:Date}
  1198.                     <div class="when">
  1199.                         <a href="{permalink}">
  1200.                             <div class="tooltip">
  1201.                                 <i class="ri-time-line"></i><span>{lang:Posted TimeAgo}</span>
  1202.                                 <span class="tooltiptext">{ShortMonth} {DayofMonth}, {Year}</span>
  1203.                             </div>
  1204.                         </a>
  1205.                     </div>
  1206.                     {/block:Date}
  1207.                     <!-- tags -->
  1208.                     {block:Hastags}
  1209.                     <div class="tags">
  1210.                         <i class="ri-price-tag-3-line"></i>
  1211.                         {block:Tags}
  1212.                         <a href="{TagURL}">{Tag}</a>
  1213.                         {/block:Tags}
  1214.                     </div>
  1215.                     {/block:Hastags}
  1216.                 </article>
  1217.                 <!-- end posts -->
  1218.                 <!-- post note list -->
  1219.                 {PostNotes}
  1220.                 {/block:Posts}
  1221.                 </section>
  1222.                 {block:Pagination}
  1223.                 <footer id="pagination">
  1224.                     {block:PreviousPage}    
  1225.                     <span class="prevpage">
  1226.                         <a href="{PreviousPage}">
  1227.                             <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24">
  1228.                                 <path fill="none" d="M0 0h24v24H0z"/>
  1229.                                 <path d="M10.828 12l4.95 4.95-1.414 1.414L8 12l6.364-6.364 1.414 1.414z"/>
  1230.                             </svg>
  1231.                         </a>
  1232.                     </span>
  1233.                     {/block:PreviousPage}
  1234.                     {block:JumpPagination length="5"}
  1235.                     {block:CurrentPage}<a class="current_page">{PageNumber}</span>{/block:CurrentPage}
  1236.                     {block:JumpPage}<a class="jump_page" href="{URL}">{PageNumber}</a>{/block:JumpPage}
  1237.                     {/block:JumpPagination}
  1238.                     {block:NextPage}
  1239.                     <span class="nextpage">
  1240.                         <a href="{NextPage}">
  1241.                             <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24">
  1242.                                 <path fill="none" d="M0 0h24v24H0z"/>
  1243.                                 <path d="M13.172 12l-4.95-4.95 1.414-1.414L16 12l-6.364 6.364-1.414-1.414z"/>
  1244.                             </svg>
  1245.                         </a>
  1246.                     </span>
  1247.                     {/block:NextPage}
  1248.                 </footer>
  1249.                 {/block:Pagination}  
  1250.             </div>
  1251.             {block:ContentSource}
  1252.             <!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"
  1253.                 width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  1254.                 {/block:SourceLogo}
  1255.                 {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  1256.             {/block:ContentSource}
  1257.         </main>
  1258.     </div>
  1259.     <!--scripts-->
  1260.     <!--jQuery-->
  1261.     <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  1262.     <!--ImagesLoaded-->
  1263.     <script src="https://unpkg.com/imagesloaded@4/imagesloaded.pkgd.min.js"></script>
  1264.     <!--Masonry-->
  1265.     <script src="https://unpkg.com/masonry-layout@4/dist/masonry.pkgd.min.js"></script>
  1266.     <!--photoset.css-->
  1267.     <script src="https://static.tumblr.com/0podkko/jfMplm3f8/modified_photosets.js"></script>
  1268.     <!-- Responsive iFrames by @nouvae -->
  1269.     <script src="https://rawgit.com/robinpx/tumblr/master/scripts/flexibleFrames/flexibleFrames.min.js"></script>
  1270.     <!-- Prettify code -->
  1271.     <script src="https://cdn.jsdelivr.net/gh/google/code-prettify@master/loader/run_prettify.js?lang=css&lang=html&amp;skin=sunburst"></script>
  1272.     <script type="text/javascript">
  1273.         initPhotosets();
  1274.        
  1275.         function flexFrame() {
  1276.            $(".caption").each(function() {
  1277.                 $(this).find("iframe").wrap("<div class='capframe'></div>"); // wrap iframe
  1278.                 flexibleFrames($(".capframe"));
  1279.             });
  1280.             flexibleFrames($(".video"));
  1281.         }
  1282.        
  1283.        
  1284.         // Change Audio Player Color by @shudesigns
  1285.          $(document).ready(function() {
  1286.                     // audio player
  1287.                     var $audio = $('iframe.tumblr_audio_player');
  1288.                     $audio.load(function() {
  1289.                       $(this).contents().find('head').append('<style type="text/css">' +
  1290.                         '.audio-player { margin: 0 0 0 85px!important; background: {color:background}!important; color: {color:text} !important; width:100%!important; }' +
  1291.                       '.audio-player .audio-info { margin: 0 0 0 40px!important;}' +
  1292.                       '.audio-image { right: auto!important; z-index: 0!important;}' +
  1293.                       '.audio-player .progress {background-color: {color:accent}!important; }' +
  1294.                       'iframe.tumblr_audio_player {width: 100%!important;}' +
  1295.                       '.audio-player .play-pause{ margin-left: -80px!important; }' +
  1296.                         '.audio-player .audio-info .track-artist, .audio-player .audio-info .track-name { color: {color:text} !important;}' + '.track-name { font-weight: bold; }' +
  1297.                         '.track-artist::before{content:"- "; color:{color:text};' +
  1298.                       '</style>');
  1299.                     });
  1300.                    
  1301.                     flexFrame();
  1302.                    
  1303.                     $('pre').addClass('prettyprint');
  1304.                     $('code').addClass('prettyprint');
  1305.                    
  1306.                     $('.read_more').html('{lang:Keep reading} <i class="ri-arrow-right-s-line"></i>');
  1307.         });
  1308.        
  1309.        
  1310.         //remove tumblr redirects script by magnusthemes@tumblr
  1311.           $('a[href*="t.umblr.com/redirect"]').each(function(){
  1312.               var originalURL = $(this).attr("href").split("?z=")[1].split("&t=")[0];
  1313.               var replaceURL = decodeURIComponent(originalURL);
  1314.               $(this).attr("href", replaceURL);
  1315.           });
  1316.          
  1317.            var $container = $('#entries');
  1318.            
  1319.        
  1320.             $container.imagesLoaded(function(){
  1321.                 $container.masonry({  // options...
  1322.               itemSelector: '.posts',
  1323.               columnWidth: {select:Post Width} + 80,
  1324.               fitWidth: true});
  1325.             });
  1326.            
  1327.             var $preloader = $('#preloader');
  1328.            
  1329.             $(window).on('load', function () {
  1330.                  $preloader.fadeOut("slow");
  1331.                  console.log("carregado");
  1332.             });
  1333.            
  1334.     </script>
  1335. </body>
  1336. </html>
  1337.  
  1338.  
Advertisement
Add Comment
Please, Sign In to add comment