Advertisement
briqhter

Theme Three

Sep 4th, 2013
295
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 30.29 KB | None | 0 0
  1. <!--
  2. theme 3 by briqhter
  3. please do not remove the credit
  4. -->
  5.  
  6. <html lang="en">
  7. <!DOCTYPE html PUBLIC"-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  8. <html xmlns="http://www.w3.org/1999/xhtml">
  9.  
  10. <head>
  11.  
  12. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  13. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  14. <script>
  15. (function($){
  16. $(document).ready(function(){
  17. $("a[title]").style_my_tooltips({
  18. tip_follows_cursor:true,
  19. tip_delay_time:90,
  20. tip_fade_speed:600,
  21. attribute:"title"
  22. });
  23. });
  24. })(jQuery);
  25. </script>
  26. <script type="text/javascript"
  27. src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script><script type="text/javascript" src="http://static.tumblr.com/j67pgdq/a0gmqh0bn/hover.js"></script>
  28. <script type="text/javascript">
  29. <!--
  30.  
  31. // Disable Right Click Script
  32.  
  33. function IE(e)
  34. {
  35. if (navigator.appName == "Microsoft Internet Explorer" && (event.button == "2" || event.button == "3"))
  36. {
  37. return false;
  38. }
  39. }
  40. function NS(e)
  41. {
  42. if (document.layers || (document.getElementById && !document.all))
  43. {
  44. if (e.which == "2" || e.which == "3")
  45. {
  46. return false;
  47. }
  48. }
  49. }
  50. document.onmousedown=IE;document.onmouseup=NS;document.oncontextmenu=new Function("return false");
  51.  
  52. //-->
  53. </script>
  54.  
  55. <script type="text/javascript"
  56. src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
  57. <script>
  58. $(document).ready(function() {
  59. //
  60. $('a.poplight[href^=#]').click(function() {
  61. var popID = $(this).attr('rel'); //Get Popup Name
  62. var popURL = $(this).attr('href'); //Get Popup href to define size
  63. var query= popURL.split('?');
  64. var dim= query[1].split('&');
  65. var popWidth = dim[0].split('=')[1]; //Gets the first query string value
  66. $('#' + 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="Close Window" alt="Close"/></a>');
  67. var popMargTop = ($('#' + popID).height() + 80) / 2;
  68. var popMargLeft = ($('#' + popID).width() + 80) / 2;
  69. //Apply Margin to Popup
  70. $('#' + popID).css({
  71. 'margin-top' : -popMargTop,
  72. 'margin-left' : -popMargLeft
  73. });
  74. $('body').append('<div id="fade"></div>');
  75. $('#fade').css({'filter' : 'alpha(opacity=80)'}).fadeIn(); //Fade in the fade layer - .css({'filter' : 'alpha(opacity=80)'})
  76. return false;
  77. });
  78. $('a.close, #fade').live('click', function() {
  79. $('#fade , .popup_block').fadeOut(function() {
  80. $('#fade, a.close').remove(); //fade them both out
  81. });
  82. return false;
  83. });
  84. });
  85. </script>
  86.  
  87.  
  88. <script type="text/javascript"
  89. src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></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="#000"/>
  95. <meta name="color:title1" content="#d8bdfd"/>
  96. <meta name="color:title2" content="#692abe"/>
  97. <meta name="color:subtitles" content="#caa5fd"/>
  98. <meta name="color:lace" content="#caa5fd"/>
  99. <meta name="color:text" content="#777"/>
  100. <meta name="color:hover" content="#e4e2e2"/>
  101. <meta name="color:borders" content="#c9c9c9"/>
  102. <meta name="color:scrollbar" content="#c9c9c9"/>
  103. <meta name="color:name" content="#caa5fd"/>
  104. <meta name="color:permalink" content="#797878"/>
  105. <meta name="color:link message" content="#a187c5"/>
  106.  
  107. <meta name="image:sidebar" content="http://static.tumblr.com/bgzjy3u/CJfmravta/tumblr_mnbs66czxm1sqidmno1_500.png"/>
  108. <meta name="image:background" content="http://static.tumblr.com/j67pgdq/IHSmqoo9x/tumblr_m3sd2thac11qhxwq3.png"/>
  109.  
  110. <meta name="text:title1" content="You are so"/>
  111. <meta name="text:title2" content="Beautiful"/>
  112. <meta name="text:stats" content="5 // 7439"/>
  113. <meta name="text:music" content="music player"/>
  114. <meta name="text:name" content="- your name"/>
  115. <meta name="text:link1" content="/"/>
  116. <meta name="text:link2" content="/ask"/>
  117. <meta name="text:link3" content="/links"/>
  118. <meta name="text:link4" content="/"/>
  119. <meta name="text:link5" content="http://briqhter.tumblr.com"/>
  120. <meta name="text:link1 msg" content="home"/>
  121. <meta name="text:link2 msg" content="ask"/>
  122. <meta name="text:link3 msg" content="links"/>
  123. <meta name="text:link4 msg" content="idk"/>
  124. <meta name="text:link5 msg" content="theme by briqhter"/>
  125.  
  126.  
  127.  
  128. <style type="text/css">
  129.  
  130. ::-webkit-scrollbar-thumb{
  131. background-color: {color:scrollbar};
  132. border: 2px solid white;
  133. height:auto;
  134. -moz-border-radius: 10px;
  135. border-radius: 10px;
  136. }
  137.  
  138. ::-webkit-scrollbar {
  139. height:3px;
  140. width:3px;
  141. background-color:#aaa;
  142. }
  143.  
  144. #s-m-t-tooltip {
  145. max-width:300px;
  146. padding:3px;
  147. padding-left:5px;
  148. font-style:italic;
  149. margin:20px 0px 0px 20px;
  150. background: #fff; /* change the background color */
  151. border-left: 5px solid {color:link message};
  152. font-family:consolas; /* change the font */
  153. font-size:12px; /* change the font size */
  154. letter-spacing:0px; /* change the letter spacing */
  155. z-index:999999999999999999999999999999999999;
  156. }
  157.  
  158. #fade {
  159. display: none;
  160. background: #000000;
  161. position: fixed; left: 0; top: 0;
  162. width: 100%; height: 100%;
  163. opacity: .6;
  164. z-index: 9999;
  165. -webkit-animation:pulse 2s;
  166. -moz-animation:pulse 2s;
  167. -ms-animation:pulse 2s;
  168. }
  169.  
  170. .popup_block{
  171. font-size:12px;
  172. line-height:14px;
  173. display: none;
  174. background: #ffffff;
  175. border: 5px solid {color:borders};
  176. border-radius:15px;
  177. padding: 20px;
  178. float: left;
  179. position: fixed;
  180. top: 50%; left: 50%;
  181. z-index: 99999;
  182. transition: all 0.2s ease-out;
  183. -o-transition-transition: all 0.2s ease-out;
  184. -webkit-transition: all 0.2s ease-out;
  185. -moz-transition: all 0.2s ease-out;
  186. -webkit-animation:bounceIn 2s;
  187. -moz-animation:bounceIn 2s;
  188. -ms-animation:bounceIn 2s;
  189. }
  190.  
  191. img.btn_close {
  192. float: right;
  193. margin: -10px -10px 0 0;
  194. padding:6px;
  195. background:#ffffff;
  196. -webkit-border-radius: 100px;
  197. -moz-border-radius: 100px;
  198. border-radius: 100px;
  199. }
  200.  
  201. *html #fade {
  202. position: absolute;
  203. }
  204.  
  205. *html .popup_block {
  206. position: absolute;
  207. }
  208.  
  209. iframe#tumblr_controls {white-space:nowrap; filter: invert(100%); -webkit-filter: invert(100%); -moz-filter: invert(100%); -o-filter: invert(100%); -ms-filter: invert(100%);opacity:0.4;}
  210.  
  211. p {
  212. margin:0px;
  213. margin-top:0px;
  214. }
  215.  
  216.  
  217. body {
  218. padding: 0px;
  219. margin: 0px;
  220. color:{color:text};
  221. font-family: consolas;
  222. line-height:12px;
  223. font-size:10px;
  224. background-color: {color:Background};
  225. background-image:url({image:Background});
  226. background-attachment: fixed;
  227. background-repeat: repeat;
  228. }
  229.  
  230.  
  231. a:link, a:active, a:visited{
  232. text-decoration: none;
  233. -webkit-transition: color 0.3s ease-out;
  234. -moz-transition: color 0.3s ease-out;
  235. transition: color 0.3s ease-out;
  236. color:{color:link};
  237. }
  238.  
  239. a:hover {
  240. text-decoration: none;
  241. color: {color:Hover};
  242. }
  243.  
  244. div#center{
  245. margin:0px;
  246. position:relative;
  247. width:1500px;
  248. background-color:;
  249. overflow:visible;
  250. overflow-y:hidden;
  251. }
  252.  
  253. .ask{
  254. font-family: 'sig';
  255. text-align: left;
  256. letter-spacing: -2px;
  257. margin-top: -25px;
  258. margin-left: 20px;
  259. font-size:15px;
  260. color: {color:link};
  261. line-height: 20px;
  262. }
  263.  
  264. askk {
  265. font-family: 'sig';
  266. text-align: center;
  267. font-size:20px;
  268. color: {color:name};
  269. line-height: 5px;
  270. text-shadow: 1.5px 1px #ddd;
  271. }
  272.  
  273. /*CUSTOMIZE ENTRY SETTINGS HERE*/
  274. .entry {
  275. float:left;
  276. display: block;
  277. margin:10px;
  278. overflow:hidden;
  279. width:220px;
  280. padding:10px;
  281. border:1px solid {color:borders};
  282. {block:PermalinkPage}
  283. width:450px;
  284. text-align:left;
  285. line-height:10px;
  286. height:100%;
  287. {/block:PermalinkPage}
  288. background:white;
  289. background-image:URL();
  290. -webkit-animation:fadeInDown 2s;
  291. -moz-animation:fadeInDown 2s;
  292. -ms-animation:fadeInDown 2s;
  293. }
  294.  
  295. .entry .shade{
  296. width:220px;
  297. height:100%;
  298. position: absolute;
  299. overflow:hidden;
  300. margin-top:0px;
  301. margin-bottom:0px;
  302. margin-left:0px;
  303. margin-right:0px;
  304. background-color:#fff;
  305. opacity: 0.25;
  306. -webkit-transition: all 1s ease;
  307. -moz-transition: all 1s ease;
  308. -o-transition: all 1s ease;
  309. transition: all 1s ease;
  310. }
  311.  
  312. .entry:hover .shade{
  313. opacity:0;
  314. }
  315.  
  316. /*CUSTOMIZE THE APPEARANCE OF PERMALINKS*/
  317. .entry .perma{
  318. width:180px;
  319. padding:5px;
  320. height:auto;
  321. margin-left:10px;
  322. border-left: 5px solid {color:permalink};
  323. border-right: 5px solid {color:permalink};
  324. position: absolute;
  325. line-height: 10px;
  326. overflow:hidden;
  327. text-align:center;
  328. margin-top:10px;
  329. background:white;
  330. word-spacing:2px;
  331. letter-spacing:1px;
  332. opacity: 0;
  333. -webkit-transition: all 1s ease;
  334. -moz-transition: all 1s ease;
  335. -o-transition: all 1s ease;
  336. transition: all 1s ease;
  337. }
  338.  
  339. .entry:hover .perma{
  340. opacity: 0.95;
  341. }
  342.  
  343. .entry .reblogs{
  344. width:auto;
  345. padding:5px;
  346. height:auto;
  347. margin-left:10px;
  348. border-left: 5px solid {color:permalink};
  349. border-right: 5px solid {color:permalink};
  350. position: absolute;
  351. line-height: 10px;
  352. overflow:hidden;
  353. text-align:center;
  354. margin-top:20px;
  355. background:white;
  356. word-spacing:2px;
  357. letter-spacing:1px;
  358. opacity: 0;
  359. -webkit-transition: all .7s ease;
  360. -moz-transition: all .7s ease;
  361. -o-transition: all .7s ease;
  362. transition: all .7s ease;
  363. }
  364.  
  365. .entry:hover .reblogs{
  366. margin-top:40px;
  367. opacity: 0.9;
  368. }
  369.  
  370. #posts {
  371. z-index: 294789;
  372. width:790px;
  373. height:100%;
  374. margin-top:0px;
  375. z-index:99;
  376. padding:10px;
  377. padding-bottom:500px;
  378. margin-left:370px;
  379. border-left: 2px solid {color:lace};
  380. border-right: 2px solid {color:lace};
  381. right:auto;
  382. background:white;
  383. margin-right:auto;
  384. position:relative;
  385. overflow-y: hidden;
  386. }
  387.  
  388. #credit {
  389. z-index: 4783;
  390. position:fixed;
  391. bottom:5px;
  392. right:-65px;
  393. background:white;
  394. border: 1px solid #eee;
  395. padding: 7px;
  396. font-family: calibri;
  397. font-size: 15px;
  398. line-height: 15px;
  399. word-spacing:10px;
  400. transition: all 0.6s ease-out;
  401. -o-transition-transition: all 0.4s ease-out;
  402. -webkit-transition: all 0.4s ease-out;
  403. -moz-transition: all 0.4s ease-out;
  404. }
  405.  
  406. #credit:hover{
  407. opacity: 2;
  408. right:0px;
  409. transition: all 0.6s ease-out;
  410. -o-transition-transition: all 0.4s ease-out;
  411. -webkit-transition: all 0.4s ease-out;
  412. -moz-transition: all 0.4s ease-out;
  413. }
  414.  
  415. #sidebar{
  416. position:fixed !important;
  417. width:250px;
  418. z-index:10;
  419. border: 1px solid {color:borders};
  420. padding:10px;
  421. background:#fff;
  422. height:auto;
  423. margin-top:125px;
  424. margin-left:50px;
  425. text-align:center;
  426. -webkit-animation:fadeInDown 2s;
  427. -moz-animation:fadeInDown 2s;
  428. -ms-animation:fadeInDown 2s;
  429. }
  430.  
  431. #title1{
  432. z-index:4;
  433. position:fixed !important;
  434. opacity: 0;
  435. width:260px;
  436. padding:10px;
  437. background:transparent;
  438. height:auto;
  439. font-family:irish;
  440. color:{color:title1};
  441. text-align: left;
  442. font-size:50px;
  443. line-height:50px;
  444. margin-top:-80px;
  445. border-right: 0px;
  446. border-left: 0px;
  447. margin-left:-40px;
  448. transition: all 0.8s ease-out;
  449. -o-transition-transition: all 0.8s ease-out;
  450. -webkit-transition: all 0.8s ease-out;
  451. -moz-transition: all 0.8s ease-out;
  452. }
  453.  
  454. #sidebar:hover #title1{
  455. margin-left:-20px;
  456. opacity:1;
  457. }
  458.  
  459. #title2{
  460. z-index:4;
  461. position:fixed !important;
  462. opacity: 3;
  463. width:260px;
  464. padding:10px;
  465. background:transparent;
  466. height:auto;
  467. font-family:sig;
  468. color:{color:title2};
  469. font-size:30px;
  470. line-height:50px;
  471. margin-top:-50px;
  472. border-right: 0px;
  473. border-left: 0px;
  474. margin-left:0px;
  475. text-align:right;
  476. transition: all 0.8s ease-out;
  477. -o-transition-transition: all 0.8s ease-out;
  478. -webkit-transition: all 0.8s ease-out;
  479. -moz-transition: all 0.8s ease-out;
  480. }
  481.  
  482. #desctitle{
  483. z-index:2;
  484. position:fixed !important;
  485. opacity: 0;
  486. width:190px;
  487. background:transparent;
  488. height:auto;
  489. font-family:paris;
  490. color:{color:subtitles};
  491. font-size:40px;
  492. line-height:50px;
  493. margin-top:-248px;
  494. margin-left:30px;
  495. text-align:left;
  496. transition: all 0.8s ease-out;
  497. -o-transition-transition: all 0.8s ease-out;
  498. -webkit-transition: all 0.8s ease-out;
  499. -moz-transition: all 0.8s ease-out;
  500. }
  501.  
  502. #sidebar:hover #desctitle{
  503. opacity:0.85;
  504. }
  505.  
  506. #desc{
  507. position: fixed;
  508. height:60px;
  509. opacity:0;
  510. background:white;
  511. margin-top:-280px;
  512. margin-left:20px;
  513. width: 190px;
  514. padding:10px;
  515. padding-top:15px;
  516. padding-bottom:185px;
  517. transition: all 0.8s ease-out;
  518. -o-transition-transition: all 0.8s ease-out;
  519. -webkit-transition: all 0.8s ease-out;
  520. -moz-transition: all 0.8s ease-out;
  521. }
  522.  
  523. #sidebar:hover #desc{
  524. opacity:0.85;
  525. }
  526.  
  527. #linktitle{
  528. z-index:2;
  529. position:fixed !important;
  530. opacity: 0;
  531. width:190px;
  532. background:transparent;
  533. height:auto;
  534. font-family:paris;
  535. color:{color:subtitles};
  536. font-size:40px;
  537. line-height:50px;
  538. margin-top:-180px;
  539. margin-left:30px;
  540. text-align:right;
  541. transition: all 0.8s ease-out;
  542. -o-transition-transition: all 0.8s ease-out;
  543. -webkit-transition: all 0.8s ease-out;
  544. -moz-transition: all 0.8s ease-out;
  545. }
  546.  
  547. #sidebar:hover #linktitle{
  548. opacity:0.85;
  549. }
  550.  
  551.  
  552. #link1{
  553. z-index:3;
  554. position:fixed !important;
  555. opacity: 0;
  556. width:15px;
  557. padding:4px;
  558. background:white;
  559. height:15px;
  560. margin-top:-190px;
  561. border-radius:15px;
  562. border: 1px solid {color:borders};
  563. margin-left:30px;
  564. text-align:center;
  565. font-size:12px;
  566. line-height:15px;
  567. transition: all 0.8s ease-out;
  568. -o-transition-transition: all 0.8s ease-out;
  569. -webkit-transition: all 0.8s ease-out;
  570. -moz-transition: all 0.8s ease-out;
  571. }
  572.  
  573. #sidebar:hover #link1{
  574. opacity: 1;
  575. }
  576.  
  577. #link2{
  578. z-index:3;
  579. position:fixed !important;
  580. opacity: 0;
  581. width:15px;
  582. padding:4px;
  583. background:white;
  584. height:15px;
  585. margin-top:-190px;
  586. border-radius:15px;
  587. border: 1px solid {color:borders};
  588. margin-left:70px;
  589. text-align:center;
  590. font-size:12px;
  591. line-height:15px;
  592. transition: all 0.8s ease-out;
  593. -o-transition-transition: all 0.8s ease-out;
  594. -webkit-transition: all 0.8s ease-out;
  595. -moz-transition: all 0.8s ease-out;
  596. }
  597.  
  598. #sidebar:hover #link2{
  599. opacity: 1;
  600. }
  601.  
  602.  
  603. #link3{
  604. z-index:3;
  605. position:fixed !important;
  606. opacity: 0;
  607. width:15px;
  608. padding:4px;
  609. background:white;
  610. height:15px;
  611. margin-top:-190px;
  612. border-radius:15px;
  613. border: 1px solid {color:borders};
  614. margin-left:110px;
  615. text-align:center;
  616. font-size:12px;
  617. line-height:15px;
  618. transition: all 0.8s ease-out;
  619. -o-transition-transition: all 0.8s ease-out;
  620. -webkit-transition: all 0.8s ease-out;
  621. -moz-transition: all 0.8s ease-out;
  622. }
  623.  
  624. #sidebar:hover #link3{
  625. opacity: 1;
  626. }
  627.  
  628.  
  629. #link4{
  630. z-index:3;
  631. position:fixed !important;
  632. opacity: 0;
  633. width:15px;
  634. padding:4px;
  635. background:white;
  636. height:15px;
  637. margin-top:-190px;
  638. border-radius:15px;
  639. border: 1px solid {color:borders};
  640. margin-left:150px;
  641. text-align:center;
  642. font-size:12px;
  643. line-height:15px;
  644. transition: all 0.8s ease-out;
  645. -o-transition-transition: all 0.8s ease-out;
  646. -webkit-transition: all 0.8s ease-out;
  647. -moz-transition: all 0.8s ease-out;
  648. }
  649.  
  650. #sidebar:hover #link4{
  651. opacity: 1;
  652. }
  653.  
  654. #link5{
  655. z-index:3;
  656. position:fixed !important;
  657. opacity: 0;
  658. width:15px;
  659. padding:4px;
  660. background:white;
  661. height:15px;
  662. margin-top:-190px;
  663. border-radius:15px;
  664. border: 1px solid {color:borders};
  665. margin-left:190px;
  666. text-align:center;
  667. font-size:12px;
  668. line-height:15px;
  669. transition: all 0.8s ease-out;
  670. -o-transition-transition: all 0.8s ease-out;
  671. -webkit-transition: all 0.8s ease-out;
  672. -moz-transition: all 0.8s ease-out;
  673. }
  674.  
  675. #sidebar:hover #link5{
  676. opacity: 1;
  677. }
  678.  
  679. #extratitle{
  680. z-index:4;
  681. position:fixed !important;
  682. opacity: 0;
  683. width:190px;
  684. background:transparent;
  685. height:auto;
  686. font-family:paris;
  687. color:{color:subtitles};
  688. font-size:40px;
  689. line-height:50px;
  690. margin-top:-75px;
  691. margin-left:30px;
  692. text-align:left;
  693. transition: all 0.8s ease-out;
  694. -o-transition-transition: all 0.8s ease-out;
  695. -webkit-transition: all 0.8s ease-out;
  696. -moz-transition: all 0.8s ease-out;
  697. }
  698.  
  699. #sidebar:hover #extratitle{
  700. opacity:0.85;
  701. }
  702.  
  703.  
  704. #music{
  705. z-index:3;
  706. position:fixed !important;
  707. opacity: 0;
  708. width:140px;
  709. padding:2px;
  710. background:white;
  711. height:20px;
  712. margin-top:-120px;
  713. border: 1px solid {color:borders};
  714. margin-left:70px;
  715. text-align:center;
  716. font-size:12px;
  717. line-height:20px;
  718. transition: all 0.8s ease-out;
  719. -o-transition-transition: all 0.8s ease-out;
  720. -webkit-transition: all 0.8s ease-out;
  721. -moz-transition: all 0.8s ease-out;
  722. }
  723.  
  724. #sidebar:hover #music{
  725. opacity: 1;
  726. }
  727.  
  728. #playlist{
  729. z-index:3;
  730. position:fixed !important;
  731. opacity: 0;
  732. width:15px;
  733. padding:4px;
  734. background:white;
  735. height:15px;
  736. margin-top:-120px;
  737. border-radius:15px;
  738. border: 1px solid {color:borders};
  739. margin-left:30px;
  740. text-align:center;
  741. font-size:12px;
  742. line-height:15px;
  743. transition: all 0.8s ease-out;
  744. -o-transition-transition: all 0.8s ease-out;
  745. -webkit-transition: all 0.8s ease-out;
  746. -moz-transition: all 0.8s ease-out;
  747. }
  748.  
  749. #sidebar:hover #playlist{
  750. opacity: 1;
  751. }
  752.  
  753. #stats1{
  754. z-index:3;
  755. position:fixed !important;
  756. opacity: 0;
  757. width:140px;
  758. padding:2px;
  759. background:white;
  760. height:20px;
  761. margin-top:-90px;
  762. border: 1px solid {color:borders};
  763. margin-left:30px;
  764. text-align:center;
  765. font-size:12px;
  766. line-height:20px;
  767. transition: all 0.8s ease-out;
  768. -o-transition-transition: all 0.8s ease-out;
  769. -webkit-transition: all 0.8s ease-out;
  770. -moz-transition: all 0.8s ease-out;
  771. }
  772.  
  773. #sidebar:hover #stats1{
  774. opacity: 1;
  775. }
  776.  
  777. #updates{
  778. z-index:3;
  779. position:fixed !important;
  780. opacity: 0;
  781. width:15px;
  782. padding:4px;
  783. background:white;
  784. height:15px;
  785. margin-top:-90px;
  786. border-radius:15px;
  787. border: 1px solid {color:borders};
  788. margin-left:190px;
  789. text-align:center;
  790. font-size:12px;
  791. line-height:15px;
  792. transition: all 0.8s ease-out;
  793. -o-transition-transition: all 0.8s ease-out;
  794. -webkit-transition: all 0.8s ease-out;
  795. -moz-transition: all 0.8s ease-out;
  796. }
  797.  
  798. #sidebar:hover #updates{
  799. opacity: 1;
  800. }
  801.  
  802. #img{
  803. border:3px solid #f5dffd;
  804. padding:5px;
  805. transition: all 0.8s ease-out;
  806. -o-transition-transition: all 0.8s ease-out;
  807. -webkit-transition: all 0.8s ease-out;
  808. -moz-transition: all 0.8s ease-out;
  809. }
  810.  
  811. #sidebar:hover #img{
  812. opacity: 0.6;
  813. }
  814.  
  815. #lace1{
  816. z-index:10;
  817. position:fixed !important;
  818. height:100%;
  819. width:18px;
  820. margin-top:-5px;
  821. margin-left:352px;
  822. background-image:url('http://static.tumblr.com/bgzjy3u/Xl3mrnd50/haha.png');
  823. -webkit-animation:fadeInDownBig 3s;
  824. -moz-animation:fadeInDownBig 3s;
  825. -ms-animation:fadeInDownBig 3s;
  826. }
  827.  
  828. #lace2{
  829. z-index:10;
  830. position:fixed !important;
  831. height:100%;
  832. width:18px;
  833. margin-top:-5px;
  834. margin-left:1185px;
  835. background-image:url('http://static.tumblr.com/bgzjy3u/zxumrndb0/wawa.png');
  836. -webkit-animation:fadeInDownBig 3s;
  837. -moz-animation:fadeInDownBig 3s;
  838. -ms-animation:fadeInDownBig 3s;
  839. }
  840.  
  841.  
  842. /*FONTS FOR YOUR BLOG*/
  843.  
  844. @font-face { font-family: "sig"; src: url('http://static.tumblr.com/bgzjy3u/FN6mrpc8y/signerica_fat.ttf'); }
  845.  
  846. @font-face { font-family: "irish"; src: url('http://static.tumblr.com/nsunyax/RJSlz7y7g/kgluckoftheirish.ttf'); }
  847.  
  848. @font-face { font-family: "paris"; src: url('http://static.tumblr.com/bgzjy3u/RX5mrpccr/plaster_of_paris.ttf'); }
  849.  
  850.  
  851. /*CUSTOMIZE TITLE OF ENTRIES HERE*/
  852. .title{
  853. font-family: "sig";
  854. line-height: 20px;
  855. font-size: 18px;
  856. color:{color:Title};
  857. font-weight: normal;
  858. }
  859.  
  860.  
  861. /*CUSTOMIZE PERMALINKS OF TEXT POSTS AND SUCH HERE*/
  862. .permalink{
  863. text-transform: normal;
  864. display: block;
  865. text-align: right;
  866. text-decoration: none;
  867. }
  868.  
  869.  
  870. /*I RECCOMMEND TO NOT TOUCH ANY OF THIS LOLz*/
  871. #infscr-loading{
  872. bottom: -70px;
  873. position: absolute;
  874. left: 50%;
  875. margin-left:-8px;
  876. width:16px;
  877. height:11px;
  878. overflow:hidden;
  879. margin-bottom: 50px;
  880. }
  881.  
  882. #postnotes{
  883. text-align: justify;
  884. }
  885.  
  886. #postnotes blockquote{
  887. border: 0px;}
  888.  
  889. blockquote{
  890. padding:0px 0px 2px 5px;
  891. margin:0px 0px 2px 10px;
  892. border-left: 1px dotted #555555;
  893. }
  894.  
  895. blockquote p, ul{
  896. margin:0px;
  897. padding:0px;
  898. }
  899.  
  900. a img{border: 0px;}
  901.  
  902.  
  903. ul, ol, li{list-style:none; margin:0px; padding:0px;}
  904.  
  905. .user_1 .label, .user_2 .label, .user_3 .label, .user_4 .label, .user_5 .label, .user_6 .label,
  906. .user_7 .label, .user_8 .label, .user_9 .label {color:{color:text};}
  907.  
  908. .notes img{width:10px; position:relative; top:3px;}
  909. <--ses-->
  910. small{font-size: 90%;}
  911.  
  912. @-webkit-keyframes fadeInDown {
  913. 0% {
  914. opacity: 0;
  915. -webkit-transform: translateY(-20px);
  916. }
  917.  
  918. 100% {
  919. opacity: 1;
  920. -webkit-transform: translateY(0);
  921. }
  922. }
  923.  
  924. @-moz-keyframes fadeInDown {
  925. 0% {
  926. opacity: 0;
  927. -moz-transform: translateY(-20px);
  928. }
  929.  
  930. 100% {
  931. opacity: 1;
  932. -moz-transform: translateY(0);
  933. }
  934. }
  935.  
  936. @-ms-keyframes fadeInDown {
  937. 0% {
  938. opacity: 0;
  939. -ms-transform: translateY(-20px);
  940. }
  941.  
  942. 100% {
  943. opacity: 1;
  944. -ms-transform: translateY(0);
  945. }
  946. }
  947.  
  948. @-o-keyframes fadeInDown {
  949. 0% {
  950. opacity: 0;
  951. -ms-transform: translateY(-20px);
  952. }
  953.  
  954. 100% {
  955. opacity: 1;
  956. -ms-transform: translateY(0);
  957. }
  958. }
  959.  
  960. @keyframes fadeInDown {
  961. 0% {
  962. opacity: 0;
  963. transform: translateY(-20px);
  964. }
  965.  
  966. 100% {
  967. opacity: 1;
  968. transform: translateY(0);
  969. }
  970. }
  971.  
  972. .fadeInDown {
  973. -webkit-animation-name: fadeInDown;
  974. -moz-animation-name: fadeInDown;
  975. -ms-animation-name: fadeInDown;
  976. -o-animation-name: fadeInDown;
  977. animation-name: fadeInDown;
  978. }
  979.  
  980. @-webkit-keyframes fadeInDownBig {
  981. 0% {
  982. opacity: 0;
  983. -webkit-transform: translateY(-2000px);
  984. }
  985.  
  986. 100% {
  987. opacity: 1;
  988. -webkit-transform: translateY(0);
  989. }
  990. }
  991.  
  992. @-moz-keyframes fadeInDownBig {
  993. 0% {
  994. opacity: 0;
  995. -moz-transform: translateY(-2000px);
  996. }
  997.  
  998. 100% {
  999. opacity: 1;
  1000. -moz-transform: translateY(0);
  1001. }
  1002. }
  1003.  
  1004. @-ms-keyframes fadeInDownBig {
  1005. 0% {
  1006. opacity: 0;
  1007. -ms-transform: translateY(-2000px);
  1008. }
  1009.  
  1010. 100% {
  1011. opacity: 1;
  1012. -ms-transform: translateY(0);
  1013. }
  1014. }
  1015.  
  1016. @-o-keyframes fadeInDownBig {
  1017. 0% {
  1018. opacity: 0;
  1019. -o-transform: translateY(-2000px);
  1020. }
  1021.  
  1022. 100% {
  1023. opacity: 1;
  1024. -o-transform: translateY(0);
  1025. }
  1026. }
  1027.  
  1028. @keyframes fadeInDownBig {
  1029. 0% {
  1030. opacity: 0;
  1031. transform: translateY(-2000px);
  1032. }
  1033.  
  1034. 100% {
  1035. opacity: 1;
  1036. transform: translateY(0);
  1037. }
  1038. }
  1039.  
  1040. .fadeInDownBig {
  1041. -webkit-animation-name: fadeInDownBig;
  1042. -moz-animation-name: fadeInDownBig;
  1043. -ms-animation-name: fadeInDownBig;
  1044. -o-animation-name: fadeInDownBig;
  1045. animation-name: fadeInDownBig;
  1046. }
  1047.  
  1048. @-webkit-keyframes bounceIn {
  1049. 0% {
  1050. opacity: 0;
  1051. -webkit-transform: scale(.3);
  1052. }
  1053.  
  1054. 50% {
  1055. opacity: 1;
  1056. -webkit-transform: scale(1.05);
  1057. }
  1058.  
  1059. 70% {
  1060. opacity: 1;
  1061. -webkit-transform: scale(.9);
  1062. }
  1063.  
  1064. 100% {
  1065. opacity: 1;
  1066. -webkit-transform: scale(1);
  1067. }
  1068. }
  1069.  
  1070. @-moz-keyframes bounceIn {
  1071. 0% {
  1072. opacity: 0;
  1073. -moz-transform: scale(.3);
  1074. }
  1075.  
  1076. 50% {
  1077. opacity: 1;
  1078. -moz-transform: scale(1.05);
  1079. }
  1080.  
  1081. 70% {
  1082. opacity: 1;
  1083. -moz-transform: scale(.9);
  1084. }
  1085.  
  1086. 100% {
  1087. opacity: 1;
  1088. -moz-transform: scale(1);
  1089. }
  1090. }
  1091.  
  1092. @-ms-keyframes bounceIn {
  1093. 0% {
  1094. opacity: 0;
  1095. -ms-transform: scale(.3);
  1096. }
  1097.  
  1098. 50% {
  1099. opacity: 1;
  1100. -ms-transform: scale(1.05);
  1101. }
  1102.  
  1103. 70% {
  1104. opacity: 1;
  1105. -ms-transform: scale(.9);
  1106. }
  1107.  
  1108. 100% {
  1109. opacity: 1;
  1110. -ms-transform: scale(1);
  1111. }
  1112. }
  1113.  
  1114. @-o-keyframes bounceIn {
  1115. 0% {
  1116. opacity: 0;
  1117. -o-transform: scale(.3);
  1118. }
  1119.  
  1120. 50% {
  1121. opacity: 1;
  1122. -o-transform: scale(1.05);
  1123. }
  1124.  
  1125. 70% {
  1126. opacity: 1;
  1127. -o-transform: scale(.9);
  1128. }
  1129.  
  1130. 100% {
  1131. opacity: 1;
  1132. -o-transform: scale(1);
  1133. }
  1134. }
  1135.  
  1136. @keyframes bounceIn {
  1137. 0% {
  1138. opacity: 0;
  1139. transform: scale(.3);
  1140. }
  1141.  
  1142. 50% {
  1143. opacity: 1;
  1144. transform: scale(1.05);
  1145. }
  1146.  
  1147. 70% {
  1148. opacity: 1;
  1149. transform: scale(.9);
  1150. }
  1151.  
  1152. 100% {
  1153. opacity: 1;
  1154. transform: scale(1);
  1155. }
  1156. }
  1157.  
  1158. .bounceIn {
  1159. -webkit-animation-name: bounceIn;
  1160. -moz-animation-name: bounceIn;
  1161. -ms-animation-name: bounceIn;
  1162. -o-animation-name: bounceIn;
  1163. animation-name: bounceIn;
  1164. }
  1165.  
  1166. {CustomCSS}
  1167.  
  1168. </style>
  1169.  
  1170. {block:IndexPage}
  1171. <script type="text/javascript" src="http://static.tumblr.com/dbek3sy/iBElrgjim/jquerymasonry.js"></script>
  1172. <script type="text/javascript" src="http://static.tumblr.com/dbek3sy/Qyblrgjfn/jqueryinfintescroll.js"></script>
  1173.  
  1174. <script type="text/javascript">
  1175. $(window).load(function(){
  1176. var $wall = $('#posts');
  1177. $wall.imagesLoaded(function(){
  1178. $wall.masonry({
  1179. itemSelector: '.entry, .entry_photo',
  1180. isAnimated : false
  1181. });
  1182. });
  1183.  
  1184. $wall.infinitescroll({
  1185. navSelector : '#pagination',
  1186. nextSelector : '#pagination a',
  1187. itemSelector : '.entry, .entry_photo',
  1188. bufferPx : 2000,
  1189. debug : false,
  1190. errorCallback: function() {
  1191. $('#infscr-loading').fadeOut('normal');
  1192. }},
  1193. function( newElements ) {
  1194. var $newElems = $( newElements );
  1195. $newElems.hide();
  1196. $newElems.imagesLoaded(function(){
  1197. $wall.masonry( 'appended', $newElems,{isAnimated: false}, function(){$newElems.fadeIn('slow');} );
  1198. });
  1199. }); $('#posts').show(500);
  1200. });
  1201. </script>
  1202.  
  1203.  
  1204. {/block:IndexPage}
  1205.  
  1206.  
  1207. <title>{title}</title>
  1208.  
  1209. <link rel="shortcut icon" href="{Favicon}" />
  1210. <meta name="viewport" content="width=820" />
  1211. </head>
  1212.  
  1213. <body>
  1214. <BODY onselectstart="return false;" ondragstart="return false;">
  1215. <div class="wrapper">
  1216. <div class="header">
  1217. </div>
  1218.  
  1219. <div id="cage">
  1220. <div id="center">
  1221.  
  1222.  
  1223. <div id="lace1"></div>
  1224. <div id="lace2"></div>
  1225. <div id="credit">© <a href="http://briqhter.tumblr.com">briqhter</a></center></div>
  1226.  
  1227. <!--STUFF THAT GOES INTO THE SIDEBAR-->
  1228. <div id="sidebar">
  1229. <center>
  1230. <div id="title1">{text:title1}</div>
  1231. <div id="title2">{text:title2}</div>
  1232. <div id="img"><img src="{image:sidebar}" width="100%" height="280px"></div>
  1233.  
  1234. <div id="desctitle">Description</div>
  1235. <div id="desc">{description}</div>
  1236. <div id="linktitle">Links</div>
  1237. <div id="link1"><a href="{text:link1}" title="{text:link1 msg}">1.</a></div>
  1238. <div id="link2"><a href="{text:link2}" title="{text:link2 msg}">2.</a></div>
  1239. <div id="link3"><a href="{text:link3}" title="{text:link3 msg}">3.</a></div>
  1240. <div id="link4"><a href="{text:link4}" title="{text:link4 msg}">4.</a></div>
  1241. <div id="link5"><a href="{text:link5}" title="{text:link5 msg}">5.</a></div>
  1242.  
  1243. <div id="extratitle">Extras</div>
  1244. <div id="music">{text:music}</div>
  1245. <div id="playlist"><a href="#?w=500" rel="songs" class="poplight" title="playlist">♪</a></div>
  1246. <div id="stats1">{text:stats}</div>
  1247. <div id="updates"><a href="#?w=500" rel="dates" class="poplight" title="updates">♥</a></div>
  1248.  
  1249. </center>
  1250. </div>
  1251. <!------------------------------------->
  1252.  
  1253.  
  1254. <div class="left">
  1255.  
  1256. <div id="posts">
  1257. {block:Posts}
  1258. <div class="entry">
  1259.  
  1260. {block:Text}{block:Title}<span class="title">{Title}</span>{/block:Title}<span class="body">{Body}</span><p align=right><span class="permalink">{timeago} with<a href="{Permalink}"> {notecountwithlabel}</a><br>{/block:HasTags}</span></align>
  1261. {/block:Text}
  1262.  
  1263. {block:Link}<a href="{URL}" class="title">{Name}</a>{block:Description}<div class="body">{Description}</div>{/block:Description} <p align=right><span
  1264.  
  1265. class="permalink">{timeago} with <a href="{Permalink}">{notecountwithlabel}</a></span></align>{block:Link}
  1266.  
  1267. {block:Answer}
  1268. <div style="margin: 5px 2px 1px 10px; min-height:40px; border: 1px solid {color:borders}; padding: 3px; background-color: #fff;">
  1269. <img src="{AskerPortraitURL-30}" width="30" border-align="left" style="margin-left:-15px; margin-top:-10px; border: 1px solid #ddd; border-radius: 15px;"/>
  1270. <div class="ask">{Asker}:</div></p>
  1271. <div style="padding-left:15px;">{Question}</div></div><br>
  1272. <div style="padding: -1px 5px -1px 5px; background: transparent;"><center>{Answer}</center></div> <br><div style="text-align: right;"><askk>{text:name}</askk><hr size=1></div>
  1273. <P ALIGN=Right>{timeago} with <a href="{Permalink}">{notecountwithlabel}</a>
  1274. {/block:Answer}
  1275.  
  1276. {block:Photo}
  1277. {block:IndexPage}
  1278. <center>
  1279. <div class="shade"></div>
  1280. <div class="perma">
  1281. <a href="{Permalink}" target="_blank">{notecountwithlabel}</a> | <a href="{ReblogURL}" target="_blank"> reblog </a></div>
  1282.  
  1283. <div class="photo"><a href="{permalink}"><img class="photo" src="{PhotoURL-HighRes}" alt="{PhotoAlt}" width="100%"/></a></div>
  1284. {/block:IndexPage}
  1285. {block:PermalinkPage}
  1286. {LinkOpenTag}<div class="photo"><a href="{permalink}"><img class="photo" src="{PhotoURL-HighRes}" alt="{PhotoAlt}" width="100%"/></a></div>
  1287.  
  1288. {LinkCloseTag}
  1289. {/block:PermalinkPage}
  1290. {/block:Photo}
  1291.  
  1292. {block:Photoset}
  1293. {block:IndexPage}
  1294. <center>
  1295.  
  1296. <div class="perma">
  1297. <a href="{Permalink}" target="_blank">{notecountwithlabel}</a></div>
  1298. <div class="reblogs">
  1299. <a href="{ReblogURL}" target="_blank"> reblog </a></div>
  1300.  
  1301. {Photoset-250}</center>
  1302. {/block:IndexPage}
  1303. {block:PermalinkPage}
  1304. <center>
  1305. {Photoset-500}</center>
  1306. {/block:PermalinkPage}
  1307. {/block:Photoset}
  1308.  
  1309. {block:Quote}<span class="title">"{Quote}"</span> — {block:Source}<b>{Source}</b>{/block:Source}<br><p align=right><span class="permalink"><a href="{Permalink}">{notecountwithlabel}</a> </span>{/block:Quote}
  1310.  
  1311. {block:Chat}{block:Title}<span class="title">{Title}</span>{/block:Title}
  1312. <ul class="chat">
  1313. {block:Lines}
  1314. <li class="user_{UserNumber}">
  1315. {block:Label}
  1316. <span class="label">{Label}</span>
  1317. {/block:Label}
  1318.  
  1319. {Line}
  1320. </li>
  1321. {/block:Lines}
  1322. <p align=right><span class="permalink">{timeago} with <a href="{Permalink}">{notecountwithlabel}</a></span>
  1323. {/block:Chat}
  1324.  
  1325. {block:Audio}
  1326. <div style="width:200px; height:30px;">
  1327. {AudioPlayerBlack}
  1328. </div>
  1329. {block:IndexPage}
  1330. <p align=right><span class="permalink">{timeago} with <a href="{Permalink}">{notecountwithlabel}</a></span>
  1331. {/block:IndexPage}
  1332. {/block:Audio}
  1333.  
  1334. {block:Video}
  1335. {block:IndexPage}
  1336. <center>
  1337. {Video-250}</center>
  1338. {/block:IndexPage}
  1339. {block:PermalinkPage}
  1340. <center>
  1341. {Video-400}</center>
  1342. {/block:PermalinkPage}
  1343. <p align=right><span class="permalink">{timeago} with <a href="{Permalink}">{notecountwithlabel}</a></span>
  1344. {block:Video}
  1345.  
  1346.  
  1347. {block:PostNotes}<div align="middle">{caption}</div>
  1348. <center>
  1349.  
  1350. {block:NoteCount}{NoteCountWithLabel}<br>{/block:NoteCount}
  1351.  
  1352. {block:HasTags}
  1353. tags: {block:Tags}<a href="{TagURL}">#{Tag} </a>{/block:Tags}<br> {/block:HasTags}
  1354. {block:RebloggedFrom}
  1355. reblogged from <a href="{ReblogParentURL}">{ReblogParentName}</a>
  1356. {/block:RebloggedFrom}
  1357. </center></span>
  1358. <br>
  1359. <div id="postnotes">{PostNotes}</div><br>
  1360.  
  1361. <center>{block:ContentSource}
  1362. <br><a href="{SourceURL}">
  1363. {lang:Source}:
  1364. {block:SourceLogo}
  1365. <img src="{BlackLogoURL}" width="{LogoWidth}"
  1366. height="{LogoHeight}" alt="{SourceTitle}" />
  1367. {/block:SourceLogo}
  1368. {block:NoSourceLogo}
  1369. {SourceLink}
  1370. {/block:NoSourceLogo}
  1371. </a>
  1372. {/block:ContentSource}</center>
  1373.  
  1374. {/block:PostNotes}
  1375. </div>
  1376. {/block:Posts}
  1377.  
  1378. </div></div>
  1379.  
  1380. {block:IndexPage}
  1381. {/block:IndexPage}
  1382. </body>
  1383.  
  1384. <div id="songs" class="popup_block">
  1385.  
  1386. <center><font size="7" face="paris">Playlist</font></center></br></br>
  1387. ♡ Put the songs that are on your music player here</br>
  1388. ♡ For Example</br>
  1389. ♡ Top Of The World - The All-American Rejects</br>
  1390. ♡ Best Song Ever - One Direction</br>
  1391. ♡ Bad - The Cab</br>
  1392. ♡ Preacher - One Republic</br>
  1393.  
  1394. </div>
  1395.  
  1396. <div id="dates" class="popup_block">
  1397.  
  1398. <center><font size="7" face="paris">Updates</font></center></br></br>
  1399. ♡ Here you can put your updates</br>
  1400. ♡ For Example</br>
  1401. ♡ 18 August - Writing this update</br>
  1402. ♡ 18 August - Sobbing bc summer in the city</br>
  1403. ♡ 18 August - Listening to Preacher</br>
  1404. ♡ 18 August - Still sobbing bc summer in the city</br>
  1405.  
  1406. </div>
  1407.  
  1408. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement