Advertisement
uhnlikely

Harry Theme (02) by Uhnlikely

Jan 5th, 2014
1,247
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 27.78 KB | None | 0 0
  1. <!-- ------------------------------------------------------------------
  2.  
  3.  
  4. Harry Theme by Uhnlikely.
  5. This theme was originally created by Immersings
  6. and was edited by Uhnlikely.
  7. Leave credit and enjoy!
  8.  
  9. ---------------------------------------------------------------------->
  10.  
  11. <html lang="en">
  12. <html xmlns="http://www.w3.org/1999/xhtml">
  13. <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
  14. <script language="JavaScript" src="http://dl.dropbox.com/u/3173073/GothicDarkness/qTip.js" type="text/JavaScript"></script>
  15.  
  16. <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
  17. <link rel="shortcut icon" href="http://media.tumblr.com/tumblr_m230u4hIC11qfamg6.gif">
  18.  
  19. <script>
  20.  
  21. $(document).ready(function(){
  22. $("#flip").click(function(){
  23. $("#panel").slideToggle("fast");
  24. });
  25. });fav
  26. </script>
  27.  
  28. <script>
  29. $(function() {
  30.  
  31. var $el, leftPos, newWidth,
  32. $mainNav = $("#example-one");
  33.  
  34. $mainNav.append("<li id='magic-line'></li>");
  35. var $magicLine = $("#magic-line");
  36.  
  37. $magicLine
  38. .width($(".current_page_item").width())
  39. .css("left", $(".current_page_item a").position().left)
  40. .data("origLeft", $magicLine.position().left)
  41. .data("origWidth", $magicLine.width());
  42.  
  43. $("#example-one li a").hover(function() {
  44. $el = $(this);
  45. leftPos = $el.position().left;
  46. newWidth = $el.parent().width();
  47. $magicLine.stop().animate({
  48. left: leftPos,
  49. width: newWidth
  50. });
  51. }, function() {
  52. $magicLine.stop().animate({
  53. left: $magicLine.data("origLeft"),
  54. width: $magicLine.data("origWidth")
  55. });
  56. });
  57. });
  58. </script>
  59.  
  60.  
  61. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
  62. </div><script type="text/javascript" src="http://static.tumblr.com/ikeq9mi/DfYl6o46t/scrolltotop.min.js"></script>
  63. <a href="javascript:;" id="scrollToTop" rel="nofollow"><img src="http://static.tumblr.com/cqpvki8/7yWlh05zn/seta.png"/></a>
  64.  
  65. <head>
  66.  
  67. <!-- APPEARANCE -->
  68.  
  69. <meta name="color:background" content="#fff"/>
  70. <meta name="color:text" content="#000"/>
  71. <meta name="color:title" content="#000"/>
  72. <meta name="color:link" content="#9B9B9B"/>
  73. <meta name="color:hover" content="#000"/>
  74.  
  75. <meta name="image:background" content=""/>
  76. <meta name="image:sidebar" content="http://fc02.deviantart.net/fs70/f/2012/125/a/4/harry_styles_signature_by_didicerezita-d4ynq3z.png"/>
  77.  
  78. <meta name="text:Link One Title" content="" />
  79. <meta name="text:Link One" content="" />
  80. <meta name="text:Link Two Title" content="" />
  81. <meta name="text:Link Two" content="" />
  82. <meta name="text:Link Three Title" content="" />
  83. <meta name="text:Link Three" content="" />
  84. <meta name="text:Link Four Title" content="" />
  85. <meta name="text:Link Four" content="" />
  86.  
  87. <meta name="text:desc" content=""/>
  88. <link href='http://fonts.googleapis.com/css?family=Ubuntu:300' rel='stylesheet' type='text/css'>
  89.  
  90. <style type="text/css">
  91.  
  92. iframe#tumblr_controls {z-index:99999999999999999999999999999999999999; right:3px !important; position: fixed !important;-webkit-transition: opacity 0.5s linear;opacity: 0.5;-webkit-transition: all 0.8s ease-out;-moz-transition: all 0.8s ease-out;transition: all 0.8s ease-out;-webkit-filter:invert(100%);}
  93.  
  94.  
  95. ::-webkit-scrollbar-thumb{ background-color: {color:title}; border: 2px solid #fafafa; height:auto; -moz-border-radius: 10px; border-radius: 10px; }
  96.  
  97. ::-webkit-scrollbar { height:auto; width:9px; background-color: #cecece; border: 4px solid #fafafa; }
  98.  
  99.  
  100. ::selection {
  101. background: {color:title};
  102. color: #fff;
  103. }
  104. ::-moz-selection {
  105. background: {color:title};
  106. color: #fff;
  107. }
  108.  
  109. @font-face { font-family: "sofia"; src: url('http://static.tumblr.com/q9ilpl7/hIymfazfg/sketch_block.ttf'); }
  110.  
  111.  
  112. div#qTip {
  113. z-index:999999999999999999999999;
  114. padding-left: 8px; padding-right: 8px;
  115. line-height:21px;
  116. display: none;
  117. margin-left: 20px;
  118. margin-top: -20px;
  119. font-size: 8px
  120. font-family:calibri;
  121. position: absolute;
  122. letter-spacing: 2px;
  123. color: #fff;
  124. text-transform: uppercase;
  125. background-color: #000;
  126. box-shadow:4px 4px 8px rgba(0,0,8,4);
  127. }
  128.  
  129.  
  130. .wrapper{
  131. margin: 0px auto;
  132. margin-left: 60px;
  133. width: 802px;
  134. }
  135. .title{
  136. font-family: calibri;
  137. font-size: 10px;
  138. text-transform: uppercase;
  139. line-height: 15px;
  140. letter-spacing:0px;
  141. margin-left:10px;
  142. }
  143.  
  144. body, a, a:hover { cursor:
  145. url(http://img69.imageshack.us/img69/7673/cursorw.png), progress;}
  146.  
  147. body {
  148. margin:0px;
  149. background-color: {color:Background};
  150. background-image:url({image:Background});
  151. background-attachment: fixed;
  152. background-size: repeat;}
  153. body, div, p, textarea, submit, input{
  154. font-family: arial;
  155. letter-spacing: 2px;
  156. font-size: 8px;
  157. line-height:10px;
  158. color:{color:Text};
  159. }
  160.  
  161. a:link, a:active, a:visited{
  162. text-decoration: none;
  163. -webkit-transition: color 0.3s ease-out;
  164. -moz-transition: color 0.3s ease-out;
  165. transition: color 0.3s ease-out;
  166. color: {color:Link};}
  167.  
  168. a:hover {
  169. : -webkit-transition-duration: 0.5s;
  170. color:{color:Hover};
  171. text-decoration:none;
  172. }
  173.  
  174. @font-face { font-family: "learningcurve"; src: url('http://static.tumblr.com/rmj06l2/paAlm4ymo/learningcurve.ttf');}
  175. @font-face { font-family: "edition"; src: url('http://static.tumblr.com/fjknzts/Ro4mmuwwb/edition_.ttf'); }
  176. @font-face { font-family:will and grace; src: url('http://static.tumblr.com/k4oonwn/NFcmip0tl/willg____1_.ttf');}
  177.  
  178. #posts {
  179. z-index:99;
  180. width:620px;
  181. border-left: 3px solid #999;
  182. margin-top: -10px;
  183. margin-left:420px;
  184. margin-right: auto;
  185. position:relative;
  186. overflow-y: visible;
  187. padding:10px; padding-top:10px;
  188. {block:PermalinkPage}
  189. width: 450px;
  190. margin-left: 570px;
  191. border: 0px;
  192. text-align:left;
  193. {/block:PermalinkPage}
  194.  
  195. }
  196.  
  197.  
  198.  
  199. .entry {
  200. float:left;
  201. display: block;
  202. padding: 6px;
  203. border-radius: 3px;
  204. overflow:;
  205. margin:14px;
  206. width:270px;
  207. {block:PermalinkPage}
  208. width: 450px;
  209. margin-top: 5px;
  210. margin-left: -10px;
  211. border: 0px;
  212. text-align:left;
  213. {/block:PermalinkPage}
  214.  
  215. }
  216. .entry img{
  217. z-index:99999999999999999999999;
  218. opacity:.75;
  219. }
  220.  
  221.  
  222.  
  223.  
  224. #okk{
  225.  
  226. height:12px;
  227.  
  228. text-align:center;
  229.  
  230. overflow:hidden;
  231.  
  232. border-bottom:1px solid #efefef;
  233.  
  234. text-transform:uppercase;
  235.  
  236. background-color:white;
  237.  
  238. letter-spacing:1px;
  239.  
  240. font-size:8px;
  241.  
  242. line-height:13px;
  243.  
  244. z-index:999999999999999999999;
  245.  
  246. -webkit-transition: all 0.4s ease-in-out;
  247.  
  248. -moz-transition: all 0.4s ease-in-out;
  249.  
  250. -o-transition: all 0.4s ease-in-out;
  251.  
  252. }
  253. /*CUSTOMIZE SIDEBAR HERE*/
  254. #sidebar{
  255. position:fixed !important;
  256. width:200px;
  257. background:white;
  258. padding:5px;
  259. height:200px;
  260. margin-top:110px;
  261. margin-left:85px;
  262. text-align:center;
  263. }
  264.  
  265. #sidebarpic img{
  266. margin-top:10px;
  267. margin-left:0px;
  268. height:160px;
  269. width:150px;
  270. }
  271.  
  272. #blogtitle{
  273. text-shadow:1px 1px 0px #fff;
  274. margin-top:-28px;
  275. font-size:30px;
  276. line-height:25px;
  277. width:100px;
  278. font-family:scars;
  279. text-align:left;
  280. z-index:2;
  281. position:fixed;
  282. margin-left:0px;
  283. text-transform:;
  284. color:{color:blogtitle};
  285. {block:if2column}
  286. margin-left:65px;
  287. {/block:if2column}
  288. {block:permalinkpage}
  289. margin-left:65px;
  290.  
  291. {/block:permalinkpage}
  292. }
  293.  
  294. @font-face { font-family: "scars"; src: url('http://static.tumblr.com/ejm8w78/E7bmdzk1u/kgthefighter.ttf'); }
  295.  
  296.  
  297. #desc{
  298. margin-top:155px;
  299. width:205px;
  300. height:auto;
  301. line-height:11px;
  302. padding-top:3px;
  303. position:fixed;}
  304.  
  305.  
  306. #link1{
  307. position:fixed;
  308. z-index:9999999;
  309. margin-top: 30px;
  310. border: 1px solid #ececec;
  311. padding: 5px;
  312. font-family: calibri;
  313. font-size: 10px;
  314. text-transform: uppercase;
  315. letter-spacing: 1px;
  316. margin-left: 270px;
  317. width: 50px;
  318. text-align: center;
  319. background-color: white;
  320. transition: all 0.9s ease-out;
  321. -o-transition-transition: all 0.9s ease-out;
  322. -webkit-transition: all 0.9s ease-out;
  323. -moz-transition: all 0.9s ease-out;
  324. }
  325.  
  326. #link1:hover{
  327. transition: all 0.9s ease-out;
  328. -o-transition-transition: all 0.9s ease-out;
  329. -webkit-transition: all 0.9s ease-out;
  330. -moz-transition: all 0.9s ease-out;
  331. }
  332.  
  333. #link2{
  334. position:fixed;
  335. z-index:9999999;
  336. margin-top: 68px;
  337. border: 1px solid #ececec;
  338. padding: 5px;
  339. font-family: calibri;
  340. font-size: 10px;
  341. text-transform: uppercase;
  342. letter-spacing: 1px;
  343. margin-left: 270px;
  344. width: 50px;
  345. text-align: center;
  346. background-color: white;
  347. transition: all 0.9s ease-out;
  348. -o-transition-transition: all 0.9s ease-out;
  349. -webkit-transition: all 0.9s ease-out;
  350. -moz-transition: all 0.9s ease-out;
  351. }
  352.  
  353. #link2:hover{
  354. transition: all 0.9s ease-out;
  355. -o-transition-transition: all 0.9s ease-out;
  356. -webkit-transition: all 0.9s ease-out;
  357. -moz-transition: all 0.9s ease-out;
  358. }
  359.  
  360. #link3{
  361. position:fixed;
  362. z-index:9999999;
  363. margin-top: 108px;
  364. border: 1px solid #ececec;
  365. padding: 5px;
  366. font-family: calibri;
  367. font-size: 10px;
  368. text-transform: uppercase;
  369. letter-spacing: 1px;
  370. margin-left: 270px;
  371. width: 50px;
  372. text-align: center;
  373. background-color: white;
  374. transition: all 0.9s ease-out;
  375. -o-transition-transition: all 0.9s ease-out;
  376. -webkit-transition: all 0.9s ease-out;
  377. -moz-transition: all 0.9s ease-out;
  378. }
  379.  
  380. #link3:hover{
  381. transition: all 0.9s ease-out;
  382. -o-transition-transition: all 0.9s ease-out;
  383. -webkit-transition: all 0.9s ease-out;
  384. -moz-transition: all 0.9s ease-out;
  385. }
  386.  
  387. #link4{
  388. position:fixed;
  389. z-index:9999999;
  390. margin-top: 145px;
  391. border: 1px solid #ececec;
  392. padding: 5px;
  393. font-family: calibri;
  394. font-size: 10px;
  395. text-transform: uppercase;
  396. letter-spacing: 1px;
  397. margin-left: 270px;
  398. width: 50px;
  399. text-align: center;
  400. background-color: white;
  401. transition: all 0.9s ease-out;
  402. -o-transition-transition: all 0.9s ease-out;
  403. -webkit-transition: all 0.9s ease-out;
  404. -moz-transition: all 0.9s ease-out;
  405. }
  406.  
  407. #link4:hover{
  408. transition: all 0.9s ease-out;
  409. -o-transition-transition: all 0.9s ease-out;
  410. -webkit-transition: all 0.9s ease-out;
  411. -moz-transition: all 0.9s ease-out;
  412. }
  413.  
  414.  
  415.  
  416.  
  417. #okk:hover{
  418.  
  419. height:125px;
  420.  
  421. -webkit-transition: all 0.4s ease-in-out;
  422.  
  423. -moz-transition: all 0.4s ease-in-out;
  424.  
  425. -o-transition: all 0.4s ease-in-out;
  426.  
  427. }
  428.  
  429. #ihg{
  430.  
  431. height:12px;
  432.  
  433. text-align:center;
  434.  
  435. overflow:hidden;
  436.  
  437. border-bottom:1px solid #efefef;
  438.  
  439. text-transform:uppercase;
  440.  
  441. background-color:white;
  442.  
  443. letter-spacing:1px;
  444.  
  445. font-size:8px;
  446.  
  447. line-height:13px;
  448.  
  449. z-index:999999999999999999999;
  450.  
  451. -webkit-transition: all 0.4s ease-in-out;
  452.  
  453. -moz-transition: all 0.4s ease-in-out;
  454.  
  455. -o-transition: all 0.4s ease-in-out;
  456.  
  457. }
  458.  
  459. #ihg:hover{
  460.  
  461. height:100px;
  462.  
  463. -webkit-transition: all 0.4s ease-in-out;
  464.  
  465. -moz-transition: all 0.4s ease-in-out;
  466.  
  467. -o-transition: all 0.4s ease-in-out;
  468.  
  469. }
  470.  
  471. #iep{
  472.  
  473. height:12px;
  474.  
  475. text-align:center;
  476.  
  477. overflow:hidden;
  478.  
  479. border-bottom:1px solid #efefef;
  480.  
  481. text-transform:uppercase;
  482.  
  483. background-color:white;
  484.  
  485. letter-spacing:1px;
  486.  
  487. font-size:8px;
  488.  
  489. line-height:13px;
  490.  
  491. z-index:999999999999999999999;
  492.  
  493. -webkit-transition: all 0.4s ease-in-out;
  494.  
  495. -moz-transition: all 0.4s ease-in-out;
  496.  
  497. -o-transition: all 0.4s ease-in-out;
  498.  
  499. }
  500.  
  501. #iep:hover{
  502.  
  503. height:100px;
  504.  
  505. -webkit-transition: all 0.4s ease-in-out;
  506.  
  507. -moz-transition: all 0.4s ease-in-out;
  508.  
  509. -o-transition: all 0.4s ease-in-out;
  510.  
  511. }
  512.  
  513. #nmo{
  514.  
  515. height:13px;
  516.  
  517. text-align:center;
  518.  
  519. overflow:hidden;
  520.  
  521. border-bottom:1px solid #efefef;
  522.  
  523. text-transform:uppercase;
  524.  
  525. background-color:white;
  526.  
  527. letter-spacing:1px;
  528.  
  529. font-size:8px;
  530.  
  531. line-height:13px;
  532.  
  533. z-index:999999999999999999999;
  534.  
  535. -webkit-transition: all 0.4s ease-in-out;
  536.  
  537. -moz-transition: all 0.4s ease-in-out;
  538.  
  539. -o-transition: all 0.4s ease-in-out;
  540.  
  541. }
  542.  
  543. #nmo:hover{
  544.  
  545. height:140px;
  546.  
  547. -webkit-transition: all 0.4s ease-in-out;
  548.  
  549. -moz-transition: all 0.4s ease-in-out;
  550.  
  551. -o-transition: all 0.4s ease-in-out;
  552.  
  553. }
  554.  
  555. p{margin:0px;}
  556.  
  557. #imp{
  558.  
  559. height:11px;
  560.  
  561. text-align:center;
  562.  
  563. overflow:hidden;
  564.  
  565. text-transform:uppercase;
  566.  
  567. background-color:white;
  568.  
  569. letter-spacing:1px;
  570.  
  571. font-size:8px;
  572.  
  573. line-height:13px;
  574.  
  575. z-index:999999999999999999999;
  576.  
  577. -webkit-transition: all 0.4s ease-in-out;
  578.  
  579. -moz-transition: all 0.4s ease-in-out;
  580.  
  581. -o-transition: all 0.4s ease-in-out;
  582.  
  583. }
  584.  
  585. #imp:hover{
  586.  
  587. height:10px;
  588.  
  589. -webkit-transition: all 0.4s ease-in-out;
  590.  
  591. -moz-transition: all 0.4s ease-in-out;
  592.  
  593. -o-transition: all 0.4s ease-in-out;
  594.  
  595. }
  596.  
  597.  
  598.  
  599.  
  600. .links a{
  601. font-family: arial;
  602. font-size:7px;
  603. letter-spacing:2px;
  604. text-shadow:10px 1px 0px transparent, -10px 1px 0px transparent;
  605. border-bottom:1px solid transparent;
  606. text-align: center;
  607. margin-bottom:0px;
  608. -webkit-transition: all .9s ease-out;-moz-transition: all .9s ease-out;transition: all .9s ease-out;}
  609.  
  610. .links a:hover {
  611. opacity:1;
  612. color:#000;
  613. font-style:none;
  614. text-shadow:0px 0px 0px #000, 0px 0px 0px #000;
  615. -webkit-transition: all 0.9s ease-out;-moz-transition: all 0.9s ease-out;transition: all 0.9s ease-out-webkit-filter: blur(15px);;}
  616.  
  617.  
  618. #ahah{
  619. z-index: 9999999999999;
  620. position:absolute;
  621. bottom: 150px;
  622. margin-left: 20px;
  623. font-size: 20px;
  624. line-height: 15px;
  625. text-align: center;
  626. font-family: arial;
  627. text-transform:lowercase;
  628. text-shado:5px -2px 1px rgba(205,201,201, 0.1), -4px -2px 1px rgba(205,201,201, 0.1);
  629. color:{color:title};
  630. -webkit-transition: all 0.6s ease-in-out;-moz-transition: all 0.6s ease-in-out;transition: all 0.6s ease-in-out;
  631. }
  632.  
  633.  
  634.  
  635. /*
  636. CSS-Tricks Example - MagicLine Demo
  637. by Chris Coyier
  638. http://css-tricks.com
  639. */
  640.  
  641. * { margin: 0; padding: 0; }
  642. a { color: {color:link}; }
  643. a:hover { color: {color:hover}; }
  644.  
  645. .nav-wrap {
  646. margin: 30px auto;
  647. margin-left: 75px;
  648. background-color: #ddd rgba;
  649. ;
  650. }
  651.  
  652.  
  653. /* Clearfix */
  654. .group:after { visibility: hidden; display: block; content: ""; clear: both; height: 0;}
  655.  
  656.  
  657. *:first-child+html .group { zoom: 1; } /* IE7 */
  658.  
  659.  
  660.  
  661. /* Example One */
  662. #example-one {
  663. margin: 0 auto;
  664. list-style: none;
  665. position: relative;
  666. width: 960px;
  667. bottom:-5px;
  668. }
  669. #example-one li {
  670. display: inline-block;
  671. }
  672. #example-one a {
  673. color: {color:link};
  674. float: left;
  675. padding: 6px 5px 4px 5px;
  676. text-decoration: none;
  677. text-transform: lowercase;
  678. font-weight: 600;
  679. }
  680. #example-one a:hover {
  681. color: {color:hover};
  682. }
  683. #magic-line {
  684. position: absolute;
  685. bottom: 3px;
  686. left: 0;
  687. width: 100px;
  688. height: 1px;
  689. background: #ddd;
  690. }
  691. .current_page_item a {
  692. color: {color:link} !important;
  693. }
  694. .current_page_item a:hover {
  695. color: {color:hover} !important;
  696. }
  697. .ie6 #example-one li, .ie7 #example-one li {
  698. display: inline;
  699. }
  700. .ie6 #magic-line {
  701. bottom: -3px;
  702. }
  703.  
  704.  
  705.  
  706. /* Example Two */
  707. #example-two {
  708. margin: 0 auto;
  709. list-style: none;
  710. position: relative;
  711. width: 960px;
  712. }
  713. #example-two li {
  714. display: inline-block;
  715. }
  716. #example-two li a {
  717. position: relative;
  718. z-index: 200;
  719. color: #bbb;
  720. font-size: 14px;
  721. display: block;
  722. float: left;
  723. padding: 6px 10px 4px 10px;
  724. text-decoration: none;
  725. text-transform: uppercase;
  726. }
  727. #example-two li a:hover {
  728. color: white;
  729. }
  730. #example-two #magic-line-two {
  731. position: absolute;
  732. top: 0;
  733. left: 0;
  734. width: 100px;
  735. background: #900;
  736. z-index: 100;
  737. -moz-border-radius: 5px;
  738. -webkit-border-radius: 5px;
  739. border-radius: 5px;
  740. }
  741. .current_page_item_two a {
  742. color: white !important;
  743. }
  744. .ie6 #example-two li, .ie7 #example-two li {
  745. display: inline;
  746. }
  747.  
  748.  
  749. @font-face {font-family:kg the fighter;src: url('http://static.tumblr.com/ejm8w78/E7bmdzk1u/kgthefighter.ttf');,}
  750. @font-face {font-family:wow;src: url('http://static.tumblr.com/hxu4bui/dwqmsdhdo/burtinomatic.ttf');,}
  751.  
  752. #center{
  753. margin:auto;
  754. margin-right:auto;
  755. margin-top:0px;
  756. position:relative;
  757. width:100%;
  758. border:1px solid #999;
  759. background-color:;
  760. overflow:auto;
  761. }
  762.  
  763. @font-face{font-family: 'lolol'; src: url('http://static.tumblr.com/hxu4bui/XBSmrubll/websymbols-regular.otf'); }
  764.  
  765.  
  766. lol{font-family:'lolol'; font-size:9px;}
  767.  
  768. .entry .perma1 img{
  769. margin-left:2px !important;
  770. margin-top:0px !important;
  771. width:25px;
  772. z-index:9999;
  773. -webkit-filter: invert(100%);
  774. opacity:1 !important;
  775. }
  776.  
  777. .entry .perma1 img:hover{
  778. -webkit-transition: all 0.4s ease-in-out;
  779. -moz-transition: all 0.4s ease-in-out;
  780. transition: all 0.4s ease-in-out;
  781. transform: rotate(360deg);
  782. -ms-transform: rotate(360deg); /* IE 9 */
  783. -webkit-transform: rotate(360deg); /* Safari and Chrome */
  784. }
  785.  
  786. .entry .perma1 a:hover{
  787. color:{color:hover};}
  788.  
  789. .entry .perma1{
  790. position:absolute;
  791. z-index:999999999999999999;
  792. width:29px;
  793. height:29px;
  794. left:140px;
  795. top:15px;
  796. background: #444;
  797. border-radius:18px;
  798. padding:4px;
  799. line-height:15px;
  800. opacity:0.0;
  801. }
  802. .entry:hover .perma1{
  803. opacity:5;
  804. left:15px;
  805. }
  806. .entry:hover .perma1:hover{
  807. opacity:1;
  808. transform: scale(1.1);
  809. -webkit-transform: scale(1.1);
  810. -moz-transform: scale(1.1);
  811. -o-transform: scale(1.1);
  812. -ms-transform: scale(1.1);
  813. -webkit-transition: opacity 0.7s linear;-webkit-transition: all 0.5s ease-out;-moz-transition: all 0.5s ease-out;transition: all 0.5s ease-out;
  814.  
  815. }
  816.  
  817.  
  818.  
  819. .entry .perma2 img{
  820. margin-left:-1.5px !important;
  821. margin-top:-1px !important;
  822. width:31px;
  823. -webkit-filter: invert(100%);
  824. opacity:1 !important;
  825. }
  826.  
  827. .entry .perma2 img:hover{
  828. -webkit-transition: all 0.4s ease-in-out;
  829. -moz-transition: all 0.4s ease-in-out;
  830. transition: all 0.4s ease-in-out;
  831. transform: rotate(360deg);
  832. -ms-transform: rotate(360deg); /* IE 9 */
  833. -webkit-transform: rotate(360deg); /* Safari and Chrome */
  834. }
  835.  
  836. .entry .perma2 a:hover{
  837. color:{color:hover};}
  838. .entry .perma2{
  839. position:absolute;
  840. z-index:999999999999999999;
  841. width:29px;
  842. height:29px;
  843. left:165px;
  844. top:15px;
  845. background: #444;
  846. border-radius:18px;
  847. padding:4px;
  848. line-height:15px;
  849. opacity:0.0;
  850. }
  851. .entry:hover .perma2{
  852. opacity:1;
  853. left:230px;
  854.  
  855. }
  856.  
  857. .entry:hover .perma2:hover{
  858. opacity:1;
  859. transform: scale(1.1);
  860. -webkit-transform: scale(1.1);
  861. -moz-transform: scale(1.1);
  862. -o-transform: scale(1.1);
  863. -ms-transform: scale(1.1);
  864. -webkit-transition: opacity 0.7s linear;-webkit-transition: all 0.5s ease-out;-moz-transition: all 0.5s ease-out;transition: all 0.5s ease-out;
  865. }
  866.  
  867.  
  868. .entry:hover .textt{
  869. {block:IndexPage}
  870. opacity:1;
  871. margin-top:15px;
  872. {block:IndexPage}
  873. }
  874.  
  875. .textt{
  876. display: block;
  877. padding-top:5px;
  878. margin-top:5px;
  879. text-transform: uppercase;
  880. font-size:8px;
  881. font-family: calibri;
  882. line-height:10px;
  883. padding-bottom: 0px;
  884. text-align:right;
  885. webkit-transition: all 0.2s linear;
  886. -webkit-transition: all 0.2s linear;
  887. -moz-transition: all 0.2s linear;
  888. transition: all 0.2s linear;
  889. border-top: 1px solid #999;
  890. {block:IndexPage}
  891. opacity:0;
  892. margin-top:20px;
  893. padding-top:3px;
  894. {/block:IndexPage}
  895. }
  896. .textt a{
  897. color:{color:text}}
  898. .textt a:hover{
  899. color:{color:hover};}
  900.  
  901. #infscr-loading{
  902. bottom: -70px;
  903. position: absolute;
  904. left: 50%;
  905. margin-left:-8px;
  906. width:16px;
  907. height:11px;
  908. overflow:hidden;
  909. margin-bottom: 50px;
  910. }
  911.  
  912. #postnotes{
  913. text-align: justify;
  914. }
  915.  
  916. #postnotes blockquote{
  917. border: 0px;
  918. }
  919.  
  920. blockquote{
  921. margin:8px 0px 10px 0px;
  922. overflow:visible;
  923. text-align:center;
  924. border-left:1px solid {color:title};
  925. border-right:1px solid {color:title};
  926. }
  927.  
  928. blockquote p, ul{
  929. margin:0px;
  930. padding:0px;
  931. }
  932.  
  933. a img{border: 0px;}
  934. ul, ol, li{list-style:none; margin:0px; padding:0px;}
  935. .user_1 .label, .user_2 .label, .user_3 .label, .user_4 .label, .user_5 .label, .user_6 .label,
  936. .user_7 .label, .user_8 .label, .user_9 .label {color:{color:Title};}
  937. .notes img{width:10px; position:relative; top:3px;
  938. }
  939.  
  940. small{font-size: 90%;}
  941.  
  942. .video embed, .post div.video object {width:260px !important; height:180px !important;}
  943. .video2 embed, .post div.video object {width:400px !important; height:400px !important;}
  944.  
  945. {CustomCSS}
  946.  
  947. .artcover {position:absolute;}
  948. .artcover img {z-index:9999; width:42px;height:42px;float:left;; overflow:hidden;}
  949. .audioplayer {width:20px;padding:3px 5px 5px 3px;overflow:hidden;}
  950. .audioinfo {margin-left:55px;padding:3px 0px;margin-top:-5px;}
  951. .i{display:block;padding:2px; }
  952. .i b, strong{font-family:arial; letter-spacing:1px; color:{color:Title}}
  953. .player {
  954. z-index:9;
  955. position:absolute;
  956. background:white;
  957. width:30px;
  958. height:30px;
  959. opacity:0.0;;
  960. padding:7px;
  961. margin:-2px;
  962. overflow:hidden;
  963. -webkit-transition: all 0.4s ease-in-out;
  964. -moz-transition: all 0.4s ease-in-out;
  965. transition: all 0.4s ease-in-out;}
  966. .entry:hover .player{opacity:0.75; -webkit-transition: all 0.4s ease-in-out; -moz-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out;}
  967.  
  968. .arrow{
  969. position:absolute;
  970. margin-left:150px;
  971. margin-top:5px;
  972. width: 0;
  973. height: 0;
  974. border-top: 6px solid transparent;
  975. border-bottom: 6px solid transparent;
  976. border-left: 6px solid #f2f2f2;
  977. }
  978.  
  979. #scrollToTop:link,
  980. #scrollToTop:visited {
  981. display: none;
  982. opacity: .4;
  983. position: fixed;
  984. bottom: 10px;
  985. right: 20px;
  986. }
  987.  
  988.  
  989. </style>
  990.  
  991.  
  992.  
  993. {block:IndexPage}
  994. <script type="text/javascript" src="http://static.tumblr.com/dbek3sy/iBElrgjim/jquerymasonry.js"></script>
  995. <script type="text/javascript" src="http://static.tumblr.com/dbek3sy/Qyblrgjfn/jqueryinfintescroll.js"></script>
  996.  
  997.  
  998.  
  999.  
  1000. <script type="text/javascript">
  1001. $(window).load(function () {
  1002. var $content = $('#posts');
  1003. $content.masonry({itemSelector: '.entry'}),
  1004. $content.infinitescroll({
  1005. navSelector : 'div#pagination',
  1006. nextSelector : 'div#pagination a#nextPage',
  1007. itemSelector : '.entry',
  1008. loading: {
  1009. finishedMsg: '',
  1010. img: 'http://static.tumblr.com/dbek3sy/pX1lrx8xv/ajax-loader.gif'
  1011. },
  1012. bufferPx : 600,
  1013. debug : false,
  1014. },
  1015. // call masonry as a callback.
  1016. function( newElements ) {
  1017. var $newElems = $( newElements );
  1018. $newElems.hide();
  1019. // ensure that images load before adding to masonry layout
  1020. $newElems.imagesLoaded(function(){
  1021. $content.masonry( 'appended', $newElems, true, function(){$newElems.fadeIn(300);} );
  1022.  
  1023.  
  1024. });
  1025. });
  1026. });
  1027. </script>
  1028. {/block:IndexPage}
  1029.  
  1030.  
  1031. <title>{title}</title>
  1032.  
  1033. <link rel="shortcut icon" href="{favicon}">
  1034. <meta name="viewport" content="width=820" />
  1035. </head>
  1036.  
  1037. <body>
  1038.  
  1039. <div class="wrapper">
  1040. <div class="header">
  1041. </div></div>
  1042.  
  1043. <!--STUFF THAT GOES INTO THE SIDEBAR-->
  1044. <div id="sidebar">
  1045. <div id="blogtitle">{text:blogtitle}</div>
  1046. <div id="desc">{text:desc}</div>
  1047. <center>
  1048. <div id="link1">
  1049. <a href="{text:Link One}" >
  1050. {text:Link One Title}</div></a>
  1051.  
  1052. <div id="link2">
  1053. <a href="{text:Link Two}" >
  1054. {text:Link Two Title}</div></a>
  1055.  
  1056. <div id="link3">
  1057. <a href="{text:Link Three}" >
  1058. {text:Link Three Title}</div></a>
  1059.  
  1060. <div id="link4">
  1061. <a href="{text:Link Four}" >
  1062. {text:Link Four Title}</div></a>
  1063.  
  1064. <div id="sidebarpic"><a href="/"><img src="{image:sidebar}"></a>
  1065. </center>
  1066. <div style="bottom:5px;left:10px;position:fixed;"><a href="http://uhnlikely.tumblr.com"> <img src="http://media.tumblr.com/tumblr_ls1tv2F5Bg1qhwcy0.gif"></a></div>
  1067. </div>
  1068. <!------------------------------------->
  1069.  
  1070. <br>
  1071.  
  1072.  
  1073. <div id="posts">
  1074. {block:Posts}
  1075. <div class="entry">
  1076. {block:Answer}
  1077.  
  1078. <img src="{AskerPortraitURL-40}" width="" align="right" style="margin-top:1px; border-radius: 18px; right:6px;"/>
  1079.  
  1080. <div style="margin-top:-8px; min-height:30px; width:275px; padding: 5px; background-color: white; border: 4px double #FFF; z-index: 9999999999999999px; border-radius: 16px; {block:PermalinkPage}{/block:PermalinkPage}">
  1081.  
  1082. <div style="text-transform:lowercase; color:#999 !important; font-size:11px; display:inline; border-radius: 16px; ">{Asker}:</div><div style="display:inline;"> {Question}</div>
  1083. </div>
  1084.  
  1085.  
  1086. <div style="font-size:11px;">{Answer}</div><div class="textt"><a href="{Permalink}" title="permalink">{notecountwithlabel}</a></div>
  1087. {/block:Answer}
  1088.  
  1089. {block:Text}
  1090. {block:Title}<span class="title">{Title}</span>{/block:Title}
  1091. <span class="entrytext">{Body}</span></a>
  1092. {block:IndexPage}
  1093. <div class="textt"><a href="{permalink}" title="permalink">{notecountwithlabel}</a> &middot {TimeAgo}</div>
  1094. {/block:IndexPage}
  1095. {/block:Text}
  1096.  
  1097. {block:Link}
  1098. <a href="{URL}" class="title">{Name}</a>
  1099. {block:Description}{Description}{/block:Description}
  1100. {block:IndexPage}
  1101. <div class="textt"><a href="{permalink}">{notecountwithlabel}</a> &middot {TimeAgo}</span></div>
  1102. {/block:IndexPage}
  1103. {block:Link}
  1104.  
  1105. {block:Photo}{block:IndexPage}
  1106. <a href="{ReblogURL}" ><div class="perma1"><img src="http://png-3.findicons.com/files/icons/974/glyphish/24/01_refresh.png"></div></a>
  1107. <a href="{Permalink}"><div class="perma2"><img src="https://cdn0.iconfinder.com/data/icons/iconsweets2/40/link_seo.png"></div></a>
  1108. {/block:IndexPage}
  1109. {block:IndexPage}
  1110. <a href="{Permalink}"><img src="{PhotoURL-HighRes}" alt="{PhotoAlt}" width="100%"/></a>
  1111. {/block:IndexPage}
  1112. {block:permalinkpage}{LinkOpenTag}
  1113. <img src="{PhotoURL-HighRes}" alt="{PhotoAlt}" width="100%"/>{LinkCloseTag}
  1114. {/block:permalinkpage}
  1115. {/block:Photo}
  1116.  
  1117. {block:Quote}
  1118. <span class="title">{Quote}</span><br />
  1119. {block:Source}{Source}{/block:Source}
  1120. {block:IndexPage}
  1121. <br /><div class="textt"><a href="{permalink}">{notecountwithlabel}</a> &middot {TimeAgo}</span></div>
  1122. {/block:IndexPage}
  1123. {/block:Quote}
  1124.  
  1125.  
  1126. {block:Chat}
  1127. {block:Title}<span class="title">{Title}</span>{/block:Title}
  1128. <ul class="chat">
  1129. {block:Lines}
  1130. <li class="user_{UserNumber}">
  1131. {block:Label}
  1132. <span class="label">{Label}</span>
  1133. {/block:Label}
  1134.  
  1135. {Line}
  1136. </li>
  1137. {/block:Lines}
  1138. </ul>
  1139. {block:IndexPage}
  1140. <div class="textt"><a href="{permalink}">{notecountwithlabel}</a> &middot {TimeAgo}</span></div>
  1141. {/block:IndexPage}
  1142. {/block:Chat}
  1143.  
  1144. {block:Audio}
  1145. {block:AlbumArt}<div class="artcover">
  1146. <img src="{AlbumArtURL}"></div>{/block:AlbumArt}
  1147.  
  1148. <div class="player"><div class="audioplayer">{AudioPlayerWhite}</div></div>
  1149.  
  1150. <div class="audioinfo">
  1151. <div class="i"><b>TITLE:&nbsp;</b> <span{block:TrackName} style="display: none;"{block:TrackName}>Unknown</span>{block:TrackName}{TrackName}{/block:TrackName}</div>
  1152. <div class="i"><b>ARTIST:&nbsp; </b><span{block:Artist} style="display: none;"{block:Artist}>Unknown</span> {block:Artist}{Artist}{/block:Artist}</div>
  1153. <div class="i"><b>PLAYS: &nbsp;</b><span{block:PlayCount} style="display: none;"{block:PlayCount}>Unknown</span>{block:PlayCount}{PlayCount}{/block:PlayCount}</div></div>
  1154.  
  1155. {block:IndexPage}
  1156. <div class="textt"><a href="{permalink}">{notecountwithlabel}</a> &middot {TimeAgo}</span></div></div></div></div>
  1157. {/block:IndexPage}
  1158. {/block:Audio}
  1159.  
  1160. {block:Video}<center>
  1161. <div class="video">{Video-250}</div></center>
  1162. {block:IndexPage}
  1163. <div class="textt"><a href="{permalink}">{notecountwithlabel}</a> &middot {TimeAgo}</span></div>
  1164. {/block:IndexPage}
  1165. {block:Video}
  1166.  
  1167. {block:PostNotes}
  1168.  
  1169. <div class="textt"><div align="middle">{caption}</div>
  1170. <center>
  1171.  
  1172. {block:NoteCount}{NoteCountWithLabel}<br>{/block:NoteCount}
  1173.  
  1174. {block:HasTags}
  1175. tags: {block:Tags}<a href="{TagURL}">{Tag}. </a>{/block:Tags}<br> {/block:HasTags}
  1176. {block:RebloggedFrom}
  1177. reblogged from <a href="{ReblogParentURL}">{ReblogParentName}</a><br>
  1178. posted by <a href="{ReblogRootURL}">{ReblogRootName}</a>
  1179.  
  1180. {/block:RebloggedFrom}
  1181. </center></span></div>
  1182. <br>
  1183. <div id="postnotes">{PostNotes}</div><br><p>
  1184.  
  1185. {/block:PostNotes}
  1186. </div>
  1187. {/block:Posts}
  1188. </div></div>
  1189.  
  1190. {block:IndexPage}
  1191. {block:Pagination}
  1192. <div id="pagination">
  1193. {block:NextPage}
  1194. <a id="nextPage" href="{NextPage}"></a>
  1195. {/block:NextPage}
  1196. {block:PreviousPage}
  1197. <a href="{PreviousPage}"></a>
  1198. {/block:PreviousPage}
  1199. </div>
  1200. {/block:Pagination}
  1201. {/block:IndexPage}
  1202.  
  1203. </div>
  1204.  
  1205. <script type="text/javascript">
  1206. <!--
  1207.  
  1208. // Disable Right Click Script
  1209.  
  1210. function IE(e)
  1211. {
  1212. if (navigator.appName == "Microsoft Internet Explorer" && (event.button == "2" || event.button == "3"))
  1213. {
  1214. return false;
  1215. }
  1216. }
  1217. function NS(e)
  1218. {
  1219. if (document.layers || (document.getElementById && !document.all))
  1220. {
  1221. if (e.which == "2" || e.which == "3")
  1222. {
  1223. return false;
  1224. }
  1225. }
  1226. }
  1227. document.onmousedown=IE;document.onmouseup=NS;document.oncontextmenu=new Function("return false");
  1228.  
  1229. //-->
  1230. </script>
  1231.  
  1232. </body>
  1233. </div></div>
  1234.  
  1235. <div style="position:fixed; bottom:5px; left:5px; background-color: white; padding: 5px;">
  1236.  
  1237. </div>
  1238.  
  1239.  
  1240. </div>
  1241.  
  1242.  
  1243. </div></div></div></div></div></div>
  1244.  
  1245.  
  1246.  
  1247. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement