API tools faq
paste
os2d

holding out for a hero

os2d
Feb 22nd, 2020
1,325
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 24.67 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2. <head>
  3.  
  4. <!-----
  5. _____ _
  6. / __ \ | |
  7. ___ ___ `' / /' __| |
  8. / _ \/ __| / / / _` |
  9. | (_) \__ \./ /__| (_| |
  10. \___/|___/\_____/\__,_|
  11.  
  12. dont use as a base code no removing credit you get the gist. go crazy dude
  13.  
  14. base code by animecharacter.tumblr.com
  15. ----->
  16.  
  17. <meta charset="utf-8">
  18. <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  19. {block:Description}
  20. <meta name="description" content="{MetaDescription}" />
  21. {/block:Description}
  22.  
  23. <title>{Title}</title>
  24. <link rel="shortcut icon" href="{image:favicon}">
  25.  
  26.  
  27. {block:ifsparkles}<script type="text/javascript">
  28. // <![CDATA[
  29. var colour="{color:sparkles}"; // in addition to "random" can be set to any valid colour eg "#f0f" or "red"
  30. var sparkles=50;
  31.  
  32. /****************************
  33. * Tinkerbell Magic Sparkle *
  34. *(c)2005-13 mf2fm web-design*
  35. * http://www.mf2fm.com/rv *
  36. * DON'T EDIT BELOW THIS BOX *
  37. ****************************/
  38. var x=ox=400;
  39. var y=oy=300;
  40. var swide=800;
  41. var shigh=600;
  42. var sleft=sdown=0;
  43. var tiny=new Array();
  44. var star=new Array();
  45. var starv=new Array();
  46. var starx=new Array();
  47. var stary=new Array();
  48. var tinyx=new Array();
  49. var tinyy=new Array();
  50. var tinyv=new Array();
  51.  
  52. window.onload=function() { if (document.getElementById) {
  53. var i, rats, rlef, rdow;
  54. for (var i=0; i<sparkles; i++) {
  55. var rats=createDiv(3, 3);
  56. rats.style.visibility="hidden";
  57. rats.style.zIndex="999";
  58. document.body.appendChild(tiny[i]=rats);
  59. starv[i]=0;
  60. tinyv[i]=0;
  61. var rats=createDiv(5, 5);
  62. rats.style.backgroundColor="transparent";
  63. rats.style.visibility="hidden";
  64. rats.style.zIndex="999";
  65. var rlef=createDiv(1, 5);
  66. var rdow=createDiv(5, 1);
  67. rats.appendChild(rlef);
  68. rats.appendChild(rdow);
  69. rlef.style.top="2px";
  70. rlef.style.left="0px";
  71. rdow.style.top="0px";
  72. rdow.style.left="2px";
  73. document.body.appendChild(star[i]=rats);
  74. }
  75. set_width();
  76. sparkle();
  77. }}
  78.  
  79. function sparkle() {
  80. var c;
  81. if (Math.abs(x-ox)>1 || Math.abs(y-oy)>1) {
  82. ox=x;
  83. oy=y;
  84. for (c=0; c<sparkles; c++) if (!starv[c]) {
  85. star[c].style.left=(starx[c]=x)+"px";
  86. star[c].style.top=(stary[c]=y+1)+"px";
  87. star[c].style.clip="rect(0px, 5px, 5px, 0px)";
  88. star[c].childNodes[0].style.backgroundColor=star[c].childNodes[1].style.backgroundColor=(colour=="random")?newColour():colour;
  89. star[c].style.visibility="visible";
  90. starv[c]=50;
  91. break;
  92. }
  93. }
  94. for (c=0; c<sparkles; c++) {
  95. if (starv[c]) update_star(c);
  96. if (tinyv[c]) update_tiny(c);
  97. }
  98. setTimeout("sparkle()", 40);
  99. }
  100.  
  101. function update_star(i) {
  102. if (--starv[i]==25) star[i].style.clip="rect(1px, 4px, 4px, 1px)";
  103. if (starv[i]) {
  104. stary[i]+=1+Math.random()*3;
  105. starx[i]+=(i%5-2)/5;
  106. if (stary[i]<shigh+sdown) {
  107. star[i].style.top=stary[i]+"px";
  108. star[i].style.left=starx[i]+"px";
  109. }
  110. else {
  111. star[i].style.visibility="hidden";
  112. starv[i]=0;
  113. return;
  114. }
  115. }
  116. else {
  117. tinyv[i]=50;
  118. tiny[i].style.top=(tinyy[i]=stary[i])+"px";
  119. tiny[i].style.left=(tinyx[i]=starx[i])+"px";
  120. tiny[i].style.width="2px";
  121. tiny[i].style.height="2px";
  122. tiny[i].style.backgroundColor=star[i].childNodes[0].style.backgroundColor;
  123. star[i].style.visibility="hidden";
  124. tiny[i].style.visibility="visible"
  125. }
  126. }
  127.  
  128. function update_tiny(i) {
  129. if (--tinyv[i]==25) {
  130. tiny[i].style.width="1px";
  131. tiny[i].style.height="1px";
  132. }
  133. if (tinyv[i]) {
  134. tinyy[i]+=1+Math.random()*3;
  135. tinyx[i]+=(i%5-2)/5;
  136. if (tinyy[i]<shigh+sdown) {
  137. tiny[i].style.top=tinyy[i]+"px";
  138. tiny[i].style.left=tinyx[i]+"px";
  139. }
  140. else {
  141. tiny[i].style.visibility="hidden";
  142. tinyv[i]=0;
  143. return;
  144. }
  145. }
  146. else tiny[i].style.visibility="hidden";
  147. }
  148.  
  149. document.onmousemove=mouse;
  150. function mouse(e) {
  151. if (e) {
  152. y=e.pageY;
  153. x=e.pageX;
  154. }
  155. else {
  156. set_scroll();
  157. y=event.y+sdown;
  158. x=event.x+sleft;
  159. }
  160. }
  161.  
  162. window.onscroll=set_scroll;
  163. function set_scroll() {
  164. if (typeof(self.pageYOffset)=='number') {
  165. sdown=self.pageYOffset;
  166. sleft=self.pageXOffset;
  167. }
  168. else if (document.body && (document.body.scrollTop || document.body.scrollLeft)) {
  169. sdown=document.body.scrollTop;
  170. sleft=document.body.scrollLeft;
  171. }
  172. else if (document.documentElement && (document.documentElement.scrollTop || document.documentElement.scrollLeft)) {
  173. sleft=document.documentElement.scrollLeft;
  174. sdown=document.documentElement.scrollTop;
  175. }
  176. else {
  177. sdown=0;
  178. sleft=0;
  179. }
  180. }
  181.  
  182. window.onresize=set_width;
  183. function set_width() {
  184. var sw_min=999999;
  185. var sh_min=999999;
  186. if (document.documentElement && document.documentElement.clientWidth) {
  187. if (document.documentElement.clientWidth>0) sw_min=document.documentElement.clientWidth;
  188. if (document.documentElement.clientHeight>0) sh_min=document.documentElement.clientHeight;
  189. }
  190. if (typeof(self.innerWidth)=='number' && self.innerWidth) {
  191. if (self.innerWidth>0 && self.innerWidth<sw_min) sw_min=self.innerWidth;
  192. if (self.innerHeight>0 && self.innerHeight<sh_min) sh_min=self.innerHeight;
  193. }
  194. if (document.body.clientWidth) {
  195. if (document.body.clientWidth>0 && document.body.clientWidth<sw_min) sw_min=document.body.clientWidth;
  196. if (document.body.clientHeight>0 && document.body.clientHeight<sh_min) sh_min=document.body.clientHeight;
  197. }
  198. if (sw_min==999999 || sh_min==999999) {
  199. sw_min=800;
  200. sh_min=600;
  201. }
  202. swide=sw_min;
  203. shigh=sh_min;
  204. }
  205.  
  206. function createDiv(height, width) {
  207. var div=document.createElement("div");
  208. div.style.position="absolute";
  209. div.style.height=height+"px";
  210. div.style.width=width+"px";
  211. div.style.overflow="hidden";
  212. return (div);
  213. }
  214.  
  215. function newColour() {
  216. var c=new Array();
  217. c[0]=255;
  218. c[1]=Math.floor(Math.random()*256);
  219. c[2]=Math.floor(Math.random()*(256-c[1]/2));
  220. c.sort(function(){return (0.5 - Math.random());});
  221. return ("rgb("+c[0]+", "+c[1]+", "+c[2]+")");
  222. }
  223. // ]]>
  224. </script>{/block:ifsparkles}
  225.  
  226. <link rel="shortcut icon" href="{Favicon}">
  227. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  228. <link rel="stylesheet" href="https://static.tumblr.com/qxrkgx6/RWPmgn2qa/normalize.min.css">
  229.  
  230. <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
  231.  
  232. <script src="https://static.tumblr.com/qxrkgx6/LuRmgn2rm/modernizr-2.6.2.min.js"></script>
  233. <link href="https://fonts.googleapis.com/css?family=Nanum+Gothic+Coding|Short+Stack&display=swap" rel="stylesheet">
  234.  
  235.  
  236. <meta name="image:favicon" content="">
  237. <meta name="image:icon" content="">
  238. <meta name="image:permalink" content="">
  239. <meta name="image:bg" content="">
  240. <meta name="image:post bg" content="">
  241. <meta name="image:permalink bg" content="">
  242. <meta name="image:container bg" content="">
  243. <meta name="image:words at bottom bg" content="">
  244. <meta name="image:ask bg" content="">
  245.  
  246. <meta name="color:text" content="black">
  247. <meta name="color:links" content="blue">
  248. <meta name="color:link hover" content="red">
  249. <meta name="color:bg" content="white">
  250. <meta name="color:post bg" content="white">
  251. <meta name="color:container bg" content="white">
  252. <meta name="color:popup bg" content="white">
  253. <meta name="color:words at bottom bg" content="white">
  254. <meta name="color:border" content="black">
  255. <meta name="color:tooltip" content="white">
  256. <meta name="color:tooltip text" content="black">
  257. <meta name="color:sparkles" content="black">
  258. <meta name="color:link border" content="black">
  259. <meta name="color:permalink bg" content="white">
  260. <meta name="color:icon glow" content="red">
  261. <meta name="color:container glow" content="blue">
  262. <meta name="color:text glow" content="black">
  263.  
  264. <meta name="select:font" content="arial">
  265. <meta name="select:font" content="ms pgothic">
  266. <meta name="select:font" content="times">
  267. <meta name="select:font" content="short stack">
  268. <meta name="select:font" content="bellota">
  269. <meta name="select:font" content="Liu Jian Mao Cao">
  270. <meta name="select:font" content="Playfair Display">
  271. <meta name="select:font" content="Pacifico">
  272. <meta name="select:font" content="Rajdhani">
  273. <meta name="select:font" content="Bebas Neue">
  274. <meta name="select:font" content="Advent Pro">
  275. <meta name="select:font" content="Orbitron">
  276.  
  277. <meta name="select:border" content="none">
  278. <meta name="select:border" content="solid">
  279. <meta name="select:border" content="double">
  280. <meta name="select:border" content="dashed">
  281. <meta name="select:border" content="ridge">
  282. <meta name="select:border" content="dotted">
  283. <meta name="select:border" content="outset">
  284.  
  285. <meta name="text:font size" content="18">
  286. <meta name="text:link divider" content="x">
  287. <meta name="text:words at bottom font size" content="25">
  288. <meta name="text:border width" content="2">
  289. <meta name="text:words at tha bottom" content="bee bee boop make sure this text is kinda long so the fun scrolly things can happen">
  290. <meta name="text:redirect" content="no slash needed">
  291. <meta name="text:next text" content=">">
  292. <meta name="text:back text" content="<">
  293. <meta name="text:link 1" content="info">
  294. <meta name="text:link 1 url" content="/">
  295. <meta name="text:link 2" content="mail">
  296. <meta name="text:link 2 url" content="/ask">
  297.  
  298. <meta name="if:round" content="1">
  299. <meta name="if:sparkles" content="0">
  300. <meta name="if:bg cover" content="0">
  301. <meta name="if:redirect" content="0">
  302. <meta name="if:captions" content="1">
  303. <meta name="if:icon glow" content="1">
  304. <meta name="if:container glow" content="1">
  305. <meta name="if:link border" content="1">
  306. <meta name="if:drop shadow" content="1">
  307. <meta name="if:text glow" content="1">
  308. <meta name="if:rainbow links" content="0">
  309. <meta name="if:pastel rainbow links" content="0">
  310. <meta name="if:link drop shadow" content="0">
  311. <meta name="if:image blur" content="0">
  312.  
  313. <script src="https://static.tumblr.com/rtrqcib/VGGnlh8rf/jquery.style-my-tooltips.min.js"></script><script>(function($){$(document).ready(function(){$("a[title]").style_my_tooltips({tip_follows_cursor:true,tip_delay_time:0,tip_fade_speed:0,attribute:"title"});});})(jQuery);</script>
  314.  
  315. <link href="https://fonts.googleapis.com/css?family=Advent+Pro|Bebas+Neue|Bellota|Liu+Jian+Mao+Cao|Orbitron|Pacifico|Playfair+Display|Rajdhani&display=swap" rel="stylesheet">
  316.  
  317.  
  318.  
  319. <style type="text/css">
  320.  
  321.  
  322. /*
  323. general text styles, fonts and colours
  324. */
  325.  
  326. body {
  327. margin:0px;
  328. {block:iftextglow}
  329. text-shadow: 0px 0px 3px {color:text glow};
  330. {/block:iftextglow}
  331. background:{color:bg};
  332. background-image:url('{image:bg}');
  333. background-attachment:fixed;
  334. background-repeat:repeat;
  335. background-size:{block:ifbgcover}cover{/block:ifbgcover};
  336. font-family:{select:font};
  337. font-size:{text:font size}px;
  338. color:{color:text};
  339. }
  340.  
  341. p{
  342. margin:0 0 10px 0;
  343. padding:0;
  344. }
  345.  
  346. pre {
  347. white-space: pre-wrap;
  348. white-space: -moz-pre-wrap;
  349. white-space: -pre-wrap;
  350. white-space: -o-pre-wrap;
  351. word-wrap: break-word;
  352. }
  353.  
  354. a{
  355. -webkit-transition-duration: .2s;
  356. -moz-transition-duration: .2s;
  357. -o-transition-duration: .2s;
  358. color:{color:links};
  359. text-decoration: none;
  360. transition: .2s ease;
  361. {block:iflinkborder}
  362. text-shadow: -1px 0 {color:link border}, 0 1px {color:link border}, 1px 0 {color:link border}, 0 -1px {color:link border};
  363. {/block:iflinkborder}
  364. }
  365.  
  366. a:hover{
  367. transition: .2s ease;
  368. color:{color:link hover};
  369. {block:ifrainbowlinks}
  370. -webkit-animation:rainbow 1s infinite;
  371. -ms-animation:rainbow 1s infinite;
  372. -o-animation:rainbow 1s infinite;
  373. animation:rainbow 1s infinite;
  374. {/block:ifrainbowlinks}
  375. {block:ifpastelrainbowlinks}
  376. -webkit-animation:pastelrainbow 1s infinite;
  377. -ms-animation:pastelrainbow 1s infinite;
  378. -o-animation:pastelrainbow 1s infinite;
  379. animation:pastelrainbow 1s infinite;
  380. {/block:ifpastelrainbowlinks}
  381. {block:iflinkdropshadow}
  382. text-shadow: 0 1px 1px {color:link border}, 0 1px 1px {color:link border}, 0 1px 0px {color:link border}, 0px 1px 0px {color:link border}, 0px 2px 0px {color:link border}, 0px 3px 0px {color:link border},0px 4px 0px {color:link border};
  383. {/block:iflinkdropshadow}
  384. transition: .2s ease;
  385. }
  386.  
  387. li{
  388. margin-left:-15px;
  389. }
  390.  
  391. /*
  392. containers etc
  393. */
  394.  
  395.  
  396.  
  397. #wrapper{
  398. width:600px;
  399. margin:50px auto;
  400. }
  401.  
  402. #sidebar{
  403. width:200px;
  404. height:200px;
  405. margin:20px auto;
  406. z-index:100;
  407. position:relative;
  408. {block:ificonglow}
  409. box-shadow: 0px 0px 20px 10px {color:icon drop shadow};
  410. {/block:ificonglow}
  411. {block:ifdropshadow}
  412. box-shadow:5px 15px 3px rgba(0, 0, 0, 0.5);
  413. {/block:ifdropshadow}
  414.  
  415. }
  416.  
  417. #sidebar img{
  418. width:200px;
  419. height:200px;
  420. border: {text:border width}px {select:border} {color:border};
  421. {block:ifround}
  422. border-radius:5px;
  423. {/block:ifround}
  424. opacity: 1;
  425. transition: .5s ease;
  426. backface-visibility: hidden;
  427. background-color:white;
  428. }
  429.  
  430. .middle {
  431. transition: .5s ease;
  432. opacity: 0;
  433. position:relative;
  434. top:-120px;
  435. text-align:center;
  436. font-variant: small-caps;
  437. font-size:35px;
  438. }
  439.  
  440. #sidebar:hover img {
  441. filter: contrast(130%) brightness(50%);
  442. }
  443.  
  444. #sidebar:hover .middle {
  445. opacity: 1;
  446. }
  447.  
  448.  
  449. #content{
  450. width: 430px;
  451. height:350px;
  452. padding: 5px;
  453. padding-right:10px;
  454. border: {text:border width}px {select:border} {color:border};
  455. margin:auto;
  456. margin-top:-75px;
  457. background: {color:container bg};
  458. background-image: url('{image:container bg}');
  459. overflow-y:scroll;
  460. {block:ifround}
  461. border-radius:5px;
  462. {/block:ifround}
  463. {block:ifcontainerglow}
  464. box-shadow: 0px 0px 20px 10px {color:container drop shadow};
  465. {/block:ifcontainerglow}
  466. {block:ifdropshadow}
  467. box-shadow:5px 15px 3px rgba(0, 0, 0, 0.5);
  468. {/block:ifdropshadow}
  469.  
  470.  
  471. }
  472.  
  473. .post{
  474. width:400px;
  475. margin-bottom:10px;
  476. padding:5px;
  477. overflow:hidden;
  478. background-image:url('{image:post bg}');
  479. background-color:{color:post bg};
  480. border: {text:border width}px {select:border} {color:border};
  481. {block:ifround}
  482. border-radius:5px;
  483. {/block:ifround}
  484. {block:ifdropshadow}
  485. box-shadow:5px 15px 3px rgba(0, 0, 0, 0.5);
  486. {/block:ifdropshadow}
  487. }
  488.  
  489. #sidebar img, .post img{
  490. max-width:100%;
  491. }
  492.  
  493. #nav{
  494. margin:15px;
  495. }
  496.  
  497. .marquee {
  498. margin-top:10px;
  499. width: 445px;
  500. overflow: hidden;
  501. border: {text:border width}px {select:border} {color:border};
  502. {block:ifround}
  503. border-radius:5px;
  504. {/block:ifround}
  505. font-size:{text:words at bottom font size}px;
  506. background-image:url('{image:words at bottom bg}');
  507. background-color:{color:words at bottom bg};
  508. {block:ifcontainerglow}
  509. box-shadow: 0px 0px 20px 10px {color:container drop shadow};
  510. {/block:ifcontainerglow}
  511. {block:ifdropshadow}
  512. box-shadow:5px 15px 3px rgba(0, 0, 0, 0.5);
  513. {/block:ifdropshadow}
  514. z-index:69;
  515. }
  516.  
  517. .marquee marquee{
  518. padding:5px;
  519. transition: .2s ease;
  520. }
  521.  
  522. .marquee marquee a{
  523. transition: .2s ease;
  524. }
  525. /*
  526. content in the body of the posts - quotes, asks, etc
  527. "media" contains photos, photosets, videos, audio posts
  528. */
  529. .media{
  530. margin:0 0 10px 0;
  531. }
  532.  
  533. .title{
  534. font-weight:normal;
  535. font-size:18px;
  536. margin:0 0 10px 0;
  537. }
  538.  
  539. .quote{
  540. font-weight:normal;
  541. font-size:16px;
  542. font-style:italic;
  543. margin:0 0 10px 0;
  544. }
  545.  
  546. .question{
  547. margin-bottom:10px;
  548. background-image:url('{image:ask bg}');
  549. background-color:white;
  550. {block:ifround}
  551. border-radius:5px;
  552. {/block:ifround}
  553. border: {text:border width}px {select:border} {color:border};
  554. padding:5px;
  555. box-shadow:0px 1px {color:border};
  556.  
  557. }
  558.  
  559. blockquote{
  560. margin:0 0 10px 10px;
  561. padding:0 0 0 10px;
  562. border-left:solid 1px #000;
  563. }
  564.  
  565. #perma {
  566. text-align: center;
  567. background-color: {color:permalink bg};
  568. background-image: url('{image:permalink bg}');
  569. margin-top:10px;
  570. padding: 5px;
  571. margin:5px;
  572. border: {text:border width}px {select:border} {color:border};
  573. {block:ifround}
  574. border-radius:5px;
  575. {/block:ifround}
  576.  
  577. }
  578. #perma img {
  579. max-width: 350px;
  580. }
  581.  
  582. #goofy{
  583. border: {text:border width}px {select:border} {color:border};
  584. {block:ifround}
  585. border-radius:5px;
  586. {/block:ifround}
  587. padding:5px;
  588.  
  589. background-color: {color:permalink bg};
  590. background-image: url('{image:post bg}');
  591. {block:ifdropshadow}
  592. box-shadow:5px 15px 3px rgba(0, 0, 0, 0.5);
  593. {/block:ifdropshadow}
  594. margin-left:5px;
  595. }
  596.  
  597.  
  598. /*
  599. post footers - date, tags, via and source
  600. */
  601. .post .footer{
  602. margin:0;
  603. text-align:left;
  604. }
  605.  
  606. .post img{
  607. transition:0.3s;
  608. {block:ifround}
  609. border-radius:5px;
  610. {/block:ifround}
  611. }
  612.  
  613. .post img:hover{
  614. transition:0.3s;
  615. {block:ifimageblur}
  616. -webkit-filter: blur(2px); /* Safari 6.0 - 9.0 */
  617. filter: blur(2px);
  618. {/block:ifimageblur}
  619.  
  620. }
  621.  
  622.  
  623.  
  624. @-webkit-keyframes rainbow {
  625. 0% {color: #ff0000;}
  626. 10% {color: #ff8000;}
  627. 20% {color: #ffff00;}
  628. 30% {color: #80ff00;}
  629. 40% {color: #00ff00;}
  630. 50% {color: #00ff80;}
  631. 60% {color: #00ffff;}
  632. 70% {color: #0080ff;}
  633. 80% {color: #0000ff;}
  634. 90% {color: #8000ff;}
  635. 100% {color: #ff0080;}
  636. }
  637. @-ms-keyframes rainbow {
  638. 0% {color: #ff0000;}
  639. 10% {color: #ff8000;}
  640. 20% {color: #ffff00;}
  641. 30% {color: #80ff00;}
  642. 40% {color: #00ff00;}
  643. 50% {color: #00ff80;}
  644. 60% {color: #00ffff;}
  645. 70% {color: #0080ff;}
  646. 80% {color: #0000ff;}
  647. 90% {color: #8000ff;}
  648. 100% {color: #ff0080;}
  649. }
  650. @-o-keyframes rainbow {
  651. 0% {color: #ff0000;}
  652. 10% {color: #ff8000;}
  653. 20% {color: #ffff00;}
  654. 30% {color: #80ff00;}
  655. 40% {color: #00ff00;}
  656. 50% {color: #00ff80;}
  657. 60% {color: #00ffff;}
  658. 70% {color: #0080ff;}
  659. 80% {color: #0000ff;}
  660. 90% {color: #8000ff;}
  661. 100% {color: #ff0080;}
  662. }
  663. @keyframes rainbow {
  664. 0% {color: #ff0000;}
  665. 10% {color: #ff8000;}
  666. 20% {color: #ffff00;}
  667. 30% {color: #80ff00;}
  668. 40% {color: #00ff00;}
  669. 50% {color: #00ff80;}
  670. 60% {color: #00ffff;}
  671. 70% {color: #0080ff;}
  672. 80% {color: #0000ff;}
  673. 90% {color: #8000ff;}
  674. 100% {color: #ff0080;}
  675. }
  676.  
  677. /*PASTEL RAINBOW*/
  678. @-webkit-keyframes pastelrainbow {
  679. 0% {color: #ff9494; }
  680. 16% {color: #ffbb94; }
  681. 32% {color: #ffe194; }
  682. 48% {color: #b1f2ba; }
  683. 64% {color: #b8f5ff; }
  684. 80% {color: #d8b8ff; }
  685. 100% {color: #ffb8ee; }
  686. }
  687. @-ms-keyframes pastelrainbow {
  688. 0% {color: #ff9494; }
  689. 16% {color: #ffbb94; }
  690. 32% {color: #ffe194; }
  691. 48% {color: #b1f2ba; }
  692. 64% {color: #b8f5ff; }
  693. 80% {color: #d8b8ff; }
  694. 100% {color: #ffb8ee; }
  695. }
  696. @-o-keyframes pastelrainbow {
  697. 0% {color: #ff9494; }
  698. 16% {color: #ffbb94; }
  699. 32% {color: #ffe194; }
  700. 48% {color: #b1f2ba; }
  701. 64% {color: #b8f5ff; }
  702. 80% {color: #d8b8ff; }
  703. 100% {color: #ffb8ee; }
  704. }
  705. @keyframes pastelrainbow {
  706. 0% {color: #ff9494; }
  707. 16% {color: #ffbb94; }
  708. 32% {color: #ffe194; }
  709. 48% {color: #b1f2ba; }
  710. 64% {color: #b8f5ff; }
  711. 80% {color: #d8b8ff; }
  712. 100% {color: #ffb8ee; }
  713. }
  714.  
  715. .tags {
  716. max-height:0px;
  717. line-height:130%;
  718. font-size:{text:font size};
  719. opacity:0;
  720. -webkit-transition: all 0.7s ease;
  721. transition: all 0.7s ease;
  722. -moz-transition: all 0.7s ease;
  723. -o-transition: all 0.7s ease;}
  724.  
  725. .post:hover .tags{
  726. opacity:1;
  727. max-height:300px;
  728. -webkit-transition: all 0.7s ease;
  729. transition: all 0.7s ease;
  730. -moz-transition: all 0.7s ease;
  731. -o-transition: all 0.7s ease;}
  732. /*
  733. post notes
  734. */
  735. ol.notes{
  736. list-style-type:none;
  737. padding:0;
  738. margin:0;
  739. }
  740.  
  741. ol.notes li.note img{
  742. width:16px;
  743. height:16px;
  744. }
  745.  
  746. ol.notes li.note{
  747. margin:0px;
  748. }
  749.  
  750. ::-webkit-scrollbar {
  751. width: 16px;
  752. height: 10px;
  753. }
  754. ::-webkit-scrollbar-thumb {
  755. background-color: #fff;
  756. background-image: url(https://i.imgur.com/Qtm9Z60.png);
  757. border-top: 1px solid #bdbdbd;
  758. border-left: 1px solid #bdbdbd;
  759. border-right: 1px solid black;
  760. border-bottom: 1px solid black;
  761. }
  762. ::-webkit-scrollbar-track {
  763. background-color: #fff;
  764. background-image: url(https://i.imgur.com/IGXGYKz.png);
  765. }
  766. ::-webkit-scrollbar-button:vertical:increment {
  767. background-image: url(https://i.imgur.com/WhC8iy3.png);
  768. width: 14px;
  769. height: 16px;
  770. border-top: 1px solid #bdbdbd;
  771. border-left: 1px solid #bdbdbd;
  772. border-right: 1px solid black;
  773. border-bottom: 1px solid black;
  774. }
  775. ::-webkit-scrollbar-button:vertical:decrement {
  776. background-image: url(https://i.imgur.com/fQ18mrR.png);
  777. border-top: 1px solid #bdbdbd;
  778. border-left: 1px solid #bdbdbd;
  779. border-right: 1px solid black;
  780. border-bottom: 1px solid black;
  781. width: 14px;
  782. height: 16px;
  783. }
  784.  
  785.  
  786. #s-m-t-tooltip {
  787. max-width:300px;
  788. {block:ifround}
  789. border-radius: 5px;
  790. {block:ifround}
  791. text-align:center;
  792. padding:4px;
  793. margin:20px 7px -2px 20px;
  794. background-color:{color:tooltip};
  795. color:{color:tooltip text};
  796. border:{text:border width}px {color:border} {select:border};
  797. z-index:999999999999999999999999999999999999;
  798. -o-transition: all 0.3s ease-out;
  799. -webkit-transition: all 0.3s ease-out;
  800. -moz-transition: all 0.3s ease-out;
  801. }
  802.  
  803. /** LIGHTBOX MARKUP **/
  804. .lightbox {
  805. /** Default lightbox to hidden */
  806. display: none;
  807.  
  808. /** Position and style */
  809. position: fixed;
  810. z-index: 999;
  811. width: 100%;
  812. height: 100%;
  813. text-align: center;
  814. top: 0;
  815. left: 0;
  816. background: rgba(106, 148, 148, 0.3);
  817. transition:0.3s;
  818. }
  819.  
  820. .lightbox img {
  821. /** Pad the lightbox image */
  822. width:150px;
  823. height:150px;
  824. border: {text:border width}px {select:border} {color:border};
  825. {block:ifround}
  826. border-radius:5px;
  827. {/block:ifround}
  828. }
  829.  
  830. .lightbox:target {
  831. /** Remove default browser outline */
  832. outline: none;
  833.  
  834. /** Unhide lightbox **/
  835. display: flex;
  836. transition:0.3s;
  837. }
  838.  
  839. .lightbox table{
  840. margin:auto;
  841. background-color: {color:popup bg};
  842. background-image: url('{image:popup bg}');
  843. border: {text:border width}px {select:border} {color:border};
  844. {block:ifround}
  845. border-radius:5px;
  846. {/block:ifround}
  847. text-align:center;
  848. }
  849.  
  850. {CustomCSS}
  851. </style>
  852. </head>
  853.  
  854. <body>
  855.  
  856.  
  857. {block:ifredirect}
  858. {block:IndexPage}<script type="text/javascript">
  859. var url = location.href;
  860. if (url == "{BlogURL}") {
  861. window.location = "{BlogURL}tagged/{text:redirect}";
  862. }
  863. </script>{/block:IndexPage}
  864. {/block:ifredirect}
  865.  
  866.  
  867. <div id="wrapper">
  868.  
  869. <div id="sidebar">
  870. <img src="{image:icon}">
  871. <div class="middle">
  872. <a href="{text:link 1 url}">{text:link 1}</a>
  873. {text:link divider}
  874. <a href="{text:link 2 url}">{text:link 2}</a>
  875. </div>
  876. </div>
  877.  
  878.  
  879.  
  880. <div id="content">
  881. {block:Posts}
  882.  
  883. <div class="post">
  884. {block:Text}
  885. {block:Title}
  886. <div class="title">{Title}</div>
  887. {/block:Title}
  888. {Body}
  889. {/block:Text}
  890.  
  891. {block:Photo}
  892. <div class="media">{LinkOpenTag}<img src="{PhotoURL-500}" alt="{PhotoAlt}"/>{LinkCloseTag}</div>
  893. {block:ifcaptions}
  894. {block:Caption}<div class="caption">{Caption}</div>{/block:Caption}
  895. {/block:ifcaptions}
  896. {/block:Photo}
  897.  
  898. {block:Photoset}
  899. <div class="media">{Photoset-400}</div>
  900. {block:Caption}<div class="caption">{Caption}</div>{/block:Caption}
  901. {/block:Photoset}
  902.  
  903. {block:Quote}
  904. <div class="quote">"{Quote}"</div>
  905. {block:Source}
  906. <div class="quotesource">{Source}</div>
  907. {/block:Source}
  908. {/block:Quote}
  909.  
  910. {block:Link}
  911. <div class="title"><a href="{URL}">{Name}</a></div>
  912. {block:Description}
  913. <div class="description">{Description}</div>
  914. {/block:Description}
  915. {/block:Link}
  916.  
  917. {block:Chat}
  918. {block:Title}
  919. <div class="title">{Title}</div>
  920. {/block:Title}
  921.  
  922. {block:Lines}
  923. <div class="{Alt} user_{UserNumber}">
  924. {block:Label}
  925. <b>{Label}</b>{/block:Label}
  926. &nbsp;{Line}
  927. </div>
  928. {/block:Lines}
  929. {/block:Chat}
  930.  
  931. {block:Video}
  932. <div class="media">{Video-400}</div>
  933. {block:Caption}<div class="caption">{Caption}</div>{/block:Caption}
  934. {/block:Video}
  935.  
  936. {block:Audio}
  937. <div class="media">
  938. {block:AlbumArt}<img src="{AlbumArtURL}">{/block:AlbumArt}
  939. {AudioPlayerWhite}
  940. {block:TrackName}{TrackName}<br>{/block:TrackName}
  941. {block:Artist}{Artist}<br>{/block:Artist}
  942. {block:Album}{Album}{/block:Album}
  943. </div>
  944. {block:Caption}{Caption}{/block:Caption}
  945. {/block:Audio}
  946.  
  947. {block:Answer}
  948. <div class="question"><i><b>{Asker} asked: </b></i>{Question}</div>
  949. <div class="caption">{Answer}</div>
  950. {/block:Answer}
  951.  
  952. <div id="perma">
  953. <a href="{Permalink}" title='{TimeAgo}' style="float:left;">{12Hour}:{Minutes}</a> <a href='{ReblogURL}'><img src="{image:permalink}"></a> <a href="{Permalink}" style="float:right;">{NoteCount}%</a><div class='tags'>{block:HasTags}{block:Tags}<a href="{TagURL}">#{Tag}</a> {/block:Tags}{/block:HasTags}</div>
  954. </div>
  955.  
  956. </div>
  957. {/block:Posts}
  958. <center>
  959. {block:Pagination}
  960. <div id="nav">
  961. {block:PreviousPage}<a id='goofy' href="{PreviousPage}">{text:back text}</a>{/block:PreviousPage}
  962.  
  963. {block:NextPage} <a id='goofy' href="{NextPage}">{text:next text}</a> {/block:NextPage}
  964. </div>
  965. {/block:Pagination}
  966. </center>
  967.  
  968.  
  969. </div>
  970. <center>
  971. <div class='marquee'>
  972. <marquee behavior='alternate'>{text:words at tha bottom}</marquee>
  973. </div>
  974. </center>
  975. </div>
  976.  
  977. </div>
  978. <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
  979. <script>window.jQuery || document.write('<script src="https://static.tumblr.com/qxrkgx6/q6kmgn2w2/jquery-1.8.3.min.js"><\/script>')</script>
  980.  
  981.  
  982. <a href="https://os2d.tumblr.com/" title="theme by hoyoung" style="left:0;bottom:0;position:fixed;"><img src="https://66.media.tumblr.com/4515d4b64b9624c92c898e9d7a869295/e1e73e83a936d42d-80/s75x75_c1/78a63fffbf4482f804950713924190d64d4904e1.gif"></a>
  983. </body>
  984. </html>
Advertisement
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!