Advertisement
hor4ny

"Winter Wonderland" - TwistedMiracles

Nov 18th, 2012
689
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 15.84 KB | None | 0 0
  1. <!--
  2. Winter theme 2 by TWISTEDMIRACLES.
  3. Keep credit or put it in your FAQ. Please and thank you.
  4. IF YOU USE THIS THEME AS A BASECODE, ask BEFORE posting! If you use the snowflake decoration, please let me know.
  5. -->
  6.  
  7. <html lang="en">
  8. <!DOCTYPE html PUBLIC"-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  9. <html xmlns="http://www.w3.org/1999/xhtml">
  10. <head>
  11.  
  12.  
  13. <script type="text/javascript"
  14. src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
  15.  
  16.  
  17. <script type="text/javascript">
  18. <!--
  19.  
  20. // Disable Right Click Script
  21.  
  22. function IE(e)
  23. {
  24. if (navigator.appName == "Microsoft Internet Explorer" && (event.button == "2" || event.button == "3"))
  25. {
  26. return false;
  27. }
  28. }
  29. function NS(e)
  30. {
  31. if (document.layers || (document.getElementById && !document.all))
  32. {
  33. if (e.which == "2" || e.which == "3")
  34. {
  35. return false;
  36. }
  37. }
  38. }
  39. document.onmousedown=IE;document.onmouseup=NS;document.oncontextmenu=new Function("return false");
  40.  
  41. //-->
  42. </script>
  43.  
  44.  
  45. <script type="text/javascript"
  46. src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
  47.  
  48. <!-- DEFAULT VARIABLES -->
  49. <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  50. <meta name="color:background" content="#fff"/>
  51. <meta name="color:link" content="#777"/>
  52. <meta name="color:text" content="#777"/>
  53. <meta name="color:title" content="#333"/>
  54. <meta name="color:hover" content="#fff"/>
  55. <meta name="color:scrollbar" content="#bbb" />
  56. <meta name="image:sidebar" content="1"/>
  57. <meta name="image:background" content="1"/>
  58. <meta name="text:link one" content="" />
  59. <meta name="text:link one title" content="" />
  60. <meta name="text:link two" content="" />
  61. <meta name="text:link two title" content="" />
  62. <meta name="text:link three" content="" />
  63. <meta name="text:link three title" content="" />
  64. <meta name="text:link four" content="" />
  65. <meta name="text:link four title" content="" />
  66. <meta name="text:link five" content="" />
  67. <meta name="text:link five title" content="" />
  68.  
  69.  
  70. <style type="text/css">
  71.  
  72. ::-webkit-scrollbar {width: 4px; height: 4px; border-left:1px solid #ddd; background-color:#fff;}
  73. ::-webkit-scrollbar-thumb {background: {color:scrollbar};}
  74.  
  75.  
  76. iframe#tumblr_controls {;right:2px !important; position: fixed !important;-webkit-transition: opacity 0.7s linear;opacity: 0.8;-webkit-transition: all 0.8s ease-out;-moz-
  77.  
  78. transition: all 0.8s ease-out;transition: all 0.8s ease-out;}
  79.  
  80. iframe#tumblr_controls:hover{-webkit-transition: opacity 0.7s linear;opacity:1;-webkit-transition: all 0.4s ease-out;-moz-transition: all 0.4s ease-out;transition: all
  81.  
  82. 0.4s ease-out;}
  83. p {
  84. margin:0px;
  85. margin-top:0px;
  86. }
  87.  
  88.  
  89. ::selection {
  90. background: #ffffff;
  91. color: #fff;
  92. }
  93.  
  94. ::-moz-selection {
  95. background: #ffffff;
  96. color: #ffffff;
  97. }
  98.  
  99. askname{
  100. font-family:jenna;
  101. font-size:13px;
  102. z-index:99;
  103. }
  104.  
  105. body {
  106. padding: 0px;
  107. margin: 0px;
  108. color:{color:text};
  109. font-family: dixel;
  110. line-height:7px;
  111. font-size:8px;
  112. background-color: {color:Background};
  113. background-image:url({image:Background});
  114. background-attachment: fixed;
  115. background-repeat: repeat;
  116. cursor: url(http://i.imgur.com/2qleX.jpg), auto;
  117. }
  118.  
  119.  
  120. a:link, a:active, a:visited{
  121. text-decoration: none;
  122. -webkit-transition: color 0.3s ease-out;
  123. -moz-transition: color 0.3s ease-out;
  124. transition: color 0.3s ease-out;
  125. color:{color:link};
  126. cursor: url(http://i.imgur.com/2qleX.jpg), auto;
  127. }
  128.  
  129. a:hover {
  130. text-decoration: none;
  131. font-style:;
  132. text-shadow:0px 0px 2px #000;
  133. color: {color:Hover};
  134. cursor: url(http://cur.cursors-4u.net/others/oth-6/oth589.cur), auto;
  135. }
  136.  
  137. div#center{
  138. margin:auto;
  139. position:relative;
  140. width:1000px;
  141. background-color:;
  142. overflow:auto;
  143. overflow-y:hidden;
  144. }
  145.  
  146. .entry {
  147. float:left;
  148. display: block;
  149. margin:4px;
  150. line-height:7px;
  151. padding:6px;
  152. border:1px solid #ccc;
  153. overflow:hidden;
  154. width:205px;
  155. opacity:0.9;
  156. z-index:9;
  157. border-radius:6px;
  158. {block:PermalinkPage}
  159. width:428px;
  160. text-align:left;
  161. line-height:10px;
  162. {/block:PermalinkPage}
  163. background:#fefefe;
  164. transition: all 0.5s ease-out;
  165. -o-transition-transition: all 0.5s ease-out;
  166. -webkit-transition: all 0.5s ease-out;
  167. -moz-transition: all 0.5s ease-out;
  168. }
  169.  
  170. .entry:hover{
  171. opacity:1;
  172. }
  173.  
  174. .entry .perma a{
  175. color:#444;}
  176.  
  177. .entry .perma a:hover {
  178. text-decoration: none;
  179. font-style:;
  180. text-shadow:0px 0px 2px #000;
  181. color: {color:Hover};
  182. }
  183.  
  184. .entry .perma{
  185. width:38px;
  186. height:30px;
  187. position: absolute;
  188. line-height: 33px;
  189. overflow:hidden;
  190. font-family:dixel;
  191. text-align:left;
  192. padding-left:4px;
  193. font-size:8px;
  194. left:-50px;
  195. bottom:5px;
  196. border-right:1px solid #f2f2f2;
  197. border-top:1px solid #f2f2f2;
  198. background:white;
  199. letter-spacing: 0px;
  200. opacity: 0.0;
  201. -webkit-transition: all .7s ease;
  202. -moz-transition: all .7s ease;
  203. -o-transition: all .7s ease;
  204. transition: all .7s ease;
  205. border-top-right-radius:90px;
  206. -moz-border-top-right-radius:90px;
  207. -webkit-border-top-right-radius:90px;
  208.  
  209. }
  210.  
  211. .entry:hover .perma{
  212. margin-left: 0px;
  213. left:5px;
  214. overflow:visible;
  215. opacity:0.85;
  216. }
  217.  
  218. .entry .perma2 a{
  219. color:#444;}
  220.  
  221. .entry .perma2 a:hover {
  222. text-decoration: none;
  223. font-style:;
  224. text-shadow:0px 0px 2px #000;
  225. color: {color:Hover};
  226. }
  227.  
  228. .entry .perma2{
  229. width:auto;
  230. height:30px;
  231. position: absolute;
  232. line-height: 28px;
  233. overflow:hidden;
  234. font-family:dixel;
  235. text-align:center;
  236. padding-left:20px;
  237. padding-right:10px;
  238. font-size:8px;
  239. right:-50px;
  240. top:5px;
  241. border-left:1px solid #f2f2f2;
  242. border-bottom:1px solid #f2f2f2;
  243. background:white;
  244. letter-spacing: 0px;
  245. opacity: 0.0;
  246. -webkit-transition: all .7s ease;
  247. -moz-transition: all .7s ease;
  248. -o-transition: all .7s ease;
  249. transition: all .7s ease;
  250. border-bottom-left-radius:90px;
  251. -moz-border-bottom-left-radius:90px;
  252. -webkit-border-bottom-left-radius:90px;}
  253.  
  254. .entry:hover .perma2{
  255. margin-left: 0px;
  256. right:5px;
  257. overflow:visible;
  258. opacity:0.85;
  259. -webkit-transition: all .7s ease;
  260. -moz-transition: all .7s ease;
  261. -o-transition: all .7s ease;
  262. transition: all .7s ease;
  263. }
  264. #posts {
  265. width:500px;
  266. margin-top:1px;
  267. z-index:99;
  268. margin-left:395px;
  269. right:auto;
  270. background:transparent;
  271. margin-right:auto;
  272. position:relative;
  273. overflow-y: hidden;
  274. }
  275.  
  276. #flake{
  277. position:fixed;
  278. margin-left:-10px;
  279. margin-top:0px;
  280. }
  281.  
  282.  
  283. .desc{
  284. opacity:0;
  285. height:80px;
  286. background:white;
  287. line-height:12px;
  288. width:160px;
  289. padding-top:40px;z-index:1;
  290. position:fixed;
  291. padding-bottom:40px;
  292. border-radius:9999999px;
  293. margin-top:0px;
  294. transition: all 0.7s ease-out;
  295. -o-transition-transition: all 0.7s ease-out;
  296. -webkit-transition: all 0.7s ease-out;
  297. -moz-transition: all 0.7s ease-out;
  298. }
  299.  
  300. #sidebar:hover .desc{
  301. opacity:0.8;
  302. }
  303. #sidebar{
  304. position:fixed !important;
  305. width:160px;
  306. background-image:url('');
  307. background:#fefefe;
  308. height:160px;
  309. padding:5px;
  310.  
  311. margin-top:287px;
  312. margin-left:55px;
  313. text-align:center;
  314. line-height:8px;
  315. z-index:999;
  316. opacity:1;
  317. border-radius:9999999px;
  318. border:1px solid #ccc;
  319. transition: all 0.7s ease-out;
  320. -o-transition-transition: all 0.7s ease-out;
  321. -webkit-transition: all 0.7s ease-out;
  322. -moz-transition: all 0.7s ease-out;
  323. }
  324.  
  325.  
  326. #sidebar:hover{
  327. opacity:1;
  328.  
  329. }
  330.  
  331. #sidebarpic{
  332. border-radius:9999999px;
  333. width:160px;
  334. transition: all 0.7s ease-out;
  335. -o-transition-transition: all 0.7s ease-out;
  336. -webkit-transition: all 0.7s ease-out;
  337. -moz-transition: all 0.7s ease-out;
  338. }
  339.  
  340. #sidebarpic img{
  341. width:160px;
  342. height:160px;
  343. border-radius:9999999px;
  344. }
  345.  
  346. #sidebar:hover #sidebarpic{
  347.  
  348. }
  349.  
  350. #links{
  351. opacity:1;
  352. z-index:1;
  353. position:fixed;
  354. width:90px;
  355. height:80px;
  356. padding-top:5px;
  357. padding-bottom:5px;
  358. text-align:center;
  359. background:#fefefe;
  360. border-radius:9999999px;
  361. margin-left:250px;
  362. margin-top:120px;
  363. line-height:16px;
  364. border:1px solid #ccc;
  365. }
  366.  
  367.  
  368. @font-face {
  369. font-family: "jenna";
  370. src: url('http://static.tumblr.com/jdjsstr/W6qm7fotz/simpleronde-regular_1_.ttf');
  371. }
  372. .title{
  373. font-family:swenson;
  374. font-size: 20px;
  375. line-height: 20px;
  376. color:{color:Title};
  377. letter-spacing: 0px;
  378. font-weight: normal;
  379. padding:0px 0px 0px 0px;
  380. }
  381.  
  382.  
  383. @font-face { font-family: "dixel"; src: url('http://static.tumblr.com/jdjsstr/8ovm78cbb/pf_arma_five_1_.ttf'); }
  384.  
  385.  
  386.  
  387. #blogtitle{
  388. position:fixed;
  389. width:370px;
  390. text-align:center;
  391. font-size:55px;
  392. line-height:55px;
  393. font-family:swenson;
  394. margin-top:280px;
  395. margin-left:700px;
  396. color:#fff;
  397. text-shadow:2px 2px 2px #b8b8b8;
  398. -moz-transform: rotate(90deg); /* FF3.5+ */
  399. -o-transform: rotate(90deg); /* Opera 10.5 */
  400. -webkit-transform: rotate(90deg);
  401. }
  402.  
  403.  
  404. @font-face { font-family: "lovenote"; src: url('http://static.tumblr.com/4yxykdm/k6plrfhwf/ck_love_note.ttf'); }
  405.  
  406.  
  407.  
  408. .permalink{
  409. text-transform: normal;
  410. display: block;
  411. text-align: right;
  412. text-decoration: none;
  413. }
  414.  
  415. #infscr-loading{
  416. bottom: -70px;
  417. position: absolute;
  418. left: 50%;
  419. margin-left:-8px;
  420. width:16px;
  421. height:11px;
  422. overflow:hidden;
  423. margin-bottom: 50px;
  424. }
  425.  
  426. #postnotes{
  427. text-align: justify;}
  428.  
  429. #postnotes blockquote{
  430. border: 0px;}
  431.  
  432. blockquote{
  433. padding:0px 0px 2px 5px;
  434. margin:0px 0px 2px 10px;
  435. border-left: 1px dotted #555555;
  436. }
  437.  
  438. blockquote p, ul{
  439. margin:0px;
  440. padding:0px;
  441. }
  442.  
  443. a img{border: 0px;}
  444.  
  445.  
  446. ul, ol, li{list-style:none; margin:0px; padding:0px;}
  447.  
  448. .user_1 .label, .user_2 .label, .user_3 .label, .user_4 .label, .user_5 .label, .user_6 .label,
  449. .user_7 .label, .user_8 .label, .user_9 .label {color:{color:text};}
  450.  
  451. .notes img{width:10px; position:relative; top:3px;}
  452. <--ses-->
  453. small{font-size: 90%;}
  454.  
  455. {CustomCSS}
  456.  
  457. </style>
  458.  
  459. {block:IndexPage}
  460. <script type="text/javascript" src="http://static.tumblr.com/dbek3sy/iBElrgjim/jquerymasonry.js"></script>
  461. <script type="text/javascript" src="http://static.tumblr.com/dbek3sy/Qyblrgjfn/jqueryinfintescroll.js"></script>
  462.  
  463. <script type="text/javascript">
  464. $(window).load(function(){
  465. var $wall = $('#posts');
  466. $wall.imagesLoaded(function(){
  467. $wall.masonry({
  468. itemSelector: '.entry, .entry_photo',
  469. isAnimated : false
  470. });
  471. });
  472.  
  473. $wall.infinitescroll({
  474. navSelector : '#pagination',
  475. nextSelector : '#pagination a',
  476. itemSelector : '.entry, .entry_photo',
  477. bufferPx : 2000,
  478. debug : false,
  479. errorCallback: function() {
  480. $('#infscr-loading').fadeOut('normal');
  481. }},
  482. function( newElements ) {
  483. var $newElems = $( newElements );
  484. $newElems.hide();
  485. $newElems.imagesLoaded(function(){
  486. $wall.masonry( 'appended', $newElems,{isAnimated: false}, function(){$newElems.fadeIn('slow');} );
  487. });
  488. }); $('#posts').show(500);
  489. });
  490. </script>
  491.  
  492.  
  493. {/block:IndexPage}
  494.  
  495.  
  496. <title>{title}</title>
  497.  
  498. <link rel="shortcut icon" href="{Favicon}" />
  499. <meta name="viewport" content="width=820" />
  500. </head>
  501.  
  502. <body>
  503. <BODY onselectstart="return false;" ondragstart="return false;">
  504. <div class="wrapper">
  505. <div class="header">
  506. </div>
  507.  
  508. <div id="cage">
  509. <div id="center">
  510. <div id="blogtitle">{title}</div>
  511. <div id="flake"><img src="http://25.media.tumblr.com/tumblr_mdpm4itaM11qmdhtlo1_r2_400.png"></div>
  512.  
  513. <div id="links"><a href="{text:link one}">{text:link one title}</a><br /><a href="{text:link two}">{text:link two title}</a><br /><a href="{text:link three}">{text:link three title}</a>{block:iflinkfourtitle}<br /><a href="{text:link four}">{text:link four title}</a>{/block:iflinkfourtitle}{block:iflinkfivetitle}<br /><a href="{text:link five}">{text:link five title}</a>{/block:iflinkfivetitle}</div>
  514. <div id="sidebar">
  515. <center><div class="desc">{description}</div>
  516. <div id="sidebarpic"><a href="/"><img src="{image:sidebar}"></a></div>
  517. </div>
  518. </center>
  519.  
  520.  
  521. <div class="left">
  522. <div id="posts">
  523. {block:Posts}
  524. <div class="entry">
  525.  
  526. {block:Answer}
  527. <div style="margin-top:2px; margin-bottom:0px; overflow:auto;height:40px; padding: 4px; background-color:#fff; border:1px solid #ddd;border-radius:4px;">
  528. <img src="{AskerPortraitURL-40}" width="40" align="left" style="margin-right:3.5px;"/><askname>{asker}</askname>: {Question}</div>
  529. <div style="margin-top:2px; margin-bottom:4px; background: transparent;">{Answer}</div>
  530. <div class="permalink"> <a href="{permalink}">{notecountwithlabel}</a> </div>
  531. {/block:Answer}
  532.  
  533. {block:Text}{block:Title}<span class="title">{Title}</span>{/block:Title}<span class="body">{Body}</span><p align=right><span class="permalink"><a
  534.  
  535. href="{Permalink}"><a href="{Permalink}"><a href="{Permalink}">{notecountwithlabel}</a></a><br>{/block:HasTags}</span></align>
  536. {/block:Text}
  537.  
  538. {block:Link}<a href="{URL}" class="title">{Name}</a>{block:Description}<div class="body">{Description}</div>{/block:Description} <p align=right><span
  539.  
  540. class="permalink"><a href="{Permalink}">{notecountwithlabel}</a> <a href="{Permalink}"></span></align>{block:Link}
  541.  
  542. {block:Photo}
  543. {block:IndexPage}
  544. <center>
  545. <div class="perma2">
  546. <a href="{Permalink}"> {notecount}</a> </div>
  547. <div class="perma">
  548. <a href="{ReblogURL}" target="_blank"> reblog </a> </div>
  549. <div class="photo"><a href="{permalink}"><img class="photo" src="{PhotoURL-HighRes}" alt="{PhotoAlt}" width="100%"/></a></div>
  550. {/block:IndexPage}
  551. {block:PermalinkPage}
  552. {LinkOpenTag}<div class="photo"><a href="{permalink}"><img class="photo" src="{PhotoURL-HighRes}" alt="{PhotoAlt}" width="100%"/></a></div>
  553.  
  554. {LinkCloseTag}
  555. {/block:PermalinkPage}
  556. {/block:Photo}
  557.  
  558. {block:Photoset}
  559. {block:IndexPage}
  560. <center>
  561. <div class="perma2">
  562. <a href="{Permalink}"> {notecount}</a> </div>
  563. <div class="perma">
  564. <a href="{ReblogURL}" target="_blank"> reblog </a> </div>
  565. {Photoset-250}</center>
  566. {/block:IndexPage}
  567. {block:PermalinkPage}
  568. <center>
  569. {Photoset-500}</center>
  570. {/block:PermalinkPage}
  571. {/block:Photoset}
  572.  
  573. {block:Quote}<span class="title">"{Quote}"</span> — {block:Source}<b>{Source}</b>{/block:Source}<br><p align=right><span class="permalink"><a
  574.  
  575. href="{Permalink}">{notecountwithlabel}</a> <a href="{Permalink}"> </span>{/block:Quote}
  576.  
  577. {block:Chat}{block:Title}<span class="title">{Title}</span>{/block:Title}
  578. <ul class="chat">
  579. {block:Lines}
  580. <li class="user_{UserNumber}">
  581. {block:Label}
  582. <span class="label">{Label}</span>
  583. {/block:Label}
  584.  
  585. {Line}
  586. </li>
  587. {/block:Lines}
  588. <p align=right><span class="permalink"><a href="{Permalink}">{notecountwithlabel}</a> <a href="{Permalink}">
  589. {/block:Chat}
  590.  
  591. {block:Audio}
  592. <div style="width:200px; height:30px;">
  593. {AudioPlayerBlack}
  594. </div>
  595. {block:IndexPage}<span class="permalink">
  596. <p align=right><span class="permalink"><a href="{Permalink}">{notecountwithlabel}</a> <a href="{Permalink}"> </a>
  597. </span>{/block:IndexPage}
  598. {/block:Audio}
  599.  
  600. {block:Video}
  601. {block:IndexPage}
  602. <center>
  603. <div class="perma2">
  604. <a href="{Permalink}"> {notecount}</a> </div>
  605. <div class="perma">
  606. <a href="{ReblogURL}" target="_blank"> reblog </a> </div>
  607. {Video-250}</center>
  608. {/block:IndexPage}
  609. {block:PermalinkPage}
  610. <center>
  611. {Video-400}</center>
  612. {/block:PermalinkPage}
  613. {block:Video}
  614.  
  615.  
  616. {block:PostNotes}<div align="middle">{caption}</div>
  617. <center>
  618.  
  619. {block:NoteCount}{NoteCountWithLabel}<br>{/block:NoteCount}
  620.  
  621. {block:HasTags}
  622. tags: {block:Tags}<a href="{TagURL}">{Tag}. </a>{/block:Tags}<br> {/block:HasTags}
  623. {block:RebloggedFrom}
  624. reblogged from <a href="{ReblogParentURL}">{ReblogParentName}</a><br>
  625. posted by <a href="{ReblogRootURL}">{ReblogRootName}</a>
  626.  
  627. {/block:RebloggedFrom}
  628. </center></span>
  629. <br>
  630. <div id="postnotes">{PostNotes}</div><br>
  631.  
  632. <center>{block:ContentSource}
  633. <br><a href="{SourceURL}">
  634. {lang:Source}:
  635. {block:SourceLogo}
  636. <img src="{BlackLogoURL}" width="{LogoWidth}"
  637. height="{LogoHeight}" alt="{SourceTitle}" />
  638. {/block:SourceLogo}
  639. {block:NoSourceLogo}
  640. {SourceLink}
  641. {/block:NoSourceLogo}
  642. </a>
  643. {/block:ContentSource}</center>
  644.  
  645. {/block:PostNotes}
  646. </div>
  647. {/block:Posts}
  648. </div></div>
  649.  
  650. {block:IndexPage}
  651. {block:Pagination}
  652. <div id="pagination">
  653. {block:NextPage}
  654. <a id="nextPage" href="{NextPage}"></a>
  655. {/block:NextPage}
  656. {block:PreviousPage}
  657. <a href="{PreviousPage}"></a>
  658. {/block:PreviousPage}
  659. </div>
  660. {/block:Pagination}
  661. {/block:IndexPage}
  662. </body>
  663. <div style="position:fixed;right:5px;bottom:5px;"><a href="http://twistedmiracles.tumblr.com">theme</a></div>
  664.  
  665. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement