Advertisement
neechan

BEATO THE GOLDEN (OLD)

Nov 10th, 2013
327
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 10.21 KB | None | 0 0
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  3.  
  4. <!--
  5. this theme is old therefore i shall not help you customize it!
  6. About Page: BY COU (ushir0miya)
  7.  
  8. ~ Wooooo! It's time for my *coughs*most hated*coughs louder* faaaavorite character's appreciation! It's Beatrice from Umineko! I'm actually serious. I love Beatrice but she pisses me off. Beato, dear Beato, why are you so cruel?
  9. ~ This code is dedicated to Maemi (h-e-i-w-a-j-i-m-a) and was made for her, but allowed to be public. Might as well bless her. This is my favorite code of them all!
  10. CTRL + F "IMAGES!!" to find the places to place the images and "DESCS!!" to put things/words.
  11. Ask http://spookybasketball.tumblr.com/ or http://himuro.co.vu/ if you have questions. ~
  12. -->
  13.  
  14. <head>
  15.  
  16. <title>{Title}</title>
  17. <link rel="shortcut icon" href="{Favicon}">
  18. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  19. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  20.  
  21. <style type="text/css">
  22.  
  23. body {
  24. background-color:#FFFFFF;
  25. background-image:url('http://media.tumblr.com/3119d0672400fa338d6b148ba6bcf65b/tumblr_inline_mpp4v6L7zU1qz4rgp.png');
  26. background-attachment:fixed;
  27. font-family: 'Archivo Narrow', sans-serif;
  28. font-size:12px;
  29. }
  30.  
  31. ::-webkit-scrollbar-thumb:vertical {
  32. background-color:#EDE275
  33. };
  34. height:auto;
  35. }
  36.  
  37. ::-webkit-scrollbar-thumb:horizontal {
  38. background-color:#FFFFFF;
  39. height:10px!important;
  40. }
  41.  
  42. ::-webkit-scrollbar {
  43. height:7px;
  44. width:7px;
  45. background-color:#000000;
  46. }
  47.  
  48. #about {
  49. background-color:#FFFFFF;
  50. border:solid 1px #000000;
  51. width:276px;
  52. height:180px;
  53. margin-top:370px;
  54. margin-left:520px;
  55. position:fixed;
  56. padding:6px;
  57. overflow:auto;
  58. }
  59.  
  60. #stripcont {
  61. position:fixed;
  62. margin-left:520px;
  63. margin-top:140px;
  64. width:300px;
  65. height:60px;
  66. }
  67.  
  68. .strips1 {
  69. margin-bottom:10px;
  70. width:276px;
  71. height:20px;
  72. padding:6px;
  73. background-color:#FFFFFF;
  74. border:solid 1px #000000;
  75. float:left;
  76. text-align:center;
  77. }
  78.  
  79. .strips2 {
  80. margin-bottom:10px;
  81. width:276px;
  82. height:20px;
  83. padding:6px;
  84. background-color:#FFFFFF;
  85. border:solid 1px #000000;
  86. float:left;
  87. text-align:center;
  88. }
  89.  
  90. .strips3 {
  91. margin-bottom:10px;
  92. width:276px;
  93. height:20px;
  94. padding:6px;
  95. background-color:#FFFFFF;
  96. border:solid 1px #000000;
  97. float:left;
  98. text-align:center;
  99. }
  100.  
  101. .strips4 {
  102. margin-bottom:10px;
  103. width:276px;
  104. height:20px;
  105. padding:6px;
  106. background-color:#FFFFFF;
  107. border:solid 1px #000000;
  108. float:left;
  109. text-align:center;
  110. }
  111.  
  112. #boxescont {
  113. position:fixed;
  114. margin-left:400px;
  115. margin-top:165px;
  116. width:100px;
  117. height:400px;
  118. }
  119.  
  120. .boxes {
  121. margin-bottom:20px;
  122. width:100px;
  123. height:100px;
  124. padding:2px;
  125. float:left;
  126. border:solid 1px #000000;
  127. background-color:#FFFFFF;
  128. }
  129.  
  130. #boxesrite {
  131. position:fixed;
  132. margin-left:825px;
  133. margin-top:165px;
  134. width:100px;
  135. height:400px;
  136. }
  137.  
  138. .boxesrites {
  139. margin-bottom:20px;
  140. width:100px;
  141. height:100px;
  142. padding:2px;
  143. float:left;
  144. border:solid 1px #000000;
  145. background-color:#FFFFFF;
  146. }
  147.  
  148. #title {
  149. background-color:transparent;
  150. margin-top:325px;
  151. margin-left:520px;
  152. height:60px;
  153. width:276px;
  154. padding:6px;
  155. text-align:center;
  156. position:fixed;
  157. font-size:17px;
  158. font-family: 'Archivo Narrow', sans-serif;
  159. }
  160.  
  161. #link {
  162. background-color:#FFFFFF;
  163. height:15px;
  164. width:100px;
  165. border:1px solid #000000;
  166. text-align:center;
  167. margin-top:540px;
  168. margin-left:402px;
  169. position:fixed;
  170. padding-top:1px;
  171. }
  172.  
  173. #link a {
  174. text-decoration:none;
  175. color:#000000;
  176. }
  177.  
  178. #linkcont {
  179. width:200px;
  180. height:15px;
  181. position:fixed;
  182. }
  183.  
  184. .linkeva {
  185. width:485px;
  186. height:15px;
  187. padding:6px;
  188. float:left;
  189. background-color:#000000;
  190. color:#FFFFFF;
  191. margin-bottom:5px;
  192. }
  193.  
  194. a {
  195. text-decoration:none;
  196. }
  197.  
  198. /*CREDITS, DO NOT REMOVE!*/
  199. #laughs {
  200. position: fixed;
  201. margin-left:855px;
  202. margin-top:540px;
  203. }
  204.  
  205. /*don't touch ↓this↓ or you'll see hell on 50 levels*/
  206. .popup_block{
  207. display: none;
  208. background: #ffffff;
  209. padding: 20px;
  210. font-family: 'Verdana';
  211. float: left;
  212. font-size: 10px;
  213. position: fixed;
  214. top: 50%; left: 50%;
  215. z-index: 999999999999;
  216. border: 2px solid #333333;
  217. height:155px;
  218. }
  219.  
  220. img.btn_close {
  221. float: right;
  222. margin: -30px -30px 0 0;
  223. }
  224.  
  225. *html .popup_block {
  226. position: absolute;
  227. }
  228. /*don't touch ↑that↑ or you'll see hell on 50 levels*/
  229.  
  230. </style>
  231. <!--Pop up Links script-->
  232. <script type="text/javascript"
  233. src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
  234.  
  235. <script>
  236. $(document).ready(function() {
  237. //
  238. $('a.poplight[href^=#]').click(function() {
  239. var popID = $(this).attr('rel');
  240. var popURL = $(this).attr('href');
  241. var query= popURL.split('?');
  242. var dim= query[1].split('&');
  243. var popWidth = dim[0].split('=')[1];
  244. $('#' + popID).fadeIn().css({ 'width': Number( popWidth ) }).prepend('<a href="#" class="close"><img src="http://static.tumblr.com/iddq6cw/Atplvofrt/tooltip-closebutton.png" class="btn_close" title="click"/></a>');
  245. var popMargTop = ($('#' + popID).height() + 80) / 2;
  246. var popMargLeft = ($('#' + popID).width() + 80) / 2;
  247. $('#' + popID).css({
  248. 'margin-top' : -popMargTop,
  249. 'margin-left' : -popMargLeft
  250. });
  251. $('body').append('<div id="fade"></div>');
  252. $('#fade').css({'filter' : 'alpha(opacity=80)'}).fadeIn();
  253. });
  254. $('a.close, #fade').live('click', function() {
  255. $('#fade , .popup_block').fadeOut(function() {
  256. $('#fade, a.close').remove();
  257. });
  258. return false;
  259. });
  260. });
  261. </script>
  262.  
  263. <link href='http://fonts.googleapis.com/css?family=Vollkorn|Archivo+Narrow' rel='stylesheet' type='text/css'>
  264. </head>
  265. <body>
  266.  
  267. <!--LEFT SIDE IMAGES!!-->
  268. <div id="boxescont">
  269. <img src="http://media.tumblr.com/c5c242e1de5b5971c648d2dccb52244a/tumblr_inline_mt7afqFaLT1s4nxhg.png" class="boxes">
  270. <img src="http://media.tumblr.com/1b247f044771ca11dcc3dd8215f39e35/tumblr_inline_mt7afkMXn41s4nxhg.png" class="boxes">
  271. <img src="http://media.tumblr.com/5f93b4e3c82a0d5d0db0f488b0f0f2a0/tumblr_inline_mt7ag0CjpM1s4nxhg.png" class="boxes">
  272. </div>
  273.  
  274. <!--PUT DESC!!-->
  275. <div id="stripcont">
  276. <div class="strips1"><i>name</i> — Beatrice, ベアトリーチェ </div>
  277. <div class="strips2"><i>age</i> — 1,000+ </div>
  278. <div class="strips3"><i>gender</i> — Female </div>
  279. <div class="strips4"><i>series</i> — Umineko no Naku Koro ni</div>
  280. </div>
  281.  
  282. <!--PUT DESC!!-->
  283. <div id="title">
  284. <u>THE ENDLESS WITCH BEATRICE</u>
  285. </div>
  286.  
  287. <div id="about">
  288. <!--PUT DESC!!-->
  289. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque condimentum fermentum lectus in placerat. Vivamus vitae lobortis massa, at tincidunt nulla. Suspendisse tincidunt lorem id odio sollicitudin, quis vestibulum magna dapibus. Mauris vitae sem et velit blandit feugiat vitae id sem. Aenean at orci vitae libero dignissim fermentum nec nec nibh. Nam volutpat sagittis purus, quis congue diam. Donec volutpat aliquet nulla quis scelerisque.
  290.  
  291. Sed lectus dolor, sagittis vitae convallis quis, varius at elit. Morbi venenatis est dui, non pellentesque quam sodales et. Nunc mattis eget quam a vehicula. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Donec eu orci nisi. Sed egestas eu diam vel porta. Curabitur iaculis, urna non congue ullamcorper, lacus nisl porttitor sapien, a hendrerit erat tortor in turpis. Pellentesque non facilisis metus. Donec adipiscing molestie arcu, ut tincidunt lorem ullamcorper vel. Aenean sed leo a eros placerat blandit id eget diam. Donec quis dictum tellus. Sed semper sapien mollis dui rutrum convallis.
  292.  
  293. Suspendisse vitae ante aliquet, blandit metus eu, cursus lorem. Etiam sit amet nulla nec nulla condimentum feugiat et id elit. Vestibulum vulputate odio et enim semper, a dapibus risus tincidunt. Vivamus et egestas est, at aliquet tortor. Maecenas ornare fermentum tempor. Curabitur congue velit sem, sed posuere leo tincidunt a. Donec adipiscing urna ac tempus tincidunt. Nam pretium accumsan nibh ut fringilla. Sed nec arcu quis est gravida blandit eget in tellus. Interdum et malesuada fames ac ante ipsum primis in faucibus.
  294.  
  295. Nulla vitae tellus in mauris ornare tempor in vitae arcu. Aliquam lacinia scelerisque nunc, a condimentum ante iaculis at. Vivamus at tellus non dolor laoreet aliquam. Quisque massa est, vestibulum vel sem id, consequat placerat nibh. Donec condimentum mattis condimentum. Vestibulum quis odio aliquam, condimentum orci non, pulvinar lorem. Aenean lacinia est eu ligula aliquam auctor. Nunc non velit eleifend, vehicula nunc non, mattis nibh. Donec diam nulla, laoreet a ornare et, suscipit eu lacus. Maecenas placerat tincidunt placerat. Suspendisse mollis vulputate ante, in sagittis urna euismod a. Nulla ut nisi elit.
  296. </div>
  297.  
  298. <!--RIGHT SIDE IMAGES!!-->
  299. <div id="boxesrite">
  300. <img src="http://media.tumblr.com/2d61bec28947ff47b10dc4256e1e4108/tumblr_inline_mt7afwDHtW1s4nxhg.png" class="boxesrites">
  301. <img src="http://media.tumblr.com/1f66a7c77f61e5403c5918a6c04ff6c8/tumblr_inline_mt7aflkYqR1s4nxhg.png" class="boxesrites">
  302. <img src="http://media.tumblr.com/b349e3d9d81162ce60aec31d972c357f/tumblr_inline_mt7afv8O0r1s4nxhg.png" class="boxesrites">
  303. </div>
  304.  
  305. <div id="link">
  306. <a href="#?w=500" rel="02" class="poplight">links</a>
  307. </div>
  308.  
  309. <!--CREDITS → DO NOT REMOVE!-->
  310. <div id="laughs">
  311. <a href="http://himuro.co.vu/" title="© COU/2013"><img src="http://media.tumblr.com/ed9f3003c6fa80406437586dba966c75/tumblr_inline_mt6kkwisZD1r7tmhe.png" width="50px"></a></div>
  312.  
  313. </body>
  314. <!--LINKS!! DESC!!-->
  315. <div id="02" class="popup_block">
  316. <center>
  317. <div id="linkcont">
  318. <a href="/" class="linkeva">home</a>
  319. <a href="/ask" class="linkeva">message</a>
  320. <a href="/" class="linkeva">link 1</a>
  321. <a href="/" class="linkeva">link 2</a>
  322. <a href="/" class="linkeva">link 3</a>
  323. </div>
  324. </center>
  325. </br>
  326. </br>
  327. </br>
  328. </div>
  329.  
  330.  
  331. </div></div></div></div></div></div></div></div></div></div>
  332. <html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement