Advertisement
addictcastiel

theme #4 by dixcndaryl.tumblr.com

Jun 20th, 2015
601
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 35.45 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. <head>
  4. <title>{Title}</title>
  5. <link rel="shortcut icon" href="{Favicon}">
  6. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  7. {block:Description}
  8. <meta name="description" content="{MetaDescription}" />
  9. {/block:Description}  
  10.  
  11. <!---------------------------------------------------------------------------
  12. -----------------------------------------------------------------------------
  13. -------------------------THEME #4--------------------------------------------
  14. -------------------------by dixcndaryl.tumblr.com----------------------------
  15. -----------------------------------------------------------------------------
  16. ---------------------------------------------------------------------------->
  17.  
  18. <meta name="image:background" content=""/>
  19. <meta name="image:sidebar" content=""/>
  20. <meta name="color:background" content="#ffffff"/>
  21. <meta name="color:text" content="#838282"/>
  22. <meta name="color:bold" content="#427ea3"/>
  23. <meta name="color:links" content="#758dd6"/>
  24. <meta name="color:sidebar links" content="#529ecc"/>
  25. <meta name="color:links hover" content="#dc9ec8"/>
  26. <meta name="color:borders" content="#eeeeee"/>
  27. <meta name="color:description and captions" content="#eeeeee"/>
  28. <meta name="color:scrollbar" content="#dadfea"/>
  29. <meta name="color:selection background" content="#8ea4d2"/>
  30. <meta name="color:selection text" content="#ffffff"/>
  31. <meta name="color:hover box background" content="#8ea4d2"/>
  32. <meta name="color:hover box text" content="#ffffff"/>
  33. <meta name="color:updates title color" content="#ffffff"/>
  34. <meta name="color:updates tab1" content="#eeeeee"/>
  35. <meta name="color:updates tab2" content="#eeeeee"/>
  36. <meta name="color:updates tab3" content="#eeeeee"/>
  37. <meta name="color:updates tab4" content="#eeeeee"/>
  38. <meta name="color:updates tab5" content="#eeeeee"/>
  39.  
  40. <meta name="text:text above pop up askbox" content="Leave your name, number and nightmare at the tone."/>
  41. <meta name="text:pop up askbox link name" content="ask"/>
  42. <meta name="text:link1" content="link1"/>
  43. <meta name="text:link1 url" content="/"/>
  44. <meta name="text:link2" content="link2"/>
  45. <meta name="text:link2 url" content="/"/>
  46. <meta name="text:link3" content="link3"/>
  47. <meta name="text:link3 url" content="/"/>
  48. <meta name="text:link4" content="link4"/>
  49. <meta name="text:link4 url" content="/"/>
  50. <meta name="text:link5" content="link5"/>
  51. <meta name="text:link5 url" content="/"/>
  52. <meta name="text:updates title1" content="title1"/>
  53. <meta name="text:square1 content" content=""/>
  54. <meta name="text:updates title2" content="title2"/>
  55. <meta name="text:square2 content" content=""/>
  56. <meta name="text:updates title3" content="title3"/>
  57. <meta name="text:square3 content" content=""/>
  58. <meta name="text:updates title4" content="title4"/>
  59. <meta name="text:square4 content" content=""/>
  60. <meta name="text:updates title5" content="title5"/>
  61. <meta name="text:square5 content" content=""/>
  62.  
  63. <meta name="if:50percent grayscale posts" content="1" />
  64. <meta name="if:lazy load" content="1" />
  65. <meta name="if:show hide notes" content="1" />
  66. <meta name="if:pop up askbox" content="1" />
  67. <meta name="if:credit on the right" content="1" />
  68. <meta name="if:updates tab" content="1" />
  69.  
  70.  
  71.  
  72. <!--------------SHOW/HIDE NOTES SCRIPT-------------------------------------->
  73.  
  74. <script type="text/javascript"
  75. src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
  76.  
  77. <script type="text/javascript">
  78. jQuery(document).ready(function() {
  79. jQuery(".sub").hide();
  80. //toggle the componenet with class msg_body
  81. jQuery(".cthrough").click(function()
  82. {
  83. jQuery(this).next(".sub").slideToggle(500);
  84. });});
  85. </script>
  86.  
  87. <script language="javascript">
  88. function toggle() {
  89.         var ele = document.getElementById("toggleText");
  90.         var text = document.getElementById("displayText");
  91.         if(ele.style.display == "block") {
  92.                 ele.style.display = "none";
  93.                 text.innerHTML = "SHOW NOTES";
  94.         }
  95.         else {
  96.                 ele.style.display = "block";
  97.                 text.innerHTML = "HIDE NOTES";
  98.         }
  99. }
  100. </script>
  101.  
  102. <!--------LAZY LOAD SCRIPT-------------------------------------------------->
  103.  
  104. {block:Iflazyload}
  105. <script type="text/javascript" src="http://static.tumblr.com/bmdsqsc/8mXm7q8vn/jquery.js"></script>
  106. <script type="text/javascript" src="http://static.tumblr.com/bmdsqsc/ogWm7q8w1/lazyload.js"></script>
  107. <script type="text/javascript" charset="utf-8">
  108. var $j = jQuery.noConflict();
  109. $j(function() {
  110. if (navigator.platform == "iPad" || navigator.platform == "iPhone") return;
  111. $j("img").lazyload({
  112. placeholder : "http://static.tumblr.com/twte3d7/RSvlio0k5/grey.gif",
  113. effect: "fadeIn",
  114. });
  115. });
  116. </script>
  117. {/block:Iflazyload}
  118.  
  119. <!--------POP-UPS SCRIPT---------------------------------------------------->
  120.  
  121.     <script type="text/javascript"
  122. src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
  123.     <script>
  124.     $(document).ready(function() {
  125.     //
  126.     $('a.poplight[href^=#]').click(function() {
  127.     var popID = $(this).attr('rel'); //Get Popup Name
  128.     var popURL = $(this).attr('href'); //Get Popup href to define size
  129.     var query= popURL.split('?');
  130.     var dim= query[1].split('&');
  131.     var popWidth = dim[0].split('=')[1]; //Gets the first query string value
  132.   $('#' + popID).fadeIn().css({ 'width': Number( popWidth ) }).prepend('<a href="#" class="close"><img src="http://static.tumblr.com/oeljwe1/zORnq701c/untitled-1.png" class="btn_close" title="Close" alt="Close" /></a>');
  133.     var popMargTop = ($('#' + popID).height() + 80) / 2;
  134.     var popMargLeft = ($('#' + popID).width() + 80) / 2;
  135.     //Apply Margin to Popup
  136.     $('#' + popID).css({
  137.     'margin-top' : -popMargTop,
  138.     'margin-left' : -popMargLeft
  139.     });
  140.     $('body').append('<div id="fade"></div>');
  141.     $('#fade').css({'filter' : 'alpha(opacity=80)'}).fadeIn(); //Fade in the fade layer - .css({'filter' : 'alpha(opacity=80)'})
  142.     return false;
  143.     });
  144.     $('a.close, #fade').live('click', function() {
  145.     $('#fade , .popup_block').fadeOut(function() {
  146.     $('#fade, a.close').remove(); //fade them both out
  147.     });
  148.     return false;
  149.     });
  150.     });
  151.     </script>
  152.    
  153. <!------------------FONTS--------------------------------------------------->  
  154. <link href='http://fonts.googleapis.com/css?family=Open+Sans+Condensed:300' rel='stylesheet' type='text/css'>
  155.    
  156. <link href='http://fonts.googleapis.com/css?family=Megrim' rel='stylesheet' type='text/css'>
  157.    
  158. <!------------TOOLTIPS SCRIPT----------------------------------------------->
  159.  
  160. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  161. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  162. <script>
  163. (function($){
  164. $(document).ready(function(){
  165. $("[title]").style_my_tooltips({
  166. tip_follows_cursor:true,
  167. tip_delay_time:0,
  168. tip_fade_speed:400,
  169. attribute:"title"
  170. });
  171. });
  172. })(jQuery);
  173. </script>
  174.  
  175. <!-------------------------------------------------------------------------->
  176.  
  177. <style type="text/css">
  178.  
  179. /********************TOOLTIPS***********************************************/
  180.  
  181. #s-m-t-tooltip {
  182.     opacity: 0.7;
  183.     text-transform: uppercase;
  184.     max-width:150px;
  185.     font-size:8px;
  186.     background-color:{color:hover box background};
  187.     color: {color:hover box text};
  188.     letter-spacing:1px;
  189.     padding:6px;
  190.     margin:20px 0px 0px 10px;
  191.     z-index:9999999999999999999999999999999999;
  192. }
  193.  
  194.  
  195. /********************POP-UPS************************************************/
  196.  
  197. /* CLOSE BUTTON */
  198.  
  199. img.btn_close {
  200.     float: center;
  201.     margin-bottom:10px;
  202.     padding-right:10px;
  203.     cursor: help;
  204. }
  205.  
  206. /* POP-UP ASKBOX */
  207.  
  208. #askland {
  209.     overflow-y:hidden;
  210.     overflow-x:hidden;
  211.     padding-right: 20px;
  212.     padding-left: 40px;
  213.     padding-bottom: 30px;
  214.     padding-top: 30px;
  215.     width:420px;
  216.     height:auto;
  217.     font-size:9px;
  218.     text-align: left;
  219.     text-transform: uppercase;
  220.     color: {color:text};
  221.     background: {color:background};
  222.     font-family:calibri;
  223. }
  224.  
  225. /*****************/
  226.  
  227. #fade {
  228.     display: none;
  229.     background: {color:borders};
  230.     position: fixed; left: 0; top: 0;
  231.     width: 100%; height: 100%;
  232.     opacity: 1;
  233.     z-index: 9999;
  234. }
  235.  
  236. .popup_block{
  237.     display: none;
  238.     background: transparent;
  239.     height:290px;
  240.     padding: 5px;
  241.     text-align:center;
  242.     font-size: 12px;
  243.     position: fixed;
  244.     top: 50%; left: 55%;
  245.     z-index: 99999;
  246. }
  247.    
  248. *html #fade {
  249.     position: absolute;
  250. }
  251.  
  252. *html .popup_block {
  253.     position: absolute;
  254. }
  255.  
  256.  
  257. /********************INVERTED TUMBLR CONTROLS*******************************/
  258.  
  259. iframe#tumblr_controls {
  260.     white-space:nowrap;
  261.     -webkit-filter: invert(100%);
  262.     -moz-filter: invert(100%);
  263.     -o-filter: invert(100%);
  264.     -ms-filter: invert(100%);  
  265.     filter: invert(100%);
  266.     opacity:.2;transition: .8s ease-in-out;
  267.     -webkit-transition: .8s ease-in-out;
  268.     -moz-transition: .8s ease-in-out;
  269.     -o-transition: .8s ease-in-out;
  270. }
  271.  
  272. /**********************************SCROLLBAR********************************/
  273.  
  274. ::-webkit-scrollbar-thumb {
  275.     background-color: {color:scrollbar};    
  276.     border:12px solid {color:borders};
  277. }
  278.  
  279. ::-webkit-scrollbar {
  280.     background-color: {color:borders};
  281.     width: 30px;
  282. }
  283.  
  284. /**********************************SELECTION********************************/
  285.  
  286. ::selection {
  287.     background:{color:selection background};
  288.     color:{color:selection text};}  
  289.        
  290. ::-moz-selection{
  291.     background:{color:selection text};
  292.     color:{color:selection text};}
  293.    
  294. /***************************************************************************/
  295. pre {
  296.     padding:3px 5px;
  297.     line-height:110%;
  298.     white-space: pre-wrap;       /* css-3 */
  299.     white-space: -moz-pre-wrap;  /* Mozilla, since 1999 */
  300.     white-space: -pre-wrap;      /* Opera 4-6 */
  301.     white-space: -o-pre-wrap;    /* Opera 7 */
  302.     word-wrap: break-word;       /* Internet Explorer 5.5+ */
  303. }
  304.  
  305. *,  a {
  306.     cursor: help, auto;
  307. }
  308.  
  309.  
  310. body {
  311.     background:{color:background};
  312.     background-image: url({image:background});
  313.     margin:0px;
  314.     overflow-y:scroll;
  315.     overflow-x:hidden;
  316.     color:{color:text};
  317.     font-family:helvetica;
  318.     font-size:9px;
  319.     line-height:100%;
  320. }
  321.  
  322. a {
  323.     text-decoration:none;
  324.     outline:none;
  325.     color: {color:links};
  326.     -webkit-transition: all 1s ease;
  327.     -moz-transition: all 1s ease;
  328.     -o-transition: all 1s ease;
  329. }
  330.  
  331. a:hover {
  332.     text-decoration: none;
  333.     color: {color:links hover};
  334.     cursor: help;
  335.     -webkit-transition: all 0.7s ease;
  336.     -moz-transition: all 0.7s ease;
  337.     -o-transition: all 0.7s ease;
  338. }
  339.  
  340. img {
  341.     border:none;
  342. }
  343.  
  344. blockquote {
  345.     padding-left:5px;
  346.     border-left:3px solid {color:text};
  347.     margin-left: 8px;
  348. }
  349.    
  350. blockquote blockquote {
  351.     padding-left:5px;
  352.     border-left:3px solid {color:text};
  353. }
  354.  
  355. h1 {
  356.     font-size:15px;
  357.     text-transform:uppercase;
  358. }
  359.  
  360. b {
  361.     color:{color:bold};
  362. }
  363.  
  364. strong {
  365.     color:{color:bold};
  366. }
  367.  
  368. hr {
  369.      opacity: .3;
  370. }
  371.  
  372. big {
  373.     font-size:15px;
  374. }
  375.  
  376. small {
  377.     font-size:7px;
  378. }
  379.  
  380.  
  381. /*************************************SIDEBAR*******************************/
  382.  
  383. #sidebar {
  384.     width:220px;
  385.     position:fixed;
  386.     margin-left:150px;
  387.     margin-top:100px;
  388. }
  389.  
  390. #sidebar img{
  391.     width: 220px;
  392. }
  393.  
  394.  
  395. #links {
  396.     opacity:0;
  397.     text-transform: lowercase;
  398.     text-align:center;
  399.     font-size:15px;
  400.     display:inline-block;
  401.     line-height:100%;
  402.     width:220px;
  403.     padding-bottom:3px;
  404.     -webkit-transition: all 0.3s ease-in-out;
  405.     -moz-transition: all 0.3s ease-in-out;
  406.     -o-transition: all 0.3s ease-in-out;
  407.     -ms-transition: all 0.3s ease-in-out;
  408.     transition: all 0.3s ease-in-out;
  409.  
  410. }
  411.  
  412. #links a{
  413.     color: {color:sidebar links};
  414.     font-family: 'Megrim';
  415.     text-decoration:none;
  416.     border:1px solid transparent;
  417.     display:inline-block;
  418.     padding:2px;
  419.    
  420. }
  421.  
  422. #links a:hover {
  423.     color: {color:links hover};
  424. }
  425.  
  426. #sidebar:hover #links {
  427.     opacity:1;
  428.     -webkit-transition: all 0.3s ease-in-out;
  429.     -moz-transition: all 0.3s ease-in-out;
  430.     -o-transition: all 0.3s ease-in-out;
  431.     -ms-transition: all 0.3s ease-in-out;
  432. }
  433.  
  434. #description {
  435.     margin-top:-28px;
  436.     color: {color:text};
  437.     font-family:calibri;
  438.     letter-spacing: 1px;
  439.     text-transform: uppercase;
  440.     line-height:150%;
  441.     background:{color:description and captions};
  442.     font-size:9px;
  443.     padding:5px;
  444.     font-style:normal;
  445.     width:210px;
  446.     text-align:justify;
  447.     -webkit-transition: all 0.3s ease-in-out;
  448.     -moz-transition: all 0.3s ease-in-out;
  449.     -o-transition: all 0.3s ease-in-out;
  450.     -ms-transition: all 0.3s ease-in-out;
  451. }
  452.  
  453. #sidebar:hover #description{
  454.     margin-top:0px;
  455.     -webkit-transition: all 0.3s ease-in-out;
  456.     -moz-transition: all 0.3s ease-in-out;
  457.     -o-transition: all 0.3s ease-in-out;
  458.     -ms-transition: all 0.3s ease-in-out;
  459. }
  460.  
  461. /**********************************PAGINATION*******************************/
  462.  
  463. #pagination {
  464.     z-index:999999999999999999999999;
  465.     position:fixed;
  466.     font-family:helvetica;
  467.     width:100%;
  468.     background: {color:borders};
  469.     font-size:10px;
  470.     text-align:center;
  471.     margin-bottom:20px;
  472.     padding: 10px;
  473.     bottom: -20px;
  474. }
  475.  
  476. /*************************************BORDERS*******************************/
  477.  
  478. #bottom {
  479.     z-index:99999999999999999999999;
  480.     position:fixed;
  481.     width:100%;
  482.     background: {color:borders};
  483.     margin-bottom:20px;
  484.     padding: 10px;
  485.     bottom: -20px;
  486.  
  487. }
  488.  
  489. #top {
  490.     z-index:99999999999999999999999;
  491.     position:fixed;
  492.     width:100%;
  493.     background: {color:borders};
  494.     top:0px;
  495.     padding: 15px;
  496.  
  497. }
  498.  
  499. #left {
  500.     z-index:99999999999999999999999;
  501.     position:fixed;
  502.     height:100%;
  503.     background: {color:borders};
  504.     left:0px;
  505.     margin-top:-20px;
  506.     padding: 16px;
  507. }
  508.  
  509.  
  510. /****************************************POSTS******************************/
  511.  
  512. #entries {
  513.     padding: 10px;
  514.     width: 400px;
  515.     font-size: 10px;
  516.     margin-left: 450px;
  517.     margin-top: 40px;
  518.    
  519. }
  520.  
  521. .post {
  522.     width: 400px;
  523.     margin-top: 25px;
  524.     padding: 10px;
  525.     margin-bottom: 50px;
  526.     padding-bottom: 20px;
  527. {block:If50percentgrayscaleposts}
  528.     -webkit-filter: grayscale(50%);
  529.     -webkit-transition: all 0.6s ease-in-out;
  530.     -moz-transition: all 0.6s ease-in-out;
  531.     -o-transition: all 0.6s ease-in-out;
  532.     -ms-transition: all 0.6s ease-in-out;
  533.     transition: all 0.6s ease-in-out;
  534. {block:If50percentgrayscaleposts}
  535. }
  536.  
  537. {block:If50percentgrayscaleposts}
  538. .post:hover {
  539.     opacity:1;
  540.     -webkit-filter: grayscale(0%);
  541.     -webkit-transition: all 0.6s ease-in-out;
  542.     -moz-transition: all 0.6s ease-in-out;
  543.     -o-transition: all 0.6s ease-in-out;
  544.     -ms-transition: all 0.6s ease-in-out;
  545.     transition: all 0.6s ease-in-out;
  546. }
  547. {block:If50percentgrayscaleposts}
  548.    
  549. /* ANSWER POST */
  550.  
  551. .ask {
  552.     white-space: pre-wrap;       /* css-3 */
  553.     white-space: -moz-pre-wrap;  /* Mozilla, since 1999 */
  554.     white-space: -pre-wrap;      /* Opera 4-6 */
  555.     white-space: -o-pre-wrap;    /* Opera 7 */
  556.     word-wrap: break-word;       /* Internet Explorer 5.5+ */
  557.    
  558. }
  559.  
  560. .q {
  561.     letter-spacing: 2px;
  562.     text-align: center;
  563.     font-style: italic;
  564.     background: {color:description and captions};
  565.     padding: 10px;
  566.  
  567.     }
  568.  
  569. .q img {
  570.     margin-top:-5px;
  571.     border: solid 5px {color:background};
  572.     border-radius:40px;
  573.     -moz-border-radius: 40px;
  574.     -webkit-transition: all 0.5s ease-in-out;
  575.     -moz-transition: all 0.5s ease-in-out;
  576.     -o-transition: all 0.5s ease-in-out;
  577.     -ms-transition: all 0.5s ease-in-out;
  578.     transition: all 0.5s ease-in-out;
  579.  
  580. }
  581.  
  582. .q img:hover {
  583.     margin-top:-5px;
  584.     border: solid 5px {color:links hover};
  585.     border-radius:40px;
  586.     -moz-border-radius: 40px;
  587.     -webkit-transition: all 0.5s ease-in-out;
  588.     -moz-transition: all 0.5s ease-in-out;
  589.     -o-transition: all 0.5s ease-in-out;
  590.     -ms-transition: all 0.5s ease-in-out;
  591.     transition: all 0.5s ease-in-out;
  592.  
  593. }
  594.  
  595. .asker {
  596.     letter-spacing: 3px;
  597.     font-size: 14px;
  598.     font-family: 'Open Sans Condensed';
  599.     font-style: normal;
  600.     text-transform: uppercase;
  601.     text-align:center;
  602.     padding-top:10px;
  603.     -webkit-transition: all 0.4s ease-in-out;
  604.     -moz-transition: all 0.4s ease-in-out;
  605.     -o-transition: all 0.4s ease-in-out;
  606.     -ms-transition: all 0.4s ease-in-out;
  607.     transition: all 0.4s ease-in-out;
  608.     }
  609.  
  610. .asker:hover {
  611.     color: {color:links hover};
  612.     letter-spacing: 5px;
  613.     -webkit-transition: all 0.4s ease-in-out;
  614.     -moz-transition: all 0.4s ease-in-out;
  615.     -o-transition: all 0.4s ease-in-out;
  616.     -ms-transition: all 0.4s ease-in-out;
  617.     transition: all 0.4s ease-in-out;
  618. }
  619.  
  620. .a {
  621.     background-color: {color:background};
  622.     margin-top:-10px;
  623.     padding: 10px;
  624.     text-align: justify;
  625.     border:solid 10px {color:description and captions};
  626.     line-height:130%;
  627. }
  628.  
  629. /* AUDIO POST */
  630.  
  631. .audio {
  632.     padding-top:10px;
  633.     letter-spacing: 2px;
  634.     text-align: center;
  635.     font-style: italic;
  636.     background: {color:description and captions};
  637.     padding-bottom: 10px;
  638.  
  639.     }
  640.  
  641. .audio img {
  642.     margin-top:5px;
  643.     border: solid 5px {color:background};
  644.     border-radius:40px;
  645.     -webkit-transition: all 0.4s ease-in-out;
  646.     -moz-transition: all 0.4s ease-in-out;
  647.     -o-transition: all 0.4s ease-in-out;
  648.     -ms-transition: all 0.4s ease-in-out;
  649.     transition: all 0.4s ease-in-out;
  650. }
  651.  
  652. .audio img:hover {
  653.     margin-top:5px;
  654.     border: solid 5px {color:links hover};
  655.     border-radius:40px;
  656.     -moz-border-radius: 40px;
  657.     -webkit-transition: all 0.4s ease-in-out;
  658.     -moz-transition: all 0.4s ease-in-out;
  659.     -o-transition: all 0.4s ease-in-out;
  660.     -ms-transition: all 0.4s ease-in-out;
  661.     transition: all 0.4s ease-in-out;
  662. }
  663.  
  664. .audiotitle {
  665.     letter-spacing: 2px;
  666.     font-size: 14px;
  667.     font-family: 'Open Sans Condensed';
  668.     font-style: normal;
  669.     text-transform: uppercase;
  670.     text-align:center;
  671.     padding-top:15px;
  672.     text-align:center;
  673.     padding-bottom:15px;
  674.     -webkit-transition: all 0.4s ease-in-out;
  675.     -moz-transition: all 0.4s ease-in-out;
  676.     -o-transition: all 0.4s ease-in-out;
  677.     -ms-transition: all 0.4s ease-in-out;
  678.     transition: all 0.4s ease-in-out;
  679. }
  680.    
  681.  .audiotitle:hover
  682.  {
  683.      color: {color:links hover};
  684.      letter-spacing: 4px;
  685.     -webkit-transition: all 0.4s ease-in-out;
  686.     -moz-transition: all 0.4s ease-in-out;
  687.     -o-transition: all 0.4s ease-in-out;
  688.     -ms-transition: all 0.4s ease-in-out;
  689.     transition: all 0.4s ease-in-out;
  690.  }
  691.  
  692. .player {
  693.     padding-top: 15px;
  694. }
  695.  
  696.  
  697. .cover img{
  698.     width:70px;
  699.     height:70px;
  700. }
  701.  
  702. /* QUOTE POST */
  703.  
  704. .quote {
  705.     font-size:17px;
  706.     font-style:normal;
  707.     text-align: center;
  708.     font-family: 'Open Sans Condensed';
  709.     line-height:120%;
  710.     padding:20px;
  711.     background-color: {color:description and captions};
  712. }
  713.  
  714.  
  715. .qsource{
  716.     background-color: {color:description and captions};
  717.     font-size:9px;
  718.     font-style:italic;
  719.     display: block;
  720.     text-align:right;
  721.     font-family: helvetica;
  722.     line-height:120%;
  723.     padding: 10px;
  724. }
  725.  
  726. .qsource img{
  727.     max-width:400px;
  728.  }
  729.  
  730. /* CHAT POST*/
  731.  
  732. .titl {
  733.     line-height:100%;
  734.     text-transform: uppercase;
  735.     background-color: {color:description and captions};
  736.     font-size:17px;
  737.     padding:20px;
  738.     font-family: 'Open Sans Condensed';
  739.     letter-spacing:3px;
  740.     padding-left:10px;
  741. }
  742.  
  743. .chat {
  744.     line-height:200%;
  745.     background-color: {color:description and captions};
  746.     padding-right:10px;
  747.     padding-left:10px;
  748. }
  749.  
  750. /* LINK POST */
  751.  
  752. .lnk {
  753.     font-size:20px;
  754.     text-transform:uppercase;
  755.     font-style:normal;
  756.     text-align: left;
  757.     font-family: 'Open Sans Condensed';
  758.     padding:20px;
  759.     padding-left:10px;
  760.     background-color: {color:description and captions};
  761.     -webkit-transition: all 0.4s ease-in-out;
  762.     -moz-transition: all 0.4s ease-in-out;
  763.     -o-transition: all 0.4s ease-in-out;
  764.     -ms-transition: all 0.4s ease-in-out;
  765.     transition: all 0.4s ease-in-out;
  766. }
  767.  
  768. .lnk a {
  769.     white-space: pre-wrap;       /* css-3 */
  770.     white-space: -moz-pre-wrap;  /* Mozilla, since 1999 */
  771.     white-space: -pre-wrap;      /* Opera 4-6 */
  772.     white-space: -o-pre-wrap;    /* Opera 7 */
  773.     word-wrap: break-word;       /* Internet Explorer 5.5+ */
  774.     line-height:130%;
  775.     color: {color:links};
  776.     letter-spacing:1px;
  777.     border-bottom: solid 3px {color:background};
  778.     -webkit-transition: all 0.4s ease-in-out;
  779.     -moz-transition: all 0.4s ease-in-out;
  780.     -o-transition: all 0.4s ease-in-out;
  781.     -ms-transition: all 0.4s ease-in-out;
  782.     transition: all 0.4s ease-in-out;
  783. }
  784.  
  785. .lnk a:hover {
  786.     color: {color:links hover};
  787.     letter-spacing:4px;
  788.     -webkit-transition: all 0.4s ease-in-out;
  789.     -moz-transition: all 0.4s ease-in-out;
  790.     -o-transition: all 0.4s ease-in-out;
  791.     -ms-transition: all 0.4s ease-in-out;
  792.     transition: all 0.4s ease-in-out;
  793. }
  794.  
  795. /* POST CAPTION*/
  796.  
  797. .caption {
  798.     line-height: 200%;
  799.     font-family:calibri;
  800.     margin-top:-1px;
  801.     text-transform: uppercase;
  802.     font-size: 9px;
  803.     padding:10px;
  804.     background-color: {color:description and captions};
  805.     max-width: 400px;}
  806.    
  807. .caption img {
  808.     max-width: 300px;}
  809.  
  810. /* POST NOTES*/
  811.  
  812. .notes {
  813.     line-height:130%;
  814.     width:400px;
  815.     padding: 10px;
  816.     margin-top: 35px;
  817.     font-size:10px;
  818.     margin-left:20px;
  819.     margin-top:40px;
  820. }
  821.  
  822. .notes img{
  823.     display: none;
  824. }
  825.  
  826. /* POST LINKS*/
  827.  
  828. .info {
  829.     padding-bottom: 8px;
  830.     font-size:9px;
  831.     text-transform:uppercase;
  832.     opacity: 1;
  833. }
  834.  
  835. .info a:hover {
  836.     letter-spacing: 4px;
  837.     text-decoration: none;
  838.     color: {color:links hover};
  839.     -webkit-transition: all 0.4s ease-in-out;
  840.     -moz-transition: all 0.4s ease-in-out;
  841.     -o-transition: all 0.4s ease-in-out;
  842.     -ms-transition: all 0.4s ease-in-out;
  843.     transition: all 0.4s ease-in-out;
  844. }
  845.  
  846. .infoo {
  847.     margin-top:8px;
  848.     margin-bottom:8px;
  849.     position:relative;
  850. }
  851.  
  852. /* POST TAGS*/
  853.  
  854. .tags {
  855.     position:absolute;
  856.     display:block;
  857.     overflow-x:none;
  858.     width:200px;
  859.     overflow-x:hidden;
  860.     text-align:left;
  861.     font-family:helvetica;
  862.     text-transform:lowercase;
  863.     font-size:8px;
  864.     letter-spacing: 2px;
  865.     font-style:italic;
  866.     padding:0px;
  867.     opacity: 0;
  868.     -webkit-transition: all 0.5s ease-in-out;
  869.     -moz-transition: all 0.5s ease-in-out;
  870.     -o-transition: all 0.5s ease-in-out;
  871.     -ms-transition: all 0.5s ease-in-out;
  872.     transition: all 0.5s ease-in-out;
  873. }
  874.    
  875. .tags a {
  876.     text-decoration:none;
  877.     color: {color:text};
  878.     display:inline;
  879.     -webkit-transition: all 0.5s ease-in-out;
  880.     -moz-transition: all 0.5s ease-in-out;
  881.     -o-transition: all 0.5s ease-in-out;
  882.     -ms-transition: all 0.5s ease-in-out;
  883.     transition: all 0.5s ease-in-out;
  884. }  
  885.  
  886.  
  887. .post:hover .tags {
  888.     width:400px;
  889.     opacity:1;
  890. }
  891.  
  892. /*****************************CREDIT****************************************/
  893.  
  894. #cr a {
  895.     line-height:80%;
  896.     z-index:99999999999999;
  897.     color: {color:borders};
  898.     font-size: 22px;
  899.     padding: 5px;
  900.     text-align: center;
  901.     position:fixed;
  902.     {block:Ifcreditontheright}
  903.     bottom: 30px;
  904.     right: 5px;
  905.     {/block:Ifcreditontheright}
  906.     {block:Ifnotcreditontheright}
  907.     bottom:30px;
  908.     left:35px;
  909.     {/block:Ifnotcreditontheright}
  910.     -moz-transition-duration:0.5s;
  911.     -webkit-transition-duration:0.5s;
  912.     -o-transition-duration:0.5s;
  913. }
  914.  
  915. #cr a:hover {
  916.     text-decoration:none;
  917.     transform:rotate(360deg);
  918. }
  919.  
  920.  
  921. /************************UPDATES TAB****************************************/
  922.  
  923. .dropin {
  924.     margin-top:25px;
  925.     position:absolute;    
  926.     opacity:0;
  927.     background-color: {color:background};
  928.     width:129px;
  929.     height: 200px;
  930.     font-family:calibri;
  931.     font-size:8px;
  932.     text-transform:uppercase;
  933.     letter-spacing:1px;
  934.     line-height:100%;
  935.     padding:4px;
  936.     margin-left:4px;
  937.     margin-right:4px;
  938.     margin-bottom:20px;
  939.     -webkit-transition: all 0.4s ease-in-out;
  940.     -moz-transition: all 0.4s ease-in-out;
  941.     -o-transition: all 0.4s ease-in-out;
  942.     -ms-transition: all 0.4s ease-in-out;
  943.     transition: all 0.4s ease-in-out;
  944. }
  945.    
  946. #drop1 {
  947.     opacity:1;
  948.     z-index:5;    
  949.     position:fixed;          
  950.     right:130px;
  951.     top:40px;    
  952.     overflow:hidden;    
  953.     width: 25px;
  954.     height: 25px;        
  955.     background-color:{color:updates tab1};
  956.     -webkit-transition: all 0.4s ease-in-out;
  957.     -moz-transition: all 0.4s ease-in-out;
  958.     -o-transition: all 0.4s ease-in-out;
  959.     -ms-transition: all 0.4s ease-in-out;
  960.     transition: all 0.4s ease-in-out;
  961. }
  962.  
  963. #drop1:hover {
  964.     z-index:999;  
  965.     width:145px;
  966.     height:260px;        
  967.     right:10px;  
  968. }
  969.    
  970. #drop1:hover .dropin  {
  971.     opacity:1;
  972.     -webkit-transition: all 0.4s ease-in-out;
  973.     -moz-transition: all 0.4s ease-in-out;
  974.     -o-transition: all 0.4s ease-in-out;
  975.     -ms-transition: all 0.4s ease-in-out;
  976.     transition: all 0.4s ease-in-out;
  977. }
  978.  
  979. #drop2 {
  980.     z-index:1;    
  981.     position:fixed;          
  982.     right:100px;
  983.     top:40px;    
  984.     overflow:hidden;
  985.     width: 25px;
  986.     height: 25px;        
  987.     background-color:{color:updates tab2};
  988.     -webkit-transition: all 0.4s ease-in-out;
  989.     -moz-transition: all 0.4s ease-in-out;
  990.     -o-transition: all 0.4s ease-in-out;
  991.     -ms-transition: all 0.4s ease-in-out;
  992.     transition: all 0.4s ease-in-out;
  993. }
  994.  
  995. #drop2:hover {
  996.     z-index:999;  
  997.     width:145px;        
  998.     height:260px;
  999.     right:10px;
  1000. }
  1001.  
  1002. #drop2:hover .dropin  {
  1003.     opacity:1;
  1004.     -webkit-transition: all 0.4s ease-in-out;
  1005.     -moz-transition: all 0.4s ease-in-out;
  1006.     -o-transition: all 0.4s ease-in-out;
  1007.     -ms-transition: all 0.4s ease-in-out;
  1008.     transition: all 0.4s ease-in-out;
  1009. }
  1010.  
  1011.  
  1012. #drop3 {
  1013.     z-index:1;    
  1014.     position:fixed;        
  1015.     right:70px;
  1016.     top:40px;        
  1017.     overflow:hidden;
  1018.     width: 25px;
  1019.     height: 25px;      
  1020.     background-color:{color:updates tab3};
  1021.     -webkit-transition: all 0.4s ease-in-out;
  1022.     -moz-transition: all 0.4s ease-in-out;
  1023.     -o-transition: all 0.4s ease-in-out;
  1024.     -ms-transition: all 0.4s ease-in-out;
  1025.     transition: all 0.4s ease-in-out;
  1026. }
  1027.  
  1028. #drop3:hover {
  1029.     z-index:999;  
  1030.     width:145px;        
  1031.     height:260px;
  1032.     right:10px;
  1033. }
  1034.    
  1035. #drop3:hover .dropin  {
  1036.     opacity:1;
  1037.     -webkit-transition: all 0.4s ease-in-out;
  1038.     -moz-transition: all 0.4s ease-in-out;
  1039.     -o-transition: all 0.4s ease-in-out;
  1040.     -ms-transition: all 0.4s ease-in-out;
  1041.     transition: all 0.4s ease-in-out;
  1042. }
  1043.  
  1044. #drop4 {
  1045.     z-index:1;          
  1046.     position:fixed;        
  1047.     right:40px;
  1048.     top:40px;
  1049.     overflow:hidden;
  1050.     width: 25px;
  1051.     height:25px;        
  1052.     background-color:{color:updates tab4};
  1053.     -webkit-transition: all 0.4s ease-in-out;
  1054.     -moz-transition: all 0.4s ease-in-out;
  1055.     -o-transition: all 0.4s ease-in-out;
  1056.     -ms-transition: all 0.4s ease-in-out;
  1057.     transition: all 0.4s ease-in-out;
  1058. }
  1059.    
  1060. #drop4:hover {
  1061.     z-index:999;  
  1062.     width:145px;
  1063.     height:260px;
  1064.     right:10px;
  1065. }
  1066.      
  1067. #drop4:hover .dropin  {
  1068.     opacity:1;
  1069.     -webkit-transition: all 0.4s ease-in-out;
  1070.     -moz-transition: all 0.4s ease-in-out;
  1071.     -o-transition: all 0.4s ease-in-out;
  1072.     -ms-transition: all 0.4s ease-in-out;
  1073.     transition: all 0.4s ease-in-out;
  1074. }
  1075.  
  1076. #drop5 {
  1077.     z-index:1;          
  1078.     position:fixed;        
  1079.     right:10px;
  1080.     top:40px;
  1081.     overflow:hidden;
  1082.     width: 25px;
  1083.     height:25px;        
  1084.     background-color:{color:updates tab5};
  1085.     -webkit-transition: all 0.4s ease-in-out;
  1086.     -moz-transition: all 0.4s ease-in-out;
  1087.     -o-transition: all 0.4s ease-in-out;
  1088.     -ms-transition: all 0.4s ease-in-out;
  1089.     transition: all 0.4s ease-in-out;
  1090.  
  1091. }
  1092.    
  1093. #drop5:hover {
  1094.     z-index:999;  
  1095.     width:145px;
  1096.     height:260px;
  1097.     right:10px;
  1098. }
  1099.  
  1100. #drop5:hover .dropin  {
  1101.     opacity:1;
  1102.     -webkit-transition: all 0.4s ease-in-out;
  1103.     -moz-transition: all 0.4s ease-in-out;
  1104.     -o-transition: all 0.4s ease-in-out;
  1105.     -ms-transition: all 0.4s ease-in-out;
  1106.     transition: all 0.4s ease-in-out;
  1107. }
  1108.  
  1109.  
  1110. {CustomCSS}</style></head><body>
  1111.  
  1112. <!--------UPDATES TAB------------------------------------------------------->
  1113.  
  1114. {block:Ifupdatestab}
  1115. <div id="drop1">
  1116. <div class="dropin">
  1117. <div style="font-family: Open Sans Condensed;text-transform:lowercase;font-size:16px;color:{color:updates title color}; background-color:{color:updates tab1}; padding:5px">{text:updates title1}</a></div><br>
  1118. {text:square1 content}
  1119. </div></div>
  1120.  
  1121. <div id="drop2">
  1122. <div class="dropin">
  1123. <div style="font-family: Open Sans Condensed;text-transform:lowercase;font-size:16px;color:{color:updates title color}; background-color:{color:updates tab2}; padding:5px">{text:updates title2}</a></div><br>
  1124. {text:square2 content}
  1125. </div></div>
  1126.  
  1127. <div id="drop3">
  1128. <div class="dropin">
  1129. <div style="font-family: Open Sans Condensed;text-transform:lowercase;font-size:16px;color:{color:updates title color}; background-color:{color:updates tab3}; padding:5px">{text:updates title3}</a></div><br>
  1130. {text:square3 content}
  1131. </div></div>
  1132.  
  1133. <div id="drop4">
  1134. <div class="dropin">
  1135. <div style="font-family: Open Sans Condensed;text-transform:lowercase;font-size:16px;color:{color:updates title color}; background-color:{color:updates tab4}; padding:5px">{text:updates title4}</a></div><br>
  1136. {text:square4 content}
  1137. </div></div>
  1138.    
  1139. <div id="drop5">
  1140. <div class="dropin">
  1141. <div style="font-family: Open Sans Condensed;text-transform:lowercase;font-size:16px;color:{color:updates title color}; background-color:{color:updates tab5}; padding:5px">{text:updates title5}</a></div><br>
  1142. {text:square5 content}
  1143. </div></div>
  1144. {/block:Ifupdatestab}
  1145.  
  1146. <!--------BORDERS----------------------------------------------------------->
  1147.  
  1148. <div id="top"></div>
  1149. <div id="left"></div>
  1150. <div id="bottom"></div>
  1151.  
  1152. <!--------SIDEBAR----------------------------------------------------------->
  1153.  
  1154. <div id="sidebar">
  1155.  
  1156. <a title="refresh" href="/"><img src="{image:sidebar}"></a>
  1157.  
  1158. <div id="links">
  1159. {block:Ifpopupaskbox}
  1160. <a href="#?w=500" rel="ask"class="poplight">
  1161. {text:pop up askbox link name}</a>
  1162. {/block:Ifpopupaskbox}
  1163.  
  1164. {block:Ifnotpopupaskbox}
  1165. <a href="{text:link1 url}">{text:link1}</a>
  1166. {/block:Ifnotpopupaskbox}
  1167.  
  1168. <a  href="{text:link2 url}" >{text:link2}</a>
  1169. <a  href="{text:link3 url}" >{text:link3}</a>
  1170. <a  href="{text:link4 url}" >{text:link4}</a>
  1171. <a  href="{text:link5 url}" >{text:link5}</a>
  1172. </div>
  1173.  
  1174. <div id="description">{description}</div>
  1175.  
  1176. </div>
  1177.  
  1178. <!--------------POSTS------------------------------------------------------->
  1179.  
  1180. <div id="entries">
  1181.  
  1182.  
  1183. {block:Posts}
  1184. <div class="post">
  1185.  
  1186.  
  1187. {block:Text}
  1188. {block:Title}<div class="titl">{Title}</div>{/block:Title}
  1189. <div class="caption">{Body}</div>
  1190. {/block:Text}
  1191.  
  1192. {block:Photo}
  1193. {LinkOpenTag}<img src="{PhotoURL-400}">{LinkCloseTag}
  1194. {block:Caption}<div class="caption">{Caption}</div>{/block:Caption}
  1195. {/block:Photo}
  1196.  
  1197. {block:Photoset}
  1198. {Photoset-400}
  1199. {block:Caption}<div class="caption">{Caption}</div>{/block:Caption}
  1200. {/block:Photoset}
  1201.  
  1202. {block:Quote}
  1203. <div class="quote">{Quote}</div>
  1204. {block:Source}<div class="qsource"> — {Source}</div>{/block:Source}
  1205. {/block:Quote}
  1206.  
  1207. {block:Link}
  1208. <div class="lnk"><a href="{URL}" {Target}>{Name}</a></div>
  1209. {block:Description}<div class="caption">{Description}</div>{/block:Description}
  1210. {/block:Link}
  1211.  
  1212. {block:Chat}
  1213. {block:Title}<div class="titl">{Title}</div>{/block:Title}
  1214. {block:Lines}<div class="chat">
  1215. {block:Label}<b>{Label}</b>{/block:Label}
  1216. {Line}<br> </div>{/block:Lines}
  1217. {/block:Chat}
  1218.  
  1219. {block:Audio}
  1220. <div class="audio">
  1221. {block:AlbumArt}
  1222. <div class="cover"><img src="{AlbumArtURL}"></div>
  1223. {/block:AlbumArt}
  1224. {block:TrackName}<div class="audiotitle">{TrackName}</div>{/block:TrackName}
  1225. {block:Artist}by {Artist}{/block:Artist}
  1226. &mdash;{playcountwithlabel}
  1227. <div class="player">{AudioPlayerWhite}</div>
  1228. </div>
  1229. {block:Caption}<div class="caption">{Caption}</div>{/block:Caption}
  1230. {/block:Audio}
  1231.  
  1232. {block:Video}
  1233. {Video-400}
  1234. {block:Caption}<div class="caption">{Caption}</div>{/block:Caption}
  1235. {/block:Video}
  1236.  
  1237. {block:Answer}
  1238. <div class="ask">
  1239. <div class="q">
  1240. <img src="{AskerPortraitURL-40}">
  1241. <div class="asker">{Asker}</div>
  1242. {Question}
  1243. </div>
  1244. <div class="a">{Answer}</div>
  1245. </div>
  1246. {/block:Answer}
  1247.  
  1248.  
  1249. <div class="info">
  1250.  
  1251. <!--------------------------------HIDE SOURCE------------------------------->
  1252. {block:ContentSource}
  1253. <!--- {SourceURL}{block:SourceLogo}<img src=”{BlackLogoURL}”
  1254. width=”{LogoWidth}” height=”{LogoHeight}” alt=”{SourceTitle}” />
  1255. {/block:SourceLogo}
  1256. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} --->
  1257. {/block:ContentSource}{block:ReblogParent}{/block:ReblogParent}
  1258. <!-------------------------------------------------------------------------->
  1259.  
  1260. {block:Date}
  1261. <div class="infoo">
  1262. <a href="{ReblogURL}">reblog</a> /
  1263. {block:RebloggedFrom}
  1264. <a href="{ReblogParentURL}" title="{ReblogParentName}">via</a> /  
  1265. <a href="{ReblogRootURL}" title="{ReblogRootName}">source</a> /
  1266. {/block:RebloggedFrom}
  1267.  
  1268. <a href="{Permalink}" title="posted {TimeAgo}">{Month} {DayOfMonth}{DayOfMonthSuffix}</a>
  1269. {block:NoteCount}
  1270. <span style="color:{color:text}; font-size:12px"></span>
  1271. <a href="{Permalink}" title="{NoteCount} notes">{NoteCount}</a>
  1272. {/block:NoteCount}
  1273. </div></div>
  1274. {/block:Date}
  1275.  
  1276.  
  1277.  
  1278. {block:HasTags}
  1279. <div class="tags">
  1280. {block:Tags}
  1281. #<a href="{TagURL}">{Tag}</a>
  1282. {/block:Tags}
  1283. </div>{/block:HasTags}
  1284.  
  1285. </div>
  1286. {/block:Posts}
  1287.  
  1288. <!---------POST NOTES------------------------------------------------------->
  1289. {block:Ifshowhidenotes}
  1290. {block:PostNotes}
  1291. <a id="displayText" href="javascript:toggle();" style="position:absolute;font-size:9px;font-family:calibri; padding-bottom:50px;margin-top:0px;margin-left:190px;letter-spacing:2px;">SHOW NOTES</a>
  1292. <div id="toggleText" style="display: none">
  1293. <div id="notes">{PostNotes}</div></div>
  1294. {/block:PostNotes}
  1295. {/block:Ifshowhidenotes}
  1296.  
  1297. {block:Ifnotshowhidenotes}
  1298. {block:PostNotes}
  1299. <div id="notes">{PostNotes}</div>
  1300. {/block:PostNotes}
  1301. {/block:Ifnotshowhidenotes}
  1302.  
  1303. </div><!--entries container end-->
  1304.  
  1305. <!------------PAGINATION---------------------------------------------------->
  1306.  
  1307. {block:Pagination}
  1308. <div id="pagination">
  1309. {block:PreviousPage}
  1310. <a href="{PreviousPage}">&larr;</a>&nbsp;&nbsp;
  1311. {/block:PreviousPage}
  1312. {block:JumpPagination length="5"}
  1313. {block:CurrentPage}
  1314. <span class="current_page">{PageNumber}</span>&nbsp;&nbsp;
  1315. {/block:CurrentPage}
  1316. {block:JumpPage}
  1317. <a class="jump_page" href="{URL}">{PageNumber}</a>&nbsp;&nbsp;
  1318. {/block:JumpPage}
  1319. {/block:JumpPagination}
  1320. {block:NextPage}
  1321. <a href="{NextPage}">&rarr;</a>
  1322. {/block:NextPage}</div>
  1323. {/block:Pagination}
  1324.  
  1325. <!-------------------------------------------------------------------------->
  1326. <div id="cr"><a title="theme" href="http://dixcndaryl.tumblr.com">x</a></div>
  1327.  
  1328. </body>
  1329.  
  1330. <!--------POP-UP ASKBOX----------------------------------------------------->
  1331.  
  1332. <div id="ask" class="popup_block">
  1333. <div id="askland">
  1334.  
  1335. <span style="float:left; font-transform: uppercase; font-family:calibri; font-size: 9px;"><p>{text:text above pop up askbox}</p></span>
  1336.  
  1337. <p><iframe frameborder="0" height="250px" id="ask_form" scrolling="no" src="http://www.tumblr.com/ask_form/{Name}.tumblr.com" width="400px" style="background-color: transparent; overflow: hidden;"></iframe></a></p>
  1338. </div></div>
  1339.  
  1340. <!-------------------------------------------------------------------------->
  1341.  
  1342. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement