API tools faq
paste
Advertisement
ochizukes

Ebb and Flow

ochizukes
Jul 20th, 2014
4,913
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
CSS 33.73 KB | None | 0 0
raw download clone embed print report
  1. <!--
  2.  
  3. Ebb and Flow
  4. Terms of Use: http://maomuthemes.tumblr.com/#tou
  5. Support: http://maomuthemes.tumblr.com/ask
  6.  
  7. This theme is licensed under a Creative Commons Attribution-NonCommercial-NoDerivatives 4.0 International license.
  8.  
  9. http://creativecommons.org/licenses/by-nc-nd/4.0/
  10.  
  11. Please check out my theme shop! http://maomu.storenvy.com
  12.  
  13. -->
  14.  
  15. <!DOCTYPE html><html>
  16. <head>
  17.  
  18. <!-- META -->
  19.  
  20. <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
  21. <title>{Title}{block:PostTitle}: {PostTitle}{/block:PostTitle}</title>
  22. {block:Description}
  23. <meta name="description" content="{MetaDescription}" />
  24. {/block:Description}
  25. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  26. <!--[if lt IE 9]>
  27. <script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script>
  28. <![endif]-->
  29.  
  30. <!-- LINK REL -->
  31.  
  32. <link rel="shortcut icon" href="{image:Favicon}"/>
  33. <link rel="apple-touch-icon" href="{PortraitURL-128}"/>
  34. <link rel="alternate" type="application/rss+xml" href="{RSS}"/>
  35. <link href='http://fonts.googleapis.com/css?family=Open+Sans:400italic,600italic,400,600' rel='stylesheet' type='text/css'>
  36. <link href='http://fonts.googleapis.com/css?family=Ubuntu:400,500,400italic,500italic' rel='stylesheet' type='text/css'>
  37.  
  38. <!-- IMAGES -->
  39.  
  40. <meta name="image:Favicon" content=""/>
  41. <meta name="image:Portrait" content="https://secure.static.tumblr.com/79bda0d724bfb0beac6dd0693dfd08e3/at44twr/Loln90wqx/tumblr_static_azou5qjmdlsk4wwwwg4owoscc.jpg"/>
  42.  
  43. <!-- COLORS -->
  44.  
  45. <meta name="color:Bar Border" content="#ffffff"/>
  46. <meta name="color:Blockquote" content="#ffffff"/>
  47. <meta name="color:Extra Links" content="#ffffff"/>
  48. <meta name="color:Gradient Top" content="#dce7f8"/>
  49. <meta name="color:Gradient Bottom" content="#ffe3e3"/>
  50. <meta name="color:Hamburger Lines" content="#ffffff"/>
  51. <meta name="color:Link" content="#dcecf5"/>
  52. <meta name="color:Link Hover" content="#ffffff"/>
  53. <meta name="color:Navicons" content="#000000"/>
  54. <meta name="color:Post Border" content="#ffffff"/>
  55. <meta name="color:Perma BG" content="#000000"/>
  56. <meta name="color:Perma Border" content="#ffffff"/>
  57. <meta name="color:Perma Text" content="#ffffff"/>
  58. <meta name="color:Post Title BG" content="#ffffff"/>
  59. <meta name="color:Post Title Text" content="#ffffff"/>
  60. <meta name="color:Text" content="#ffffff"/>
  61. <meta name="color:Title" content="#ffffff"/>
  62. <meta name="color:Tooltip BG" content="#000000"/>
  63. <meta name="color:Tooltip Border" content="#ffffff"/>
  64. <meta name="color:Tooltip Text" content="#ffffff"/>
  65.  
  66. <!-- ON/OFF -->
  67.  
  68. <meta name="if:Audio Player White" content="0"/>
  69. <meta name="if:Caption" content="0"/>
  70. <meta name="if:Faded Tumblr Controls" content="0"/>
  71. <meta name="if:Menu Borders" content="0"/>
  72. <meta name="if:Rounded Corners" content="0"/>
  73.  
  74. <!-- TEXT -->
  75.  
  76. <meta name="text:Link1" content="link 1"/>
  77. <meta name="text:Link1 URL" content="/"/>
  78. <meta name="text:Link2" content="link 2"/>
  79. <meta name="text:Link2 URL" content="/"/>
  80. <meta name="text:Link3" content="link 3"/>
  81. <meta name="text:Link3 URL" content="/"/>
  82. <meta name="text:Link4" content="link 4"/>
  83. <meta name="text:Link4 URL" content="/"/>
  84. <meta name="text:Link5" content="link 5"/>
  85. <meta name="text:Link5 URL" content="/"/>
  86.  
  87. <meta name="text:Blogger" content="/"/>
  88. <meta name="text:Digg" content="/"/>
  89. <meta name="text:Dribbble" content="/"/>
  90. <meta name="text:Facebook" content="/"/>
  91. <meta name="text:Google Plus" content="/"/>
  92. <meta name="text:Linkedin" content="/"/>
  93. <meta name="text:Pinterest" content="/"/>
  94. <meta name="text:RSS Feed" content="/"/>
  95. <meta name="text:Stumbleupon" content="/"/>
  96. <meta name="text:Twitter" content="/"/>
  97. <meta name="text:Vimeo" content="/"/>
  98. <meta name="text:YouTube" content="/"/>
  99.  
  100. <!-- SELECT -->
  101.  
  102. <meta name="select:Accent Color" content="255,255,255" title="Light"/>
  103. <meta name="select:Accent Color" content="0,0,0" title="Dark"/>
  104.  
  105. <meta name="select:Accent Transparency" content="1" title="Opaque"/>
  106. <meta name="select:Accent Transparency" content=".9" title="90%"/>
  107. <meta name="select:Accent Transparency" content=".8" title="80%"/>
  108. <meta name="select:Accent Transparency" content=".7" title="70%"/>
  109. <meta name="select:Accent Transparency" content=".6" title="60%"/>
  110. <meta name="select:Accent Transparency" content=".5" title="50%"/>
  111. <meta name="select:Accent Transparency" content=".4" title="40%"/>
  112. <meta name="select:Accent Transparency" content=".3" title="30%"/>
  113. <meta name="select:Accent Transparency" content=".2" title="20%"/>
  114. <meta name="select:Accent Transparency" content=".1" title="10%"/>
  115. <meta name="select:Accent Transparency" content=".0" title="Transparent"/>
  116.  
  117. <meta name="select:Bar Color" content="255,255,255" title="Light"/>
  118. <meta name="select:Bar Color" content="0,0,0" title="Dark"/>
  119.  
  120. <meta name="select:Bar Transparency" content="1" title="Opaque"/>
  121. <meta name="select:Bar Transparency" content=".9" title="90%"/>
  122. <meta name="select:Bar Transparency" content=".8" title="80%"/>
  123. <meta name="select:Bar Transparency" content=".7" title="70%"/>
  124. <meta name="select:Bar Transparency" content=".6" title="60%"/>
  125. <meta name="select:Bar Transparency" content=".5" title="50%"/>
  126. <meta name="select:Bar Transparency" content=".4" title="40%"/>
  127. <meta name="select:Bar Transparency" content=".3" title="30%"/>
  128. <meta name="select:Bar Transparency" content=".2" title="20%"/>
  129. <meta name="select:Bar Transparency" content=".1" title="10%"/>
  130. <meta name="select:Bar Transparency" content=".0" title="Transparent"/>
  131.  
  132. <meta name="select:Navicon Transparency" content="1" title="Opaque"/>
  133. <meta name="select:Navicon Transparency" content=".9" title="90%"/>
  134. <meta name="select:Navicon Transparency" content=".8" title="80%"/>
  135. <meta name="select:Navicon Transparency" content=".7" title="70%"/>
  136. <meta name="select:Navicon Transparency" content=".6" title="60%"/>
  137. <meta name="select:Navicon Transparency" content=".5" title="50%"/>
  138. <meta name="select:Navicon Transparency" content=".4" title="40%"/>
  139. <meta name="select:Navicon Transparency" content=".3" title="30%"/>
  140. <meta name="select:Navicon Transparency" content=".2" title="20%"/>
  141. <meta name="select:Navicon Transparency" content=".1" title="10%"/>
  142. <meta name="select:Navicon Transparency" content=".0" title="Transparent"/>
  143.  
  144. <meta name="select:Post Color" content="255,255,255" title="Light"/>
  145. <meta name="select:Post Color" content="0,0,0" title="Dark"/>
  146.  
  147. <meta name="select:Post Transparency" content="1" title="Opaque"/>
  148. <meta name="select:Post Transparency" content=".9" title="90%"/>
  149. <meta name="select:Post Transparency" content=".8" title="80%"/>
  150. <meta name="select:Post Transparency" content=".7" title="70%"/>
  151. <meta name="select:Post Transparency" content=".6" title="60%"/>
  152. <meta name="select:Post Transparency" content=".5" title="50%"/>
  153. <meta name="select:Post Transparency" content=".4" title="40%"/>
  154. <meta name="select:Post Transparency" content=".3" title="30%"/>
  155. <meta name="select:Post Transparency" content=".2" title="20%"/>
  156. <meta name="select:Post Transparency" content=".1" title="10%"/>
  157. <meta name="select:Post Transparency" content=".0" title="Transparent"/>
  158.  
  159. <style type="text/css">
  160.  
  161. /* Tumblr controls */
  162.  
  163. {block:IfFadedTumblrControls}
  164.  
  165. iframe#tumblr_controls { opacity:0.35; position:fixed !important; -webkit-filter:invert(100%); -moz-filter:invert(100%); -o-filter:invert(100%); -ms-filter:invert(100%); filter:invert(100%); -webkit-transition:all 0.8s ease-out; -moz-transition:all 0.8s ease-out; transition:all 0.8s ease-out; z-index:9999; }
  166.  
  167. iframe#tumblr_controls:hover { opacity:0.8;  -webkit-filter:invert(100%); -moz-filter:invert(100%); -o-filter:invert(100%); -ms-filter:invert(100%); filter:invert(100%); -webkit-transition:all 0.4s ease-out; -moz-transition:all 0.4s ease-out; transition:all 0.4s ease-out ;z-index:9999; }
  168.  
  169. {/block:IfFadedTumblrControls}
  170.  
  171. /* Viewport + body properties */
  172.  
  173. html { background: -webkit-linear-gradient({color:Gradient Top}, {color:Gradient Bottom}); background: -o-linear-gradient({color:Gradient Top}, {color:Gradient Bottom}); background: -moz-linear-gradient({color:Gradient Top}, {color:Gradient Bottom}); background: linear-gradient({color:Gradient Top}, {color:Gradient Bottom}); min-height:100%; }
  174.  
  175. body { color:{color:Text}; font:11px open sans; line-height:17px; margin:0; padding:0; }
  176.  
  177. /* Links + links on mouseover */
  178.  
  179. a { color:{color:Link}; text-decoration:none; transition-duration:0.5s; -webkit-transition-duration:0.5s; }
  180.  
  181. a:hover { color:{color:Link Hover}; transition-duration:0.5s; -webkit-transition-duration:0.5s; }
  182.  
  183. /* Preformatted + small text */
  184.  
  185. pre { display:block; font:10px open sans; letter-spacing:0.091em; padding-left:0.182px; width:100%; word-wrap:break-word; }
  186.  
  187. small { font:10px open sans; letter-spacing:0.091em; }
  188.  
  189. /* Blockquotes */
  190.  
  191. blockquote { border-left:1px solid {color:Blockquote}; margin-left:12px; padding-top:1px; padding-left:12px; padding-bottom:1px; padding-right:0; width:90%; word-wrap:break-word; }
  192.  
  193. /* Removes viewport padding */
  194.  
  195. figure { margin:0; }
  196.  
  197. /* Restricts photos to post margins */
  198.  
  199. img { max-width:100%; border:0; }
  200.  
  201. /* Navicons */
  202.  
  203. #icons { margin:0 auto; opacity:{select:Navicon Transparency}; padding-left:30px; padding-top:10px; width:350px; }
  204.  
  205. .icon { float:left; width:70px; }
  206.  
  207. /* Menu icon */
  208.  
  209. .hamburger {  background:{color:Navicons}; {block:IfRoundedCorners} border-radius:0.3em; {/block:IfRoundedCorners} font-size:.75em; height:3.3em; position:relative; width:3.3em; }
  210.  
  211. .hamburger:before { border-top:0.3em solid {color:Hamburger Lines}; border-bottom:0.3em solid {color:Hamburger Lines}; {block:IfRoundedCorners} border-radius:0.1em; {/block:IfRoundedCorners} content:""; height: 1em; margin:auto; left:0.7em; position:absolute; top:1em; width:1.9em; }
  212.  
  213. .hamburger:after { background:{color:Hamburger Lines}; {block:IfRoundedCorners }border-radius:0.1em; {/block:IfRoundedCorners} content:""; display:block; height:0.3em; left:0.7em; position:absolute; top:1.6em; width:1.9em; }
  214.  
  215. /* Home icon */
  216.  
  217. .home { border-bottom:none; border-right:1.5em solid {color:Navicons}; border-left:1.5em solid {color:Navicons}; border-top:1.4em solid {color:Navicons}; font-size:.65em; height:1em; margin-top:1.2em; margin-left:-.1em; position:relative; width:0.5em; }
  218.  
  219. .home::before { border-left:2.4em solid transparent; border-right:2.4em solid transparent; border-bottom:1.5em solid {color:Navicons}; content:""; height:0em; position:absolute; right:-2.1em; top:-2.8em; width:0em; }
  220.  
  221. /* Message icon */
  222.  
  223. .comment { background:{color:Navicons}; {block:IfRoundedCorners} border-radius:0.2em; {/block:IfRoundedCorners} font-size:16px; height:1.5em; margin-left:-5px; margin-top:1px; position:relative; width:2em; }
  224.  
  225. .comment::before { border-bottom:0.4em solid transparent; border-left:0.4em solid {color:Navicons}; content:""; bottom:-0.3em; height:0em; position:absolute; right:0.4em; width:0em; }
  226.  
  227. /* Archive icon */
  228.  
  229. .pencil { background:{color:Navicons}; font-size:1.9em; height:0.8em; margin-top:4px; margin-left:13px; position:relative; -webkit-transform:rotate(45deg); -moz-transform:rotate(45deg); -o-transform:rotate(45deg); -ms-transform:rotate(45deg); transform:rotate(45deg); width:0.35em; }
  230.  
  231. .pencil:before{ background:{color:Navicons}; {block:IfRoundedCorners} border-radius:0.1em; {/block:IfRoundedCorners} content:""; height:0.3em; left:0; position:absolute; top:-0.35em; width:0.35em; }
  232.  
  233. .pencil:after { border:solid 0.2em {color:Navicons}; border-bottom-color:transparent; border-left-color:transparent; border-right-color:transparent; border-top:solid 0.45em {color:Navicons}; content:""; height:0; position:absolute; top:0.85em; left:0; width:0; }
  234.  
  235. /* Heart icon */
  236.  
  237. .heart { font-size:16px; height:0; margin-top:0em; margin-left:.8em; position:relative; width:0; }
  238.  
  239. .heart::before, .heart::after { background:{color:Navicons}; border-radius:1em 1em 0 0; -moz-border-radius:1em 1em 0 0; content:""; height:1.6em; position:absolute; -webkit-transform:rotate(-45deg); -moz-transform:rotate(-45deg); -ms-transform:rotate(-45deg); -o-transform:rotate(-45deg); transform:rotate(-45deg); -webkit-transform-origin:0 100%; -moz-transform-origin:0 100%; -ms-transform-origin:0 100%; -o-transform-origin:0 100%; transform-origin:0 100%; width: 1em; }
  240.  
  241. .heart::after { left:-0.96em; -webkit-transform:rotate(45deg); -moz-transform:rotate(45deg); -ms-transform:rotate(45deg); -o-transform:rotate(45deg); transform:rotate(45deg); -webkit-transform-origin:100% 100%; -moz-transform-origin:100% 100%; -ms-transform-origin:100% 100%; -o-transform-origin:100% 100%; transform-origin:100% 100%; }
  242.  
  243. /* Top bar */
  244.  
  245. #menu { background-color:rgba({select:Bar Color},{select:Bar Transparency}); border-bottom:1px solid {color:Bar Border}; height:50px; left:0; transition-duration:0.5s; -webkit-transition-duration:0.5s; top:0; width:100%; z-index:1; }
  246.  
  247. /* Top bar onclick element */
  248.  
  249. #menu.open{ height:255px; transition-duration:0.5s; -webkit-transition-duration:0.5s; }
  250.  
  251. /* Description, portrait, links, and social media wrap */
  252.  
  253. #dropbar { margin-left:-257px; opacity:0; transition:opacity 0.5s ease, visibility 1s ease; width:894px; visibility:hidden; }
  254.  
  255. #menu.open #dropbar { opacity:1; transition:opacity 1.5s ease, visibility 1s ease; visibility:visible; }
  256.  
  257. /* Title */
  258.  
  259. .title { border-bottom:1px solid {color:Title}; color:{color:Title}; font:14px ubuntu; font-weight:100; letter-spacing:2px; margin-bottom:7px; padding:5px; text-align:center; text-transform:uppercase; }
  260.  
  261. /* Description */
  262.  
  263. .description { background:rgba({select:Post Color},{select:Post Transparency}); {block:IfMenuBorders} border:1px solid {color:Post Border}; {/block:IfMenuBorders} {block:IfRoundedCorners} border-radius:5px; {/block:IfRoundedCorners} float:left; height:140px; margin-right:3px; overflow:hidden; padding:20px; width:190px; }
  264.  
  265. /* Portrait */
  266.  
  267. .drop-img { background:rgba({select:Post Color},{select:Post Transparency}); {block:IfMenuBorders} border:1px solid {color:Post Border}; {/block:IfMenuBorders} {block:IfRoundedCorners} border-radius:5px; {/block:IfRoundedCorners} float:left; height:140px; padding:20px; width:140px; }
  268.  
  269. /* Extra links */
  270.  
  271. .linkies { {block:IfMenuBorders} border:1px solid {color:Post Border}; {/block:IfMenuBorders} {block:IfRoundedCorners} border-radius:5px; {/block:IfRoundedCorners} background:rgba({select:Post Color},{select:Post Transparency}); float:left; height:140px; margin-left:3px; padding:20px; width:140px; }
  272.  
  273. .linkies a { color:{color:Extra Links}; }
  274.  
  275. .link-wrap { margin-top:0px; }
  276.  
  277. .linkies li { background:rgba({select:Accent Color},{select:Accent Transparency}); border-bottom:1px solid {color:Extra Links}; font:11px ubuntu; list-style-type:none; margin-left:-40px; padding:10px; padding-top:7px; padding-bottom:8px; text-align:center; text-transform:uppercase; width:120px; }
  278.  
  279. /* Social media */
  280.  
  281. .social { background:rgba({select:Post Color},{select:Post Transparency}); {block:IfMenuBorders} border:1px solid {color:Post Border}; {/block:IfMenuBorders} {block:IfRoundedCorners} border-radius:5px; {/block:IfRoundedCorners} color:#fff; float:left; height:140px; overflow:hidden; margin-left:3px; padding:20px; width:190px; }
  282.  
  283. .social-icons { margin:0 auto; width:45px; }
  284.  
  285. /* Post wrap */
  286.  
  287. .main { margin:0 auto; padding-top:20px; padding-left:15px; padding-bottom:50px; {block:IndexPage} width:1190px; {/block:IndexPage} {block:PermalinkPage} width:310px; {/block:PermalinkPage} }
  288.    
  289. /* Posts */
  290.  
  291. #contain { background:rgba({select:Post Color},{select:Post Transparency}); border:1px solid {color:Post Border}; {block:IfRoundedCorners} border-radius:5px; {/block:IfRoundedCorners} float:left; line-height:18px; margin-right:15px; margin-bottom:15px; padding:15px; -webkit-transition:left .4s linear; -moz-transition:left .4s linear; -o-transition:left .4s linear; transition:left .4s linear; width:250px; }
  292.  
  293. /* Post titles - chat, text, link */
  294.  
  295. .chat-title, .text-title { background:{color:Post Title BG}; border-bottom:1px solid {color:Post Title Text}; {block:IfRoundedCorners} border-top-left-radius:5px; border-top-right-radius:5px; {/block:IfRoundedCorners} color:{color:Post Title Text}; font:14px ubuntu; font-weight:100; letter-spacing:1px; line-height:17px; margin-top:-15px; margin-left:-15px; margin-bottom:5px; padding:10px; text-align:center; width:260px; }
  296.  
  297. .link { background:rgba({select:Accent Color},{select:Accent Transparency}); {block:IfRoundedCorners} border-radius:3px; {/block:IfRoundedCorners} font-size:1.05em; letter-spacing:0.091em; margin-top:0px; padding:20px; text-align:center; text-transform:uppercase; width:211px; }
  298.  
  299. .link a {  color:{color:Link Text}; font-weight:normal; }
  300.  
  301. /* Chat lines */
  302.  
  303. .chat-line { background:rgba({select:Accent Color},{select:Accent Transparency}); {block:IfRoundedCorners} border-radius:2px; {/block:IfRoundedCorners} color:{color:Perma Link}; margin-bottom:3px; padding:8px; width:234px; }
  304.  
  305. /* Quote properties */
  306.  
  307. .quote { font-size:13px; font-style:italic; line-height:20px; width:250px; }
  308.  
  309. /* Photoset properties */
  310.  
  311. .photoset { max-width:250px; padding-left:12.5px; }
  312.    
  313. /* Audio player */
  314.  
  315. #audio{ background:rgba({select:Accent Color},{select:Accent Transparency}); {block:IfRoundedCorners} border-radius:3px; {/block:IfRoundedCorners} height:100%; padding:4px; }
  316.  
  317. .tumblr_audio_player{ {block:IfRoundedCorners} border-radius:3px; {/block:IfRoundedCorners} height:50px; width:242px; }
  318.  
  319. /* Questions */
  320.  
  321. .question { background:rgba({select:Accent Color},{select:Accent Transparency}); border:1px solid {color:Post Border}; {block:IfRoundedCorners} border-radius:3px; {/block:IfRoundedCorners} color:{color:Message Text}; line-height:17px; padding:10px; vertical-align:top; }
  322.  
  323. /* Permalink + reblog buttons */
  324.  
  325. .perma { width:270px; padding-top:9px; }
  326.  
  327. .permalink-wrap { display:block; margin-left:-15px; margin-bottom:-15px; }
  328.  
  329. .permalinks { background:{color:Perma BG}; border-right:1px solid {color:Perma Border}; border-top:1px solid {color:Perma Border}; color:{color:Perma Text}; font:11px ubuntu; font-weight:normal; letter-spacing:0.098em; padding:10px; text-transform:uppercase; }
  330.    
  331. .permalinks a { color:{color:Perma Text}; }
  332.  
  333. /* Notes tab */
  334.  
  335. .notecount { background:{color:Perma BG}; border-top:1px solid {color:Perma Border}; {block:IfRoundedCorners} border-bottom-right-radius:5px; {/block:IfRoundedCorners} color:{color:Perma Text}; display:inline-block;  font:11px ubuntu; font-weight:100; letter-spacing:0.098em; padding:10px; text-transform:uppercase; width:197px; }
  336.  
  337. @-moz-document url-prefix() { .notecount { padding-top:9px; width:200px; } }
  338.  
  339. /* Date, notes, via, and source */
  340.  
  341. .permainfo { text-transform:uppercase; font:11px ubuntu; font-weight:normal; letter-spacing:1px; line-height:22px; text-align:left; width:250px; }
  342.  
  343. .permainfo a { font-weight:normal; }
  344.  
  345. /* Note container */
  346.  
  347. .notecontainer { float:left; margin-bottom:0px; max-height:300px; line-height:18px; overflow-x:hidden; overflow-y:scroll; padding-right:5px; width:245px; }
  348.  
  349. .notecontainer a { font-weight:normal; }
  350.    
  351. /* Notes */
  352.  
  353. ol.notes { list-style-type:none; margin:0px 0px; padding:0px; }
  354.  
  355. ol.notes li.note { {block:IfRoundedCorners} border-radius:2px; {/block:IfRoundedCorners} background:rgba({select:Accent Color},{select:Accent Transparency}); margin-bottom:2px; padding:7px; }
  356.  
  357. ol.notes li.note img.avatar { background:rgba({select:Post Color},{select:Post Transparency}); {block:IfRoundedCorners} border-radius:4px; {/block:IfRoundedCorners} height:16px; margin-right:5px; padding:2px; vertical-align:-4px; width:16px; }
  358.  
  359. ol.notes li.note span.action, ol.notes li.note .answer_content, ol.notes li.note blockquote a { font-weight:normal; text-decoration:none; }
  360.  
  361. ol.notes li.note blockquote { border-color:{color:Blockquote}; margin:10px 0px 0px 25px; padding:4px 10px; }
  362.  
  363. /* Fluid columns */
  364.  
  365. @media screen and (max-width:1200px) { .main { {block:IndexPage} width:895px; {/block:IndexPage} } }
  366.  
  367. @media screen and (max-width:920px) { .main { {block:IndexPage} width:595px; {/block:IndexPage} } }
  368.  
  369. @media screen and (max-width:620px) { .main { {block:IndexPage} width:300px; {/block:IndexPage} {block:PermalinkPage} width:300px; {/block:PermalinkPage} } }
  370.  
  371. /* Bottom bar */
  372.  
  373. #bottom { background:rgba({select:Bar Color},{select:Bar Transparency}); border-top:1px solid {color:Bar Border}; bottom:0; height:50px; left:0; position:fixed; width:100%; }
  374.  
  375. /* Pagination */
  376.  
  377. .pagination { margin-left:auto; margin-right:auto; text-align:center;padding-top:17px; }
  378.  
  379. .jump_page { background-color:{color:Perma BG}; border:1px solid {color:Perma Border}; {block:IfRoundedCorners} border-radius:3px; {/block:IfRoundedCorners} color:{color:Perma Text}; font:12px ubuntu; font-weight:100; margin-right:10px; padding:7px 10px; text-align:center; text-decoration:none; }
  380.    
  381. .jump_page a { font-weight:normal; }
  382.  
  383. /* Tooltips */
  384.  
  385. #s-m-t-tooltip
  386. {max-width:100px;z-index:999999;margin:24px 14px 7px 12px;padding:6px;background:{color:Tooltip BG};{block:IfRoundedCorners}-moz-border-radius:2px;-webkit-border-radius:2px;border-radius:2px;{/block:IfRoundedCorners}border:1px solid {color:Tooltip Border};font-size:11px;font-family:ubuntu;letter-spacing:1px;line-height:16px;text-transform:uppercase;color:{color:Tooltip Text};}
  387.  
  388. {CustomCSS}
  389. </style>
  390.  
  391. <!-- Jquery -->
  392.  
  393. <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  394.  
  395. <!-- Masonry -->
  396.  
  397. <script src="http://static.tumblr.com/6hsqxdt/QBym35odk/jquery.masonry.js"></script>
  398.  
  399. <script type="text/javascript">
  400. $(window).load(function () {
  401. $('.main').masonry(),
  402. $('#contain').infinitescroll({
  403. // selector for all items you'll retrieve
  404. bufferPx : 10000,
  405. extraScrollPx: 11000,
  406. },
  407. // call masonry as a callback.
  408. function() { $('.main').masonry({ appendedContent: $(this) }); }
  409. );
  410. });
  411. </script>
  412.  
  413. <!-- Header menu -->
  414.  
  415. <script type="text/javascript">
  416. $(document).ready(function () {
  417.    $('.ham').click(function () {
  418.        $('#menu').toggleClass('open');
  419.    })
  420. });
  421. </script>
  422.  
  423. <!-- Tooltip -->
  424.  
  425. <style type="text/css">{CustomCSS}</style>
  426. <link href="#s-m-t-tooltip" rel="stylesheet" type="text/css" />
  427. <script type="text/javascript" src="http://static.tumblr.com/7qjmkr5/IUmmdsy41/jquery.style-my-tooltips.js"></script>
  428. <script>
  429.    (function($){
  430.        $(document).ready(function(){
  431.            $("[title]").style_my_tooltips();
  432.        });
  433.    })(jQuery);
  434. </script>
  435.  
  436. </head>
  437. <body>
  438.  
  439. <!-- Top bar -->
  440.  
  441. <div id="menu">
  442.  
  443. <div id="icons">
  444. <div class="icon">
  445.  
  446. <!-- Menu icon -->
  447.  
  448.    <a title="info" href="#" class="ham">
  449.        <div class="hamburger"></div>
  450.    </a>
  451.    
  452. <!-- End menu icon -->
  453.    
  454. <!-- Dropdown menu -->
  455.    
  456. <div id="dropbar"><br>
  457.  
  458. <!-- Description -->
  459.    
  460.    {block:Description}
  461.        <div class="description">
  462.            <div class="title">
  463.                {Title}
  464.            </div>
  465.            
  466.            {Description}
  467.        </div>
  468.    {/block:Description}
  469.  
  470. <!-- End description -->
  471.  
  472. <!-- Portrait -->
  473.    
  474.    <div class="drop-img">
  475.        <img src="{image:Portrait}"/>
  476.    </div>
  477.  
  478. <!-- End portrait -->
  479.  
  480. <!-- Extra links -->
  481.    
  482.    <div class="linkies">
  483.        <ul class="link-wrap">
  484.            {block:IfLink1}
  485.                <li><a href="{text:Link1 URL}">{text:Link1}</a></li>
  486.            {/block:IfLink1}
  487.            {block:IfLink2}
  488.                <li><a href="{text:Link2 URL}">{text:Link2}</a></li>
  489.            {/block:Link2}
  490.            {block:IfLink3}
  491.                <li><a href="{text:Link3 URL}">{text:Link3}</a></li>
  492.            {/block:IfLink3}
  493.            {block:IfLink4}
  494.                <li><a href="{text:Link4 URL}">{text:Link4}</a></li>
  495.            {/block:IfLink4}
  496.            {block:IfLink5}
  497.                <li style="border-bottom:none"><a href="{text:Link5 URL}">{text:Link5}</a></li>
  498.            {/block:IfLink5}
  499.        </ul>
  500.    </div>
  501.  
  502. <!-- End extra links -->
  503.  
  504. <!-- Social media -->
  505.    
  506.    <div class="social">
  507.    
  508.        {block:IfBlogger}
  509.        <a title="blogger" href="{text:Blogger}"><img class="social-icons" src="http://static.tumblr.com/at44twr/u64n8x2tg/blogger.png"/></a>
  510.        {/block:IfBlogger}
  511.        
  512.        {block:IfDigg}
  513.        <a title="digg" href="{text:Digg}"><img class="social-icons" src="http://static.tumblr.com/at44twr/fJan8x2tt/digg.png"/></a>
  514.        {/block:IfDigg}
  515.        
  516.        {block:IfDribbble}
  517.        <a title="dribbble" href="{text:Dribbble}"><img class="social-icons" src="http://static.tumblr.com/at44twr/jEBn8x2u7/dribbble.png"/></a>
  518.        {/block:IfDribbble}
  519.        
  520.        {block:IfFacebook}
  521.        <a title="facebook" href="{text:Facebook}"><img class="social-icons" src="http://static.tumblr.com/at44twr/51sn8x2ug/facebook.png"/></a>
  522.        {/block:IfFacebook}
  523.        
  524.        {block:IfGooglePlus}
  525.        <a title="google plus" href="{text:Google Plus}"><img class="social-icons" src="http://static.tumblr.com/at44twr/wmXn8x2um/googleplus.png"/></a>
  526.        {/block:IfGooglePlus}
  527.        
  528.        {block:IfLinkedin}
  529.        <a title="linkedin" href="{text:Linkedin}"><img class="social-icons" src="http://static.tumblr.com/at44twr/dqbn8x2uq/linkedin.png"/></a>
  530.        {/block:IfLinkedin}
  531.        
  532.        {block:IfPinterest}
  533.        <a title="pinterest" href="{text:Pinterest}"><img class="social-icons" src="http://static.tumblr.com/at44twr/T0Cn8x2uv/pintrest.png"/></a>
  534.        {/block:IfPinterest}
  535.        
  536.        {block:IfRSSFeed}
  537.        <a title="rss feed" href="{text:RSS Feed}"><img class="social-icons" src="http://static.tumblr.com/at44twr/TZfn8x2v2/rss.png"/></a>
  538.        {/block:IfRSSFeed}
  539.        
  540.        {block:IfStumbleupon}
  541.        <a title="stumbleupon" href="{text:Stumbleupon}"><img class="social-icons" src="http://static.tumblr.com/at44twr/W4ln8x2v5/stumbleupon.png"/></a>
  542.        {/block:IfStumbleupon}
  543.        
  544.        {block:IfTwitter}
  545.        <a title="twitter" href="{text:Twitter}"><img class="social-icons" src="http://static.tumblr.com/at44twr/6K1n8x2va/twitter.png"/></a>
  546.        {/block:IfTwitter}
  547.        
  548.        {block:IfVimeo}
  549.        <a title="vimeo" href="{text:Vimeo}"><img class="social-icons" src="http://static.tumblr.com/at44twr/fHun8x2vd/vimeo.png"/></a>
  550.        {/block:IfVimeo}
  551.        
  552.        {block:IfYouTube}
  553.        <a title="youtube" href="{text:YouTube}"><img class="social-icons" src="http://static.tumblr.com/at44twr/zgun8x2vg/youtube.png"/></a>
  554.        {/block:IfYouTube}
  555.    </div>
  556.  
  557. <!-- End social media -->
  558.    
  559. </div></div>
  560.    
  561. <!-- End dropdown menu -->
  562.  
  563. <!-- Index, message, archive, and credit icons -->
  564.  
  565.    <div class="icon">
  566.        <a title="index" href="/">
  567.            <div class="home"></div>
  568.        </a>
  569.    </div>
  570.    
  571.    <div class="icon">
  572.        <a title="message" href="/ask">
  573.            <div class="comment"></div>
  574.        </a>
  575.    </div>
  576.    
  577.    <div class="icon">
  578.        <a title="archive" href="/archive">
  579.            <div class="pencil"></div>
  580.        </a>
  581.    </div>
  582.    
  583.    <div class="icon">
  584.        <a title="theme credit" href="http://maomuthemes.tumblr.com">
  585.            <div class="heart"></div>
  586.        </a>
  587.    </div>
  588.    
  589. <!-- End icons -->
  590.    
  591. </div></div>
  592.  
  593. <!-- End top bar -->
  594.  
  595. <div class="main" role="main">
  596.  
  597. <!-- Posts -->
  598.  
  599. {block:Posts}
  600.  
  601. <div id="contain">
  602.  
  603. <!-- Photos -->
  604.  
  605. {block:Photo}
  606.    <article>
  607.        <figure>
  608.        
  609.        {LinkOpenTag}
  610.            <img src="{PhotoURL-HighRes}" alt="{PhotoAlt}"/>
  611.        {LinkCloseTag}
  612.  
  613.        </figure>
  614.    </article>
  615. {/block:Photo}
  616.  
  617. <!-- End photos -->
  618.  
  619. <!-- Photosets -->
  620.  
  621. {block:Photoset}
  622.    <article>
  623.        <figure>
  624.  
  625.        <div class="photoset" style="margin-left:-24px;">{Photoset}</div>
  626.            {block:HighRes}
  627.                {PhotoURL-HighRes}
  628.            {/block:HighRes}
  629.  
  630.        </figure>
  631.    </article>
  632. {/block:Photoset}
  633.  
  634. <!-- End photosets -->
  635.  
  636. <!-- Text -->
  637.  
  638. {block:Text}
  639.    <article>
  640.        <figure>
  641.        
  642.        {block:Title}
  643.            <header>
  644.            <div class="text-title">{Title}</div>
  645.            </header>
  646.        {/block:Title}
  647.  
  648.        <div style="max-width:250px;">{Body}</div>
  649.  
  650.        </figure>
  651.    </article>
  652. {/block:Text}
  653.  
  654. <!-- Text -->
  655.  
  656. <!-- Links -->
  657.  
  658. {block:Link}
  659.    <article>
  660.        <figure>
  661.  
  662.        <h2 class="link">
  663.            <a href="{URL}">{Name} ▶</a>
  664.        </h2>
  665.  
  666.        {block:Description}
  667.            {Description}
  668.        {/block:Description}
  669.  
  670.        </figure>
  671.    </article>
  672. {/block:Link}
  673.  
  674. <!-- End links -->
  675.  
  676. <!-- Chats -->
  677.  
  678. {block:Chat}
  679.    <article>
  680.        <figure>
  681.        
  682.        {block:Title}
  683.            <header>
  684.            <div class="chat-title" style="margin-bottom:13px;">{Title}</div>
  685.            </header>
  686.        {/block:Title}
  687.  
  688.                {block:Lines}
  689.                    <div class="chat-line">
  690.                    
  691.                        {block:Label}
  692.                            {Label}
  693.                        {/block:Label}
  694.                    
  695.                    {Line}
  696.                    </div>
  697.                {/block:Lines}
  698.            
  699.        </figure>
  700.    </article>
  701. {/block:Chat}
  702.  
  703. <!-- End chats -->
  704.  
  705. <!-- Quotes -->
  706.  
  707. {block:Quote}
  708.    <article>
  709.        <figure>
  710.  
  711.        <div class="quote">{Quote}<br>
  712.        {block:Source}
  713.             <div style="text-align:right;font-size:12px;">— {Source}</div>
  714.        {/block:Source}</div>
  715.  
  716.        </figure>
  717.    </article>
  718. {/block:Quote}
  719.  
  720. <!-- End quotes -->
  721.  
  722. <!-- Audio-->
  723.  
  724. {block:Audio}
  725.    <article>
  726.        <figure>
  727.        
  728.            {block:AlbumArt}
  729.            
  730.            <img src="{AlbumArtURL}" style="background:rgba({select:Accent Color},{select:Accent Transparency}); {block:IfRoundedCorners} border-radius:3px; {/block:IfRoundedCorners} padding:5px; width:240px;" alt=""/><br>
  731.                
  732.            {/block:AlbumArt}
  733.            
  734.            <div id="audio">
  735.                <a style="margin-top:20px;">
  736.                    <div class="tumblr_audio_player">
  737.                    
  738.            {block:AudioEmbed}
  739.                {AudioEmbed-250}
  740.            {/block:AudioEmbed}
  741.            
  742.            {block:AudioPlayer}
  743.            
  744.                {block:IfAudioPlayerWhite}
  745.                    {AudioPlayerWhite}
  746.                {/block:IfAudioPlayerWhite}
  747.                    
  748.                {block:IfNotAudioPlayerWhite}
  749.                    {AudioPlayerBlack}
  750.                {/block:IfNotAudioPlayerWhite}
  751.                    
  752.            {/block:AudioPlayer}
  753.                    </div>
  754.                </a>
  755.            </div>
  756.  
  757.        </figure>
  758.    </article>
  759. {/block:Audio}
  760.  
  761. <!-- End audio -->
  762.  
  763. <!-- Video -->
  764.  
  765. {block:Video}
  766.    <article>
  767.        <figure>
  768.        
  769.            {VideoEmbed-250}
  770.        
  771.        </figure>
  772.    </article>
  773. {/block:Video}
  774.  
  775. <!-- End video -->
  776.  
  777. <!-- Message -->
  778.  
  779. {block:Answer}
  780.    <article>
  781.        <figure>
  782.        
  783.            <div class="question">
  784.            
  785.                {lang:Asker asked}: {Question}
  786.            
  787.            </div>
  788.  
  789.        {Answer}
  790.  
  791.        </figure>
  792.    </article>
  793. {/block:Answer}
  794.  
  795. <!-- End message -->
  796.  
  797. <!-- Caption -->
  798.  
  799. {block:IfCaption}
  800.  
  801.    {block:Caption}
  802.        {Caption}
  803.    {/block:Caption}
  804.    
  805. {/block:IfCaption}
  806.  
  807. {block:IfNotCaption}
  808.    {block:PermalinkPage}
  809.    
  810.        {block:Caption}
  811.            {Caption}
  812.        {/block:Caption}
  813.        
  814.    {/block:PermalinkPage}
  815. {/block:IfNotCaption}
  816.  
  817. <!-- End caption -->
  818.  
  819. <!-- Permalink tab -->
  820.  
  821. {block:IndexPage}
  822.    {block:Date}
  823.        <div class="perma">
  824.        <div class="permalink-wrap">
  825.            <a class="permalinks" title="permalink" href="{Permalink}" style="{block:IfRoundedCorners}border-bottom-left-radius:5px;{/block:IfRoundedCorners}">♥</a><a class="permalinks" title="reblog" href="{ReblogURL}">↺</a><div class="notecount">{NoteCountWithLabel}</div>
  826.        </div>    
  827.        </div>
  828.    {/block:Date}
  829. {/block:IndexPage}
  830.    
  831. <!-- End permalink tab -->
  832.  
  833. <!-- Note container + tags -->
  834.  
  835. {block:PermalinkPage}
  836.    {block:Date}
  837.        <header>
  838.            <h2 class="permainfo">Posted {TimeAgo} on {DayOfWeek}, {Month} {DayOfMonth}{DayOfMonthSuffix} with {NoteCountWithLabel}.</h2>
  839.        </header>
  840.            
  841.        {block:HasTags}
  842.    
  843.            {block:Tags}
  844.                <a href="{TagURL}"><span style="font-weight:normal;color:{color:Perma Text};line-height:19px;">#{Tag}</span></a>
  845.            {/block:Tags}<br><br>
  846.        
  847.        {/block:HasTags}
  848.            
  849.        <div class="notecontainer">
  850.            {PostNotes}
  851.        </div>
  852.    
  853.    {/block:Date}
  854. {/block:PermalinkPage}
  855.  
  856. <!-- End note container + tags -->
  857.  
  858. <!-- Remove via and source -->
  859.  
  860. <div style="display:none;">
  861.  
  862.    {block:ContentSource}    
  863.        <a href="{SourceURL}" title="{lang:Originally from ReblogRootName}">Source</a>  
  864.    {/block:ContentSource}
  865.    
  866.    {block:RebloggedFrom}
  867.        <a title="Via" href="{ReblogParentURL}">Via</a>
  868.    {/block:RebloggedFrom}
  869.    
  870. </div>
  871.  
  872. <!-- End remove -->
  873.  
  874. </div><!-- Ends contain div -->
  875.  
  876. {/block:Posts}
  877.  
  878. <!-- End posts -->
  879.  
  880.    </div>
  881. </div>
  882.  
  883. <!-- Bottom bar + pagination -->
  884.  
  885. {block:IndexPage}
  886. <div id="bottom">
  887.  
  888. {block:Pagination}
  889.    <div class="pagination">
  890.        {block:PreviousPage}
  891.            <a href="{PreviousPage}" class="jump_page">←</a>
  892.        {/block:PreviousPage}
  893.  
  894.        {block:JumpPagination length="3"}
  895.      
  896.            {block:CurrentPage}
  897.                <span class="jump_page">{PageNumber}</span>
  898.            {/block:CurrentPage}
  899.      
  900.            {block:JumpPage}
  901.                <a class="jump_page" href="{URL}">{PageNumber}</a>
  902.            {/block:JumpPage}
  903.      
  904.        {/block:JumpPagination}
  905.  
  906.        {block:NextPage}
  907.            <a href="{NextPage}" class="jump_page">→</a>
  908.        {/block:NextPage}
  909.    </div>
  910. {/block:Pagination}
  911.  
  912. </div>
  913. {/block:IndexPage}
  914.  
  915. <!-- End bottom bar + pagination -->
  916.  
  917. </body>
  918. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!