Advertisement
hermionemessi

Theme 04 v2

Apr 22nd, 2015
1,033
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 35.07 KB | None | 0 0
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
  2. "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  3.  
  4. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  5.  
  6. <!--THEME 04 Bad Blood v2 by hermionegrangcr (hermionejean.co.vu)
  7.  
  8. THEME BLOG: grangersdesigns (granger.cf)
  9.  
  10.  
  11. ♛ ♛ ♛
  12. ♛♛♛ ♛♛♛ ♛♛♛
  13. ♛ ♛ ♛ ♛ ♛ ♛ ♛ ♛
  14. ♛♛♛ ♥ G♚D ♥ ♛♛♛
  15. ♛ ♛ ♛ ♛ ♛ ♛ ♛ ♛
  16. ♛ ♛ ♛ ♛ ♛ ♛ ♛ © hermionegrangcr (hermionejean.co.vu)
  17.  
  18.  
  19. TERMS OF USE:
  20.  
  21. ♚ BASIC RULES (see http://hermionejean.co.vu/rules) APPLY
  22.  
  23. ♚ PLEASE RESPECT THEM IF USING! ANY FORMS OF THEFTS WILL BE HUNTED DOWN.
  24.  
  25. ♚ PLEASE DO NOT ALTER OR COVER THE CREDIT
  26.  
  27. ♚ FAILURE TO ABIDE TO THE RULES WILL LEAD TO AN IMMEDIATE BLOCK & REPORT & A PERMANENT PLACE ON HTTP://HERMIONEJEAN.CO.VU/WOS
  28.  
  29. THAT'S IT! ENJOY USING MY CODE AND DON'T BE AFRAID TO ASK ME IF YOU ENCOUNTER ANY PROBLEMS c:
  30.  
  31. -->
  32.  
  33. <head>
  34. <title>{Title}</title>
  35. <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
  36. <link rel="shortcut icon" href="{Favicon}"/>
  37. <link rel="alternate" type="application/rss+xml" href="{RSS}" />
  38.  
  39. <link href='http://fonts.googleapis.com/css?family=Lato:100,300,400,700' rel='stylesheet' type='text/css'>
  40. <link href='http://fonts.googleapis.com/css?family=Raleway:400,100,300,200,500,700' rel='stylesheet' type='text/css'>
  41. <link href='http://fonts.googleapis.com/css?family=Roboto:400,300,700,100' rel='stylesheet' type='text/css'>
  42.  
  43.  
  44.  
  45.  
  46.  
  47. {block:Description}
  48. <meta name="description" content="{MetaDescription}"/>
  49. {/block:Description}
  50.  
  51. <meta name="if:400px" content="0">
  52. <meta name="if:fixedheader" content="1">
  53. <meta name="if:fadedposts" content="0">
  54.  
  55. <meta name="text:info" content="Name, Age, Country, MBTI, etc">
  56. <meta name="text:upd" content="Updates here">
  57.  
  58.  
  59. <meta name="color:lightbox" content="#fff">
  60. <meta name="color:grad1" content="#fefefe">
  61. <meta name="color:grad2" content="#ababab">
  62. <meta name="color:links" content="#cdcdcd">
  63. <meta name="color:hover" content="#fafafa">
  64. <meta name="color:tags" content="#dedede">
  65. <meta name="color:blockquote" content="#fafafa">
  66. <meta name="color:scroll" content="#000">
  67. <meta name="color:accent1" content="#000">
  68. <meta name="color:accent2" content="#fff">
  69. <meta name="color:accent3" content="#cdcdcd">
  70.  
  71.  
  72.  
  73. <meta name="text:Link1" content="Link1">
  74. <meta name="text:link1 URL" content="/">
  75. <meta name="text:Link2" content="Link2">
  76. <meta name="text:link2 URL" content="/">
  77. <meta name="text:Link3" content="Link3">
  78. <meta name="text:link3 URL" content="/">
  79. <meta name="text:Link4" content="Link4">
  80. <meta name="text:link4 URL" content="/">
  81. <meta name="text:Link5" content="Link5">
  82. <meta name="text:link5 URL" content="/">
  83. <meta name="text:Link6" content="Link6">
  84. <meta name="text:link6 URL" content="/">
  85. <meta name="text:Link7" content="Link7">
  86. <meta name="text:link7 URL" content="/">
  87. <meta name="text:Link8" content="Link8">
  88. <meta name="text:link8 URL" content="/">
  89. <meta name="text:Link9" content="Link9">
  90. <meta name="text:link9 URL" content="/">
  91.  
  92.  
  93. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  94.  
  95. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  96.  
  97. <!--Tooltip-->
  98.  
  99. <script>
  100.  
  101. (function($){
  102.  
  103. $(document).ready(function(){
  104.  
  105. $("a[title]").style_my_tooltips({
  106.  
  107. tip_follows_cursor:true,
  108.  
  109. tip_delay_time:30,
  110.  
  111. tip_fade_speed:300,
  112.  
  113. attribute:"title"
  114.  
  115. });
  116.  
  117. });
  118.  
  119. })(jQuery);
  120.  
  121. </script>
  122.  
  123. <!--Hide and Seek-->
  124. <script src=”https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js” type=”text/javascript”></script>
  125.  
  126. <script>
  127.  
  128. $(document).ready(function(){
  129.  
  130. $("a.index").click(function(){
  131. $("#t1").fadeIn();
  132. $("#t2").fadeOut();
  133. $("#t3").fadeOut();
  134. $("#t4").fadeOut();
  135. $("#t5").fadeOut();
  136.  
  137. });
  138.  
  139. $("a.owlery").click(function(){
  140. $("#t1").fadeOut();
  141. $("#t2").fadeIn();
  142. $("#t3").fadeOut();
  143. $("#t4").fadeOut();
  144. $("#t5").fadeOut();
  145.  
  146. });
  147.  
  148. $("a.info").click(function(){
  149. $("#t1").fadeOut();
  150. $("#t2").fadeOut();
  151. $("#t3").fadeIn();
  152. $("#t4").fadeOut();
  153. $("#t5").fadeOut();
  154.  
  155. });
  156.  
  157. $("a.map").click(function(){
  158. $("#t1").fadeOut();
  159. $("#t2").fadeOut();
  160. $("#t3").fadeOut();
  161. $("#t4").fadeIn();
  162. $("#t5").fadeOut();
  163.  
  164. });
  165.  
  166. $("a.blogroll").click(function(){
  167. $("#t1").fadeOut();
  168. $("#t2").fadeOut();
  169. $("#t3").fadeOut();
  170. $("#t4").fadeOut();
  171. $("#t5").fadeIn();
  172.  
  173. });
  174.  
  175. });
  176.  
  177. </script>
  178.  
  179.  
  180. <style type="text/css">
  181.  
  182.  
  183. ::selection {background:#fff; color:#000000;}
  184. ::-moz-selection {background:#fff;color:#000000;}
  185. ::-webkit-selection {background:#fff;color:#000000;}
  186.  
  187.  
  188. ::-webkit-scrollbar {width: 5px; height: 3px; background: #FFFFFF; }
  189.  
  190. ::-webkit-scrollbar-thumb { background-color: {color:scroll}; }
  191.  
  192.  
  193. /*Tooltip*/
  194. #s-m-t-tooltip{
  195.  
  196. font-family:'Lato', Arial, Sans-Serif;
  197. position:absolute;
  198. margin-top: 10px;
  199. z-index:9999999999;
  200. padding:5px;
  201. color:#fff;
  202. background:#000000;
  203. font-size:12px;
  204.  
  205. }
  206.  
  207. /*Basics*/
  208.  
  209. body {
  210. font-family:'roboto',Arial, sans-serif;
  211. font-weight:400;
  212. font-size:12px;
  213. letter-spacing:1.5px;
  214. background: -webkit-linear-gradient(90deg, {color:grad1}; 10%, {color:grad2} 90%); /* Chrome 10+, Saf5.1+ */
  215. background: -moz-linear-gradient(90deg, {color:grad1} 10%, {color:grad2} 90%); /* FF3.6+ */
  216. background: -ms-linear-gradient(90deg, {color:grad1} 10%, {color:grad2} 90%); /* IE10 */
  217. background: -o-linear-gradient(90deg, {color:grad1} 10%, {color:grad2} 90%); /* Opera 11.10+ */
  218. background: linear-gradient(90deg, {color:grad1} 10%, {color:grad2} 90%); /* W3C */
  219. overflow-x:hidden;
  220.  
  221. }
  222.  
  223.  
  224.  
  225. a {
  226. text-decoration: none;
  227. color: {color:links};
  228. transition: all 0.3s ease-in-out;
  229. -webkit-transition: all 0.3s ease-in-out;
  230. -moz-transition: all 0.3s ease-in-out;
  231. -o-transition: all 0.3s ease-in-out;
  232. }
  233.  
  234. a:hover {
  235. color: {color:hover};
  236. transition: all 0.3s ease-in-out;
  237. -webkit-transition: all 0.3s ease-in-out;
  238. -moz-transition: all 0.3s ease-in-out;
  239. -o-transition: all 0.3s ease-in-out;
  240.  
  241. }
  242.  
  243. b, strong {
  244. font-weight:700;
  245. }
  246.  
  247. strike {
  248. text-decoration: line-through;
  249. }
  250.  
  251. em, i {
  252. text-decoration:italic;
  253. }
  254. u {
  255. text-decoration:underline;
  256. }
  257.  
  258. pre {
  259. white-space: pre-wrap;
  260. white-space: -moz-pre-wrap;
  261. white-space: -pre-wrap;
  262. white-space: -o-pre-wrap;
  263. word-wrap: break-word;
  264. }
  265.  
  266. blockquote {
  267. border-left: solid 1px {color:blockquote};
  268. margin-left:20px;
  269. padding-left: 10px;
  270. max-width:100%;
  271. }
  272.  
  273. blockquote blockquote {
  274. padding: 0 0 0 20px;
  275. margin: 0 0 0 15px;
  276.  
  277. }
  278.  
  279. blockquote ul {
  280. padding-left:0;
  281. }
  282.  
  283. blockquote li {
  284. list-style:none;
  285. padding:5px;
  286. }
  287.  
  288. li {
  289. padding:3px;
  290. }
  291.  
  292. /*Important*/
  293.  
  294. iframe, img:not(.lightbox-image), embed, object, video, pre, li, blockquote {max-width: 100% !important;}
  295.  
  296. /*head*/
  297.  
  298. .tmblr-iframe.tmblr-iframe--desktop-logged-in-controls.iframe-controls--desktop, .tmblr-iframe.tmblr-iframe--controls.iframe-controls--desktop {z-index:10001 !important;}
  299.  
  300. {block:iffixedheader}
  301. .barca {
  302. position: fixed;
  303. top: 0;
  304. left: 0;
  305. width: 100%;
  306. background: -webkit-linear-gradient(90deg, {color:grad1}; 10%, {color:grad2} 90%); /* Chrome 10+, Saf5.1+ */
  307. background: -moz-linear-gradient(90deg, {color:grad1} 10%, {color:grad2} 90%); /* FF3.6+ */
  308. background: -ms-linear-gradient(90deg, {color:grad1} 10%, {color:grad2} 90%); /* IE10 */
  309. background: -o-linear-gradient(90deg, {color:grad1} 10%, {color:grad2} 90%); /* Opera 11.10+ */
  310. background: linear-gradient(90deg, {color:grad1} 10%, {color:grad2} 90%); /* W3C */
  311. z-index: 10000;
  312. height: 180px;
  313. overflow: hidden;
  314. -webkit-transition: height 0.3s;
  315. -moz-transition: height 0.3s;
  316. transition: height 0.3s;
  317. }
  318.  
  319. .barca nav a {
  320. -webkit-transition: all 0.3s;
  321. -moz-transition: all 0.3s;
  322. transition: all 0.3s;
  323. }
  324.  
  325. .barca.midget {
  326. height: 50px;
  327. }
  328.  
  329. .midget .blaugrana {
  330. margin-top:-125px;
  331. -webkit-transition: all 0.3s;
  332. -moz-transition: all 0.3s;
  333. transition: all 0.3s;
  334. }
  335.  
  336. {/block:iffixedheader}
  337.  
  338. nav a {
  339. position: relative;
  340. display: inline-block;
  341. margin: 35px auto 15px auto;
  342. outline: none;
  343. color: {color:accent1};
  344. text-decoration: none;
  345. text-transform: uppercase;
  346. letter-spacing: 1px;
  347. font-weight: 400;
  348. text-shadow: 0 0 1px rgba(255,255,255,0.3);
  349. font-size: 2.5em;
  350. }
  351.  
  352. nav a:hover,
  353. nav a:focus {
  354. outline: none;
  355. }
  356.  
  357. .albiceleste {
  358. font-family: 'Lato', Arial, Sans-Serif;
  359. position: relative;
  360. text-align:center;
  361. z-index: 1;
  362. margin-top:40px;
  363. left:0.5%;
  364. }
  365.  
  366. .albiceleste a {
  367. padding: 0 5px;
  368. color: {color:accent1};
  369. font-weight: 700;
  370. -webkit-transition: color 0.3s;
  371. -moz-transition: color 0.3s;
  372. transition: color 0.3s;
  373. }
  374.  
  375. .albiceleste a::before,
  376. .albiceleste a::after {
  377. position: absolute;
  378. width: 100%;
  379. left: 0;
  380. top: 50%;
  381. height: 2px;
  382. margin-top: -1px;
  383. background: {color:accent1};
  384. content: '';
  385. z-index: -1;
  386. -webkit-transition: -webkit-transform 0.3s, opacity 0.3s;
  387. -moz-transition: -moz-transform 0.3s, opacity 0.3s;
  388. transition: transform 0.3s, opacity 0.3s;
  389. pointer-events: none;
  390. }
  391.  
  392. .albiceleste a::before {
  393. -webkit-transform: translateY(-20px);
  394. -moz-transform: translateY(-20px);
  395. transform: translateY(-20px);
  396. }
  397.  
  398. .albiceleste a::after {
  399. -webkit-transform: translateY(20px);
  400. -moz-transform: translateY(20px);
  401. transform: translateY(20px);
  402. }
  403.  
  404. .albiceleste a:hover,
  405. .albiceleste a:focus {
  406. color: {color:accent1};
  407. }
  408.  
  409. .albiceleste a:hover::before,
  410. .albiceleste a:hover::after,
  411. .albiceleste a:focus::before,
  412. .albiceleste a:focus::after {
  413. opacity: 0.7;
  414. }
  415.  
  416. .albiceleste a:hover::before,
  417. .albiceleste a:focus::before {
  418. -webkit-transform: rotate(45deg);
  419. -moz-transform: rotate(45deg);
  420. transform: rotate(45deg);
  421. }
  422.  
  423. .albiceleste a:hover::after,
  424. .albiceleste a:focus::after {
  425. -webkit-transform: rotate(-45deg);
  426. -moz-transform: rotate(-45deg);
  427. transform: rotate(-45deg);
  428. }
  429.  
  430. /*hlinks*/
  431.  
  432. .blaugrana {
  433. font-family:'Lato', Arial, Sans-Serif;
  434. font-weight:400;
  435. text-align:center;
  436. position: relative;
  437. left:1%;
  438. margin: 5px auto;
  439. width: 560px;
  440. -webkit-transition: all 0.3s;
  441. -moz-transition: all 0.3s;
  442. transition: all 0.3s;
  443. }
  444.  
  445. .blaugrana a {
  446. color:{color:accent1};
  447. font-size:16px;
  448. margin:15px;
  449. display:inline-block;
  450. }
  451.  
  452. .blaugrana a::after {
  453. position: absolute;
  454. top: 100%;
  455. left: 0;
  456. width: 100%;
  457. height: 1px;
  458. background: {color:accent1};
  459. content: '';
  460. opacity: 0;
  461. -webkit-transition: height 0.3s, opacity 0.3s, -webkit-transform 0.3s;
  462. -moz-transition: height 0.3s, opacity 0.3s, -moz-transform 0.3s;
  463. transition: height 0.3s, opacity 0.3s, transform 0.3s;
  464. -webkit-transform: translateY(-10px);
  465. -moz-transform: translateY(-10px);
  466. transform: translateY(-10px);
  467. }
  468.  
  469. .blaugrana a:hover::after,
  470. .blaugrana a:focus::after {
  471. height: 5px;
  472. opacity: 1;
  473. -webkit-transform: translateY(0px);
  474. -moz-transform: translateY(0px);
  475. transform: translateY(0px);
  476. }
  477.  
  478. /*conts*/
  479.  
  480. #t1, #t2, #t3, #t4, #t5 {
  481.  
  482. width:560px;
  483. {block:iffixedheader}
  484. position:relative;
  485. top:200px;
  486. {/block:iffixedheader}
  487. margin:0 auto;
  488. display:none;
  489.  
  490. }
  491.  
  492. #t1 {
  493. display:block;
  494. }
  495.  
  496. /*Howler*/
  497. #t2 h1 {
  498. font-family: 'roboto', Arial, sans-serif;
  499. font-weight:300;
  500. color:{color:accent1};
  501. text-align:center;
  502. }
  503. .howler {
  504. {block:if400px}
  505. width:400px;
  506. {/block:if400px}
  507.  
  508. {block:ifnot400px}
  509. width:500px;
  510. {/block:ifnot400px}
  511. padding:25px;
  512. margin:25px auto;
  513. {block:ifnotfadedposts}
  514. background: #fff;
  515. {/block:ifnotfadedposts}
  516. {block:iffadedposts}
  517. background:rgba(255,255,255,0.8);
  518. {/block:iffadedposts}
  519. text-align:left;
  520. }
  521.  
  522. #oh_no {
  523. -webkit-filter: hue-rotate(340deg);
  524. -moz-filter: hue-rotate(340deg);
  525. filter: hue-rotate(340deg);
  526. }
  527.  
  528. /*About*/
  529.  
  530. #t3 h1 {
  531. font-family: 'roboto', Arial, sans-serif;
  532. font-weight:300;
  533. color:{color:accent1};
  534. text-align:center;
  535. margin-top:15px;
  536. }
  537.  
  538. .profile {
  539. {block:if400px}
  540. width:400px;
  541. {/block:if400px}
  542.  
  543. {block:ifnot400px}
  544. width:500px;
  545. {/block:ifnot400px}
  546. font-family:'Lato', Arial, Sans-Serif;
  547. font-weight:400;
  548. font-size:1em;
  549. padding:25px;
  550. margin:25px auto;
  551. {block:ifnotfadedposts}
  552. background: #fff;
  553. {/block:ifnotfadedposts}
  554. {block:iffadedposts}
  555. background:rgba(255,255,255,0.8);
  556. {/block:iffadedposts}
  557. text-align:center;
  558. }
  559.  
  560. /*Maraudering*/
  561.  
  562. .marauders {
  563.  
  564. width:500px;
  565. padding:25px;
  566. margin:0 auto;
  567. text-align:center;
  568.  
  569. }
  570.  
  571. .marauders a {
  572. color:{color:accent1};
  573. font-family: 'Lato', Arial, Sans-Serif;
  574. font-weight:400;
  575. width:120px;
  576. font-size:1.2em;
  577. display:inline-block;
  578. padding:10px;
  579. margin:5px;
  580.  
  581. }
  582.  
  583. .marauders a::before,
  584. .marauders a::after {
  585. position: absolute;
  586. top: 0;
  587. left: 0;
  588. width: 100%;
  589. height: 100%;
  590. border: 2px solid {color:accent1};
  591. content: '';
  592. -webkit-transition: -webkit-transform 0.3s, opacity 0.3s;
  593. -moz-transition: -moz-transform 0.3s, opacity 0.3s;
  594. transition: transform 0.3s, opacity 0.3s;
  595. }
  596.  
  597. .marauders a::after {
  598. border-color: {color:accent2};
  599. opacity: 0;
  600. -webkit-transform: translateY(-7px) translateX(6px);
  601. -moz-transform: translateY(-7px) translateX(6px);
  602. transform: translateY(-7px) translateX(6px);
  603. }
  604.  
  605. .marauders a:hover::before,
  606. .marauders a:focus::before {
  607. opacity: 0;
  608. -webkit-transform: translateY(5px) translateX(-5px);
  609. -moz-transform: translateY(5px) translateX(-5px);
  610. transform: translateY(5px) translateX(-5px);
  611. }
  612.  
  613. .marauders a:hover::after,
  614. .marauders a:focus::after {
  615. opacity: 1;
  616. -webkit-transform: translateY(0px) translateX(0px);
  617. -moz-transform: translateY(0px) translateX(0px);
  618. transform: translateY(0px) translateX(0px);
  619. }
  620.  
  621. .marauders a:empty {
  622. visibility:hidden;
  623. }
  624.  
  625. /*Mes Que Un Club*/
  626.  
  627. .da {
  628.  
  629. position:relative;
  630. width:560px;
  631. padding:25px;
  632. margin:5px auto;
  633. text-align:center;
  634.  
  635. }
  636.  
  637. .da:before,
  638. .da:after {
  639. content:"";
  640. display:table;
  641. }
  642. .da:after {
  643. clear:both;
  644. }
  645.  
  646. .wizards {
  647.  
  648. width:96px;
  649. height:96px;
  650. background:#fff;
  651. padding:10px;
  652. margin:10px;
  653. float:left;
  654. transition:
  655. all 0.4s ease-in-out;
  656. -webkit-transition:all 0.4s ease-in-out;
  657. -moz-transition:all 0.4s ease-in-out;
  658. -o-transition:all 0.4s ease-in-out;
  659. -ms-transition:all 0.4s ease-in-out;
  660.  
  661. -webkit-backface-visibility: hidden;
  662. }
  663.  
  664. .da .wizards.blur{
  665. box-shadow: 0px 0px 20px 10px #fafafa;
  666. transform: scale(0.9);
  667. -webkit-transform: scale(0.9);
  668. -moz-transform: scale(0.9);
  669. -o-transform: scale(0.9);
  670. -ms-transform: scale(0.9);
  671. opacity: 0.7;
  672. -moz-filter:blur(5px);
  673. -webkit-filter: blur(5px);
  674. filter: blur(5px);
  675. }
  676.  
  677. .da .wizards.active{
  678. transform: scale(1.05);
  679. -webkit-transform: scale(1.05);
  680. -moz-transform: scale(1.05);
  681. -o-transform: scale(1.05);
  682. -ms-transform: scale(1.05);
  683. z-index: 100;
  684. opacity: 1;
  685. -webkit-filter: blur(0px);
  686. -moz-filter:blur(0px);
  687. filter: blur(0px);
  688. transition:
  689. all 0.4s ease-in-out;
  690. -webkit-transition:all 0.4s ease-in-out;
  691. -moz-transition:all 0.4s ease-in-out;
  692. -o-transition:all 0.4s ease-in-out;
  693. -ms-transition:all 0.4s ease-in-out;
  694. }
  695.  
  696.  
  697. /*posts*/
  698.  
  699.  
  700. .campnou{
  701. position:relative;
  702. width:100%;
  703. margin: 0 auto 50px auto;
  704. padding-left:15px;
  705. padding:right:15px;
  706.  
  707. }
  708.  
  709.  
  710. .posts{
  711. {block:if400px}
  712. width:400px;
  713. {/block:if400px}
  714. {block:ifnot400px}
  715. width: 500px;
  716. {/block:ifnot400px}
  717. line-height:140%;
  718. padding:25px;
  719. margin:25px auto 50px auto;
  720. {block:ifnotfadedposts}
  721. background: #fff;
  722. {/block:ifnotfadedposts}
  723. {block:iffadedposts}
  724. background:rgba(255,255,255,0.8);
  725. {/block:iffadedposts}
  726. text-align: left;
  727. text-transform: none;
  728. }
  729.  
  730. .posts img {
  731. max-width:100%;
  732. height:auto;
  733. }
  734.  
  735.  
  736. /*t*/
  737.  
  738. .titre {
  739. text-align:center;
  740. font-weight:bold;
  741. font-family:'Raleway', Arial, Sans-Serif;
  742. font-size:1.5em;
  743. line-height:160%;
  744. margin-bottom:15px;
  745. }
  746.  
  747. /*lightbox*/
  748. #tumblr_lightbox, .tmblr-lightbox {background:rgba({RGBcolor:lightbox},0.8)!important;}
  749. #tumblr_lightbox img, .tmblr-lightbox .vignette {
  750. opacity:0;
  751. border-radius:0!important;
  752. -moz-border-radius: 0!important;
  753. -webkit-border-radius: 0!important;
  754. -o-border-radius: 0!important;
  755. -webkit-box-shadow:none!important;
  756. box-shadow:none!important;
  757. }
  758. #tumblr_lightbox_center_image, #tumblr_lightbox_left_image, #tumblr_lightbox_right_image, .tmblr-lightbox .lightbox-image {
  759. opacity: 1!important;
  760. box-shadow: 0 0 0 transparent !important;
  761. border-radius: 0!important;
  762. -moz-border-radius: 0!important;
  763. -webkit-border-radius: 0!important;
  764. -o-border-radius: 0!important;
  765. padding: 10px!important;
  766. border: 1px solid #fff!important;
  767. background-color: #fff!important;
  768. }
  769.  
  770. .tmblr-lightbox .lightbox-caption { visibility: hidden; }
  771.  
  772.  
  773. /*audio*/
  774.  
  775. .flitwick {
  776. width:100%;
  777. display:flex;
  778. display:-webkit-flex;
  779. display:-moz-flex;
  780. display:-ms-flex;
  781. align-items:center;
  782. -webkit-align-itens:center;
  783. -moz-align-items:center;
  784. -ms-align-items:center;
  785. display: -webkit-box;
  786. -webkit-box-align: center;
  787. position:relative;
  788. }
  789.  
  790. .grammy {
  791. width:100px;
  792. height:100px;
  793. position:relative;
  794. margin-left:0;
  795. }
  796.  
  797.  
  798.  
  799. .mariah {
  800. position:absolute;
  801. background:#fff;
  802. z-index:10;
  803. opacity:0;
  804. margin-top:10px;
  805. margin-left:10px;
  806. width:80px;
  807. height:80px;
  808. text-align:center;
  809. transition: all 0.3s ease-in-out;
  810. -webkit-transition: all 0.3s ease-in-out;
  811. -moz-transition: all 0.3s ease-in-out;
  812. -o-transition: all 0.3s ease-in-out;
  813. }
  814.  
  815. .mariah:hover {
  816. opacity:0.8;
  817. transition: all 0.3s ease-in-out;
  818. -webkit-transition: all 0.3s ease-in-out;
  819. -moz-transition: all 0.3s ease-in-out;
  820. -o-transition: all 0.3s ease-in-out;
  821. }
  822.  
  823. .playbox {
  824. width:40px;
  825. height:40px;
  826. margin-top:25px;
  827. margin-left:20px;
  828. overflow:hidden;
  829. }
  830.  
  831.  
  832.  
  833. .taylor {
  834. {block:if400px}
  835. width:300px;
  836. {/block:if400px}
  837. {block:ifnot400px}
  838. width:400px;
  839. {/block:ifnot400px}
  840. height:100px;
  841. padding:0;
  842. margin-left:0px;
  843. background:#fafafa;
  844. display:flex;
  845. display:-webkit-flex;
  846. display:-moz-flex;
  847. display:-ms-flex;
  848. align-items:center;
  849. -webkit-align-itens:center;
  850. -moz-align-items:center;
  851. -ms-align-items:center;
  852. justify-content:center;
  853. -webkit-justify-content:center;
  854. -moz-justify-content:center;
  855. -ms-justify-content:center;
  856. display: -webkit-box;
  857. -webkit-box-align: center;
  858. -webkit-box-pack: center;
  859.  
  860. }
  861.  
  862. .swift {
  863. {block:if400px}
  864. max-width:250px;
  865. {/block:if400px}
  866. {block:ifnot400px}
  867. max-width:350px;
  868. {/block:ifnot400px}
  869. color:#000;
  870. font-weight:400;
  871. }
  872.  
  873. .swift b {
  874. font-family:'raleway', arial,sans-serif;
  875. font-weight:700;
  876. color:#000;
  877. }
  878.  
  879. /*chat*/
  880.  
  881. .chats {
  882. line-height:22px;
  883. padding:5px;
  884. }
  885.  
  886. .chats strong {
  887. font-family:'roboto', arial, sans-serif;
  888. }
  889.  
  890. /*quotes*/
  891.  
  892. .quotes {
  893. font-weight:bold;
  894. font-size:1.2em;
  895. display:inline;
  896. line-height:140%;
  897. }
  898.  
  899. .speaker {
  900. margin-top:25px;
  901. text-align:right;
  902. }
  903.  
  904. /*link posts*/
  905. .link_cont {
  906. width:100%;
  907. display:flex;
  908. display: -webkit-flex;
  909. display: -moz-flex;
  910. display: -ms-flex;
  911. -webkit-align-items:center;
  912. -ms-align-items:center;
  913. align-items: center;
  914. -webkit-justify-content:center;
  915. -ms-justify-content:center;
  916. justify-content: center;
  917. padding:0;
  918. }
  919.  
  920.  
  921. .malfoy {
  922.  
  923. width:100%;
  924. position: relative;
  925. z-index: 1;
  926.  
  927.  
  928. }
  929.  
  930. .malfoy a {
  931. width:100%;
  932. text-align:center;
  933. white-space: nowrap;
  934. overflow: hidden;
  935. text-overflow: ellipsis;
  936. margin: 0 auto;
  937. height:80px;
  938. line-height:55px;
  939.  
  940. }
  941.  
  942. .malfoy a span {
  943. width:100%;
  944. height:80px;
  945. line-height:55px;
  946. text-align:center;
  947. white-space: nowrap;
  948. overflow:hidden;
  949. text-overflow: ellipsis;
  950. display: block;
  951. padding: 10px;
  952. background: {color:accent2};
  953. -webkit-transition: -webkit-transform 0.3s;
  954. -moz-transition: -moz-transform 0.3s;
  955. transition: transform 0.3s;
  956. }
  957.  
  958. .malfoy a::before {
  959. position: absolute;
  960. top: 0;
  961. left: 0;
  962. z-index: -1;
  963. padding: 10px;
  964. width: 100%;
  965. height: 100%;
  966. background: #fff;
  967. color: {color:accent2};
  968. content: attr(data-hover);
  969. -webkit-transition: -webkit-transform 0.3s;
  970. -moz-transition: -moz-transform 0.3s;
  971. transition: transform 0.3s;
  972. -webkit-transform: translateX(-25%);
  973. }
  974.  
  975. .malfoy a:hover span,
  976. .malfoy a:focus span {
  977. -webkit-transform: translateX(100%);
  978. -moz-transform: translateX(100%);
  979. transform: translateX(100%);
  980. }
  981.  
  982. .malfoy a:hover::before,
  983. .malfoy a:focus::before {
  984. -webkit-transform: translateX(0%);
  985. -moz-transform: translateX(0%);
  986. transform: translateX(0%);
  987. }
  988.  
  989. /*ask posts*/
  990.  
  991. .ask_cont {
  992. width:100%;
  993. padding:10px;
  994. display:flex;
  995. display: -webkit-flex;
  996. display: -moz-flex;
  997. display: -ms-flex;
  998. align-items: center;
  999. -webkit-align-items:center;
  1000. -ms-align-items:center;
  1001. }
  1002.  
  1003. .questions a {
  1004.  
  1005. font-size:16px;
  1006. font-weight:700;
  1007. color:{color:accent2};
  1008. text-decoration:underline;
  1009. transition: all 0.3s ease-in-out;
  1010. -webkit-transition: all 0.3s ease-in-out;
  1011. -moz-transition: all 0.3s ease-in-out;
  1012. -o-transition: all 0.3s ease-in-out;
  1013. }
  1014.  
  1015. .questions a:hover {
  1016. color:{color:accent3};
  1017. transition: all 0.3s ease-in-out;
  1018. -webkit-transition: all 0.3s ease-in-out;
  1019. -moz-transition: all 0.3s ease-in-out;
  1020. -o-transition: all 0.3s ease-in-out;
  1021. }
  1022.  
  1023. .questions {
  1024.  
  1025. left:15px;
  1026. position:relative;
  1027. text-align:left;
  1028. {block:if400px}
  1029. width:300px;
  1030. {/block:if400px}
  1031. {block:ifnot400px}
  1032. width:400px;
  1033. {/block:ifnot400px}
  1034. color:#000;
  1035. font-weight:normal;
  1036. padding:10px 15px 20px 15px;
  1037. background: transparent;
  1038. word-wrap:break-word;
  1039. }
  1040.  
  1041.  
  1042. .asker img {
  1043. border-radius:50px;
  1044. -moz-border-radius: 50px;
  1045. -webkit-border-radius: 50px;
  1046. -o-border-radius: 50px;
  1047. transition: all 0.3s ease-in-out;
  1048. -webkit-transition: all 0.3s ease-in-out;
  1049. -moz-transition: all 0.3s ease-in-out;
  1050. -o-transition: all 0.3s ease-in-out;
  1051.  
  1052. }
  1053.  
  1054. .asker img:hover {
  1055.  
  1056. opacity:0.5;
  1057. -moz-transform: rotate(360deg); /* IE 9 */
  1058. -webkit-transform: rotate(360deg); /* Chrome, Safari, Opera */
  1059. transform: rotate(360deg);
  1060.  
  1061. transition: all 0.3s ease-in-out;
  1062. -webkit-transition: all 0.3s ease-in-out;
  1063. -moz-transition: all 0.3s ease-in-out;
  1064. -o-transition: all 0.3s ease-in-out;
  1065. }
  1066.  
  1067.  
  1068. /*pg*/
  1069.  
  1070. #pg {
  1071.  
  1072. position:relative;
  1073. margin:-30px auto 30px auto;
  1074. width:100%;
  1075. text-align:center;
  1076. font-size:1.5em;
  1077. word-spacing:30px;
  1078. }
  1079.  
  1080. #pg a {
  1081. color:{color:accent1};
  1082. }
  1083.  
  1084. /*footer*/
  1085.  
  1086. .footies {
  1087. width:100%;
  1088. text-align:center;
  1089. word-spacing:20px;
  1090. padding-top:25px;
  1091. font-size:1em;
  1092. text-transform:uppercase;
  1093.  
  1094. }
  1095.  
  1096. .footies a{
  1097. color:{color:accent2};
  1098. font-weight:bold;
  1099. }
  1100.  
  1101. .footies a:hover {
  1102. color:{color:accent3};
  1103. }
  1104.  
  1105. .tags {
  1106. text-align:center;
  1107. width:100%;
  1108. padding-top:10px;
  1109. margin:5px auto 0 auto;
  1110. word-wrap: break-word;
  1111. color:#fafafa;
  1112. font-size:12px;
  1113. text-transform:none;
  1114. }
  1115.  
  1116. .tags a {
  1117. font-weight:normal;
  1118. display:inline-block;
  1119. padding:5px;
  1120. color:{color:tags};
  1121. }
  1122.  
  1123. .tags a:hover {
  1124. color:{color:hover};
  1125. transition: all 0.3s ease-in-out;
  1126. -webkit-transition: all 0.3s ease-in-out;
  1127. -moz-transition: all 0.3s ease-in-out;
  1128. -o-transition: all 0.3s ease-in-out;
  1129. }
  1130.  
  1131. .tags .comma:last-child {
  1132. display: none;
  1133. }
  1134.  
  1135. /*notes*/
  1136.  
  1137.  
  1138. ol.notes {
  1139. padding: 0px;
  1140. font-family:'Lato', Arial, Sans-Serif;
  1141. margin: 10px auto;
  1142. list-style-type: none;
  1143. }
  1144. ol.notes a{
  1145. font-weight:400;
  1146. }
  1147.  
  1148. ol.notes li.note {
  1149. padding:10px 5px;
  1150. line-height:140%;
  1151. text-align:left;
  1152. }
  1153.  
  1154. ol.notes li.note img.avatar {
  1155. vertical-align: -4px;
  1156. margin-right: 10px;
  1157. width: 16px;
  1158. height: 16px;
  1159. }
  1160.  
  1161. ol.notes li.note span.action {
  1162. font-weight: normal;
  1163. }
  1164.  
  1165. ol.notes li.note .answer_content {
  1166. font-weight: normal;
  1167. }
  1168.  
  1169. ol.notes li.note blockquote {
  1170. border-color: {color:blockquote};
  1171. padding: 4px 10px;
  1172. margin: 10px 0px 0px 25px;
  1173. }
  1174.  
  1175. ol.notes li.note blockquote a {
  1176. text-decoration: none;
  1177. }
  1178.  
  1179. /*PLEASE DO NOT ALTER OR COVER THE CREDIT, THANKS! C: */
  1180. #leo {
  1181.  
  1182. font-family: Arial, Sans-Serif;
  1183. text-transform:uppercase;
  1184. text-align:center;
  1185. z-index:99;
  1186.  
  1187. }
  1188.  
  1189. #leo a {
  1190.  
  1191. position:fixed;
  1192. font-size:12px;
  1193. line-height:16px;
  1194. width:18px;
  1195. height:18px;
  1196. font-weight:300;
  1197. bottom:10px;
  1198. right:10px;
  1199. color:#000;
  1200. background:rgba(255,255,255,0.4);
  1201. padding:5px;
  1202. transition: all 1s ease-in-out;
  1203. -webkit-transition: all 1s ease-in-out;
  1204. -o-transition: all 1s ease-in-out;
  1205. -moz-transition: all 1s ease-in-out;
  1206.  
  1207. }
  1208.  
  1209. #leo a:hover {
  1210. background-color:rgba(0,0,0,1);
  1211. color:#fff;
  1212. border-radius:50%;
  1213. -webkit-animation: hermione 1s; /* Chrome, Safari, Opera */
  1214. -moz-animation: hermione 1s;
  1215. -o-animation: hermione 1s;
  1216. animation: hermione 1s;
  1217. animation-timing-function: ease-in-out;
  1218. -webkit-animation-timing-function: ease-in-out;
  1219. -moz-animation-timing-function: ease-in-out;
  1220. -o-animation-timing-function: ease-in-out;
  1221.  
  1222. -moz-transform: rotate(720deg); /* IE 9 */
  1223. -webkit-transform: rotate(720deg); /* Chrome, Safari, Opera */
  1224. transform: rotate(720deg);
  1225.  
  1226. transition: all 1s ease-in-out;
  1227. -webkit-transition: all 1s ease-in-out;
  1228. -o-transition: all 1s ease-in-out;
  1229. -moz-transition: all 1s ease-in-out;
  1230.  
  1231.  
  1232. }
  1233.  
  1234. @-webkit-keyframes hermione {
  1235. 0% {color:#000;}
  1236. 25% {color:#ACE4EA;}
  1237. 50% {color:#FFFBDD;}
  1238. 75% {color:#ACE4EA;}
  1239. 100% {color:#fff;}
  1240. }
  1241. @-moz-keyframes hermione {
  1242. 0% {color:#000;}
  1243. 25% {color:#ACE4EA;}
  1244. 50% {color:#FFFBDD;}
  1245. 75% {color:#ACE4EA;}
  1246. 100% {color:#fff;}
  1247. }
  1248. @-o-keyframes hermione {
  1249. 0% {color:#000;}
  1250. 25% {color:#ACE4EA;}
  1251. 50% {color:#FFFBDD;}
  1252. 75% {color:#ACE4EA;}
  1253. 100% {color:#fff;}
  1254. }
  1255.  
  1256. @keyframes hermione {
  1257. 0% {color:#000;}
  1258. 25% {color:#ACE4EA;}
  1259. 50% {color:#FFFBDD;}
  1260. 75% {color:#ACE4EA;}
  1261. 100% {color:#fff;}
  1262. }
  1263. /*END OF CREDIT*/
  1264.  
  1265. {CustomCSS}
  1266.  
  1267. </style>
  1268.  
  1269. </head>
  1270.  
  1271. <body>
  1272.  
  1273. <div class="barca">
  1274. <nav class="albiceleste" id="albiceleste">
  1275. <a href="/" data-hover="{Title}">{Title}</a>
  1276. </nav>
  1277.  
  1278. <nav class="blaugrana">
  1279.  
  1280. <a class="index" href="#">Home</a>
  1281. <a class="owlery" href="#">Ask</a>
  1282. <a class="info" href="#" style="cursor:help;">Info</a>
  1283. <a class="map" href="#" style="cursor:help;">Links</a>
  1284. {block:Following}
  1285. <a class="blogroll" href="#">Blogroll</a>
  1286. {/block:Following}
  1287.  
  1288. </nav>
  1289. </div>
  1290.  
  1291. <div id="t1">
  1292. <div class="campnou">
  1293. {Block:Posts}
  1294. <div class="posts">
  1295. {block:Photo}
  1296. {LinkOpenTag}<img src="{PhotoURL-500}" width="100%" height="auto"/>{LinkCloseTag}
  1297. {block:Caption}{Caption}{/block:Caption}
  1298. {/block:Photo}
  1299.  
  1300. {block:Photoset}
  1301. {Photoset}
  1302. {block:Caption}{Caption}{/block:Caption}
  1303. {/block:Photoset}
  1304.  
  1305. {block:Video}
  1306. {Video-500}
  1307. {block:Caption}{Caption}{/block:Caption}
  1308. {/block:Video}
  1309.  
  1310. {block:Audio}
  1311. <div class="flitwick">
  1312.  
  1313. <div class="mariah">
  1314. <div class="playbox">{AudioPlayerWhite}</div>
  1315. </div>
  1316.  
  1317. <div class="grammy">
  1318. <img src="http://static.tumblr.com/jn9hrij/20Ul2zzsr/albumart.jpg" style="position:absolute;" width="100" height="100" />
  1319. {block:AlbumArt}
  1320. <img src="{AlbumArtURL}" style="position:absolute;">
  1321. {/block:AlbumArt}
  1322. </div>
  1323.  
  1324.  
  1325. <div class="taylor">
  1326. <div class="swift">
  1327. {block:TrackName}
  1328. <b>Song:</b> {TrackName}
  1329. {/block:TrackName}<br>
  1330.  
  1331. {block:Artist}
  1332. <b>Artist:</b> {Artist}
  1333. {/block:Artist}<br>
  1334.  
  1335. {block:Album}
  1336. <b>Album:</b> {Album}
  1337. {/block:Album}
  1338.  
  1339. </div>
  1340. </div>
  1341.  
  1342. </div>
  1343. {block:Caption}<p>{Caption}</p>{/block:Caption}
  1344. {/block:Audio}
  1345.  
  1346. {block:Quote}
  1347. <div class="quotes">{Quote}</div>
  1348. {block:Source}
  1349. <div class="speaker">
  1350. {Source}
  1351. </div>
  1352. {/block:Source}
  1353. {/block:Quote}
  1354.  
  1355. {block:Text}
  1356. {block:Title}<div class="titre">{Title}</div>{/block:Title}
  1357. {Body}
  1358. {/block:Text}
  1359.  
  1360. {block:Answer}
  1361.  
  1362. <div class="ask_cont">
  1363. <div class="asker">
  1364. <a href="{AskerURL}">
  1365. <img src="{AskerPortraitURL-48}" align="left">
  1366. </a>
  1367. </div>
  1368. <div class="questions">
  1369. <p>{Asker}: {Question}</p>
  1370.  
  1371. </div>
  1372. </div>
  1373.  
  1374. {Answer}
  1375. {/block:Answer}
  1376.  
  1377. {block:Chat}
  1378. {block:Title}<div class="titre">{Title}</div>{/block:Title}
  1379. {block:Lines}
  1380. <div class="chats">
  1381. {block:Label}<strong>{Label}</strong>{/block:Label} {Line}<br />
  1382. </div>
  1383. {/block:Lines}
  1384. {/block:Chat}
  1385.  
  1386. {block:Link}
  1387. <div class="link_cont">
  1388. <nav class="malfoy" id="malfoy">
  1389. <a href="{URL}" data-hover="{Name}"><span>{Name}</span></a>
  1390. </nav>
  1391.  
  1392. </div>
  1393.  
  1394.  
  1395. {block:Description}{Description}{/block:Description}
  1396. {/block:Link}
  1397.  
  1398. {Block:Date}
  1399. <div class="footies">
  1400. <a href="{Permalink}">{ShortMonth}{DayOfMonth}</a>
  1401. {block:NoteCount}
  1402. <a href="{Permalink}">{NoteCount}+</a>
  1403. {/block:NoteCount}
  1404.  
  1405. {block:RebloggedFrom}
  1406. <a href="{ReblogParentURL}" title="{ReblogParentName}">via</a>
  1407.  
  1408. {block:ContentSource}
  1409. <a href="{SourceURL}" title="{ReblogRootName}">src</a>
  1410. {/block:ContentSource}
  1411. {/block:RebloggedFrom}
  1412.  
  1413. <a href="{ReblogURL}">reblog</a>
  1414. </div>
  1415.  
  1416. {block:HasTags}
  1417. <div class="tags">
  1418. {block:Tags}
  1419. <a href="{TagURL}">{Tag}</a>
  1420. {/block:Tags}
  1421. </div>
  1422. {/block:HasTags}
  1423.  
  1424. </div>
  1425.  
  1426. {block:PermalinkPage}
  1427.  
  1428. {block:NoteCount}
  1429. <div class="posts">
  1430.  
  1431. <center><h3>Notes</h3></center>
  1432. {block:PostNotes}
  1433. {PostNotes}
  1434. {/block:PostNotes}
  1435. </div>
  1436. {/block:NoteCount}
  1437.  
  1438.  
  1439. {/block:PermalinkPage}
  1440. {/Block:Date}
  1441.  
  1442. {/Block:Posts}
  1443.  
  1444. </div>
  1445.  
  1446. {block:ifnotfixedheader}
  1447. <div id="pg" class='animatedParent'>
  1448.  
  1449. {block:Pagination}
  1450. {block:PreviousPage}
  1451. <a class='animated bounceInLeft' href="{PreviousPage}">&#8592;Back</a>
  1452. {/block:PreviousPage}
  1453. {block:NextPage}
  1454. <a class='animated bounceInRight' href="{NextPage}">Forth&#8594;</a>
  1455. {/block:NextPage}
  1456. {/block:Pagination}
  1457.  
  1458.  
  1459. </div>
  1460. {/block:ifnotfixedheader}
  1461.  
  1462. {block:iffixedheader}
  1463. <div id="pg">
  1464. {block:Pagination}
  1465. {block:PreviousPage}
  1466. <a href="{PreviousPage}">&#8592;Back</a>
  1467. {/block:PreviousPage}
  1468. {block:NextPage}
  1469. <a href="{NextPage}">Forth&#8594;</a>
  1470. {/block:NextPage}
  1471. {/block:Pagination}
  1472. </div>
  1473. {/block:iffixedheader}
  1474. </div>
  1475.  
  1476. <div id="t2">
  1477. <h1>{AskLabel}</h1>
  1478. <div class="howler">
  1479. <div id="oh_no">
  1480. <iframe frameborder="0" scrolling="no" width="100%" height="190" src="http://www.tumblr.com/ask_form/{Name}.tumblr.com" style="background-color:transparent; overflow:auto;" id="ask_form"></iframe>
  1481. </div>
  1482. </div>
  1483.  
  1484. </div>
  1485.  
  1486. <div id="t3">
  1487. <h1>{text:info}</h1>
  1488. <div class="profile">
  1489. {Block:Description}
  1490. <p> {Description}</p>
  1491. {/Block:Description}
  1492. <hr>
  1493. <p>
  1494. {text:upd}
  1495. </p>
  1496.  
  1497. </div>
  1498. </div>
  1499.  
  1500. <div id="t4">
  1501. <nav class="marauders" id="marauders">
  1502. <a href="{text:Link1 URL}">{text:Link1}</a>
  1503. <a href="{text:Link2 URL}">{text:Link2}</a>
  1504. <a href="{text:Link3 URL}">{text:Link3}</a>
  1505. <a href="{text:Link4 URL}">{text:Link4}</a>
  1506. <a href="{text:Link5 URL}">{text:Link5}</a>
  1507. <a href="{text:Link6 URL}">{text:Link6}</a>
  1508. <a href="{text:Link7 URL}">{text:Link7}</a>
  1509. <a href="{text:Link8 URL}">{text:Link8}</a>
  1510. <a href="{text:Link9 URL}">{text:Link9}</a>
  1511. </nav>
  1512. </div>
  1513.  
  1514. <div id="t5">
  1515. {block:Following}
  1516. <section class="da" id="da">
  1517.  
  1518.  
  1519. {block:Followed}
  1520. <div class="wizards">
  1521. <a href="{FollowedURL}" title="{FollowedName}">
  1522. <img src="{FollowedPortraitURL-96}">
  1523. </a>
  1524. </div>
  1525. {/block:Followed}
  1526.  
  1527. </section>
  1528. {/block:Following}
  1529. </div>
  1530.  
  1531.  
  1532. <!--PLEASE DO NOT ALTER OR COVER THE CREDIT-->
  1533. <div id="leo">
  1534. <a href="http://hermionejean.co.vu">♚</a>
  1535. </div>
  1536. <!--END OF CREDIT-->
  1537.  
  1538.  
  1539. <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  1540. <script type="text/javascript">
  1541. $(function() {
  1542.  
  1543. var $container = $('#da'),
  1544. $articles = $container.children('.wizards'),
  1545. timeout;
  1546.  
  1547. $articles.on( 'mouseenter', function( event ) {
  1548.  
  1549. var $article = $(this);
  1550. clearTimeout( timeout );
  1551. timeout = setTimeout( function() {
  1552.  
  1553. if( $article.hasClass('active') ) return false;
  1554.  
  1555. $articles.not( $article.removeClass('blur').addClass('active') )
  1556. .removeClass('active')
  1557. .addClass('blur');
  1558.  
  1559. }, 65 );
  1560.  
  1561. });
  1562.  
  1563. $container.on( 'mouseleave', function( event ) {
  1564.  
  1565. clearTimeout( timeout );
  1566. $articles.removeClass('active blur');
  1567.  
  1568. });
  1569.  
  1570. });
  1571. </script>
  1572.  
  1573. {block:iffixedheader}
  1574. <!--Sticky Header-->
  1575. <script src="http://static.tumblr.com/xbvpdcx/8a7nkqvai/classie.js" ></script>
  1576. <script>
  1577. /**
  1578. * cbpAnimatedHeader.min.js v1.0.0
  1579. * http://www.codrops.com
  1580. *
  1581. * Licensed under the MIT license.
  1582. * http://www.opensource.org/licenses/mit-license.php
  1583. *
  1584. * Copyright 2013, Codrops
  1585. * http://www.codrops.com
  1586. */
  1587. var cbpAnimatedHeader=(function(){
  1588.  
  1589. var b=document.documentElement,g=document.querySelector(".barca"),
  1590. e=false,a=150;function f(){window.addEventListener("scroll",function(h){if(!e){e=true;setTimeout(d,250)}},false)}function d(){var h=c();if(h>=a){classie.add(g,"midget")}else{classie.remove(g,"midget")}e=false}function c(){return window.pageYOffset||b.scrollTop}f()})();
  1591. </script>
  1592. {/block:iffixedheader}
  1593. <script type="text/javascript" src="http://static.tumblr.com/xbvpdcx/RSrnk5nfg/css3-animate-it.js"></script>
  1594. </body>
  1595. </html><!--
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement