API tools faq
paste
Advertisement
Guest User

Shunsui new theme pop up

a guest
Nov 27th, 2015
136
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 34.84 KB | None | 0 0
raw download clone embed print report
  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. <html>
  5. <head>
  6.  
  7. <script type="text/javascript"
  8. src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
  9. <script>
  10. $(document).ready(function() {
  11. //
  12. $('a.poplight[href^=#]').click(function() {
  13. var popID = $(this).attr('rel'); //Get Popup Name
  14. var popURL = $(this).attr('href'); //Get Popup href to define size
  15. var query= popURL.split('?');
  16. var dim= query[1].split('&');
  17. var popWidth = dim[0].split('=')[1]; //Gets the first query string value
  18. $('#' + popID).fadeIn().css({ 'width': Number( popWidth ) }).prepend('<a href="#" class="close"><img src="http://upload.wikimedia.org/wikipedia/commons/f/f8/Tooltip-CloseButton.png" class="btn_close" title="escape" alt="escape" /></a>');
  19. var popMargTop = ($('#' + popID).height() + 80) / 2;
  20. var popMargLeft = ($('#' + popID).width() + 80) / 2;
  21. //Apply Margin to Popup
  22. $('#' + popID).css({
  23. 'margin-top' : -popMargTop,
  24. 'margin-left' : -popMargLeft
  25. });
  26. $('body').append('<div id="fade"></div>');
  27. $('#fade').css({'filter' : 'alpha(opacity=80)'}).fadeIn(); //Fade in the fade layer - .css({'filter' : 'alpha(opacity=80)'})
  28. return false;
  29. });
  30. $('a.close, #fade').live('click', function() {
  31. $('#fade , .popup_block').fadeOut(function() {
  32. $('#fade, a.close').remove(); //fade them both out
  33. });
  34. return false;
  35. });
  36. });
  37. </script>
  38.  
  39. <link href='https://fonts.googleapis.com/css?family=Oregano:400,400italic&subset=latin,latin-ext' rel='stylesheet' type='text/css'>
  40.  
  41. <link href='https://fonts.googleapis.com/css?family=Ubuntu+Condensed' rel='stylesheet' type='text/css'>
  42.  
  43. <link href='https://fonts.googleapis.com/css?family=Dancing+Script:700,400' rel='stylesheet' type='text/css'>
  44.  
  45. <link href='https://fonts.googleapis.com/css?family=Open+Sans+Condensed:300' rel='stylesheet' type='text/css'>
  46.  
  47. <script>if(typeof jQuery=='undefined'){document.write('<'+'script');document.write(' language="javascript"');document.write(' type="text/javascript"');document.write(' src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js">');document.write('</'+'script'+'>')}</script><script>if(!image_urls){var image_urls=Array()}if(!flash_urls){var flash_urls=Array()}image_urls['rain1']="http://2.bp.blogspot.com/-IQXNv-_CBLE/TpWcK7LL4VI/AAAAAAAAG0I/bcxYcqc_uI0/pinkpetal1.png";image_urls['rain2']="http://4.bp.blogspot.com/-teXCIicWPF4/TpWcLLg0A2I/AAAAAAAAG0U/IPPCr1gponc/pinkpetal2.png";image_urls['rain3']="http://3.bp.blogspot.com/-3JG9HLECCRU/TpWcLZGSYtI/AAAAAAAAG0g/zIJINua93TE/redpetal1.png";image_urls['rain4']="http://2.bp.blogspot.com/-BByhQEK5E24/TpWcLux4xRI/AAAAAAAAG0s/x2hIr1AV_Ac/redpetal2.png";$(document).ready(function(){var c=$(window).width();var d=$(window).height();var e=function(a,b){return Math.round(a+(Math.random()*(b-a)))};var f=function(a){setTimeout(function(){a.css({left:e(0,c)+'px',top:'-30px',display:'block',opacity:'0.'+e(10,100)}).animate({top:(d-10)+'px'},e(7500,8000),function(){$(this).fadeOut('slow',function(){f(a)})})},e(1,8000))};$('<div></div>').attr('id','rainDiv')
  48. .css({position:'fixed',width:(c-20)+'px',height:'1px',left:'0px',top:'-5px',display:'block'}).appendTo('body');for(var i=1;i<=20;i++){var g=$('<img/>').attr('src',image_urls['rain'+e(1,4)])
  49. .css({position:'absolute',left:e(0,c)+'px',top:'-30px',display:'block',opacity:'0.'+e(10,100),'margin-left':0}).addClass('rainDrop').appendTo('#rainDiv');f(g);g=null};var h=0;var j=0;$(window).resize(function(){c=$(window).width();d=$(window).height()})});</script>
  50. <script>if(typeof jQuery=='undefined'){document.write('<'+'script');document.write(' language="javascript"');document.write(' type="text/javascript"');document.write(' src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js">');document.write('</'+'script'+'>')}</script><script>$(document).ready(function(){var a=$('<img>').attr({'src':'http://2.bp.blogspot.com/-IQXNv-_CBLE/TpWcK7LL4VI/AAAAAAAAG0I/bcxYcqc_uI0/pinkpetal1.png','border':0});$('<a></a>').css({position:'absolute',right:'0px',top:'22px','z-index':'90'}).attr({'href':'http://tutorialuntukblog.blogspot.com/2011/10/tutorial-kelopak-bunga-berguguran-di.html'}).append(a).appendTo('body')});</script>
  51.  
  52. <link href='https://fonts.googleapis.com/css?family=Russo+One' rel='stylesheet' type='text/css'>
  53.  
  54. <!---------- DO NOT REMOVE----------
  55.  
  56. ESTE TEMA PERTENECE A SHAMELESSVIRGIN
  57. POR FAVOR NO REMOVER EL CRÉDITO
  58. POR FAVOR NO ROBAR Y DISTRIBUIR
  59. POR FAVOR NO EDITAR Y DISTRIBUIR
  60.  
  61. ------------ DO NOT REMOVE---------->
  62.  
  63. <script type="text/javascript">
  64. <!--
  65. function clickIE() {if (document.all) {(message);return false;}}
  66. function clickNS(e) {if
  67. (document.layers||(document.getElementById&&!document.all)) {
  68. if (e.which==2||e.which==3) {(message);return false;}}}
  69. if (document.layers)
  70. {document.captureEvents(Event.MOUSEDOWN);document.onmousedown=clickNS;}
  71. else{document.onmouseup=clickNS;document.oncontextmenu=clickIE;}
  72. document.oncontextmenu=new Function("return false")
  73. // -->
  74. </script>
  75.  
  76.  
  77. <title>{Title}</title>
  78. <link rel="shortcut icon" href="{Favicon}">
  79. <link rel="altertnate" type="application/rss+xml" href="{RSS}">
  80. {block:Description}
  81. <meta name="description" content="{MetaDescription}" />
  82. {/block:Description}
  83.  
  84.  
  85.  
  86. <meta name="color:background" content="#14171b">
  87. <meta name="color:sidebar links" content="#1a4133">
  88. <meta name="color:sidebar shadow" content="#347153">
  89. <meta name="color:sidebar hover" content="#45966e">
  90. <meta name="color:links" content="#349446">
  91. <meta name="color:links shadow" content="#6d6d6d">
  92. <meta name="color:links hover" content="#ffffff">
  93. <meta name="color:text" content="#ffffff">
  94. <meta name="color:blockquote" content="#206834">
  95. <meta name="color:bold" content="#127b29">
  96. <meta name="color:bold shadow" content="#000000">
  97. <meta name="color:italic" content="#ffffff">
  98. <meta name="color:italic shadow" content="#ffffff">
  99. <meta name="color:underline" content="#228425">
  100. <meta name="color:big" content="#ffffff">
  101. <meta name="color:big shadow" content="#ffffff">
  102. <meta name="color:pre text" content="#000000">
  103. <meta name="color:pre bg" content="#97b6a2">
  104. <meta name="color:ask text" content="#ededed">
  105. <meta name="color:ask border" content="#48845e">
  106. <meta name="color:info" content="#55b667">
  107. <meta name="color:info text" content="#1d3e1d">
  108. <meta name="color:info border" content="#0c230e">
  109. <meta name="color:info hover" content="#4bbe56">
  110. <meta name="color:pagi" content="#14a344">
  111. <meta name="color:selec bg" content="#000000">
  112. <meta name="color:selec" content="#797979">
  113. <meta name="color:tags" content="#ffffff">
  114. <meta name="color:tags hover" content="#208627">
  115.  
  116. <meta name="image:Background" content=""/>
  117. <meta name="image:ask" content=""/>
  118. <meta name="image:info" content=""/>
  119.  
  120.  
  121. <meta name="text:YOUR URL" content="">
  122. <meta name="text:updates" content="">
  123. <meta name="text:drafts" content="">
  124. <meta name="text:family" content="">
  125. <meta name="text:more" content="">
  126. <meta name="text:updates title" content="">
  127.  
  128. <meta name="text:Link 1 URL" content="">
  129. <meta name="text:Link Title 1" content="">
  130. <meta name="text:Link 2 URL" content="">
  131. <meta name="text:Link Title 2" content="">
  132. <meta name="text:Link 3 URL" content="">
  133. <meta name="text:Link Title 3" content="">
  134. <meta name="text:Link 4 URL" content="">
  135. <meta name="text:Link Title 4" content="">
  136. <meta name="text:Link 5 URL" content="">
  137. <meta name="text:Link Title 5" content="">
  138.  
  139. <!--This is for you hover titles (When you hover over a link) -->
  140.  
  141.  
  142.  
  143. <script type="text/javascript">
  144. WebFontConfig = {
  145. google: { families: [ 'times' ] }
  146. };
  147. (function() {
  148. var wf = document.createElement('script');
  149. wf.src = ('https:' == document.location.protocol ? 'https' : 'http') +
  150. '://ajax.googleapis.com/ajax/libs/webfont/1/webfont.js';
  151. wf.type = 'text/javascript';
  152. wf.async = 'true';
  153. var s = document.getElementsByTagName('script')[0];
  154. s.parentNode.insertBefore(wf, s);
  155. })(); </script>
  156.  
  157.  
  158. <script type="text/javascript">
  159. $(document).ready(function(){
  160. $("ul#tabs li").click(function(e){
  161. if (!$(this).hasClass("active")) {
  162. var tabNum = $(this).index();
  163. var nthChild = tabNum+1;
  164. $("ul#tabs li.active").removeClass("active");
  165. $(this).addClass("active");
  166. $("ul#tab li.active").removeClass("active");
  167. $("ul#tab li:nth-child("+nthChild+")").addClass("active");
  168. }
  169. });
  170. });
  171. </script>
  172.  
  173. <link href="http://static.tumblr.com/qudkd6d/OcDnl99gb/style.css" rel="stylesheet" type="text/css"/>
  174. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  175. <script src="http://static.tumblr.com/qudkd6d/Az6nkemqr/pxuphotoset.min.js"></script>
  176.  
  177. <!-- SCRIPTS -->
  178.  
  179.  
  180. <link href="http://fonts.googleapis.com/css?family=IM+Fell+Double+Pica+SC" rel="stylesheet" type="text/css">
  181. <link href="http://fonts.googleapis.com/css?family=VT323" rel="stylesheet" type="text/css">
  182. <link href="http://fonts.googleapis.com/css?family=Fjalla+One" rel="stylesheet" type="text/css">
  183. <link href="http://fonts.googleapis.com/css?family=Alex+Brush" rel="stylesheet" type="text/css">
  184. <link href='https://fonts.googleapis.com/css?family=Bangers' rel='stylesheet' type='text/css'>
  185.  
  186. <style type="text/css">
  187.  
  188. #fade { /*--Transparent background layer--*/
  189. display: none; /*--hidden by default--*/
  190. background: #000;
  191. background-image: url('');
  192. position: fixed; left: 0; top: 0;
  193. width: 100%; height: 100%;
  194. opacity: .80;
  195. z-index: 9999;
  196. }
  197. .popup_block{
  198. display: none; /*--hidden by default--*/
  199. background: #fff;
  200. padding: 20px;
  201. border: 2px solid #ddd;
  202. float: left;
  203. font-size: 12px;
  204. position: fixed;
  205. top: 50%; left: 50%;
  206. z-index: 99999;
  207. border-radius:5px;
  208. max-height:400px;
  209. overflow:scroll;
  210. overflow-x:hidden;
  211. /*--CSS3 Box Shadows--*/
  212. -webkit-box-shadow: 0px 0px 20px #000;
  213. -moz-box-shadow: 0px 0px 20px #000;
  214. box-shadow: 0px 0px 20px #000;
  215. /*--CSS3 Rounded Corners--*/
  216. -webkit-border-radius: 10px;
  217. -moz-border-radius: 10px;
  218. border-radius: 10px;
  219. }
  220. img.btn_close {
  221. float: right;
  222. margin: -5px -5px 0 0;
  223. }
  224. /*--Making IE6 Understand Fixed Positioning--*/
  225. *html #fade {
  226. position: absolute;
  227. }
  228. *html .popup_block {
  229. position: absolute;
  230. }
  231.  
  232. /* this is for the scrollbar */
  233.  
  234. ::-webkit-scrollbar-thumb{
  235. background-color: transparent;
  236. border-radius:0px;
  237. height:auto;
  238. }
  239.  
  240. ::-webkit-scrollbar {
  241. height:auto;
  242. width:4px;
  243. border: 1px transparent;
  244. border-radius:0px;
  245. }
  246.  
  247.  
  248. /* TOOLTIPS */
  249.  
  250. #s-m-t-tooltip {
  251. max-width:300px;
  252. padding:3px 7px 3px 8px;
  253. margin:-20px 0px 0px 20px;
  254. background-color:{color:background};
  255. color:{color:text};
  256. font-size:7px;
  257. text-transform:uppercase;
  258. z-index:999999999999;
  259. letter-spacing:2px;
  260. -webkit-border-radius:5px;
  261. -moz-border-radius:5px;
  262. border-radius:5px;
  263. }
  264.  
  265.  
  266.  
  267. /* ENTRIES */
  268.  
  269.  
  270. blockquote {
  271. width:350px;
  272. border-radius:10px;
  273. border-left:1px solid {color:blockquote};
  274. margin-left:1px;
  275. padding-left:9px;
  276. padding-top:1px;
  277. padding-bottom:1px;
  278.  
  279. }
  280.  
  281.  
  282.  
  283. body {
  284. background:{color:background};
  285. background-attachment:fixed;
  286. background-repeat:no-repeat;
  287. background-position: top ; /* you can change this if to TOP or CENTER if you want */
  288. color:{color:text};
  289. font-family: 'Ubuntu Condensed', sans-serif;
  290. text-align:justify;
  291. font-size:11px;
  292. ;
  293. background-image:url("{image:Background}");
  294.  
  295. margin:0;
  296. padding-top:0;
  297. word-wrap:break-word;};
  298.  
  299.  
  300. }
  301.  
  302.  
  303. /* bold (b), italic (i,em), and underlined (u) */
  304.  
  305.  
  306. er, ber, cer, {
  307. font-weight:normal;
  308. font-size:12px;
  309. text-align:center;
  310. font-style:normal;
  311. font-family: 'Open Sans Condensed', sans-serif;
  312. padding-bottom:3px;
  313. line-height:80%;
  314. letter-spacing:3px;
  315. text-transform: uppercase;
  316. color:{color:blockquote};
  317. }
  318.  
  319.  
  320. sub, sup, small {
  321. font-size: 11px;
  322. color:{color:text};
  323. }
  324.  
  325. b, strong {
  326. font-size: 10px;
  327. font-family: 'Fjalla One', sans-serif;
  328. color:{color:bold};
  329. text-shadow: 3px 3px 0px rgb(96, 6, 24);
  330. }
  331.  
  332. i,em{
  333. color:{color:italic};
  334. text-shadow: 0px 0px 2px {color:italic shadow};
  335. font-family: 'Oregano', cursive;;
  336. font-size:16px;
  337. }
  338.  
  339. code {
  340. font-size: 11px;
  341. }
  342.  
  343.  
  344. big{
  345. color:{color:big};
  346. text-shadow: 0px 0px 2px {color:big shadow};
  347. font-family:georgia, sans-serif;
  348. }
  349.  
  350.  
  351. u{
  352. color:{color:underline};
  353. }
  354.  
  355. pre {
  356. font-family:courier;
  357. text-align:center;
  358. text-transform:uppercase;
  359. font-size:10px;
  360. color:{color:pre text};
  361. background:{color:pre bg};
  362. padding:10px;
  363. padding-left:15px;
  364. padding-right:15px;
  365. word-wrap: break-word;
  366. }
  367.  
  368.  
  369. h1 {
  370. font-family: 'Open Sans Condensed', sans-serif;
  371. text-transform:uppercase;
  372. text-align: center;
  373. font-size:12px;
  374. line-height:100%;
  375. color: {color:blockquote};
  376. }
  377.  
  378. h2 {
  379. font-size:17px;
  380. color: {color:big};
  381. font-weight:bold;
  382. text-shadow: 0px 0px 2px {color:big shadow}}
  383.  
  384. h3 {
  385. font-size:18px;
  386. font-family: 'Open Sans Condensed', sans-serif;
  387. text-shadow: 0px 0px 3px {color:bold shadow};
  388. text-align:center;
  389. text-transform:lowercase;
  390. font-style:italic;
  391. line-height:100%;
  392. letter-spacing:0px;
  393. padding-bottom:-10px;
  394. color: {color:blockquote};
  395. }
  396.  
  397. h4 {
  398. font-size:11px;
  399. font-family: 'Open Sans Condensed', sans-serif;
  400. text-align:center;
  401. text-transform:uppercase;
  402. line-height:100%;
  403. letter-spacing:0px;
  404. font-weight:bold;
  405. color: {color:blockquote};
  406. }
  407.  
  408. h12 {
  409. font-size:16px;
  410. text-align:right;
  411. line-height:100%;
  412. letter-spacing:0px;
  413. font-family: 'Open Sans Condensed', sans-serif;
  414. text-shadow: 0px 2px 2px {color:blockquote};
  415. color:{color:text};
  416. text-transform: uppercase;
  417. }
  418.  
  419. h81 {
  420. font-weight:normal;
  421. font-size:12px;
  422. text-align:center;
  423. font-style:normal;
  424. font-family: 'Open Sans Condensed', sans-serif;
  425. padding-bottom:3px;
  426. line-height:80%;
  427. letter-spacing:3px;
  428. text-transform: uppercase;
  429. color:{color:blockquote};
  430. }
  431.  
  432.  
  433. /* Links & hovers */
  434.  
  435.  
  436. a {
  437. color:{color:links};
  438. text-shadow: none;
  439. text-decoration:none;
  440. -moz-transition-duration:1s;
  441. -webkit-transition-duration:1s;
  442. -o-transition-duration:1s;
  443. }
  444.  
  445.  
  446. a:hover {
  447. color:{color:links hover};
  448. text-shadow: none;
  449. /* transition of the image when you hover on it */
  450. -moz-transition-duration:1s;
  451. -webkit-transition-duration:1s;
  452. -o-transition-duration:1s;
  453. }
  454.  
  455. /* Your sidebar, image, description and links */
  456.  
  457.  
  458.  
  459. #sidebar {
  460. position:fixed;
  461. margin-left:898px;
  462. width: 190px;
  463. margin-top:158px;
  464. background-color: transparent;
  465. padding:0px 5px 0px;
  466.  
  467.  
  468. }
  469.  
  470.  
  471. .pagination {
  472.  
  473. top:196px;
  474. left:50%;
  475. margin-left: 350px;
  476. position: absolute;
  477. text-align: left;
  478. letter-spacing:1px;
  479. text-transform:uppercase;
  480.  
  481. }
  482.  
  483. .pagination a{
  484. color: {color:links};
  485. font-family: 'Open Sans Condensed', sans-serif;
  486. letter-spacing:4px;
  487. font-size:10px;
  488. text-shadow: 0px 0px 3px {color:links shadow};}
  489.  
  490. .pagination a:hover{
  491. color:{color:links hover};
  492. -webkit-filter: blur(2px);
  493. -webkit-transition:all .5s ease-in-out;
  494. -moz-transition:all .5s ease-in-out;
  495. transition:all .5s ease-in-out;
  496.  
  497. }
  498.  
  499. #topbar {
  500. position:fixed;
  501. top:295px;
  502. left:470px;
  503. z-index: 9;
  504.  
  505. }
  506.  
  507.  
  508. .user {
  509. position: fixed;
  510. margin-left: -268px;
  511. left:50%;
  512. font-size: 10px;
  513. letter-spacing:-1px;
  514. font-family: 'Open Sans Condensed', sans-serif;
  515. text-transform:uppercase;
  516. line-height: 170%;
  517. text-align: center;
  518. width: 500px;
  519. top:420px;
  520. text-shadow: 0px 0px 2px {color:sidebar shadow};
  521. margin-right: auto;
  522. -ms-transform: rotate(-90deg);
  523. -webkit-transform: rotate(-90deg);
  524. transform: rotate(-90deg);
  525. -webkit-transition: all .5s linear;
  526. }
  527.  
  528. .user a {
  529. padding-left: 5px;
  530. font-size: 20px;
  531. color: {color:sidebar links};
  532. font-family: 'Open Sans Condensed', sans-serif;
  533. text-shadow: none;
  534. text-shadow: 0px 0px 2px {color:sidebar shadow};
  535. width: 500px;
  536. -moz-transition-duration:.5s;
  537. -webkit-transition-duration:.5s;
  538. -o-transition-duration:.5s;
  539.  
  540. }
  541.  
  542. .user a:hover {
  543. padding-left: 5px;
  544. color: {color:sidebar hover};
  545. text-shadow: 0px 0px 2px {color:sidebar shadow};
  546. -moz-transition-duration:.9s;
  547. -webkit-transition-duration:.9s;
  548. -o-transition-duration:.9s;
  549. }
  550.  
  551.  
  552. .links {
  553. position: fixed;
  554. top:615px;
  555. margin-left:-85px;
  556. left:50%;
  557. font-size: 19px;
  558. letter-spacing:1px;
  559. font-family: 'Open Sans Condensed', sans-serif;
  560. text-transform:uppercase;
  561. line-height: 170%;
  562. text-align: right;
  563. width: 200px;
  564. text-shadow: 0px 0px 2px {color:sidebar shadow};
  565. margin-right: auto;
  566. -ms-transform: rotate(-0deg); /* IE 9 */
  567. -webkit-transform: rotate(-0deg); /* Safari */
  568. transform: rotate(-0deg);
  569.  
  570. }
  571.  
  572. .links a {
  573. padding-left: 5px;
  574. font-size: 15px;
  575. font-family: 'Open Sans Condensed', sans-serif;
  576. color: {color:sidebar links};
  577. text-shadow: 1px 1px 2px {color:sidebar shadow};
  578. -moz-transition-duration:.9s;
  579. -webkit-transition-duration:.9s;
  580. -o-transition-duration:.9s;
  581. }
  582.  
  583. .links a:hover {
  584. padding-left: 5px;
  585. color: {color:sidebar hover};
  586. text-shadow: 0px 0px 2px {color:sidebar shadow};
  587. -webkit-transition:all .5s ease-in-out;
  588. -moz-transition:all .5s ease-in-out;
  589. transition:all .5s ease-in-out;
  590. }
  591.  
  592.  
  593.  
  594. #container {
  595. left:50%;
  596. height: 400px;
  597. width: 410px;
  598. text-align:justify;
  599. font-family: 'Open Sans Condensed', sans-serif;
  600. text-transform: auto;
  601. position: fixed;
  602. margin-left:2px;
  603. margin-top:220px; /* this could be changed for this bottom:-2px;; */
  604. overflow: auto;
  605. }
  606.  
  607.  
  608. #post {
  609. width:400px;
  610. margin-top:12px;
  611. text-align:justify;
  612. font-size:11px;
  613. line-height:110%;
  614. letter-spacing:0px;
  615. color:{color:text};
  616. margin-bottom: 30px;
  617. text-transform: auto;
  618. padding: 2px;
  619. margin-left: auto;
  620. margin-right: auto;
  621. }
  622.  
  623. #posts img {
  624. height:auto;
  625. max-width:100%;
  626. }
  627.  
  628. #photo img {
  629. width:100%;
  630. -webkit-border-radius:5px;
  631. -moz-border-radius:5px;
  632. border-radius:5px;
  633. }
  634.  
  635. .caption {
  636. width:{select:Post size}px;
  637. text-align:justify;
  638. line-height:120%;
  639. }
  640.  
  641. #asker {
  642. font-family: 'Open Sans Condensed', sans-serif;
  643. font-size:30px;
  644. text-align:right;
  645. margin-left:15px;
  646. text-transform:uppercase;
  647. color: {color:italic};
  648. letter-spacing:3px
  649.  
  650.  
  651. }
  652.  
  653. #asker a{
  654. color: {color:bold};
  655. font-family: 'Dancing Script', cursive;
  656. letter-spacing: 3px;
  657.  
  658. font-size:13px;
  659. text-shadow: 0px 0px 3px {color:bold shadow};
  660. }
  661.  
  662. #asker a:hover {
  663. color: {color:links hover};
  664. letter-spacing: 3px;
  665. }
  666.  
  667. #ask {
  668. font-family: 'Open Sans Condensed', sans-serif;
  669. font-size:8px;
  670. text-align:center;
  671. padding-top: 5px;
  672. margin-left:5px;
  673. text-transform:auto;
  674. line-height:130%;
  675. padding:8px;
  676. background:#382020;
  677. color:{color:ask text};
  678. text-transform: uppercase;
  679. border:1px {color:ask border} solid;
  680. border-top-left-radius:20px;
  681. border-bottom-right-radius:20px;
  682. }
  683.  
  684. .ans {
  685. text-align:left;
  686. padding:10px;
  687.  
  688. }
  689.  
  690. .audio {
  691. width:250px;
  692. padding-bottom:10px;
  693. }
  694.  
  695.  
  696. .playercontainer {
  697. text-align:left;
  698. padding:10px;
  699. width:240px;
  700. }
  701.  
  702. .audioinfo {
  703. padding:10px;
  704. color:{color:text};
  705. }
  706.  
  707.  
  708. .note {
  709. text-transform:uppercase;
  710. font-style:normal;
  711. letter-spacing:0px;
  712. font-size: 9px;
  713. text-align:left;
  714. line-height:90%;
  715. margin-left:-40px;
  716. }
  717.  
  718. .note li {
  719. list-style-type:none;
  720. padding:10px 25px 10px 25px;
  721. text-align:left;
  722. margin:0px;
  723. -moz-transition-duration:0.5s;
  724. -webkit-transition-duration:0.5s;
  725. -o-transition-duration:0.5s;
  726. }
  727.  
  728. #info {
  729. font-family: 'VT323',serif ;
  730. width:300px;
  731. margin-top:0px;
  732. padding-top:4px;
  733. margin-left:auto;
  734. margin-right:auto;
  735. padding-BOTTOM:1px;
  736. font-size:14px;
  737. color:{color:info text};
  738. text-transform:uppercase;
  739. letter-spacing:1px;
  740. font-style:normal;
  741. text-align:center;
  742. padding:4px;
  743. background:url("{image:info}");
  744. BORDER:0px solid {color:info border};
  745. -moz-transition-duration:0.2s;
  746. -webkit-transition-duration:0.2s;
  747. -o-transition-duration:0.2s;
  748. }
  749.  
  750. #info a {
  751. font-size:15px;
  752. color:{color:info text};
  753. text-shadow: 0px 0px 3px {color:info link shadow};
  754. padding:5px;
  755. font-style:normal;
  756. }
  757.  
  758. #info a:hover {
  759. color:{color:info hover};
  760. -webkit-filter: blur(0px);
  761. -moz-transition-duration:0.2s;
  762. -webkit-transition-duration:0.2s;
  763. -o-transition-duration:0.2s;
  764. }
  765.  
  766. .tags {
  767. width:300px;
  768. text-transform:uppercase;
  769. margin-left:auto;
  770. margin-right:auto;
  771. padding:3px;
  772. font-size:12px;
  773. font-style:normal;
  774. font-family: helvetica;
  775. padding-top:4px;
  776. line-height:50%;
  777. color:{color:tags};
  778. font-size:12px;
  779. text-align:center;
  780. opacity:0;
  781. -moz-transition-duration:.7s;
  782. -webkit-transition-duration:.7s;
  783. -o-transition-duration:.7s;
  784.  
  785. }
  786.  
  787. .tags a{
  788. font-size:9px;
  789. font-family: helvetica;
  790. text-transform:none;
  791. font-weight:0;
  792. font-weight:none;
  793. text-shadow: none;
  794. color:{color:tags};
  795. opacity:0.5;
  796. font-weight:none;
  797.  
  798. }
  799. .tags a:hover{
  800. color:{color:tags hover};
  801. opacity:1;
  802. font-weight:none;
  803. -moz-transition-duration:0.8s;
  804. -webkit-transition-duration:0.8s;
  805. -o-transition-duration:0.8s;
  806.  
  807. }
  808.  
  809. #post:hover .tags {
  810. opacity:1;
  811. -moz-transition-duration:1.2s;
  812. -webkit-transition-duration:1.2s;
  813. -o-transition-duration:1.2s;
  814. }
  815.  
  816.  
  817. /* Quote & Source */
  818.  
  819. .quotemarkleft {
  820. font-size: 80px;
  821. font-family: 'Georgia';
  822. font-weight: bold;
  823. line-height: 100px;
  824. position: relative;
  825. margin: 0px 0 -70px 30px;
  826. color: #7c373d;
  827. opacity: 0.9;
  828. }
  829.  
  830. .quotemarkright {
  831. font-family: 'Georgia';
  832. font-size: 80px;
  833. font-weight: bold;
  834. padding-right: 0px;
  835. line-height: 30px;
  836. text-align: right;
  837. position: relative;
  838. margin:0 30px 0 -10px;
  839. color: #7c373d;
  840. opacity: 0.97;
  841. }
  842.  
  843.  
  844. #quote{
  845. font-family:crimson text;
  846. text-align:center;
  847. font-size:25px;
  848. line-height:18px;
  849. font-weight:bold;
  850. font-style:italic;
  851. z-index:999;
  852. }
  853.  
  854.  
  855.  
  856.  
  857. .credit {
  858. position:fixed;
  859. font-family: 'Alex Brush', cursive;
  860. color:{color:bold};
  861. font-size:16px;
  862. font-weight:bold;
  863. line-height:100%;
  864. letter-spacing:0px;
  865. right:7px;
  866. bottom:5px;
  867. text-align:center;
  868. text-shadow:0 0 3px {color:bold};
  869. -webkit-transition: all 0.5s ease-in-out;
  870. -moz-transition: all 0.5s ease-in-out;
  871. -o-transition: all 0.5s ease-in-out;
  872. -ms-transition: all 0.5s ease-in-out;
  873. transition: all 0.5s ease-in-out;
  874. }
  875.  
  876. .credit:hover {
  877. color:transparent;
  878. text-shadow:0 0 7px {color:bold shadow};
  879. -webkit-transition: all 0.5s ease-in-out;
  880. -moz-transition: all 0.5s ease-in-out;
  881. -o-transition: all 0.5s ease-in-out;
  882. -ms-transition: all 0.5s ease-in-out;
  883. transition: all 0.5s ease-in-out;
  884. }
  885.  
  886.  
  887.  
  888. /* Selection Text & BG (instead of having that blue background when you highlight something) */
  889.  
  890.  
  891. ::selection {
  892. background:{color:selec bg};
  893. color:{color:selec};
  894. }
  895.  
  896. /* UPDATES */
  897.  
  898. /* UPDATES TAB #1 by http://wizardring.tumblr.com */
  899.  
  900. /*change 'left' to 'right' if you want it on the right corner*/
  901. #tab {width:140px; position:fixed; top:20px; left:20px; z-index:3; transition:all .5s ease;}
  902. #tab:hover {transition:all .8s ease;}
  903.  
  904. /* box */
  905. #tab_box {position:relative; text-align:justify; opacity:0; transition:all .5s ease; margin:15px -200px 8px; width:140px;background:#382020;}
  906. #tab:hover #tab_box {opacity:1; transition:all 1s ease; margin:15px 0px 8px;}
  907.  
  908. /* the navicon: change the color of it by putting other color code instead of #eee*/
  909. .border1 {width:20px; height:1px; background:#9a2a3d; position:absolute; margin-top:0px; transition:all .5s ease;}
  910. .border2 {width:20px; height:1px; background:#9a2a3d; position:absolute; margin-top:5px; transition:all .5s ease;}
  911. .border3 {width:20px; height:1px; background:#9a2a3d; position:absolute; margin-top:10px; transition:all .5s ease;}
  912.  
  913. #tab:hover .border1 {margin-top:0px; width:50px; transition:all .9s ease;}
  914. #tab:hover .border2 {margin-top:0px; width:50px; margin-left:50px; transition:all .9s ease;}
  915. #tab:hover .border3 {margin-top:0px; width:40px; margin-left:100px; transition:all .9s ease;}
  916.  
  917. /* title: change the title/background color by changing the #COLORCODE; if you want it on the right change the 'margin-left' to 'right' (also on the hover) */
  918. .updates_title {padding-left:5px; text-align:left; background:#9a2a3d; color:black; text-transform:uppercase; font-size:8.5px; transition:all .5s ease; position:absolute; font-weight:bold; width:auto; display:inline-block; margin-top:-6.5px; margin-right:-200px; opacity:0; letter-spacing:3px;}
  919. #tab:hover .updates_title {transition:all 1.5s ease; opacity:1; margin-left:0px;}
  920.  
  921. .updates_text {font-style;color: black;}
  922.  
  923. /* tab divisor: change the color of it by putting other color code instead of #eee; if you want it centered, change the margin to 'margin:8px auto 0px' */
  924. #tab_border {height:1px; background:black; width:100px; position:relative; margin:8px 0px 8px;}
  925.  
  926. /* UPDATES TAB #1 by http://wizardring.tumblr.com */
  927.  
  928.  
  929.  
  930. </style></head><body>
  931.  
  932.  
  933. <!-- UPDATES TAB #1 by http://wizardring.tumblr.com -->
  934. <div id="tab">
  935. <!--navicon-->
  936. <div class="border1"></div>
  937. <div class="border2"></div>
  938. <div class="border3"></div>
  939. <!--navicon-->
  940.  
  941. <!--tab title-->
  942. <div class="updates_title">{text:updates title}</div>
  943. <!--box-->
  944. <div id="tab_box">
  945. <!--write things here, break a line by using <br>-->
  946. <center><u>indie shunsui kyoraku</u>
  947. <p>
  948. selective and private
  949. <br>
  950. please read <big>the rules</big> before following or interacting.</center>
  951.  
  952. <center>Blog is best viewed in <br><big>Chrome</big>/ <b>22'' diagonale</b>
  953. <!--to use a divider just copy and paste this: <div id="tab_border"></div>-->
  954. <div id="tab_border"></div></center>
  955.  
  956.  
  957. <!--write things here-->
  958. <center>Returned since <big>September 2015</big>.
  959. <br>Formerly: shunsxi
  960. </center>
  961. <center><div id="tab_border"></div>
  962. {text:updates}
  963. Tracking tag <big>sozosa</big>
  964. <br>
  965. <marquee onmouseover="this.stop();" onmouseout="this.start();">!!!WILLING TO GO EXCLUSIVE!!!</marquee>
  966. <center> <div id="tab_border"></div>
  967. <div id="tab_border"></div></center>
  968. Original art for background picture:<br>
  969. <b><a href="http://www.hollyoakhill.tumblr.com/">hollyoakhill</a></b>
  970. </div>
  971. </div>
  972. <!-- UPDATES TAB #1 by http://wizardring.tumblr.com -->
  973.  
  974. <div class="credit"><a href="http://whiiitthemore.tumblr.com/" title="theme by whiiitthemore"><span class="credit">W</span></a></div>
  975.  
  976. <div id="sidebar">
  977.  
  978. <div class="user">
  979. <a href="/" title="refresh">{text:YOUR URL}</a></div>
  980.  
  981. <div class="links">
  982.  
  983. <a href="#?w=500" rel="02" class="poplight">✲</a>
  984. <a href="#?w=400" rel="03" class="poplight">✲</a>
  985. <a href="#?w=400" rel="04" class="poplight">✲</a>
  986. <a href="#?w=400" rel="05" class="poplight">✲</a>
  987. <a href="#?w=400" rel="06" class="poplight">✲</a>
  988. <a href="#?w=400" rel="07" class="poplight">✲</a>
  989.  
  990. </div>
  991.  
  992.  
  993. </div>
  994.  
  995. <div class="pagination">
  996.  
  997. <center>{block:Pagination}{block:PreviousPage}<a href="{PreviousPage}"><b>«</b></a>{/block:PreviousPage} &nbsp;&nbsp;&nbsp; {block:NextPage}<a href="{NextPage}"><b>»</b></a><br />{/block:NextPage}{/block:Pagination}</div></center></div>
  998. </div></div></div>
  999.  
  1000. </div>
  1001.  
  1002. <div id="container">
  1003.  
  1004. <div id="entries">
  1005.  
  1006. {block:Posts}
  1007.  
  1008. <!--This is where you fix all your post (your quotes post, text post, photo post, audio post, etc. -->
  1009.  
  1010. <div id="post">
  1011.  
  1012. {block:Text}<h1>{block:Title}{Title}{/block:Title}</h1>{Body}{/block:Text}
  1013.  
  1014. <!--I got a little bug, so, if you want to change de width you need to change the -500 for -250/400 or simply let the 500 -->
  1015.  
  1016. {block:Photo}{LinkOpenTag}<img src="{PhotoURL-400}">{LinkCloseTag}{block:Caption}{Caption}{/block:Caption}{/block:Photo}
  1017.  
  1018.  
  1019. {block:Photoset}{Photoset-400}{block:Caption}{Caption}{/block:Caption}{/block:Photoset}
  1020.  
  1021.  
  1022. {block:Video}{Video-400}{block:Caption}{Caption}{/block:Caption}{/block:Video}</center>
  1023.  
  1024. <!-- only on those three -->
  1025.  
  1026. {block:Quote}<div class="quote"><big><big>"{Quote}"</big></big>{block:Source}<br><br> <div style="text-align: right;">— {Source}</div></div>{/block:Source}{/block:Quote}
  1027.  
  1028. {block:Link}<h1><a href="{URL}" {Target}>{name}</a></h1>{block:Description}{Description}{/block:Description}{/block:Link}{hw}
  1029.  
  1030. {block:Chat}{block:Title}<h1>{Title}</h1>{/block:Title}{block:Lines}{block:Label}<b>{Label}</b>{/block:Label} {Line}<br>{/block:Lines}{/block:Chat}{hw}
  1031.  
  1032. {block:Audio}{block:AlbumArt}<img src="{AlbumArtURL}" width="65px" align="left">{/block:AlbumArt}<div class="audio">{AudioPlayerGrey}<br>{block:TrackName}&nbsp;&nbsp;&nbsp;&nbsp; {TrackName}{/block:TrackName}
  1033. {block:Artist} &nbsp;—&nbsp; {Artist} {/block:Artist}</div>{block:Caption}{Caption}{/block:Caption}{/block:Audio}
  1034.  
  1035.  
  1036.  
  1037. {block:Answer}
  1038. <div id="ask">{question}</div>
  1039. <div id="asker">{Asker}</div>
  1040. {Answer}{/block:Answer}
  1041.  
  1042. {block:Date}<div id="info"> <a href="{Permalink}" title="{TimeAgo}">★</a>
  1043. {/block:Date} {block:NoteCount} <a href="{Permalink}" title="{NoteCount}">★</a> {/block:NoteCount}
  1044.  
  1045. {block:RebloggedFrom}<a title="{ReblogParentName}" href="{ReblogParentURL}">★</a> {/block:RebloggedFrom}{block:ContentSource} <a title="{SourceTitle}" href="{SourceURL}">★</a>{/block:ContentSource} {/block:RebloggedFrom} <a href="{ReblogURL}"target="_blank" title="REBLOG?">★</a> </div>
  1046.  
  1047. {block:HasTags}
  1048. <div class="tags">
  1049. <center> {block:Tags} <a href="{TagURL}">&nbsp; #{Tag} </a> {/block:Tags} </div></center>
  1050. {/block:HasTags}
  1051. </div>
  1052. </div>
  1053.  
  1054. <div class="postnote">
  1055. {block:PostNotes}{PostNotes}{/block:PostNotes}
  1056.  
  1057.  
  1058. {/block:Posts}
  1059.  
  1060.  
  1061. </div>
  1062.  
  1063.  
  1064.  
  1065. </div></div>
  1066.  
  1067.  
  1068. <!-- SCRIPTS -->
  1069.  
  1070. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  1071. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  1072.  
  1073. <script>
  1074. (function($){
  1075. $(document).ready(function(){
  1076. $("[title]").style_my_tooltips({
  1077. tip_follows_cursor:true,
  1078. tip_delay_time:90,
  1079. tip_fade_speed:600,
  1080. attribute:"title"});
  1081. });})(jQuery);
  1082. </script>
  1083.  
  1084. </div>
  1085.  
  1086.  
  1087.  
  1088.  
  1089. </body>
  1090.  
  1091. <div id="02" class="popup_block">
  1092. Inquire
  1093. <iframe id="ask_form" style="background-color: transparent; overflow: hidden;" src="http://www.tumblr.com/ask_form/sozosa.tumblr.com" frameborder="0" scrolling="yes" width="100%" height="200"></iframe>
  1094. </div></div></div></div></div></div></div></div></div></div>
  1095.  
  1096. <div id="03" class="popup_block">
  1097. Content Content Content examlple para;
  1098. <p><h2 style="-webkit-font-smoothing: antialiased; outline: none 0px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); margin: 0px 0px 15px; padding: 0px; border: 0px; font-family: Gibson, 'Helvetica Neue', HelveticaNeue, Helvetica, Arial, sans-serif; font-size: 20px; font-weight: 400; font-stretch: inherit; line-height: 26px; vertical-align: baseline; box-sizing: border-box;"><span style="-webkit-font-smoothing: antialiased; outline: none 0px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-size: inherit; font-style: inherit; font-variant: inherit; font-weight: bold; font-stretch: inherit; line-height: inherit; vertical-align: baseline; box-sizing: border-box;">月&ndash; What does Lleuae mean?</span></h2>
  1099. <blockquote>
  1100. <ul>
  1101. <li>Lleuae means&nbsp;&ldquo;Moon&rdquo; in welsh.&nbsp;</li>
  1102. Blach blah blah blah content content </ul> </blockquote>
  1103. ex picture <br>
  1104. <img src="https://40.media.tumblr.com/bb2110cc7a02757ce8da9ee7bc887cf0/tumblr_inline_nvb5mt4BiC1turt3p_500.png" /> tada
  1105. </div>
  1106.  
  1107. <div id="04" class="popup_block">
  1108. Content Content content
  1109. </div>
  1110.  
  1111. <div id="05" class="popup_block">
  1112. Content Content content
  1113. </div>
  1114.  
  1115. <div id="06" class="popup_block">
  1116. Content Content content
  1117. </div>
  1118.  
  1119. <div id="07" class="popup_block">
  1120. Content Content content
  1121. </div>
  1122.  
  1123.  
  1124. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
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!