Advertisement
hashtaqno

theme 18 by hashtaq-no

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