Advertisement
briqhter

Theme IV

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