darianella

"The Reaper" tumblr theme HTML code

Jul 8th, 2013
4,076
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 33.72 KB | None | 0 0
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  3.  
  4. <link href='http://fonts.googleapis.com/css?family=Josefin+Sans' rel='stylesheet' type='text/css'>
  5.  
  6. <link href='http://fonts.googleapis.com/css?family=Muli:300,400' rel='stylesheet' type='text/css'>
  7.  
  8. <!--
  9.  
  10. yes, friends--a new theme! I know it's soon, but Rose inspired me so here you go!
  11.  
  12. POSTS:
  13. - one column 250px, 400px, or 500px posts
  14. - optional hidden permalink
  15. - optional hidden image descriptions
  16. - optional monochrome images
  17. - optional infinite scroll
  18.  
  19. hope y'all like it!
  20.  
  21. much love,
  22. darian
  23.  
  24. {friendly reminder that stealing any part of this code is ill-advised, and a special thanks to faiz over at fukuo themes for help with the code for the sticky navigation bar}
  25.  
  26.  
  27. -->
  28.  
  29.  
  30. <head><title>{Title}</title>
  31.  
  32. <link rel="shortcut icon" href="{favicon}">
  33. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  34.  
  35.  
  36.  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  37. <script src="http://static.tumblr.com/5ojoydj/p9wmmzopi/jquery.style-my-tooltips.js"></script>
  38. <script src="http://static.tumblr.com/5ojoydj/En2mmzorm/style-my-tooltips.css"></script>
  39. <script>
  40.      (function($){
  41.          $(document).ready(function(){
  42.              $("[title]").style_my_tooltips({
  43.     tip_follows_cursor:true,
  44.     tip_delay_time:200,
  45.     tip_fade_speed:300,
  46.     attribute:"title"
  47. });
  48.          });
  49.      })(jQuery);
  50.  </script>
  51.  
  52.  
  53.  
  54. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  55.  
  56.  
  57.     <meta name="color:title" content="#eeeeee" />
  58.     <meta name="color:subtitle" content="#e6e4e4" />
  59.     <meta name="color:pagination" content="#eeecec" />
  60.     <meta name="color:bold" content="#222121" />
  61.     <meta name="color:italic" content="#9c8c07" />
  62.    
  63.     <meta name="color:background" content="#f3f3f3" />
  64.     <meta name="color:backgroundbar1" content="#232323" />
  65.     <meta name="color:backgroundedge1" content="#302f2f" />
  66.     <meta name="color:backgroundbar2" content="#111111" />
  67.     <meta name="color:backgroundedge2" content="#232323" />
  68.    
  69.     <meta name="color:scrollbar" content="#232323" />
  70.     <meta name="color:scrollbarback" content="#d6d5d5" />
  71.        
  72.     <meta name="color:selection" content="#cfcece" />
  73.     <meta name="color:selectiontext" content="#4e4a0d" />
  74.    
  75.     <meta name="color:description" content="#c9c7c7" />
  76.     <meta name="color:descriptionback" content="#232323" />
  77.     <meta name="color:descriptionedge" content="#313131" />
  78.    
  79.     <meta name="color:topbar" content="#000000" />
  80.     <meta name="color:topborder" content="#181818" />
  81.     <meta name="color:topborderedge" content="#313131" />
  82.    
  83.     <meta name="color:post" content="#ffffff" />
  84.     <meta name="color:text" content="#353534" />
  85.     <meta name="color:postlinks" content="#b4911c" />
  86.     <meta name="color:postlinkhover" content="#424242" />
  87.    
  88.     <meta name="color:permalink" content="#ebebeb" />
  89.     <meta name="color:permalinkborder" content="#2e2e2e" />
  90.     <meta name="color:datelinks" content="#242323" />
  91.     <meta name="color:permalinktext" content="#0f0f0f" />
  92.     <meta name="color:datelinkhover" content="#fdfdfd" />
  93.     <meta name="color:taglinks" content="#9e8415" />
  94.     <meta name="color:taglinkhover" content="#20201b" />
  95.    
  96.     <meta name="color:quote" content="#313131" />
  97.     <meta name="color:question" content="#313131" />
  98.    
  99.     <meta name="color:blockquote" content="#e9e9e9" />
  100.     <meta name="color:blockquote2" content="#f5f3f2" />
  101.     <meta name="color:blockquoteborder" content="#1f1f1e" />
  102.    
  103.     <meta name="color:custom" content="#232323" />
  104.     <meta name="color:customborder" content="#ffffff" />
  105.     <meta name="color:customlinks" content="#ffffff" />
  106.     <meta name="color:customlinkhover" content="#f0eeee" />
  107.    
  108.     <meta name="color:nav" content="#f5f5f5" />
  109.     <meta name="color:navborder" content="#232323" />
  110.    
  111.     <meta name="if:250px posts" content="0">
  112.     <meta name="if:400px posts" content="1">
  113.     <meta name="if:500px posts" content="0">
  114.     <meta name="if:hidden permalink" content="0">
  115.     <meta name="if:infinite scroll" content="0">
  116.     <meta name="if:monochrome" content="1">
  117.     <meta name="if:hidden descriptions" content="1">
  118.  
  119.    
  120.     <meta name="image:background" content="https://lh4.googleusercontent.com/-6k3mLmCLjOk/Uds91q4vRxI/AAAAAAAAFTg/sB2rVpo_tAA/s70-no/office.png"/>
  121.     <meta name="image:header" content="https://lh3.googleusercontent.com/-6rnvClKS-CU/Udscuw6wkDI/AAAAAAAAFSA/E-c0QLV3Tu4/w700-h150-no/Untitled-1.png"/>
  122.  
  123.     <meta name="text:subtitle" content="" />
  124.     <meta name="text:link1" content="" />
  125.     <meta name="text:link1URL" content="/" />
  126.     <meta name="text:link2" content="" />
  127.     <meta name="text:link2URL" content="/" />
  128.     <meta name="text:link3" content="" />
  129.     <meta name="text:link3URL" content="/" />
  130.     <meta name="text:link4" content="" />
  131.     <meta name="text:link4URL" content="/" />
  132.     <meta name="text:link5" content="" />
  133.     <meta name="text:link5URL" content="/" />
  134.     <meta name="text:link6" content="" />
  135.     <meta name="text:link6URL" content="/" />
  136.  
  137. <style type="text/css">
  138.  
  139. /*basics*/
  140.  
  141. ::-webkit-scrollbar {
  142.     width: 7px;
  143.     height: 0px;
  144.     background-color:{color:scrollbarback};
  145. }
  146.  
  147. ::-webkit-scrollbar-thumb {
  148.     background: {color:scrollbar};
  149. }
  150.  
  151.  
  152.  
  153. @font-face {
  154. font-family: "tinytots";
  155. src: url('http://static.tumblr.com/rmj06l2/Usellxb4i/tinytots.ttf');
  156. }
  157.  
  158.  
  159.  
  160. iframe{
  161.     opacity: 0.9;
  162.     filter:alpha(opacity=90);
  163.     -moz-opacity: 0.9;
  164.     -khtml-opacity: 0.9;
  165. }
  166.  
  167. iframe#tumblr_controls {
  168.     right:3px !important; position: fixed !important;-webkit-transition: opacity 0.7s linear;opacity: 0.2;-webkit-transition: all 0.8s ease-out;-moz-transition: all 0.8s ease-out;transition: all 0.8s ease-out;}
  169.  
  170. iframe#tumblr_controls:hover{-webkit-transition: opacity 0.7s linear;opacity: 1;-webkit-transition: all 0.4s ease-out;-moz-transition: all 0.4s ease-out;transition: all 0.4s ease-out;}
  171.  
  172.  
  173.  
  174. /*basic derps*/
  175.  
  176. body{
  177.     margin-top:0;
  178.     color:{color:text};
  179.     font-family:helvetica;
  180.     font-size:10px;
  181.     line-height:100%;
  182.     background-image:url('{image:background}');
  183.     background-attachment: fixed;
  184.     background-repeat: repeat;
  185.     background-color: {color:background};
  186. }
  187.  
  188. a{
  189.     text-decoration:none;
  190.     outline:none;
  191.     -moz-outline-style:none;
  192.    color:{color:customlinks};
  193.     -webkit-transition: all 0.5s linear;
  194.     -moz-transition: all 0.5s linear;
  195.     -o-transition: all 0.5s linear;
  196. }
  197.  
  198.  
  199. em{
  200.     color:{color:italic};
  201. }
  202.  
  203. strong{
  204.     color:{color:bold};
  205.     font-weight:strong;
  206. }
  207.  
  208. img{
  209.     border:none;
  210. }
  211.  
  212. blockquote{
  213.     padding:5px;
  214.     padding-left:10px;
  215.     padding-right:10px;
  216.     background-color:{color:blockquote};
  217.     overflow:auto;
  218. }
  219.  
  220. blockquote blockquote{
  221.     padding-left:10px;
  222.     padding:5px;
  223.     border-left:1px solid {color:blockquoteborder};
  224.     background-color:{color:blockquote2};
  225. }
  226.  
  227. pre{
  228.     font-size:8px;
  229.     {block:indexpage}max-width:390px;{/block:indexpage}
  230.     {block:permalinkpage}max-width:490px;{/block:permalinkpage}
  231.     overflow:auto;
  232.     background-color:#bcbbbb;
  233.     padding:5px;
  234.     font-family:tinytots;
  235.     text-align:center;
  236. }
  237.  
  238. pre::-webkit-scrollbar {
  239.     width: 2px;
  240.     height: 2px;
  241. }
  242.  
  243. pre::-webkit-scrollbar-thumb {
  244.     background: {color:scrollbar};
  245. }
  246.  
  247. ::selection {
  248. background:{color:selection};
  249. color: {color:selectiontext};
  250. }
  251.  
  252. ::-moz-selection {
  253. background: {color:selection};
  254. color: {color:selectiontext};
  255. }
  256.  
  257. ::-webkit-selection {
  258. background: {color:selection};
  259. color: {color:selectiontext};
  260. }
  261.  
  262.  
  263. /*bars without alcohol*/
  264.  
  265. #bar1{
  266.     position:fixed;
  267.     bottom:200px;
  268.     height:15px;
  269.     width:100%;
  270.     left:0;
  271.     background-color:{color:backgroundbar1};
  272.     border-top:solid 3px {color:backgroundedge1};
  273.     border-bottom:solid 3px {color:backgroundedge1};
  274.     z-index:-1;
  275. }
  276.  
  277. #bar2{
  278.     position:fixed;
  279.     bottom:230px;
  280.     height:50px;
  281.     width:100%;
  282.     left:0;
  283.     background-color:{color:backgroundbar2};
  284.     border-top:solid 3px {color:backgroundedge2};
  285.     border-bottom:solid 3px {color:backgroundedge2};
  286.     z-index:-1;
  287. }
  288.  
  289. /*the top thing*/
  290.  
  291. #topbar{
  292.     position:absolute;
  293.     top:0;
  294.     left:0;
  295.     height:150px;
  296.     width:100%;
  297.     background-color:{color:topbar};
  298.     z-index:1;
  299.     text-align:center;
  300.     -webkit-transition: all 0.5s linear;
  301.     -moz-transition: all 0.5s linear;
  302.     -o-transition: all 0.5s linear;
  303. }
  304.  
  305. #topborder{
  306.     margin-top:-2px;
  307.     height:35px;
  308.     padding-top:10px;
  309.     width:100%;
  310.     left:0;
  311.     padding-left:7px;
  312.     z-index:999;
  313.     text-align:center;
  314.     background-color:{color:topborder};
  315.     border-top:solid 3px {color:topborderedge};
  316.     border-bottom:solid 3px {color:topborderedge};
  317.     -webkit-transition: all 0.5s linear;
  318.     -moz-transition: all 0.5s linear;
  319.     -o-transition: all 0.5s linear;
  320. }
  321.  
  322.  
  323.  .sticky{
  324.      position:fixed;
  325.      top:0;
  326.      box-shadow:0px 3px 0px #888888;
  327.  }
  328.  
  329. .headerimg{
  330.     display:inline-block;
  331.     height:150px;
  332.     border-right:solid 3px {color:topborderedge};
  333.     border-left:solid 3px {color:topborderedge};
  334. }
  335.  
  336. .main{
  337.     position:absolute;
  338.     width:100%;
  339.     margin-top:55px;
  340.     color:{color:title};
  341.     opacity:1;
  342.     font-size:45px;
  343.     text-transform:lowercase;
  344.     font-family: 'Josefin Sans', sans-serif;
  345.     -webkit-transition: all 0.5s linear;
  346.     -moz-transition: all 0.5s linear;
  347.     -o-transition: all 0.5s linear;
  348. }
  349.    
  350. #topbar:hover .main{
  351.     opacity:0;
  352.     letter-spacing:20px;
  353. }
  354.  
  355. .sub{
  356.     position:absolute;
  357.     width:100%;
  358.     margin-top:55px;
  359.     color:{color:subtitle};
  360.     opacity:0;
  361.     font-size:40px;
  362.     letter-spacing:20px;
  363.     text-transform:lowercase;
  364.     font-family: 'Josefin Sans', sans-serif;
  365.     -webkit-transition: all 0.5s linear;
  366.     -moz-transition: all 0.5s linear;
  367.     -o-transition: all 0.5s linear;
  368. }
  369.    
  370. #topbar:hover .sub{
  371.     opacity:1;
  372.     letter-spacing:0px;
  373.     transition-delay: 0.5s;
  374.     -webkit-transition-delay: 0.5s;
  375.     -moz-transition-delay: 0.5s;
  376.     -o-transition-delay: 0.5s;
  377. }
  378.  
  379. /*navigation party*/
  380.  
  381. .custom{
  382.    max-width:80px;
  383.    height:15px;
  384.    padding:2px 5px 2px 5px;
  385.    color:{color:customlinks};
  386.    background-color:{color:custom};
  387.    border-left:solid 3px transparent;
  388.    border-right:solid 3px transparent;
  389.    font-family: 'Muli', sans-serif;
  390.    font-size:10px;
  391.    letter-spacing:2px;
  392.    text-transform:lowercase;
  393.    -webkit-transition: all 0.3s linear;
  394.     -moz-transition: all 0.3s linear;
  395.     -o-transition: all 0.3s linear;
  396. }
  397.  
  398. .custom:hover{
  399.     padding:2px 7px 2px 7px;
  400.     color:{color:customlinkhover};
  401.     background-color:transparent;
  402.     border-left:solid 3px {color:customborder};
  403.    border-right:solid 3px {color:customborder};
  404. }
  405.  
  406. .nav{
  407.     height:15px;
  408.     width:15px;
  409.     border-left:solid 3px transparent;
  410.     border-right:solid 3px transparent;
  411.     padding:2px;
  412.     background-color:{color:nav};
  413.     -webkit-transition: all 0.3s linear;
  414.     -moz-transition: all 0.3s linear;
  415.     -o-transition: all 0.3s linear;
  416. }
  417.  
  418. .nav:hover{
  419.     height:15px;
  420.     width:15px;
  421.     border-left:solid 3px {color:navborder};
  422.     border-right:solid 3px {color:navborder};
  423.     padding:2px 5px 2px 5px;
  424.     background-color:transparent;
  425.     -webkit-transition: all 0.3s linear;
  426.     -moz-transition: all 0.3s linear;
  427.     -o-transition: all 0.3s linear;
  428. }
  429.  
  430. /*description yo*/
  431.  
  432. #descback{
  433.     position:fixed;
  434.     margin-top:235px;
  435.     margin-left:10%;
  436.     height:200px;
  437.     width:170px;
  438.     z-index:1;
  439.     background-color:{color:descriptionback};
  440.     border-top:solid 3px {color:descriptionedge};
  441.     border-bottom:solid 3px {color:descriptionedge};
  442.     -webkit-transition: all 0.3s linear;
  443.     -moz-transition: all 0.3s linear;
  444.     -o-transition: all 0.3s linear;
  445. }
  446.  
  447.  .stickydesc{
  448.      position:fixed;
  449.      top:-80px;
  450.      -webkit-transition: all 0.5s linear;
  451.     -moz-transition: all 0.5s linear;
  452.     -o-transition: all 0.5s linear;
  453.  }
  454.  
  455. .desc{
  456.     position:fixed;
  457.     margin-top:15px;
  458.     margin-left:10px;
  459.     height:170px;
  460.     width:150px;
  461.     overflow:auto;
  462.     text-align:center;
  463.     padding-right:5px;
  464.     line-height:120%;
  465.     color:{color:description};
  466. }
  467.  
  468. .desc::-webkit-scrollbar {
  469.     width: 7px;
  470.     height: 7px;
  471.     background-color:{color:scrollbarback};
  472. }
  473.  
  474. .desc::-webkit-scrollbar-thumb {
  475.     background: {color:scrollbar};
  476. }
  477.  
  478. .pagination{
  479.     position:fixed;
  480.     margin-top:200px;
  481.     width:170px;
  482.     height:80px;
  483.     text-align:center;
  484.     font-family:tinytots;
  485.     font-size:30px;
  486.     -webkit-transition: all 0.3s linear;
  487.     -moz-transition: all 0.3s linear;
  488.     -o-transition: all 0.3s linear;
  489. }
  490. }
  491.  
  492. .pagination a{
  493.     color:{color:pagination};
  494. }
  495.  
  496. .pagination a:hover{
  497.     font-size:35px;
  498.     color:{color:description};
  499. }
  500.  
  501.  
  502. /*posts*/
  503.  
  504.  
  505. #postmargin{
  506.     padding-top:215px;
  507.     margin: 0 auto;
  508.    
  509.     {block:indexpage}
  510.         {block:if250pxposts}width:250px;{/block:if250pxposts}
  511.         {block:if400pxposts}width:400px;{/block:if400pxposts}
  512.         {block:if500pxposts}width:500px;{/block:if500pxposts}
  513.     {/block:indexpage}
  514.    
  515.     {block:permalinkpage}
  516.         width:500px;
  517.     {/block:permalinkpage}
  518.      z-index:9999;
  519.    
  520. }
  521.  
  522. .posts{
  523.    
  524.    {block:indexpage}
  525.         {block:if250pxposts}width:250px;{/block:if250pxposts}
  526.         {block:if400pxposts}width:400px;{/block:if400pxposts}
  527.         {block:if500pxposts}width:500px;{/block:if500pxposts}
  528.     {/block:indexpage}
  529.    
  530.     {block:permalinkpage}
  531.         width:500px;
  532.     {/block:permalinkpage}
  533.    
  534.     padding:7px;
  535.     margin-bottom:13px;
  536.     margin-right:10px;
  537.     background-color:{color:post};
  538.     -webkit-transition: all 0.5s linear;
  539.     -moz-transition: all 0.5s linear;
  540.     -o-transition: all 0.5s linear;
  541.    
  542.  
  543. }
  544.  
  545. .posts:hover{
  546.    
  547. }
  548.  
  549.  
  550. .posts:hover img{
  551.      opacity:1;
  552.     {block:ifmonochrome}
  553.     {block:indexpage}
  554.         -webkit-filter: grayscale(0%);
  555.         -moz-filter: grayscale(0%);
  556.         -ms-filter: grayscale(0%);
  557.         -o-filter: grayscale(0%);
  558.     {/block:indexpage}
  559.     {/block:ifmonochrome}
  560.      
  561. }
  562.  
  563. .posts img{
  564.     border:none;
  565.     max-width:100%;
  566.     -webkit-transition: all 0.7s linear;
  567.     -moz-transition: all 0.7s linear;
  568.     -o-transition: all 0.7s linear;
  569.     opacity:0.9;
  570.     {block:ifmonochrome}
  571.     {block:indexpage}
  572.         -webkit-filter: grayscale(100%);
  573.         -moz-filter: grayscale(100%);
  574.         -ms-filter: grayscale(100%);
  575.         -o-filter: grayscale(100%);
  576.     {/block:indexpage}
  577.     {/block:ifmonochrome}  
  578. }
  579.  
  580.  
  581. .posts iframe{
  582.     border:none;
  583.     opacity:0.9;    
  584.     -webkit-transition: all 0.7s linear;
  585.     -moz-transition: all 0.7s linear;
  586.     -o-transition: all 0.7s linear;
  587.     {block:ifmonochrome}
  588.     {block:indexpage}
  589.         -webkit-filter: grayscale(100%);
  590.         -moz-filter: grayscale(100%);
  591.         -ms-filter: grayscale(100%);
  592.         -o-filter: grayscale(100%);
  593.     {/block:indexpage}
  594.     {/block:ifmonochrome}
  595.  
  596. }
  597.  
  598. .posts:hover iframe{
  599.     opacity:1;
  600.     {block:ifmonochrome}
  601.     {block:indexpage}
  602.         -webkit-filter: grayscale(0%);
  603.         -moz-filter: grayscale(0%);
  604.         -ms-filter: grayscale(0%);
  605.         -o-filter: grayscale(0%);
  606.     {/block:indexpage}
  607.     {/block:ifmonochrome}
  608.  }
  609.  
  610.  
  611. .posts a{
  612.     text-decoration:none;
  613.     outline:none;
  614.     -moz-outline-style:none;
  615.     color:{color:postlinks};
  616.     -webkit-transition: all 0.3s linear;
  617.     -moz-transition: all 0.3s linear;
  618.     -o-transition: all 0.3s linear;    
  619. }
  620.  
  621. .posts a:hover{
  622.     color:{color:postlinkhover};
  623.     text-shadow:0px 0px 3px #888888;
  624. }
  625.  
  626.  
  627. #permalink{
  628.     {block:indexpage}
  629.         {block:if250pxposts}width:230px;{/block:if250pxposts}
  630.         {block:if400pxposts}width:380px;{/block:if400pxposts}
  631.         {block:if500pxposts}width:480px;{/block:if500pxposts}
  632.         {block:ifhiddenpermalink}
  633.             height:0;
  634.             padding:0px 10px 0px 10px;
  635.             opacity:0;
  636.             {block:ifhiddendescriptions}
  637.                 border-top:solid 0px {color:post};
  638.             {/block:ifhiddendescriptions}
  639.         {/block:ifhiddenpermalink}
  640.         {block:ifnothiddenpermalink}
  641.             height:auto;
  642.             padding:10px;
  643.             {block:ifhiddendescriptions}
  644.                 border-top:solid 7px {color:post};
  645.             {/block:ifhiddendescriptions}
  646.         {/block:ifnothiddenpermalink}
  647.     {/block:indexpage}
  648.    
  649.     {block:permalinkpage}
  650.         width:480px;
  651.         height:auto;
  652.         padding:10px;
  653.     {/block:permalinkpage}
  654.  
  655.    
  656.     background-color:{color:permalink};
  657.     color:{color:permalinktext};
  658.     text-align:center;
  659.     font-family: 'Muli', sans-serif;
  660.     text-transform:lowercase;
  661.     font-size:9x;
  662.     overflow:hidden;
  663.     -webkit-transition: all 0.5s linear;
  664.     -moz-transition: all 0.5s linear;
  665.     -o-transition: all 0.5s linear;
  666. }
  667.  
  668. .posts:hover #permalink{
  669.     {block:indexpage}
  670.         {block:ifhiddenpermalink}
  671.             height:auto;
  672.             padding:10px;
  673.             opacity:1;
  674.             {block:ifhiddendescriptions}
  675.             border-top:solid 7px {color:post};
  676.             {/block:ifhiddendescriptions}
  677.         {/block:ifhiddenpermalink}
  678.     {/block:indexpage}
  679. }
  680.    
  681.  
  682. .permalink a{
  683.     color:{color:datelinks};
  684. }
  685.  
  686. .permalink a:hover{
  687.     color:{color:datelinkhover};
  688. }
  689.  
  690. .permalink{
  691.        
  692. }
  693.  
  694. .tags{
  695.     padding-top:2px;
  696.     padding-bottom:1px;
  697.     border-top: solid 2px {color:permalinkborder};
  698.     border-bottom: solid 2px {color:permalinkborder};
  699.     background-color:white;
  700. }
  701.  
  702. .tags a{
  703.         color:{color:taglinks};
  704. }
  705.  
  706. .tags a:hover{
  707.     color:{color:taglinkhover};
  708. }
  709.    
  710.    
  711.  
  712. #quote {
  713.         font-family: 'Muli', sans-serif;
  714.         {block:indexpage}
  715.             {block:if250pxposts}font-size:15px;{/block:if250pxposts}
  716.             {block:if400pxposts}font-size:18px;{/block:if400pxposts}
  717.             {block:if500pxposts}font-size:20px;{/block:if500pxposts}
  718.         {/block:indexpage}
  719.         {block:permalinkpage}
  720.             font-size:20px;
  721.         {/block:permalinkpage}
  722.    
  723.     color:{color:quote};
  724.     padding-left:20px;
  725.     padding-right:20px;
  726.     padding-top:10px;
  727.     line-height:100%;
  728.     text-align:justify;
  729.     text-transform:lowercase;
  730. }
  731.  
  732. #title {
  733.     font-family: 'Josefin Sans', sans-serif;
  734.         {block:indexpage}
  735.             {block:if250pxposts}font-size:20px;{/block:if250pxposts}
  736.             {block:if400pxposts}font-size:30px;{/block:if400pxposts}
  737.             {block:if500pxposts}font-size:30px;{/block:if500pxposts}
  738.         {/block:indexpage}
  739.         {block:permalinkpage}
  740.             font-size:30px;
  741.         {/block:permalinkpage}
  742.     color:{color:quote};
  743.     padding-left:20px;
  744.     padding-right:20px;
  745.     padding-top:10px;
  746.     padding-bottom:5px;
  747.     line-height:100%;
  748.     text-transform:lowercase;
  749. }
  750.  
  751.  
  752. #audioplayer {
  753.     width:28px;
  754.     height:30px;
  755.     overflow:hidden;
  756.     position:absolute;
  757.     margin-top:40px;
  758.     margin-left:35px;
  759.     z-index:99;
  760. }
  761.  
  762. #musicinfo{
  763.     color:{color:text};
  764.     margin-top:-90px;
  765.     margin-left:110px;
  766.     background-color:{color:blockquote2};
  767.     padding-left:10px;
  768.     padding-top:5px;
  769.     padding-right:5px;
  770.     padding-bottom:5px;
  771.     line-height:110%;
  772.     margin-bottom:50px;
  773. }
  774.  
  775. #audiocaption{
  776.     margin-top:-15px;
  777.     padding-left:10px;
  778.     padding-right:10px;
  779. }
  780.  
  781. #albumart{
  782.     height:100px;
  783.     width:100px;
  784.     background-image:url('https://lh3.googleusercontent.com/-ABbl71o4DHE/UZh6Xuh6QJI/AAAAAAAAEn8/j49R7fSCZHE/s200-no/Untitled-1.jpg');
  785.     background-position:fixed;
  786.     background-size:100px 100px;
  787.     background-repeat:no-repeat;
  788.     z-index:-1;
  789.     -webkit-transition: all 0.5s linear;
  790.     -moz-transition: all 0.5s linear;
  791.     -o-transition: all 0.5s linear;
  792. }
  793.  
  794.  
  795. .askicon {
  796.     position:absolute;
  797.     {block:indexpage}
  798.         {block:if250pxposts}margin-left:20px;{/block:if250pxposts}
  799.         {block:if400pxposts}margin-left:100px;{/block:if400pxposts}
  800.         {block:if500pxposts}margin-left:100px;{/block:if500pxposts}
  801.     {/block:indexpage}
  802.     {block:permalinkpage}
  803.         margin-left:100px;
  804.     {/block:permalinkpage}
  805. }
  806.  
  807. #triangle {
  808.     {block:indexpage}
  809.         {block:if250pxposts}margin-left:27px;{/block:if250pxposts}
  810.         {block:if400pxposts}margin-left:107px;{/block:if400pxposts}
  811.         {block:if500pxposts}margin-left:107px;{/block:if500pxposts}
  812.     {/block:indexpage}
  813.     {block:permalinkpage}
  814.         margin-left:107px;
  815.     {/block:permalinkpage}
  816.     width: 0;
  817.     height: 0;
  818.     border-left: 7px solid transparent;
  819.     border-right: 7px solid transparent;
  820.         border-top: 15px solid {color:blockquote2};
  821. }
  822.  
  823.  
  824. #askz {
  825.     padding:10px;
  826.     line-height: 140%;
  827.     {block:indexpage}
  828.         {block:if250pxposts}width:230px;{/block:if250pxposts}
  829.         {block:if400pxposts}width:380px;{/block:if400pxposts}
  830.         {block:if500pxposts}width:480px;{/block:if500pxposts}
  831.     {/block:indexpage}
  832.     {block:permalinkpage}
  833.         width:480px;
  834.     {/block:permalinkpage}
  835.     color:{color:question};
  836.     text-align:justify;
  837.  
  838.     background-color:{color:blockquote2};
  839. }
  840.  
  841. #qask{
  842.     {block:indexpage}
  843.         {block:if250pxposts}margin-left:35px;{/block:if250pxposts}
  844.         {block:if400pxposts}margin-left:115px;{/block:if400pxposts}
  845.         {block:if500pxposts}margin-left:115px;{/block:if500pxposts}
  846.     {/block:indexpage}
  847.     {block:permalinkpage}
  848.         margin-left:115px;
  849.     {/block:permalinkpage}
  850.     margin-top:8px;
  851.     padding-right:10px;
  852.     padding-top:3px;
  853.     padding-bottom:3px;
  854.     padding-left:30px;
  855.     font-size:9px;
  856.     max-width:180px;
  857.     font-family:tinytots;
  858.     font-size:8px;
  859.     text-transform:uppercase;
  860.     background-color:{color:blockquote};
  861. }
  862.  
  863. #answer {
  864.     padding:5px;
  865.     {block:indexpage}
  866.         {block:if250pxposts}
  867.             margin-left:10px;
  868.             width:220px;
  869.         {/block:if250pxposts}
  870.         {block:if400pxposts}
  871.             margin-left:30px;
  872.             width:330px;
  873.         {/block:if400pxposts}
  874.         {block:if500pxposts}
  875.             margin-left:30px;
  876.             width:430px;
  877.         {/block:if500pxposts}
  878.     {/block:indexpage}
  879.     {block:permalinkpage}
  880.         margin-left:30px;
  881.         width:430px;
  882.     {/block:permalinkpage}
  883.     text-align:justify;
  884. }
  885.  
  886. #answer img{
  887.     max-width:100%;
  888.     height:auto;
  889. }
  890.  
  891. .posts:hover #answer img{
  892.     box-shadow: 0px 0px 0px #9e9797;
  893. }
  894.  
  895. ol.notes{
  896.     max-width:500px;
  897.     padding:0px;
  898.     margin: 0px 30px;
  899.     list-style-type:none;
  900.     font-size:9px;
  901.     font-family: 'Muli', sans-serif;
  902. }
  903.  
  904. ol.notes li.note{
  905.     padding:0px;
  906. }
  907.  
  908. ol.notes li.note img{
  909.     margin-top:7px;
  910. }
  911.  
  912. ol.notes li.note img.avatar{
  913.     margin-right:3px;
  914.     width:16px;
  915.     height:16px;
  916. }
  917.  
  918. ol.notes li.note a img.avatar{
  919.     padding:0px;
  920.     border-width:0 px;
  921.     border:none;
  922. }
  923.  
  924. ol.notes li.note img{
  925.     padding:0 px;
  926.     border-width:0 px;
  927.     border:none;
  928. }
  929.  
  930. ol.notes li.note span.action{
  931.     color:{color:text};
  932. }
  933.  
  934. ol.notes li.note.answer_content{
  935.     font-weight:normal;
  936. }
  937.  
  938. ol.notes li.note.blockquote{
  939.     padding:1 px 1 px;margin:1px 0px 0px 1px;
  940. }
  941.  
  942. ol.notes li.note.blockquote a{
  943.     text-decoration:none;
  944. }
  945.  
  946. ol.notes li.note a{
  947.     color:{color:text};
  948. }
  949.  
  950. ol.notes li.note a:hover{
  951.     color:{color:description};
  952. }
  953.  
  954.  
  955.  
  956.  /*etc*/
  957.  
  958. #credit{
  959.     position:fixed;
  960.     bottom:10px;
  961.     right:10px;
  962.     z-index:1;
  963.     -webkit-transition: all 0.3s linear;
  964.     -moz-transition: all 0.3s linear;
  965.     -o-transition: all 0.3s linear;
  966.     -ms-transition: all 0.3s linear;
  967.         -webkit-filter: grayscale(100%);
  968.       -moz-filter: grayscale(100%);
  969.       -ms-filter: grayscale(100%);
  970.       -o-filter: grayscale(100%);
  971. }
  972.  
  973. #credit:hover{
  974.      -webkit-filter: grayscale(0%);
  975.   -moz-filter: grayscale(0%);
  976.   -ms-filter: grayscale(0%);
  977.   -o-filter: grayscale(0%);
  978. }
  979.    
  980.  #s-m-t-tooltip{
  981.   max-width:300px;
  982.   z-index:10;
  983.   margin:24px 14px 7px 12px;
  984.   padding:5px;
  985.   background:#232323;
  986.   -moz-border-radius:0px;
  987.   -webkit-border-radius:0px;
  988.   border-radius:0px;
  989.   -moz-box-shadow:0px 0px 3px #232323;
  990.   -webkit-box-shadow:0px 0px 3px #232323;
  991.   box-shadow:0px 0px 3px #232323;
  992.   font-family:tinytots;
  993.   font-size:8px;
  994.   text-transform:uppercase;
  995.   color:#fff;
  996. }
  997.    
  998.  
  999. {CustomCSS}
  1000.    
  1001. body {cursor: url(http://www.dolliehost.com/dolliecrave/cursors/cursors-arrow/arrow38.gif), progress !important;}
  1002.    
  1003. a:hover {cursor: url(http://cur.cursors-4u.net/others/oth-6/oth589.cur), progress !important;}
  1004.    
  1005. </style>
  1006.  
  1007.    
  1008.  
  1009.    
  1010. <script type="text/javascript" src="http://codysherman.tumblr.com/tools/infinite-scrolling/code"></script>
  1011.  
  1012. <!--sticky script credit goes to fukuo themes at http://fukuo.co.vu/-->
  1013.    
  1014. <script  type="text/javascript">
  1015.  
  1016.  
  1017.         $(document).ready(function() {
  1018.             // grab the initial top offset of the navigation
  1019.             var stickyNavTop = $('#topborder').offset().top;
  1020.            
  1021.             // our function that decides weather the navigation bar should have "fixed" css position or not.
  1022.             var stickyNav = function(){
  1023.                 var scrollTop = $(window).scrollTop(); // our current vertical position from the top
  1024.                      
  1025.                 // if we've scrolled more than the navigation, change its position to fixed to stick to top,
  1026.                 // otherwise change it back to relative
  1027.                 if (scrollTop > stickyNavTop) {
  1028.                     $('#topborder').addClass('sticky');
  1029.                 } else {
  1030.                     $('#topborder').removeClass('sticky');
  1031.                 }
  1032.             };
  1033.  
  1034.             stickyNav();
  1035.             // and run it again every time you scroll
  1036.             $(window).scroll(function() {
  1037.                 stickyNav();
  1038.             });
  1039.         });
  1040.    
  1041.  
  1042. </script>
  1043.  
  1044. <script  type="text/javascript">
  1045.  
  1046.  
  1047.         $(document).ready(function() {
  1048.             // grab the initial top offset of the navigation
  1049.             var stickyNavTop = $('#descback').offset().top;
  1050.            
  1051.             // our function that decides weather the navigation bar should have "fixed" css position or not.
  1052.             var stickyNav = function(){
  1053.                 var scrollTop = $(window).scrollTop(); // our current vertical position from the top
  1054.                      
  1055.                 // if we've scrolled more than the navigation, change its position to fixed to stick to top,
  1056.                 // otherwise change it back to relative
  1057.                 if (scrollTop > stickyNavTop) {
  1058.                     $('#descback').addClass('stickydesc');
  1059.                 } else {
  1060.                     $('#descback').removeClass('stickydesc');
  1061.                 }
  1062.             };
  1063.  
  1064.             stickyNav();
  1065.             // and run it again every time you scroll
  1066.             $(window).scroll(function() {
  1067.                 stickyNav();
  1068.             });
  1069.         });
  1070.    
  1071.  
  1072. </script>
  1073.  
  1074.    
  1075. </head><body>
  1076.  
  1077.  <a href="http://redfox-themes.tumblr.com"><img src="https://lh5.googleusercontent.com/-jDb8l0m6g2s/ULvHPyFukjI/AAAAAAAACoA/FRBmvQsxRkc/s22/fox.gif" id="credit" title="redfox themes"></a>
  1078.  
  1079.  
  1080.  
  1081. <div id="bar1"></div>
  1082. <div id="bar2"></div>
  1083.  
  1084. <div id="topbar">
  1085.     <div class="main">{{title}}</div>
  1086.     <div class="sub">{text:subtitle}</div>
  1087.     <img src="{image:header}" class="headerimg">
  1088.     <div id="topborder">
  1089.         {block:iflink1}<a href="{text:link1URL}" class="custom">{text:link1}</a>{/block:iflink1}
  1090.         {block:iflink2}<a href="{text:link2URL}" class="custom">{text:link2}</a>{/block:iflink2}
  1091.         {block:iflink3}<a href="{text:link3URL}" class="custom">{text:link3}</a>{/block:iflink3}
  1092.         <a href="/"><img src="https://lh4.googleusercontent.com/-Zi_VZLhMALE/UdsezSoD2LI/AAAAAAAAFTI/3zWja9BBn5M/w26-h30-no/hodddmihihe.png" title="home" class="nav"></a>
  1093.         <a href="/ask"><img src="https://lh6.googleusercontent.com/-FIiV5waLv-E/UdseGcrIlmI/AAAAAAAAFSs/w4I-ryB1vx4/s32-no/chat-alt-1.png" title="message" class="nav"></a>
  1094.         <a href="/archive"><img src="https://lh4.googleusercontent.com/-oiGrlsZGo3E/UdseGTSm4-I/AAAAAAAAFSo/rHxFVze7dak/s32-no/time.png" title="archive" class="nav"></a>
  1095.         {block:iflink4}<a href="{text:link4URL}" class="custom">{text:link4}</a>{/block:iflink4}
  1096.         {block:iflink5}<a href="{text:link5URL}" class="custom">{text:link5}</a>{/block:iflink5}
  1097.         {block:iflink6}<a href="{text:link6URL}" class="custom">{text:link6}</a>{/block:iflink6}
  1098.     </div>
  1099. </div>
  1100.  
  1101. <div id="descback">
  1102.     <div class="desc">{description}</div>
  1103.     {block:ifnotinfinitescroll}{block:Pagination}<div class="pagination">
  1104.         {block:PreviousPage}
  1105.             <a href="{PreviousPage}">&#171;</a>
  1106.         {/block:PreviousPage}
  1107.         {block:NextPage}
  1108.             <a href="{NextPage}">&#187;</a>
  1109.         {/block:NextPage}
  1110.     </div>{/block:Pagination}{/block:ifnotinfinitescroll}
  1111. </div>
  1112.  
  1113.  
  1114. <div id="postmargin">
  1115.     {block:ifinfinitescroll}<div class="autopagerize_page_element">{/block:ifinfinitescroll}
  1116.     {block:Posts}
  1117. <div class="posts">
  1118.  
  1119.  
  1120. {block:Text}
  1121.     <center>
  1122.         <div id="title">{block:Title}{Title}{/block:Title}</div>
  1123.     </center>
  1124.     {Body}
  1125. {/block:Text}
  1126.  
  1127.  
  1128. {block:Photo}
  1129.     <center>
  1130.         <img src="{PhotoURL-500}" width="500">
  1131.     </center>
  1132.     {block:indexpage}
  1133.         {block:ifnothiddendescriptions}
  1134.             {block:Caption}
  1135.                 {Caption}
  1136.             {/block:Caption}
  1137.         {/block:ifnothiddendescriptions}
  1138.     {/block:indexpage}
  1139.     {block:permalinkpage}
  1140.         {block:Caption}
  1141.             {Caption}
  1142.         {/block:Caption}
  1143.     {/block:permalinkpage}
  1144. {/block:Photo}
  1145.  
  1146.  
  1147. {block:Photoset}
  1148.     <center>
  1149.         {block:indexpage}
  1150.             {block:if250pxposts}{Photoset-250}{/block:if250pxposts}
  1151.             {block:if400pxposts}{Photoset-400}{/block:if400pxposts}
  1152.             {block:if500pxposts}{Photoset-500}{/block:if500pxposts}
  1153.         {/block:indexpage}
  1154.         {block:permalinkpage}
  1155.             {Photoset-500}
  1156.         {/block:permalinkpage}
  1157.     </center>
  1158.     {block:indexpage}
  1159.         {block:ifnothiddendescriptions}
  1160.             {block:Caption}
  1161.                 {Caption}
  1162.             {/block:Caption}
  1163.         {/block:ifnothiddendescriptions}
  1164.     {/block:indexpage}
  1165.     {block:permalinkpage}
  1166.         {block:Caption}
  1167.             {Caption}
  1168.         {/block:Caption}
  1169.     {/block:permalinkpage}
  1170. {/block:Photoset}
  1171.  
  1172.  
  1173. {block:Quote}
  1174.     <div id="quote">
  1175.         {Quote}
  1176.     </div>
  1177.         <p align="right">
  1178.             {block:Source}
  1179.                 —{Source}
  1180.             {/block:Source}
  1181.         </p>
  1182. {/block:Quote}
  1183.  
  1184.  
  1185. {block:Link}
  1186.     <div id="title" align="center"><t>
  1187.         <a href="{URL}" {Target}>{Name}</a>
  1188.     </t></div>
  1189.     {block:Description}
  1190.         {Description}
  1191.     {/block:Description}
  1192. {/block:Link}
  1193.  
  1194.  
  1195. {block:Chat}
  1196.     <div id="title" align="center">
  1197.         {block:Title}<t>
  1198.             {Title}
  1199.         </t>{/block:Title}
  1200.     </div>
  1201.     <p>{block:Lines}
  1202.         {block:Label}
  1203.             <b>{Label}</b>
  1204.         {/block:Label}
  1205.         {Line}
  1206.         <br>
  1207.     {/block:Lines}</p>
  1208. {/block:Chat}
  1209.  
  1210.  
  1211. {block:Audio}
  1212.     <div id="audioplayer">
  1213.         {AudioPlayerWhite}
  1214.     </div>
  1215.     <div id="albumart">
  1216.         {block:AlbumArt}
  1217.             <img src="{AlbumArtURL}" width="100">
  1218.         {/block:AlbumArt}
  1219.     </div>
  1220.     <div id="musicinfo">
  1221.         <b>Song:</b> {block:TrackName}{TrackName}{/block:TrackName}
  1222.         <br><br>
  1223.         <b>Artist:</b> {block:Artist}{Artist}{/block:Artist}
  1224.         <br><br>
  1225.         <b>Album:</b> {block:Album}{Album}{/block:Album}
  1226.     </div>
  1227.     {block:caption}
  1228.         <div id="audiocaption">
  1229.             {caption}
  1230.         </div>
  1231.     {/block:caption}
  1232. {/block:Audio}
  1233.  
  1234.  
  1235. {block:Video}
  1236.     {block:indexpage}
  1237.         {block:if250pxposts}{Video-250}{/block:if250pxposts}
  1238.         {block:if400pxposts}{Video-400}{/block:if400pxposts}
  1239.         {block:if500pxposts}{Video-500}{/block:if500pxposts}
  1240.     {/block:indexpage}
  1241.     {block:permalinkpage}
  1242.         {Video-500}
  1243.     {/block:permalinkpage}
  1244.     {block:indexpage}
  1245.         {block:ifnothiddendescriptions}
  1246.             {block:Caption}
  1247.                 {Caption}
  1248.             {/block:Caption}
  1249.         {/block:ifnothiddendescriptions}
  1250.     {/block:indexpage}
  1251.     {block:permalinkpage}
  1252.         {block:Caption}
  1253.             {Caption}
  1254.         {/block:Caption}
  1255.     {/block:permalinkpage}
  1256. {/block:Video}
  1257.  
  1258. {block:Answer}
  1259.     <div id="askz">
  1260.         {Question}
  1261.     </div>
  1262.     <div id="triangle"></div>
  1263.     <img src="{AskerPortraitURL-30}" class="askicon">
  1264.     <div id="qask">
  1265.         {Asker} said—
  1266.     </div>
  1267.     <div id="answer">
  1268.         {Answer}
  1269.     </div>
  1270. {/block:Answer}
  1271.  
  1272.  
  1273.  
  1274.  {block:Date}
  1275.     <div id="permalink">
  1276.        <div class="permalink">
  1277.        
  1278.     {block:if250pxposts}    
  1279.         <a href="{Permalink}">{12Hour}:{Minutes}</a> on <a href="{Permalink}">{ShortMonth} {DayOfMonth}, {Year}</a> with <a href="{Permalink}">{NoteCount} notes</a> {block:RebloggedFrom}|| <a title="{ReblogRootName}" href="{ReblogRootURL}">OP</a> &#8226; <a href="{ReblogParentURL}" title="{ReblogParentName}">VIA</a>{/block:RebloggedFrom}
  1280.     {/block:if250pxposts}
  1281.    
  1282.     {block:ifnot250pxposts}    
  1283.        { <a href="{Permalink}">{Month} {DayOfMonth}, {Year}</a> } || { <a href="{Permalink}">{12hour}:{minutes}{ampm}</a> } || { <a href="{Permalink}">{NoteCount} notes</a> } {block:RebloggedFrom}|| { <a href="{ReblogRootURL}" title="{ReblogRootName}">OP</a> &#8226; <a href="{ReblogParentURL}" title="{ReblogParentName}">VIA</a> } {/block:RebloggedFrom}
  1284.     {/block:ifnot250pxposts}
  1285.    
  1286.         </div>
  1287.        
  1288.        {block:HasTags}<br><div class="tags">{block:Tags}
  1289.     <b>x</b><a href="/tagged/{Tag}">{Tag} </a>
  1290.          {/block:Tags}</div>{/block:HasTags}
  1291.          
  1292.    </div>
  1293.  {/block:Date}
  1294.  
  1295.  
  1296. </div>
  1297.  
  1298.  
  1299.  
  1300. <div class="notes">
  1301.     {block:PostNotes}
  1302.         <a name="notes">
  1303.             {PostNotes}
  1304.         </a>
  1305.     {/block:PostNotes}
  1306. </div>
  1307.  
  1308.  
  1309.  
  1310. {/block:Posts}</div></div>
  1311.  
  1312.  
  1313.  
  1314. </body></html>
Add Comment
Please, Sign In to add comment