API tools faq
paste
feiinho

Theme: Steampunk

feiinho
May 13th, 2019
359
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 36.25 KB | None | 0 0
raw download clone embed print report diff
  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>
Add Comment
Please, Sign In to add comment
Public Pastes
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!