Advertisement
ErisNotEros

Theme: Steampunk

Sep 6th, 2013
51,604
1
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 36.25 KB | None | 1 0
  1. <!DOCTYPE HTML>
  2. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  3.  
  4. <!--
  5.  
  6.  
  7. ┌┬┐ ┐┌ ┌┐ ┌┬┐ ┌┐ ┌┐ ┌┐ ┐┌ ┌┐ ┌┐ ┐ ┌┐
  8. │ ├┤ ├ │││ ├ └┐ ├┴┐ └┤ ├ ├┴┐ │ └┐
  9. ┴ ┘└ └┘ ┘ └ └┘ └┘ └─┘ ┘ └┘ ┘ └ └ └┘
  10. visit themesbyeris.tumblr.com for more themes
  11.  
  12. -->
  13.  
  14. <head>
  15.  
  16.  
  17.  
  18. <meta name="color:Background" content="#530b0b" />
  19. <meta name="color:Borders" content="#530b0b" />
  20. <meta name="color:Links" content="#8c0000" />
  21.  
  22. <meta name="image:Sidebar Image" content="" />
  23.  
  24. <meta name="if:Infinite Scroll" content="0" />
  25. <meta name="if:Show Archive Link" content="0" />
  26. <meta name="if:Like Button" content="1" />
  27. <meta name="if:Reblog Button" content="1" />
  28.  
  29.  
  30.  
  31. <title>{Title}{block:PostSummary}, {PostSummary}{/block:PostSummary}</title>
  32. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  33. <link rel="shortcut icon" href="{Favicon}" />
  34. <link rel="apple-touch-icon" href="{PortraitURL-128}"/>
  35. <link rel="alternate" type="application/rss+xml" href="{RSS}" />
  36. <link href="https://fonts.googleapis.com/css?family=Lobster" rel="stylesheet">
  37.  
  38. <style type="text/css">
  39.  
  40. body {color:#000000; font-family:Arial,sans-serif; font-size:12px; word-wrap:break-word; width:100%; height:100%; margin:0; padding:0; background:{color:Background} url(https://25.media.tumblr.com/6bbf894be6415690514bc6edbf7d7eae/tumblr_msnoy3wzh61shpaqho1_1280.png) fixed center top;}
  41.  
  42. img {max-width:100%; border:0;}
  43. a {text-decoration:none; color:{color:Links};}
  44. a:hover {text-decoration:none; color:rgba({RGBcolor:Links},0.6);}
  45. h1 {font:normal 32px 'Lobster'; margin:0 0 10px;}
  46. ol {list-style-type:upper-roman; margin:3px 0 3px -15px;}
  47. ul {margin:3px 0 3px -15px;}
  48. blockquote {margin:-8px 0 0 10px; padding:0 0 0 10px; border-left:solid 1px #000000;}
  49. .clear {clear:both;}
  50.  
  51.  
  52.  
  53. /***hook and weight***/
  54. #hook {background:url(https://media.tumblr.com/ecd5f9ff15303128ae7e7ff03f7f360e/tumblr_inline_msnpzuxxzz1qz4rgp.png) no-repeat right top; width:43px; height:64px; position:fixed; right:0; top:20px; z-index:3;}
  55.  
  56. #weight {width:121px; height:271px; position:fixed; right:-2px; bottom:0; z-index:4;}
  57. #weight .main {background-image:url(https://25.media.tumblr.com/71dccdeb0accb8f60293490288c6dce7/tumblr_msnoy3wzh61shpaqho2_250.png); width:100%; height:100%; position:relative; top:156px;}
  58.  
  59. #hook .chain, #weight .chain {background:url(https://media.tumblr.com/08f77afe0c0d80d0e59d303059484cfd/tumblr_inline_msnq0aSYG71qz4rgp.png) repeat-y center bottom; width:6px; height:1000px; position:absolute;}
  60. #hook .chain {left:6px; bottom:34px;}
  61. #weight .chain {left:54px; bottom:60px;}
  62.  
  63. #weightshadow {background-image:url(https://25.media.tumblr.com/35f78e946cde0f4b2029fcfbe5e07498/tumblr_msnoy3wzh61shpaqho3_250.png); width:121px; height:271px; position:fixed; right:-62px; bottom:-236px; opacity:0.25; z-index:1;}
  64. #weightshadow .chain {background:url(https://media.tumblr.com/73d074afa4cfbc93aa79476cb6687fc8/tumblr_inline_msnq0fGiX61qz4rgp.png) repeat-y center bottom; width:12px; height:1000px; position:absolute; left:51px; bottom:121px;}
  65.  
  66.  
  67.  
  68. /***Large Cog***/
  69. #largecog {height:100%; width:450px; position:fixed; left:50%; top:0; z-index:5;}
  70.  
  71. #cog4 {width:312px; height:312px; position:absolute; bottom:50%; right:142px; margin-bottom:-56px; z-index:1; -moz-transform:rotate(8deg); -webkit-transform:rotate(8deg); -o-transform:rotate(8deg); -ms-transform:rotate(8deg);}
  72.  
  73. #cog3a, #cog3b {width:148px; height:148px; position:absolute; bottom:50%; right:224px; margin-bottom:26px; z-index:2; -moz-transform:rotate(10deg); -webkit-transform:rotate(10deg); -o-transform:rotate(10deg); -ms-transform:rotate(10deg);}
  74. #cog3b {-moz-transform:rotate(0deg); -webkit-transform:rotate(0deg); -o-transform:rotate(0deg); -ms-transform:rotate(0deg);}
  75.  
  76.  
  77.  
  78.  
  79. /***RIGHT***/
  80. #right {height:100%; width:320px; position:fixed; left:50%; top:0; margin-left:130px; z-index:7;}
  81. #rightshadow {height:100%; width:320px; position:fixed; left:50%; top:0; margin:80px 0 0 190px; z-index:2; opacity:0.25;}
  82.  
  83.  
  84. /*turning chains*/
  85. #mfchain {width:26px; height:50%; position:absolute; bottom:50%; right:245px; margin-bottom:260px; z-index:11;}
  86. #mfchain #mfchainleft, #mfchain #mfchainright {background-image:url(https://media.tumblr.com/08f77afe0c0d80d0e59d303059484cfd/tumblr_inline_msnq0aSYG71qz4rgp.png); width:6px; height:100%; position:absolute; bottom:0; z-index:4;}
  87. #mfchain #mfchainleft {left:0;}
  88. #mfchain #mfchainright {right:0;}
  89.  
  90. #mfschain {width:32px; height:50%; position:absolute; bottom:50%; right:245px; margin:0 -3px 260px 0;}
  91. #mfschain #mfschainleft, #mfschain #mfschainright {background-image:url(https://media.tumblr.com/73d074afa4cfbc93aa79476cb6687fc8/tumblr_inline_msnq0fGiX61qz4rgp.png); width:12px; height:100%; position:absolute; bottom:0;}
  92. #mfschain #mfschainleft {left:0;}
  93. #mfschain #mfschainright {right:0;}
  94.  
  95. #mfspin {width:38px; height:38px; position:absolute; bottom:-20px; left:-6px;}
  96. #mfspin .bottomlayer, #mfspin #mfmiddle, #mfspin .toplayer {width:100%; height:100%; position:absolute; top:0;}
  97. #mfspin .bottomlayer {background-image:url(https://media.tumblr.com/a0e26aa42223f40db6ad46b2536eecb5/tumblr_inline_msnq0sd7GQ1qz4rgp.png); z-index:1;}
  98. #mfspin #mfmiddle {background-image:url(https://media.tumblr.com/c1318ca1906e5f5ee48929c4d47286a4/tumblr_inline_msnq0yO6Ma1qz4rgp.png); z-index:2; -moz-transform:rotate(15deg); -webkit-transform:rotate(15deg); -o-transform:rotate(15deg); -ms-transform:rotate(15deg);}
  99. #mfspin .toplayer {background-image:url(https://media.tumblr.com/7d57abafaaca42f0ce2f519ddfb224ea/tumblr_inline_msnq13Ctqs1qz4rgp.png); z-index:3;}
  100. #mfcover {width:38px; height:38px; position:absolute; bottom:-20px; left:-6px; background-image:url(https://media.tumblr.com/f521b1840e298ea6a59028758e8d94c4/tumblr_inline_msnq19a0ii1qz4rgp.png); z-index:5;}
  101.  
  102.  
  103. /*cog2*/
  104. #cog1a, #cog1b {width:92px; height:92px; position:absolute; bottom:50%; right:212px; margin-bottom:213px; z-index:10; -moz-transform:rotate(15deg); -webkit-transform:rotate(15deg); -o-transform:rotate(15deg); -ms-transform:rotate(15deg);}
  105.  
  106. #cog2a, #cog2b, #cog2c {width:92px; height:92px; position:absolute; bottom:50%; right:182px; margin-bottom:140px; z-index:9; -moz-transform:rotate(6deg); -webkit-transform:rotate(6deg); -o-transform:rotate(6deg); -ms-transform:rotate(6deg);}
  107.  
  108. #cog1b, #cog2b {-moz-transform:rotate(0deg); -webkit-transform:rotate(0deg); -o-transform:rotate(0deg); -ms-transform:rotate(0deg);}
  109.  
  110.  
  111.  
  112. /***Sidebar***/
  113. #side {width:318px; height:565px; position:absolute; top:50%; right:0; z-index:8; margin-top:-278px; background:url(https://25.media.tumblr.com/fad35f9c2c77c7fdf456a232e179b1ce/tumblr_msnoy3wzh61shpaqho4_400.png) no-repeat center center;}
  114. #sideshadow {width:371px; height:579px; position:absolute; top:50%; right:-5px; margin-top:-283px;}
  115.  
  116. #side a.avatar {display:block; width:115px; height:115px; position:absolute; top:20px; right:15px; -webkit-border-radius:50%; -moz-border-radius:50%; border-radius:50%; overflow:hidden; background:url({PortraitURL-128}) no-repeat center center; background-size:cover;}
  117. #side a.avatar img {display:block; width:115px; height:115px;}
  118.  
  119.  
  120. /*Sidebar Description*/
  121. #side .description {height:205px; width:165px; margin:20px; padding:10px; position:absolute; bottom:0px; left:15px; overflow-y:auto; border:solid 3px #4c1f12; border-color:rgba(0,0,0,0.5) rgba(255,255,255,0.2) rgba(255,255,255,0.25) rgba(0,0,0,0.4); background-color:rgba(0,0,0,0.2); color:#dedbd8;}
  122. #side .description h1 {font:normal normal 16px 'Lobster','Georgia Italic',Georgia,serif; margin-bottom:0;}
  123. #side .description a {color:#9f8a66;}
  124. #side .description a:hover {color:#554126;}
  125. #side .description::-webkit-scrollbar {width:12px;}
  126. #side .description::-webkit-scrollbar-thumb {background-color:#554126; border-radius:10px; -webkit-box-shadow:inset 3px 5px 6px #9f8a66;}
  127.  
  128. /*Sidebar Description - Divider*/
  129. #side .description .divider {width:100%; height:7px; margin:7px 0; background:url(https://media.tumblr.com/6f3f6a54e07cdfa9ab0720dc5ba534fb/tumblr_inline_msnr9kL0DM1qz4rgp.png) no-repeat center center;}
  130.  
  131.  
  132. /*Sidebar Description - Extra Links*/
  133. #side .description ol.desclinks {list-style-type:upper-roman; margin-top:-6px;}
  134. #side .description ol.desclinks li a {color:#dedbd8;}
  135. #side .description ol.desclinks li a:hover {color:#9f8a66;}
  136. #side .description .desclinks li:nth-child(1),
  137. #side .description .desclinks li:nth-child(2),
  138. #side .description .desclinks li:nth-child(3),
  139. #side .description .desclinks li:nth-child(4),
  140. #side .description .desclinks li:nth-child(5),
  141. #side .description .desclinks li:nth-child(6) {display:none;}
  142.  
  143. /*Sidebar Buttons*/
  144. #side .buttonlinks {width:50px; position:absolute; bottom:0; right:23px;}
  145. #side .buttonlinks span {width:100%; height:35px; margin-top:10px; background:url(https://static.tumblr.com/701c271264c9df5b466406d84945bd86/ar04e8q/25Uouz3qm/tumblr_static_5f4lh4793ls04w00wog4ksk4c.png) no-repeat center center;}
  146. #side .buttonlinks span:hover {position:relative; top:1px;}
  147. #side .buttonlinks span a {display:block; width:35px; height:25px; margin-left:15px; padding:7px 0; color:#ffffff; text-align:center; font:20px 'Times New Roman',Times; text-decoration:none; -webkit-border-radius:50%; -moz-border-radius:50%; border-radius:50%; box-shadow:55px 80px 5px rgba(0,0,0,0.25);}
  148.  
  149. #side .buttonlinks span {display:none;}
  150. #side .buttonlinks span:nth-child(1),
  151. #side .buttonlinks span:nth-child(2),
  152. #side .buttonlinks span:nth-child(3),
  153. #side .buttonlinks span:nth-child(4),
  154. #side .buttonlinks span:nth-child(5),
  155. #side .buttonlinks span:nth-child(6)
  156. {display:block;}
  157.  
  158. #side .buttonlinks span:nth-child(1) a:before,
  159. #side .buttonlinks span:nth-child(2) a:before,
  160. #side .buttonlinks span:nth-child(3) a:before,
  161. #side .buttonlinks span:nth-child(4) a:before,
  162. #side .buttonlinks span:nth-child(5) a:before,
  163. #side .buttonlinks span:nth-child(6) a:before
  164. {display:block; position:absolute;}
  165.  
  166. #side .buttonlinks span:nth-child(1) a:before {content:"I"; right:15px;}
  167. #side .buttonlinks span:nth-child(2) a:before {content:"II"; right:12px;}
  168. #side .buttonlinks span:nth-child(3) a:before {content:"III"; right:9px;}
  169. #side .buttonlinks span:nth-child(4) a:before {content:"IV"; right:8px;}
  170. #side .buttonlinks span:nth-child(5) a:before {content:"V"; right:11px;}
  171. #side .buttonlinks span:nth-child(6) a:before {content:"VI"; right:8px;}
  172.  
  173.  
  174.  
  175. /***LEFT***/
  176. #content {width:560px; margin:140px auto 100px; position:relative; right:150px; z-index:6; background:url(https://static.tumblr.com/26081dcf706d3bdbfb89551838f29f90/ar04e8q/ab7ouz3qm/tumblr_static_50dhqhtcrwo4w00088co8cc8o.png) repeat-y 124px 4px;}
  177. #content img.bgtop {display:block; width:300px; height:111px; position:absolute; z-index:1; top:-111px; left:126px;}
  178. #content img.bgbottom {display:block; width:302px; height:13px; position:absolute; z-index:1; bottom:-13px; left:123px; box-shadow:60px 80px 5px rgba(0,0,0,0.25);}
  179.  
  180. /*Posts*/
  181. #post {width:556px; padding:2px; margin:0 0 75px; background:#e6e5e3 url(https://25.media.tumblr.com/8a4396e8b05782acd58e83023088d89c/tumblr_msnoy3wzh61shpaqho6_1280.jpg) repeat center top; position:relative; z-index:3; color:#000000; box-shadow:60px 80px 5px rgba(0,0,0,0.25);}
  182. #post:after {content:url(https://static.tumblr.com/f0459eba5f16bcf9a939701ba6838493/ar04e8q/hbsouz2sp/tumblr_static_bgayoww7h3scs8s0c8scc4gg4.png); width:316px; height:13px; position:absolute; bottom:-13px; left:124px;}
  183. #post:last-child {margin:0;}
  184. #post:last-child:after {content:none;}
  185.  
  186. /*Post Frames*/
  187. #post #frame {padding:17px; position:relative; border:solid 11px {color:Borders};}
  188. #post #frame .frametop {height:21px; width:560px; background:url(https://25.media.tumblr.com/e4d66ca194a08a5af15af346c0250208/tumblr_msnoy3wzh61shpaqho8_1280.png) no-repeat center top; position:absolute; top:-13px; left:-13px;}
  189. #post #frame .framebottom {height:17px; width:560px; background:url(https://static.tumblr.com/2c21bc47f91d80eca4d9bc7740bf65b0/ar04e8q/3dAouz2ux/tumblr_static_ejofrds8tag44g4okok0kwogc.png) no-repeat center top; position:absolute; bottom:-13px; left:-13px;}
  190. #post #frame .frameleft, #post #frame .frameright {width:20px; height:100%; position:absolute; top:0;}
  191. #post #frame .frameleft {left:-13px; background:url(https://media.tumblr.com/5e92297a96c1e5e323006432d7f336bf/tumblr_inline_msnq2zjETS1qz4rgp.png) repeat-y left top;}
  192. #post #frame .frameright {right:-13px; background:url(https://media.tumblr.com/b538a9aebfae9197b0f6a9ebcac481c1/tumblr_inline_msnq36bsLK1qz4rgp.png) repeat-y right top;}
  193.  
  194. /*Post Top - timestamp + like/reblog/permalink*/
  195. #post #permagap {width:100%; height:30px;}
  196.  
  197. #post #buttons {height:53px; width:174px; position:absolute; top:-29px; right:9px; text-align:right; z-index:2;}
  198. #post #buttons a {display:inline-block; height:53px; width:53px; margin-right:2px; background:url(https://media.tumblr.com/e924cde49fe39ba6d70f28eb2ff64cfa/tumblr_inline_msnq3lCPnn1qz4rgp.png) no-repeat left top; position:relative;}
  199. #post #buttons a:hover {top:1px;}
  200. #post #buttons .like {position:relative; top:-16px; height:42px; width:38px; padding:11px 15px 0 0;}
  201. #post #buttons .like:hover {top:-15px;}
  202. #post #buttons .reblog:before, #post #buttons .permalink:before {width:23px; height:21px; position:absolute;}
  203. #post #buttons .reblog:before {content:url(https://media.tumblr.com/16f0b46736348f269cd7b2ce1fdd7f47/tumblr_inline_msnq42QGv81qz4rgp.png); top:13px; left:13px;}
  204. #post #buttons .permalink:before {content:url(https://media.tumblr.com/fb0b30a8a83938207f9f8418495e777e/tumblr_inline_msoul0kP3z1qz4rgp.png); top:11px; left:12px;}
  205.  
  206. #post #timestamp {width:227px; height:105px; position:absolute; top:-64px; left:12px; background:url(https://static.tumblr.com/dc0d48116fc56c9dd11b7f3f2ee963c4/ar04e8q/8lsouz30x/tumblr_static_bvpwzhsovk00gsg08s4skg4og.png) no-repeat left top; z-index:2;}
  207. #post #timestamp .clockparts {width:40px; height:40px; position:absolute; top:38px; left:59px; box-shadow:none;}
  208. #post #timestamp .time, #timestamp .date {display:block; color:#ffffff; font:bold 15px 'Courier New'; text-align:center; margin:0 8px 0 110px; white-space:nowrap;}
  209. #post #timestamp .time {margin-top:43px;}
  210. #post #timestamp .date {font-size:10px;}
  211.  
  212. /*Post Bottom - via/root/src + notecount*/
  213. #post #footerbuttons {height:43px; position:absolute; bottom:-29px; left:20px; z-index:2;}
  214. #post #footerbuttons a {display:inline-block; height:21px; width:31px; padding:11px 8px 11px 4px; margin-right:-2px; background:url(https://media.tumblr.com/d95f83b1b1557507a92e905532ea9a13/tumblr_inline_msnq55U1DM1qz4rgp.png) no-repeat left top; position:relative; text-align:center; color:#ffffff; font:11px 'Courier New'; text-decoration:none;}
  215. #post #footerbuttons a:hover {top:1px;}
  216.  
  217. #post #notecount {height:36px; width:250px; position:absolute; bottom:-23px; right:20px; padding:1px 24px 0 20px; z-index:2;}
  218. #post #notecount a {float:right; display:block; position:relative; height:24px; padding-top:11px; background:black url(https://media.tumblr.com/b691cac93e8e714e6a92cd6a65b9a1ef/tumblr_inline_msnq5ioR1l1qz4rgp.png) center bottom; color:white; font:bold 11px 'Courier New'; white-space:nowrap;}
  219. #post #notecount a:hover {color:white; top:1px;}
  220. #post #notecount a img.left {position:absolute; bottom:0px; left:-20px;}
  221. #post #notecount a img.right {position:absolute; bottom:0px; right:-24px;}
  222.  
  223.  
  224.  
  225. /***Posts content***/
  226. #post a.tumblr_blog {font:normal normal 16px 'Lobster','Georgia Italic',Georgia,serif; color:black;}
  227. #post a.tumblr_blog:hover {opacity:0.6;}
  228.  
  229. /*Posts - photo/photoset/video*/
  230. #post #media {margin-bottom:10px; text-align:center;}
  231.  
  232. /*Posts - audio*/
  233. #post #audio {min-height:128px; position:relative; padding:0 50px; background-image:url(https://media.tumblr.com/aeaac18d3e51803bfb48966d1f1a90bf/tumblr_inline_msnq661noR1qz4rgp.png), url(https://media.tumblr.com/0e4f61095091c3bcffc90d010200d6fc/tumblr_inline_msnq6bCcTO1qz4rgp.png); background-position:left top, right bottom; background-repeat:no-repeat;}
  234. #post #audio #albumart {width:128px; height:128px; -webkit-border-radius:50%; -moz-border-radius:50%; border-radius:50%; border:solid 1px black; overflow:hidden; position:relative; background-color:black; float:left; margin-right:15px;}
  235. #post #audio #albumart img {width:128px; height:128px; display:block; -webkit-border-radius:50%; -moz-border-radius:50%; border-radius:50%;}
  236. #post #audio #albumart .play {display:block; position:absolute; z-index:2; top:50%; left:50%; width:27px; height:27px; padding:6px; margin:-19px; background-color:black; -webkit-border-radius:50%; -moz-border-radius:50%; border-radius:50%;}
  237. #post #audio #albumart .button {display:block; width:27px; height:27px; overflow:hidden;}
  238. #post #audio ul {list-style-type:none; padding-top:15px;}
  239. #post #audio ul li {margin-bottom:4px;}
  240. #post #audio ul li span {font:normal normal 16px 'Lobster','Georgia Italic',Georgia,serif;}
  241.  
  242. /*Posts - quote*/
  243. #post h1.quote {display:inline;}
  244.  
  245. /*Posts - answer*/
  246. #post #question {padding:60px 50px; min-height:114px; background-image:url(https://24.media.tumblr.com/444e7b7640d5afd57a1a4f39a24d534a/tumblr_msnppbHo4M1shpaqho1_500.png), url(https://static.tumblr.com/35912104b42f4419701d87701c0df9d3/ar04e8q/zygouz36u/tumblr_static_bkiq9wwrp0ooow0oocgkc80ko.png); background-position:center top, center bottom; background-repeat:no-repeat;}
  247. #post #question img {width:64px; height:64px; margin:7px 2px 2px 10px; float:right; -webkit-border-radius:5px; -moz-border-radius:5px; border-radius:5px; border:solid 1px black;}
  248. #post #question span {font:normal normal 16px 'Lobster','Georgia Italic',Georgia,serif; display:block;}
  249. #post #question span a {color:black;}
  250. #post #question span a:hover {opacity:0.6;}
  251. #post #answer a.tumblr_blog {display:block; margin:0 0 -40px 50px; position:relative; top:10px; z-index:2;}
  252. #post #answer a.tumblr_blog:after {content:" replied:";}
  253. #post #answer blockquote {position:relative; margin:0; padding:6px 50px 10px; min-height:113px; border:none; background-image:url(https://media.tumblr.com/aeaac18d3e51803bfb48966d1f1a90bf/tumblr_inline_msnq661noR1qz4rgp.png), url(https://media.tumblr.com/0e4f61095091c3bcffc90d010200d6fc/tumblr_inline_msnq6bCcTO1qz4rgp.png); background-position:left top, right bottom; background-repeat:no-repeat;}
  254.  
  255. /*Posts - chat*/
  256. #post ul.chat {list-style-type:none; margin:0 0 0 -40px;}
  257. #post ul.chat li {margin-bottom:4px;}
  258. #post ul.chat li span {font:normal normal 16px 'Lobster','Georgia Italic',Georgia,serif;}
  259.  
  260. /*Posts - link*/
  261. #post h1.link span {font:38px arial,sans-serif; position:relative; top:2px;}
  262.  
  263. /*Posts - footer*/
  264. #post #divider {width:100%; height:7px; background:url(https://40.media.tumblr.com/d222f559e2c815271840766081b77ccb/tumblr_nsc3uoFwaF1shpaqho1_500.png) no-repeat center center; margin:10px 0 7px;}
  265. #footer a {color:black;}
  266. #footer a:hover {opacity:0.6;}
  267.  
  268. /*Pagination*/
  269. #pagination {background:url(https://static.tumblr.com/454886b06a08ecbd52cd508cb7fd4c9d/ar04e8q/9NWouz3bs/tumblr_static_6g0wl3scdu88w84404gow08sw.png) no-repeat 209px top; width:100%; height:133px; position:absolute; bottom:-133px; left:0; z-index:3;}
  270. #pagination span {display:block; width:35px; height:35px; position:absolute;}
  271. #pagination span a {display:block; width:35px; height:26px; padding-top:9px; color:white; font:bold 14px 'Courier New'; white-space:nowrap; text-align:center; -webkit-border-radius:50%; -moz-border-radius:50%; border-radius:50%;}
  272. #pagination span.current a {color:#666666;}
  273.  
  274. #pagination .page:nth-child(1) {padding:0 5px 0 0; background-image:url(https://media.tumblr.com/4fab9a87475df47d3bd7fe1b725d9a18/tumblr_inline_msnq6mvDmk1qz4rgp.png); top:16px; left:180px; z-index:1;}
  275. #pagination .page:nth-child(1):hover {top:17px;}
  276. #pagination .page:nth-child(1) a {box-shadow:50px 76px 5px rgba(0,0,0,0.25);}
  277.  
  278. #pagination .page:nth-child(2) {padding:3px 0 0 0; background-image:url(https://media.tumblr.com/65a02b647cc1788734b59569dee31474/tumblr_inline_msnq6tP5Y01qz4rgp.png); top:41px; left:217px; z-index:2;}
  279. #pagination .page:nth-child(2):hover {top:42px;}
  280. #pagination .page:nth-child(2) a {box-shadow:48px 74px 5px rgba(0,0,0,0.25);}
  281.  
  282. #pagination .page:nth-child(3) {padding:11px 0 0 0; background-image:url(https://media.tumblr.com/e3240222e09e6e54421dd9c496d97815/tumblr_inline_msnq6zQI8J1qz4rgp.png); top:44px; left:264px; z-index:3;}
  283. #pagination .page:nth-child(3):hover {top:45px;}
  284. #pagination .page:nth-child(3) a {box-shadow:45px 71px 5px rgba(0,0,0,0.25);}
  285.  
  286. #pagination .page:nth-child(4) {padding:7px 0 0 2px; background-image:url(https://media.tumblr.com/d199c8981aff8a5b7328261e411a6acb/tumblr_inline_msnq76NPir1qz4rgp.png); top:37px; left:309px; z-index:2;}
  287. #pagination .page:nth-child(4):hover {top:38px;}
  288. #pagination .page:nth-child(4) a {box-shadow:43px 74px 5px rgba(0,0,0,0.25);}
  289.  
  290. #pagination .page:nth-child(5) {padding:0 0 0 4px; background-image:url(https://media.tumblr.com/075620d05ea4e5f13c77b6d616e57619/tumblr_inline_msnq7dJled1qz4rgp.png); top:16px; left:344px; z-index:1;}
  291. #pagination .page:nth-child(5):hover {top:17px;}
  292. #pagination .page:nth-child(5) a {box-shadow:42px 76px 5px rgba(0,0,0,0.25);}
  293.  
  294. /*Notecontainer*/
  295. #notecontainer {margin:20px 0 0; padding:0; position:relative:}
  296. #notecontainer .title {font:normal normal 16px 'Lobster','Georgia Italic',Georgia,serif;}
  297. #notecontainer ol {list-style-type:none; margin:10px 0 0 -40px;}
  298. #notecontainer li {margin-bottom:6px;}
  299. #notecontainer img.avatar {width:16px; height:16px; margin-right:4px; position:relative; top:4px; -webkit-border-radius:50%; -moz-border-radius:50%; border-radius:50%; border:solid 1px black;}
  300. #notecontainer blockquote {margin:5px 0 0; padding:0 0 0 45px; border:none; position:relative;}
  301. #notecontainer blockquote:before {content:"↳"; position:absolute; top:-6px; left:30px; font:18px arial,sans-serif;}
  302. #notecontainer blockquote a {color:black; font-style:italic;}
  303.  
  304. /*Credit - DO NOT REMOVE*/
  305. a.credit {display:block; width:24px; height:24px; position:fixed; bottom:5px; right:5px; z-index:99; background:url(https://static.tumblr.com/1b424551fa0cf765c96000625d8333e7/ar04e8q/IXcpog6eu/tumblr_static_72okfia78oowwkwww8wswk0oc.png) no-repeat; opacity:0.2;}
  306. a.credit:hover {opacity:0.4;}
  307.  
  308.  
  309. /*Firefox Fox*/
  310. @-moz-document url-prefix() {
  311. #side .buttonlinks span a {width:25px; height:25px; padding:5px 0 9px 10px;}
  312. }
  313.  
  314. {CustomCSS}
  315. </style>
  316.  
  317. <!--[if IE]>
  318. <style type="text/css">
  319. #side .buttonlinks span a {width:25px; height:25px; padding:5px 0 9px 10px;}
  320. </style>
  321. <![endif]-->
  322.  
  323. <script type="text/javascript">
  324.  
  325. //get distance scrolled (scrOfY)
  326. document.onscroll = getScrollY;
  327. function getScrollY() {
  328. var scrOfY = 0;
  329. if(typeof(window.pageYOffset)=='number') {scrOfY = window.pageYOffset;}
  330. else if(document.body && (document.body.scrollLeft || document.body.scrollTop)) {scrOfY=document.body.scrollTop;}
  331. else if(document.documentElement && (document.documentElement.scrollTop)) {scrOfY = document.documentElement.scrollTop;}
  332.  
  333. //get window height (WinY)
  334. //modified from Andy Langton's script: http://bit.ly/uhVzr5
  335. var WinY;
  336. if (typeof window.innerWidth != 'undefined') { WinY = window.innerHeight }
  337. else if (typeof document.documentElement != 'undefined' && typeof document.documentElement.clientHeight != 'undefined' && document.documentElement.clientHeight != 0) { WinY = document.documentElement.clientHeight }
  338. else { WinY = document.getElementsByTagName('body')[0].clientHeight}
  339.  
  340. //get page height (DocY)
  341. //modified from James Padolsey's script: http://bit.ly/XxWM41
  342. var DocY = Math.max(document.body.scrollHeight, document.documentElement.scrollHeight, document.body.offsetHeight, document.documentElement.offsetHeight, document.body.clientHeight, document.documentElement.clientHeight);
  343.  
  344. //convert distance as % of page height to distance as % of window height
  345. var pageY = (scrOfY/DocY)*(WinY-32); //value in px
  346.  
  347. //apply vertical position to scrolling hook
  348. document.getElementById("hook").style.marginTop = pageY+"px";
  349.  
  350. //apply vertical position to weight
  351. document.getElementById("weight").style.marginBottom = pageY+"px";
  352. document.getElementById("weightshadow").style.marginBottom = pageY+"px";
  353.  
  354. //apply chain movement
  355. document.getElementById("mfchainright").style.backgroundPosition = "center "+(pageY*0.41655)+"px";
  356. document.getElementById("mfchainleft").style.backgroundPosition = "center "+(-pageY*0.41655)+"px";
  357.  
  358. //calculate rotation value for cog1
  359. var r1 = scrOfY*1.6*0.4686 + 15;
  360.  
  361. //apply chain spin
  362. document.getElementById("mfmiddle").style.mozTransform = "rotate("+r1+"deg)";
  363. document.getElementById("mfmiddle").style.webkitTransform = "rotate("+r1+"deg)";
  364. document.getElementById("mfmiddle").style.oTransform = "rotate("+r1+"deg)";
  365. document.getElementById("mfmiddle").style.msTransform = "rotate("+r1+"deg)";
  366. document.getElementById("mfmiddle").style.transform = "rotate("+r1+"deg)";
  367.  
  368. //apply cog1 spin
  369. document.getElementById("cog1a").style.mozTransform = "rotate("+r1+"deg)";
  370. document.getElementById("cog1a").style.webkitTransform = "rotate("+r1+"deg)";
  371. document.getElementById("cog1a").style.oTransform = "rotate("+r1+"deg)";
  372. document.getElementById("cog1a").style.msTransform = "rotate("+r1+"deg)";
  373. document.getElementById("cog1a").style.transform = "rotate("+r1+"deg)";
  374.  
  375. //calculate rotation value for cog2
  376. var r2 = -(scrOfY*1.6*0.4686) + 6;
  377.  
  378. //apply cog2 spin
  379. document.getElementById("cog2a").style.mozTransform = "rotate("+r2+"deg)";
  380. document.getElementById("cog2a").style.webkitTransform = "rotate("+r2+"deg)";
  381. document.getElementById("cog2a").style.oTransform = "rotate("+r2+"deg)";
  382. document.getElementById("cog2a").style.msTransform = "rotate("+r2+"deg)";
  383. document.getElementById("cog2a").style.transform = "rotate("+r2+"deg)";
  384.  
  385. document.getElementById("cog2c").style.mozTransform = "rotate("+r2+"deg)";
  386. document.getElementById("cog2c").style.webkitTransform = "rotate("+r2+"deg)";
  387. document.getElementById("cog2c").style.oTransform = "rotate("+r2+"deg)";
  388. document.getElementById("cog2c").style.msTransform = "rotate("+r2+"deg)";
  389. document.getElementById("cog2c").style.transform = "rotate("+r2+"deg)";
  390.  
  391. //calculate rotation value for cog3
  392. var r3 = scrOfY*0.8*0.4686 + 10;
  393.  
  394. //apply cog3 spin
  395. document.getElementById("cog3a").style.mozTransform = "rotate("+r3+"deg)";
  396. document.getElementById("cog3a").style.webkitTransform = "rotate("+r3+"deg)";
  397. document.getElementById("cog3a").style.oTransform = "rotate("+r3+"deg)";
  398. document.getElementById("cog3a").style.msTransform = "rotate("+r3+"deg)";
  399. document.getElementById("cog3a").style.transform = "rotate("+r3+"deg)";
  400.  
  401. //calculate rotation value for cog4
  402. var r4 = scrOfY*0.8*0.4686 + 8;
  403.  
  404. //apply cog4 spin
  405. document.getElementById("cog4").style.mozTransform = "rotate("+r4+"deg)";
  406. document.getElementById("cog4").style.webkitTransform = "rotate("+r4+"deg)";
  407. document.getElementById("cog4").style.oTransform = "rotate("+r4+"deg)";
  408. document.getElementById("cog4").style.msTransform = "rotate("+r4+"deg)";
  409. document.getElementById("cog4").style.transform = "rotate("+r4+"deg)";
  410.  
  411. document.getElementById("cog4shadow").style.mozTransform = "rotate("+r4+"deg)";
  412. document.getElementById("cog4shadow").style.webkitTransform = "rotate("+r4+"deg)";
  413. document.getElementById("cog4shadow").style.oTransform = "rotate("+r4+"deg)";
  414. document.getElementById("cog4shadow").style.msTransform = "rotate("+r4+"deg)";
  415. document.getElementById("cog4shadow").style.transform = "rotate("+r4+"deg)";
  416.  
  417. return true;
  418. }
  419.  
  420. </script>
  421.  
  422. {block:IfInfiniteScroll}<script type="text/javascript" src="https://codysherman.com/tools/infinite-scrolling/code"></script>{/block:IfInfiniteScroll}
  423.  
  424. </head>
  425. <body>
  426. <a href="https://themesbyeris.tumblr.com/" class="credit" title="themes by eris"></a>
  427. <!-- Do not remove the credit -->
  428.  
  429.  
  430.  
  431. <div id="hook"><div class="chain"></div></div>
  432. <div id="weight"><div class="main"></div><div class="chain"></div></div>
  433. <div id="weightshadow"><div class="chain"></div></div>
  434.  
  435.  
  436. <div id="largecog">
  437. <img id="cog3a" src="https://25.media.tumblr.com/ac99be8daa6ac86d43358687f67a46ab/tumblr_msnppbHo4M1shpaqho5_250.png" />
  438. <img id="cog3b" src="https://static.tumblr.com/7c0eea9ec0cad8c8f7aeb51e2c88e08f/ar04e8q/fMjouz3if/tumblr_static_eg5g33ywancocc8gsgowkg4k8.png" />
  439. <img id="cog4" src="https://25.media.tumblr.com/ed12723661695d6c69cc7e3e418b6211/tumblr_msnppbHo4M1shpaqho7_400.png" />
  440. </div>
  441.  
  442.  
  443. <div id="right">
  444.  
  445. <div id="mfchain"><div id="mfchainleft"></div><div id="mfchainright"></div><div id="mfspin"><div class="bottomlayer"></div><div id="mfmiddle"></div><div class="toplayer"></div></div><div id="mfcover"></div></div>
  446. <img id="cog1a" src="https://media.tumblr.com/1bd00b3c81506c7cb03b9484edd93187/tumblr_inline_msnq7yD08K1qz4rgp.png" />
  447. <img id="cog1b" src="https://media.tumblr.com/25c007882a3b456f3635f58ce58c314b/tumblr_inline_msnq86nxld1qz4rgp.png" />
  448. <img id="cog2a" src="https://media.tumblr.com/abad90366ac3164f8b56dfc46b1ba750/tumblr_inline_msnq8cceub1qz4rgp.png" />
  449. <img id="cog2b" src="https://media.tumblr.com/575f3de45180bf1814e769de5112ad55/tumblr_inline_msnq8jX3Wy1qz4rgp.png" />
  450. <img id="cog2c" src="https://media.tumblr.com/65eee6d017b24d534558e2dcc50f7b6a/tumblr_inline_msnq8prVfW1qz4rgp.png" />
  451.  
  452. <div id="side">
  453. <a class="avatar" href="/"><img src="{image:Sidebar Image}" /></a>
  454.  
  455. <div class="description">
  456. <h1>{Title}</h1>
  457. <div class="divider"></div>
  458. {Description}
  459. <div class="divider"></div>
  460. <ol class="desclinks">
  461. {block:AskEnabled}<li><a href="/ask">{AskLabel}</a></li>{/block:AskEnabled}
  462. {block:SubmissionsEnabled}<li><a href="/submit">{SubmitLabel}</a></li>{/block:SubmissionsEnabled}
  463. {block:IfShowArchiveLink}<li><a href="/archive">Archive</a></li>{block:IfShowArchiveLink}
  464. {block:HasPages}{block:Pages}<li><a href="{URL}">{Label}</a></li>{/block:Pages}{/block:HasPages}
  465. </ol> <!--desclinks-->
  466. </div> <!--description-->
  467.  
  468. <div class="buttonlinks">
  469. {block:AskEnabled}<span><a href="/ask" title="{AskLabel}"></a></span>{/block:AskEnabled}
  470. {block:SubmissionsEnabled}<span><a href="/submit" title="{SubmitLabel}"></a></span>{/block:SubmissionsEnabled}
  471. {block:IfShowArchiveLink}<span><a href="/archive" title="Archive"></a></span>{block:IfShowArchiveLink}
  472. {block:HasPages}{block:Pages}<span><a href="{URL}" title="{Label}"></a></span>{/block:Pages}{/block:HasPages}
  473. </div> <!--buttonlinks-->
  474.  
  475. </div> <!--side-->
  476.  
  477. </div> <!--right-->
  478.  
  479.  
  480.  
  481. <div id="rightshadow">
  482. <div id="mfschain"><div id="mfschainleft"></div><div id="mfschainright"></div></div>
  483. <img id="sideshadow" src="https://25.media.tumblr.com/147c1ffd4f7abb027b7509f1c0d3c4dc/tumblr_msnppbHo4M1shpaqho8_400.png" />
  484. </div> <!--rightshadow-->
  485.  
  486.  
  487.  
  488. <div id="content">
  489. <img class="bgtop" src="https://24.media.tumblr.com/6bc225bb6516ec88244872b095b464f2/tumblr_msnppbHo4M1shpaqho9_r1_400.png" />
  490. <img class="bgbottom" src="https://24.media.tumblr.com/5ac1df84822e5c83122c686964646c1c/tumblr_msnppbHo4M1shpaqho10_r1_400.png" />
  491.  
  492. {block:IfInfiniteScroll}<div class="autopagerize_page_element">{/block:IfInfiniteScroll}
  493. {block:Posts}
  494. <div id="post">
  495. <div id="frame">
  496.  
  497. <div class="frametop"></div><div class="frameleft"></div><div class="frameright"></div><div class="framebottom"></div>
  498.  
  499.  
  500.  
  501. {block:Date}
  502.  
  503. <div id="timestamp">
  504. <img id="clockhandlong{PostID}" class="clockparts" style="z-index:2;" src="https://media.tumblr.com/fb0c93038d23a3aca690bc35300945a8/tumblr_inline_msnqaztmEz1qz4rgp.png" onload="document.getElementById('clockhandlong{PostID}').style.mozTransform = 'rotate('+({Minutes}*6)+'deg)'; document.getElementById('clockhandlong{PostID}').style.webkitTransform = 'rotate('+({Minutes}*6)+'deg)'; document.getElementById('clockhandlong{PostID}').style.oTransform = 'rotate('+({Minutes}*6)+'deg)'; document.getElementById('clockhandlong{PostID}').style.msTransform = 'rotate('+({Minutes}*6)+'deg)'; document.getElementById('clockhandlong{PostID}').style.transform = 'rotate('+({Minutes}*6)+'deg)';" />
  505. <img id="clockhandshort{PostID}" class="clockparts" style="z-index:1;" src="https://media.tumblr.com/71c06837698599b5d45d69b0671dbf99/tumblr_inline_msnqb9HU681qz4rgp.png" onload="document.getElementById('clockhandshort{PostID}').style.mozTransform = 'rotate('+({12Hour}*30 + {Minutes}*0.5)+'deg)'; document.getElementById('clockhandshort{PostID}').style.webkitTransform = 'rotate('+({12Hour}*30 + {Minutes}*0.5)+'deg)'; document.getElementById('clockhandshort{PostID}').style.oTransform = 'rotate('+({12Hour}*30 + {Minutes}*0.5)+'deg)'; document.getElementById('clockhandshort{PostID}').style.msTransform = 'rotate('+({12Hour}*30 + {Minutes}*0.5)+'deg)'; document.getElementById('clockhandshort{PostID}').style.transform = 'rotate('+({12Hour}*30 + {Minutes}*0.5)+'deg)';"/>
  506. <img class="clockparts" style="z-index:3;" src="https://media.tumblr.com/fe75dca7267fd3d9718ea41931837103/tumblr_inline_msnq9aMr0d1qz4rgp.png" />
  507. <span class="time">{12Hour}:{Minutes}{AmPm}</span>
  508. <span class="date">{Month} {DayOfMonth}, {Year}</span>
  509. </div>
  510.  
  511. <div id="buttons">
  512. {block:IfLikeButton}<a class="like" title="Like">{LikeButton color="white" size="26"}</a>{/block:IfLikeButton}
  513. {block:IfReblogButton}<a class="reblog" href="{ReblogURL}" title="Reblog"></a>{/block:IfReblogButton}
  514. <a class="permalink" href="{Permalink}" title="Permalink"></a>
  515. </div>
  516.  
  517. <div id="permagap"></div>
  518. {/block:Date}
  519.  
  520. {block:Photo}
  521. <div id="media">{LinkOpenTag}<img src="{PhotoURL-500}" alt="{PhotoAlt}" />{LinkCloseTag}</div>
  522. {block:Caption}{Caption}{/block:Caption}
  523. {/block:Photo}
  524.  
  525. {block:Photoset}
  526. <div id="media">{Photoset-500}</div>
  527. {block:Caption}{Caption}{/block:Caption}
  528. {/block:Photoset}
  529.  
  530. {block:Video}
  531. <div id="media">{Video-500}</div>
  532. {block:Caption}{Caption}{/block:Caption}
  533. {/block:Video}
  534.  
  535. {block:Audio}
  536. <div id="audio">
  537. <div id="albumart">{block:AlbumArt}<img src="{AlbumArtURL}" />{/block:AlbumArt}<span class="play"><span class="button">{AudioPlayerBlack}</span></span></div>
  538. <ul>
  539. {block:PlayCount}<li><span>Plays:</span>&nbsp;{FormattedPlayCount}</li>{/block:PlayCount}
  540. {block:Artist}<li><span>Artist:</span>&nbsp;{Artist}</li>{/block:Artist}
  541. {block:Album}<li><span>Album:</span>&nbsp;{Album}</li>{/block:Album}
  542. {block:TrackName}<li><span>Track Name:</span>&nbsp;{TrackName}</li>{/block:TrackName}
  543. </ul>
  544. </div>
  545. {block:Caption}{Caption}{/block:Caption}
  546. {/block:Audio}
  547.  
  548. {block:Quote}
  549. <h1 class="quote">“{Quote}”</h1>
  550. {block:Source}—&nbsp;{Source}{/block:Source}
  551. {/block:Quote}
  552.  
  553. {block:Text}
  554. {block:Title}
  555. <h1>{Title}</h1>
  556. {/block:Title}
  557. {Body}
  558. {/block:Text}
  559.  
  560. {block:Answer}
  561. <div id="question"><img src="{AskerPortraitURL-64}" /><span>{Asker} asked: </span>{Question}</div>
  562. <div id="answer">{Answer}</div>
  563. {block:Answer}
  564.  
  565. {block:Chat}
  566. {block:Title}<h1>{Title}</h1>{/block:Title}
  567. <ul class="chat">
  568. {block:Lines}<li>{block:Label}<span>{Label}</span>{/block:Label} {Line}</li>{/block:Lines}
  569. </ul>
  570. {/block:Chat}
  571.  
  572. {block:Link}
  573. <h1 class="link"><a href="{URL}" {Target}><span>➸</span>&nbsp;{Name}</a></h1>
  574. {block:Description}{Description}{/block:Description}
  575. {/block:Link}
  576.  
  577. {block:Date}
  578. {block:HasTags}
  579. <div id="divider"></div>
  580. <div id="footer">{block:Tags}<a href="{TagURL}">#{Tag}</a>&nbsp; {/block:Tags}</div>
  581. {/block:HasTags}
  582. {/block:Date}
  583.  
  584. {block:PostNotes}
  585. <div id="notecontainer">
  586. {block:NoteCount}<div class="title">Notes:</div>{/block:NoteCount}
  587. {PostNotes}
  588. </div>
  589. {/block:PostNotes}
  590.  
  591. {block:Date}
  592.  
  593. <div id="footerbuttons">
  594. {block:RebloggedFrom}
  595. <a href="{ReblogParentURL}" title="{ReblogParentName}">via</a>
  596. <a href="{ReblogRootURL}" title="{ReblogRootName}">root</a>
  597. {/block:RebloggedFrom}
  598. {block:ContentSource}
  599. <a href="{SourceURL}" title="{SourceTitle}">src</a>
  600. {/block:ContentSource}
  601. </div> <!--footerbuttons-->
  602.  
  603. {block:NoteCount}
  604. <div id="notecount">
  605. <a href="{Permalink}" title="Permalink"><img class="left" src="https://media.tumblr.com/c0743c5f50028753b449a2748b1450e3/tumblr_inline_msnq9kiIlf1qz4rgp.png" />{NoteCountWithLabel}<img class="right" src="https://media.tumblr.com/4d6abe4324a7acebcca926839229cedb/tumblr_inline_msnq9zbV8t1qz4rgp.png" /></a>
  606. </div> <!--notecount-->
  607. {/block:NoteCount}
  608. {/block:Date}
  609.  
  610. </div> <!--frame-->
  611. </div> <!--post-->
  612. {/block:Posts}
  613. {block:IfInfiniteScroll}</div>{/block:IfInfiniteScroll}
  614.  
  615.  
  616.  
  617. {block:IfNotInfiniteScroll}
  618. {block:Pagination}
  619. <div id="pagination">
  620. {block:JumpPagination length="5"}
  621. {block:CurrentPage}<span class="page current"><a>{PageNumber}</a></span>{/block:CurrentPage}
  622. {block:JumpPage}<span class="page"><a href="{URL}">{PageNumber}</a></span>{/block:JumpPage}
  623. {/block:JumpPagination}
  624. </div>
  625. {/block:Pagination}
  626. {/block:IfNotInfiniteScroll}
  627.  
  628.  
  629.  
  630. </div> <!--content-->
  631.  
  632. </body>
  633. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement