Advertisement
extasisthemes

Perfume (Navigation Page Version)

Jul 27th, 2016
359
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 7.09 KB | None | 0 0
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2.  
  3. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  4.  
  5. <!----- Perfume (Navigation Page Version) by extasisthemes ----->
  6.  
  7. <head>
  8.  
  9. <title>{Title}</title>
  10. <link rel="shortcut icon" href="{Favicon}">
  11. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  12.  
  13. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  14. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  15. <script>
  16. (function($){
  17. $(document).ready(function(){
  18. $("a[title]").style_my_tooltips({
  19. tip_follows_cursor:true,
  20. tip_delay_time:90,
  21. tip_fade_speed:600,
  22. attribute:"title"
  23. });
  24. });
  25. })(jQuery);
  26. </script>
  27.  
  28. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  29.  
  30. <script src="http://static.tumblr.com/twte3d7/H8Glm663z/masonry.js"></script>
  31.  
  32. <script type="text/javascript">
  33. $(window).load(function () {
  34. $('#bcontainer').masonry({
  35. itemSelector : ".box",
  36. },
  37. function() { $('#bcontainer').masonry({ appendedContent: $(this) }); }
  38. );
  39. });
  40. </script>
  41.  
  42. <style type="text/css">
  43.  
  44. @import url(https://fonts.googleapis.com/css?family=Source+Sans+Pro:400,700,400italic);
  45.  
  46. ::-webkit-scrollbar-thumb:vertical {
  47. background:#000000;
  48. height:50px;
  49. }
  50.  
  51. ::-webkit-scrollbar {
  52. height:10px;
  53. width:3px;
  54. }
  55.  
  56. #s-m-t-tooltip {
  57. background:#ffffff;
  58. border:1px solid #cfcfcf;
  59. color:#000000;
  60. font-family:'Source Sans Pro', sans-serif;
  61. font-size:10px;
  62. font-style:normal;
  63. font-weight:normal;
  64. letter-spacing:0px;
  65. margin-top:20px;
  66. padding:10px;
  67. text-align:center;
  68. text-decoration:none;
  69. text-transform:uppercase;
  70. z-index:999999999999999999999999999999999999;
  71. }
  72.  
  73. body {
  74. background:#f8f8f8;
  75. color:#000000;
  76. cursor:url(http://i.imgur.com/lhPqll6.png), progress;
  77. font-family:'Source Sans Pro', sans-serif;
  78. font-size:11px;
  79. font-style:normal;
  80. font-weight:normal;
  81. letter-spacing:0px;
  82. margin:0px;
  83. text-align:justify;
  84. text-decoration:none;
  85. text-transform:none;
  86. word-break:break-word;
  87. }
  88.  
  89. a {
  90. border-bottom:1px solid #6633bb;
  91. color:#000000;
  92. text-decoration:none;
  93. -webkit-transition: all 0.5s ease;
  94. -moz-transition: all 0.5s ease;
  95. -o-transition: all 0.5s ease;
  96. }
  97.  
  98. a:hover {
  99. color:#cfcfcf;
  100. }
  101.  
  102. blockquote {
  103. border-left:1px solid #000000;
  104. margin:5px;
  105. padding-left:5px;
  106. }
  107.  
  108. blockquote img {
  109. height:auto;
  110. max-width:200px;
  111. }
  112.  
  113. blockquote blockquote {
  114. border-left:1px solid #000000;
  115. padding-left:5px;
  116. }
  117.  
  118. ul {
  119. padding:10px;
  120. }
  121.  
  122. li {
  123. list-style:none;
  124. padding:2px 0px 1px 0px;
  125. }
  126.  
  127. li:before {
  128. color:#eeeeee;
  129. content:'–––––';
  130. letter-spacing:-3px;
  131. padding-right:10px;
  132. }
  133.  
  134. img {
  135. height:auto;
  136. max-width:100%;
  137. }
  138.  
  139. #header {
  140. background:#ffffff;
  141. border-bottom:1px solid #eeeeee;
  142. margin-top:-200px;
  143. padding-bottom:40px;
  144. padding-top:40px;
  145. position:fixed;
  146. width:100%;
  147. z-index:1;
  148. }
  149.  
  150. .title {
  151. border-bottom:1px solid #6633bb;
  152. display:inline-block;
  153. color:#000000;
  154. font-family:'Source Sans Pro', sans-serif;
  155. font-size:11px;
  156. font-style:normal;
  157. font-weight:700;
  158. letter-spacing:0px;
  159. margin-left:40px;
  160. text-decoration:none;
  161. text-align:left;
  162. text-transform:uppercase;
  163. }
  164.  
  165. .links {
  166. color:#777777;
  167. font-family:'Source Sans Pro', sans-serif;
  168. font-size:11px;
  169. font-style:normal;
  170. font-weight:normal;
  171. letter-spacing:0px;
  172. text-decoration:none;
  173. text-align:left;
  174. text-transform:uppercase;
  175. }
  176.  
  177. .links a {
  178. border-bottom:none;
  179. display:inline-block;
  180. color:#777777;
  181. margin-bottom:5px;
  182. margin-left:20px;
  183. }
  184.  
  185. .links a:hover {
  186. color:#cfcfcf;
  187. }
  188.  
  189. #bcontainer {
  190. margin-bottom:200px;
  191. margin-left:auto;
  192. margin-right:auto;
  193. margin-top:200px;
  194. width:810px;
  195. }
  196.  
  197. #box {
  198. float:left;
  199. width:250px;
  200. margin:10px;
  201. }
  202.  
  203. .box-title {
  204. background:#ffffff;
  205. border:1px solid #eeeeee;
  206. color:#000000;
  207. font-family:'Source Sans Pro', sans-serif;
  208. font-size:12px;
  209. font-style:normal;
  210. font-weight:700;
  211. letter-spacing:0px;
  212. padding:10px;
  213. text-decoration:none;
  214. text-align:left;
  215. text-transform:uppercase;
  216. }
  217.  
  218. .box-content {
  219. background:#ffffff;
  220. border-left:1px solid #eeeeee;
  221. border-right:1px solid #eeeeee;
  222. border-top:1px solid #eeeeee;
  223. color:#000000;
  224. font-family:'Source Sans Pro', sans-serif;
  225. font-size:12px;
  226. font-style:normal;
  227. font-weight:normal;
  228. letter-spacing:0px;
  229. margin-top:10px;
  230. text-decoration:none;
  231. text-align:justify;
  232. text-transform:none;
  233. }
  234.  
  235. .box-content a {
  236. border-bottom:1px solid #eeeeee;
  237. color:#000000;
  238. display:block;
  239. padding:10px;
  240. }
  241.  
  242. .box-content a:hover {
  243. color:#cfcfcf;
  244. }
  245.  
  246. #credit {
  247. background:#ffffff;
  248. border:1px solid #eeeeee;
  249. bottom:15px;
  250. color:#000000;
  251. float:right;
  252. font-family:'Open Sans', sans-serif;
  253. font-size:10px;
  254. font-style:normal;
  255. font-weight:normal;
  256. letter-spacing:0px;
  257. padding:5px;
  258. position:fixed;
  259. right:15px;
  260. text-align:justify;
  261. text-decoration:none;
  262. text-transform:uppercase;
  263. }
  264.  
  265. #credit a {
  266. border-bottom:none;
  267. color:#000000;
  268. }
  269.  
  270. #credit a:hover {
  271. color:#cfcfcf;
  272. }
  273.  
  274. {CustomCSS}</style></head><body>
  275.  
  276. <div id="header">
  277.  
  278. <div class="links">
  279. <div class="title">Perfume</div>
  280. <a href="/">Home</a>
  281. <a href="/ask">Ask</a>
  282. <a href="/">Link One</a>
  283. <a href="/">Link Two</a>
  284. <a href="/">Link Three</a>
  285. <a href="/archive">Archive</a>
  286. </div>
  287.  
  288. </div>
  289.  
  290. <div id="bcontainer">
  291.  
  292. <div id="box">
  293.  
  294. <div class="box-title">Category 1</div>
  295.  
  296. <div class="box-content">
  297. <a href="/">Link One</a>
  298. <a href="/">Link Two</a>
  299. <a href="/">Link Three</a>
  300. <a href="/">Link Four</a>
  301. <a href="/">Link Five</a>
  302. <a href="/">Link Six</a>
  303. <a href="/">Link Seven</a>
  304. </div>
  305.  
  306. </div>
  307.  
  308. <div id="box">
  309.  
  310. <div class="box-title">Category 2</div>
  311.  
  312. <div class="box-content">
  313. <a href="/">Link One</a>
  314. <a href="/">Link Two</a>
  315. <a href="/">Link Three</a>
  316. <a href="/">Link Four</a>
  317. <a href="/">Link Five</a>
  318. <a href="/">Link Six</a>
  319. <a href="/">Link Seven</a>
  320. </div>
  321.  
  322. </div>
  323.  
  324. <div id="box">
  325.  
  326. <div class="box-title">Category 3</div>
  327.  
  328. <div class="box-content">
  329. <a href="/">Link One</a>
  330. <a href="/">Link Two</a>
  331. <a href="/">Link Three</a>
  332. <a href="/">Link Four</a>
  333. <a href="/">Link Five</a>
  334. <a href="/">Link Six</a>
  335. <a href="/">Link Seven</a>
  336. </div>
  337.  
  338. </div>
  339.  
  340. <div id="box">
  341.  
  342. <div class="box-title">Category 4</div>
  343.  
  344. <div class="box-content">
  345. <a href="/">Link One</a>
  346. <a href="/">Link Two</a>
  347. <a href="/">Link Three</a>
  348. <a href="/">Link Four</a>
  349. <a href="/">Link Five</a>
  350. <a href="/">Link Six</a>
  351. <a href="/">Link Seven</a>
  352. </div>
  353.  
  354. </div>
  355.  
  356. <div id="box">
  357.  
  358. <div class="box-title">Category 5</div>
  359.  
  360. <div class="box-content">
  361. <a href="/">Link One</a>
  362. <a href="/">Link Two</a>
  363. <a href="/">Link Three</a>
  364. <a href="/">Link Four</a>
  365. <a href="/">Link Five</a>
  366. <a href="/">Link Six</a>
  367. <a href="/">Link Seven</a>
  368. </div>
  369.  
  370. </div>
  371.  
  372. <div id="box">
  373.  
  374. <div class="box-title">Category 6</div>
  375.  
  376. <div class="box-content">
  377. <a href="/">Link One</a>
  378. <a href="/">Link Two</a>
  379. <a href="/">Link Three</a>
  380. <a href="/">Link Four</a>
  381. <a href="/">Link Five</a>
  382. <a href="/">Link Six</a>
  383. <a href="/">Link Seven</a>
  384. </div>
  385.  
  386. </div>
  387.  
  388. </div>
  389.  
  390. <div id="credit">
  391. <a href="http://extasisthemes.tumblr.com/">ET</a>
  392. </div>
  393.  
  394. </body>
  395. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement