API tools faq
paste
Advertisement
felinum

shortcake

felinum
Jun 19th, 2016
29,469
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 5 82.05 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4.  
  5.  
  6. <!--
  7.  
  8. Theme «Shortcake» by felinum
  9.  
  10. Last update: 26.08.2016
  11.  
  12. Rules:
  13. 1. Don't claim any part of the code as your own.
  14. 2. Don't redistribute it on other sites.
  15. 3. Don't implement parts of my code into your themes w/o permission.
  16. 4. Leave the credit intact and visible (don't move it to secondary pages).
  17. 5. You may edit the theme, but not beyond recognition.
  18.  
  19.  
  20.  
  21. Notes:
  22.   1. Keep your title and subtitle short. If your screen resolution is smaller than 1150px (width), they won't be visible.
  23.   2. If you enable the "Top Bar" option, make sure to disable "Bottom Bar" and vice versa. Same with the "Updates Tab Right" and "Updates Tab Left" options.
  24.   3. To change the post size and number of columns, scroll down the Theme Options panel until you find the "Post Size" and "Number of Columns" labels.
  25.   4. To edit the updates tab, find line 1003 and follow the instructions. (click on the gear icon next to 'Edit HTML' > 'Go to line...')
  26.  
  27.  
  28. Credits:
  29.  - Infinite Scroll: Paul Irish (https://github.com/infinite-scroll/infinite-scroll)
  30.  - Masonry with Infinite Scroll and PXU Photosets: @ shythemes (http://shythemes.tumblr.com/post/148791415248/)
  31.  - Video Resizing: @ shythemes (http://shythemes.tumblr.com/post/134536748863/)
  32.  - Photo Lightbox: @ shythemes (http://shythemes.tumblr.com/post/140444996328/)
  33.  - Masonry: David DeSandro (http://masonry.desandro.com/)
  34.  - Like Button with Infinite Scroll: @ magnusthemes (http://magnusthemes.tumblr.com/post/132530444620)
  35.  - Like and Reblog Buttons: (http://demirev.cubthemes.com/post/106345243051)
  36.  - Styled Tooltips: Manos Malihutsakis (http://manos.malihu.gr/tuts/style-my-tooltips.html)
  37.  
  38.  
  39. -->
  40.                    
  41.                    
  42.        
  43.     <title>{Title}</title>
  44.     <link rel="shortcut icon" href="http://i205.photobucket.com/albums/bb186/mhilkas/favoicons/014.gif"> <!--more favicons here: http://starious.tumblr.com/post/27104942315/favicons -->
  45.    
  46.     <link rel="alternate" type="application/rss+xml" href="{RSS}">
  47.     {block:Description}<meta name="description" content="{MetaDescription}"/>{/block:Description}
  48.     <meta http-equiv="x-dns-prefetch-control" content="off"/>
  49.     <style> body, a, a:hover{cursor:url({select:Tiny Cursor}), auto} </style>
  50.     <link href='https://fonts.googleapis.com/css?family=Karla|Muli:400, 400:italic|Roboto:400,400italic,500,500italic|Inconsolata|Hind|Playfair+Display:400,900,700italic|Cardo:400,400italic' rel='stylesheet' type='text/css'>
  51.     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">
  52.     <link href="http://static.tumblr.com/qudkd6d/OcDnl99gb/style.css" rel="stylesheet" type="text/css"/>
  53.     {block:ifNotOldLikeReblogButtons}<link rel="stylesheet" href="http://static.tumblr.com/0cdn90j/3lyocfhe5/felinum.css">{/block:ifNotOldLikeReblogButtons}
  54.  
  55.     <meta name="image:Background" content=""/>
  56.     <meta name="image:Icon" content="http://static.tumblr.com/0cdn90j/spco7mpj1/untitled-1_copy.png"/>
  57.     <meta name="color:Background" content="#f8f8f8"/>
  58.     <meta name="color:Text" content="#6d6d6d"/>
  59.     <meta name="color:Link" content="#000"/>
  60.     <meta name="color:Link BG" content="#fef7f8"/>
  61.     <meta name="color:Link Hover" content="#eac1c5"/>
  62.     <meta name="color:Link BG Hover" content="#fff"/>
  63.     <meta name="color:Posts BG" content="#fff"/>
  64.     <meta name="color:Italic" content="#c9a0ab"/>
  65.     <meta name="color:Bold" content="#56585b"/>
  66.  
  67.     <meta name="color:Navigation Bar BG" content="#fff"/>
  68.     <meta name="color:Navigation Bar Text" content="#6d6d6d"/>    
  69.     <meta name="color:Navigation Bar Border" content="#f5f5f5"/>
  70.     <meta name="color:Navigation Bar Title" content="#000"/>
  71.     <meta name="color:Navigation Bar Subtitle" content="#6d6d6d"/>
  72.     <meta name="color:Navigation Bar Links" content="#000"/>
  73.     <meta name="color:Search Bar Input" content="#000"/>
  74.     <meta name="color:NavBar Controls Icons" content="#363636"/>
  75.     <meta name="color:NavBar Controls Icons Hover" content="#daa7a7"/>
  76.    
  77.     <meta name="color:Updates Tab Navicon" content="#000"/>
  78.     <meta name="color:Updates Tab BG" content="#fff"/>
  79.     <meta name="color:Updates Tab Border" content="#fff"/>
  80.     <meta name="color:Updates Tab Accent" content="#f8eeef"/>
  81.     <meta name="color:Updates Tab Icons" content="#000"/>
  82.     <meta name="color:Updates Tab Title" content="#000"/>
  83.     <meta name="color:Updates Tab Content" content="#6d6d6d"/>
  84.     <meta name="color:Updates Tab Link" content="#000"/>
  85.     <meta name="color:Updates Tab Link Border" content="#f8dcdd"/>
  86.  
  87.     <meta name="color:Post Info" content="#9d9d9d"/>
  88.     <meta name="color:Post Info Hover" content="#dcc9cc"/>
  89.     <meta name="color:Tags" content="#a5a5a5"/>
  90.     <meta name="color:Tag Icon" content="#edd0d3"/>
  91.     <meta name="color:Like Reblog Buttons" content="#979797"/>
  92.     <meta name="color:Like Reblog Buttons Hover" content="#e7b0b0"/>
  93.     <meta name="color:Like Button Liked" content="#e7b0b0"/>
  94.    
  95.     <meta name="color:Post Accent" content="#f8f8f8"/>
  96.     <meta name="color:First Letter" content="#494949"/>
  97.     <meta name="color:First Letter BG" content="#f8eeef"/>
  98.     <meta name="color:Blockquote Border" content="#f0e3e5"/>
  99.     <meta name="color:Text Post Title" content="#494949"/>
  100.     <meta name="color:Question" content="#000"/>
  101.     <meta name="color:Asker" content="#000"/>
  102.     <meta name="color:Quote" content="#333"/>
  103.     <meta name="color:Quote Source" content="#000"/>
  104.     <meta name="color:Chat Label" content="#b6a3a6"/>
  105.     <meta name="color:Track Info" content="#6d6d6d"/>
  106.     <meta name="color:Track Border" content="#efc3c3"/>
  107.    
  108.     <meta name="color:Back to Top Icon" content="#daa7a7"/>
  109.     <meta name="color:Back to Top Icon Hover" content="#797979"/>
  110.     <meta name="color:Back to Top BG" content="#f9f9f9"/>
  111.     <meta name="color:Selection BG" content="#fee8e9"/>
  112.     <meta name="color:Selection Text" content="#000"/>
  113.     <meta name="color:Tooltip Text" content="#7e7e7e"/>
  114.     <meta name="color:Tooltip BG" content="#f9f9f9"/>
  115.     <meta name="color:Tooltip Border" content="#eaeaea"/>
  116.    
  117.     <meta name="select:Body Font Size" content="10" title="10px"/>
  118.     <meta name="select:Body Font Size" content="11" title="11px"/>
  119.     <meta name="select:Body Font Size" content="12" title="12px"/>
  120.    
  121.     <meta name="select:Navigation Links Font Size" content="6" title="6px"/>
  122.     <meta name="select:Navigation Links Font Size" content="7" title="7px"/>
  123.     <meta name="select:Navigation Links Font Size" content="8" title="8px"/>
  124.    
  125.     <meta name="select:Body Font Family" content="Hind" title="Hind"/>
  126.     <meta name="select:Body Font Family" content="Karla" title="Karla">
  127.     <meta name="select:Body Font Family" content="Roboto" title="Roboto"/>
  128.     <meta name="select:Body Font Family" content="Inconsolata" title="Inconsolata"/>
  129.     <meta name="select:Body Font Family" content="Muli" title="Muli"/>
  130.     <meta name="select:Body Font Family" content="Cardo" title="Cardo"/>
  131.    
  132.     <meta name="select:Updates Tab Title" content="Muli" title="Muli"/>
  133.     <meta name="select:Updates Tab Title" content="Hind" title="Hind"/>
  134.     <meta name="select:Updates Tab Title" content="Roboto" title="Roboto"/>
  135.     <meta name="select:Updates Tab Title" content="Inconsolata" title="Inconsolata"/>
  136.     <meta name="select:Updates Tab Title" content="Karla" title="Karla">
  137.     <meta name="select:Updates Tab Title" content="Cardo" title="Cardo"/>
  138.    
  139.     <meta name="select:Photoset Gutter" content="2" title="2px"/>
  140.     <meta name="select:Photoset Gutter" content="1" title="1px"/>
  141.     <meta name="select:Photoset Gutter" content="3" title="3px"/>
  142.     <meta name="select:Photoset Gutter" content="4" title="4px"/>
  143.    
  144.     <meta name="select:Nav Bar Icon Shape" content="32" title="round"/>
  145.     <meta name="select:Nav Bar Icon Shape" content="4" title="rounded corners"/>
  146.     <meta name="select:Nav Bar Icon Shape" content="0" title="square"/>
  147.    
  148.     <meta name="select:Audio Image Shape" content="25" title="round"/>
  149.     <meta name="select:Audio Image Shape" content="4" title="rounded corners"/>
  150.     <meta name="select:Audio Image Shape" content="0" title="square"/>
  151.    
  152.     <meta name="select:Controls" content=".3" title="gray"/>
  153.     <meta name="select:Controls" content="1" title="black"/>
  154.    
  155.     <meta name="select:Tiny Cursor" content="http://cur.cursors-4u.net/cursors/cur-9/cur817.cur" title="white"/>
  156.     <meta name="select:Tiny Cursor" content="http://media.tumblr.com/tumblr_lqs4qdUu8n1qfoi4t.png" title="black"/>
  157.    
  158.     <meta name="if:Infinite Scroll" content="0"/>
  159.     <meta name="if:Fade in on Refresh" content="1"/>
  160.     <meta name="if:Top Bar" content="0"/>
  161.     <meta name="if:Bottom Bar" content="1"/>
  162.     <meta name="if:Updates Tab" content="1"/>
  163.     <meta name="if:Updates Tab Left" content="1"/>
  164.     <meta name="if:Updates Tab Right" content="0"/>
  165.     <meta name="if:Reveal Updates tab on click" content="0"/>
  166.     <meta name="if:Reveal Post Info on Hover" content="1"/>
  167.     <meta name="if:Old Like Reblog Buttons" content="0"/>
  168.     <meta name="if:Custom Controls" content="1"/>
  169.     <meta name="if:Show Caption" content="1"/>
  170.    
  171.     <meta name="text:Post Size" content="300"/>
  172.     <meta name="text:Permalink Post Size" content="540"/>
  173.     <meta name="text:Number of Columns" content="1"/>
  174.     <meta name="text:Post Padding" content="2"/>
  175.     <meta name="text:Post Side Margin" content="30"/>
  176.     <meta name="text:Post Bottom Margin" content="80"/>
  177.     <meta name="text:Subtitle" content="subtitle"/>
  178.     <meta name="text:Description2" content="Second description. You can make it as long as you want; if it escapes the navigation height, a scrollbar will appear. If your screen res is smaller than 1150px(width), the title & subtitle won't be visible on your blog."/>
  179.    
  180.     <meta name="text:Link 1 URL" content="/"/>
  181.     <meta name="text:Link 1" content="home"/>
  182.     <meta name="text:Link 2 URL" content="/ask"/>
  183.     <meta name="text:Link 2" content="mssg"/>
  184.     <meta name="text:Link 3 URL" content="/archive"/>
  185.     <meta name="text:Link 3" content="map"/>
  186.     <meta name="text:Link 4 URL" content="/"/>
  187.     <meta name="text:Link 4" content="link 4"/>
  188.     <meta name="text:Link 5 URL" content="/"/>
  189.     <meta name="text:Link 5" content="link 5"/>
  190.     <meta name="text:Link 6 URL" content="/"/>
  191.     <meta name="text:Link 6" content="link 6"/>
  192.     <meta name="text:Link 7 URL" content="/"/>
  193.     <meta name="text:Link 7" content="link 7"/>
  194.  
  195.     <style type="text/css">
  196.    
  197.     /* general */
  198.    
  199.     .fa-chevron-circle-up,
  200.     .fa-chevron-circle-up:hover,
  201.     a:link, a:visited, a:hover,
  202.     img, img:hover,
  203.     .tmblr-iframe, .tmblr-iframe:hover,
  204.     .like svg path,
  205.     .reblog svg path,
  206.     .like:hover svg path,
  207.     .reblog:hover svg path,
  208.     #audio_player_bg_container,
  209.     #audio_player_container:hover #audio_player_bg_container,
  210.     #icon, #icon:hover {transition-duration: .5s;}
  211.    
  212.     ::-webkit-scrollbar {width:11px; height:11px;}
  213.     ::-webkit-scrollbar-track {border:5px solid {color:Background}; background-color:#eee;}
  214.     ::-webkit-scrollbar-thumb {
  215.         border:5px solid rgba(0, 0, 0, 0);
  216.         background-clip:padding-box;
  217.         background-color:rgba(0, 0, 0, 1);
  218.     }
  219.    
  220.     #s-m-t-tooltip {
  221.         margin:24px 14px 7px 12px;
  222.         padding:5px;
  223.         max-width:300px;
  224.         z-index:999999999999999999;
  225.         text-shadow:none;
  226.         text-transform:uppercase;
  227.         letter-spacing:2px;
  228.         font:bold 7px roboto, calibri, sans-serif;
  229.         background-color:{color:Tooltip BG};
  230.         border:1px solid {color:Tooltip Border};
  231.         color:{color:Tooltip Text};
  232.     }
  233.    
  234.     #scrolltotop {
  235.         position:fixed;
  236.         top:50%;
  237.         right:-70px;
  238.         padding:10px;
  239.         width:40px;
  240.         z-index:99999;
  241.         cursor:pointer;
  242.         text-align:center;
  243.         background-color:{color:Back to Top BG};
  244.         border:1px solid #f3f3f3;
  245.     }
  246.    
  247.     #scrolltotop:hover .fa-chevron-circle-up {color:{color:Back to Top Icon Hover};}
  248.    
  249.     .tmblr-iframe {
  250.         position:fixed;
  251.         top:10px !important;
  252.         right:5px !important;
  253.         {block:IndexPage}{block:ifCustomControls}display:none;{/block:ifCustomControls}{/block:IndexPage}
  254.         {block:ifTopBar}top:100% !important; margin-top:-30px;{/block:ifTopBar}
  255.         opacity:{select:Controls};
  256.         z-index:900000000000000000000;
  257.         -webkit-filter: invert(100%);
  258.             -moz-filter:invert(100%);
  259.              -ms-filter:invert(100%);
  260.               -o-filter:invert(100%);
  261.                  filter:invert(100%);
  262.     }
  263.    
  264.     .tmblr-iframe:hover {opacity:.7;}
  265.  
  266.     ::selection {background-color:{color:Selection BG}; color:{color:Selection Text};}
  267.     ::-moz-selection {background-color:{color:Selection BG}; color:{color:Selection Text};}
  268.  
  269.     body {
  270.         opacity:1;
  271.         transition:.5s opacity;
  272.         overflow-wrap:break-word;  
  273.         word-wrap:break-word;
  274.         font:{select:Body Font Size}px {select:Body Font Family}, calibri, sans-serif;
  275.         color:{color:Text};
  276.         background:{color:Background} url('{image:Background}') repeat fixed center;
  277.     }
  278.    
  279.     body.fade-out {opacity:0; transition:none;}
  280.    
  281.     a {text-decoration:none;}
  282.     a:link, a:visited {color:{color:Link};}
  283.     a:hover {color:{color:Link Hover};}
  284.     a:active {color:{color:Link};}
  285.    
  286.     i, em {color:{color:Italic};}
  287.     b, strong {color:{color:Bold};}
  288.     pre {
  289.         font-family:inherit !important;
  290.         white-space:pre-wrap;      
  291.         white-space:-moz-pre-wrap;  
  292.         white-space:-o-pre-wrap;  
  293.         white-space:-pre-wrap;      
  294.         word-wrap:break-word;      
  295.     }
  296.    
  297.     h6, small, big, sup, sub {font-size:1em;}
  298.     h4, h5, h6 {margin:6px 0;}
  299.     h5 {font-size:1.1em;}
  300.     h4 {font-size:1.2em;}
  301.     h3 {font-size:1.3em;}
  302.     h2 {font-size:1.4em;}
  303.     h1 {font-size:1.5em;}
  304.  
  305.     blockquote {
  306.         margin:0;
  307.         padding:0 10px;
  308.         border-left:1px solid {color:Blockquote Border};
  309.     }
  310.    
  311.     ul {margin:0 0 0 -35px; list-style-type:none;}
  312.     ol {margin-left:-20px;}
  313.     ul li:not(.like):not(.reblog):before {
  314.         content:'—';
  315.         display:inline-block;
  316.         margin-right:5px;
  317.     }
  318.    
  319.     img {max-width:100%; height:auto;}
  320.    
  321.     /* posts */
  322.    
  323.     #posts_container {
  324.         margin:0 auto;
  325.         left:auto;
  326.         right:auto;
  327.         {block:IndexPage}
  328.             width:calc(({text:Post Size}px - 4px + 2 * ({text:Post Padding}px + {text:Post Side Margin}px)) * {text:Number of Columns});
  329.             {block:ifTopBar}margin-top:150px; margin-bottom:40px;{/block:ifTopBar}
  330.             {block:ifBottomBar}margin-top:70px; margin-bottom:100px;{/block:ifBottomBar}
  331.         {/block:IndexPage}
  332.         {block:Permalink}
  333.             width:calc({text:Permalink Post Size}px + {text:Post Padding}px * 2 - 4px);
  334.             {block:ifTopBar}margin-top:150px; margin-bottom:50px;{/block:ifTopBar}
  335.             {block:ifBottomBar}margin-top:70px; margin-bottom:180px;{/block:ifBottomBar}
  336.         {/block:Permalink}
  337.     }
  338.    
  339.     .posts {
  340.         {block:IndexPage}
  341.             margin-bottom:{text:Post Bottom Margin}px;
  342.             margin-left:{text:Post Side Margin}px;
  343.             margin-right:{text:Post Side Margin}px;
  344.             opacity:0;
  345.             z-index:-1;
  346.         {/block:IndexPage}
  347.         position:relative;
  348.         padding:{text:Post Padding}px;
  349.         text-align:justify;
  350.         background-color:{color:Posts BG};
  351.     }
  352.    
  353.     .vertebrae {
  354.         margin:auto;
  355.         overflow:hidden;
  356.         {block:Permalink}width:calc({text:Permalink Post Size}px - 4px);{/block:Permalink}
  357.         {block:IndexPage}width:calc({text:Post Size}px - 4px);{/block:IndexPage}
  358.     }
  359.    
  360.     .photo-slideshow .count-1, .pancake {
  361.         {block:Permalink}width:{text:Permalink Post Size}px;{/block:Permalink}
  362.         {block:IndexPage}width:{text:Post Size}px;{/block:IndexPage}
  363.     }
  364.    
  365.     .photo-slideshow {position:relative;}
  366.     .photo-slideshow .count-3 {max-width:177px; margin-bottom:calc({select:Photoset Gutter}px + 2px);}
  367.     .photo-slideshow .row:last-of-type .count-3 {margin-bottom:0 !important;}
  368.     .photo-slideshow .count-3:last-child {float:right;}
  369.     .photo-slideshow .count-3:nth-child(2) {
  370.         max-width:178px;
  371.         position:absolute;
  372.         left:50%;
  373.         transform: translateX(-50%);
  374.         -webkit-transform: translateX(-50%)
  375.     }
  376.    
  377.     /* photoset lightbox */
  378.    
  379.     .vignette, #vignette {opacity:0;}
  380.    
  381.     .lightbox-image, #tumblr_lightbox img {
  382.         box-shadow:none !important;
  383.         max-width:none;
  384.     }
  385.    
  386.     .tmblr-lightbox, #tumblr_lightbox {
  387.         position:absolute;
  388.         z-index:99999999999999999999999999999 !important;
  389.         background-color:rgba(255,255,255,.9) !important;        
  390.     }
  391.    
  392.     /* caption / text */
  393.        
  394.     .text {padding:3px 10px; color:{color:Text};}
  395.     .text a, #answer a, .notes .action a {display:inline-block; background-color:{color:Link BG};}
  396.     .text a:hover, #answer a:hover, .notes .action a:hover {background-color:{color:Link BG Hover};}
  397.    
  398.     .audio {padding-bottom:10px;}
  399.  
  400.     /* post title */
  401.    
  402.     .text_post_title, h1 {
  403.         margin:1px;
  404.         text-transform:lowercase;
  405.         letter-spacing:1px;
  406.         font-weight:bold;
  407.         font-size:10px;
  408.         background-color:{color:Post Accent};
  409.         border-bottom:1px solid {color:First Letter BG};
  410.         color:{color:Text Post Title};
  411.     }
  412.  
  413.     .text_post_title::first-letter, h1::first-letter {
  414.         margin-right:2px;
  415.         padding:4px 10px 5px 11px;
  416.         vertical-align:baseline;
  417.         line-height:29px;
  418.         font-weight:bold;
  419.         font-size:16px;
  420.         font-family:muli;
  421.         background-color:{color:First Letter BG};
  422.         color:{color:First Letter};
  423.     }
  424.  
  425.     .text_post_title a:link, .text_post_title a:visited {
  426.         color:{color:Text Post Title};
  427.         border-bottom:1px solid transparent;
  428.     }
  429.        
  430.     .text_post_title a:hover {color:{color:Link Hover};}
  431.    
  432.     /* question */
  433.  
  434.     #ask {margin:1px; padding:10px; background-color:{color:Post Accent};}
  435.    
  436.     #ask::first-letter {
  437.         display:block;
  438.         margin-right:6px;
  439.         padding:7px 10px;
  440.         vertical-align:middle;
  441.         text-transform:uppercase;
  442.         font-weight:bold;
  443.         font-size:13px;
  444.         color:{color:First Letter};
  445.         background-color:{color:First Letter BG};
  446.     }
  447.  
  448.     #asker {
  449.         margin-top:7px;
  450.         text-transform:lowercase;
  451.         letter-spacing:1px;
  452.         font-weight:bold;
  453.         font-size:10px;
  454.         border-bottom:1px solid {color:First Letter BG};
  455.         color:{color:Asker};
  456.     }
  457.    
  458.     #asker a:link {color:{color:Asker}; padding-bottom:2px;}
  459.    
  460.     #question {color:{color:Question};}
  461.    
  462.     #answer {padding:0 10px;}
  463.  
  464.     /* quote */
  465.    
  466.     #quote {padding:3px; color:{color:Quote};}
  467.     #quote::first-letter {
  468.         float:left;
  469.         margin-right:4px;
  470.         padding:6px 10px;
  471.         vertical-align:top;
  472.         font-weight:bold;
  473.         font-size:15px;
  474.         color:{color:First Letter};
  475.         background-color:{color:First Letter BG};
  476.     }
  477.    
  478.     #source {
  479.         padding:5px 10px;
  480.         text-align:right;
  481.         text-transform:uppercase;
  482.         font-weight:bold;
  483.         font-size:8px;
  484.         color:{color:Quote Source};
  485.     }
  486.    
  487.     /* chat */
  488.  
  489.     #chat {padding:6px;}
  490.    
  491.     #line #label {color:{color:Chat Label};}
  492.  
  493.     /* audio player */
  494.    
  495.     #audio_player_container {
  496.         margin:1px;
  497.         padding:7px;
  498.         background-color:{color:Post Accent};
  499.     }
  500.    
  501.     #album_art {
  502.         position:absolute;
  503.         width:50px;
  504.         height:50px;
  505.         z-index:1;
  506.         background-color:{color:Updates Tab Accent};
  507.     }
  508.    
  509.     #album_art img {max-width:100%;}
  510.     #album_art, #album_art img {border-radius:{select:Audio Image Shape}px;}
  511.    
  512.     #audio_player_bg_container {
  513.         position:absolute;
  514.         width:48px;
  515.         height:48px;
  516.         margin-top:1px;
  517.         margin-left:1px;
  518.         z-index:9;
  519.         overflow:hidden;
  520.         opacity:0;
  521.         background-color:white;
  522.         border-radius:calc({select:Audio Image Shape}px - 1px);
  523.     }
  524.    
  525.     #audio_player_container:hover #audio_player_bg_container {opacity:1;}
  526.    
  527.     #audio_player_bg {
  528.         margin-top:14px;
  529.         margin-left:-4px;
  530.     }
  531.    
  532.     #track_details_container {
  533.         display:table;
  534.         margin-left:60px;
  535.         padding:0 5px;
  536.         height:50px;
  537.         font-weight:bold;
  538.     }
  539.    
  540.     #track_details {display:table-cell; vertical-align:middle;}
  541.    
  542.     #track_name {
  543.         text-transform:lowercase;
  544.         font-size:14px;
  545.         border-bottom:1px solid {color:Track Border};
  546.         color:{color:Track Info};
  547.     }
  548.    
  549.     #artist_name {
  550.         text-transform:uppercase;
  551.         letter-spacing:1px;
  552.         font-size:7px;
  553.         color:{color:Track Info};
  554.     }
  555.  
  556.     .tumblr_audio_player {
  557.         height:130px;
  558.         width:1000px;
  559.         -moz-transform:scale(0.70, 0.70);
  560.         -webkit-transform:scale(0.70, 0.70);
  561.         -o-transform:scale(0.70, 0.70);
  562.         -ms-transform:scale(0.70, 0.70);
  563.         transform:scale(0.70, 0.70);
  564.         -moz-transform-origin:top left;
  565.         -webkit-transform-origin:top left;
  566.         -o-transform-origin:top left;
  567.         -ms-transform-origin:top left;
  568.         transform-origin:top left;
  569.     }
  570.    
  571.     /* post notes */
  572.  
  573.     .notes {
  574.         {block:Permalink}
  575.             background-color:{color:Posts BG};
  576.             overflow-wrap:break-word;  
  577.             word-wrap:break-word;
  578.         {/block:Permalink}
  579.     }
  580.  
  581.     ol.notes {
  582.         list-style-type:none;
  583.         margin:100px 0 0 0;
  584.         padding:2px;
  585.     }
  586.    
  587.     li.note {
  588.         margin:1px 0;
  589.         padding:10px;
  590.         background-color:{color:Post Accent};
  591.     }
  592.    
  593.     ol.notes img.avatar {display:none;}
  594.    
  595.     #notecontainer .retags {
  596.         margin:2px 0 5px 0;
  597.         font-weight:bold;
  598.         font-size:7px;
  599.         text-transform:uppercase;
  600.         letter-spacing:2px;
  601.     }
  602.    
  603.     #notecontainer .retags.error {color:{color:Italic} !important;}
  604.    
  605.     #notecontainer .retags a:hover {color:{color:Link Hover} !important;}
  606.    
  607.     ol.notes li.note .answer_content {font-style:italic; color:{color:Italic};}
  608.  
  609.     ol.notes li.note blockquote {
  610.         margin:7px 0px 7px 15px;
  611.         padding:0px 10px;
  612.         border-color:{color:Blockquote Border};
  613.     }
  614.    
  615.     /* post info */
  616.  
  617.     #post_info_container {
  618.         float:right;
  619.         {block:Permalink}margin-top:6px;{/block:Permalink}
  620.         padding:5px 3px;
  621.         width:calc(100% - 6px);
  622.         text-transform:uppercase;
  623.         letter-spacing:1px;
  624.         font:bold 6px roboto;
  625.         color:{color:Post Info};
  626.         background-color:{color:Posts BG};
  627.         border-top:1px solid #f7f7f7;
  628.     }
  629.  
  630.     .slide {
  631.         text-align:right;
  632.         {block:IndexPage}{block:ifRevealPostInfoonHover}display:none;{/block:ifRevealPostInfoonHover}{/block:IndexPage}
  633.         {block:Permalink}margin-right:5px;{/block:Permalink}
  634.     }
  635.    
  636.     #date {font-size:105%;}
  637.    
  638.     #notes {font-size:115%;}
  639.  
  640.     #date, #post_source, #tags {{block:Permalink}font-size:115%;{/block:Permalink}}
  641.    
  642.     #date a, #notes a, #post_source a, .fa-retweet {color:{color:Post Info};}
  643.    
  644.     #tags a {color:{color:Tags};}
  645.    
  646.     #date a:hover, #notes a:hover, #post_source a:hover, #tags a:hover, .fa-retweet:hover {color:{color:Post Info Hover};}
  647.  
  648.     #like_reblog {float:right;}
  649.    
  650.     {block:ifNotOldLikeReblogButtons}
  651.     .control {
  652.         display:inline-block;
  653.         position:relative;
  654.         color:{color:Like Reblog Buttons};
  655.     }
  656.    
  657.     .control a {color:{color:Like Reblog Buttons};}
  658.     .control .like_button {font-size:11px;}
  659.     .control .reblog_button {font-size:9px; position:relative ;top:-1px;}
  660.     .control .like_button:hover,
  661.     .control .reblog_button:hover {color:{color:Like Reblog Buttons Hover};}
  662.     .control .like_button::before,
  663.     .control .reblog_button::before {display:block; line-height:1;}
  664.     .like_button.liked {color:{color:Like Button Liked};}
  665.     .like_button.liked:hover {color:{color:Like Button Liked};}
  666.     .like_button iframe {
  667.         display:block;
  668.         position:absolute;
  669.         top:0;
  670.         right:0;
  671.         bottom:0;
  672.         left:0;
  673.         margin:0;
  674.         opacity:0;
  675.     }
  676.     {/block:ifNotOldLikeReblogButtons}
  677.    
  678.    
  679.     {block:ifOldLikeReblogButtons}
  680.     #like_reblog ul {list-style:none;}
  681.     #like_reblog ul li {float:left; margin:0 2px;}
  682.    
  683.     .bone {width:9px; height:9px;}
  684.    
  685.     .like iframe,
  686.     .reblog iframe {
  687.         display:inline-block;
  688.         width:100%;
  689.         height:100%;
  690.     }
  691.    
  692.     .like {position:relative;}
  693.     .like svg path,
  694.     .reblog svg path {fill:{color:Like Reblog Buttons};}
  695.     .like:hover svg path,
  696.     .reblog:hover svg path {fill:{color:Like Reblog Buttons Hover};}
  697.     .like .like_button {
  698.         position:absolute;
  699.         opacity:0;
  700.         top:-71px !important;
  701.     }
  702.  
  703.     .like .like_button.liked {opacity:1;}
  704.     {/block:ifOldLikeReblogButtons}
  705.    
  706.     /*    sidebar    */
  707.    
  708.     #tulpina {
  709.         position:fixed;
  710.         {block:ifTopBar}top:0; height:100px;{/block:ifTopBar}
  711.         {block:ifBottomBar}bottom:0;{/block:ifBottomBar}
  712.         left:0;
  713.         right:0;
  714.         width:100%;
  715.         z-index:99999999;
  716.         color:{color:Navigation Bar Text};
  717.     }
  718.    
  719.     #remove {
  720.         float:right;
  721.         {block:ifTopBar}margin-right:-1px; border-top:none;{/block:ifTopBar}
  722.         {block:ifBottomBar}margin-top:-19px; border-bottom:none;{/block:ifBottomBar}
  723.         z-index:999;
  724.         background-color:{color:Navigation Bar BG};
  725.         border:1px solid {color:Navigation Bar Border};
  726.     }
  727.    
  728.     #sidebar {
  729.         height:85px;
  730.         padding:10px 0 5px 0;
  731.         overflow-y:auto;
  732.         background-color:{color:Navigation Bar BG};
  733.         {block:ifTopBar}border-bottom:1px solid {color:Navigation Bar Border};{block:ifTopBar}
  734.         {block:ifBottomBar}border-top:1px solid {color:Navigation Bar Border};{block:ifBottomBar}
  735.     }
  736.    
  737.     #un, #deux, #trois, #quatre, #cinq, #six {
  738.         display:table;
  739.         float:left;
  740.         height:85px;
  741.     }
  742.    
  743.     #deux, #trois, #quatre, #cinq, #six {text-align:center;}
  744.    
  745.     #deux, #quatre, #cinq, #six {padding:0 2px;}
  746.    
  747.     #deux, #quatre {font-style:italic;}
  748.    
  749.     #un {width:calc(18% - 32px); padding:0px 2px 0px 30px;}
  750.    
  751.     #icon, #title_subtitle, #description, #navigation_links, #description_2, #search, #t_controls {display:table-cell; vertical-align:middle;}
  752.    
  753.     #icon {width:64px; height:64px;}
  754.     #icon:hover {opacity:.7;}
  755.     #icon img {
  756.         max-width:100%;
  757.         max-height:100%;
  758.         border-radius:{select:Nav Bar Icon Shape}px;
  759.     }
  760.    
  761.     #title_subtitle {padding-left:20px;}
  762.    
  763.     #title {
  764.         display:block;
  765.         text-transform:lowercase;
  766.         font-weight:bold;
  767.         font-size:14px;
  768.         word-break:break-all;
  769.         color:{color:Navigation Bar Title};
  770.     }
  771.    
  772.     #subtitle {
  773.         margin-left:-4px;
  774.         text-transform:uppercase;
  775.         word-break:break-all;
  776.         font-size:9px;
  777.         color:{color:Navigation Bar Subtitle};
  778.     }
  779.    
  780.     @media screen and (max-width: 1150px){
  781.         #title_subtitle {display:none;}
  782.         #un {text-align:center;}
  783.     }
  784.    
  785.     #deux {width:calc(17% - 4px);}
  786.    
  787.     #description, #description_2 {font-size:10px;}
  788.    
  789.     #trois {width:30%;}
  790.    
  791.     #links {
  792.         display:block;
  793.         text-transform:uppercase;
  794.         font-weight:bold;
  795.         font-size:{select:Navigation Links Font Size}px;
  796.         letter-spacing:2px;
  797.     }
  798.    
  799.     .links {display:inline-block; padding:5px;}
  800.     .links a {display:inline-block; color:{color:Navigation Bar Links};}
  801.     .links a:after {
  802.         content:'';
  803.         display:block;
  804.         margin-top:3px;
  805.         height:1px;
  806.         width:0;
  807.         background:transparent;
  808.         transition:width 1s ease, background-color 1s ease;
  809.     }
  810.     .links a:hover:after {width:100%; background-color:{color:Navigation Bar Links};}
  811.     .links a:hover {color:{color:Navigation Bar Links};}
  812.    
  813.     #pagination {display:block;}
  814.    
  815.     #prev, #next {display:inline-block;}
  816.     #prev a, #next a {
  817.         width:5px;
  818.         height:5px;
  819.         padding:3px 10px;
  820.     }
  821.    
  822.     #quatre, #cinq {width:calc(15% - 4px);}
  823.  
  824.     #sfm input {
  825.         width:50px;
  826.         padding:4px 2px 0 2px;
  827.         margin-left:3px;
  828.         border:none;
  829.         border-bottom:1px solid #ccc;
  830.         outline:none;
  831.         color:{color:Search Bar Input};
  832.         text-transform:uppercase;
  833.         letter-spacing:2px;
  834.         font-weight:bold;
  835.         font-size:6px;
  836.         background-color:{color:Navigation Bar BG};
  837.     }
  838.    
  839.     #six {width:calc(5% - 4px);}
  840.    
  841.     /*    updates tab    */
  842.    
  843.     #updates_navicon {
  844.         position:fixed;
  845.         {block:ifTopBar}
  846.             {block:ifUpdatesTabLeft}left:20px; bottom:20px;{/block:ifUpdatesTabLeft}
  847.             {block:ifUpdatesTabRight}
  848.                 right:15px; bottom:40px;
  849.                 {block:IndexPage}
  850.                     {block:ifCustomControls}right:20px; bottom:20px;{/block:ifCustomControls}
  851.                 {/block:IndexPage}
  852.             {/block:ifUpdatesTabRight}
  853.         {/block:ifTopBar}
  854.         {block:ifBottomBar}
  855.             {block:ifUpdatesTabLeft}left:20px; top:20px;{/block:ifUpdatesTabLeft}
  856.             {block:ifUpdatesTabRight}
  857.                 right:15px; top:40px;
  858.                 {block:IndexPage}
  859.                     {block:ifCustomControls}right:20px; top:20px;{/block:ifCustomControls}
  860.                 {/block:IndexPage}
  861.             {/block:ifUpdatesTabRight}
  862.         {/block:ifBottomBar}
  863.     }
  864.      
  865.     #updates {
  866.         {block:ifRevealUpdatesTabonclick}display:none;{/block:ifRevealUpdatesTabonclick}
  867.         position:fixed;
  868.         {block:ifTopBar}
  869.             {block:ifUpdatesTabLeft}left:35px; bottom:35px;{/block:ifUpdatesTabLeft}
  870.             {block:ifUpdatesTabRight}
  871.                 right:30px; bottom:55px;
  872.                 {block:IndexPage}
  873.                     {block:ifCustomControls}right:35px; bottom:35px;{/block:ifCustomControls}
  874.                 {/block:IndexPage}
  875.             {/block:ifUpdatesTabRight}
  876.         {/block:ifTopBar}
  877.         {block:ifBottomBar}
  878.             {block:ifUpdatesTabLeft}left:35px; top:35px;{/block:ifUpdatesTabLeft}
  879.             {block:ifUpdatesTabRight}
  880.                 right:30px; top:55px;
  881.                 {block:IndexPage}
  882.                     {block:ifCustomControls}right:35px; top:35px;{/block:ifCustomControls}
  883.                 {/block:IndexPage}
  884.             {/block:ifUpdatesTabRight}
  885.         {/block:ifBottomBar}
  886.         width:180px;
  887.         height:auto;
  888.         padding:5px 8px 5px 5px;
  889.         text-align:justify;
  890.         z-index:99;
  891.         border:1px solid {color:Updates Tab Border};
  892.         background-color:{color:Updates Tab BG};
  893.     }
  894.    
  895.     #updates a {color:{color:Updates Tab Link}; border-bottom:1px solid {color:Updates Tab Link Border};}
  896.     #updates a:hover {color:{color:Link Hover};}
  897.    
  898.     .ui {display:inline-block;}
  899.    
  900.     .updates_icon {text-align:center; display:table;}
  901.  
  902.     @keyframes spin {to{transform:rotateZ(720deg)}}
  903.     .iconwrap:hover > i {animation:spin 3000ms;}
  904.     .iconspin {display:inline-block; transform-origin:50% 50%;}
  905.    
  906.     #updates .fa {
  907.         display:table-cell;
  908.         vertical-align:middle;
  909.         width:10px;
  910.         height:10px;
  911.         padding:8px;
  912.         font-size:10px;
  913.         color:{color:Updates Tab Icons};
  914.         background-color:{color:Updates Tab Accent};
  915.         border-radius:20px;
  916.     }
  917.    
  918.     .updates_title {
  919.         display:inline-block;
  920.         margin-left:-6px;
  921.         margin-top:4px;
  922.         padding-left:8px;
  923.         width:80%;
  924.         vertical-align:top;
  925.         letter-spacing:1px;
  926.         text-transform:lowercase;
  927.         font:bold 13px {select:Updates Tab Title};
  928.         border-bottom:1px solid {color:Updates Tab Accent};
  929.         color:{color:Updates Tab Title};
  930.     }
  931.    
  932.     .updates_title:after, .container_content:last-of-type:after {
  933.         content:'';
  934.         width:6px;
  935.         height:6px;
  936.         background-color:{color:Updates Tab Accent};
  937.         border-radius:20px;
  938.     }
  939.    
  940.     .updates_title:after {
  941.         position:absolute;
  942.         right:0;
  943.         margin:13px 10px 0 0;
  944.     }
  945.    
  946.     .container_content {
  947.         display:block;
  948.         border-left:1px solid {color:Updates Tab Accent};
  949.         margin-left:12px;
  950.         margin-top:-6px;
  951.         padding:0 2px;
  952.     }
  953.    
  954.     .container_content:last-of-type {margin-bottom:-2px;}
  955.     .container_content:last-of-type:after {
  956.         display:block;
  957.         margin-left:-5px;
  958.         margin-top:-9px;
  959.     }
  960.    
  961.     .updates_content {
  962.         padding:8px 2px 10px 7px;
  963.         text-transform:uppercase;
  964.         letter-spacing:1px;
  965.         font-size:8px;
  966.         color:{color:Updates Tab Content};
  967.     }
  968.    
  969.     .fa-chevron-circle-up,
  970.     .fa-chevron-circle-up:hover,
  971.     a:link, a:visited, a:hover,
  972.     .like svg path,
  973.     .reblog svg path,
  974.     .like:hover svg path,
  975.     .reblog:hover svg path,
  976.     #audio_player_bg_container,
  977.     #audio_player_container:hover #audio_player_bg_container,
  978.     #icon, #icon:hover {
  979.         -webkit-transition-duration: .5s;
  980.            -moz-transition-duration: .5s;
  981.              -o-transition-duration: .5s;
  982.                 transition-duration: .5s;
  983.     }
  984.    
  985.     .fa-chevron-circle-up {color:{color:Back to Top Icon}; font-size:12px;}
  986.     .fa-retweet {font-size:8px;}
  987.     .fa-tags {color:{color:Tag Icon}; font-size:9px; vertical-align:middle;}
  988.     .fa-navicon {font-size:10px; color:{color:Updates Tab Navicon};}
  989.     .fa-chevron-down, .fa-chevron-up {padding:4px;}
  990.     .fa-angle-left, .fa-angle-right {color:{color:Navigation Bar Links};}
  991.     .fa-search, .fa-chevron-down, .fa-chevron-up, .fa-home, .fa-code, .fa-plus, .fa-envelope {color:{color:NavBar Controls Icons};}
  992.     .fa-angle-left:hover, .fa-angle-right:hover, .fa-home:hover, .fa-code:hover, .fa-plus:hover, .fa-envelope:hover, .fa-chevron-down:hover {color:{color:NavBar Controls Icons Hover};}
  993.     .fa-angle-left, .fa-angle-right {font-size:13px;}
  994.     .fa-home {font-size:10px;}
  995.     .fa-search, .fa-chevron-down, .fa-chevron-up, .fa-code, .fa-plus, .fa-envelope {font-size:9px;}
  996.     .fa-home, .fa-code, .fa-plus, .fa-envelope {padding:0 2px; display:inline-block;}
  997.     .fa-code {font-weight:bold;}
  998.    
  999.     a.reblog_button {
  1000.         width:9px !important;
  1001.         height:9px !important;
  1002.     }
  1003.  
  1004.     </style>
  1005. </head>
  1006.  
  1007. <body>
  1008.  
  1009. {block:ifFadeInOnRefresh}<script>document.body.className += ' fade-out';</script>{/block:ifFadeInOnRefresh}
  1010.  
  1011. <!--updates tab-->
  1012.  
  1013. {block:ifUpdatesTab}
  1014. <div id="updates_navicon"><i class="fa fa-navicon" aria-hidden="true"></i></div>
  1015. <div id="updates">
  1016.  
  1017.  
  1018.     <!---------------  
  1019.  
  1020.   1. To install a new icon, visit http://fontawesome.io/icons/ and paste the name of your chosen icon over an existing one in the code, e.g. 'bookmark', 'clock-o', etc. I highly suggest choosing icons that have approximately the same width and height, otherwise they will have different background shapes = not pretty.
  1021.  
  1022.   2. To create a new section, copy everything between "<!-- section 1 -- >" and "<!-- end section 1 -- >" and paste it right after "<!-- end section 6 -- >"
  1023.  
  1024.   --------------->
  1025.  
  1026.  
  1027.     <!-- section 1 -->
  1028.     <div class="ui"><div class="updates_icon iconwrap">
  1029.         <i class="fa fa-star-o fa-fw iconspin" aria-hidden="true"></i>
  1030.     </div></div>
  1031.     <div class="updates_title">
  1032.         title 1 <!-- your title here -->
  1033.     </div>
  1034.     <div class="container_content"><div class="updates_content">
  1035.         To edit the Updates Tab, open your HTML Editor, find line 1024 and follow the instructions.
  1036.     </div></div>
  1037.     <!-- end section 1 -->
  1038.    
  1039.    
  1040.     <!--section 2-->
  1041.     <div class="ui"><div class="updates_icon iconwrap">
  1042.         <i class="fa fa-clock-o fa-fw iconspin" aria-hidden="true"></i>
  1043.     </div></div>
  1044.     <div class="updates_title">
  1045.         title 2 <!-- your title here -->
  1046.     </div>
  1047.     <div class="container_content"><div class="updates_content">
  1048.         <!-- you can create lists like so: -->
  1049.         <ul>
  1050.             <li>update 1</li>
  1051.             <li>update 2</li>
  1052.             <li>update 3</li>
  1053.         </ul>
  1054.         <!-- end list -->
  1055.     </div></div>
  1056.    
  1057.    
  1058.     <!--section 3-->
  1059.     <div class="ui"><div class="updates_icon iconwrap">
  1060.         <i class="fa fa-book fa-fw iconspin" aria-hidden="true"></i>
  1061.     </div></div>
  1062.     <div class="updates_title">
  1063.         title 3 <!-- your title here -->
  1064.     </div>
  1065.     <div class="container_content"><div class="updates_content">
  1066.         <!-- you can insert links like so: -->
  1067.         <a href="http://{name}.tumblr.com">link example</a>
  1068.         <!-- end link -->
  1069.     </div></div>
  1070.    
  1071.    
  1072.     <!--section 4-->
  1073.     <div class="ui"><div class="updates_icon iconwrap">
  1074.         <i class="fa fa-gears fa-fw iconspin" aria-hidden="true"></i>
  1075.     </div></div>
  1076.     <div class="updates_title">
  1077.         title 4 <!-- your title here -->
  1078.     </div>
  1079.     <div class="container_content"><div class="updates_content">
  1080.         content 4 <!-- your text here -->
  1081.     </div></div>
  1082.    
  1083.    
  1084.     <!--section 5-->
  1085.     <div class="ui"><div class="updates_icon iconwrap">
  1086.         <i class="fa fa-folder-open fa-fw iconspin" aria-hidden="true"></i>
  1087.     </div></div>
  1088.     <div class="updates_title">
  1089.         title 5 <!-- your title here -->
  1090.     </div>
  1091.     <div class="container_content"><div class="updates_content">
  1092.          content 5 <!-- your text here -->
  1093.     </div></div>
  1094.    
  1095.    
  1096.     <!-- section 6 -->
  1097.     <div class="ui"><div class="updates_icon iconwrap">
  1098.         <i class="fa fa-key fa-fw iconspin" aria-hidden="true"></i>
  1099.     </div></div>
  1100.     <div class="updates_title">
  1101.         title 6 <!-- your title here -->
  1102.     </div>
  1103.     <div class="container_content"><div class="updates_content">
  1104.         content 6 <!-- your text here -->
  1105.     </div></div>
  1106.     <!-- end section 6 -->
  1107.  
  1108.  
  1109. </div>
  1110. {/block:ifUpdatesTab}
  1111.  
  1112. <!-- navigation bar -->
  1113.  
  1114. <div id="tulpina">
  1115.     {block:ifBottomBar}
  1116.     <div id="remove">
  1117.         <i class="fa fa-chevron-down" aria-hidden="true"></i>
  1118.     </div>
  1119.     {/block:ifBottomBar}
  1120.    
  1121.     <div id="sidebar">
  1122.         <div id="un">
  1123.             <div id="icon"><a href="/"><img src="{image:Icon}"></a></div>
  1124.             <div id="title_subtitle">
  1125.                 <div id="title">{Title}</div>
  1126.                 <div id="subtitle">
  1127.                     <span style="font-size:8px;">「&nbsp;</span>{text:Subtitle}<span style="font-size:8px;">&nbsp;」</span>
  1128.                 </div>
  1129.             </div>
  1130.         </div>
  1131.            
  1132.         <div id="deux">
  1133.             <div id="description">{Description}</div>
  1134.         </div>
  1135.        
  1136.         <div id="trois">
  1137.             <div id="navigation_links">
  1138.                 <div id="links">
  1139.                     <div class="links"><a href="{text:Link 1 URL}">{text:Link 1}</a></div>
  1140.                     <div class="links"><a href="{text:Link 2 URL}">{text:Link 2}</a></div>
  1141.                     <div class="links"><a href="{text:Link 3 URL}">{text:Link 3}</a></div>
  1142.                     <div class="links"><a href="{text:Link 4 URL}">{text:Link 4}</a></div>
  1143.                     <div class="links"><a href="{text:Link 5 URL}">{text:Link 5}</a></div>
  1144.                     <div class="links"><a href="{text:Link 6 URL}">{text:Link 6}</a></div>
  1145.                     <div class="links"><a href="{text:Link 7 URL}">{text:Link 7}</a></div>
  1146.                 </div>
  1147.                 {block:IfNotInfiniteScroll}
  1148.                 <div id="pagination">
  1149.                     {block:Pagination}
  1150.                     <div id="prev">{block:PreviousPage}<a href="{PreviousPage}" title="previous page"><i class="fa fa-angle-left" aria-hidden="true"></i></a>{/block:PreviousPage}</div>
  1151.                     <div id="next">{block:NextPage}<a href="{NextPage}" title="next page"><i class="fa fa-angle-right" aria-hidden="true"></i></a>{/block:NextPage}</div>
  1152.                     {/block:Pagination}
  1153.                 </div>
  1154.                 {/block:IfNotInfiniteScroll}
  1155.             </div>
  1156.         </div>
  1157.        
  1158.         <div id="quatre">
  1159.             <div id="description_2">{text:Description2}</div>
  1160.         </div>
  1161.        
  1162.         <div id="cinq">
  1163.             <div id="search">
  1164.                 <script language="javascript">function send(){document.searchf.submit()}</script>
  1165.                 <form action="/search" method="get" id="sfm" name="searchf">
  1166.                     <i class="fa fa-search" aria-hidden="true"></i>
  1167.                     <input type="text" name="q" value=""/>
  1168.                 </form>  
  1169.             </div>
  1170.         </div>
  1171.        
  1172.         <div id="six">
  1173.             <div id="t_controls">
  1174.                 {block:IndexPage}
  1175.                 {block:ifCustomControls}
  1176.                 <a href="http://www.tumblr.com/follow/{Name}" title="follow"><i class="fa fa-plus" aria-hidden="true"></i></a>
  1177.                 <a href="https://www.tumblr.com/dashboard?conversation={Name}" title="message"><i class="fa fa-envelope" aria-hidden="true"></i></a><br/>
  1178.                 <a href="https://www.tumblr.com/dashboard" title="dashboard"><i class="fa fa-home" aria-hidden="true"></i></a>
  1179.                 {/block:ifCustomControls}
  1180.                 {/block:IndexPage}
  1181.                 <a href="http://felinum.tumblr.com" title="theme by felinum"><i class="fa fa-code" aria-hidden="true"></i></a>
  1182.             </div>
  1183.         </div>
  1184.     </div>
  1185.    
  1186.     {block:ifTopBar}
  1187.     <div id="remove">
  1188.         <i class="fa fa-chevron-up" aria-hidden="true"></i>
  1189.     </div>
  1190.     {/block:ifTopBar}
  1191. </div>
  1192.  
  1193. <!-- posts container -->
  1194.      
  1195. <div id="posts_container">
  1196.  
  1197.     {block:Posts}
  1198.     <div class="posts" id="{PostID}">
  1199.    
  1200.     <div class="vertebrae">
  1201.         {block:Text}
  1202.             {block:Title}<div class="text_post_title"><a href="{Permalink}">{Title}</a></div>{/block:Title}
  1203.             <div class="text">{Body}</div>
  1204.            
  1205.             <!-- post info -->
  1206.  
  1207.             {block:Date}
  1208.                 <div id="post_info_container">
  1209.                     <div class="slide">
  1210.                         <div id="date">
  1211.                             {block:IndexPage}<a href="{Permalink}" title="{DayOfMonthWithZero}&nbsp;{ShortMonth}&nbsp;{ShortYear} / {12HourWithZero}:{Minutes}{AmPm}">{TimeAgo}</a>{/block:IndexPage}
  1212.                             {block:Permalink}Posted on {Month} {DayofMonth}{DayofMonthSuffix} {Year}, {24HourWithZero}:{Minutes}:{Seconds} - {TimeAgo}{/block:Permalink}
  1213.                         </div>
  1214.    
  1215.                         <div id="notes">
  1216.                             <a href="{Permalink}">{block:NoteCount}+&nbsp;{NoteCount}&nbsp;N{/block:NoteCount}</a>
  1217.                         </div>
  1218.  
  1219.                         <div id="post_source">
  1220.                             {block:RebloggedFrom}
  1221.                                 <a href="{ReblogRootURL}" title="{ReblogRootTitle}">©:&nbsp;{ReblogRootName}</a>
  1222.                                 {block:Permalink}&nbsp;&nbsp;<a href="{ReblogParentURL}" title="{ReblogParentTitle}"><i class="fa fa-retweet" aria-hidden="true"></i>{ReblogParentName}</a>{/block:Permalink}
  1223.                             {/block:RebloggedFrom}
  1224.                         </div>
  1225.        
  1226.                         <div id="tags_box">
  1227.                             {block:HasTags}
  1228.                                 <div id="tags">{block:Tags}&nbsp;<a href="{TagURL}"><i class="fa fa-tags" aria-hidden="true"></i>{Tag}</a>{/block:Tags}</div>
  1229.                             {/block:HasTags}
  1230.                         </div>
  1231.                     </div>
  1232.                
  1233.                     {block:IndexPage}
  1234.                         <div id="like_reblog">
  1235.                             {block:ifNotOldLikeReblogButtons}
  1236.                             <div class="control reblog-control">{ReblogButton size="10" color="black"}</div>
  1237.                             <div class="control like-control">{LikeButton size="10" color="black"}</div>
  1238.                             {/block:ifNotOldLikeReblogButtons}
  1239.                             {block:ifOldLikeReblogButtons}
  1240.                             <ul>    
  1241.                                 <span class="bone"><li class="reblog">{ReblogButton size="8"}</li></span>
  1242.                                 <span class="bone">
  1243.                                     <li class="like"><svg width="8" height="8" viewBox="0 0 19 16" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="#000000"><path d="M14.0425097,0.000920262799 C16.1435097,-0.0400797372 18.8835097,1.28192026 18.9635097,5.36992026 C19.0525097,9.95492026 15.1985097,13.3079203 9.48350967,16.2089203 C3.76650967,13.3079203 -0.0874903349,9.95492026 0.00150966509,5.36992026 C0.0815096651,1.28192026 2.82150967,-0.0400797372 4.92250967,0.000920262799 C7.02450967,0.0419202628 8.87050967,2.26592026 9.46950967,2.92792026 C10.0945097,2.26592026 11.9405097,0.0419202628 14.0425097,0.000920262799 Z"></path></svg>{LikeButton size="10"}</li>
  1244.                                 </span>
  1245.                             </ul>
  1246.                             {/block:ifOldLikeReblogButtons}
  1247.                         </div>  
  1248.                     {/block:IndexPage}
  1249.                 </div>
  1250.             {/block:Date}
  1251.        
  1252.             <!-- post info -->
  1253.            
  1254.         {/block:Text}
  1255.     </div>
  1256.    
  1257.  
  1258.     <div class="vertebrae">
  1259.         {block:Link}
  1260.             <div class="text_post_title"><a href="{URL}">{Name}</a></div>
  1261.             {block:Description}<div class="text">{Description}</div>{/block:Description}
  1262.        
  1263.             <!-- post info -->
  1264.  
  1265.             {block:Date}
  1266.                 <div id="post_info_container">
  1267.                     <div class="slide">
  1268.                         <div id="date">
  1269.                             {block:IndexPage}<a href="{Permalink}" title="{DayOfMonthWithZero}&nbsp;{ShortMonth}&nbsp;{ShortYear} / {12HourWithZero}:{Minutes}{AmPm}">{TimeAgo}</a>{/block:IndexPage}                                                        {block:Permalink}Posted on {Month} {DayofMonth}{DayofMonthSuffix} {Year}, {24HourWithZero}:{Minutes}:{Seconds} - {TimeAgo}{/block:Permalink}
  1270.                         </div>
  1271.    
  1272.                         <div id="notes">
  1273.                             <a href="{Permalink}">{block:NoteCount}+&nbsp;{NoteCount}&nbsp;N{/block:NoteCount}</a>
  1274.                         </div>
  1275.  
  1276.                         <div id="post_source">
  1277.                             {block:RebloggedFrom}
  1278.                                 <a href="{ReblogRootURL}" title="{ReblogRootTitle}">©:&nbsp;{ReblogRootName}</a>                                
  1279.                                 {block:Permalink}&nbsp;&nbsp;<a href="{ReblogParentURL}" title="{ReblogParentTitle}"><i class="fa fa-retweet" aria-hidden="true"></i>{ReblogParentName}</a>{/block:Permalink}
  1280.                             {/block:RebloggedFrom}
  1281.                         </div>
  1282.        
  1283.                         <div id="tags_box">
  1284.                             {block:HasTags}
  1285.                                 <div id="tags">{block:Tags}&nbsp;<a href="{TagURL}"><i class="fa fa-tags" aria-hidden="true"></i>{Tag}</a>{/block:Tags}</div>
  1286.                             {/block:HasTags}
  1287.                         </div>
  1288.                     </div>
  1289.                
  1290.                     {block:IndexPage}
  1291.                         <div id="like_reblog">
  1292.                             {block:ifNotOldLikeReblogButtons}
  1293.                             <div class="control reblog-control">{ReblogButton size="10" color="black"}</div>
  1294.                             <div class="control like-control">{LikeButton size="10" color="black"}</div>
  1295.                             {/block:ifNotOldLikeReblogButtons}
  1296.                             {block:ifOldLikeReblogButtons}
  1297.                             <ul>    
  1298.                                 <span class="bone"><li class="reblog">{ReblogButton size="8"}</li></span>
  1299.                                 <span class="bone">
  1300.                                     <li class="like"><svg width="8" height="8" viewBox="0 0 19 16" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="#000000"><path d="M14.0425097,0.000920262799 C16.1435097,-0.0400797372 18.8835097,1.28192026 18.9635097,5.36992026 C19.0525097,9.95492026 15.1985097,13.3079203 9.48350967,16.2089203 C3.76650967,13.3079203 -0.0874903349,9.95492026 0.00150966509,5.36992026 C0.0815096651,1.28192026 2.82150967,-0.0400797372 4.92250967,0.000920262799 C7.02450967,0.0419202628 8.87050967,2.26592026 9.46950967,2.92792026 C10.0945097,2.26592026 11.9405097,0.0419202628 14.0425097,0.000920262799 Z"></path></svg>{LikeButton size="10"}</li>
  1301.                                 </span>
  1302.                             </ul>
  1303.                             {/block:ifOldLikeReblogButtons}
  1304.                         </div>  
  1305.                     {/block:IndexPage}
  1306.                 </div>
  1307.             {/block:Date}
  1308.        
  1309.             <!-- post info -->
  1310.        
  1311.         {/block:Link}
  1312.     </div>
  1313.  
  1314.  
  1315.     <div class="vertebrae">
  1316.         {block:Quote}
  1317.             <div id="quote">{Quote}</div>
  1318.             {block:Source}<div id="source">&mdash;&nbsp;{Source}</div>{/block:Source}
  1319.        
  1320.             <!-- post info -->
  1321.  
  1322.             {block:Date}
  1323.                 <div id="post_info_container">
  1324.                     <div class="slide">
  1325.                         <div id="date">
  1326.                             {block:IndexPage}<a href="{Permalink}" title="{DayOfMonthWithZero}&nbsp;{ShortMonth}&nbsp;{ShortYear} / {12HourWithZero}:{Minutes}{AmPm}">{TimeAgo}</a>{/block:IndexPage}                                                        {block:Permalink}Posted on {Month} {DayofMonth}{DayofMonthSuffix} {Year}, {24HourWithZero}:{Minutes}:{Seconds} - {TimeAgo}{/block:Permalink}
  1327.                         </div>
  1328.    
  1329.                         <div id="notes">
  1330.                             <a href="{Permalink}">{block:NoteCount}+&nbsp;{NoteCount}&nbsp;N{/block:NoteCount}</a>
  1331.                         </div>
  1332.  
  1333.                         <div id="post_source">
  1334.                             {block:RebloggedFrom}
  1335.                                 <a href="{ReblogRootURL}" title="{ReblogRootTitle}">©:&nbsp;{ReblogRootName}</a>                                
  1336.                                 {block:Permalink}&nbsp;&nbsp;<a href="{ReblogParentURL}" title="{ReblogParentTitle}"><i class="fa fa-retweet" aria-hidden="true"></i>{ReblogParentName}</a>{/block:Permalink}
  1337.                             {/block:RebloggedFrom}
  1338.                         </div>
  1339.        
  1340.                         <div id="tags_box">
  1341.                             {block:HasTags}
  1342.                                 <div id="tags">{block:Tags}&nbsp;<a href="{TagURL}"><i class="fa fa-tags" aria-hidden="true"></i>{Tag}</a>{/block:Tags}</div>
  1343.                             {/block:HasTags}
  1344.                         </div>
  1345.                     </div>
  1346.                
  1347.                     {block:IndexPage}
  1348.                         <div id="like_reblog">
  1349.                             {block:ifNotOldLikeReblogButtons}
  1350.                             <div class="control reblog-control">{ReblogButton size="10" color="black"}</div>
  1351.                             <div class="control like-control">{LikeButton size="10" color="black"}</div>
  1352.                             {/block:ifNotOldLikeReblogButtons}
  1353.                             {block:ifOldLikeReblogButtons}
  1354.                             <ul>    
  1355.                                 <span class="bone"><li class="reblog">{ReblogButton size="8"}</li></span>
  1356.                                 <span class="bone">
  1357.                                     <li class="like"><svg width="8" height="8" viewBox="0 0 19 16" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="#000000"><path d="M14.0425097,0.000920262799 C16.1435097,-0.0400797372 18.8835097,1.28192026 18.9635097,5.36992026 C19.0525097,9.95492026 15.1985097,13.3079203 9.48350967,16.2089203 C3.76650967,13.3079203 -0.0874903349,9.95492026 0.00150966509,5.36992026 C0.0815096651,1.28192026 2.82150967,-0.0400797372 4.92250967,0.000920262799 C7.02450967,0.0419202628 8.87050967,2.26592026 9.46950967,2.92792026 C10.0945097,2.26592026 11.9405097,0.0419202628 14.0425097,0.000920262799 Z"></path></svg>{LikeButton size="10"}</li>
  1358.                                 </span>
  1359.                             </ul>
  1360.                             {/block:ifOldLikeReblogButtons}
  1361.                         </div>  
  1362.                     {/block:IndexPage}
  1363.                 </div>
  1364.             {/block:Date}
  1365.        
  1366.             <!-- post info -->
  1367.        
  1368.         {/block:Quote}
  1369.     </div>
  1370.  
  1371.  
  1372.     <div class="vertebrae">
  1373.         {block:Chat}
  1374.             {block:Title}<div class="text_post_title">{Title}</div>{/block:Title}
  1375.             <div id="chat">
  1376.                 <ul>
  1377.                     {block:Lines}<li id="line">{block:Label}<span id="label">{Label}</span>{/block:Label}&nbsp;{Line}</li>{/block:Lines}
  1378.                 </ul>
  1379.             </div>
  1380.             <!-- post info -->
  1381.  
  1382.             {block:Date}
  1383.                 <div id="post_info_container">
  1384.                     <div class="slide">
  1385.                         <div id="date">
  1386.                             {block:IndexPage}<a href="{Permalink}" title="{DayOfMonthWithZero}&nbsp;{ShortMonth}&nbsp;{ShortYear} / {12HourWithZero}:{Minutes}{AmPm}">{TimeAgo}</a>{/block:IndexPage}                                                        {block:Permalink}Posted on {Month} {DayofMonth}{DayofMonthSuffix} {Year}, {24HourWithZero}:{Minutes}:{Seconds} - {TimeAgo}{/block:Permalink}
  1387.                         </div>
  1388.    
  1389.                         <div id="notes">
  1390.                             <a href="{Permalink}">{block:NoteCount}+&nbsp;{NoteCount}&nbsp;N{/block:NoteCount}</a>
  1391.                         </div>
  1392.  
  1393.                         <div id="post_source">
  1394.                             {block:RebloggedFrom}
  1395.                                 <a href="{ReblogRootURL}" title="{ReblogRootTitle}">©:&nbsp;{ReblogRootName}</a>                                
  1396.                                 {block:Permalink}&nbsp;&nbsp; <a href="{ReblogParentURL}" title="{ReblogParentTitle}"><i class="fa fa-retweet" aria-hidden="true"></i>{ReblogParentName}</a>{/block:Permalink}
  1397.                             {/block:RebloggedFrom}
  1398.                         </div>
  1399.        
  1400.                         <div id="tags_box">
  1401.                             {block:HasTags}
  1402.                                 <div id="tags">{block:Tags}&nbsp;<a href="{TagURL}"><i class="fa fa-tags" aria-hidden="true"></i>{Tag}</a>{/block:Tags}</div>
  1403.                             {/block:HasTags}
  1404.                         </div>
  1405.                     </div>
  1406.                
  1407.                     {block:IndexPage}
  1408.                         <div id="like_reblog">
  1409.                             {block:ifNotOldLikeReblogButtons}
  1410.                             <div class="control reblog-control">{ReblogButton size="10" color="black"}</div>
  1411.                             <div class="control like-control">{LikeButton size="10" color="black"}</div>
  1412.                             {/block:ifNotOldLikeReblogButtons}
  1413.                             {block:ifOldLikeReblogButtons}
  1414.                             <ul>    
  1415.                                 <span class="bone"><li class="reblog">{ReblogButton size="8"}</li></span>
  1416.                                 <span class="bone">
  1417.                                     <li class="like"><svg width="8" height="8" viewBox="0 0 19 16" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="#000000"><path d="M14.0425097,0.000920262799 C16.1435097,-0.0400797372 18.8835097,1.28192026 18.9635097,5.36992026 C19.0525097,9.95492026 15.1985097,13.3079203 9.48350967,16.2089203 C3.76650967,13.3079203 -0.0874903349,9.95492026 0.00150966509,5.36992026 C0.0815096651,1.28192026 2.82150967,-0.0400797372 4.92250967,0.000920262799 C7.02450967,0.0419202628 8.87050967,2.26592026 9.46950967,2.92792026 C10.0945097,2.26592026 11.9405097,0.0419202628 14.0425097,0.000920262799 Z"></path></svg>{LikeButton size="10"}</li>
  1418.                                 </span>
  1419.                             </ul>
  1420.                             {/block:ifOldLikeReblogButtons}
  1421.                         </div>  
  1422.                     {/block:IndexPage}
  1423.                 </div>
  1424.             {/block:Date}
  1425.        
  1426.             <!-- post info -->
  1427.        
  1428.         {/block:Chat}
  1429.     </div>
  1430.  
  1431.  
  1432.     <div class="vertebrae">
  1433.         {block:Answer}
  1434.             <div id="ask">
  1435.                 <div id="asker">q{Asker}:</div><br />
  1436.                 <div id="question">{Question}</div>
  1437.             </div>
  1438.             <div id="answer">{Answer}</div>
  1439.        
  1440.             <!-- post info -->
  1441.  
  1442.             {block:Date}
  1443.                 <div id="post_info_container">
  1444.                     <div class="slide">
  1445.                         <div id="date">
  1446.                             {block:IndexPage}<a href="{Permalink}" title="{DayOfMonthWithZero}&nbsp;{ShortMonth}&nbsp;{ShortYear} / {12HourWithZero}:{Minutes}{AmPm}">{TimeAgo}</a>{/block:IndexPage}                                                        {block:Permalink}Posted on {Month} {DayofMonth}{DayofMonthSuffix} {Year}, {24HourWithZero}:{Minutes}:{Seconds} - {TimeAgo}{/block:Permalink}
  1447.                         </div>
  1448.    
  1449.                         <div id="notes">
  1450.                             <a href="{Permalink}">{block:NoteCount}+&nbsp;{NoteCount}&nbsp;N{/block:NoteCount}</a>
  1451.                         </div>
  1452.  
  1453.                         <div id="post_source">
  1454.                             {block:RebloggedFrom}
  1455.                                 <a href="{ReblogRootURL}" title="{ReblogRootTitle}">©:&nbsp;{ReblogRootName}</a>                                
  1456.                                 {block:Permalink}&nbsp;&nbsp;<a href="{ReblogParentURL}" title="{ReblogParentTitle}"><i class="fa fa-retweet" aria-hidden="true"></i>{ReblogParentName}</a>{/block:Permalink}
  1457.                             {/block:RebloggedFrom}
  1458.                         </div>
  1459.        
  1460.                         <div id="tags_box">
  1461.                             {block:HasTags}
  1462.                                 <div id="tags">{block:Tags}&nbsp;<a href="{TagURL}"><i class="fa fa-tags" aria-hidden="true"></i>{Tag}</a>{/block:Tags}</div>
  1463.                             {/block:HasTags}
  1464.                         </div>
  1465.                     </div>
  1466.                
  1467.                     {block:IndexPage}
  1468.                         <div id="like_reblog">
  1469.                             {block:ifNotOldLikeReblogButtons}
  1470.                             <div class="control reblog-control">{ReblogButton size="10" color="black"}</div>
  1471.                             <div class="control like-control">{LikeButton size="10" color="black"}</div>
  1472.                             {/block:ifNotOldLikeReblogButtons}
  1473.                             {block:ifOldLikeReblogButtons}
  1474.                             <ul>    
  1475.                                 <span class="bone"><li class="reblog">{ReblogButton size="8"}</li></span>
  1476.                                 <span class="bone">
  1477.                                     <li class="like"><svg width="8" height="8" viewBox="0 0 19 16" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="#000000"><path d="M14.0425097,0.000920262799 C16.1435097,-0.0400797372 18.8835097,1.28192026 18.9635097,5.36992026 C19.0525097,9.95492026 15.1985097,13.3079203 9.48350967,16.2089203 C3.76650967,13.3079203 -0.0874903349,9.95492026 0.00150966509,5.36992026 C0.0815096651,1.28192026 2.82150967,-0.0400797372 4.92250967,0.000920262799 C7.02450967,0.0419202628 8.87050967,2.26592026 9.46950967,2.92792026 C10.0945097,2.26592026 11.9405097,0.0419202628 14.0425097,0.000920262799 Z"></path></svg>{LikeButton size="10"}</li>
  1478.                                 </span>
  1479.                             </ul>
  1480.                             {/block:ifOldLikeReblogButtons}
  1481.                         </div>  
  1482.                     {/block:IndexPage}
  1483.                 </div>
  1484.             {/block:Date}
  1485.        
  1486.             <!-- post info -->
  1487.        
  1488.         {/block:Answer}
  1489.     </div>
  1490.    
  1491.  
  1492.     <div class="vertebrae">
  1493.         {block:AudioPlayer}
  1494.             <div id="audio_player_container">
  1495.                 <div id="album_art">{block:AlbumArt}<img src="{AlbumArtURL}">{/block:AlbumArt}</div>
  1496.                 <div id="audio_player_bg_container"><div id="audio_player_bg">{AudioPlayer}</div></div>
  1497.                 <div id="track_details_container">
  1498.                     <div id="track_details">
  1499.                         {block:TrackName}<span id="track_name">{TrackName}</span>{/block:TrackName}<br />
  1500.                         {block:Artist}<span id="artist_name">{Artist}</span>{/block:Artist}<br />
  1501.                     </div>
  1502.                 </div>
  1503.             </div>
  1504.             {block:ifShowCaption}
  1505.                 {block:Caption}<div class="text audio">{Caption}</div>{/block:Caption}
  1506.             {/block:ifShowCaption}
  1507.        
  1508.             <!-- post info -->
  1509.  
  1510.             {block:Date}
  1511.                 <div id="post_info_container">
  1512.                     <div class="slide">
  1513.                         <div id="date">
  1514.                             {block:IndexPage}<a href="{Permalink}" title="{DayOfMonthWithZero}&nbsp;{ShortMonth}&nbsp;{ShortYear} / {12HourWithZero}:{Minutes}{AmPm}">{TimeAgo}</a>{/block:IndexPage}                                                        {block:Permalink}Posted on {Month} {DayofMonth}{DayofMonthSuffix} {Year}, {24HourWithZero}:{Minutes}:{Seconds} - {TimeAgo}{/block:Permalink}
  1515.                         </div>
  1516.    
  1517.                         <div id="notes">
  1518.                             <a href="{Permalink}">{block:NoteCount}+&nbsp;{NoteCount}&nbsp;N{/block:NoteCount}</a>
  1519.                         </div>
  1520.  
  1521.                         <div id="post_source">
  1522.                             {block:RebloggedFrom}
  1523.                                 <a href="{ReblogRootURL}" title="{ReblogRootTitle}">©:&nbsp;{ReblogRootName}</a>                                
  1524.                                 {block:Permalink}&nbsp;&nbsp;<a href="{ReblogParentURL}" title="{ReblogParentTitle}"><i class="fa fa-retweet" aria-hidden="true"></i>{ReblogParentName}</a>{/block:Permalink}
  1525.                             {/block:RebloggedFrom}
  1526.                         </div>
  1527.        
  1528.                         <div id="tags_box">
  1529.                             {block:HasTags}
  1530.                                 <div id="tags">{block:Tags}&nbsp;<a href="{TagURL}"><i class="fa fa-tags" aria-hidden="true"></i>{Tag}</a>{/block:Tags}</div>
  1531.                             {/block:HasTags}
  1532.                         </div>
  1533.                     </div>
  1534.                
  1535.                     {block:IndexPage}
  1536.                         <div id="like_reblog">
  1537.                             {block:ifNotOldLikeReblogButtons}
  1538.                             <div class="control reblog-control">{ReblogButton size="10" color="black"}</div>
  1539.                             <div class="control like-control">{LikeButton size="10" color="black"}</div>
  1540.                             {/block:ifNotOldLikeReblogButtons}
  1541.                             {block:ifOldLikeReblogButtons}
  1542.                             <ul>    
  1543.                                 <span class="bone"><li class="reblog">{ReblogButton size="8"}</li></span>
  1544.                                 <span class="bone">
  1545.                                     <li class="like"><svg width="8" height="8" viewBox="0 0 19 16" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="#000000"><path d="M14.0425097,0.000920262799 C16.1435097,-0.0400797372 18.8835097,1.28192026 18.9635097,5.36992026 C19.0525097,9.95492026 15.1985097,13.3079203 9.48350967,16.2089203 C3.76650967,13.3079203 -0.0874903349,9.95492026 0.00150966509,5.36992026 C0.0815096651,1.28192026 2.82150967,-0.0400797372 4.92250967,0.000920262799 C7.02450967,0.0419202628 8.87050967,2.26592026 9.46950967,2.92792026 C10.0945097,2.26592026 11.9405097,0.0419202628 14.0425097,0.000920262799 Z"></path></svg>{LikeButton size="10"}</li>
  1546.                                 </span>
  1547.                             </ul>
  1548.                             {/block:ifOldLikeReblogButtons}
  1549.                         </div>  
  1550.                     {/block:IndexPage}
  1551.                 </div>
  1552.             {/block:Date}
  1553.        
  1554.             <!-- post info -->
  1555.        
  1556.         {/block:AudioPlayer}
  1557.     </div>
  1558.    
  1559.  
  1560.     <div class="vertebrae">
  1561.         <div class="pancake">
  1562.         {block:Photo}
  1563.             {LinkOpenTag}
  1564.                 <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"><img src="{PhotoURL-HighRes}" alt="{PhotoAlt}" width="540"></a>
  1565.             {LinkCloseTag}
  1566.             {block:ifShowCaption}
  1567.                 {block:Caption}<div class="text">{Caption}</div>{/block:Caption}
  1568.             {/block:ifShowCaption}
  1569.        
  1570.             <!-- post info -->
  1571.  
  1572.             {block:Date}
  1573.                 <div id="post_info_container">
  1574.                     <div class="slide">
  1575.                         <div id="date">
  1576.                             {block:IndexPage}<a href="{Permalink}" title="{DayOfMonthWithZero}&nbsp;{ShortMonth}&nbsp;{ShortYear} / {12HourWithZero}:{Minutes}{AmPm}">{TimeAgo}</a>{/block:IndexPage}                                                        {block:Permalink}Posted on {Month} {DayofMonth}{DayofMonthSuffix} {Year}, {24HourWithZero}:{Minutes}:{Seconds} - {TimeAgo}{/block:Permalink}
  1577.                         </div>
  1578.    
  1579.                         <div id="notes">
  1580.                             <a href="{Permalink}">{block:NoteCount}+&nbsp;{NoteCount}&nbsp;N{/block:NoteCount}</a>
  1581.                         </div>
  1582.  
  1583.                         <div id="post_source">
  1584.                             {block:RebloggedFrom}
  1585.                                 <a href="{ReblogRootURL}" title="{ReblogRootTitle}">©:&nbsp;{ReblogRootName}</a>                                
  1586.                                 {block:Permalink}&nbsp;&nbsp;<a href="{ReblogParentURL}" title="{ReblogParentTitle}"><i class="fa fa-retweet" aria-hidden="true"></i>{ReblogParentName}</a>{/block:Permalink}
  1587.                             {/block:RebloggedFrom}
  1588.                         </div>
  1589.        
  1590.                         <div id="tags_box">
  1591.                             {block:HasTags}
  1592.                                 <div id="tags">{block:Tags}&nbsp;<a href="{TagURL}"><i class="fa fa-tags" aria-hidden="true"></i>{Tag}</a>{/block:Tags}</div>
  1593.                             {/block:HasTags}
  1594.                         </div>
  1595.                     </div>
  1596.                
  1597.                     {block:IndexPage}
  1598.                         <div id="like_reblog">
  1599.                             {block:ifNotOldLikeReblogButtons}
  1600.                             <div class="control reblog-control">{ReblogButton size="10" color="black"}</div>
  1601.                             <div class="control like-control">{LikeButton size="10" color="black"}</div>
  1602.                             {/block:ifNotOldLikeReblogButtons}
  1603.                             {block:ifOldLikeReblogButtons}
  1604.                             <ul>    
  1605.                                 <span class="bone"><li class="reblog">{ReblogButton size="8"}</li></span>
  1606.                                 <span class="bone">
  1607.                                     <li class="like"><svg width="8" height="8" viewBox="0 0 19 16" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="#000000"><path d="M14.0425097,0.000920262799 C16.1435097,-0.0400797372 18.8835097,1.28192026 18.9635097,5.36992026 C19.0525097,9.95492026 15.1985097,13.3079203 9.48350967,16.2089203 C3.76650967,13.3079203 -0.0874903349,9.95492026 0.00150966509,5.36992026 C0.0815096651,1.28192026 2.82150967,-0.0400797372 4.92250967,0.000920262799 C7.02450967,0.0419202628 8.87050967,2.26592026 9.46950967,2.92792026 C10.0945097,2.26592026 11.9405097,0.0419202628 14.0425097,0.000920262799 Z"></path></svg>{LikeButton size="10"}</li>
  1608.                                 </span>
  1609.                             </ul>
  1610.                             {/block:ifOldLikeReblogButtons}
  1611.                         </div>  
  1612.                     {/block:IndexPage}
  1613.                 </div>
  1614.             {/block:Date}
  1615.        
  1616.             <!-- post info -->
  1617.        
  1618.         {/block:Photo}
  1619.         </div>
  1620.     </div>
  1621.    
  1622.    
  1623.     <div class="vertebrae">
  1624.         {block:Photoset}
  1625.             <div class="photo-slideshow" id="photoset_{PostID}" data-layout="{PhotosetLayout}">
  1626.                 {block:Photos}
  1627.                     <div class="photo-data">
  1628.                         <div class="pxu-photo">
  1629.                             <img src="{PhotoURL-500}"  width="{PhotoWidth-500}" height="{PhotoHeight-500}" data-highres="{PhotoURL-HighRes}" data-width="{PhotoWidth-HighRes}" data-height="{PhotoHeight-HighRes}">
  1630.                         </div>
  1631.                         <a class="tumblr-box" rel="post-{PostID}" href="{PhotoURL-HighRes}"></a>
  1632.                     </div>
  1633.                 {/block:Photos}
  1634.             </div>
  1635.             {block:ifShowCaption}
  1636.                 {block:Caption}<div class="text">{Caption}</div>{/block:Caption}
  1637.             {/block:ifShowCaption}
  1638.  
  1639.             <!-- post info -->
  1640.  
  1641.             {block:Date}
  1642.                 <div id="post_info_container">
  1643.                     <div class="slide">
  1644.                         <div id="date">
  1645.                             {block:IndexPage}<a href="{Permalink}" title="{DayOfMonthWithZero}&nbsp;{ShortMonth}&nbsp;{ShortYear} / {12HourWithZero}:{Minutes}{AmPm}">{TimeAgo}</a>{/block:IndexPage}                                                        {block:Permalink}Posted on {Month} {DayofMonth}{DayofMonthSuffix} {Year}, {24HourWithZero}:{Minutes}:{Seconds} - {TimeAgo}{/block:Permalink}
  1646.                         </div>
  1647.    
  1648.                         <div id="notes">
  1649.                             <a href="{Permalink}">{block:NoteCount}+&nbsp;{NoteCount}&nbsp;N{/block:NoteCount}</a>
  1650.                         </div>
  1651.  
  1652.                         <div id="post_source">
  1653.                             {block:RebloggedFrom}
  1654.                                 <a href="{ReblogRootURL}" title="{ReblogRootTitle}">©:&nbsp;{ReblogRootName}</a>                                
  1655.                                 {block:Permalink}&nbsp;&nbsp;<a href="{ReblogParentURL}" title="{ReblogParentTitle}"><i class="fa fa-retweet" aria-hidden="true"></i>{ReblogParentName}</a>{/block:Permalink}
  1656.                             {/block:RebloggedFrom}
  1657.                         </div>
  1658.        
  1659.                         <div id="tags_box">
  1660.                             {block:HasTags}
  1661.                                 <div id="tags">{block:Tags}&nbsp;<a href="{TagURL}"><i class="fa fa-tags" aria-hidden="true"></i>{Tag}</a>{/block:Tags}</div>
  1662.                             {/block:HasTags}
  1663.                         </div>
  1664.                     </div>
  1665.                
  1666.                     {block:IndexPage}
  1667.                         <div id="like_reblog">
  1668.                             {block:ifNotOldLikeReblogButtons}
  1669.                             <div class="control reblog-control">{ReblogButton size="10" color="black"}</div>
  1670.                             <div class="control like-control">{LikeButton size="10" color="black"}</div>
  1671.                             {/block:ifNotOldLikeReblogButtons}
  1672.                             {block:ifOldLikeReblogButtons}
  1673.                             <ul>    
  1674.                                 <span class="bone"><li class="reblog">{ReblogButton size="8"}</li></span>
  1675.                                 <span class="bone">
  1676.                                     <li class="like"><svg width="8" height="8" viewBox="0 0 19 16" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="#000000"><path d="M14.0425097,0.000920262799 C16.1435097,-0.0400797372 18.8835097,1.28192026 18.9635097,5.36992026 C19.0525097,9.95492026 15.1985097,13.3079203 9.48350967,16.2089203 C3.76650967,13.3079203 -0.0874903349,9.95492026 0.00150966509,5.36992026 C0.0815096651,1.28192026 2.82150967,-0.0400797372 4.92250967,0.000920262799 C7.02450967,0.0419202628 8.87050967,2.26592026 9.46950967,2.92792026 C10.0945097,2.26592026 11.9405097,0.0419202628 14.0425097,0.000920262799 Z"></path></svg>{LikeButton size="10"}</li>
  1677.                                 </span>
  1678.                             </ul>
  1679.                             {/block:ifOldLikeReblogButtons}
  1680.                         </div>  
  1681.                     {/block:IndexPage}
  1682.                 </div>
  1683.             {/block:Date}
  1684.        
  1685.             <!-- post info -->
  1686.        
  1687.         {/block:Photoset}
  1688.     </div>
  1689.    
  1690.    
  1691.     <div class="vertebrae">
  1692.         {block:Video}
  1693.             <div class="video">{Video-500}</div>
  1694.             {block:ifShowCaption}
  1695.                 {block:Caption}<div class="text">{Caption}</div>{/block:Caption}
  1696.             {/block:ifShowCaption}
  1697.        
  1698.             <!-- post info -->
  1699.  
  1700.             {block:Date}
  1701.                 <div id="post_info_container">
  1702.                     <div class="slide">
  1703.                         <div id="date">
  1704.                             {block:IndexPage}<a href="{Permalink}" title="{DayOfMonthWithZero}&nbsp;{ShortMonth}&nbsp;{ShortYear} / {12HourWithZero}:{Minutes}{AmPm}">{TimeAgo}</a>{/block:IndexPage}                                                        {block:Permalink}Posted on {Month} {DayofMonth}{DayofMonthSuffix} {Year}, {24HourWithZero}:{Minutes}:{Seconds} - {TimeAgo}{/block:Permalink}
  1705.                         </div>
  1706.    
  1707.                         <div id="notes">
  1708.                             <a href="{Permalink}">{block:NoteCount}+&nbsp;{NoteCount}&nbsp;N{/block:NoteCount}</a>
  1709.                         </div>
  1710.  
  1711.                         <div id="post_source">
  1712.                             {block:RebloggedFrom}
  1713.                                 <a href="{ReblogRootURL}" title="{ReblogRootTitle}">©:&nbsp;{ReblogRootName}</a>                                
  1714.                                 {block:Permalink}&nbsp;&nbsp;<a href="{ReblogParentURL}" title="{ReblogParentTitle}"><i class="fa fa-retweet" aria-hidden="true"></i>{ReblogParentName}</a>{/block:Permalink}
  1715.                             {/block:RebloggedFrom}
  1716.                         </div>
  1717.        
  1718.                         <div id="tags_box">
  1719.                             {block:HasTags}
  1720.                                 <div id="tags">{block:Tags}&nbsp;<a href="{TagURL}"><i class="fa fa-tags" aria-hidden="true"></i>{Tag}</a>{/block:Tags}</div>
  1721.                             {/block:HasTags}
  1722.                         </div>
  1723.                     </div>
  1724.                
  1725.                     {block:IndexPage}
  1726.                         <div id="like_reblog">
  1727.                             {block:ifNotOldLikeReblogButtons}
  1728.                             <div class="control reblog-control">{ReblogButton size="10" color="black"}</div>
  1729.                             <div class="control like-control">{LikeButton size="10" color="black"}</div>
  1730.                             {/block:ifNotOldLikeReblogButtons}
  1731.                             {block:ifOldLikeReblogButtons}
  1732.                             <ul>    
  1733.                                 <span class="bone"><li class="reblog">{ReblogButton size="8"}</li></span>
  1734.                                 <span class="bone">
  1735.                                     <li class="like"><svg width="8" height="8" viewBox="0 0 19 16" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="#000000"><path d="M14.0425097,0.000920262799 C16.1435097,-0.0400797372 18.8835097,1.28192026 18.9635097,5.36992026 C19.0525097,9.95492026 15.1985097,13.3079203 9.48350967,16.2089203 C3.76650967,13.3079203 -0.0874903349,9.95492026 0.00150966509,5.36992026 C0.0815096651,1.28192026 2.82150967,-0.0400797372 4.92250967,0.000920262799 C7.02450967,0.0419202628 8.87050967,2.26592026 9.46950967,2.92792026 C10.0945097,2.26592026 11.9405097,0.0419202628 14.0425097,0.000920262799 Z"></path></svg>{LikeButton size="10"}</li>
  1736.                                 </span>
  1737.                             </ul>
  1738.                             {/block:ifOldLikeReblogButtons}
  1739.                         </div>  
  1740.                     {/block:IndexPage}
  1741.                 </div>
  1742.             {/block:Date}
  1743.        
  1744.             <!-- post info -->
  1745.        
  1746.         {/block:Video}
  1747.     </div>
  1748.    
  1749.     {block:IndexPage}<!--{block:RebloggedFrom}<a href="{ReblogParentURL}">{ReblogParentName}</a>{/block:RebloggedFrom}-->{/block:IndexPage}
  1750.  
  1751.     </div>
  1752.     <!-- end posts -->
  1753.  
  1754.     {block:ContentSource}<!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}" width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />{/block:SourceLogo}{block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->{/block:ContentSource}
  1755.    
  1756.     <div id="notecontainer">{PostNotes}</div>
  1757.    
  1758.     {/block:Posts}
  1759.  
  1760. </div>
  1761. <!-- end posts container -->
  1762.  
  1763. {block:IndexPage}
  1764. {block:ifInfiniteScroll}
  1765. <div class="navigation" id="navigation">
  1766.     {block:Pagination}
  1767.     {block:PreviousPage}<a href="{PreviousPage}" class="navigate">{/block:PreviousPage}{block:PreviousPage}</a>{/block:PreviousPage}
  1768.     {block:NextPage}<a href="{NextPage}" class="navigate" id="nextPage">{/block:NextPage}{block:NextPage}</a>{/block:NextPage}
  1769.     {/block:Pagination}
  1770. </div>
  1771. {/block:IfInfiniteScroll}
  1772. {/block:IndexPage}
  1773.  
  1774. <div id="scrolltotop"><i class="fa fa-chevron-circle-up" aria-hidden="true"></i></div>
  1775.  
  1776. <!------- scripts ------->
  1777.  
  1778. <script type="text/javascript" src="http://static.tumblr.com/iuggpng/bGqm4yfv9/jquery-1.7.2.js"></script>
  1779. <script type="text/javascript">
  1780.     $(document).ready(function(){
  1781.         {block:IndexPage}
  1782.         {block:ifRevealPostInfoonHover}
  1783.         $(".vertebrae").each(function(){  
  1784.             $(this).hover(function(){
  1785.                 $(this).parent().find('.slide').stop(true, true).slideToggle("slow");
  1786.             })
  1787.         });
  1788.         {/block:ifRevealPostInfoonHover}
  1789.         {/block:IndexPage}
  1790.         $(function(){
  1791.             $('#remove').click(function(event){
  1792.                 $('#sidebar').slideToggle(450);
  1793.                 $('#remove').toggleClass('fa-rotate-180');  
  1794.             });
  1795.             $('#updates_navicon').live('click',function(){
  1796.                 $('#updates').slideToggle();
  1797.             });
  1798.         });
  1799.     });
  1800. </script>
  1801. <script src="http://static.tumblr.com/qudkd6d/Az6nkemqr/pxuphotoset.min.js"></script><script src="//static.tumblr.com/fwgzvyf/Oj1o08f6h/shythemes.vr.js"></script>{block:IndexPage}<script src="http://static.tumblr.com/6hsqxdt/QBym35odk/jquery.masonry.js"></script>{block:ifInfiniteScroll}<script src="http://static.tumblr.com/0cdn90j/vsOo9wcfa/infinitescroll.js"></script>{/block:ifInfiniteScroll}<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.imagesloaded/3.1.8/imagesloaded.pkgd.min.js"></script>{/block:IndexPage}
  1802. <script>
  1803.     $(document).ready(function(){
  1804.         $('.photo-slideshow').pxuPhotoset({
  1805.             lightbox:true,
  1806.             rounded:false,
  1807.             gutter:'{select:Photoset Gutter}px',
  1808.             photoset:'.photo-slideshow',
  1809.             photoWrap:'.photo-data',
  1810.             photo:'.pxu-photo'
  1811.         });
  1812.         {block:IndexPage}
  1813.         var $container = $('#posts_container');
  1814.         $container.masonry({itemSelector:'.posts'});
  1815.         $container.imagesLoaded(function(){
  1816.             $container.masonry();
  1817.             $container.find('.posts').animate({opacity:1, zIndex:1});
  1818.         });
  1819.         {block:ifInfiniteScroll}
  1820.         $container.infinitescroll({
  1821.             itemSelector:'.posts',
  1822.             navSelector:'#navigation',
  1823.             nextSelector:'#navigation a#nextPage',
  1824.             loadingImg:'',
  1825.             loadingText:'<em></em>',
  1826.             bufferPx:2000
  1827.         },
  1828.         function (newElements){
  1829.             var $newElems = $(newElements);
  1830.             resizeVideos();
  1831.             var $newElemsIDs = $newElems.map(function(){
  1832.                 return this.id;
  1833.             }).get();
  1834.             console.log($newElems, $newElemsIDs);
  1835.             Tumblr.LikeButton.get_status_by_post_ids($newElemsIDs);
  1836.             $newElems.find('.photo-slideshow').pxuPhotoset({
  1837.                 lightbox:true,
  1838.                 rounded:false,
  1839.                 gutter:'{select:Photoset Gutter}px',
  1840.                 photoset:'.photo-slideshow',
  1841.                 photoWrap:'.photo-data',
  1842.                 photo:'.pxu-photo'
  1843.             },
  1844.             function(){
  1845.                 $container.masonry();
  1846.             });
  1847.             {block:ifRevealPostInfoonHover}
  1848.             $newElems.find('.vertebrae').each(
  1849.                 function(){  
  1850.                     $(this).hover(function(){
  1851.                         $(this).parent().find('.slide').stop(true, true).slideToggle();
  1852.                     })
  1853.                 }
  1854.             );
  1855.             {/block:ifRevealPostInfoonHover}
  1856.             $newElems.imagesLoaded(function(){
  1857.                 $container.masonry('appended', $newElems);
  1858.                 $newElems.animate({opacity:1, zIndex:1});
  1859.             });
  1860.         });
  1861.         {/block:ifInfiniteScroll}
  1862.         {/block:IndexPage}
  1863.     });
  1864. </script>
  1865. <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/smoothscroll/1.4.4/SmoothScroll.js"></script><script src="http://static.tumblr.com/0cdn90j/glvnidntk/jquery.style-my-tooltips.js"></script>
  1866. <script>
  1867.     (function($){
  1868.         $(document).ready(function(){
  1869.             $("[title]").style_my_tooltips({
  1870.                 tip_follows_cursor:true,
  1871.                 tip_delay_time:0,
  1872.                 tip_fade_speed:0,
  1873.                 attribute:"title"
  1874.             });
  1875.         });
  1876.     })(jQuery);
  1877. </script>
  1878. <script type="text/javascript">
  1879.     $(document).ready(function(){
  1880.         $(window).scroll(function(){
  1881.             if ($(this).scrollTop() > 400){
  1882.                 $('#scrolltotop').stop().animate({right:'0px'});
  1883.             }
  1884.             else {
  1885.                 $('#scrolltotop').stop().animate({right:'-85px'});
  1886.             }
  1887.         });
  1888.         $('#scrolltotop').click(function(){
  1889.             $("html, body").animate({scrollTop:0}, 800);
  1890.             return false;
  1891.         });
  1892.     });
  1893. </script>
  1894. <script>
  1895.     $(function() {
  1896.         $('body').removeClass('fade-out');
  1897.     });
  1898. </script>
  1899.  
  1900. </body>
  1901.  
  1902. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!