API tools faq
paste
Advertisement
suuhleenah

Theme 1 by imitative

suuhleenah
Sep 17th, 2013
177
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 31.15 KB | None | 0 0
raw download clone embed print report
  1. <!--
  2. Theme 1 by Selena (imitative)
  3. This is my first ever edit! Please keep the credit! :)
  4. Enjoy the theme! :)
  5.  
  6. I ALREADY HAVE POPUP CODES LOADED IN, YOU JUST HAVE TO ADD THE TEXT PART!!
  7. -->
  8.  
  9. <html lang="en">
  10. <!DOCTYPE html PUBLIC"-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  11. <html xmlns="http://www.w3.org/1999/xhtml">
  12. <head>
  13. <script type="text/javascript"
  14. src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
  15. <script>
  16. $(document).ready(function() {
  17. //
  18. $('a.poplight[href^=#]').click(function() {
  19. var popID = $(this).attr('rel'); //Get Popup Name
  20. var popURL = $(this).attr('href'); //Get Popup href to define size
  21. var query= popURL.split('?');
  22. var dim= query[1].split('&');
  23. var popWidth = dim[0].split('=')[1]; //Gets the first query string value
  24. $('#' + popID).fadeIn().css({ 'width': Number( popWidth ) }).prepend('<a href="#" class="close"><img src="https://cdn1.iconfinder.com/data/icons/nuove/32x32/actions/fileclose.png" class="btn_close" title="Close" alt="Close" /></a>');
  25. var popMargTop = ($('#' + popID).height() + 80) / 2;
  26. var popMargLeft = ($('#' + popID).width() + 80) / 2;
  27. //Apply Margin to Popup
  28. $('#' + popID).css({
  29. 'margin-top' : -popMargTop,
  30. 'margin-left' : -popMargLeft
  31. });
  32. $('body').append('<div id="fade"></div>');
  33. $('#fade').css({'filter' : 'alpha(opacity=80)'}).fadeIn(); //Fade in the fade layer - .css({'filter' : 'alpha(opacity=80)'})
  34. return false;
  35. });
  36. $('a.close, #fade').live('click', function() {
  37. $('#fade , .popup_block').fadeOut(function() {
  38. $('#fade, a.close').remove(); //fade them both out
  39. });
  40. return false;
  41. });
  42. });
  43. </script>
  44.  
  45. <script type="text/javascript">
  46. <!--
  47.  
  48. // Disable Right Click Script
  49.  
  50. function IE(e)
  51. {
  52. if (navigator.appName == "Microsoft Internet Explorer" && (event.button == "2" || event.button == "3"))
  53. {
  54. return false;
  55. }
  56. }
  57. function NS(e)
  58. {
  59. if (document.layers || (document.getElementById && !document.all))
  60. {
  61. if (e.which == "2" || e.which == "3")
  62. {
  63. return false;
  64. }
  65. }
  66. }
  67. document.onmousedown=IE;document.onmouseup=NS;document.oncontextmenu=new Function("return false");
  68.  
  69. //-->
  70. </script>
  71.  
  72.  
  73. <script type="text/javascript"
  74. src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
  75.  
  76. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  77. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  78. <script>
  79. (function($){
  80. $(document).ready(function(){
  81. $("a[title]").style_my_tooltips({
  82. tip_follows_cursor:true,
  83. tip_delay_time:90,
  84. tip_fade_speed:600,
  85. attribute:"title"
  86. });
  87. });
  88. })(jQuery);
  89. </script>
  90.  
  91. <!--DEFAULT VARIABLES-->
  92. <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  93. <meta name="color:background" content="#fff"/>
  94. <meta name="color:link" content="#97c4ad"/>
  95. <meta name="color:text" content="#777"/>
  96. <meta name="color:back1" content="#bbb"/>
  97. <meta name="color:back2" content="#ddd"/>
  98. <meta name="color:title" content="#97c4ad"/>
  99. <meta name="color:bar 1" content="#E6FCD9"/>
  100. <meta name="color:bar 2" content="#CDF2D6"/>
  101. <meta name="color:bar 3" content="#CDF2D6"/>
  102. <meta name="color:bar 4" content="#E6FCD9"/>
  103. <meta name="color:bar 5" content="#E6FCD9"/>
  104. <meta name="color:bar 6" content="#CDF2D6"/>
  105. <meta name="color:scrollbar" content="#ccc"/>
  106. <meta name="color:box shadows" content="#ddd"/>
  107. <meta name="color:tooltip borders" content="#BFEDBE"/>
  108. <meta name="color:sidebar borders" content="#BFEDBE">
  109. <meta name="color:borders" content="#bbc9ba"/>
  110. <meta name="color:blogtitles" content="#97c4ad"/>
  111. <meta name="color:hover" content="#fff"/>
  112. <meta name="color:blogtitle shadows" content="#777"/>
  113. <meta name="image:sidebar" content="1"/>
  114. <meta name="image:sidebar 2" content="1"/>
  115. <meta name="image:sidebar 3" content="1"/>
  116. <meta name="image:background" content="1"/>
  117. <meta name="image:bar 1" content="1"/>
  118. <meta name="image:bar 2" content="1"/>
  119. <meta name="text:link one" content="link one"/>
  120. <meta name="text:link one hover" content="one"/>
  121. <meta name="text:link one title" content=".01"/>
  122. <meta name="text:link two" content="link two"/>
  123. <meta name="text:link two hover" content="two"/>
  124. <meta name="text:link two title" content=".02"/>
  125. <meta name="text:link three" content="link three"/>
  126. <meta name="text:link three hover" content="three"/>
  127. <meta name="text:link three title" content=".03"/>
  128. <meta name="text:link four" content="link four"/>
  129. <meta name="text:link four hover" content="four"/>
  130. <meta name="text:link four title" content=".04"/>
  131. <meta name="text:link five" content="link five"/>
  132. <meta name="text:link five hover" content="five"/>
  133. <meta name="text:link five title" content=".05"/>
  134. <meta name="text:link six" content="link six"/>
  135. <meta name="text:link six hover" content="six"/>
  136. <meta name="text:link six title" content=".06"/>
  137. <meta name="text:title 1" content="brokenhearted"/>
  138. <meta name="text:name" content="bob"/>
  139.  
  140. <style type="text/css">
  141.  
  142. #fade { /*--Transparent background layer--*/
  143. display: none; /*--hidden by default--*/
  144. background: #000;
  145. position: fixed; left: 0; top: 0;
  146. width: 100%; height: 100%;
  147. opacity: .80;
  148. z-index: 9999;
  149. }
  150. .popup_block{
  151. display: none; /*--hidden by default--*/
  152. background: #fcfbf8;
  153. padding: 10px;
  154. border: 5px solid #f2e7e2;
  155. float: left;
  156. font-size: 16;
  157. position: fixed;
  158. top: 50%; left: 50%;
  159. z-index: 99999;
  160. /*--CSS3 Box Shadows--*/
  161. -webkit-box-shadow: 0px 0px 20px #000;
  162. -moz-box-shadow: 0px 0px 20px #000;
  163. box-shadow: 0px 0px 20px #000;
  164. border-top: 8px inset #BFEDBE;
  165. border-bottom: 8px outset #BFEDBE;
  166. border-left: 8px outset #BFEDBE;
  167. border-right: 8px inset #BFEDBE;
  168. border-radius:25px 10px/ 10px 25px;
  169. }
  170. img.btn_close {
  171. float: right;
  172. margin: -20 -20px 0 0;
  173. }
  174. /*--Making IE6 Understand Fixed Positioning--*/
  175. *html #fade {
  176. position: absolute;
  177. }
  178. *html .popup_block {
  179. position: absolute;
  180. }
  181.  
  182. .animated{-webkit-animation-fill-mode:both;-moz-animation-fill-mode:both;-ms-animation-fill-mode:both;-o-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:1s;-moz-animation-duration:1s;-ms-animation-duration:1s;-o-animation-duration:1s;animation-duration:1s;}.animated.hinge{-webkit-animation-duration:2s;-moz-animation-duration:2s;-ms-animation-duration:2s;-o-animation-duration:2s;animation-duration:2s;}@-webkit-keyframes fadeIn {
  183.     0% {opacity: 0;}    100% {opacity: 1;}
  184. }
  185.  
  186. @-moz-keyframes fadeIn {
  187.         0% {opacity: 0;}      
  188.         100% {opacity: 1;}
  189. }
  190.  
  191. @-o-keyframes fadeIn {
  192.         0% {opacity: 0;}      
  193.         100% {opacity: 1;}
  194. }
  195.  
  196. @keyframes fadeIn {
  197.         0% {opacity: 0;}      
  198.         100% {opacity: 1;}
  199. }
  200.  
  201. .fadeIn {
  202.         -webkit-animation-name: fadeIn;
  203.         -moz-animation-name: fadeIn;
  204.         -o-animation-name: fadeIn;
  205.         animation-name: fadeIn;
  206. }
  207. @-webkit-keyframes fadeInDown {
  208.         0% {
  209.                 opacity: 0;
  210.                 -webkit-transform: translateY(-20px);
  211.         }
  212.        
  213.         100% {
  214.                 opacity: 1;
  215.                 -webkit-transform: translateY(0);
  216.         }
  217. }
  218.  
  219. @-moz-keyframes fadeInDown {
  220.         0% {
  221.                 opacity: 0;
  222.                 -moz-transform: translateY(-20px);
  223.         }
  224.        
  225.         100% {
  226.                 opacity: 1;
  227.                 -moz-transform: translateY(0);
  228.         }
  229. }
  230.  
  231. @-o-keyframes fadeInDown {
  232.         0% {
  233.                 opacity: 0;
  234.                 -o-transform: translateY(-20px);
  235.         }
  236.        
  237.         100% {
  238.                 opacity: 1;
  239.                 -o-transform: translateY(0);
  240.         }
  241. }
  242.  
  243. @keyframes fadeInDown {
  244.         0% {
  245.                 opacity: 0;
  246.                 transform: translateY(-20px);
  247.         }
  248.        
  249.         100% {
  250.                 opacity: 1;
  251.                 transform: translateY(0);
  252.         }
  253. }
  254.  
  255. .fadeInDown {
  256.         -webkit-animation-name: fadeInDown;
  257.         -moz-animation-name: fadeInDown;
  258.         -o-animation-name: fadeInDown;
  259.         animation-name: fadeInDown;
  260. }
  261. @-webkit-keyframes fadeInLeft {
  262.         0% {
  263.                 opacity: 0;
  264.                 -webkit-transform: translateX(-20px);
  265.         }
  266.        
  267.         100% {
  268.                 opacity: 1;
  269.                 -webkit-transform: translateX(0);
  270.         }
  271. }
  272.  
  273. @-moz-keyframes fadeInLeft {
  274.         0% {
  275.                 opacity: 0;
  276.                 -moz-transform: translateX(-20px);
  277.         }
  278.        
  279.         100% {
  280.                 opacity: 1;
  281.                 -moz-transform: translateX(0);
  282.         }
  283. }
  284.  
  285. @-o-keyframes fadeInLeft {
  286.         0% {
  287.                 opacity: 0;
  288.                 -o-transform: translateX(-20px);
  289.         }
  290.        
  291.         100% {
  292.                 opacity: 1;
  293.                 -o-transform: translateX(0);
  294.         }
  295. }
  296.  
  297. @keyframes fadeInLeft {
  298.         0% {
  299.                 opacity: 0;
  300.                 transform: translateX(-20px);
  301.         }
  302.        
  303.         100% {
  304.                 opacity: 1;
  305.                 transform: translateX(0);
  306.         }
  307. }
  308.  
  309. .fadeInLeft {
  310.         -webkit-animation-name: fadeInLeft;
  311.         -moz-animation-name: fadeInLeft;
  312.         -o-animation-name: fadeInLeft;
  313.         animation-name: fadeInLeft;
  314. }
  315.  
  316. #s-m-t-tooltip {
  317. max-width:300px;
  318. padding:3px 3px 3px 3px;
  319. margin:20px 0px 0px 20px;
  320. background: #fff; /* change the background color */
  321. font-family:consolas; /* change the font */
  322. font-style:italic;
  323. border-top: 2px inset #BFEDBE;
  324. border-bottom: 2px outset #BFEDBE;
  325. border-left: 2px outset #BFEDBE;
  326. border-right: 2px inset #BFEDBE;
  327. border-radius:25px 10px/ 10px 25px;
  328. font-size:14px;
  329. line-height:11px;
  330. letter-spacing:0px; /* change the letter spacing */
  331. text-transform:none; /* can be uppercase, lowercase, none*/
  332. color:{color:text}; /* change the text color */
  333. z-index:999999999999999999999999999999999999;
  334. }
  335.  
  336.  
  337.  
  338. iframe#tumblr_controls {right:2px !important; position: fixed !important;-webkit-transition: opacity 0.3s linear;opacity: 0.3;-webkit-transition: all 0.8s ease-out;-moz-
  339.  
  340. transition: all 0.8s ease-out;transition: all 0.8s ease-out;-webkit-filter: invert(100%);}
  341.  
  342. iframe#tumblr_controls:hover{-webkit-transition: opacity 0.7s linear;opacity: 0.8;-webkit-transition: all 0.4s ease-out;-moz-transition: all 0.4s ease-out;transition: all 0.4s ease-out;}
  343. p {
  344. margin:0px;
  345. margin-top:0px;
  346. }
  347.  
  348.  
  349. body {
  350. padding: 0px;
  351. margin: 0px;
  352. color:{color:text};
  353. font-family: calibri;
  354. line-height:13px;
  355. font-size:11px;
  356. background-color: {color:Background};
  357. background-image:url({image:Background});
  358. background-attachment: fixed;
  359. background-repeat: repeat;
  360. }
  361.  
  362.  
  363. a:link, a:active, a:visited{
  364. text-decoration: none;
  365. -webkit-transition: color 0.3s ease-out;
  366. -moz-transition: color 0.3s ease-out;
  367. transition: color 0.3s ease-out;
  368. color:{color:link};
  369. }
  370.  
  371. a:hover {
  372. text-decoration: none;
  373. font-style:;
  374. color: {color:Hover};
  375. }
  376.  
  377. div#center{
  378. margin:auto;
  379. position:relative;
  380. width:1000px;
  381. margin-left:275px;
  382. background-color:;
  383. overflow:auto;
  384. overflow-y:hidden;
  385. }
  386.  
  387.  
  388. /*CUSTOMIZE ENTRY SETTINGS HERE*/
  389. .entry {
  390. float:left;
  391. display: block;
  392. margin:8px;
  393. padding:10px;
  394. padding-bottom:7px;
  395. overflow:hidden;
  396. width:240px;
  397. box-shadow:0px 0px 2px {color:box shadows};
  398. {block:PermalinkPage}
  399. width:450px;
  400. text-align:left;
  401. line-height:13px;
  402. {/block:PermalinkPage}
  403. background:white;
  404. background-image:URL();
  405. }
  406.  
  407.  
  408. /*CUSTOMIZE THE APPEARANCE OF PERMALINKS*/
  409. .entry .perma{
  410. width:auto;
  411. height:20px;
  412. margin-left:0px;
  413. position: absolute;
  414. line-height: 20px;
  415. overflow:hidden;
  416. text-align:center;
  417. top:25px;
  418. left:-25px;
  419. border:1px solid #dbdbdb;
  420. border-left:0px;
  421. border-radius:0px 20px 20px 0px;
  422. font-size:15px;
  423. background:white;
  424. font-family:fighter;
  425. padding:4px;
  426. padding-top:2px;
  427. padding-bottom:2px;
  428. padding-left:6px;
  429. word-spacing:2px;
  430. letter-spacing:1px;
  431. opacity: 0.0;
  432. -webkit-transition: opacity .7s linear;
  433. -webkit-transition: all .7s ease-in-out;
  434. -moz-transition: all .7s ease-in-out;
  435. -o-transition: all .7s ease-in-out;
  436.  
  437. }
  438.  
  439. .entry:hover .perma{
  440. overflow:visible;
  441. opacity:1;
  442. left:0px;
  443. }
  444.  
  445.  
  446.  
  447. .entry .perma2{
  448. width:auto;
  449. height:20px;
  450. margin-left:0px;
  451. position: absolute;
  452. line-height: 20px;
  453. overflow:hidden;
  454. text-align:center;
  455. bottom:25px;
  456. right:-25px;
  457. border:1px solid #dbdbdb;
  458. border-left:0px;
  459. border-radius:20px 0px 0px 20px;
  460. font-size:15px;
  461. background:white;
  462. font-family:fighter;
  463. padding:4px;
  464. padding-top:2px;
  465. padding-bottom:2px;
  466. padding-left:6px;
  467. word-spacing:2px;
  468. letter-spacing:1px;
  469. opacity: 0.0;
  470. -webkit-transition: opacity .7s linear;
  471. -webkit-transition: all .7s ease-in-out;
  472. -moz-transition: all .7s ease-in-out;
  473. -o-transition: all .7s ease-in-out;
  474.  
  475. }
  476.  
  477. .entry:hover .perma2{
  478. overflow:visible;
  479. opacity:1;
  480. right:0px;
  481. }
  482.  
  483.  
  484. /*CUSTOMIZE POST POSITIONING AND STUFFZ HERE*/
  485. #posts {
  486. width:830px;
  487. margin-top:40px;
  488. z-index:99;
  489. margin-left:170px;
  490. right:auto;
  491. background:transparent;
  492. margin-right:auto;
  493. position:relative;
  494. overflow-y: hidden;
  495. -webkit-animation:fadeInDown 2s;
  496. -moz-animation:fadeInDown 2s;
  497. -ms-animation:fadeInDown 2s;
  498. }
  499.  
  500.  
  501. /*CUSTOMIZE SIDEBAR HERE*/
  502. #sidebar{
  503. position:fixed !important;
  504. width:270px;
  505. background:white;
  506. height:352px;
  507. margin-top:110px;
  508. font-size:11px;
  509. font-family:calibri;
  510. margin-left:-230px;
  511. border-top: 8px inset {color:sidebar borders};
  512. border-bottom: 8px outset {color:sidebar borders};
  513. border-left: 8px outset {color:sidebar borders};
  514. border-right: 8px inset {color:sidebar borders};
  515. border-radius:25px 10px/ 10px 25px;
  516. z-index:999;
  517. text-align:center;
  518. padding:20px;
  519. overflow:hidden;
  520. transition: all 0.7s ease-out;
  521. -o-transition-transition: all 0.7s ease-out;
  522. -webkit-transition: all 0.7s ease-out;
  523. -moz-transition: all 0.7s ease-out;
  524. -webkit-animation:fadeIn 2s;
  525. -moz-animation:fadeIn 2s;
  526. -ms-animation:fadeIn 2s;
  527. }
  528.  
  529.  
  530. #thing{
  531. height:352px;
  532. z-index:9;
  533. width:270px;
  534. margin-left:-20px;
  535. margin-top:0px;
  536. padding:20px;
  537. background:white;
  538. position:fixed;
  539. box-shadow:0px 0px 2px {color:box shadows};
  540. opacity:1;
  541. transition: all 0.7s ease-out;
  542. -o-transition-transition: all 0.7s ease-out;
  543. -webkit-transition: all 0.7s ease-out;
  544. -moz-transition: all 0.7s ease-out;
  545. }
  546.  
  547. #lacee{
  548. position:fixed;
  549. z-index:999;
  550. top:-10px;
  551. left:0px;
  552. width:100%;
  553. height:18px;
  554. opacity:0.9;
  555. border-top:20px solid white;
  556. background-image:url(http://static.tumblr.com/pbot8z9/fmKmqapgi/scallop.png);
  557. -webkit-animation:fadeInDown 2s;
  558. -moz-animation:fadeInDown 2s;
  559. -ms-animation:fadeInDown 2s;
  560. }
  561.  
  562.  
  563. #linee1{
  564. position:fixed;
  565. z-index:998;
  566. height:100%;
  567. width:10px;
  568. left:267.5px;
  569. top:0px;
  570. background:{color:bar 1};
  571. -webkit-animation:fadeInDown 2s;
  572. -moz-animation:fadeInDown 2s;
  573. -ms-animation:fadeInDown 2s;
  574. }
  575.  
  576. #linee2{
  577. position:fixed;
  578. z-index:998;
  579. height:100%;
  580. width:10px;
  581. left:247.5px;
  582. top:0px;
  583. background:{color:bar 2};
  584. -webkit-animation:fadeInDown 2s;
  585. -moz-animation:fadeInDown 2s;
  586. -ms-animation:fadeInDown 2s;
  587. }
  588.  
  589. #linee3{
  590. position:fixed;
  591. z-index:98;
  592. width:100%;
  593. height:10px;
  594. left:0px;
  595. top:560px;
  596. background:{color:bar 3};
  597. -webkit-animation:fadeInDown 2s;
  598. -moz-animation:fadeInDown 2s;
  599. -ms-animation:fadeInDown 2s;
  600. }
  601.  
  602. #linee4{
  603. position:fixed;
  604. z-index:98;
  605. width:100%;
  606. height:10px;
  607. left:0px;
  608. top:580px;
  609. background:{color:bar 4};
  610. -webkit-animation:fadeInDown 2s;
  611. -moz-animation:fadeInDown 2s;
  612. -ms-animation:fadeInDown 2s;
  613. }
  614.  
  615.  
  616. #linee5{
  617. position:fixed;
  618. z-index:998;
  619. height:100%;
  620. width:10px;
  621. left:1300px;
  622. top:0px;
  623. background:{color:bar 5};
  624. -webkit-animation:fadeInDown 2s;
  625. -moz-animation:fadeInDown 2s;
  626. -ms-animation:fadeInDown 2s;
  627. }
  628.  
  629. #linee6{
  630. position:fixed;
  631. z-index:998;
  632. height:100%;
  633. width:10px;
  634. left:1320px;
  635. top:0px;
  636. background:{color:bar 6};
  637. -webkit-animation:fadeInDown 2s;
  638. -moz-animation:fadeInDown 2s;
  639. -ms-animation:fadeInDown 2s;
  640. }
  641.  
  642. @font-face {font-family: "always in my heart"; src:url("http://static.tumblr.com/gfanhkr/S9hmphcld/always_in_my_heart.ttf");}
  643.  
  644. #blogtitle{
  645. opacity: 1;
  646. position:fixed !important;
  647. font-family: always in my heart;
  648. font-size:70px;
  649. line-height:30px;
  650. margin-top:75px;
  651. margin-left:-230px;
  652. width:500px;
  653. z-index:999999999999999999999999;
  654. color:{color:blogtitles};
  655. text-shadow:2px 2px 2px #8E978D;
  656. transition: all 0.7s ease-in-out;
  657. -o-transition-transition: all 0.7s ease-in-out;
  658. -webkit-transition: all 0.7s ease-in-out;
  659. -moz-transition: all 0.7s ease-in-out;
  660. }
  661.  
  662.  
  663.  
  664. #thing img{
  665. height:352px;
  666. width:270px;
  667. padding:6px;
  668. border:1px solid #e5e5e5;
  669. margin-top:-7px;
  670. margin-left:-7px;
  671. background:#f4f4f4;
  672. }
  673.  
  674. #sidebar:hover #thing{
  675. -webkit-transform: perspective(0) rotateY(-180deg) rotateX(-1deg);
  676. -webkit-transform-origin: 50% 100%;
  677. -moz-transform: perspective(0) rotateY(-180deg);
  678. -moz-transform-origin: 50% 100%;
  679. transition: all 1s ease-out;
  680. -o-transition-transition: all 1s ease-out;
  681. -webkit-transition: all 1s ease-out;
  682. -moz-transition: all 1s ease-out;
  683. opacity:0.9;
  684. z-index:0;
  685. }
  686.  
  687. #desc{
  688. width:125px;
  689. height: 167px;
  690. padding:5px;
  691. background:white;
  692. line-height:12px;
  693. margin-top:-357px;
  694. margin-left: 130px;
  695. border:1px solid {color:borders};
  696. }
  697.  
  698. #imgyay{
  699. width:125px;
  700. background:white;
  701. height:168px;
  702. padding:5px;
  703. margin-left: -135px;
  704. margin-top: -5px;
  705. border:1px solid {color:borders};
  706. }
  707.  
  708. #imgyay img{
  709. width:125px;
  710. height:167px;
  711. }
  712.  
  713. #imgyay2{
  714. width:125px;
  715. background:white;
  716. height:167px;
  717. padding:5px;
  718. margin-left: 130px;
  719. margin-top: 5px;
  720. border:1px solid {color:borders};
  721. }
  722.  
  723. #imgyay2 img{
  724. width:125px;
  725. height:167px;
  726. }
  727.  
  728.  
  729. #thing2{
  730. position:relative;
  731. padding:20px;
  732. opacity:1;
  733. width:270px;
  734. background:white;
  735. box-shadow:0px 0px 2px {color:box shadows};
  736. margin-top:-20px;
  737. margin-left:-20px;
  738. height:352px;
  739. -webkit-transform: perspective(0) rotateY(-180deg);
  740. -webkit-transform-origin: 50% 100%;
  741. -moz-transform: perspective(0) rotateY(-180deg);
  742. -moz-transform-origin: 50% 100%;
  743. transition: all 0.7s ease-out;
  744. -o-transition-transition: all 0.7s ease-out;
  745. -webkit-transition: all 0.7s ease-out;
  746. -moz-transition: all 0.7s ease-out;
  747. }
  748.  
  749. #sidebar:hover #thing2{
  750. opacity:1;
  751. z-index:9;
  752. -webkit-transform: perspective(0) rotateY(0deg);
  753. -webkit-transform-origin: 50% 100%;
  754. -moz-transform: perspective(0) rotateY(0deg);
  755. -moz-transform-origin: 50% 100%;
  756. transition: all 1s ease-out;
  757. -o-transition-transition: all 1s ease-out;
  758. -webkit-transition: all 1s ease-out;
  759. -moz-transition: all 1s ease-out;
  760. }
  761.  
  762. #link1{
  763. position:absolute;
  764. background:white;
  765. border:1px solid {Color:borders};
  766. height:59px;
  767. width:67.5px;
  768. margin-left:-6px;
  769. margin-top:-1px;
  770. line-height:60px;
  771. font-family:lubalin;
  772. font-size:16px;
  773. letter-spacing:1px;
  774. text-transform:lowercase;
  775. transition: all 0.5s ease-out;
  776. -o-transition-transition: all 0.5s ease-out;
  777. -webkit-transition: all 0.5s ease-out;
  778. -moz-transition: all 0.5s ease-out;
  779. }
  780. #link2{
  781. position:absolute;
  782. background:white;
  783. border:1px solid {Color:borders};
  784. height:59px;
  785. width:67.5px;
  786. margin-left:61.5px;
  787. margin-top:-1px;
  788. line-height:60px;
  789. font-family:lubalin;
  790. font-size:16px;
  791. letter-spacing:1px;
  792. text-transform:lowercase;
  793. transition: all 0.5s ease-out;
  794. -o-transition-transition: all 0.5s ease-out;
  795. -webkit-transition: all 0.5s ease-out;
  796. -moz-transition: all 0.5s ease-out;
  797. }
  798. #link3{
  799. position:absolute;
  800. background:white;
  801. border:1px solid {Color:borders};
  802. height:59px;
  803. width:67.5px;
  804. margin-left:-6px;
  805. margin-top:59px;
  806. line-height:60px;
  807. font-family:lubalin;
  808. font-size:16px;
  809. letter-spacing:1px;
  810. text-transform:lowercase;
  811. transition: all 0.5s ease-out;
  812. -o-transition-transition: all 0.5s ease-out;
  813. -webkit-transition: all 0.5s ease-out;
  814. -moz-transition: all 0.5s ease-out;
  815. }
  816. #link4{
  817. position:absolute;
  818. background:white;
  819. border:1px solid {Color:borders};
  820. height:59px;
  821. width:67.5px;
  822. margin-left:61.5px;
  823. margin-top:59px;
  824. line-height:60px;
  825. font-family:lubalin;
  826. font-size:16px;
  827. letter-spacing:1px;
  828. text-transform:lowercase;
  829. transition: all 0.5s ease-out;
  830. -o-transition-transition: all 0.5s ease-out;
  831. -webkit-transition: all 0.5s ease-out;
  832. -moz-transition: all 0.5s ease-out;
  833. }
  834. #link5{
  835. position:absolute;
  836. background:white;
  837. border:1px solid {Color:borders};
  838. height:59px;
  839. width:67.5px;
  840. margin-left:-6px;
  841. margin-top:119px;
  842. line-height:60px;
  843. font-family:lubalin;
  844. font-size:16px;
  845. letter-spacing:1px;
  846. text-transform:lowercase;
  847. transition: all 0.5s ease-out;
  848. -o-transition-transition: all 0.5s ease-out;
  849. -webkit-transition: all 0.5s ease-out;
  850. -moz-transition: all 0.5s ease-out;
  851. }
  852. #link6{
  853. position:absolute;
  854. background:white;
  855. border:1px solid {Color:borders};
  856. height:59px;
  857. width:67.5px;
  858. margin-left:61.5px;
  859. margin-top:119px;
  860. line-height:60px;
  861. font-family:lubalin;
  862. font-size:16px;
  863. letter-spacing:1px;
  864. text-transform:lowercase;
  865. transition: all 0.5s ease-out;
  866. -o-transition-transition: all 0.5s ease-out;
  867. -webkit-transition: all 0.5s ease-out;
  868. -moz-transition: all 0.5s ease-out;
  869. }
  870.  
  871. #link1:hover, #link2:hover,  #link3:hover,  #link4:hover,  #link5:hover,  #link6:hover{
  872. background:{color:borders};
  873. }
  874.  
  875. #cred{
  876. border:1px solid #ccc;
  877. position:fixed;
  878. left: 10px;
  879. bottom:4px;
  880. font-size:10px;
  881. width:auto;
  882. height:14px;
  883. padding-top:1px;
  884. line-height:12px;
  885. text-align:right;
  886. padding-right:2px;
  887. font-family:consolas;
  888. background:#ffffff;
  889. z-index:999999;
  890. -webkit-transition: opacity .7s linear;
  891. -webkit-transition: all .7s ease-in-out;
  892. -moz-transition: all .7s ease-in-out;
  893. -o-transition: all .7s ease-in-out;
  894. -webkit-animation:fadeInLeft 2s;
  895. -moz-animation:fadeInLeft 2s;
  896. -ms-animation:fadeInLeft 2s;
  897. }
  898.  
  899. #cred a:hover{
  900. color:{color:link};
  901. }
  902.  
  903.  
  904.  
  905. @font-face { font-family: "dixel"; src: url('http://static.tumblr.com/jdjsstr/8ovm78cbb/pf_arma_five_1_.ttf'); }
  906. @font-face { font-family: "aire"; src: url('http://static.tumblr.com/wkrmnwc/4cZmmv7w1/southernaire_personal_use_only.ttf'); }
  907. @font-face { font-family: "lubalin"; src: url('http://static.tumblr.com/gyoju49/nm1mo9g6c/meem19.ttf'); }
  908. @font-face { font-family: "good time"; src: url('http://static.tumblr.com/u37ad6e/bR1mb6f8o/kgalwaysagoodtime.ttf'); }
  909. @font-face { font-family: "neverletgo"; src: url('http://static.tumblr.com/q54tzar/o02m2jt6c/neverletgo_3_.ttf'); }
  910. @font-face { font-family:"fighter"; src: url('http://static.tumblr.com/ejm8w78/E7bmdzk1u/kgthefighter.ttf');,}
  911. @font-face {font-family: cedarville; src: url('http://static.tumblr.com/fxpo5zq/oefmes3gi/cedarville_pnkfun_1_cursive.ttf');}
  912. @font-face {font-family:shelter me; src: url('http://static.tumblr.com/pbot8z9/7Igmqm4bu/shelter_me_1_.ttf');}
  913.  
  914.  
  915. askk{
  916. font-family: fighter;
  917. font-size: 15px;
  918. text-transform:normal;
  919. text-align:left;
  920. letter-spacing: 1px;
  921. line height:15px;
  922. color: {color:link};
  923. z-index: 1;
  924. }
  925.  
  926.  
  927. /*CUSTOMIZE TITLE OF ENTRIES HERE*/
  928. .title{
  929. line-height: 22px;
  930. color:{color:Title};
  931. font-weight: normal;
  932. font-family:lubalin;
  933. font-size:22px;
  934. }
  935.  
  936.  
  937. /*CUSTOMIZE PERMALINKS OF TEXT POSTS AND SUCH HERE*/
  938. .permalink{
  939. text-transform: normal;
  940. display: block;
  941. text-align: right;
  942. text-transform:uppercase;
  943. font-size:8px;
  944. font-style:italic;
  945. text-decoration: none;
  946. margin-right:-50px;
  947. opacity:0;
  948. -webkit-transition: opacity .7s linear;
  949. -webkit-transition: all .7s ease-in-out;
  950. -moz-transition: all .7s ease-in-out;
  951. -o-transition: all .7s ease-in-out;
  952. }
  953.  
  954. .entry:hover .permalink{
  955. opacity:1;
  956. margin-right:0px;
  957. {block:permalinkpage}
  958. opacity:0;
  959. margin-right:-100px;
  960. {/block:permalinkpage}
  961. }
  962.  
  963.  
  964.  
  965. /*I RECCOMMEND TO NOT TOUCH ANY OF THIS LOLz*/
  966. #infscr-loading{
  967. bottom: -70px;
  968. position: absolute;
  969. left: 50%;
  970. margin-left:-8px;
  971. width:16px;
  972. height:11px;
  973. overflow:hidden;
  974. margin-bottom: 50px;
  975. }
  976.  
  977. #postnotes{
  978. text-align: justify;}
  979.  
  980. #postnotes blockquote{
  981. border: 0px;}
  982.  
  983. blockquote{
  984. padding:0px 0px 2px 5px;
  985. margin:0px 0px 2px 10px;
  986. border-left: 1px dotted #555555;
  987. }
  988.  
  989. blockquote p, ul{
  990. margin:0px;
  991. padding:0px;
  992. }
  993.  
  994. a img{border: 0px;}
  995.  
  996. ::-webkit-scrollbar-thumb{
  997. background-color: {color:scrollbar};
  998. border: 2px solid #ffffff;
  999. height:5px;
  1000. -moz-border-radius: 20px;
  1001. border-radius: 20px;
  1002. }
  1003.  
  1004. ::-webkit-scrollbar {
  1005. height:5px;
  1006. width:9px;
  1007. background-color: #aaaaaa;
  1008. border: 4px solid #fff;
  1009. }
  1010.  
  1011.  
  1012. ul, ol, li{list-style:none; margin:0px; padding:0px;}
  1013.  
  1014. .user_1 .label, .user_2 .label, .user_3 .label, .user_4 .label, .user_5 .label, .user_6 .label,
  1015. .user_7 .label, .user_8 .label, .user_9 .label {color:{color:text};}
  1016.  
  1017. .notes img{width:10px; position:relative; top:3px;}
  1018. <--ses-->
  1019. small{font-size: 90%;}
  1020.  
  1021. {CustomCSS}
  1022.  
  1023. </style>
  1024.  
  1025. {block:IndexPage}
  1026. <script type="text/javascript" src="http://static.tumblr.com/dbek3sy/iBElrgjim/jquerymasonry.js"></script>
  1027. <script type="text/javascript" src="http://static.tumblr.com/dbek3sy/Qyblrgjfn/jqueryinfintescroll.js"></script>
  1028.  
  1029. <script type="text/javascript">
  1030. $(window).load(function(){
  1031. var $wall = $('#posts');
  1032. $wall.imagesLoaded(function(){
  1033. $wall.masonry({
  1034. itemSelector: '.entry, .entry_photo',
  1035. isAnimated : false
  1036. });
  1037. });
  1038.  
  1039. $wall.infinitescroll({
  1040. navSelector : '#pagination',
  1041. nextSelector : '#pagination a',
  1042. itemSelector : '.entry, .entry_photo',
  1043. bufferPx : 2000,
  1044. debug : false,
  1045. errorCallback: function() {
  1046. $('#infscr-loading').fadeOut('normal');
  1047. }},
  1048. function( newElements ) {
  1049. var $newElems = $( newElements );
  1050. $newElems.hide();
  1051. $newElems.imagesLoaded(function(){
  1052. $wall.masonry( 'appended', $newElems,{isAnimated: false}, function(){$newElems.fadeIn('slow');} );
  1053. });
  1054. }); $('#posts').show(500);
  1055. });
  1056. </script>
  1057.  
  1058.  
  1059. {/block:IndexPage}
  1060.  
  1061.  
  1062. <title>{title}</title>
  1063.  
  1064. <link rel="shortcut icon" href="{Favicon}" />
  1065. <meta name="viewport" content="width=820" />
  1066. </head>
  1067.  
  1068. <body>
  1069. <BODY onselectstart="return false;" ondragstart="return false;">
  1070. <div class="wrapper">
  1071. <div class="header">
  1072. </div>
  1073.  
  1074. <div id="cage">
  1075. <div id="center">
  1076.  
  1077. <!--STUFF THAT GOES INTO THE SIDEBAR-->
  1078. <div id="blogtitle">{text:title 1}</div>
  1079. <div id="sidebar">
  1080. <center>
  1081. <div id="thing">
  1082. <img src="{image:sidebar}" width=100%>
  1083. </div>
  1084. <div id="thing2">
  1085. <div id="imgyay"><a href="/"><img src="{image:sidebar 2}" width=100%></a>
  1086. <div id="imgyay2"><a href="/"><img src="{image:sidebar 3}" width=100%></a>
  1087. </div>
  1088. <div id="desc">{description}</div>
  1089. <a href="{text:link one}" title="{text:link one hover}"><div id="link1">{text:link one title}</div></a>
  1090. <a href="{text:link two}" title="{text:link two hover}"><div id="link2">{text:link two title}</div></a>
  1091. <a href="{text:link three}" title="{text:link three hover}"><div id="link3">{text:link three title}</div></a>
  1092. <a href="{text:link four}" title="{text:link four hover}"><div id="link4">{text:link four title}</div></a>
  1093. <a href="{text:link five}" title="{text:link five hover}"><div id="link5">{text:link five title}</div></a>
  1094. <a href="{text:link six}" title="{text:link six hover}"><div id="link6">{text:link six title}</div></a>
  1095. </div>
  1096. </center>
  1097. </div>
  1098. <!------------------------------------->
  1099.  
  1100.  
  1101. <div class="left">
  1102. <div id="back1"></div>
  1103. <div id="back2"></div>
  1104. <div id="lacee"></div>
  1105. <div id="linee"></div>
  1106. <div id="linee1"></div>
  1107. <div id="linee2"></div>
  1108. <div id="linee3"></div>
  1109. <div id="linee4"></div>
  1110. <div id="linee5"></div>
  1111. <div id="linee6"></div>
  1112. <div id="posts">
  1113. {block:Posts}
  1114. <div class="entry">
  1115.  
  1116. {block:Text}{block:Title}<span class="title">{Title}</span>{/block:Title}<span class="body">{Body}</span><p align=right><span class="permalink"><a
  1117.  
  1118. href="{Permalink}"><a href="{Permalink}"><a href="{Permalink}">{timeago} &middot {notecountwithlabel}&nbsp</a></a><br>{/block:HasTags}</span></align>
  1119. {/block:Text}
  1120.  
  1121. {block:Link}<a href="{URL}" class="title">{Name}</a>{block:Description}<div class="body">{Description}</div>{/block:Description} <p align=right><span
  1122.  
  1123. class="permalink"><a href="{Permalink}">{timeago} &middot {notecountwithlabel}&nbsp</a> <a href="{Permalink}"></span></align>{block:Link}</a>
  1124.  
  1125. {block:Photo}
  1126. {block:IndexPage}
  1127. <center>
  1128. <div class="perma">
  1129. <a href="{ReblogURL}" target="_blank"> reblog </a>&middot <a href="{Permalink}">{notecountwithlabel}</a></div>
  1130. <div class="perma2">{timeago}</div>
  1131.  
  1132. <div class="photo"><a href="{permalink}"><img class="photo" src="{PhotoURL-HighRes}" alt="{PhotoAlt}" width="100%"/></a></div>
  1133. {/block:IndexPage}
  1134. {block:PermalinkPage}
  1135. {LinkOpenTag}<div class="photo"><a href="{permalink}"><img class="photo" src="{PhotoURL-HighRes}" alt="{PhotoAlt}" width="100%"/></a></div>
  1136.  
  1137. {LinkCloseTag}
  1138. {/block:PermalinkPage}
  1139. {/block:Photo}
  1140.  
  1141. {block:Photoset}
  1142. {block:IndexPage}
  1143. <center>
  1144.  
  1145. <div class="perma">
  1146. <a href="{ReblogURL}" target="_blank"> reblog </a>&middot <a href="{Permalink}">{notecountwithlabel}</a></div>
  1147.  
  1148. {Photoset-250}</center>
  1149. {/block:IndexPage}
  1150. {block:PermalinkPage}
  1151. <center>
  1152. {Photoset-500}</center>
  1153. {/block:PermalinkPage}
  1154. {/block:Photoset}
  1155.  
  1156. {block:Quote}<span class="title">"{Quote}"</span> — {block:Source}<b>{Source}</b>{/block:Source}<br><p align=right><span class="permalink"><a
  1157.  
  1158. href="{Permalink}">{timeago} &middot {notecountwithlabel}&nbsp</a> <a href="{Permalink}"> </span>{/block:Quote}
  1159.  
  1160. {block:Chat}{block:Title}<span class="title">{Title}</span>{/block:Title}
  1161. <ul class="chat">
  1162. {block:Lines}
  1163. <li class="user_{UserNumber}">
  1164. {block:Label}
  1165. <span class="label">{Label}</span>
  1166. {/block:Label}
  1167.  
  1168. {Line}
  1169. </li>
  1170. {/block:Lines}
  1171. <div class="permalink"><p align=right><a href="{Permalink}">{timeago} &middot {notecountwithlabel}&nbsp</a></div> <a href="{Permalink}"></span>
  1172. {/block:Chat}
  1173.  
  1174. {block:Audio}
  1175. <div style="width:200px; height:30px;">
  1176. {AudioPlayerWhite}
  1177. </div>
  1178. {block:IndexPage}<span class="permalink">
  1179. <div class="permalink"><p align=right><a href="{Permalink}">{timeago} &middot {notecountwithlabel}&nbsp</a></span></div>{/block:IndexPage}
  1180. {/block:Audio}
  1181.  
  1182. {block:Video}
  1183. {block:IndexPage}
  1184. <center>
  1185. <div class="perma">
  1186. <a href="{ReblogURL}" target="_blank"> reblog </a>&middot <a href="{Permalink}">{notecountwithlabel}</a></div>
  1187. {Video-250}</center>
  1188. {/block:IndexPage}
  1189. {block:PermalinkPage}
  1190. <center>
  1191. {Video-400}</center>
  1192. {/block:PermalinkPage}
  1193. {block:Video}
  1194.  
  1195. {block:Answer}
  1196. <div style="margin: 2px 3px 2px 3px; min-height:30px;border: 1px solid #dbdbdb; padding: 4px; background-color: #eee;">
  1197. <img src="{AskerPortraitURL-30}" width="30" align="left" style="margin-right:3px;"/>
  1198. <askk>{Asker}</askk>: {Question}</div>
  1199. <div style="padding: -1px 5px -1px 5px;background: transparent;"><center>{Answer}</center><askk><p align="right"><big>-{text:name}</big></p></askk></div>
  1200. <span class="permalink"><a href="{Permalink}">{NoteCountWithLabel}&nbsp</a></span>
  1201. {/block:Answer}
  1202.  
  1203.  
  1204. {block:PostNotes}<div align="middle">{caption}</div>
  1205. <center>
  1206.  
  1207. {block:NoteCount}{NoteCountWithLabel}<br>{/block:NoteCount}
  1208.  
  1209. {block:HasTags}
  1210. tags: {block:Tags}<a href="{TagURL}">{Tag}. </a>{/block:Tags}<br> {/block:HasTags}
  1211. {block:RebloggedFrom}
  1212. reblogged from <a href="{ReblogParentURL}">{ReblogParentName}</a><br>
  1213. posted by <a href="{ReblogRootURL}">{ReblogRootName}</a>
  1214.  
  1215. {/block:RebloggedFrom}
  1216. </center></span>
  1217. <br>
  1218. <div id="postnotes">{PostNotes}</div><br>
  1219.  
  1220. <center>{block:ContentSource}
  1221. <br><a href="{SourceURL}">
  1222. {lang:Source}:
  1223. {block:SourceLogo}
  1224. <img src="{BlackLogoURL}" width="{LogoWidth}"
  1225. height="{LogoHeight}" alt="{SourceTitle}" />
  1226. {/block:SourceLogo}
  1227. {block:NoSourceLogo}
  1228. {SourceLink}
  1229. {/block:NoSourceLogo}
  1230. </a>
  1231. {/block:ContentSource}</center>
  1232.  
  1233. {/block:PostNotes}
  1234. </div>
  1235. {/block:Posts}
  1236. </div></div>
  1237.  
  1238. {block:IndexPage}
  1239. {block:Pagination}
  1240. <div id="pagination">
  1241. {block:NextPage}
  1242. <a id="nextPage" href="{NextPage}"></a>
  1243. {/block:NextPage}
  1244. {block:PreviousPage}
  1245. <a href="{PreviousPage}"></a>
  1246. {/block:PreviousPage}
  1247. </div>
  1248. {/block:Pagination}
  1249. {/block:IndexPage}
  1250. </body>
  1251.  
  1252. </div>
  1253. </html>
  1254. <div id="cred"><a href="http://imitative.tumblr.com"><i>theme</i></a></div>
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!