daily pastebin goal
31%
SHARE
TWEET

Fifty Three

ladmilk Jan 19th, 2016 (edited) 7,875 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. <!DOCTYPE html>
  2. <html>
  3.  
  4. <!---
  5.  
  6. Theme #53 by Heidi @ladmilk
  7.  
  8. Credit:
  9. Infinitescroll: Paulirish (https://github.com/infinite-scroll/infinite-scroll)
  10. Photoset: PixelUnion (https://github.com/PixelUnion/Extended-Tumblr-Photoset)
  11. Video Resizing: Shy Themes (http://shythemes.tumblr.com/post/134536748863/tutorial-resizing-videos)
  12. Icons: Font Awesome
  13.  
  14. Inspiration:
  15. Shythemes: Grey Theme
  16.  
  17. ---->
  18.  
  19. <head>
  20. <title>{Title}</title>
  21. {block:Description}
  22.  <meta name="description" content="{MetaDescription}" />
  23. {/block:Description}
  24. <link rel="shortcut icon" href="{Favicon}" />
  25. <link rel="alternate" type="application/rss+xml" href="{RSS}" />
  26. <meta name="viewport" content="width=device-width, initial-scale=1">
  27.    
  28.    
  29. <meta name="color:Background" content="#ffffff"/>
  30. <meta name="color:Text" content="#222222"/>
  31. <meta name="color:Heading" content="#000000"/>
  32. <meta name="color:Links" content="#999999"/>
  33. <meta name="color:Links Hover" content="#eeeeee"/>
  34. <meta name="color:Borders" content="#eeeeee"/>
  35. <meta name="color:Permalinks" content="#bbbbbb"/>
  36. <meta name="color:Accent" content="#7bd4e7"/>
  37. <meta name="color:Icons" content="#ffffff"/>
  38. <meta name="color:Scroll" content="#eeeeee" />
  39. <meta name="color:Scrollbar" content="#666666" />
  40.  
  41. <meta name="image:Icon" content="" />
  42.  
  43. <meta name="if:Borders Full Width" content="0" />
  44. <meta name="if:Scroll to Top" content="1" />
  45.  
  46. <meta name="if:Show Captions" content="1" />
  47. <meta name="if:Show Tags" content="1" />
  48. <meta name="if:Show Reblog and Like" content="1" />
  49.  
  50. <meta name="if:Infinitescroll" content="0" />
  51. <meta name="if:Manual Load" content="0" />
  52.  
  53.  
  54. <meta name="select:Tumblr Controls" content="t_w" title="White" />
  55. <meta name="select:Tumblr Controls" content="t_g" title="Grey" />
  56. <meta name="select:Tumblr Controls" content="t_b" title="Black" />
  57.  
  58. <meta name="select:Post Size" content="700" title="700px" />
  59. <meta name="select:Post Size" content="500" title="500px" />
  60. <meta name="select:Post Size" content="600" title="600px" />
  61. <meta name="select:Post Size" content="800" title="800px" />
  62. <meta name="select:Post Size" content="900" title="900px" />
  63.  
  64. <meta name="select:Text Alignment" content="left" title="Left" />
  65. <meta name="select:Text Alignment" content="center" title="Center" />
  66. <meta name="select:Text Alignment" content="justify" title="Justify" />
  67.  
  68. <meta name="select:Body Font Size" content="14" title="14px" />
  69. <meta name="select:Body Font Size" content="12" title="12px" />
  70. <meta name="select:Body Font Size" content="16" title="16px" />
  71.  
  72. <meta name="select:Body Font" content="georgia" title="Georgia" />
  73. <meta name="select:Body Font" content="cambria" title="Cambria" />
  74. <meta name="select:Body Font" content="century" title="Century" />
  75. <meta name="select:Body Font" content="droid serif" title="Droid Serif" />
  76. <meta name="select:Body Font" content="garamond" title="Garamond" />
  77. <meta name="select:Body Font" content="lora" title="Lora" />
  78. <meta name="select:Body Font" content="libre baskerville" title="Libre Baskerville" />
  79. <meta name="select:Body Font" content="merriweather" title="Merriweather" />
  80. <meta name="select:Body Font" content="pt serif" title="PT Serif" />
  81. <meta name="select:Body Font" content="source serif pro" title="Source Serif Pro" />
  82. <meta name="select:Body Font" content="times new roman" title="Times New Roman" />
  83. <meta name="select:Body Font" content="arial" title="Arial" />
  84. <meta name="select:Body Font" content="calibri" title="Calibri" />
  85. <meta name="select:Body Font" content="tahoma" title="Tahoma" />
  86. <meta name="select:Body Font" content="trebuchet ms" title="Trebuchet ms" />
  87. <meta name="select:Body Font" content="Karla" title="Karla" />
  88. <meta name="select:Body Font" content="Open Sans" title="Open Sans" />
  89. <meta name="select:Body Font" content="Roboto" title="Roboto" />
  90.  
  91. <meta name="select:Heading Font" content="libre baskerville" title="Libre Baskerville" />
  92. <meta name="select:Heading Font" content="cambria" title="Cambria" />
  93. <meta name="select:Heading Font" content="century" title="Century" />
  94. <meta name="select:Heading Font" content="droid serif" title="Droid Serif" />
  95. <meta name="select:Heading Font" content="garamond" title="Garamond" />
  96. <meta name="select:Heading Font" content="georgia" title="Georgia" />
  97. <meta name="select:Heading Font" content="lora" title="Lora" />
  98. <meta name="select:Heading Font" content="merriweather" title="Merriweather" />
  99. <meta name="select:Heading Font" content="pt serif" title="PT Serif" />
  100. <meta name="select:Heading Font" content="source serif pro" title="Source Serif Pro" />
  101. <meta name="select:Heading Font" content="times new roman" title="Times New Roman" />
  102. <meta name="select:Heading Font" content="arial" title="Arial" />
  103. <meta name="select:Heading Font" content="calibri" title="Calibri" />
  104. <meta name="select:Heading Font" content="tahoma" title="Tahoma" />
  105. <meta name="select:Heading Font" content="trebuchet ms" title="Trebuchet ms" />
  106. <meta name="select:Heading Font" content="Karla" title="Karla" />
  107. <meta name="select:Heading Font" content="Open Sans" title="Open Sans" />
  108. <meta name="select:Heading Font" content="Roboto" title="Roboto" />
  109.  
  110. <meta name="text:Ask Title" content="message" />
  111. <meta name="text:Archive Title" content="archive" />
  112. <meta name="text:Link1" content="" />
  113. <meta name="text:Title1" content="" />
  114. <meta name="text:Link2" content="" />
  115. <meta name="text:Title2" content="" />
  116. <meta name="text:Link3" content="" />
  117. <meta name="text:Title3" content="" />
  118.  
  119.  
  120. <link href="http://static.tumblr.com/3yblkz0/EkLnyuqmx/pxu_ps.css" rel="stylesheet" type="text/css"/>
  121.  
  122. <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css">
  123. <link href='https://fonts.googleapis.com/css?family=Libre+Baskerville:400,400italic,700|Lora:400,400italic,700|Merriweather:400,400italic,700|PT+Serif:400,400italic,700|Source+Serif+Pro:400,700|Open+Sans:400,700,400italic|Karla:400,400italic,700|Roboto:300,400,400italic,700' rel='stylesheet' type='text/css'>
  124.  
  125.  
  126. <style type="text/css">
  127.  
  128.  
  129.  
  130. /* Tumblr Controls */
  131.  
  132.  
  133. .t_b .tmblr-iframe--desktop-logged-in-controls, .iframe-controls--desktop, .t_b #tumblr_controls, #tumblr_controls {
  134.     height:25px!important;
  135.     top:5px!important;
  136.     right:5px!important;
  137.     position:fixed!important;
  138.     z-index:9999999!important;
  139.     }
  140.  
  141. .t_w .tmblr-iframe--desktop-logged-in-controls, .t_w #tumblr_controls {
  142.     -webkit-filter:invert(100%);
  143.     -moz-filter:invert(100%);
  144.     -o-filter:invert(100%);
  145.     -ms-filter:invert(100%);
  146.     filter:invert(100%);
  147.     opacity:0.3;
  148.     }
  149.  
  150. .t_g .tmblr-iframe--desktop-logged-in-controls, .t_g #tumblr_controls {
  151.     -webkit-filter:invert(70%);
  152.     -moz-filter:invert(70%);
  153.     -o-filter:invert(70%);
  154.     -ms-filter:invert(70%);
  155.     filter:invert(70%);
  156.     opacity:0.4;
  157.     }
  158.    
  159.    
  160.    
  161. /* Scrollbar */
  162.  
  163.  
  164. ::-webkit-scrollbar { width:15px; height:15px; }
  165.  
  166. ::-webkit-scrollbar-track-piece {
  167.     background-color:{color:Scroll};
  168.     border:7px solid {color:Background};
  169.     }
  170. ::-webkit-scrollbar-thumb {
  171.     background-color:{color:Scrollbar};
  172.     border:7px solid {color:Background};
  173.     }  
  174.    
  175.    
  176.  
  177. /* Body - General- Universal */
  178.  
  179.  
  180. html, body, * { margin:0; padding:0; border:0; }
  181.  
  182. body {
  183.     background-color:{color:Background};
  184.     color:{color:Text};
  185.     font-family:{select:Body Font}, georgia, serif;
  186.     font-size:{select:Body Font Size}px;
  187.     line-height:180%;
  188.     word-wrap:break-word;
  189.     -webkit-font-smoothing:antialiased;
  190.     -moz-osx-font-smoothing:grayscale;
  191.     }
  192.  
  193. p { margin:5px 0; padding:0; }
  194.  
  195. p:first-of-type { margin-top:0; }
  196.  
  197. p:last-of-type { margin-bottom:0; }
  198.  
  199. pre {
  200.     margin:5px 0;
  201.     padding:2px 5px;
  202.     background:#f5f5f5;
  203.     white-space:pre-wrap;    
  204.     word-wrap:break-word;
  205.     }      
  206.  
  207. blockquote {
  208.     margin:5px 0 5px 10px;
  209.     padding:2px 0 2px 10px;
  210.     border-left:2px solid {color:Accent};
  211.     }
  212.    
  213. .cap {
  214.     margin-top:40px;
  215.     padding:20px;
  216.     border:1px solid {color:Borders};
  217.     }
  218.  
  219. .cp { display:none; }
  220.  
  221. ul, ol { margin:5px 0 5px 35px; }
  222.  
  223. hr {
  224.     width:30%;
  225.     margin:20px auto;
  226.     border-top:1px solid {color:Borders};
  227.     }
  228.    
  229. span.slash { margin:0 5px; }
  230.  
  231. .icons {
  232.     padding:7px;
  233.     overflow:hidden;
  234.     background:{color:Accent};
  235.     -webkit-border-radius:100%;    
  236.     -moz-border-radius:100%;
  237.     border-radius:100%;
  238.     }
  239.  
  240. header, .header_nav, .header_sub, .container, .posts.post-quote, .posts.post-chat, .perma, .post_footer, .notes {
  241.     -webkit-box-sizin:border-box;
  242.     -moz-box-sizing:border-box;
  243.     box-sizing:border-box;    
  244.     }
  245.  
  246. *  {
  247.     -webkit-transition:all .3s linear;
  248.     -moz-transition:all .3s linear;
  249.     -o-transition:all .3s linear;
  250.     transition:all .3s linear;
  251.     }
  252.  
  253. a {
  254.     -webkit-transition:all .5s ease;
  255.     -moz-transition:all .5s ease;
  256.     -o-transition:all .5s ease;
  257.     transition:all .5s ease;  
  258.     }
  259.    
  260.  
  261.    
  262. /* Common Typography */
  263.  
  264.  
  265. a { color:{color:Links}; text-decoration:none; }
  266.  
  267. a:hover, .post_header > h2 a:hover, a:hover, .perma a:hover, .tags a:hover, a.tumblr_blog:hover { color:{color:Links Hover}; }
  268.  
  269. small, sub, sup { font-size:0.90em; }
  270.  
  271. big { font-size:1.10em; }
  272.  
  273. sub, sup, small, big { vertical-align:baseline; }
  274.    
  275. h1, h2, h3, h4 {
  276.     margin:20px 0 10px 0;
  277.     font-family:{select:Heading Font}, georgia, serif;
  278.     line-height:120%;
  279.     }
  280.  
  281. h2 { font-size:1.60em; }
  282. h3 { font-size:1.45em; }
  283. h4 { font-size:1.15em; }
  284.  
  285. .post_header > h2 a, .title a, .title { color:{color:Heading}; }
  286.  
  287. .header_nav, .audio_text p, .ask_asker p, a.tumblr_blog, .perma, .tags, .notecount, ol.notes li blockquote, footer, .pagination {
  288.     font-family:calibri, arial, sans-serif;
  289.     font-size:0.75em;
  290.     letter-spacing:2px;
  291.     text-transform:uppercase;
  292.     }
  293.  
  294. nav a, .perma, .perma a, .tags a, .fa-undo, .like_button:before, .pagination a, .navigation a { color:{color:Permalinks}; }
  295.  
  296. .icons, #load { color:{color:Icons}; }
  297.  
  298. a.tumblr_blog { color:{color:Text}; }
  299.  
  300. .header_sub, .icons, .post_header > h2, .read_more_container, .audio_text, .ask_asker, .post_header, .perma, .post_footer, .notes, footer, .pagination  { text-align:center; }
  301.  
  302.  
  303.  
  304. /* Header */
  305.  
  306.  
  307. header {
  308.     width:100%;
  309.     margin:0 auto;
  310.     border-bottom:1px solid {color:Borders};
  311.     background:{color:Background};
  312.     }
  313.  
  314. .header_nav {
  315.     width:{select:Post Size}px;  
  316.     height:auto;
  317.     margin:0 auto;
  318.     padding:25px 0;
  319.     display:table;
  320.     background:{color:Background};
  321.     }
  322.  
  323. .header_icon {
  324.     width:30px;
  325.     padding-right:25px;
  326.     display:table-cell;
  327.     vertical-align:middle;
  328.     border-right:1px solid {color:Borders};
  329.     }
  330.    
  331. .h_img {
  332.     width:30px;
  333.     height:30px;
  334.     display:block;
  335.     -webkit-border-radius:100%;    
  336.     -moz-border-radius:100%;
  337.     border-radius:100%;
  338.     }
  339.  
  340. .title {
  341.     {block:ifIconImage}
  342.     padding-left:25px;
  343.     {/block:ifIconImage}
  344.     display:table-cell;
  345.     vertical-align:middle;
  346.     font-size:1.25em;
  347.     font-weight:bold;
  348.     }
  349.  
  350. .icons-mobile { display:none; }
  351.  
  352. .fa-bars { font-size:1.5em; }
  353.  
  354. nav {
  355.     display:table-cell;
  356.     vertical-align:middle;
  357.     text-align:right;
  358.     }
  359.  
  360. nav a { margin-left:14px; }
  361.  
  362. .header_sub {
  363.     width:100%;
  364.     margin:100px auto 0 auto;
  365.     padding:35px 0;
  366.     }
  367.  
  368. .desc {
  369.     width:{select:Post Size}px;  
  370.     margin:0 auto;
  371.     font-size:0.9em;
  372.     line-height:140%;
  373.     }
  374.  
  375.    
  376.  
  377. /* Center Wrapper - Posts */
  378.  
  379.  
  380. .container {
  381.     width:{select:Post Size}px;
  382.     height:auto;
  383.     margin:100px auto;
  384.     position:relative;
  385.     }
  386.  
  387. article {
  388.     width:{select:Post Size}px;
  389.     height:auto;
  390.     padding:70px 0px;
  391.     position:relative;
  392.     }
  393.    
  394. article:before, article:last-of-type:after {
  395.     content:"";
  396.     width:40%;
  397.     {block:ifBordersFullWidth}
  398.     width:100%;
  399.     {/block:ifBordersFullWidth}
  400.     height:1px;
  401.     left:0;
  402.     right:0;
  403.     margin:0 auto;
  404.     position:absolute;
  405.     background:{color:Borders};
  406.     }
  407.    
  408. article:before { top:0; }
  409.  
  410. article:last-of-type:after { bottom:0; }
  411.  
  412. .posts.post-quote, .posts.post-chat { width:75%; margin:0 auto; }
  413.  
  414.  
  415.  
  416. /* Text - Links */
  417.  
  418.  
  419. .post_header h2 {
  420.     margin-top:0;
  421.     color:{color:Heading};    
  422.     font-size:2.15em;
  423.     font-weight:normal;
  424.     }
  425.  
  426. .post_header h2:only-child { margin-bottom:40px; }
  427.  
  428. .text { text-align:{select:Text Alignment}; }
  429.  
  430. .text.center blockquote {
  431.     margin:10px 0;
  432.     position:relative;
  433.     border:0;
  434.     }
  435.  
  436. .text.center ul, .text.center ol {
  437.     margin:10px 0;
  438.     list-style-type:none;
  439.     }
  440.  
  441. .text.center ul li, .text.center ol li {
  442.     padding-left:20px;
  443.     position:relative;
  444.     }    
  445.  
  446. .text.center ul li:before, .text.center ol li:before {
  447.     content:"•";  
  448.     margin-left:-20px;
  449.     position:absolute;
  450.     }
  451.  
  452. .posts.post-link .icons {
  453.     width:20px;
  454.     height:20px;
  455.     margin:0px auto 20px auto;
  456.     line-height:20px;
  457.     }
  458.  
  459. .posts.post-link .icons .fa-link {
  460.     font-size:16px;
  461.     line-height:21px;
  462.     }
  463.  
  464.  
  465.  
  466. /* Image  */
  467.  
  468.  
  469. article img, img :not(.lightbox-image) { max-width:100%; height:auto; }
  470.  
  471. #photo img { width:100%; display:block; }
  472.  
  473.  
  474.  
  475. /* Photoset  */
  476.  
  477.    
  478. .tmblr-lightbox, #tumblr_lightbox { background:rgba({RGBcolor:Background}, 1)!important; }
  479.  
  480. .vignette, #vignette, .lightbox-caption, #tumblr_lightbox_caption { opacity:0!important; }
  481.  
  482. .lightbox-image, #tumblr_lightbox img {
  483.     -webkit-border-radius:0px!important;
  484.     -moz-border-radius:0px!important;
  485.     border-radius:0px!important;
  486.     -webkit-box-shadow:none!important;
  487.     -moz-box-shadow:none!important;
  488.     box-shadow:none!important;
  489.     }
  490.  
  491.  
  492.  
  493. /* Video */
  494.  
  495.  
  496. #vid, #vid iframe  { display:block; overflow:hidden; }
  497.  
  498.  
  499.  
  500. /* Audio */
  501.  
  502.  
  503. .audio_outer {
  504.     width:64px;
  505.     height:64px;
  506.     margin:0 auto;
  507.     position:relative;
  508.     display:block;
  509.     }
  510.  
  511. iframe.tumblr_audio_player {    
  512.     width:30px;
  513.     height:30px;
  514.     top:7px;
  515.     left:7px;
  516.     padding:10px;
  517.     position:absolute;
  518.     display:block;
  519.     opacity:0;
  520.     background:#fff;
  521.     -webkit-border-radius:100%;    
  522.     -moz-border-radius:100%;
  523.     border-radius:100%;
  524.     }
  525.  
  526. .audio_outer:hover iframe.tumblr_audio_player { opacity:1; }
  527.    
  528. .audio_text { margin-top:10px; }
  529.  
  530. .posts.post-audio .icons {
  531.     width:50px;
  532.     height:50px;
  533.     }
  534.    
  535. .posts.post-audio .icons .fa-volume-down {
  536.     font-size:28px;
  537.     line-height:50px;
  538.     }
  539.  
  540. iframe.soundcloud_audio_player { height:auto!important; display:block; }
  541.  
  542. iframe.spotify_audio_player  { display:block; }
  543.    
  544.    
  545.  
  546. /* Ask */
  547.  
  548.  
  549. .ask_outer {
  550.     width:100%;
  551.     display:table;
  552.     }
  553.    
  554. .ask_outer + .text { margin-top:20px; }
  555.    
  556. .ask_asker, .ask_question {
  557.     padding:0 20px;
  558.     display:table-cell;
  559.     }
  560.    
  561. .ask_asker {
  562.     width:20%;
  563.     vertical-align:middle;
  564.     }
  565.  
  566. .ask_asker p { margin-top:5px; }
  567.  
  568. .ask_question {
  569.     width:80%;
  570.     vertical-align:top;
  571.     border-left:1px solid {color:Borders};
  572.     }
  573.  
  574. .posts.post-answer .icons {
  575.     width:20px;
  576.     height:20px;
  577.     margin:0px auto;
  578.     line-height:20px;
  579.     }
  580.    
  581. .posts.post-answer .icons .fa-envelope {
  582.     font-size:16px;
  583.     line-height:20px;
  584.     }
  585.  
  586.  
  587.  
  588. /* Quote */
  589.  
  590.  
  591. .quote {
  592.     font-family:{select:Heading Font}, georgia, serif;
  593.     font-size:1.75em;
  594.     font-style:italic;
  595.     line-height:140%;
  596.     }
  597.  
  598. .source {
  599.     margin-top:15px;
  600.     padding-top:15px;
  601.     position:relative;
  602.     }
  603.  
  604. .source:before {
  605.     content:"";
  606.     width:80px;
  607.     height:2px;
  608.     top:0;
  609.     position:absolute;
  610.     background:{color:Accent};
  611.     }
  612.  
  613.  
  614.    
  615. /* Chat */
  616.  
  617.  
  618. ul.chat { margin:0; list-style-type:none; }
  619.  
  620. ul.chat li { padding:10px; color:#888; }
  621.  
  622. ul.chat li:nth-of-type(odd) { background:#f5f5f5; }
  623.  
  624. ul.chat li:nth-of-type(even) { background:#fff; }
  625.  
  626.    
  627.    
  628. /* Perma - Tags - Notes */
  629.  
  630.  
  631. .post_header, .perma, .post_footer, .notes { position:relative; }
  632.  
  633.  
  634. .perma { margin-bottom:40px; }
  635.  
  636. .posts > .post_header:only-child .perma { margin-bottom:0; }
  637.  
  638.  
  639. .tags { margin-top:40px; }
  640.  
  641. .tg { display:none; }
  642.    
  643. .tags a, .reblog_like li { margin:0 7px; }
  644.  
  645.    
  646. .reblog_like {
  647.     margin-top:20px;
  648.     {block:ifnotShowTags}
  649.     margin-top:40px;
  650.     {/block:ifnotShowTags}
  651.     }
  652.  
  653. .post_footer .reblog_like:only-child { margin-top:40px; }
  654.  
  655. .reblog_like li {
  656.     height:1em;
  657.     display:inline-block;
  658.     vertical-align:middle;
  659.     list-style-type:none;
  660.     line-height:100%;
  661.     }
  662.  
  663. .like_button {
  664.     width:1em;
  665.     height:1em;
  666.     position:relative;
  667.     cursor:pointer;
  668.     }
  669.  
  670. .like_button iframe {  
  671.     top:0px;
  672.     left:0px;
  673.     position:absolute;
  674.     opacity:0;
  675.     z-index:99;
  676.     }
  677.    
  678. .like_button:before {
  679.     content:"\f08a";  
  680.     top:0;
  681.     left:0px;
  682.     position:absolute;
  683.     font-family:'FontAwesome';
  684.     font-size:inherit;
  685.     font-style:normal;
  686.     font-weight:normal;
  687.     line-height:100%;
  688.     text-decoration:inherit;
  689.     text-align:center;
  690.     }
  691.    
  692. .like_button.liked:before, .like_button:hover:before, .fa-undo:hover { color:{color:Accent}; }
  693.  
  694.  
  695. .notes { margin-top:70px; }
  696.  
  697. .notecount { margin-bottom:40px; }
  698.  
  699. ol.notes { margin:0; font-size:0.9em; }
  700.  
  701. ol.notes li { padding:2px 0; list-style-type:none; }
  702.  
  703. ol.notes li:first-of-type { padding-top:0; }
  704.  
  705. ol.notes li:last-of-type { padding-bottom:0; }
  706.  
  707. ol.notes li blockquote { margin:0; padding:0; border:0; }
  708.  
  709. ol.notes li.note img.avatar { display:none; }
  710.  
  711.  
  712.  
  713. /* Footer - Pagination - Manual Load */
  714.  
  715.  
  716. footer, .pagination {
  717.     width:100%;
  718.     margin-bottom:100px;
  719.     line-height:100%;
  720.     }
  721.    
  722. .pagination a {
  723.     margin:0 5px;
  724.     padding:3px 5px;
  725.     border:1px solid {color:Borders};
  726.     }
  727.    
  728. .pagination a:hover { border-color:{color:Accent}; color:{color:Accent}; }
  729.    
  730. #load {
  731.     padding:3px 5px;
  732.     background:{color:Accent};
  733.     font-weight:bold;
  734.     cursor:pointer;
  735.     }
  736.  
  737. {block:ifInfinitescroll}
  738. #infscr-loading, .pagination { display:none!important; }
  739. {/block:ifInfinitescroll}
  740.  
  741. #totop {
  742.     bottom:5px;
  743.     right:5px;
  744.     padding:10px;
  745.     position:fixed;
  746.     color:{color:Text};
  747.     cursor:pointer;
  748.     }
  749.  
  750. .heidi {
  751.     bottom:5px;
  752.     left:5px;
  753.     padding:10px;
  754.     position:fixed;
  755.     font-size:10px;
  756.     }
  757.    
  758.    
  759.  
  760. /* Fade animation */
  761.  
  762.  
  763. @-webkit-keyframes fadein {
  764.     from { opacity: 0; }
  765.     to   { opacity: 1; }
  766.     }
  767.    
  768. @-moz-keyframes fadein {
  769.     from { opacity: 0; }
  770.     to   { opacity: 1; }
  771.     }
  772.    
  773. @keyframes fadein {
  774.     from { opacity: 0; }
  775.     to   { opacity: 1; }
  776.     }
  777.    
  778. header, .header_sub, article, footer, .pagination, .notes {
  779.     -webkit-animation: fadein 2s;
  780.     -moz-animation: fadein 2s;
  781.     animation: fadein 2s;
  782.     }
  783.  
  784.  
  785.  
  786. /* Media Queries */
  787.  
  788.  
  789. @media only screen and (min-width:660px) and (max-width:730px) {
  790. .w700 .container, .w700 article, .w700 .header_nav { width:100%; }
  791. .w700 .container { padding:0 25px; }
  792. .w700 .header_nav { padding:25px; }
  793. .w700 .desc { width:75%; }
  794. }
  795.  
  796. @media only screen and (min-width:660px) and (max-width:830px) {
  797. .w800 .container, .w800 article, .w800 .header_nav { width:100%; }
  798. .w800 .container { padding:0 25px; }
  799. .w800 .header_nav { padding:25px; }
  800. .w800 .desc { width:75%; }
  801. }
  802.  
  803. @media only screen and (min-width:660px) and (max-width:930px) {
  804. .w900 .container, .w900 article, .w900 .header_nav { width:100%; }
  805. .w900 .container { padding:0 25px; }
  806. .w900 .header_nav { padding:25px; }
  807. .w900 .desc { width:75%; }
  808. }
  809.  
  810. @media only screen and (max-width: 660px)  {
  811. header, .header_nav,  .container, article, article:before, article:last-of-type:after, .posts.post-chat, .ask_asker, .ask_question { width:100%; }
  812.  
  813. .header_nav { padding:15px; }
  814. .header_sub { margin:0 auto; }
  815. .desc { width:75%; }
  816. .header_icon { display:block; float:left; }
  817. .title { display:block; float:left; line-height:30px; }
  818. .fa-bars { vertical-align:middle; line-height:inherit; }
  819. .icons-mobile { display:block; float:right; clear:right; text-align:right; cursor:pointer; }
  820.  
  821. nav { width:100%; margin-top:15px; padding-top:15px; display:none; float:left; clear:both;  text-align:center; border-top:1px solid {color:Borders};     -webkit-animation: fadein 1s; -moz-animation: fadein 1s; animation: fadein 1s; }
  822. nav a { margin:0 7px; }
  823. .on { display:block; }
  824.  
  825. .container { margin:0; }
  826. article { padding:40px 0; }
  827. {block:HideDescription}
  828. article:first-of-type:before { display:none; }
  829. {/block:HideDescription}
  830. .posts, .perma, .post_footer, .notes { padding:0 15px; }
  831. .posts.post-photo, .posts.post-video { padding:0; }
  832. .cap { margin:0; border:0; }
  833. .ask_outer { padding:0 0 20px 0; border-bottom:1px solid {color:Borders}; }
  834. .ask_asker { padding:0 0 10px 0; display:block; }
  835. .ask_question { padding:0; display:block; border:0; text-align:{select:Text Alignment}; }
  836.  
  837. footer, .pagination { margin:20px 0; }
  838. .heidi { left:0; bottom:0; position:relative; }
  839. }
  840.  
  841.  
  842.  
  843. {CustomCSS}
  844.  
  845.  
  846.  
  847. </style>
  848.  
  849.  
  850. <!--------------- Scripts ---------------------->
  851.  
  852.  
  853. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  854.  
  855. <script src="http://static.tumblr.com/qudkd6d/Az6nkemqr/pxuphotoset.min.js"></script>
  856. <script src="http://static.tumblr.com/3yblkz0/Bu3nywvqg/shythemes_vr.js"></script>
  857. {block:IndexPage}
  858. {block:ifInfinitescroll}
  859. <script src="http://static.tumblr.com/3yblkz0/OZInz27pe/jquery.infinitescroll.min.js"></script>
  860. {/block:ifInfinitescroll}
  861. {/block:IndexPage}
  862.  
  863. <script>
  864. $(document).ready(function(){
  865. $('.icons-mobile').click(function(){
  866.     if ($('nav').hasClass('on'))
  867.     { $('nav').removeClass('on'); }
  868.     else
  869.     { $('nav').addClass('on'); }
  870.     return false;
  871.     });
  872. $(window).scroll(function () {
  873.     if ($(this).scrollTop() > 200)
  874.     { $('#totop').fadeIn(); }
  875.     else
  876.     { $('#totop').fadeOut(); }
  877.     });
  878. $('#totop').click(function () {
  879.     $("html, body").animate({scrollTop:0}, 1000); return false;
  880.     });
  881. $('.photo-slideshow').pxuPhotoset({
  882.     lightbox: true,
  883.     highRes : true,
  884.     rounded: false,
  885.     gutter: '5px',
  886.     photoset: '.photo-slideshow',
  887.     photoWrap: '.photo-data',
  888.     photo: '.pxu-photo'
  889.     });
  890. {block:IndexPage}
  891. {block:ifInfinitescroll}
  892. var $container = $('.container');
  893.     $container.infinitescroll({
  894.         itemSelector :"article",
  895.         navSelector : ".pagination",
  896.         nextSelector : ".pagination a",
  897.         loadingImg : "",
  898.         loadingText : "<em></em>",
  899.         bufferPx : 800,
  900.     {block:ifManualLoad}
  901.         errorCallback: function () { jQuery('footer').delay(30).fadeOut("slow"); },
  902.     {/block:ifManualLoad}
  903.     },
  904.     function( newElements ) {  
  905.     var $newElems = $(newElements);
  906.         resizeVideos();
  907.         $newElems.find('.photo-slideshow').pxuPhotoset({
  908.             lightbox: true,
  909.             highRes : true,
  910.             rounded: false,
  911.             gutter: '5px',
  912.             photoset: '.photo-slideshow',
  913.             photoWrap: '.photo-data',
  914.             photo: '.pxu-photo'
  915.         });
  916.         var $newElemsIDs = $newElems.map(function (){return this.id;}).get();
  917.         Tumblr.LikeButton.get_status_by_post_ids($newElemsIDs);
  918.     });
  919. {block:ifManualLoad}
  920.     $(window).unbind('.infscr');
  921.     $('#load').click(function() {
  922.         $container.infinitescroll('retrieve');return false;
  923.     });
  924. {/block:ifManualLoad}
  925. {/block:ifInfinitescroll}
  926. {/block:IndexPage}  
  927. });  
  928. </script>
  929.  
  930.  
  931. </head>
  932. <body class="{select:Tumblr Controls} w{select:Post Size}">
  933.  
  934.  
  935.  
  936. <header>
  937. <section class="header_nav">
  938. {block:ifIconImage}<div class="header_icon"><img class="h_img" src="{image:Icon}" /></div>{/block:ifIconImage}
  939. {block:ShowTitle}<div class="title"><a href="/">{Title}</a></div>{block:ShowTitle}
  940. <div class="icons-mobile"><i class="fa fa-bars"></i></div>
  941. <nav>
  942. {block:HideTitle}<a href="/">home</a>{/block:HideTitle}
  943. {block:ifAskTitle}<a href="/ask">{text:Ask Title}</a>{/block:ifAskTitle}
  944. {block:ifLink1}<a href="{text:Link1}">{text:Title1}</a>{/block:ifLink1}
  945. {block:ifLink2}<a href="{text:Link2}">{text:Title2}</a>{/block:ifLink2}
  946. {block:ifLink3}<a href="{text:Link3}">{text:Title3}</a>{/block:ifLink3}
  947. {block:ifArchiveTitle}<a href="/archive">{text:Archive Title}</a>{/block:ifArchiveTitle}
  948. </nav>
  949. </section>
  950. </header>
  951.  
  952. {block:ShowDescription}
  953. <section class="header_sub">
  954. <div class="desc">{Description}</div>
  955. </section>
  956. {/block:ShowDescription}
  957.  
  958.  
  959.  
  960. <section class="container">
  961. {block:Posts}
  962. <article id="{PostID}">
  963. <div class="posts post-{PostType}">
  964.  
  965.  
  966.  
  967. {block:Photo}
  968. {block:Date} <!---- Start of Perma ---->
  969. <div class="perma">
  970. {block:IndexPage}<a href="{Permalink}">{ShortMonth} {DayOfMonth}, {Year}</a>{/block:IndexPage}
  971. {block:PermalinkPage}
  972. {DayOfWeek}, {DayOfMonth} {ShortMonth} {Year} {block:RebloggedFrom}<span class="slash">/</span> by <a href="{ReblogRootURL}">{ReblogRootName}</a>{/block:RebloggedFrom}
  973. {/block:PermalinkPage}
  974. </div>
  975. {/block:Date}<!---- End of Perma ---->
  976.  
  977. <div id="photo">
  978. {LinkOpenTag}<img src="{PhotoURL-HighRes}" alt="{PhotoAlt}" />{LinkCloseTag}
  979. </div>
  980. {/block:Photo}
  981.  
  982.  
  983.  
  984. {block:Photoset}
  985. {block:Date} <!---- Start of Perma ---->
  986. <div class="perma">
  987. {block:IndexPage}<a href="{Permalink}">{ShortMonth} {DayOfMonth}, {Year}</a>{/block:IndexPage}
  988. {block:PermalinkPage}
  989. {DayOfWeek}, {DayOfMonth} {ShortMonth} {Year} {block:RebloggedFrom}<span class="slash">/</span> by <a href="{ReblogRootURL}">{ReblogRootName}</a>{/block:RebloggedFrom}
  990. {/block:PermalinkPage}
  991. </div>
  992. {/block:Date}<!---- End of Perma ---->
  993.  
  994. <div class="photo-slideshow" id="photoset_{PostID}" data-layout="{PhotosetLayout}">
  995. {block:Photos}
  996. <div class="photo-data">
  997. <div class="pxu-photo">
  998. <img src="{PhotoURL-500}" width="{PhotoWidth-500}" height="{PhotoHeight-500}" data-highres="{PhotoURL-HighRes}" data-width="{PhotoWidth-HighRes}" data-height="{PhotoHeight-HighRes}">
  999. </div>
  1000. <a class="tumblr-box" rel="post-{PostID}" href="{PhotoURL-HighRes}"></a>
  1001. </div>
  1002. {/block:Photos}
  1003. </div>
  1004. {/block:Photoset}
  1005.  
  1006.  
  1007.  
  1008. {block:Video}
  1009. {block:Date} <!---- Start of Perma ---->
  1010. <div class="perma">
  1011. {block:IndexPage}<a href="{Permalink}">{ShortMonth} {DayOfMonth}, {Year}</a>{/block:IndexPage}
  1012. {block:PermalinkPage}
  1013. {DayOfWeek}, {DayOfMonth} {ShortMonth} {Year} {block:RebloggedFrom}<span class="slash">/</span> by <a href="{ReblogRootURL}">{ReblogRootName}</a>{/block:RebloggedFrom}
  1014. {/block:PermalinkPage}
  1015. </div>
  1016. {/block:Date}<!---- End of Perma ---->
  1017.  
  1018. <div id="vid">{Video-700}</div>
  1019. {/block:Video}
  1020.  
  1021.  
  1022.  
  1023. {block:Audio}
  1024. {block:Date} <!---- Start of Perma ---->
  1025. <div class="perma">
  1026. {block:IndexPage}<a href="{Permalink}">{ShortMonth} {DayOfMonth}, {Year}</a>{/block:IndexPage}
  1027. {block:PermalinkPage}
  1028. {DayOfWeek}, {DayOfMonth} {ShortMonth} {Year} {block:RebloggedFrom}<span class="slash">/</span> by <a href="{ReblogRootURL}">{ReblogRootName}</a>{/block:RebloggedFrom}
  1029. {/block:PermalinkPage}
  1030. </div>
  1031. {/block:Date}<!---- End of Perma ---->
  1032.  
  1033. {block:AudioPlayer}<div class="audio_outer">
  1034. <div class="icons"><i class="fa fa-volume-down"></i></div>
  1035. {AudioPlayerWhite}
  1036. </div>{/block:AudioPlayer}
  1037. <div class="audio_text">
  1038. {block:TrackName}<b>{TrackName}</b>{/block:TrackName}
  1039. <p>
  1040. {block:Artist}{Artist}{/block:Artist}
  1041. {block:Album}{block:Artist}<span class="slash">/</span>{/block:Artist} {Album}{/block:Album}
  1042. </p>
  1043. </div>
  1044. {/block:Audio}
  1045.  
  1046.  
  1047.  
  1048. {block:Text}
  1049. <div class="post_header">
  1050. {block:Title}<h2><a href="{Permalink}">{Title}</a></h2>{/block:Title}
  1051.  
  1052. {block:Date} <!---- Start of Perma ---->
  1053. <div class="perma">
  1054. {block:IndexPage}<a href="{Permalink}">{ShortMonth} {DayOfMonth}, {Year}</a>{/block:IndexPage}
  1055. {block:PermalinkPage}
  1056. {DayOfWeek}, {DayOfMonth} {ShortMonth} {Year} {block:RebloggedFrom}<span class="slash">/</span> by <a href="{ReblogRootURL}">{ReblogRootName}</a>{/block:RebloggedFrom}
  1057. {/block:PermalinkPage}
  1058. </div>
  1059. {/block:Date}<!---- End of Perma ---->
  1060. </div>
  1061.  
  1062. {block:Body}<div class="text {select:Text Alignment}">{Body}</div>{/block:Body}
  1063. {/block:Text}
  1064.  
  1065.  
  1066.  
  1067. {block:Link}
  1068. <div class="post_header">
  1069. <div class="icons"><i class="fa fa-link"></i></div>
  1070. <h2><a href="{URL}" target="_blank">{Name}</a></h2>
  1071.  
  1072. {block:Date} <!---- Start of Perma ---->
  1073. <div class="perma">
  1074. {block:IndexPage}<a href="{Permalink}">{ShortMonth} {DayOfMonth}, {Year}</a>{/block:IndexPage}
  1075. {block:PermalinkPage}
  1076. {DayOfWeek}, {DayOfMonth} {ShortMonth} {Year} {block:RebloggedFrom}<span class="slash">/</span> by <a href="{ReblogRootURL}">{ReblogRootName}</a>{/block:RebloggedFrom}
  1077. {/block:PermalinkPage}
  1078. </div>
  1079. {/block:Date}<!---- End of Perma ---->
  1080. </div>
  1081.  
  1082. {block:Description}<div class="text {select:Text Alignment}">{Description}</div>{/block:Description}
  1083. {/block:Link}
  1084.  
  1085.  
  1086.  
  1087. {block:Answer}
  1088. {block:Date} <!---- Start of Perma ---->
  1089. <div class="perma">
  1090. {block:IndexPage}<a href="{Permalink}">{ShortMonth} {DayOfMonth}, {Year}</a>{/block:IndexPage}
  1091. {block:PermalinkPage}
  1092. {DayOfWeek}, {DayOfMonth} {ShortMonth} {Year} {block:RebloggedFrom}<span class="slash">/</span> by <a href="{ReblogRootURL}">{ReblogRootName}</a>{/block:RebloggedFrom}
  1093. {/block:PermalinkPage}
  1094. </div>
  1095. {/block:Date}<!---- End of Perma ---->
  1096.  
  1097. <div class="ask_outer">
  1098. <div class="ask_asker"><div class="icons"><i class="fa fa-envelope"></i></div> <p>{Asker}</p></div>
  1099. <div class="ask_question">{Question}</div>
  1100. </div>
  1101. <div class="text {select:Text Alignment}">{Answer}</div>
  1102. {/block:Answer}
  1103.  
  1104.  
  1105.  
  1106. {block:Quote}
  1107. {block:Date} <!---- Start of Perma ---->
  1108. <div class="perma">
  1109. {block:IndexPage}<a href="{Permalink}">{ShortMonth} {DayOfMonth}, {Year}</a>{/block:IndexPage}
  1110. {block:PermalinkPage}
  1111. {DayOfWeek}, {DayOfMonth} {ShortMonth} {Year} {block:RebloggedFrom}<span class="slash">/</span> by <a href="{ReblogRootURL}">{ReblogRootName}</a>{/block:RebloggedFrom}
  1112. {/block:PermalinkPage}
  1113. </div>
  1114. {/block:Date}<!---- End of Perma ---->
  1115.  
  1116. <div class="quote">{Quote}</div>
  1117. {block:Source}<div class="source">{Source}</div>{/block:Source}    
  1118. {/block:Quote}
  1119.  
  1120.  
  1121.  
  1122. {block:Chat}
  1123. <div class="post_header">
  1124. {block:Title}<h2><a href="{Permalink}">{Title}</a></h2>{/block:Title}
  1125.  
  1126. {block:Date} <!---- Start of Perma ---->
  1127. <div class="perma">
  1128. {block:IndexPage}<a href="{Permalink}">{ShortMonth} {DayOfMonth}, {Year}</a>{/block:IndexPage}
  1129. {block:PermalinkPage}
  1130. {DayOfWeek}, {DayOfMonth} {ShortMonth} {Year} {block:RebloggedFrom}<span class="slash">/</span> by <a href="{ReblogRootURL}">{ReblogRootName}</a>{/block:RebloggedFrom}
  1131. {/block:PermalinkPage}
  1132. </div>
  1133. {/block:Date}<!---- End of Perma ---->
  1134. </div>
  1135.  
  1136. <ul class="chat">
  1137. {block:Lines}
  1138. <li>{block:Label}<b>{Label}</b>{/block:Label} {Line}</li>
  1139. {/block:Lines}
  1140. </ul>
  1141. {/block:Chat}
  1142.  
  1143.  
  1144.  
  1145. </div>
  1146.  
  1147.  
  1148.  
  1149. {block:Caption}
  1150. <div class="cap text {select:Text Alignment} {block:IndexPage}{block:ifnotShowCaptions}cp{/block:ifnotShowCaptions} {block:Audio}cp{/block:Audio}{/block:IndexPage}">{Caption}</div>
  1151. {/block:Caption}
  1152.  
  1153.  
  1154. <div class="post_footer">
  1155. {block:HasTags}
  1156. <div class="tags {block:IndexPage}{block:ifnotShowTags}tg{/block:ifnotShowTags}{/block:IndexPage}">{block:Tags}<a href="{TagURL}">{Tag}</a> {/block:Tags}</div>
  1157. {/block:HasTags}
  1158. {block:IndexPage}{block:ifShowReblogandLike}
  1159. <div class="reblog_like">
  1160. <li><a href="{ReblogURL}" target="_blank"><i class="fa fa-undo"></i></a></li>
  1161. <li>{LikeButton size="14"}</li></div>
  1162. {/block:ifShowReblogandLike}{/block:IndexPage}
  1163. </div>
  1164.  
  1165.  
  1166.  
  1167. </article>
  1168.  
  1169.  
  1170.  
  1171. {block:PostNotes}
  1172. <div class="notes">
  1173. {block:NoteCount}
  1174. <div class="notecount">{NoteCountWithLabel}</div>
  1175. {/block:NoteCount}
  1176. {PostNotes}
  1177. </div>
  1178. {/block:PostNotes}
  1179.  
  1180.  
  1181.  
  1182. {block:ContentSource}<!-- {SourceURL}
  1183. {block:SourceLogo}<img src="{BlackLogoURL}"width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />{/block:SourceLogo}
  1184. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  1185. {/block:ContentSource}
  1186. <!-- {block:NoRebloggedFrom}
  1187. {block:RebloggedFrom}{ReblogParentName}{/block:RebloggedFrom}
  1188. {/block:NoRebloggedFrom} -->
  1189.  
  1190.  
  1191.  
  1192. {/block:Posts}
  1193. </section>
  1194.  
  1195.  
  1196.  
  1197. {block:Pagination}<div class="pagination">
  1198. {block:PreviousPage}<a href="{PreviousPage}">previous</a>{/block:PreviousPage}
  1199. {block:NextPage}<a href="{NextPage}">next</a>{/block:NextPage}
  1200. </div>{/block:Pagination}  
  1201.  
  1202.  
  1203. {block:IndexPage}{block:ifInfinitescroll}{block:ifManualLoad}
  1204. <footer><a id="load">load more</a></footer>
  1205. {/block:ifManualLoad}{/block:ifInfinitescroll}{/block:IndexPage}
  1206.  
  1207.  
  1208. {block:ifScrolltoTop}<a id="totop"><i class="fa fa-angle-up fa-lg"></i></a>{/block:ifScrolltoTop}
  1209.  
  1210.  
  1211. <a href="http://ladmilk.tumblr.com" title="Theme by Heidi" class="heidi">cr.</a>
  1212.  
  1213.  
  1214.  
  1215. </body>
  1216. </html>
RAW Paste Data
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
 
Top