API tools faq
paste
jaesoonie

THEME #48

jaesoonie
Dec 2nd, 2014
3,488
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 36.38 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2. <!---------------------------------------------------------------------------
  3.  
  4. ᴛʜᴇᴍᴇ #48;
  5. © ᴍᴀᴅᴇ ʙʏ ᴄʜʟᴏᴇ
  6. [ ʏ-ᴏɴɢɪɴ.ᴛᴜᴍʙʟʀ.ᴄᴏᴍ ] & [ ᴄʜsᴏ.ᴛᴜᴍʙʟʀ.ᴄᴏᴍ ]
  7.  
  8. ᴛʜᴇᴍᴇs ᴄᴀɴ ʙᴇ ғᴏᴜɴᴅ ᴀᴛ:
  9. [ ᴄʜᴄᴏᴅᴇs.ᴛᴜᴍʙʟʀ.ᴄᴏᴍ ]
  10.  
  11.  
  12. - ᴅᴏɴ'ᴛ sᴛᴇᴀʟ ɪᴛ.
  13. - ᴘʟᴇᴀsᴇ ʟᴇᴀᴠᴇ ᴛʜᴇ ᴄʀᴇᴅɪᴛ ᴏɴ ᴛʜᴇ ᴛʜᴇᴍᴇ.
  14.  
  15. ---------------------------------------------------------------------------->
  16.  
  17. <html>
  18. <head>
  19. <title>{Title}</title>
  20. <link rel="shortcut icon" href="{Favicon}">
  21. <link rel="alternate" type="application/rss+xml" title="RSS" href="{RSS}" />
  22.  
  23.  
  24. <meta name="select:Font" content="trebuchet ms" title="Trebuchet ms"/>
  25. <meta name="select:Font" content="arial" title="Arial"/>
  26. <meta name="select:Font" content="calibri" title="Calibri"/>
  27. <meta name="select:Font" content="consolas" title="Consolas"/>
  28. <meta name="select:Font" content="times" title="Times New Roman"/>
  29. <meta name="select:Font" content="tunga" title="Tunga"/>
  30. <meta name="select:Font" content="century gothic" title="Century Gothic"/>
  31. <meta name="select:Font" content="cambria" title="Cambria"/>
  32. <meta name="select:Font" content="georgia" title="Georgia"/>
  33.  
  34. <meta name="color:Blog Background" content="#fafafa" />
  35. <meta name="color:Border" content="#fff" />
  36. <meta name="color:ScrollBar" content="#333" />
  37. <meta name="color:Title Background" content="#fff" />
  38. <meta name="color:Title Font" content="#333" />
  39. <meta name="color:Search Background" content="#333" />
  40. <meta name="color:Search Font" content="#f9f9f9" />
  41. <meta name="color:Description Font" content="#aaa" />
  42. <meta name="color:Description Background" content="#fff" />
  43. <meta name="color:Links Font" content="#fff" />
  44. <meta name="color:Links" content="#111" />
  45. <meta name="color:Links Hover" content="#fff" />
  46. <meta name="color:Links Hover Font" content="#333" />
  47. <meta name="color:Post Title Font" content="#555" />
  48. <meta name="color:Text" content="#565656" />
  49. <meta name="color:Bold Text" content="#333" />
  50. <meta name="color:Italic Text" content="#b9b8b8" />
  51. <meta name="color:Hyperlinks" content="#444"/>
  52. <meta name="color:Hyperlinks Hover" content="#fff" />
  53. <meta name="color:Info Font" content="#333" />
  54. <meta name="color:Notes Font" content="#fff" />
  55. <meta name="color:Notes Background" content="#111" />
  56. <meta name="color:Tags Font" content="#fff" />
  57. <meta name="color:Tags Background" content="#333" />
  58. <meta name="color:Tooltip Background" content="#333" />
  59. <meta name="color:Tooltip Font" content="#fff" />
  60. <meta name="color:Quote Font" content="#555" />
  61. <meta name="color:Quote Background" content="#fafafa" />
  62. <meta name="color:Question Font" content="#555" />
  63. <meta name="color:Question Background" content="#fafafa" />
  64.  
  65. <meta name="text:Text Size" content="10px" />
  66. <meta name="text:Post Distance" content="150px"/>
  67. <meta name="text:Line Height" content="130%"/>
  68.  
  69. <meta name="text:Home" content="home" />
  70. <meta name="text:Ask" content="message" />
  71. <meta name="text:Archive" content="archive" />
  72. <meta name="text:Archive Link" content="/archive" />
  73. <meta name="text:Link1" content="/" />
  74. <meta name="text:Link1 Title" content="link 1" />
  75. <meta name="text:Link2" content="/" />
  76. <meta name="text:Link2 Title" content="link 2" />
  77. <meta name="text:Link3" content="/" />
  78. <meta name="text:Link3 Title" content="link 3" />
  79. <meta name="text:Link4" content="/" />
  80. <meta name="text:Link4 Title" content="link 4" />
  81. <meta name="text:Link5" content="/" />
  82. <meta name="text:Link5 Title" content="link 5" />
  83.  
  84. <meta name="if:250px" content="0"/>
  85. <meta name="if:400px" content="0"/>
  86. <meta name="if:500px" content="1"/>
  87.  
  88. <meta name="if:InfiniteScroll" content="0">
  89. <meta name="if:Caption" content="1">
  90. <meta name="text:Opacity Value" content="1"/>
  91. <meta name="if:Greyscale" content="0"/>
  92.  
  93. <meta name="select:Cursor" content="default" title="default">
  94. <meta name="select:Cursor" content="crosshair" title="crosshair">
  95. <meta name="select:Cursor" content="help" title="help">
  96. <meta name="select:Cursor" content="sw-resize" title="resize">
  97.  
  98.  
  99.  
  100. <!---------------------------------------------------------------------------
  101.  
  102. ɴᴏᴛᴇ: ғᴏʀ sᴏᴍᴇ ʀᴇᴀsᴏɴ ᴡʜᴀᴛ ᴅɪsᴘʟᴀʏs ᴏɴ ᴛʜᴇ ᴘʀᴇᴠɪᴇᴡ
  103. ᴏɴ ᴛʜᴇ ʀɪɢʜᴛ ɪs ᴍᴏsᴛ ʟɪᴋᴇʟʏ ɴᴏᴛ ᴛʜᴇ ᴇxᴀᴄᴛ sᴀᴍᴇ ᴀs
  104. ᴛʜᴇ ʟᴀʏᴏᴜᴛ ʙᴜɪʟᴛ (ғᴏʀ ᴇxᴀᴍᴘʟᴇ ғᴏɴᴛs). sᴀᴠᴇ ᴀɴᴅ sᴇᴇ
  105. ᴀʟᴛᴇʀᴀᴛɪᴏɴs ᴏɴ ᴛʜᴇ ᴀᴄᴛᴜᴀʟ ʙʟᴏɢ.
  106.  
  107. ʙᴇsᴛ ᴠɪᴇᴡᴇᴅ ᴏɴ ɢᴏᴏɢʟᴇ ᴄʜʀᴏᴍᴇ!
  108.  
  109. ---------------------------------------------------------------------------->
  110.  
  111.  
  112.  
  113. <script type="text/javascript"
  114. src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
  115. <script type="text/javascript" src="http://static.tumblr.com/7qjmkr5/IUmmdsy41/jquery.style-my-tooltips.js"></script>
  116. <script>
  117. (function($){
  118. $(document).ready(function(){
  119. $("[title]").style_my_tooltips();
  120. });
  121. })(jQuery);
  122. </script>
  123.  
  124.  
  125.  
  126. <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
  127. <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.js"></script>
  128.  
  129. <script type="text/javascript">
  130. /*! Copyright (c) 2011 Piotr Rochala (http://rocha.la)
  131. * Dual licensed under the MIT (http://www.opensource.org/licenses/mit-license.php)
  132. * and GPL (http://www.opensource.org/licenses/gpl-license.php) licenses.
  133. *
  134. * Version: 0.5.0
  135. *
  136. */
  137. (function(d){jQuery.fn.extend({slimScroll:function(o){var a=ops=d.extend({wheelStep:20,width:"auto",height:"250px",size:"7px",color:"#000",position:"right",distance:"1px",start:"top",opacity:1,alwaysVisible:!1,railVisible:!1,railColor:"#333",railOpacity:"0.2",railClass:"slimScrollRail",barClass:"slimScrollBar",wrapperClass:"slimScrollDiv",allowPageScroll:!1,scroll:0},o);this.each(function(){function h(a,d,e){var f=a;d&&(f=parseInt(c.css("top"))+a*B/100*c.outerHeight(),d=b.outerHeight()-c.outerHeight(),
  138. f=Math.min(Math.max(f,0),d),c.css({top:f+"px"}));k=parseInt(c.css("top"))/(b.outerHeight()-c.outerHeight());f=k*(b[0].scrollHeight-b.outerHeight());e&&(f=a,a=f/b[0].scrollHeight*b.outerHeight(),c.css({top:a+"px"}));b.scrollTop(f);p();i()}function w(){q=Math.max(b.outerHeight()/b[0].scrollHeight*b.outerHeight(),o);c.css({height:q+"px"})}function p(){w();clearTimeout(x);l=C&&k==~~k;q>=b.outerHeight()?l=!0:(c.stop(!0,!0).fadeIn("fast"),y&&g.stop(!0,!0).fadeIn("fast"))}function i(){m||(x=setTimeout(function(){!r&&
  139. !s&&(c.fadeOut("slow"),g.fadeOut("slow"))},1E3))}var t,r,s,x,q,k,o=30,l=!1,B=parseInt(a.wheelStep),j=a.width,z=a.height,e=a.size,D=a.color,E=a.position,A=a.distance,u=a.start,F=a.opacity,m=a.alwaysVisible,y=a.railVisible,G=a.railColor,H=a.railOpacity,C=a.allowPageScroll,n=a.scroll,b=d(this);if(b.parent().hasClass("slimScrollDiv"))n&&(c=b.parent().find(".slimScrollBar"),g=b.parent().find(".slimScrollRail"),h(b.scrollTop()+parseInt(n),!1,!0));else{n=d("<div></div>").addClass(a.wrapperClass).css({position:"relative",
  140. overflow:"hidden",width:j,height:z});b.css({overflow:"hidden",width:j,height:z});var g=d("<div></div>").addClass(a.railClass).css({width:e,height:"100%",position:"absolute",top:0,display:m&&y?"block":"none","border-radius":e,background:G,opacity:H,zIndex:90}),c=d("<div></div>").addClass(a.barClass).css({background:D,width:e,position:"absolute",top:0,opacity:F,display:m?"block":"none","border-radius":e,BorderRadius:e,MozBorderRadius:e,WebkitBorderRadius:e,zIndex:99}),j="right"==E?{right:A}:{left:A};
  141. g.css(j);c.css(j);b.wrap(n);b.parent().append(c);b.parent().append(g);c.draggable({axis:"y",containment:"parent",start:function(){s=!0},stop:function(){s=!1;i()},drag:function(){h(0,d(this).position().top,!1)}});g.hover(function(){p()},function(){i()});c.hover(function(){r=!0},function(){r=!1});b.hover(function(){t=!0;p();i()},function(){t=!1;i()});var v=function(a){if(t){var a=a||window.event,b=0;a.wheelDelta&&(b=-a.wheelDelta/120);a.detail&&(b=a.detail/3);h(b,!0);a.preventDefault&&!l&&a.preventDefault();
  142. l||(a.returnValue=!1)}};(function(){window.addEventListener?(this.addEventListener("DOMMouseScroll",v,!1),this.addEventListener("mousewheel",v,!1)):document.attachEvent("onmousewheel",v)})();w();"bottom"==u?(c.css({top:b.outerHeight()-c.outerHeight()}),h(0,!0)):"object"==typeof u&&(h(d(u).position().top,null,!0),m||c.hide())}});return this}});jQuery.fn.extend({slimscroll:jQuery.fn.slimScroll})})(jQuery);
  143. </script>
  144.  
  145.  
  146. <script type="text/javascript">
  147. $(function(){
  148. $('#example-scroll').slimScroll({
  149. height: '100%',
  150. size: '3px',
  151. color: '{color:ScrollBar}'
  152. });
  153. });
  154. </script>
  155.  
  156.  
  157.  
  158. <script>
  159. $(document).ready(function(){
  160. $("#flip").click(function(){
  161. $("#navigation").slideToggle("slow");
  162. });
  163. });
  164. </script>
  165.  
  166.  
  167.  
  168. <link href='http://fonts.googleapis.com/css?family=Montserrat:400,700' rel='stylesheet' type='text/css'>
  169.  
  170. {block:IfInfiniteScroll}
  171. <script type="text/javascript" src="http://codysherman.tumblr.com/tools/infinite-scrolling/code"></script>
  172. {/block:IfInfiniteScroll}
  173.  
  174. <style type="text/css">
  175.  
  176.  
  177.  
  178. iframe, img, embed, object, video {max-width: 100%;border: none;}
  179.  
  180.  
  181. body { font-family:{select:Font};
  182. line-height:{text:Line Height};
  183. color:{color:Text};
  184. word-wrap: break-word;
  185. font-size:{text:Text Size};
  186. cursor:{select:Cursor};
  187. background:{color:Blog Background};}
  188.  
  189.  
  190. #s-m-t-tooltip { display: block;
  191. background: {color:Tooltip Background};
  192. font-size: 8px;
  193. font-family: calibri;
  194. letter-spacing: 1px;
  195. text-transform: uppercase;
  196. line-height:130%;
  197. color: {color:Tooltip Font};
  198. text-align: center;
  199. margin-left: 25px;
  200. padding:5px;
  201. min-width: 40px;
  202. max-width: 150px;
  203. z-index: 9999999999;}
  204.  
  205.  
  206.  
  207. iframe#tumblr_controls { right:0px !important;
  208. position:fixed !important;
  209. opacity:0.5;
  210. z-index:999999;}
  211.  
  212.  
  213.  
  214. iframe#tumblr_controls:hover { opacity:1;}
  215.  
  216.  
  217. ::selection { color: #bbb; background: #f5f5f5; }
  218. ::-moz-selection { color: #bbb; background: #f5f5f5; }
  219. ::-webkit-selection { color: #bbb; background: #f5f5f5; }
  220.  
  221.  
  222. a { text-decoration:none;
  223. cursor:pointer;
  224. color:{color:Hyperlinks};}
  225.  
  226. a:link, a:active, a:visited { color: {color:Hyperlinks};}
  227.  
  228. a:hover {color:{color:Hyperlinks Hover};}
  229.  
  230.  
  231. b, strong { font-weight:700;
  232. color:{color:Bold Text};}
  233.  
  234. i, em { font-weight:light;
  235. color:{color:Italic Text};}
  236.  
  237. h2 { font:bold 15px arial;}
  238.  
  239.  
  240. blockquote { margin: 3px 0px 6px 0px;
  241. padding:1px 8px 1px 8px;
  242. line-height:120%;
  243. border-left: 1px solid #eee;
  244. background-color:#fff;}
  245.  
  246. #caption { margin-bottom:2px;
  247. padding: 4px 15px 4px 15px;
  248. text-align:justify;
  249. background-color:#fafafa;}
  250.  
  251.  
  252. pre, xmp, plaintext, listing { display: block;
  253. white-space: pre;
  254. background: #fafafa;
  255. padding: 7px;
  256. word-wrap: break-word;
  257. font-family: consolas;}
  258.  
  259. small {line-height:80%;}
  260.  
  261.  
  262. #h1 {
  263. position:fixed;
  264. left:0px;
  265. bottom:0px;
  266. width:100%;
  267. z-index:99999999;
  268. background:{color:Links};
  269. text-align:center;}
  270.  
  271.  
  272. #title { font: 900 15px 'Montserrat';
  273. text-transform:uppercase;
  274. color:{color:Title Font};
  275. letter-spacing:5px;
  276. text-align:left;
  277. margin:auto;
  278. z-index:999999;
  279. width:100%;
  280. padding:12px;
  281. background:{color:Title Background};}
  282.  
  283.  
  284. #flip { cursor:pointer;
  285. display:inline-block;}
  286.  
  287.  
  288. #navigation { display:none;
  289. margin:auto;
  290. text-align:center;
  291. z-index:9;
  292. padding:10px;}
  293.  
  294.  
  295. #navigation a { display:inline-block;
  296. width:90px;
  297. color:{color:Links Font};
  298. letter-spacing:2px;
  299. padding:5px;
  300. font: 900 11px 'montserrat';
  301. text-align:center;
  302. text-transform:uppercase;}
  303.  
  304.  
  305. #navigation a:hover { color:{color:Links Hover Font};background:{color:Links Hover};}
  306.  
  307.  
  308. #pagination { display:inline-block;
  309. {block:permalinkpage}display:none;{/block:permalinkpage}
  310. {block:ifinfinitescroll}display:none;{/block:ifinfinitescroll}}
  311.  
  312.  
  313. #sidebar{ z-index:99999999;
  314. float:left;
  315. margin-left:4px;}
  316.  
  317.  
  318. #description { width:151px;
  319. font:10px calibri;
  320. color:{color:Description Font};
  321. letter-spacing:1px;
  322. padding:5px 8px 5px 8px;
  323. text-align:justify;
  324. margin:auto;
  325. z-index:999;
  326. background:{color:Description Background};}
  327.  
  328.  
  329. #search{ margin-bottom:2px;}
  330.  
  331.  
  332. #search input[type="text"]{ width:119px;
  333. font: 8px calibri;
  334. letter-spacing:2px;
  335. color:{color:Search Font};
  336. border:1px solid {color:Search Background};
  337. background:{color:Search Background};
  338. padding:5px 10px;
  339. text-transform:uppercase;}
  340.  
  341.  
  342. #search input[type="submit"]{ text-transform:uppercase;
  343. margin-right:2px;
  344. background:{color:Search Background};
  345. text-align:center;
  346. padding:5px 9px;
  347. font: bold 8px calibri;
  348. border:1px solid {color:Search Background};
  349. color:{color:Search Font};}
  350.  
  351.  
  352. #center { position:fixed;
  353. height:575px;
  354. left:0;
  355. right:0;
  356. margin:auto;
  357. z-index:999999;
  358. top:50px;
  359. {block:if250px}
  360. width:565px;
  361. {block:if250px}
  362. {block:if400px}
  363. width:715px;
  364. {block:if400px}
  365. {block:if500px}
  366. width:815px;
  367. {block:if500px}
  368. {block:permalinkpage}
  369. width:815px;
  370. {/block:permalinkpage}}
  371.  
  372.  
  373. #contained { float:left;
  374. height:580px;
  375. z-index:999999;
  376. overflow: hidden;
  377. background:white;
  378. border:1px solid {color:Border};
  379. {block:if250px}
  380. width:360px;
  381. {block:if250px}
  382. {block:if400px}
  383. width:510px;
  384. {block:if400px}
  385. {block:if500px}
  386. width:610px;
  387. {block:if500px}
  388. {block:permalinkpage}
  389. width:610px;
  390. {/block:permalinkpage}}
  391.  
  392. #container{ margin:auto;
  393. margin-top:30px;
  394. background:white;
  395. {block:indexpage}
  396. {block:if250px}
  397. width:250px;
  398. {block:if250px}
  399. {block:if400px}
  400. width:400px;
  401. {block:if400px}
  402. {block:if500px}
  403. width:500px;
  404. {block:if500px}
  405. {/block:indexpage}
  406. {block:permalinkpage}
  407. width:500px;margin-top:50px;
  408. {/block:permalinkpage}}
  409.  
  410. #posts{ {block:indexpage}
  411. {block:if250px}
  412. width:250px;
  413. {block:if250px}
  414. {block:if400px}
  415. width:400px;
  416. {block:if400px}
  417. {block:if500px}
  418. width:500px;
  419. {block:if500px}
  420. margin-bottom:{text:Post Distance};
  421. {/block:indexpage}
  422. {block:PermalinkPage}
  423. width:500px;
  424. margin-bottom:20px;
  425. {/block:PermalinkPage}}
  426.  
  427.  
  428. .titles{ color:{color:Post Title Font};
  429. font: 700 20px 'montserrat';
  430. line-height: 100%;
  431. text-align:left;
  432. padding:2px 8px 2px 8px;
  433. letter-spacing:2px;}
  434.  
  435.  
  436.  
  437. #posts img { max-width:100%;}
  438.  
  439.  
  440.  
  441. #text { padding: 4px 8px 4px 8px;
  442. text-align:justify;
  443. color:{color:Text};
  444. background:#fff;}
  445.  
  446.  
  447.  
  448. #quote { position:relative;
  449. text-align:justify;
  450. font: 12px 'montserrat';
  451. text-transform:uppercase;
  452. letter-spacing:1px;
  453. line-height: 120%;
  454. padding: 10px;
  455. background:{color:Quote Background};
  456. border:1px solid #f3f3f3;
  457. color:{color:Quote Font};}
  458.  
  459.  
  460.  
  461. #source { font: oblique 9px calibri;
  462. letter-spacing:1px;
  463. text-align:right;
  464. text-transform:uppercase;
  465. padding: 7px;
  466. color:{color:Quote Font};
  467. position:relative;}
  468.  
  469.  
  470. #source a {color:{color:Quote Font};}
  471.  
  472.  
  473. .chat ul{ padding:0px 0px 0px 0px;
  474. margin:0px;}
  475.  
  476. .chat li{ margin-bottom:1px;
  477. padding:10px;
  478. list-style-type:none;}
  479.  
  480. .chat li.odd { background:#f5f5f5;
  481. border:1px solid #eee;}
  482.  
  483. .chat li.even { background:#fcfcfc;}
  484.  
  485. span.chats { color:#222;
  486. font: 10px calibri;
  487. font-weight:700;
  488. letter-spacing:1px;
  489. text-transform:uppercase;}
  490.  
  491.  
  492. .tumblr_audio_player { width: 100%;}
  493.  
  494.  
  495. #asker { font: oblique 9px calibri;
  496. letter-spacing:1px;
  497. text-align:right;
  498. text-transform:uppercase;
  499. padding: 7px;
  500. color:{color:Question Font};
  501. position:relative;}
  502.  
  503.  
  504. #asker a { color:#222;}
  505.  
  506.  
  507.  
  508. #questions { text-align:justify;
  509. padding:10px;
  510. font: 12px 'montserrat';
  511. text-transform:uppercase;
  512. margin-bottom:5px;
  513. letter-spacing:1px;
  514. color:{color:Question Font};
  515. background:{color:Question Background};
  516. border:1px solid #f3f3f3;
  517. overflow:auto;}
  518.  
  519.  
  520. #answer { padding: 4px 13px 4px 13px;
  521. text-align:justify;
  522. color:{color:Text};}
  523.  
  524.  
  525. #greyscale { opacity:{text:Opacity Value};
  526. {block:ifgreyscale}
  527. filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale");
  528. filter: gray;
  529. -webkit-filter: grayscale(100%);
  530. {/block:ifgreyscale}}
  531.  
  532. #greyscale:hover{ {block:indexpage}
  533. opacity:1;
  534. -webkit-filter: grayscale(0%);
  535. {/block:indexpage}}
  536.  
  537.  
  538. .count { -webkit-backface-visibility: hidden;
  539. display: inline-block;
  540. position: relative;
  541. overflow: hidden;
  542. background: white;}
  543.  
  544.  
  545. .count img { display: block;
  546. -webkit-transition: opacity 0.7s ease-in-out;
  547. -moz-transition: opacity 0.7s ease-in-out;
  548. transition: opacity 0.7s ease-in-out;}
  549.  
  550. .count::after { -webkit-box-sizing: border-box;
  551. -moz-box-sizing: border-box;
  552. box-sizing: border-box;
  553. position: absolute;
  554. left:0px;
  555. opacity: .7;
  556. width: 100%;
  557. z-index: 1;
  558. -webkit-transition: -webkit-transform 0.7s ease-in-out;
  559. -moz-transition: -moz-transform 0.7s ease-in-out;
  560. transition: transform 0.7s ease-in-out;}
  561.  
  562.  
  563. .count::after { content: attr(data-title);
  564. top: 0;
  565. line-height:90%;
  566. font:700 25px 'montserrat';
  567. text-transform:uppercase;
  568. letter-spacing:2px;
  569. background: {color:Notes Background};
  570. color:{color:Notes Font};
  571. text-align:center;
  572. padding: 20px 10px 20px 10px;
  573. -webkit-transform: translateY(-100%);
  574. -moz-transform: translateY(-100%);
  575. transform: translateY(-100%);}
  576.  
  577.  
  578. .count:hover::after { -webkit-transform: translateY(0%);
  579. -moz-transform: translateY(0%);
  580. transform: translateY(0%);}
  581.  
  582.  
  583. .postInfo { {block:indexpage}
  584. letter-spacing:1px;
  585. font: 700 11px 'montserrat';
  586. text-align:right;
  587. text-transform:uppercase;
  588. color:{color:Info Font};
  589. z-index:2;
  590. padding:4px 3px 3px 3px;
  591. line-height:100%;
  592. opacity:0;
  593. {/block:indexpage}
  594. {block:PermalinkPage}
  595. display:none;
  596. {/block:PermalinkPage}}
  597.  
  598.  
  599.  
  600. .postTags{ {block:indexpage}
  601. text-transform:uppercase;
  602. font: 8px calibri;
  603. margin-top:3px;
  604. opacity:0;
  605. line-height:140%;
  606. text-align:justify;
  607. word-wrap: break-word;
  608. text-align:center;
  609. margin-top:10px;
  610. letter-spacing:1px;
  611. {/block:indexpage}
  612. {block:PermalinkPage}
  613. display:none;
  614. {/block:PermalinkPage}}
  615.  
  616.  
  617.  
  618. #posts:hover .postTags, #posts:hover .postInfo {opacity:1;}
  619.  
  620.  
  621. .postInfo a{{color:Info Font};}
  622.  
  623.  
  624. .postTags a{ color:{color:Tags Font};
  625. background:{color:Tags Background};
  626. padding:0 2px 0 2px;}
  627.  
  628.  
  629.  
  630. #infoPermalink{ font:9px calibri;
  631. text-transform:uppercase;
  632. letter-spacing:1px;
  633. text-align:left;
  634. margin-top:3px;
  635. padding:10px;
  636. line-height:130%;
  637. background-color: #f5f5f5;}
  638.  
  639.  
  640.  
  641. #tagPermalink{ font-family:calibri;
  642. text-transform:uppercase;
  643. font-size:8px;
  644. letter-spacing: 1px;
  645. text-align:justify;
  646. margin-top: 3px;
  647. padding: 13px;
  648. background-color: #f5f5f5;}
  649.  
  650.  
  651.  
  652. #noteCount{ font:oblique 30px 'montserrat';
  653. letter-spacing: -2px;
  654. text-align:right;
  655. margin-top:5px;
  656. text-transform:uppercase;
  657. margin-bottom: 5px;
  658. padding:1px 20px 1px 1px;
  659. color:#333;
  660. background-color:#f5f5f5;}
  661.  
  662.  
  663.  
  664. #infoPermalink a {{color:hyperlinks};}
  665.  
  666. #tagPermalink a {{color:hyperlinks};}
  667.  
  668. #tagPermalink a:hover {color:{color:hyperlinks hover};}
  669.  
  670.  
  671. .postNotes { width:490px;
  672. text-align: left;
  673. overflow:auto;
  674. line-height:15px;
  675. padding:5px;
  676. background:#f5f5f5;
  677. font:10px arial;}
  678.  
  679.  
  680.  
  681. .postNotes img{ width:26px;
  682. margin:5px;
  683. border:5px solid #f5f5f5;}
  684.  
  685.  
  686. .postNotes li{ list-style-type:none;
  687. padding:4px;
  688. margin-bottom:5px;
  689. background:#fff;
  690. margin-left:-40px;
  691. border-radius:4px;}
  692.  
  693.  
  694. ol.notes { margin: 10px;}
  695.  
  696. img.avatar { vertical-align: -19px;
  697. width: 26px;
  698. height: 26px;
  699. padding: 1px;}
  700.  
  701.  
  702. #chloe a {color:{color:Title Font};}
  703.  
  704.  
  705. #greyscale, .postInfo, .postTags { -webkit-transition: all 0.7s ease-in-out;
  706. -moz-transition: all 0.7s ease-in-out;
  707. -o-transition: all 0.7s ease-in-out;
  708. -ms-transition: all 0.7s ease-in-out;
  709. transition: all 0.7s ease-in-out;}
  710.  
  711.  
  712. </style>
  713.  
  714.  
  715.  
  716. </head>
  717. <body>
  718.  
  719.  
  720. <div id="h1">
  721.  
  722. <div id="title">{Title} <div id="flip">+</div></div>
  723.  
  724.  
  725.  
  726. <div id="navigation">
  727. <a href="/">{text:Home}</a><a href="/ask">{text:Ask}</a><a href="{text:archive link}">{text:archive}</a>{block:ifLink1}<a href="{text:Link1}">{text:Link1 Title}</a>{/block:ifLink1}{block:ifLink2}<a href="{text:Link2}">{text:Link2 Title}</a>{/block:ifLink2}{block:ifLink3}<a href="{text:Link3}">{text:Link3 Title}</a>{/block:ifLink3}{block:ifLink4}<a href="{text:Link4}">{text:Link4 Title}</a>{/block:ifLink4}{block:ifLink5}<a href="{text:Link5}">{text:Link5 Title}</a>{/block:ifLink5}{block:IfNotInfiniteScroll}{block:Pagination}<div id="pagination">{block:PreviousPage}<a href="{PreviousPage}">« back</a>{/block:PreviousPage}{block:NextPage}<a href="{NextPage}">forth »</a>{/block:NextPage}</div>{/block:Pagination}{/block:IfNotInfiniteScroll}
  728. </div>
  729. </div>
  730.  
  731.  
  732. <div id="center">
  733.  
  734.  
  735. <div id="contained">
  736. <div id="example-scroll">
  737. <div id="container">
  738.  
  739. {block:IfInfiniteScroll}
  740. <div class = "autopagerize_page_element" >
  741. {/block:IfInfiniteScroll}
  742.  
  743. {block:Posts}
  744.  
  745. <div id="posts">
  746.  
  747.  
  748.  
  749.  
  750. <!-------------------------------------------------------------------------
  751.  
  752. quote ------------>
  753.  
  754.  
  755. {block:Quote}
  756.  
  757. <div class="postInfo">
  758. {block:Date}<a href="{Permalink}" title="permalink">{ShortMonth}{DayOfMonthWithZero}</a>{/block:Date} {block:RebloggedFrom}, from <a href="{ReblogRootURL}" >{ReblogRootName}</a>{/block:RebloggedFrom} — <a href="{ReblogURL}" title="reblog this post">reblog</a>
  759. </div>
  760.  
  761. <div id="source">quote from: {Source}</div>
  762. <div id="quote">{Quote}</div>
  763.  
  764. <div class="postTags">
  765. {block:HasTags}{block:Tags} <a href="{TagURL}"> #{Tag}</a>{/block:Tags}{/block:HasTags}
  766. </div>
  767.  
  768. {/block:Quote}
  769.  
  770.  
  771.  
  772.  
  773. <!-------------------------------------------------------------------------
  774.  
  775. photo ------------>
  776.  
  777.  
  778. {block:Photo}
  779. {block:indexpage}
  780.  
  781. <div class="postInfo">
  782. {block:Date}<a href="{Permalink}" title="permalink">{ShortMonth}{DayOfMonthWithZero}</a>{/block:Date} {block:RebloggedFrom}, from <a href="{ReblogRootURL}" >{ReblogRootName}</a>{/block:RebloggedFrom} — <a href="{ReblogURL}" title="reblog this post">reblog</a>
  783. </div>
  784.  
  785. <div id="greyscale">
  786.  
  787. <center>
  788. <div class="count" data-title="— {NoteCountWithLabel} —">
  789. <img src="{PhotoURL-500}" style="
  790. {block:if250px}width:250px;{/block:if250px}
  791. {block:if400px}width:400px;{/block:if400px}
  792. {block:if500px}width:500px;{/block:if500px}"/>
  793. </div>
  794. </center>
  795.  
  796. </div>
  797.  
  798. {block:ifcaption}
  799. {block:Caption}
  800. <div id="caption">{Caption}</div>
  801. {/block:Caption}
  802. {/block:ifcaption}
  803.  
  804.  
  805. <div class="postTags">
  806. {block:HasTags}{block:Tags} <a href="{TagURL}"> #{Tag}</a>{/block:Tags}{/block:HasTags}
  807. </div>
  808.  
  809. {/block:indexpage}
  810.  
  811. {block:permalinkpage}
  812. <center>
  813. <img src="{PhotoURL-500}" alt="{PhotoAlt}" style="max-width:500px;">
  814. </center>
  815. {block:Caption}<div id="caption">{Caption}</div>{/block:Caption}
  816. {/block:permalinkpage}
  817.  
  818. {/block:Photo}
  819.  
  820.  
  821.  
  822.  
  823. <!-------------------------------------------------------------------------
  824.  
  825. photoset ------------>
  826.  
  827.  
  828. {block:Photoset}
  829. {block:indexpage}
  830.  
  831. <div class="postInfo">
  832. {block:Date}<a href="{Permalink}" title="permalink">{ShortMonth}{DayOfMonthWithZero}</a>{/block:Date} {block:RebloggedFrom}, from <a href="{ReblogRootURL}" >{ReblogRootName}</a>{/block:RebloggedFrom} — <a href="{ReblogURL}" title="reblog this post">reblog</a>
  833. </div>
  834.  
  835. <div id="greyscale">
  836.  
  837. <center>
  838. <div class="count" data-title="— {NoteCountWithLabel} —">
  839. {block:if250px}{Photoset-250}{/block:if250px}
  840. {block:if400px}{Photoset-400}{/block:if400px}
  841. {block:if500px}{Photoset-500}{/block:if500px}
  842. </div>
  843. </center>
  844.  
  845. </div>
  846.  
  847. {block:ifcaption}
  848. {block:Caption}
  849. <div id="caption">{Caption}</div>
  850. {/block:Caption}
  851. {/block:ifcaption}
  852.  
  853. <div class="postTags">
  854. {block:HasTags}{block:Tags} <a href="{TagURL}"> #{Tag}</a>{/block:Tags}{/block:HasTags}
  855. </div>
  856.  
  857. {/block:indexpage}
  858.  
  859. {block:permalinkpage}
  860. {Photoset-500}
  861. {block:Caption}
  862. <div id="caption">{Caption}</div>
  863. {/block:Caption}
  864. {/block:permalinkpage}
  865.  
  866. {/block:Photoset}
  867.  
  868.  
  869.  
  870.  
  871.  
  872. <!-------------------------------------------------------------------------
  873.  
  874. link ------------>
  875.  
  876.  
  877. {block:Link}
  878.  
  879. <div class="postInfo">
  880. {block:Date}<a href="{Permalink}" title="permalink">{ShortMonth}{DayOfMonthWithZero}</a>{/block:Date} {block:RebloggedFrom}, from <a href="{ReblogRootURL}" >{ReblogRootName}</a>{/block:RebloggedFrom} — <a href="{ReblogURL}" title="reblog this post">reblog</a>
  881. </div>
  882.  
  883. <a href="{URL}" class="link" {Target}>
  884. <div class="titles">{Name} ▹</div>
  885. </a>
  886. {block:Description}
  887. <div id="text">{Description}</div>
  888. {/block:Description}
  889.  
  890.  
  891. <div class="postTags">
  892. {block:HasTags}{block:Tags} <a href="{TagURL}"> #{Tag}</a>{/block:Tags}{/block:HasTags}
  893. </div>
  894.  
  895. {block:Link}
  896.  
  897.  
  898.  
  899.  
  900.  
  901. <!-------------------------------------------------------------------------
  902.  
  903. chat ------------>
  904.  
  905.  
  906. {block:Chat}
  907.  
  908. <div class="postInfo">
  909. {block:Date}<a href="{Permalink}" title="permalink">{ShortMonth}{DayOfMonthWithZero}</a>{/block:Date} {block:RebloggedFrom}, from <a href="{ReblogRootURL}" >{ReblogRootName}</a>{/block:RebloggedFrom} — <a href="{ReblogURL}" title="reblog this post">reblog</a>
  910. </div>
  911.  
  912. {block:Title}
  913. <div class="titles">{Title}</div>
  914. {/block:Title}
  915. <div class="chat">
  916. <ul>
  917. {block:Lines}
  918. <li class="{Alt} u{UserNumber}">
  919. {block:Label}<span class="chats">{Label}</span>{/block:Label}
  920. {Line}
  921. </li>
  922. {/block:Lines}
  923. </ul>
  924. </div>
  925.  
  926. <div class="postTags">
  927. {block:HasTags}{block:Tags} <a href="{TagURL}"> #{Tag}</a>{/block:Tags}{/block:HasTags}
  928. </div>
  929.  
  930. {/block:Chat}
  931.  
  932.  
  933.  
  934.  
  935.  
  936. <!-------------------------------------------------------------------------
  937.  
  938. audio ------------>
  939.  
  940.  
  941. {block:Audio}
  942.  
  943. <div class="postInfo">
  944. {block:Date}<a href="{Permalink}" title="permalink">{ShortMonth}{DayOfMonthWithZero}</a>{/block:Date} {block:RebloggedFrom}, from <a href="{ReblogRootURL}" >{ReblogRootName}</a>{/block:RebloggedFrom} — <a href="{ReblogURL}" title="reblog this post">reblog</a>
  945. </div>
  946.  
  947. <div id="audio">
  948. {block:AudioEmbed}
  949. {AudioEmbed color="white"}
  950. {/block:AudioEmbed}
  951. </div>
  952.  
  953. {block:ifcaption}
  954. {block:Caption}
  955. <div id="caption">{Caption}</div>
  956. {/block:Caption}
  957. {/block:ifcaption}
  958.  
  959.  
  960. <div class="postTags">
  961. {block:HasTags}{block:Tags} <a href="{TagURL}"> #{Tag}</a>{/block:Tags}{/block:HasTags}
  962. </div>
  963.  
  964. {/block:Audio}
  965.  
  966.  
  967.  
  968.  
  969.  
  970. <!-------------------------------------------------------------------------
  971.  
  972. text ------------>
  973.  
  974.  
  975. {block:Text}
  976. {block:indexpage}
  977.  
  978. <div class="postInfo">
  979. {block:Date}<a href="{Permalink}" title="permalink">{ShortMonth}{DayOfMonthWithZero}</a>{/block:Date} {block:RebloggedFrom}, from <a href="{ReblogRootURL}" >{ReblogRootName}</a>{/block:RebloggedFrom} — <a href="{ReblogURL}" title="reblog this post">reblog</a>
  980. </div>
  981.  
  982. <div id="greyscale">
  983.  
  984. {block:Title}
  985. <div class="titles">{Title}</div>
  986. {/block:Title}
  987. <div id="text">{Body}</div>
  988.  
  989. </div>
  990.  
  991. <div class="postTags">
  992. {block:HasTags}{block:Tags} <a href="{TagURL}"> #{Tag}</a>{/block:Tags}{/block:HasTags}
  993. </div>
  994.  
  995. {/block:indexpage}
  996.  
  997. {block:permalinkpage}
  998. {block:Title}
  999. <div class="titles">{Title}</div>
  1000. {/block:Title}
  1001. <div id="text">{Body}</div>
  1002. {/block:permalinkpage}
  1003.  
  1004. {/block:Text}
  1005.  
  1006.  
  1007.  
  1008.  
  1009. <!-------------------------------------------------------------------------
  1010.  
  1011. video ------------>
  1012.  
  1013.  
  1014. {block:Video}
  1015. {block:indexpage}
  1016.  
  1017. <div class="postInfo">
  1018. {block:Date}<a href="{Permalink}" title="permalink">{ShortMonth}{DayOfMonthWithZero}</a>{/block:Date} {block:RebloggedFrom}, from <a href="{ReblogRootURL}" >{ReblogRootName}</a>{/block:RebloggedFrom} — <a href="{ReblogURL}" title="reblog this post">reblog</a>
  1019. </div>
  1020.  
  1021.  
  1022. {block:if400px}{Video-400}{/block:if400px}
  1023. {block:if500px}{Video-500}{/block:if500px}
  1024.  
  1025. {block:ifcaption}
  1026. {block:Caption}
  1027. <div id="caption">{Caption}</div>
  1028. {/block:Caption}
  1029. {/block:ifcaption}
  1030.  
  1031.  
  1032. <div class="postTags">
  1033. {block:HasTags}{block:Tags} <a href="{TagURL}"> #{Tag}</a>{/block:Tags}{/block:HasTags}
  1034. </div>
  1035.  
  1036. {/block:indexpage}
  1037.  
  1038. {block:permalinkpage}
  1039. {Video-500}
  1040. {block:Caption}{Caption}{/block:Caption}
  1041. {/block:permalinkpage}
  1042.  
  1043. {block:Video}
  1044.  
  1045.  
  1046.  
  1047.  
  1048. <!-------------------------------------------------------------------------
  1049.  
  1050. answer ------------>
  1051.  
  1052.  
  1053. {block:Answer}
  1054.  
  1055. <div class="postInfo">
  1056. {block:Date}<a href="{Permalink}" title="permalink">{ShortMonth}{DayOfMonthWithZero}</a>{/block:Date} {block:RebloggedFrom}, from <a href="{ReblogRootURL}" >{ReblogRootName}</a>{/block:RebloggedFrom} — <a href="{ReblogURL}" title="reblog this post">reblog</a>
  1057. </div>
  1058.  
  1059. <div id="asker">message from {Asker}:</div>
  1060. <div id="questions">{Question}</div>
  1061. <div id="answer">{Answer}</div>
  1062.  
  1063.  
  1064. <div class="postTags">
  1065. {block:HasTags}{block:Tags} <a href="{TagURL}"> #{Tag}</a>{/block:Tags}{/block:HasTags}
  1066. </div>
  1067.  
  1068. {/block:Answer}
  1069.  
  1070.  
  1071.  
  1072.  
  1073. <!---------------------------------------------------------------------------
  1074.  
  1075. permalink ------------->
  1076.  
  1077.  
  1078.  
  1079. {block:permalinkpage}
  1080.  
  1081. <div id="infoPermalink">
  1082. {block:Date}
  1083.  
  1084. + posted on {Month} {DayOfMonth}, {Year} at {24Hour}:{Minutes}
  1085. <br>
  1086. {/block:Date}
  1087. {block:RebloggedFrom}
  1088. + via: <a href="{ReblogParentURL}">{ReblogParentName}</a>
  1089. <br>
  1090. {/block:RebloggedFrom}
  1091. {block:ContentSource}
  1092. + originally from: <a href="{SourceURL}">{SourceLink}</a>
  1093.  
  1094. {/block:ContentSource}
  1095. </div>
  1096.  
  1097. {block:HasTags}
  1098. <div id="tagPermalink">
  1099. <b>Tagged as:</b>{block:Tags} <a href="{TagURL}"> <small>#</small>{Tag}</a>{/block:Tags}
  1100. </div>
  1101. {/block:HasTags}
  1102.  
  1103. {block:NoteCount}
  1104. <div id="noteCount">
  1105. {NoteCountWithLabel}
  1106. </div>
  1107. {/block:NoteCount}
  1108.  
  1109.  
  1110. {block:PostNotes}
  1111. <div class="postNotes">
  1112. {PostNotes-64}
  1113. </div>
  1114. {/block:PostNotes}
  1115.  
  1116.  
  1117.  
  1118. {/block:permalinkpage}
  1119.  
  1120.  
  1121. </div>
  1122. {/block:Posts}
  1123.  
  1124. {block:IfInfiniteScroll}
  1125. </div>
  1126. {/block:IfInfiniteScroll}
  1127.  
  1128. </div>
  1129.  
  1130.  
  1131.  
  1132. </div>
  1133.  
  1134. </div>
  1135.  
  1136.  
  1137. <!-------------------------------------------------------------------------
  1138.  
  1139. sidebar ------------>
  1140.  
  1141.  
  1142. <div id="sidebar">
  1143.  
  1144. <div id=search>
  1145. <form action="/search" method="get" class="sfm">
  1146. <input type="submit" value="x" /><input type="text" name="q" value="search" />
  1147. </form>
  1148. </div>
  1149.  
  1150.  
  1151. <div id="description">{Description}</div>
  1152.  
  1153. </div>
  1154.  
  1155. </div>
  1156.  
  1157.  
  1158.  
  1159.  
  1160.  
  1161. <div id="chloe" title="coded by chloe" style="font: bold 8px 'Montserrat';text-transform:uppercase;letter-spacing:2px;padding: 3px 5px 3px 5px;z-index:99999999;position:fixed;bottom:12px;right:15px;color:{color:Title Font};background:{color:Title Background};"><a href="http://adf.ly/s0LYq">chso</a></div>
  1162.  
  1163. </body>
  1164. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Public Pastes
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!