API tools faq
paste
Advertisement
planthed

Navigation #2

planthed
Nov 3rd, 2014
482
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 11.81 KB | None | 0 0
raw download clone embed print report
  1. <!--
  2. new navigation theme by laura ((planthed.tumblr.com)) keep the credits and i wont report you:)
  3.  
  4. ▀▀█▀▀ ▒█░▒█ ▒█▀▀▀ ▒█▀▄▀█ ▒█▀▀▀ 　 ▒█▀▀█ ▒█░░▒█ 　
  5. ░▒█░░ ▒█▀▀█ ▒█▀▀▀ ▒█▒█▒█ ▒█▀▀▀ 　 ▒█▀▀▄ ▒█▄▄▄█ 　
  6. ░▒█░░ ▒█░▒█ ▒█▄▄▄ ▒█░░▒█ ▒█▄▄▄ 　 ▒█▄▄█ ░░▒█░░
  7.  
  8. ▒█▀▀█ ▒█░░░ ░█▀▀█ ▒█▄░▒█ ▀▀█▀▀ ▒█░▒█ ▒█▀▀▀ ▒█▀▀▄
  9. ▒█▄▄█ ▒█░░░ ▒█▄▄█ ▒█▒█▒█ ░▒█░░ ▒█▀▀█ ▒█▀▀▀ ▒█░▒█
  10. ▒█░░░ ▒█▄▄█ ▒█░▒█ ▒█░░▀█ ░▒█░░ ▒█░▒█ ▒█▄▄▄ ▒█▄▄▀.TUMBLR.COM
  11.  
  12. KEEP THE CREDITS OR I'LL REPORT YOU!
  13.  
  14. icon links by: hisabeel.tumblr.com
  15.  
  16. --->
  17.  
  18. <head>
  19. <title>{Title}</title>
  20. <link rel="shortcut icon" href="{Favicon}">
  21. <link href='http://static.tumblr.com/blpgwiz/u8Qmijy1c/fade_in_up.css' rel='stylesheet' type='text/css'>
  22. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  23.  
  24.  
  25.  
  26.  
  27. <!--Styling,css-->
  28. <style type="text/css">
  29.  
  30. ::-webkit-scrollbar {width: 7px; height: 0px; background:#fff; border-left: 1px solid #fff; }
  31.  
  32. ::-webkit-scrollbar-thumb { background-color:#B0E1E8; border-bottom: 1px solid #fff; border-radius:5px; border-top: 1px solid #fff; border-left: 1px solid #fff; border-right: 1px solid #fff; }
  33.  
  34. body, a, a:hover {cursor: url(http://img69.imageshack.us/img69/7673/cursorw.png), progress;}
  35.  
  36. body{
  37. margin:0px;
  38. color: #aaa;
  39. background-attachment: fixed;
  40. padding: 0px;
  41. font-family: "calibri";
  42. background: #fafafa;
  43. }
  44.  
  45. ::selection {
  46. background:#B0E1E8; /* CHANGE THE COLOR*/
  47. color:#fff;}
  48.  
  49. ::-moz-selection {
  50. background:#B0E1E8; /* CHANGE THE COLOR*/
  51. color:#fff;}
  52.  
  53. a:link, a:active, a:visited{cursor: url(http://img69.imageshack.us/img69/7673/cursorw.png), auto;
  54.  
  55. color: #B0E1E8; /* change the color*/
  56. text-decoration: none;
  57. -webkit-transition: color 0.5s ease-out;
  58. -moz-transition: color 0.5s ease-out;
  59.  
  60. }
  61.  
  62.  
  63. a:hover{cursor: url(http://img69.imageshack.us/img69/7673/cursorw.png), auto;color:#B0E1E8; /* change the color*/
  64. -webkit-transition-duration: .9s;
  65. -webkit-transition: color 0.3s ease-out;
  66. -moz-transition: color 0.3s ease-out;
  67.  
  68. }
  69.  
  70. @font-face { font-family:"petit"; src: url('http://static.tumblr.com/jpkny6t/Ftxmqvdxg/petit-formal-script.regular.ttf'); }
  71.  
  72.  
  73.  
  74. #title{font-family:petit;text-align: center;font-size:20px;
  75. padding-top:15px;
  76. opacity:1.0;
  77. margin-left:400px;
  78. margin-top:86px;
  79. position:fixed;
  80. z-index:999999999999;
  81. transition: all 0.9s ease-out;
  82. -o-transition-transition: all 0.9s ease-out;
  83. -webkit-transition: all 0.9s ease-out;
  84. -moz-transition: all 0.9s ease-out;
  85. -webkit-animation: fadeInUp 2s;
  86. -moz-animation: fadeInUp 2s;
  87. -ms-animation: fadeInUp 2s;
  88. background:white; /* CHANGE THE COLOR*/
  89. color:#B0E1E8; /* CHANGE THE COLOR*/
  90. border: 1px solid #ddd;
  91. outline-offset:-8px;
  92. outline:1px solid #ddd;
  93. width:440px;
  94. height:40px;
  95.  
  96. }
  97.  
  98. #title:hover{border: 1px solid #fff;
  99. outline-offset:-8px;
  100. outline:1px solid #fff;
  101. background:#B0E1E8;
  102. color:#fff;
  103. }
  104.  
  105.  
  106.  
  107. #javascript-scroll{
  108. position:fixed;
  109. -webkit-filter: invert(100%);
  110. opacity: 0.7;
  111. top:5px;
  112. right:5px;
  113. height:auto;
  114. text-transform:uppercase;
  115. background: transparent;
  116. width:auto;
  117. z-index: 9999;
  118. border-radius: 5px;
  119. }
  120.  
  121.  
  122.  
  123.  
  124. .ac-container1 {
  125.  
  126. float:center;
  127. width:400px;
  128. height:auto;
  129. background: #fff;
  130.  
  131. text-align: center;
  132. padding: 20px;
  133. font-size: 12px;
  134. color: #B0E1E8;
  135. border: 1px solid #ddd;
  136. outline-offset:-13px;
  137. outline:1px solid #ddd;
  138.  
  139. z-index:9999999999;
  140. margin-top:150px;
  141. margin-left:400px;
  142. display: inline-block;transition: all 0.9s ease-out;
  143. -o-transition-transition: all 0.9s ease-out;
  144. -webkit-transition: all 0.9s ease-out;
  145. -moz-transition: all 0.9s ease-out;
  146.  
  147.  
  148. -webkit-animation: fadeInUp 2s;
  149. -moz-animation: fadeInUp 2s;
  150. -ms-animation: fadeInUp 2s;
  151. }
  152.  
  153.  
  154.  
  155.  
  156. #link a {
  157. opacity:1 ;
  158. text-decoration:none;
  159. outline:none;
  160. color: #B0E1E8;
  161. -webkit-transition: all 0.8s;
  162. -moz-transition: all 0.8s;
  163. transition: all 0.8s;
  164. }
  165.  
  166.  
  167. #link a:hover {
  168. background: #B0E1E8;
  169. color:#fff;
  170. padding:auto;
  171.  
  172. -webkit-transition: all 0.8s;
  173. -moz-transition: all 0.8s;
  174. transition: all 0.8s;
  175. }
  176.  
  177.  
  178.  
  179. #infobox{
  180. font-family: calibri ;
  181. overflow:hidden;
  182. color: #fff;
  183.  
  184. background: #B0E1E8;
  185. margin:3px;
  186. padding: 5px 20px;
  187. position: relative;
  188. z-index: 20;
  189. border: 2px solid #fff;
  190. display: block;
  191. height: 30px ;
  192. line-height: 33px ;
  193. font-size: 12px;
  194.  
  195. text-align:center;
  196. z-index:9999999999;
  197. transition: all 0.9s ease-out;
  198. -o-transition-transition: all 0.9s ease-out;
  199. -webkit-transition: all 0.9s ease-out;
  200. -moz-transition: all 0.9s ease-out;
  201. }
  202.  
  203. #infobox:hover{ color:#B0E1E8;background:#fff;
  204. width:350px;
  205. transition: all 0.9s ease-out;
  206. -o-transition-transition: all 0.9s ease-out;
  207. -webkit-transition: all 0.9s ease-out;
  208. -moz-transition: all 0.9s ease-out;
  209. display: inline-block;
  210. height:100px;
  211. }
  212.  
  213. #niall{
  214. color:#aaa;
  215. width:auto;
  216. position:fixed;
  217. bottom:100px;
  218. left:0px;
  219. -webkit-transition: all .7s ease;
  220. -moz-transition: all .7s ease;
  221. -o-transition: all .7s ease;
  222. transition: all .7s ease;
  223. }
  224. #zayn{
  225. font-size:12px;
  226. font-family:arial;
  227. line-height:16px;
  228. text-align:center;
  229. height:15px;
  230. margin-top:33px;
  231. width:5px;
  232. padding:5px;
  233. padding-right:10px;
  234. background:#ffffff;
  235. margin-left:0px;
  236. position:fixed;
  237. -webkit-transition: all .7s ease;
  238. -moz-transition: all .7s ease;
  239. -o-transition: all .7s ease;
  240. transition: all .7s ease;
  241. border:1px solid #eee;
  242. }
  243.  
  244. #lol{
  245. text-align:center;
  246. width:130px;
  247. font-size:10px;
  248. background:#ffffff;
  249. height:5px;
  250. padding-top:10px;
  251. padding-bottom:10px;
  252. font-family:calibri;
  253. text-transform:uppercase;
  254. margin-left:-130px;
  255. margin-top:33px;
  256. position:fixed;
  257. -webkit-transition: all .7s ease;
  258. -moz-transition: all .7s ease;
  259. -o-transition: all .7s ease;
  260. transition: all .7s ease;
  261. border:1px solid #eee;
  262. line-height:5px;
  263. }
  264.  
  265. #niall:hover #zayn{
  266. margin-left:100px;
  267. }
  268.  
  269. #niall:hover #lol{
  270. margin-left:0px;
  271. }
  272.  
  273. #links a {opacity:.6;
  274. display:inline-block;
  275. padding:4px;
  276. background:transparent;
  277. color:{color:Text};
  278. z-index:99999999;
  279. width:30px;
  280. height:15px;
  281. margin-top:6px;
  282. border-top-left-radius:3px;
  283. border-bottom-left-radius:3px;
  284. border-top-right-radius:3px;
  285. border-bottom-right-radius:3px; -webkit-animation: fadeInUp 2s;
  286. -moz-animation: fadeInUp 2s;
  287. -ms-animation: fadeInUp 2s;
  288. }
  289.  
  290. #links {
  291. display:block;
  292. position:fixed;
  293. z-index:999999999;
  294. font-size:8.5px;
  295. margin-left:490px;
  296. margin-top:50px;
  297. opacity:1;
  298. letter-spacing:0px;
  299. text-align:center;
  300. font-family:calibri;
  301. text-transform: uppercase;
  302. -webkit-transition: all 0.7s ease-out;
  303. -moz-transition: all 0.7s ease-out;
  304. transition: all 0.7s ease-out;}
  305.  
  306.  
  307. {CustomCSS}
  308. </style>
  309. <script language="JavaScript" src="http://dl.dropbox.com/u/3173073/GothicDarkness/qTip.js"type="text/JavaScript"></script>
  310.  
  311. <style>
  312. div#qTip {
  313. padding:4px;
  314. height: auto;
  315. margin-top:5px;
  316. margin-left:10px;
  317. font-family:Geneva, 'Lucida Sans', 'Lucida Grande', 'Lucida Sans Unicode', Verdana, sans-serif;
  318. font-size:9px;
  319. display: none;
  320. text-align: center;
  321. position: absolute;
  322. line-height: 10px;
  323. text-transform:lowercase;
  324. letter-spacing:0px;
  325. z-index: 999999999999;
  326. border:1px solid #ddd;
  327. background:white;
  328. border-radius:5px;
  329. color:#aaaaaa;
  330. box-shadow:1px 1px 3px rgba(0,0,0,.1);
  331.  
  332.  
  333. }
  334.  
  335. </style>
  336.  
  337. </head>
  338. <body>
  339.  
  340. <div id="javascript-scroll"><a target="blank" href="http://planthed.tumblr.com"title="theme credit; keep it them or i'll report you!"><img src="http://i50.tinypic.com/3325qp0.png"></a></div>
  341.  
  342.  
  343.  
  344. <!--- DON'T DELETE O I'LL REPORT YOU, HAVE DIGNITY PLEASE--->
  345. <div id="niall"><div id="zayn">©</div>
  346. <div id="lol">
  347. <a href="http://planthed.tumblr.com/"target="_blank"title="keep the credits!">Theme made by Laura</a>
  348. </div></div>
  349. <!--- DON'T DELETE O I'LL REPORT YOU, HAVE DIGNITY PLEASE--->
  350.  
  351.  
  352.  
  353. <a href="http://planthed.tumblr.com"><div style="position:fixed; z-index:999999; bottom:-30px; right:5px; padding:8px; opacity:0.6;filter: url(filters.svg#grayscale);filter: gray;-webkit-filter: grayscale(1);">
  354. <img src="http://37.media.tumblr.com/484a2194795fec08ea59dcd44caf085a/tumblr_n3sibtuP3r1rgpyeqo1_500.png" style="width:300px"></div></a>
  355.  
  356.  
  357. <div id="links">
  358. <a href="/" title="link1">
  359. <img src="http://cdn1.iconfinder.com/data/icons/dortmund/dortmund-16x16/home.png"></a>
  360.  
  361. <a href="/" title="link2">
  362. <img src="http://cdn1.iconfinder.com/data/icons/dortmund/dortmund-16x16/email.png"></a>
  363.  
  364. <a href="/" title="link3">
  365. <img src="http://cdn1.iconfinder.com/data/icons/dortmund/dortmund-16x16/user.png"></a>
  366.  
  367. <a href="/" title="link4">
  368. <img src="http://cdn1.iconfinder.com/data/icons/dortmund/dortmund-16x16/zoom.png"></a>
  369.  
  370. <a href="http://layouts-by-laura.tumblr.com" title="layouts">
  371. <img src="https://cdn4.iconfinder.com/data/icons/dortmund/Dortmund-32x32/free-for-job.png"width=16px; height=18px;></a>
  372.  
  373. <a href="http://planthed.tumblr.com" title="She made this layout">
  374. <img src="https://cdn4.iconfinder.com/data/icons/dortmund/Dortmund-32x32/heart.png"width=16px; height=18px;></a>
  375. </div>
  376.  
  377.  
  378.  
  379. <div id="title">
  380.  
  381. navitagtion page
  382.  
  383. </div>
  384.  
  385.  
  386. <!--First Tab-->
  387. <section class="ac-container1"><div>
  388.  
  389. <div id="infobox">BASIC LINKS</br>
  390. <font style="font-size: 10px;color:#fff"><div style="margin-top: 3px;color:#fff;font-size:14px;text-transform:uppercase">
  391.  
  392. <div id="link">
  393.  
  394. <a href="/">Link</a> -
  395. <a href="/">Link</a> -
  396. <a href="/">Link</a> -
  397. <a href="/">Link</a> -
  398. <a href="/">Link</a> -
  399. <a href="/">Link</a> -
  400. <a href="/">Link</a> -
  401. <a href="/">Link</a> -
  402. <a href="/">Link</a> -
  403. <a href="/">Link</a> -
  404.  
  405.  
  406.  
  407. </div>
  408. </div></font></div>
  409. <div style="border-bottom: 2px solid #fff;"></div>
  410.  
  411.  
  412. <div id="infobox">FOR YOU</br>
  413. <font style="font-size: 10px;color:#fff"><div style="margin-top: 3px;color:#fff;font-size:14px;text-transform:uppercase">
  414.  
  415. <div id="link">
  416.  
  417. <a href="/">Link</a> -
  418. <a href="/">Link</a> -
  419. <a href="/">Link</a> -
  420. <a href="/">Link</a> -
  421. <a href="/">Link</a> -
  422. <a href="/">Link</a> -
  423. <a href="/">Link</a> -
  424. <a href="/">Link</a> -
  425. <a href="/">Link</a> -
  426. <a href="/">Link</a> -
  427.  
  428.  
  429.  
  430. </div>
  431. </div></font></div>
  432. <div style="border-bottom: 2px solid #fff;"></div>
  433.  
  434.  
  435. <div id="infobox">TAGS</br>
  436. <font style="font-size: 10px;color:#fff"><div style="margin-top: 3px;color:#fff;font-size:14px;text-transform:uppercase">
  437.  
  438. <div id="link">
  439.  
  440. <a href="/">Link</a> -
  441. <a href="/">Link</a> -
  442. <a href="/">Link</a> -
  443. <a href="/">Link</a> -
  444. <a href="/">Link</a> -
  445. <a href="/">Link</a> -
  446. <a href="/">Link</a> -
  447. <a href="/">Link</a> -
  448. <a href="/">Link</a> -
  449. <a href="/">Link</a> -
  450.  
  451.  
  452.  
  453. </div>
  454. </div></font></div>
  455. <div style="border-bottom: 2px solid #fff;"></div>
  456.  
  457.  
  458. <div id="infobox">CONCATC</br>
  459. <font style="font-size: 10px;color:#fff"><div style="margin-top: 3px;color:#fff;font-size:14px;text-transform:uppercase">
  460.  
  461. <div id="link">
  462.  
  463. <a href="/">Link</a> -
  464. <a href="/">Link</a> -
  465. <a href="/">Link</a> -
  466. <a href="/">Link</a> -
  467. <a href="/">Link</a> -
  468. <a href="/">Link</a> -
  469. <a href="/">Link</a> -
  470. <a href="/">Link</a> -
  471. <a href="/">Link</a> -
  472. <a href="/">Link</a> -
  473.  
  474.  
  475.  
  476. </div>
  477. </div></font></div>
  478. <div style="border-bottom: 2px solid #fff;"></div>
  479.  
  480.  
  481. <div id="infobox">FAVES / FRIENDS</br>
  482. <font style="font-size: 10px;color:#fff"><div style="margin-top: 3px;color:#fff;font-size:14px;text-transform:uppercase">
  483.  
  484. <div id="link">
  485.  
  486. <a href="/">Link</a> -
  487. <a href="/">Link</a> -
  488. <a href="/">Link</a> -
  489. <a href="/">Link</a> -
  490. <a href="/">Link</a> -
  491. <a href="/">Link</a> -
  492. <a href="/">Link</a> -
  493. <a href="/">Link</a> -
  494. <a href="/">Link</a> -
  495. <a href="/">Link</a> -
  496.  
  497.  
  498.  
  499. </div>
  500. </div></font></div>
  501. <div style="border-bottom: 2px solid #fff;"></div>
  502.  
  503.  
  504. </p></article></div><div></div></section>
  505.  
  506.  
  507.  
  508.  
  509. </body></html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!