Advertisement
ochizukes

Fog 2.0

Sep 30th, 2014
10,134
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
CSS 31.29 KB | None | 0 0
  1. <!--
  2.  
  3. Fog 2.0
  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. -->
  12.  
  13. <!DOCTYPE html><html>
  14. <head>
  15.  
  16. <!--[if lt IE 9]>
  17. <script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script>
  18. <![endif]-->
  19.  
  20. <!-- META -->
  21.  
  22. <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
  23. <title>{Title}{block:PostTitle}: {PostTitle}{/block:PostTitle}</title>
  24. {block:Description}
  25. <meta name="description" content="{MetaDescription}" />
  26. {/block:Description}
  27. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  28.  
  29. <!-- LINK REL -->
  30.  
  31. <link rel="shortcut icon" href="{image:Favicon}"/>
  32. <link rel="apple-touch-icon" href="{PortraitURL-128}"/>
  33. <link rel="alternate" type="application/rss+xml" href="{RSS}"/>
  34. <link href='http://fonts.googleapis.com/css?family=Lato:300,400' rel='stylesheet' type='text/css'>
  35.  
  36. <!-- IMAGES -->
  37.  
  38. <meta name="image:Background" content="http://static.tumblr.com/fefa985bd46e609bf9463ef482284efc/at44twr/SoFncjeue/tumblr_static_a5of91mcgso4kgoc4sg04s4ks.jpg"/>
  39. <meta name="image:Cursor" content=""/>
  40. <meta name="image:Favicon" content=""/>
  41. <meta name="image:Header Background" content=""/>
  42. <meta name="image:Post Wrap Background" content=""/>
  43. <meta name="image:Sidebar Image" content="http://static.tumblr.com/3a3a65b975f99f0dc34c1106ff789271/at44twr/Okmncp1ka/tumblr_static_443sz5kmz668004gk84owg840.jpg"/>
  44. <meta name="image:Sidebar Background" content=""/>
  45.  
  46. <!-- COLORS -->
  47.  
  48. <meta name="color:Album Art Background" content="#dfd7ee"/>
  49. <meta name="color:Answer Background" content="#ffffff"/>
  50. <meta name="color:Answer Text" content="#c6c6c6"/>
  51. <meta name="color:Asker Background" content="#ffffff"/>
  52. <meta name="color:Audio Background" content="#d9f3e6"/>
  53. <meta name="color:Audio Border" content="#ffffff"/>
  54. <meta name="color:Audio Text" content="#b1cec0"/>
  55. <meta name="color:Background" content="#fbfbfb"/>
  56. <meta name="color:Blockquote Background" content="#ffffff"/>
  57. <meta name="color:Blockquote Border" content="#ffffff"/>
  58. <meta name="color:Blockquote Text" content="#bad8eb"/>
  59. <meta name="color:Chat Background" content="#ffffff"/>
  60. <meta name="color:Chat Border" content="#ffffff"/>
  61. <meta name="color:Chat Text" content="#dbbeea"/>
  62. <meta name="color:Chat Title" content="#ffffff"/>
  63. <meta name="color:Description" content="#bbbbbb"/>
  64. <meta name="color:Header Background" content="#ffffff"/>
  65. <meta name="color:Header Text" content="#ded2ed"/>
  66. <meta name="color:Highlight Background" content="#addac5"/>
  67. <meta name="color:Highlight Text" content="#ffffff"/>
  68. <meta name="color:Link" content="#bab0cc"/>
  69. <meta name="color:Link Hover" content="#c9e7d8"/>
  70. <meta name="color:Navicons" content="#dcecf5"/>
  71. <meta name="color:Navicons Border" content="#ddedf2"/>
  72. <meta name="color:Permalink Background" content="#000000"/>
  73. <meta name="color:Permalink Text" content="#ffffff"/>
  74. <meta name="color:Post Background" content="#ffffff"/>
  75. <meta name="color:Post Border" content="#ffffff"/>
  76. <meta name="color:Post Title" content="#c5b7dc"/>
  77. <meta name="color:Post Title Background" content="#f6f2fe"/>
  78. <meta name="color:Post Title Border" content="#ffffff"/>
  79. <meta name="color:Post Wrap Background" content="#fbfbfb"/>
  80. <meta name="color:Post Wrap Border" content="#ffffff"/>
  81. <meta name="color:Question Background" content="#f2f8fb"/>
  82. <meta name="color:Question Border" content="#e2f1fb"/>
  83. <meta name="color:Question Text" content="#c5e9d5"/>
  84. <meta name="color:Scroll Background" content="#ffffff"/>
  85. <meta name="color:Scroll Border" content="#c8dcea"/>
  86. <meta name="color:Scroll Thumb" content="#eff6ff"/>
  87. <meta name="color:Sidebar Background" content="#eff6ff"/>
  88. <meta name="color:Sidebar Background 2" content="#ffffff"/>
  89. <meta name="color:Sidebar Link" content="#cecece"/>
  90. <meta name="color:Sidebar Link Background" content="#f8f8f8"/>
  91. <meta name="color:Sidebar Link Border" content="#e2e2e2"/>
  92. <meta name="color:Text" content="#ffffff"/>
  93. <meta name="color:Tooltip Background" content="#ffffff"/>
  94. <meta name="color:Tooltip Border" content="#eee9f8"/>
  95. <meta name="color:Tooltip Text" content="#dfd7ee"/>
  96.  
  97. <!-- ON/OFF -->
  98.  
  99. <meta name="if:200px" content="0"/>
  100. <meta name="if:200px 3col" content="0"/>
  101. <meta name="if:250px" content="1"/>
  102. <meta name="if:300px" content="0"/>
  103. <meta name="if:Custom Cursor" content="0"/>
  104. <meta name="if:Custom Scrollbar" content="1"/>
  105. <meta name="if:Fullscreen Background" content="1"/>
  106. <meta name="if:Post Wrap Background" content="0"/>
  107. <meta name="if:Rounded Corners" content="0"/>
  108. <meta name="if:Show Caption" content="1"/>
  109. <meta name="if:Transparent Posts" content="1"/>
  110. <meta name="if:White Tumblr Controls" content="1"/>
  111.  
  112. <!-- TEXT -->
  113.  
  114. <meta name="text:Link 1" content="name"/>
  115. <meta name="text:Link 1 URL" content="url"/>
  116. <meta name="text:Link 2" content="name"/>
  117. <meta name="text:Link 2 URL" content="url"/>
  118. <meta name="text:Link 3" content="name"/>
  119. <meta name="text:Link 3 URL" content="url"/>
  120. <meta name="text:Link 4" content="name"/>
  121. <meta name="text:Link 4 URL" content="url"/>
  122.  
  123. <!-- SELECT -->
  124.  
  125. <meta name="select:Post Color" content="255,255,255" title="Light"/>
  126. <meta name="select:Post Color" content="0,0,0" title="Dark"/>
  127.  
  128. <meta name="select:Post Transparency" content=".95" title="95%"/>
  129. <meta name="select:Post Transparency" content=".9" title="90%"/>
  130. <meta name="select:Post Transparency" content=".85" title="85%"/>
  131. <meta name="select:Post Transparency" content=".8" title="80%"/>
  132. <meta name="select:Post Transparency" content=".75" title="75%"/>
  133. <meta name="select:Post Transparency" content=".7" title="70%"/>
  134. <meta name="select:Post Transparency" content=".65" title="65%"/>
  135. <meta name="select:Post Transparency" content=".6" title="60%"/>
  136. <meta name="select:Post Transparency" content=".55" title="55%"/>
  137. <meta name="select:Post Transparency" content=".5" title="50%"/>
  138. <meta name="select:Post Transparency" content=".45" title="45%"/>
  139. <meta name="select:Post Transparency" content=".4" title="40%"/>
  140. <meta name="select:Post Transparency" content=".35" title="35%"/>
  141. <meta name="select:Post Transparency" content=".3" title="30%"/>
  142. <meta name="select:Post Transparency" content=".25" title="25%"/>
  143. <meta name="select:Post Transparency" content=".2" title="20%"/>
  144. <meta name="select:Post Transparency" content=".15" title="15%"/>
  145. <meta name="select:Post Transparency" content=".1" title="10%"/>
  146. <meta name="select:Post Transparency" content=".05" title="5%"/>
  147. <meta name="select:Post Transparency" content="0" title="Transparent"/>
  148.  
  149. <meta name="select:Image Opacity" content="1"/>
  150. <meta name="select:Image Opacity" content=".95"/>
  151. <meta name="select:Image Opacity" content=".9"/>
  152. <meta name="select:Image Opacity" content=".85"/>
  153. <meta name="select:Image Opacity" content=".8"/>
  154. <meta name="select:Image Opacity" content=".75"/>
  155. <meta name="select:Image Opacity" content=".7"/>
  156. <meta name="select:Image Opacity" content=".65"/>
  157. <meta name="select:Image Opacity" content=".6"/>
  158. <meta name="select:Image Opacity" content=".55"/>
  159. <meta name="select:Image Opacity" content=".5"/>
  160.  
  161. <style type="text/css">
  162.  
  163. @import url(http://weloveiconfonts.com/api/?family=entypo);
  164.  
  165. /* entypo */
  166. [class*="entypo-"]:before {
  167.   font-family: 'entypo', sans-serif;
  168.   font-size:18px;
  169.   color:{color:Navicons};
  170.   text-align:center;
  171. }
  172.  
  173. /* Tumblr controls */
  174.  
  175. {block:IfWhiteTumblrControls}
  176.  
  177. iframe#tumblr_controls { opacity:0.45; 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; }
  178.  
  179. {/block:IfWhiteTumblrControls}
  180.  
  181. /* Custom Scrollbars */
  182.  
  183. {block:IfCustomScrollbar}
  184.  
  185. ::-webkit-scrollbar{ height:8px; width:10px; }
  186.  
  187. ::-webkit-scrollbar-button:start:decrement
  188. ::-webkit-scrollbar-button:end:increment { background-color{color:Scroll Thumb}; display:block; height:0; }
  189.  
  190. ::-webkit-scrollbar-track-piece{ background-color:{color:Scroll Background}; border:1px solid {color:Scroll Border}; width:10px; }
  191.  
  192. ::-webkit-scrollbar-thumb:vertical { background-color:{color:Scroll Thumb}; background-image:url({image:Scrollbar}); border:1px solid {color:Scroll Border}; height:50px; }
  193.  
  194. {/block:IfCustomScrollbar}
  195.  
  196. /* Body properties */
  197.  
  198. body { background-attachment:fixed; background-color:{color:Background}; background-repeat:no-repeat; background-position:top right; background-image:url('{image:Background}'); {block:IfFullscreenBackground} background-size:cover; {/block:IfFullscreenBackground} color:{color:Text}; font:normal normal 12px gautami; letter-spacing:1px; line-height:18px; margin:0; }
  199.  
  200. figure { margin:0; }
  201.  
  202. /* Custom cursor */
  203.  
  204. {block:IfCustomCursor}
  205.  
  206. #cursor { cursor: url('{image:Cursor}'), url('{image:Cursor}'), progress !important; height:100%; left:0; position:fixed; top:0; width:100%; z-index:-1; }
  207.  
  208. {/block:IfCustomCursor}
  209.  
  210. /* Text highlight */
  211.  
  212. ::selection { background:{color:Highlight Background}; color:{color:Highlight Text}; }
  213.  
  214. ::-moz-selection { background:{color:Highlight Background}; color:{color:Highlight Text}; }
  215.  
  216. /* Links */
  217.  
  218. a { color:{color:Link}; font-size:9px; letter-spacing:1px; text-decoration:none; text-transform:uppercase; transition-duration:0.6s; -moz-transition-duration:0.6s; -webkit-transition-duration:0.6s; -o-transition-duration:0.6s; }
  219.  
  220. a:hover { color:{color:Link Hover}; }
  221.  
  222. /* Blockquotes */
  223.  
  224. .text blockquote, .lpost blockquote { background:transparent; color:{color:Text}; border:none; border-left:1px solid {color:Blockquote Border}; {block:IfRoundedCorners} border-radius:none; {/block:IfRoundedCorners} margin-left:12px; padding:0px 0px 0px 12px; width:90%; word-wrap:break-word; text-align:left; }
  225.  
  226. blockquote { background-color:{color:Blockquote Background}; border:1px dashed {color:Blockquote Border}; {block:IfRoundedCorners} border-radius:3px; {/block:IfRoundedCorners} color:{color:Blockquote Text}; margin:3px 0px 6px 0px; padding:6px 6px 0px 6px; {block:If200px} width:93.5%; {/block:If200px} {block:If250px} width:95%; {/block:If250px} {block:If300px} width:95.5%; {/block:If300px} word-wrap:break-word;text-align:center; }
  227.  
  228. /* Wrapper */
  229.  
  230. #wrapper { margin:0 auto; {block:If200px} width:840px; {/block:If200px} {block:If200px3col} width:1110px; {/block:If200px3col} {block:If250px} width:940px; {/block:If250px} {block:If300px} width:1030px; {block:If300px} }
  231.  
  232. #navicons { margin-left:-45px; margin-top:100px; position:fixed; }
  233.  
  234. .navi-wrap { background:#fff; border:1px solid {color:Navicons Border}; {block:IfRoundedCorners} border-radius:3px; {/block:IfRoundedCorners} margin-bottom:8px; padding:10px; padding-bottom:4px; width:15px; }
  235.  
  236. /* Sidebar */
  237.  
  238. #sidebar { background-color:{color:Sidebar Background}; background-image:url('{image:Sidebar Background}'); border-left:1px solid {color:Post Wrap Border}; height:100%; position:fixed; width:179px; }
  239.  
  240. /* Sidebar image */
  241.  
  242. .side-img { background:{color:Sidebar Background 2}; border-top:1px solid {color:Post Wrap Border}; border-bottom:1px solid {color:Post Wrap Border}; margin-top:84px; padding:25px; padding-bottom:16px; transition-duration:0.6s; -moz-transition-duration:0.6s; -webkit-transition-duration:0.6s; -o-transition-duration:0.6s; width:129px; }
  243.  
  244. .side-img img { {block:IfRoundedCorners} border-radius:3px; {/block:IfRoundedCorners} }
  245.  
  246. /* Description */
  247.  
  248. .description { color:{color:Description}; padding:10px 30px 4px 30px; width:132px; }
  249.  
  250. /* Sidebar link box */
  251.  
  252. .side-drop { background:{color:Sidebar Background 2}; border-top:1px solid {color:Post Wrap Border}; border-bottom:1px solid {color:Post Wrap Border}; padding:25px 30px 24px 30px; text-align:center; width:119px; }
  253.  
  254. /* The links */
  255.  
  256. .ex { background-color:{color:Sidebar Link Background}; border:1px dashed {color:Sidebar Link Border}; {block:IfRoundedCorners} border-radius:3px; {/block:IfRoundedCorners} display:block; height:auto; margin-bottom:4px; padding:8px 0px 5px 0px; width:119px; }
  257.  
  258. .ex a { color:{color:Sidebar Link}; font-size:9px; letter-spacing:1px; padding-bottom:3px; text-transform:uppercase; }
  259.  
  260. /* Post wrap */
  261.  
  262. #post-wrap { {block:IfPostWrapBackground} background-color:{color:Post Wrap Background}; background-image:url('{image:Post Wrap Background}'); background-attachment:fixed; {/block:IfPostWrapBackground} border-left:1px solid {color:Post Wrap Border}; border-right:1px solid {color:Post Wrap Border}; min-height:100vh; margin-left:180px; padding:135px 0px 30px 65px; {block:IndexPage} {block:If200px} width:580px; {block:If200px} {block:If200px3col} width:854px; {/block:If200px3col} {block:If250px} width:676px; {/block:If250px} {block:If300px} width:780px; {block:If300px} {/block:IndexPage} {block:PermalinkPage} {block:If200px} width:308px; {block:If200px} {block:If200px3col} width:308px; {block:If200px3col} {block:If250px} width:360px; {/block:If250px} {block:If300px} width:408px; {block:If300px} {/block:PermalinkPage} }
  263.  
  264. /* Title */
  265.  
  266. .title { background-color:{color:Header Background}; background-image:url('{image:Header Background}');border:1px solid {color:Post Wrap Border}; border-top:none; color:{color:Header Text}; font:normal 200 20px lato; font-weight:100; letter-spacing:3px; margin-left:180px; padding:30px 0px 30px 0px; position:fixed; text-align:center; text-transform:uppercase; {block:IndexPage} {block:If200px} width:645px; {/block:If200px} {block:If200px3col} width:919px; {/block:If200px3col} {block:If250px} width:741px; {/block:If250px} {block:If300px} width:845px; {block:If300px} {/block:IndexPage} {block:PermalinkPage} {block:If200px} width:373px; {block:If200px} {block:If200px3col} width:373px; {block:If200px3col} {block:If250px} width:425px; {/block:If250px} {block:If300px} width:473px; {block:If300px} {/block:PermalinkPage} z-index:1000; }
  267.  
  268. /* Posts */
  269.  
  270. .posts { {block:IfTransparentPosts} background:rgba({select:Post Color}, {select:Post Transparency}); {/block:IfTransparentPosts} {block:IfNotTransparentPosts} background:{color:Post Background}; {/block:IfNotTransparentPosts} border:1px solid {color:Post Border}; {block:IfRoundedCorners} border-radius:6px; {/block:IfRoundedCorners} float:left; margin:0px 25px 25px 0px; padding:22px; padding-bottom:0px; transition-duration:0.6s; -moz-transition-duration:0.6s; -webkit-transition-duration:0.6s; -o-transition-duration:0.6s; {block:If200px} width:200px; {/block:If200px} {block:If200px3col} width:200px; {/block:If200px3col} {block:If250px} width:250px; {block:If250px} {block:If300px} width:300px; {block:If300px} }
  271.  
  272. .posts:hover .text-title { border-left:30px solid {color:Post Title Border}; transition-duration:0.6s; -moz-transition-duration:0.6s; -webkit-transition-duration:0.6s; -o-transition-duration:0.6s; }
  273.  
  274. .posts:hover .link { border-left:30px solid {color:Post Title Border}; transition-duration:0.6s; -moz-transition-duration:0.6s; -webkit-transition-duration:0.6s; -o-transition-duration:0.6s; }
  275.  
  276. /* Text posts */
  277.  
  278. .text-title { background:{color:Post Title Background}; border-left:20px solid {color:Post Title Border}; {block:IfRoundedCorners} border-radius:3px; {/block:IfRoundedCorners} color:{color:Post Title}; font-size:9px; letter-spacing:1px; margin-top:0px; padding:8px 6px 3px 6px; text-align:right; text-transform:uppercase; transition-duration:0.6s; -moz-transition-duration:0.6s; -webkit-transition-duration:0.6s; -o-transition-duration:0.6s; }
  279.  
  280. /* All images */
  281.  
  282. img { border:0; max-width:100%; opacity:{select:Image Opacity}; transition-duration:0.6s; -moz-transition-duration:0.6s; -webkit-transition-duration:0.6s; -o-transition-duration:0.6s; }
  283.  
  284. img:hover { opacity:1; }
  285.  
  286. /* Photosets */
  287.  
  288. .photoset { opacity:{select:Image Opacity}; transition-duration:0.6s; -moz-transition-duration:0.6s; -webkit-transition-duration:0.6s; -o-transition-duration:0.6s; {block:If200px} width:200px; {/block:If200px} {block:If200px3col} width:200px; {/block:If200px3col} {block:If250px} width:250px; {block:If250px} {block:If300px} width:300px; {block:If300px} }
  289.  
  290. .photoset:hover { opacity:1; }
  291.  
  292. /* Quote posts */
  293.  
  294. .quote { font-size:14px;  letter-spacing:1px;}
  295.  
  296. /* Link posts */
  297.  
  298. .link { background:{color:Post Title Background}; border-left:20px solid {color:Post Title Border}; {block:IfRoundedCorners} border-radius:3px; {/block:IfRoundedCorners} margin-top:0px; padding:15px; padding-bottom:10px; padding:8px 6px 3px 6px; text-align:right; transition-duration:0.6s; -moz-transition-duration:0.6s; -webkit-transition-duration:0.6s; -o-transition-duration:0.6s; word-wrap:break-word; }
  299.  
  300. .link a { color:{color:Post Title}; font-weight:normal; padding:0; }
  301.  
  302. /* Chat posts */
  303.  
  304. .chat-title { color:{color:Chat Title}; font-size:14px; letter-spacing:1px; text-align:center; }
  305.  
  306. .chat ul { list-style:none; margin:0; padding:0; }
  307.  
  308. .chat li { margin-bottom:3px; padding:10px; padding-bottom:5px; }
  309.  
  310. .chat .odd { background:{color:Chat Background}; border:1px dashed {color:Chat Border}; {block:IfRoundedCorners} border-radius:3px; {/block:IfRoundedCorners} color:{color:Chat Text}; }
  311.  
  312. .chat .even { background:{color:Chat Background}; border:1px dashed {color:Chat Border}; {block:IfRoundedCorners} border-radius:3px; {/block:IfRoundedCorners} color:{color:Chat Text}; }
  313.  
  314. /* Audio posts */
  315.  
  316. .cover { background:{color:Album Art Background}; border-right:1px solid {color:Audio Border}; {block:IfRoundedCorners} border-radius:4px 0px 0px 4px; {/block:IfRoundedCorners} padding:15px; position:absolute; {block:IfNot200px} margin:-60px 0px -12px -3px; width:90px; {/block:IfNot200px} {block:If200px} margin:-50px 0px -12px -3px; width:70px; {/block:If200px} {block:If200px3col} margin:-50px 0px -12px -3px; width:70px; {/block:If200px3col} z-index:1; }
  317.  
  318. .playbutton {  height:34px; margin:13px 17px 6px 14px; overflow:hidden; position:relative; width:23px; z-index:1000; }
  319.    
  320. .playbox { background-color:#000; {block:IfRoundedCorners} border-radius:50%; {/block:IfRoundedCorners} margin-top:-26px; {block:IfNot200px} margin-left:32px; {/block:IfNot200px} {block:If200px} margin-left:1.705em; {/block:If200px} {block:If200px3col} margin-left:1.705em; {/block:If200px3col} opacity:0.45; position:absolute; z-index:999; }
  321.  
  322. #au-info { background:{color:Audio Background}; border:1px solid {color:Audio Border}; {block:IfRoundedCorners} border-radius:4px; {/block:IfRoundedCorners} height:122px; position:relative; {block:If200px} height:102px; width:201px; {/block:If200px} {block:If200px3col} height:102px; width:201px; {/block:If200px3col} {block:If250px} width:252px; {/block:If250px} {block:If300px} width:256px; {/block:If300px} }
  323.  
  324. .au-text { color:{color:Audio Text}; font-size:9px; max-height:100px; letter-spacing:1px; overflow:hidden; text-transform:uppercase; margin-left:120px;padding-left:4px; {block:If200px} max-height:70px; margin-left:100px; width:80px; {/block:If200px} {block:If200px3col} max-height:70px; margin-left:100px; width:80px; {/block:If200px3col} {block:If250px} width:115px; {/block:If250px} {block:If300px} width:165px; {/block:If300px} word-wrap:break-word; }
  325.  
  326. /* Video posts */
  327.  
  328. .videoWrapper { height:0; margin-bottom:18px; padding-bottom:56.25%; position:relative; }
  329.  
  330. .videoWrapper iframe { height:100%; left:0; position:absolute; top:0; width:100%; }
  331.  
  332. /* Answer posts */
  333.  
  334. .question { background:{color:Question Background}; border-top:15px solid {color:Question Border}; {block:IfRoundedCorners} border-radius:4px 4px 0px 0px; {/block:IfRoundedCorners} color:{color:Question Text}; padding:10px; padding-bottom:4px; }
  335.  
  336. .asker-avatar { background:{color:Asker Background}; {block:IfRoundedCorners} border-radius:4px; {/block:IfRoundedCorners} float:left; margin:0px 8px 0px 0px; padding:7px; }
  337.  
  338. .answer { background:{color:Answer Background}; {block:IfRoundedCorners} border-radius:0px 0px 4px 4px; {/block:IfRoundedCorners} color:{color:Answer Text}; margin-top:6px; padding:3px 10px 1px 10px }
  339.  
  340. /* Permalink + tags */
  341.  
  342. .index-perma { background:{color:Permalink Background}; color:{color:Permalink Text}; font-size:9px; margin:-22px 0px 0px -22px; opacity:0; padding:10px; padding-top:11px; position:relative; text-align:center; transition-duration:0.6s; -moz-transition-duration:0.6s; -webkit-transition-duration:0.6s; -o-transition-duration:0.6s; {block:If200px} width:224px; {/block:If200px} {block:If200px3col} width:224px; {/block:If200px3col} {block:If250px} width:274px; {/block:If250px} {block:If300px} width:324px; {/block:If300px} }
  343.  
  344. .index-perma a { color:{color:Permalink Text}; }
  345.  
  346. .posts:hover .index-perma { opacity:1; transition-duration:0.6s; -moz-transition-duration:0.6s; -webkit-transition-duration:0.6s; -o-transition-duration:0.6s; }
  347.  
  348. #permalink { background:transparent; margin-left:-15px; margin-top:0px; padding:15px; width:100%; }
  349.  
  350. .tags a, .perm-info a { font-size:12px; text-transform:none; }
  351.  
  352. /* Note container */
  353.  
  354. .notecontainer { float:left; margin-bottom:10px; line-height:18px; {block:If200px} width:200px; {/block:If200px} {block:If200px3col} width:200px; {/block:If200px3col} {block:If250px} width:250px; {/block:If250px} {block:If300px} width:300px; {/block:If300px} height:250px; overflow-x:hidden; overflow-y:scroll; }
  355.  
  356. .notecontainer a { font-weight:normal; }
  357.  
  358. ol.notes { list-style-type:none; margin:0px 0px; padding:0px; }
  359.  
  360. ol.notes li.note { margin-bottom:2px; padding:2px; }
  361.  
  362. ol.notes li.note img.avatar { background-color:{color:Blockquote Background}; border:1px solid {color:Blockquote}; {block:IfRoundedCorners} border-radius:50%; {/block:IfRoundedCorners} height:16px; margin-right:5px; padding:4px; vertical-align:-4px; width:16px; }
  363.  
  364. ol.notes li.note span.action, ol.notes li.note .answer_content, ol.notes li.note blockquote a { font-weight:normal; text-decoration:none; }
  365.  
  366. ol.notes li.note blockquote { background:transparent; border-left:1px solid {color:Blockquote Border}; border-right:none; border-top:none; border-bottom:none; margin:10px 0px 0px 15px; padding:6px 6px 6px 0px; width:89%; }
  367.  
  368. ol.notes li.note blockquote a { color:{color:Text}; font-size:12px; text-transform:none; }
  369.  
  370. /* Tooltip */
  371.  
  372. #s-m-t-tooltip { background:{color:Tooltip Background}; border:1px dashed {color:Tooltip Border}; {block:IfRoundedCorners} border-radius:3px; {/block:IfRoundedCorners} {block:IfNotRoundedCorners} border-radius:0px; {/block:IfNotRoundedCorners} color:{color:Tooltip Text}; display: block; font-size:12px; font-style:italic; letter-spacing:1px; margin: 20px 10px 10px 10px; max-width:100px; padding:9px; padding-bottom:4px; text-transform:lowercase; word-wrap: break-word; z-index:999999; }
  373.  
  374. /* Pagination */
  375.  
  376. #pagi { text-align:center; }
  377.  
  378. #pagi a { color:{color:Description}; }
  379.  
  380. {CustomCSS}
  381.  
  382. </style>
  383.  
  384. <!-- Jquery + masonry -->
  385.  
  386. <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  387.  
  388. <script src="http://static.tumblr.com/6hsqxdt/QBym35odk/jquery.masonry.js"></script>
  389.  
  390. <script src="http://static.tumblr.com/twte3d7/H8Glm663z/masonry.js"></script>
  391.  
  392. <script type="text/javascript">
  393.     $(window).load(function () {
  394.         $('#post-wrap').masonry({
  395.         itemSelector : ".posts",
  396.         },
  397.     function() {
  398.         $('#post-wrap').masonry({ appendedContent: $(this) }); }
  399.     );
  400.     });
  401. </script>
  402.  
  403. <!-- Tooltip -->
  404.  
  405. <link href="#s-m-t-tooltip" rel="stylesheet" type="text/css" />
  406.  
  407. <script type="text/javascript" src="http://static.tumblr.com/7qjmkr5/IUmmdsy41/jquery.style-my-tooltips.js"></script>
  408. <script>
  409.     (function($){
  410.         $(document).ready(function(){
  411.             $("[title]").style_my_tooltips();
  412.         });
  413.     })(jQuery);
  414. </script>
  415.  
  416. </head>
  417. <body>
  418.  
  419. <div id="wrapper">
  420.  
  421. <div id="navicons">
  422.  
  423.     <a title="home" href="/"><div class="navi-wrap"><span style="margin-left:-1px" class="entypo-home"></span></div></a>
  424.     <a title="ask" href="/ask"><div class="navi-wrap"><span class="entypo-mail"></span></div></a>
  425.     <a title="archive" href="/archive"><div class="navi-wrap"><span class="entypo-chart-bar"></span></div></a>
  426.     <a title="© 2014 MT" href="http://maomuthemes.tumblr.com"><div class="navi-wrap"><span style="margin-left:3px" class="entypo-droplet"></span></div></a>
  427.    
  428. </div>
  429.  
  430. <div id="sidebar">
  431.  
  432. <!-- Sidebar image -->
  433.    
  434. <div class="side-img">
  435.  
  436.     <img src="{image:Sidebar Image}" alt=""/>
  437.    
  438. </div><br>
  439.  
  440. <!-- End sidebar image -->
  441.  
  442. <div class="description">{Description}</div><br>
  443.  
  444. <!-- Link box -->
  445.  
  446. <div class="side-drop"><br>
  447.  
  448. <!-- Extra links HTML -->
  449.  
  450.     {block:IfLink1}
  451.         <div class="ex" style="margin-top:-16px;"><a href="{text:Link 1 URL}">{text:Link 1}</a></div>
  452.     {/block:IfLink1}
  453.    
  454.     {block:IfLink2}
  455.         <div class="ex"><a href="{text:Link 2 URL}">{text:Link 2}</a></div>
  456.     {/block:IfLink2}
  457.    
  458.     {block:IfLink3}
  459.         <div class="ex"><a href="{text:Link 3 URL}">{text:Link 3}</a></div>
  460.     {/block:IfLink3}
  461.    
  462.     {block:IfLink4}
  463.         <div class="ex"><a href="{text:Link 4 URL}">{text:Link 4}</a></div>
  464.     {/block:IfLink4}
  465.  
  466. <!-- End extras -->
  467.  
  468. </div><br><!-- End link box -->
  469.  
  470. <!-- Pagination -->
  471.  
  472. <div id="pagi">
  473.  
  474. {block:Pagination}
  475.  
  476. {block:PreviousPage}<a title="previous page" href="{PreviousPage}">go back</a> / {/block:PreviousPage}{block:NextPage}<a title="next page" href="{NextPage}">go forth</a>{/block:NextPage}
  477.  
  478. {/block:Pagination}
  479.    
  480. </div><!-- End pagination -->
  481.  
  482. </div><!-- sidebar -->
  483.  
  484. <div class="title">{Title} 」</div>
  485.  
  486. <div id="post-wrap">
  487.  
  488. <!-- Posts -->
  489.  
  490. {block:Posts}
  491.  
  492. <div class="posts">
  493.  
  494. <!-- Text -->
  495.  
  496. {block:Text}
  497.  
  498.     <article>
  499.         <figure class="text">
  500.        
  501.         {block:Title}
  502.             <header>
  503.             <div class="text-title">{Title}</div>
  504.             </header>
  505.         {/block:Title}
  506.  
  507.         <div>{Body}</div>
  508.  
  509.         </figure>
  510.     </article>
  511.    
  512. {/block:Text}
  513.  
  514. <!-- End text -->
  515.  
  516. <!-- Photo -->
  517.  
  518. {block:Photo}
  519.  
  520.     <article>
  521.         <figure>
  522.        
  523.             {LinkOpenTag}
  524.                 <img src="{PhotoURL-HighRes}" alt="{PhotoAlt}"/>
  525.             {LinkCloseTag}
  526.        
  527.         </article>
  528.     </figure>
  529.  
  530. {/block:Photo}
  531.  
  532. <!-- End photo -->
  533.  
  534. <!-- Photoset -->
  535.  
  536. {block:Photoset}
  537.  
  538.     <article>
  539.         <figure>
  540.          
  541.             <div class="photoset">{Photoset}</div>
  542.            
  543.             {block:HighRes}
  544.                 {PhotoURL-HighRes}
  545.             {/block:HighRes}
  546.          
  547.         </figure>
  548.     </article>
  549.  
  550. {/block:Photoset}
  551.  
  552. <!-- End photoset -->
  553.  
  554. <!-- Quote -->
  555.  
  556. {block:Quote}
  557.  
  558.     <article>
  559.         <figure>
  560.  
  561.         <div class="quote">"{Quote}"<br>
  562.             {block:Source}
  563.                  <div style="float:right;font-size:12px;margin-top:8px;">{Source}</div>
  564.             {/block:Source}
  565.         </div>
  566.  
  567.         </figure>
  568.     </article>
  569.    
  570. {/block:Quote}
  571.  
  572. <!-- End quote -->
  573.  
  574. <!-- Link -->
  575.  
  576. {block:Link}
  577.  
  578.     <article>
  579.         <figure class="lpost">
  580.              
  581.           <h2 class="link">
  582.             <a href="{URL}">{Name}</a>
  583.         </h2>  
  584.  
  585.         {block:Description}
  586.             {Description}
  587.         {/block:Description}
  588.  
  589.         </figure>
  590.     </article>
  591.    
  592. {/block:Link}
  593.  
  594. <!-- End link -->
  595.  
  596. <!-- Chat -->
  597.  
  598. {block:Chat}
  599.  
  600.     <article>
  601.         <figure>
  602.        
  603.         {block:Title}
  604.             <header>
  605.                 <div class="chat-title" style="margin-bottom:13px;">
  606.                     {Title}
  607.                 </div>
  608.             </header>
  609.         {/block:Title}
  610.        
  611.         <div class="chat">
  612.  
  613.                 <ul>{block:Lines}
  614.                     <li class="{Alt}">
  615.                    
  616.                         {block:Label}
  617.                             {Label}
  618.                         {/block:Label}
  619.                    
  620.                     {Line}
  621.                     </li>
  622.                 {/block:Lines}</ul>
  623.            
  624.            </div>
  625.            
  626.         </figure>
  627.     </article>
  628.    
  629. {/block:Chat}
  630.  
  631. <!-- End chat -->
  632.  
  633. <!-- Audio -->
  634.  
  635. {block:Audio}
  636.  
  637.     <article>
  638.         <figure>
  639.        
  640.         <table id="au-info" style="margin-bottom:8px;">
  641.             <tr>
  642.                 <td>
  643.                    
  644.                   <div class="playbox"><div class="playbutton">
  645. {block:AudioPlayer}{AudioPlayerBlack}{/block:AudioPlayer}</div></div>
  646. <img src="http://static.tumblr.com/jn9hrij/20Ul2zzsr/albumart.jpg" class="cover">
  647. {block:AlbumArt}
  648. <img src="{AlbumArtURL}" class="cover">
  649. {/block:AlbumArt}  
  650.                    
  651.                 </td>
  652.                 <td>
  653.                    
  654.                     <div class="au-text">
  655.  
  656. {block:TrackName}track: {TrackName}<br>{/block:TrackName}
  657.  
  658. {block:Artist}artist: {Artist}<br>{/block:Artist}
  659.  
  660. {block:PlayCount}plays: {FormattedPlayCount}{/block:PlayCount}
  661.    
  662. </div>
  663.                    
  664.                 </td>
  665.             </tr>
  666.         </table>
  667.  
  668.         </figure>
  669.     </article>
  670.    
  671. {/block:Audio}
  672.  
  673. <!-- End audio -->
  674.  
  675. <!-- Video -->
  676.  
  677. {block:Video}
  678.  
  679.     <article>
  680.         <figure>
  681.        
  682.             <div class="videoWrapper">
  683.                 {VideoEmbed-400}
  684.             </div>
  685.        
  686.         </figure>
  687.     </article>
  688.    
  689. {/block:Video}
  690.  
  691. <!-- End video -->
  692.  
  693. <!-- Answer -->
  694.  
  695. {block:Answer}
  696.  
  697.     <div class="question">
  698.         <img class="asker-avatar" src="{AskerPortraitURL-30}" alt=""/> {Asker} asked: {Question}
  699.     </div>
  700.  
  701.     <div class="answer" style="margin-bottom:8px;">
  702.         {Answer}
  703.     </div>
  704.  
  705. {/block:Answer}
  706.  
  707. <!-- End answer -->
  708.  
  709. <!-- Caption -->
  710.  
  711. {block:IfShowCaption}
  712.  
  713.     {block:Caption}
  714.         {Caption}
  715.     {/block:Caption}
  716.    
  717. {/block:IfShowCaption}
  718.  
  719. {block:IfNotShowCaption}
  720.  
  721.     {block:PermalinkPage}
  722.         {block:Caption}
  723.             {Caption}
  724.         {/block:Caption}
  725.     {/block:PermalinkPage}
  726.    
  727. {/block:IfNotShowCaption}
  728.  
  729. <!-- End caption -->
  730.  
  731. {block:PermalinkPage}
  732.  
  733. <!-- Permalink -->
  734.  
  735. <div id="permalink">
  736.  
  737. <!-- Note container -->
  738.  
  739.     {block:Date}
  740.    
  741.     <div class="perm-info">{ShortMonth} {DayOfMonth}{DayOfMonthSuffix} - {FormattedNoteCount}N{block:RebloggedFrom}<a href="{ReblogParentURL}"> - Via</a>{/block:RebloggedFrom}{block:ContentSource}<a href="{SourceURL}"> - Src</a>{/block:ContentSource}</div>
  742.  
  743. <div class="tags" style="margin-top:10px;">{block:Tags}<a href="{TagURL}"><span>#{Tag} </span></a>{/block:Tags}</div>
  744.  
  745.         <div class="notecontainer" style="margin-top:8px;">
  746.             {PostNotes}
  747.         </div>
  748.    
  749.     {/block:Date}
  750.  
  751. <!-- End note container -->
  752.  
  753. <!-- Remove via and source -->
  754.  
  755. <div style="display:none;">
  756.  
  757.     {block:ContentSource}    
  758.         <a href="{SourceURL}" title="{lang:Originally from ReblogRootName}">Source</a>  
  759.     {/block:ContentSource}
  760.    
  761.     {block:RebloggedFrom}
  762.         <a title="Via" href="{ReblogParentURL}">Via</a>
  763.     {/block:RebloggedFrom}
  764.    
  765. </div>
  766.  
  767. <!-- End remove -->
  768.    
  769. </div><!-- End permalink -->
  770.  
  771. {/block:PermalinkPage}
  772.  
  773. <!-- Index permalink -->
  774.  
  775. {block:IndexPage}
  776.  
  777. <div class="index-perma">
  778.    
  779.     <a href="{Permalink}">{FormattedNoteCount}N</a> &middot; <a href="{ReblogURL}">reblog</a>
  780.    
  781. </div>
  782.  
  783. {/block:IndexPage}
  784.  
  785. <!-- End index -->
  786.  
  787. </div><!-- End post container -->
  788.  
  789. {/block:Posts}
  790.  
  791. </div><!-- End post wrap -->
  792.  
  793. </div><!-- End wrapper -->
  794.  
  795. {block:IfCustomCursor}<div id="cursor"></div>{/block:IfCustomCursor}
  796.  
  797. </body>
  798.  
  799. </html>
  800.  
  801. {block:IfCustomCursor}
  802. <style type="text/css">body, a:hover {cursor: url('{image:Cursor}'), progress !important;}</style>{/block:IfCustomCursor}
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement